:root{
  --bg:#f5f4f0;
  --surface:#ffffff;
  --soft:#faf7ef;
  --soft-2:#f3efe4;
  --line:#e6dece;
  --line-strong:#d6c8b0;
  --text:#2c2519;
  --text-secondary:#594f3e;
  --muted:#766b58;
  --accent:#9b6a16;
  --accent-hover:#7d530e;
  --accent-soft:#fdf3e1;
  --accent-line:#d99a4e;
  --danger:#b93429;
  --danger-bg:#fcebe7;
  --ok:#2f6b39;
  --ok-bg:#eaf4e6;
  --blue:#2b6cb0;
  --blue-bg:#ebf4fa;
  --purple:#6b46c1;
  --purple-bg:#f3eefc;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif}
a{color:var(--accent)}
button,input,select{font:inherit}
button{cursor:pointer;border:1px solid var(--line-strong);background:var(--surface);color:var(--text);border-radius:999px;padding:6px 13px;font-size:13px;transition:background .15s,border-color .15s,color .15s,box-shadow .15s}
button:hover{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
button:disabled{opacity:.45;cursor:default;background:var(--surface);color:var(--muted)}
button.active{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600;box-shadow:0 2px 6px rgba(155,106,22,.18)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
[hidden]{display:none!important}

/* 顶栏与页头 */
.topbar{display:flex;align-items:center;gap:24px;padding:12px clamp(18px,2.2vw,36px);background:var(--surface);border-bottom:1px solid var(--line);font-size:13px}
.topbar a{text-decoration:none;font-weight:600}
.topbar span:last-child{margin-left:auto;color:var(--muted)}
main{max-width:1920px;width:100%;margin:0 auto;padding:20px clamp(18px,2.2vw,36px) 56px}
.title-row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.eyebrow{margin:0;color:var(--accent);font-size:12px;letter-spacing:.08em;font-weight:600}
h1{font-size:28px;line-height:1.3;margin:3px 0}
h2{font-size:17px;margin:0;line-height:1.35}
.intro{margin:3px 0 0;color:var(--muted);font-size:13px}
.refresh-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.auto-refresh{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);white-space:nowrap;padding:5px 10px;border-radius:999px;background:var(--surface);border:1px solid var(--line)}
.auto-refresh input{width:15px;height:15px;accent-color:var(--accent);margin:0}
#gate{padding:42px 20px;background:var(--surface);border:1px solid var(--line);border-radius:16px;text-align:center;color:var(--muted)}

/* 筛选面板：宽屏 7 项筛选项单行排布，底部操作条对齐 */
.filters{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px 12px;padding:14px 18px;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:0 1px 4px rgba(44,37,25,.03)}
.filters label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--muted);font-weight:500;min-width:0}
input,select{border:1px solid var(--line-strong);border-radius:10px;min-width:0;width:100%;padding:7px 10px;background:var(--soft);color:var(--text);font-size:13px;transition:border-color .15s,background .15s}
input:focus,select:focus{background:#fff;border-color:var(--accent);outline:none}
.filter-bar-bottom{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding-top:8px;border-top:1px dashed var(--line)}
.filter-actions,.presets{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.presets{justify-content:flex-end;margin-left:auto}
.preset-group{display:inline-flex;flex-wrap:wrap;gap:6px;align-items:center}
.step-btn{padding:6px 11px;font-size:12px;background:var(--soft)}
.primary{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600;padding:6px 18px}
.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:#fff}

/* 状态条与当前筛选标签 */
.status-strip{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:10px 0}
#message{margin:0;min-height:22px;color:var(--text-secondary);font-size:13px;font-weight:500}
#message.error{color:var(--danger);font-weight:600}
.active-filter-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.filter-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:999px;background:var(--accent-soft);border:1px solid var(--accent-line);color:var(--accent);font-size:12px;font-weight:600}
.filter-chip:hover{background:#fae5bc}
.filter-chip-clear{padding:3px 10px;border-radius:999px;background:#fff;border:1px solid var(--line-strong);color:var(--muted);font-size:12px}

/* 今日 vs 昨日 实时对比横幅 */
.today-yesterday-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}
.ty-card{display:flex;flex-direction:column;gap:8px;padding:14px 18px;border-radius:16px;background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--accent);box-shadow:0 1px 4px rgba(44,37,25,.03);cursor:pointer;text-align:left;transition:border-color .15s,box-shadow .15s,background .15s;min-width:0}
.ty-card.yesterday{border-left-color:var(--blue)}
.ty-card:hover{border-color:var(--accent-line);background:#fffdf9}
.ty-card.is-active{border:2px solid var(--accent);border-left-width:5px;background:linear-gradient(90deg,#fff9ec 0%,#ffffff 100%);box-shadow:0 4px 14px rgba(155,106,22,.11)}
.ty-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.ty-title-wrap{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ty-badge{padding:2px 9px;border-radius:999px;font-size:12px;font-weight:700;background:var(--accent);color:#fff}
.ty-card.yesterday .ty-badge{background:var(--blue)}
.ty-date{font-size:13px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums}
.ty-delta{font-size:11px;padding:1px 7px;border-radius:999px;background:var(--soft-2);color:var(--text-secondary);font-variant-numeric:tabular-nums}
.ty-delta.up{background:var(--ok-bg);color:var(--ok);font-weight:600}
.ty-action{font-size:12px;color:var(--accent);font-weight:600}
.ty-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding-top:6px;border-top:1px dashed var(--line)}
.ty-stat{min-width:0}
.ty-stat strong{display:block;font:700 20px/1.25 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--text)}
.ty-stat span{font-size:11px;color:var(--muted)}
.ty-users{display:flex;align-items:center;gap:5px;flex-wrap:wrap;font-size:11px;color:var(--muted)}
.ty-user-pill{padding:1px 7px;border-radius:999px;background:var(--soft);border:1px solid var(--line);color:var(--text-secondary);font-weight:600;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 顶部 6 张概览指标卡 */
.summary{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.metric{padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:16px;display:flex;flex-direction:column;gap:2px;box-shadow:0 1px 3px rgba(44,37,25,.03);min-width:0}
.metric span{font-size:12px;color:var(--muted);font-weight:500;order:1}
.metric strong{font:700 26px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;display:block;color:var(--text);order:2}
.metric small.metric-sub{display:block;font-size:11px;color:var(--muted);margin-top:3px;line-height:1.35;font-variant-numeric:tabular-nums;order:3}

/* 通用区块 */
section{margin-top:16px;padding:18px 20px;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:0 1px 4px rgba(44,37,25,.03)}
.section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.section-heading span,.section-sub-hint{font-size:12px;color:var(--muted);display:block;margin-top:2px}

/* 访问用户列表与活跃画像（核心升级区） */
.users-section{border-top:3px solid var(--accent)}
.users-controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.user-search-input{width:240px;max-width:100%;border-radius:999px;padding:6px 12px;background:var(--soft)}
.user-sort-select{width:auto;border-radius:999px;padding:6px 12px;background:var(--soft);font-size:12px}
.user-filter-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.u-tab-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:999px;font-size:12px;background:var(--soft);border:1px solid var(--line);color:var(--text-secondary)}
.u-tab-btn b{font-variant-numeric:tabular-nums;color:var(--text)}
.u-tab-btn.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);font-weight:600}
.u-tab-btn.active b{color:var(--accent)}

/* 用户速览卡片网格（直观展示活跃用户） */
.user-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-bottom:14px}
.u-card{display:flex;flex-direction:column;gap:6px;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--soft);text-align:left;cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s;min-width:0}
.u-card:hover{border-color:var(--accent-line);background:#fff}
.u-card.is-filtered{border:2px solid var(--accent);background:var(--accent-soft);box-shadow:0 2px 8px rgba(155,106,22,.12)}
.u-card-top{display:flex;align-items:center;gap:8px;min-width:0}
.u-avatar{width:28px;height:28px;border-radius:50%;background:var(--accent);color:#fff;font-weight:700;font-size:13px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;text-transform:uppercase}
.u-avatar.role-admin{background:#8c5408}
.u-avatar.role-maintainer{background:var(--blue)}
.u-card-name{font-weight:700;font-size:14px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.u-card-badges{display:flex;gap:4px;margin-left:auto;flex-shrink:0;align-items:center}
.u-card-metrics{display:flex;justify-content:space-between;gap:6px;font-size:12px;color:var(--text-secondary);font-variant-numeric:tabular-nums;padding-top:4px;border-top:1px dashed var(--line)}
.u-card-metrics strong{color:var(--text);font-family:ui-monospace,monospace}
.u-card-foot{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:11px;color:var(--muted)}
.u-card-foot span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 角色与状态徽章 */
.role-tag{font-size:10px;padding:1px 6px;border-radius:999px;font-weight:600;border:1px solid var(--line);background:#fff;color:var(--muted);white-space:nowrap}
.role-tag.role-admin{background:#fef0d6;border-color:#e6c280;color:#8c5408}
.role-tag.role-maintainer{background:var(--blue-bg);border-color:#b8d4ec;color:var(--blue)}
.online-pill{display:inline-flex;align-items:center;gap:4px;font-size:10px;padding:1px 7px;border-radius:999px;background:var(--ok-bg);color:var(--ok);font-weight:600;white-space:nowrap}
.online-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ok)}
.filtered-pill{font-size:10px;padding:1px 7px;border-radius:999px;background:var(--accent);color:#fff;font-weight:600}

/* 今日/昨日胶囊、模块胶囊、IP 胶囊 */
.ty-cell-stack{display:flex;flex-direction:column;gap:3px}
.day-pill{display:inline-flex;align-items:center;gap:4px;font-size:11px;padding:1px 7px;border-radius:6px;background:var(--soft);color:var(--muted);width:fit-content;font-variant-numeric:tabular-nums}
.day-pill.today-on{background:var(--ok-bg);color:var(--ok);font-weight:600}
.day-pill.yest-on{background:var(--blue-bg);color:var(--blue);font-weight:600}
.req-bar{width:100%;max-width:110px;height:5px;background:#ece5d5;border-radius:999px;overflow:hidden;margin:4px 0 2px}
.req-bar i{display:block;height:100%;background:var(--accent);border-radius:999px}
.mod-tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:4px}
.mod-tag{font-size:11px;padding:1px 7px;border-radius:6px;background:var(--soft-2);color:var(--text-secondary)}
.mod-tag.mod-map{background:#fdf3e1;color:#8c5408}
.mod-tag.mod-guide{background:var(--blue-bg);color:var(--blue)}
.mod-tag.mod-admin{background:var(--purple-bg);color:var(--purple)}
.mod-tag.mod-auth{background:var(--ok-bg);color:var(--ok)}
.ip-chip-list{display:flex;gap:4px;flex-wrap:wrap}
.ip-chip{padding:1px 7px;border-radius:6px;border:1px solid var(--line-strong);background:var(--soft);font:11px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--text);cursor:pointer}
.ip-chip:hover{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.rel-time{display:inline-block;padding:1px 7px;border-radius:6px;font-size:11px;font-weight:600;background:var(--soft-2);color:var(--text-secondary);margin-bottom:2px}
.rel-time.hot{background:var(--ok-bg);color:var(--ok)}
.rel-time.warm{background:var(--accent-soft);color:var(--accent)}
.user-action-btn{padding:3px 10px;font-size:11px;border-radius:999px;background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent);font-weight:600}
.user-action-btn.ghost{background:#fff;border-color:var(--line-strong);color:var(--text-secondary);margin-left:4px}
tr.is-active-row{background:#fff8eb!important}

/* 每日趋势与 24 小时分布（宽屏双列并排） */
.charts-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px;align-items:stretch}
.charts-grid>section{margin-top:16px;display:flex;flex-direction:column;justify-content:space-between}
.daily-chart{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 6px}
.day{min-width:92px;flex:1;border:1px solid var(--line);border-radius:12px;padding:9px 10px;background:var(--soft);text-align:left;transition:border-color .15s,background .15s,box-shadow .15s}
.day:hover{border-color:var(--accent-line);background:#fff}
.day.is-selected{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 1.5px var(--accent)}
.day.is-today{border-color:#9fc49a}
.day-head{display:flex;justify-content:space-between;align-items:center;gap:4px;font-size:11px;color:var(--muted)}
.day-tag{font-size:10px;padding:0 5px;border-radius:4px;font-weight:700;background:var(--soft-2);color:var(--text-secondary)}
.day-tag.today{background:var(--ok-bg);color:var(--ok)}
.day-tag.yesterday{background:var(--blue-bg);color:var(--blue)}
.day small{display:block;color:var(--muted);white-space:nowrap;font-size:11px}
.day .bar-track{height:52px;display:flex;align-items:flex-end;margin:7px 0;background:#ede7d9;border-radius:6px;padding:2px;overflow:hidden}
.day .bar{width:100%;background:var(--blue);min-height:2px;border-radius:4px}
.day.is-today .bar{background:var(--ok)}
.day.is-selected .bar{background:var(--accent)}
.day strong{font-family:ui-monospace,monospace;font-size:17px;color:var(--text)}
.day .logins{color:var(--accent);font-weight:500}

.hour-chart{display:flex;align-items:flex-end;gap:5px;height:128px;padding-top:16px;margin-top:auto}
.hour{flex:1;min-width:0;text-align:center;font:10px/1.4 ui-monospace,monospace;color:var(--muted);display:flex;flex-direction:column;justify-content:flex-end;height:100%}
.hour em{font-style:normal;font-size:9px;color:var(--text-secondary);margin-bottom:2px;overflow:hidden;text-overflow:ellipsis}
.hour i{display:block;background:var(--accent);opacity:.72;min-height:2px;margin-bottom:5px;border-radius:3px 3px 0 0}
.hour.is-peak i{opacity:1;background:#b85d10}
.hour.is-peak{color:var(--text);font-weight:700}

/* 表格通用 */
.table-scroll{overflow-x:auto;max-width:100%}
table{width:100%;border-collapse:collapse;white-space:nowrap}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:11px;color:var(--muted);font-weight:600;background:var(--soft)}
td{font-size:12px}
tbody tr:hover{background:#fcfaf5}
td small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.link-button{border:0;padding:0;border-radius:0;color:var(--accent);background:none;text-align:left;font-weight:600}
.link-button:hover{background:none;text-decoration:underline}
.user-cell-top{display:flex;align-items:center;gap:7px}
.empty{padding:24px;text-align:center;color:var(--muted)}
.badge{display:inline-block;background:var(--soft-2);padding:2px 7px;border-radius:6px;font-weight:600;font-size:11px}
.badge.ok{color:var(--ok);background:var(--ok-bg)}
.bad{color:var(--danger);background:var(--danger-bg)}
.method-badge{display:inline-block;padding:1px 6px;border-radius:4px;font:600 10px/1.3 ui-monospace,monospace;background:var(--soft-2);color:var(--text-secondary);margin-right:4px}
.method-badge.POST,.method-badge.PUT,.method-badge.DELETE{background:var(--accent-soft);color:var(--accent)}
.path,.agent{max-width:380px;overflow:hidden;text-overflow:ellipsis}
.pagination{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:16px}
.notes{font-size:12px;color:var(--muted);margin:14px 0 0}

/* 地图与访问身份模块（保留全部既有行为与选择器） */
#geoSection{overflow:hidden}
.geo-subtitle,.geo-caption{color:var(--muted);font-size:12px;line-height:1.6}
.geo-subtitle{display:block;margin-top:3px}
.geo-caption{margin:8px 0}
.geo-metrics{display:flex;gap:4px;padding:4px;border-radius:999px;background:var(--soft);border:1px solid var(--line);flex-shrink:0}
.geo-metrics button{border-color:transparent;padding:5px 11px;font-size:12px;background:transparent}
.geo-metrics button[aria-pressed="true"]{background:#fff;box-shadow:0 1px 5px #8c713b18;border-color:#decaa4;color:var(--accent);font-weight:600}
.geo-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);gap:20px}
.geo-map-column,.geo-role-column{min-width:0}
#geoMap{height:380px;min-height:260px;width:100%;background:#f7fafb;border:1px solid var(--line);border-radius:12px;isolation:isolate;z-index:0}
.leaflet-container{font:12px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif}
.leaflet-container .leaflet-control-attribution{font-size:9px;color:var(--muted);background:#ffffffd9}
.leaflet-container .leaflet-control-zoom{border-color:var(--line)}
.leaflet-interactive:focus{outline:3px solid var(--accent);outline-offset:3px}
.geo-role-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}
.geo-role-heading h3{font-size:14px;margin:0}
.geo-role-heading>span{color:var(--muted);font-size:12px}
.geo-ip-list{height:340px;overflow:auto;padding-right:4px;overscroll-behavior:contain}
.geo-role{display:block;width:100%;max-width:100%;border:1px solid transparent;border-bottom-color:var(--line);border-radius:10px;text-align:left;padding:10px;background:white;margin:0 0 3px}
.geo-role:hover,.geo-role.selected{border-color:var(--ip-color);background:#faf9f5}
.geo-role-top{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.geo-role-top strong{font-size:12px;overflow-wrap:anywhere;min-width:0}
.geo-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--ip-color);flex-shrink:0}
.geo-count{font-size:11px;color:var(--muted);margin-left:auto;white-space:nowrap}
.geo-role-users,.geo-role-location,.geo-role-last{display:block;margin:2px 0 0 16px;font-size:11px;overflow-wrap:anywhere}
.geo-role-users{color:var(--text)}
.geo-role-location,.geo-role-last{color:var(--muted)}
.geo-role-last b{color:#467747;font-weight:500}
.geo-source{display:flex;align-items:center;gap:12px;margin-top:15px;padding-top:12px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.geo-source button{font-size:11px;flex-shrink:0;padding:4px 10px}
.geo-popup{min-width:170px;max-width:230px;overflow-wrap:anywhere}
.geo-popup strong{font-size:12px}
.geo-popup-ip{display:block;width:100%;margin-top:6px;text-align:left;border-left:4px solid;border-radius:8px;font-size:11px;overflow-wrap:anywhere;white-space:normal;padding:6px}
.geo-detail{padding:18px;margin-top:14px;border:1px solid var(--line);border-radius:12px;background:#fffdf8;min-width:0;overflow-wrap:anywhere}
.geo-detail-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}
.geo-detail-heading h3{margin:0;display:flex;align-items:center;gap:8px;font-size:19px}
.geo-detail-heading .mono{overflow-wrap:anywhere;min-width:0}
.geo-detail-heading p{margin:4px 0;font-size:12px}
.geo-detail-heading button{font-size:12px;flex-shrink:0}
.geo-detail-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0;margin:14px 0}
.geo-detail-metrics strong{display:block;font:600 21px/1.5 ui-monospace,monospace}
.geo-detail-metrics span{font-size:11px;color:var(--muted)}
.geo-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}
.geo-detail h4{font-size:12px;margin:12px 0 10px}
.geo-detail h4 small{color:var(--muted);font-size:10px;font-weight:400}
.geo-detail-meta p{font-size:11px;color:var(--muted);margin:8px 0}
.geo-hours{height:85px}
.geo-recent-events{max-height:240px;overflow:auto}
.geo-event{display:grid;grid-template-columns:155px 150px minmax(0,1fr) minmax(0,1.4fr);gap:12px;border-bottom:1px solid var(--line);padding:8px 0;font-size:11px;align-items:start}
.geo-event span{overflow-wrap:anywhere;min-width:0}
.geo-event time{color:var(--muted)}
.error{color:var(--danger)}

/* 响应式适配：保证 1440 / 1024 / 667 / 390 / 320 宽度均无横向溢出 */
@media(max-width:1100px){
  .title-row{align-items:flex-start}
  .refresh-actions{max-width:420px}
  .filters{grid-template-columns:repeat(3,minmax(0,1fr))}
  .summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .charts-grid{grid-template-columns:minmax(0,1fr);gap:0}
  .geo-layout{grid-template-columns:minmax(0,1.3fr) minmax(280px,1fr)}
  .geo-event{grid-template-columns:145px 130px minmax(0,1fr)}
  .geo-event span:last-child{grid-column:2/-1}
}
@media(max-width:768px){
  .today-yesterday-grid{grid-template-columns:minmax(0,1fr)}
  .ty-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .geo-layout{grid-template-columns:minmax(0,1fr);gap:12px}
  #geoMap{height:300px}
  .geo-ip-list{height:auto;max-height:320px}
  .geo-detail{padding:12px}
  .geo-detail-heading{align-items:flex-start;flex-direction:column;gap:8px}
  .geo-detail-grid{grid-template-columns:minmax(0,1fr);gap:6px}
  .geo-detail-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .geo-detail-metrics strong{font-size:18px}
  .geo-event{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px 10px}
  .geo-event span:last-child{grid-column:1/-1}
  .geo-source{align-items:flex-start}
  .geo-metrics{flex-shrink:1}
  .refresh-actions{max-width:none;justify-content:flex-start}
}
@media(max-width:600px){
  main{padding:16px 10px 36px}
  .topbar{padding:10px 12px;gap:10px;font-size:12px}
  .topbar>span:nth-child(2){display:none}
  .title-row{align-items:flex-start;flex-direction:column}
  h1{font-size:24px}
  .filters{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px;gap:8px}
  .filter-actions,.presets{grid-column:1/-1;justify-content:flex-start}
  .preset-group{width:100%}
  .summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .metric{padding:11px 12px}
  .metric strong{font-size:21px}
  section{padding:12px}
  .section-heading{align-items:flex-start;flex-direction:column;gap:4px}
  .users-controls{width:100%}
  .user-search-input,.user-sort-select{width:100%}
  .user-cards-grid{grid-template-columns:minmax(0,1fr)}
  .hour-chart{gap:2px}
  .hour:nth-child(even){font-size:0}
  .hour em{display:none}
  .hour i{font-size:10px}
  .intro{font-size:12px}
  .path,.agent{max-width:180px}
  .geo-metrics button{padding:5px 9px}
  .geo-metrics{margin-top:6px;flex-wrap:wrap}
  .geo-source{flex-wrap:wrap}
  .geo-detail-heading h3{font-size:16px}
  .geo-role{padding:9px 7px}
  .geo-count{font-size:10px}
  .geo-role-top strong{font-size:11px}
  .geo-detail-meta h4{margin-top:4px}
  .geo-detail-metrics{column-gap:8px}
  .refresh-actions button{font-size:12px;padding:6px 10px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}