:root{--c-primary: #4f46e5;--c-primary-hover: #4338ca;--c-primary-bg: #eef2ff;--c-primary-border: #c7d2fe;--c-text: #18181b;--c-muted: #5c5c66;--c-faint: #9ca3af;--c-border: #e4e4e7;--c-border-strong: #d4d4d8;--c-surface: #fafafa;--c-card: #ffffff;--c-bg: #f4f4f5;--c-ok: #16a34a;--c-ok-bg: #f0fdf4;--c-ok-border: #bbf7d0;--c-warn: #d97706;--c-warn-strong: #b45309;--c-warn-bg: #fffbeb;--c-warn-border: #fde68a;--c-danger: #dc2626;--c-danger-bg: #fef2f2;--c-danger-border: #fecaca;--c-info: #4f46e5;--c-info-bg: #eef2ff;--c-info-border: #c7d2fe;--font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-display: "Instrument Serif", Georgia, "Times New Roman", serif;--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--fs-xs: 11px;--fs-sm: 12px;--fs-base: 14px;--fs-md: 16px;--fs-lg: 18px;--fs-xl: 22px;--fs-2xl: 28px;--fs-3xl: 34px;--lh-tight: 1.2;--lh-base: 1.5;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-7: 28px;--sp-8: 32px;--r-sm: 4px;--r-md: 6px;--r-lg: 10px;--r-xl: 14px;--r-pill: 999px;--shadow-xs: 0 1px 2px rgba(24, 24, 27, .04);--shadow-sm: 0 1px 3px rgba(24, 24, 27, .06), 0 1px 2px rgba(24, 24, 27, .04);--shadow-md: 0 4px 10px rgba(24, 24, 27, .07), 0 1px 3px rgba(24, 24, 27, .05);--shadow-lg: 0 10px 24px rgba(24, 24, 27, .1), 0 3px 8px rgba(24, 24, 27, .06);--sidebar-w: 240px;--topbar-h: 60px;--content-max: 1280px}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%}body{font-family:var(--font-body);font-size:var(--fs-base);line-height:var(--lh-base);color:var(--c-text);background:var(--c-bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}#app{height:100%}h1,h2,h3,h4{margin:0;font-weight:600;line-height:var(--lh-tight)}a{color:var(--c-primary);text-decoration:none}a:hover{text-decoration:underline}button{font-family:inherit;font-size:inherit;cursor:pointer}input,select{font-family:inherit;font-size:inherit}.tnum{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);border-radius:var(--r-md);border:1px solid var(--c-border-strong);background:var(--c-card);color:var(--c-text);font-size:var(--fs-base);font-weight:500;transition:background .12s ease,border-color .12s ease,opacity .12s ease}.btn:hover{background:var(--c-surface)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--c-primary);border-color:var(--c-primary);color:#fff}.btn-primary:hover{background:var(--c-primary-hover)}.btn-danger{background:var(--c-danger);border-color:var(--c-danger);color:#fff}.btn-ghost{border-color:transparent;background:transparent}.btn-ghost:hover{background:var(--c-surface)}.btn-sm{padding:var(--sp-1) var(--sp-3);font-size:var(--fs-sm)}.field{display:block;width:100%;padding:var(--sp-2) var(--sp-3);border:1px solid var(--c-border-strong);border-radius:var(--r-md);background:var(--c-card);color:var(--c-text)}.field:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px var(--c-primary-bg)}.label{display:block;font-size:var(--fs-sm);font-weight:500;color:var(--c-muted);margin-bottom:var(--sp-1)}.shell{display:grid;grid-template-columns:var(--sidebar-w) 1fr;height:100%}.sidebar{background:var(--c-card);border-right:1px solid var(--c-border);display:flex;flex-direction:column;padding:var(--sp-5) var(--sp-3)}.brand{display:flex;align-items:center;gap:var(--sp-3);padding:0 var(--sp-2) var(--sp-5)}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:var(--r-lg);background:var(--c-primary);color:#fff;font-family:var(--font-display);font-size:var(--fs-lg)}.brand-name{font-weight:600;font-size:var(--fs-md)}.brand-sub{font-size:var(--fs-xs);color:var(--c-muted);text-transform:uppercase;letter-spacing:.06em}.nav{display:flex;flex-direction:column;gap:2px}.nav-item{display:block;padding:var(--sp-2) var(--sp-3);border-radius:var(--r-md);color:var(--c-muted);font-weight:500;border-left:3px solid transparent}.nav-item:hover{background:var(--c-surface);text-decoration:none;color:var(--c-text)}.nav-item.is-active{background:var(--c-primary-bg);color:var(--c-primary);border-left-color:var(--c-primary)}.sidebar-foot{margin-top:auto;padding:var(--sp-3) var(--sp-2) 0;font-size:var(--fs-xs);color:var(--c-faint)}.main{display:flex;flex-direction:column;min-width:0;height:100%}.topbar{height:var(--topbar-h);flex:0 0 var(--topbar-h);display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);padding:0 var(--sp-6);border-bottom:1px solid var(--c-border);background:var(--c-card)}.topbar-title{display:flex;align-items:baseline;gap:var(--sp-3);min-width:0}.topbar-title h1{font-family:var(--font-display);font-size:var(--fs-xl);font-weight:400}.topbar-sub{font-size:var(--fs-sm);color:var(--c-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-right{display:flex;align-items:center;gap:var(--sp-5)}.range-selector{display:inline-flex;border:1px solid var(--c-border-strong);border-radius:var(--r-md);overflow:hidden}.range-btn{padding:var(--sp-1) var(--sp-3);border:none;background:var(--c-card);color:var(--c-muted);font-size:var(--fs-sm);font-weight:500;border-right:1px solid var(--c-border)}.range-btn:last-child{border-right:none}.range-btn.is-active{background:var(--c-primary);color:#fff}.identity{display:flex;align-items:center;gap:var(--sp-2)}.avatar{display:grid;place-items:center;width:28px;height:28px;border-radius:var(--r-pill);background:var(--c-primary-bg);color:var(--c-primary);font-weight:600;font-size:var(--fs-sm)}.identity-email{font-size:var(--fs-sm);color:var(--c-muted);max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.content{flex:1 1 auto;overflow-y:auto;padding:var(--sp-6)}.content>*{max-width:var(--content-max);margin:0 auto}.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-5)}.section-head h2{font-family:var(--font-display);font-weight:400;font-size:var(--fs-2xl)}.section-head .sub{font-size:var(--fs-sm);color:var(--c-muted)}.metric-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:var(--sp-4);margin-bottom:var(--sp-6)}.metric-card{background:var(--c-card);border:1px solid var(--c-border);border-radius:var(--r-lg);padding:var(--sp-4) var(--sp-5);box-shadow:var(--shadow-xs)}.metric-label{font-size:var(--fs-sm);color:var(--c-muted);margin-bottom:var(--sp-2)}.metric-value{font-family:var(--font-display);font-size:var(--fs-2xl);line-height:1;font-variant-numeric:tabular-nums}.metric-sub{margin-top:var(--sp-2);font-size:var(--fs-xs);color:var(--c-faint)}.metric-card.tone-ok .metric-value{color:var(--c-ok)}.metric-card.tone-warn .metric-value{color:var(--c-warn-strong)}.metric-card.tone-danger .metric-value{color:var(--c-danger)}.panel{background:var(--c-card);border:1px solid var(--c-border);border-radius:var(--r-lg);box-shadow:var(--shadow-xs);margin-bottom:var(--sp-5)}.panel-head{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--c-border)}.panel-title{font-size:var(--fs-md)}.panel-count{font-size:var(--fs-sm);color:var(--c-muted);background:var(--c-surface);padding:1px var(--sp-2);border-radius:var(--r-pill)}.panel-actions{margin-left:auto;display:flex;gap:var(--sp-2)}.panel-body{padding:var(--sp-5)}.bar-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-3)}.bar-row{display:grid;grid-template-columns:minmax(80px,1.4fr) 3fr auto;align-items:center;gap:var(--sp-3)}.bar-label{font-size:var(--fs-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar-track{height:8px;background:var(--c-surface);border-radius:var(--r-pill);overflow:hidden}.bar-fill{display:block;height:100%;background:var(--c-primary);border-radius:var(--r-pill)}.bar-value{font-size:var(--fs-sm);color:var(--c-muted)}.badge{display:inline-flex;align-items:center;padding:1px var(--sp-2);border-radius:var(--r-pill);font-size:var(--fs-xs);font-weight:600;border:1px solid var(--c-border);background:var(--c-surface);color:var(--c-muted)}.badge-ok{background:var(--c-ok-bg);border-color:var(--c-ok-border);color:var(--c-ok)}.badge-warn{background:var(--c-warn-bg);border-color:var(--c-warn-border);color:var(--c-warn-strong)}.badge-danger{background:var(--c-danger-bg);border-color:var(--c-danger-border);color:var(--c-danger)}.badge-info{background:var(--c-info-bg);border-color:var(--c-info-border);color:var(--c-info)}.table{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}.table th{text-align:left;font-weight:600;color:var(--c-muted);padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--c-border);white-space:nowrap}.table td{padding:var(--sp-3);border-bottom:1px solid var(--c-border)}.table tbody tr:hover{background:var(--c-surface)}.table .num{text-align:right;font-family:var(--font-mono);font-variant-numeric:tabular-nums}.table-scroll{overflow-x:auto}.chart-wrap{width:100%}.chart{width:100%;height:auto;display:block}.chart-grid{stroke:var(--c-border);stroke-width:1}.chart-axis-label{fill:var(--c-faint);font-size:10px;font-family:var(--font-mono)}.chart-bar{fill:var(--c-primary)}.chart-legend{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-3);font-size:var(--fs-xs);color:var(--c-muted)}.chart-legend .swatch{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:var(--sp-1);vertical-align:middle}.state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-3);padding:var(--sp-8);text-align:center;color:var(--c-muted)}.state-title{font-weight:600;color:var(--c-text)}.state-hint{font-size:var(--fs-sm);color:var(--c-muted)}.state-code{font-size:var(--fs-xs);color:var(--c-faint)}.state-label{font-size:var(--fs-sm)}.spinner{width:22px;height:22px;border:2px solid var(--c-border-strong);border-top-color:var(--c-primary);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-banner{background:var(--c-danger-bg);border:1px solid var(--c-danger-border);color:var(--c-danger);border-radius:var(--r-md);padding:var(--sp-2) var(--sp-3);font-size:var(--fs-sm);margin-top:var(--sp-3)}.modal-overlay{position:fixed;inset:0;background:#18181b59;display:grid;place-items:center;z-index:100;padding:var(--sp-4)}.modal{background:var(--c-card);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);padding:var(--sp-6);width:min(440px,100%)}.modal-title{font-size:var(--fs-lg);margin-bottom:var(--sp-3)}.modal-body{font-size:var(--fs-base);color:var(--c-muted);margin-bottom:var(--sp-5)}.modal-actions{display:flex;justify-content:flex-end;gap:var(--sp-2)}.login-wrap{height:100%;display:grid;place-items:center;background:var(--c-bg);padding:var(--sp-4)}.login-card{width:min(380px,100%);background:var(--c-card);border:1px solid var(--c-border);border-radius:var(--r-xl);box-shadow:var(--shadow-md);padding:var(--sp-7)}.brand-login{padding:0 0 var(--sp-5)}.login-hint{font-size:var(--fs-sm);color:var(--c-muted);margin:0 0 var(--sp-3)}.login-submit{width:100%;margin-top:var(--sp-4)}.field-note{font-size:var(--fs-xs);color:var(--c-warn-strong);margin-top:var(--sp-1)}.login-foot{margin:var(--sp-5) 0 0;font-size:var(--fs-xs);color:var(--c-faint);text-align:center}@media (max-width: 720px){.shell{grid-template-columns:1fr}.sidebar{flex-direction:row;align-items:center;height:auto;padding:var(--sp-2) var(--sp-3);overflow-x:auto}.brand{padding:0 var(--sp-3) 0 0}.nav{flex-direction:row}.nav-item{border-left:none;border-bottom:3px solid transparent;white-space:nowrap}.nav-item.is-active{border-left:none;border-bottom-color:var(--c-primary)}.sidebar-foot{display:none}.topbar{flex-wrap:wrap;height:auto;padding:var(--sp-3) var(--sp-4)}.identity-email{display:none}}