@import "https://fonts.googleapis.com/css2?family=Afacad:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;600;700&display=swap";:root{--font-body:"Afacad", "Noto Sans SC", "Microsoft YaHei", sans-serif;--font-code:"Cascadia Code", "SFMono-Regular", Consolas, monospace;--space-2xs:4px;--space-xs:8px;--space-sm:12px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:64px;--radius-xs:4px;--radius-sm:6px;--radius-md:8px;--radius-lg:8px;--radius-xl:16px;--surface-canvas:oklch(98.8% .004 248);--surface-sidebar:oklch(96.6% .006 248);--surface-raised:oklch(99.5% .002 248);--surface-quiet:oklch(95.2% .007 248);--code-surface:oklch(94.5% .008 248);--line-soft:oklch(89.5% .008 248);--text-strong:oklch(19% .018 248);--text-body:oklch(39% .018 248);--text-muted:oklch(54% .017 248);--text-faint:oklch(68% .013 248);--ink-accent:oklch(52% .115 218);--ok-ink:oklch(39% .09 164);--ok-soft:oklch(92.5% .05 164);--warn-soft:oklch(91.5% .06 82);--danger-ink:oklch(45% .12 24);--danger-soft:oklch(93% .045 24);--shadow-hairline:0 1px 0 oklch(100% 0 0/.78) inset;--shadow-float:0 18px 54px oklch(50% .02 248/.08), 0 1px 0 oklch(100% 0 0/.72) inset;color:var(--text-body);background:var(--surface-canvas);font-family:var(--font-body);letter-spacing:0;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;font-weight:400;line-height:1.5}*{box-sizing:border-box}html{background:var(--surface-canvas);scroll-behavior:smooth;overflow-x:hidden}body{min-block-size:100svh;min-inline-size:320px;margin:0;overflow-x:hidden}body,button,input,select,textarea{font-family:var(--font-body);letter-spacing:0}button,input,select{-webkit-tap-highlight-color:transparent}svg{display:block}#root{min-block-size:100svh;overflow-x:hidden}::selection{color:var(--surface-raised);background:color-mix(in oklch, var(--ink-accent) 78%, var(--text-strong))}.app-shell{background:var(--surface-canvas);grid-template-columns:272px minmax(0,1fr);min-block-size:100svh;display:grid;overflow-x:hidden}.sidebar{gap:var(--space-xl);block-size:100svh;min-inline-size:0;padding:var(--space-xl) var(--space-lg);background:var(--surface-sidebar);border-inline-end:1px solid var(--line-soft);flex-direction:column;display:flex;position:sticky;inset-block-start:0}.brand-row,.mobile-brand,.quiet-row,.node-main,.panel-header,.header-actions,.inline-actions,.validation-status,.audit-ribbon,.audit-ribbon div{align-items:center;display:flex}.brand-row{gap:var(--space-md)}.brand-row div:last-child{gap:2px;display:grid}.brand-row strong,.mobile-brand span{color:var(--text-strong);font-size:.94rem;font-weight:650}.brand-row span{color:var(--text-muted);font-size:.74rem}.brand-mark{border-radius:var(--radius-md);block-size:36px;inline-size:36px;color:var(--ink-accent);background:var(--surface-quiet);border:1px solid var(--line-soft);place-items:center;display:grid}.brand-mark.large{block-size:48px;inline-size:48px;margin-inline:auto}.nav-list{gap:var(--space-xs);scrollbar-width:none;min-inline-size:0;max-inline-size:100%;display:grid}.nav-list::-webkit-scrollbar{display:none}.nav-item{align-items:center;gap:var(--space-sm);min-block-size:42px;padding:0 var(--space-md);border-radius:var(--radius-md);color:var(--text-muted);font-size:.9rem;font-weight:520;font:inherit;cursor:pointer;background:0 0;border:0;text-decoration:none;transition:color .18s,background-color .18s,transform .18s;display:flex}.nav-item:hover,.nav-item:focus-visible{color:var(--text-strong);background:color-mix(in oklch, var(--surface-raised) 82%, var(--ink-accent) 18%)}.nav-item.active{color:var(--text-strong);background:var(--surface-raised);box-shadow:var(--shadow-hairline)}.nav-item svg,.quiet-row svg{block-size:18px;inline-size:18px}.space-switch{gap:var(--space-2xs);padding:var(--space-2xs);border-radius:var(--radius-md);background:var(--surface-quiet);border:1px solid var(--line-soft);grid-template-columns:1fr 1fr;display:grid}.space-switch button{border-radius:var(--radius-sm);min-block-size:34px;color:var(--text-muted);font:inherit;cursor:pointer;background:0 0;border:0;font-size:.82rem;font-weight:650}.space-switch button.active{color:var(--text-strong);background:var(--surface-raised);box-shadow:var(--shadow-hairline)}.sidebar-footer{justify-content:space-between;align-items:center;gap:var(--space-sm);margin-block-start:auto;display:flex}.quiet-row{gap:var(--space-xs);min-inline-size:0;color:var(--text-muted);font-size:.78rem}.workspace{min-inline-size:0;max-inline-size:100%;padding:var(--space-xl) clamp(var(--space-lg), 4vw, var(--space-3xl)) var(--space-2xl);overflow-x:hidden}[data-section]{scroll-margin-block-start:var(--space-xl)}.topbar{min-block-size:44px;justify-content:space-between;align-items:center;gap:var(--space-lg);margin-block-end:var(--space-xl);display:flex}.topbar-copy{gap:var(--space-xs);min-inline-size:0;display:grid}.topbar-copy h1{color:var(--text-strong);margin:0;font-size:1.86rem;font-weight:680;line-height:1.12}.topbar-copy span{color:var(--text-muted);font-size:.88rem}.topbar-status{justify-content:flex-end;align-items:center;gap:var(--space-xs);min-inline-size:0;display:flex}.topbar-status>span{max-inline-size:240px;color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:.82rem;overflow:hidden}.announcement-anchor,.topbar-action-anchor{display:inline-grid;position:relative}.topbar-popover{z-index:10;inline-size:min(340px, calc(100vw - var(--space-xl)));gap:var(--space-xs);padding:var(--space-md);border-radius:var(--radius-lg);color:var(--text-body);background:var(--surface-raised);border:1px solid var(--line-soft);box-shadow:var(--shadow-float);display:grid;position:absolute;inset-block-start:calc(100% + var(--space-xs));inset-inline-end:0}.reset-popover{inline-size:min(380px, calc(100vw - var(--space-xl)))}.topbar-popover strong{color:var(--text-strong)}.topbar-popover span{color:var(--text-muted);font-size:.84rem;line-height:1.6}.popover-actions{justify-content:flex-end;gap:var(--space-xs);margin-block-start:var(--space-xs);display:flex}.mobile-brand{gap:var(--space-sm);display:none}.topbar-actions{gap:var(--space-xs);display:flex}.eyebrow{color:var(--text-faint);text-transform:uppercase;margin:0;font-size:.74rem;font-weight:700}.login-copy h1{color:var(--text-strong);margin:0;font-size:2.6rem;font-weight:680;line-height:1.08}.login-form input,.rule-list input,.rule-list select,.form-stack input,.form-stack select,.form-inline input,.form-inline select{inline-size:100%;color:var(--text-strong);font:inherit;background:0 0;border:0;outline:0}.login-form input::placeholder,.form-stack input::placeholder,.form-inline input::placeholder{color:var(--text-faint)}.soft-chip,.ghost-button,.primary-button,.icon-button{font:inherit;color:var(--text-strong);cursor:pointer;background:0 0;border:0}.soft-chip,.ghost-button,.primary-button{justify-content:center;align-items:center;gap:var(--space-xs);min-block-size:40px;padding:0 var(--space-md);border-radius:var(--radius-md);white-space:nowrap;font-size:.86rem;font-weight:620;display:inline-flex}.primary-button:disabled,.ghost-button:disabled{cursor:not-allowed;opacity:.46;transform:none}.soft-chip{color:var(--text-muted);background:var(--surface-quiet)}.ghost-button{background:var(--surface-quiet);border:1px solid var(--line-soft)}.primary-button{color:var(--surface-raised);background:var(--text-strong)}.icon-button{border-radius:var(--radius-md);block-size:40px;inline-size:40px;color:var(--text-muted);background:var(--surface-quiet);border:1px solid var(--line-soft);place-items:center;transition:color .18s,background-color .18s,transform .18s;display:inline-grid}.icon-button.solid{color:var(--surface-raised);background:var(--text-strong);border-color:var(--text-strong)}.reset-button{gap:var(--space-xs);inline-size:auto;padding-inline:var(--space-sm);grid-auto-flow:column}.reset-button span{color:inherit;white-space:nowrap;font-size:.78rem;font-weight:620}.ghost-button.compact,.primary-button.compact{min-block-size:34px;padding-inline:var(--space-sm);font-size:.78rem}.icon-button.active{color:var(--text-strong);background:var(--surface-raised)}.icon-button.danger{color:var(--danger-ink)}.soft-chip:hover,.ghost-button:hover,.icon-button:hover,.soft-chip:focus-visible,.ghost-button:focus-visible,.icon-button:focus-visible,.primary-button:focus-visible{transform:translateY(-1px)}.metrics-grid,.metric-grid{gap:var(--space-md);margin-block:var(--space-md) var(--space-xl);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.metric-card{min-block-size:136px;padding:var(--space-lg);border-radius:var(--radius-lg);background:var(--surface-raised);border:1px solid var(--line-soft);flex-direction:column;justify-content:space-between;display:flex}.metric-card span,.metric-card small,.metric-card em{color:var(--text-muted);font-size:.78rem;font-style:normal}.metric-card strong{color:var(--text-strong);font-size:1.76rem;font-weight:680;line-height:1}.metric-card div{justify-content:space-between;gap:var(--space-md);display:flex}.metric-card button,.metric-card a{color:var(--ink-accent);font:inherit;cursor:pointer;text-underline-offset:4px;background:0 0;border:0;align-self:start;padding:0;font-size:.78rem;font-weight:650;-webkit-text-decoration:underline #0000;text-decoration:underline #0000;transition:color .18s,text-decoration-color .18s}.metric-card button:hover,.metric-card button:focus-visible,.metric-card a:hover,.metric-card a:focus-visible{color:color-mix(in oklch, var(--ink-accent) 82%, var(--text-strong));text-decoration-color:currentColor}.metric-card em{color:var(--ink-accent);font-weight:650}.dashboard-grid{gap:var(--space-md);grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);align-items:start;display:grid}.content-grid,.split-layout{gap:var(--space-md);grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);align-items:start;display:grid}.page-stack{gap:var(--space-xl);display:grid}.page-title{gap:var(--space-xs);max-inline-size:760px;display:grid}.page-title h2{color:var(--text-strong);margin:0;font-size:1.62rem;font-weight:680;line-height:1.18}.page-title p:last-child{max-inline-size:65ch;color:var(--text-muted);margin:0}.panel{min-inline-size:0;padding:var(--space-lg);border-radius:var(--radius-lg);background:var(--surface-raised);border:1px solid var(--line-soft)}.side-panel{position:sticky;inset-block-start:var(--space-xl)}.panel.wide{grid-column:1/-1}.panel-header{justify-content:space-between;gap:var(--space-md);margin-block-end:var(--space-lg)}.panel-header h2{margin:var(--space-xs) 0 0;color:var(--text-strong);font-size:1.18rem;font-weight:650;line-height:1.2}.detail-head{justify-content:space-between;align-items:flex-start;gap:var(--space-md);margin-block-end:var(--space-lg);display:flex}.detail-head h2{margin:var(--space-xs) 0 0;color:var(--text-strong);font-size:1.2rem;line-height:1.2}.detail-head p:not(.eyebrow){margin:var(--space-xs) 0 0;color:var(--text-muted)}.header-actions,.inline-actions{gap:var(--space-xs)}.traffic-total{align-items:end;gap:var(--space-sm);margin-block:var(--space-xl);display:flex}.traffic-total strong{color:var(--text-strong);font-size:2.08rem;font-weight:690;line-height:1}.traffic-total span,.traffic-legend dt,.node-row span,.domain-row span,.domain-row small,.table-row small{color:var(--text-muted);font-size:.78rem}.split-line{background:var(--surface-quiet);border-radius:999px;gap:3px;block-size:8px;display:flex;overflow:hidden}.split-line span:first-child{background:var(--ink-accent)}.split-line span:last-child{background:color-mix(in oklch, var(--ink-accent) 26%, var(--surface-quiet))}.traffic-chart{gap:var(--space-sm);min-block-size:236px;margin-block:var(--space-xl) var(--space-md);grid-template-columns:64px minmax(0,1fr);display:grid}.traffic-scale{block-size:190px;color:var(--text-faint);text-align:end;flex-direction:column;justify-content:space-between;padding-block:1px 0;font-size:.72rem;display:flex}.traffic-plot{gap:var(--space-xs);grid-template-rows:190px auto;min-inline-size:0;display:grid;position:relative}.traffic-grid{pointer-events:none;flex-direction:column;justify-content:space-between;display:flex;position:absolute;inset:0 0 26px}.traffic-grid span{background:var(--line-soft);block-size:1px}.traffic-bars{z-index:1;align-items:end;gap:var(--space-xs);grid-template-columns:repeat(14,1fr);block-size:190px;margin:0;display:grid;position:relative}.traffic-bar{cursor:pointer;background:0 0;border:0;justify-content:flex-end;align-items:stretch;block-size:100%;min-inline-size:0;padding:0;display:flex;position:relative}.traffic-bar-stack{border-radius:var(--radius-sm) var(--radius-sm) var(--radius-xs) var(--radius-xs);background:color-mix(in oklch, var(--surface-quiet) 78%, var(--surface-raised));block-size:100%;inline-size:100%;box-shadow:inset 0 0 0 1px color-mix(in oklch, var(--line-soft) 72%, transparent);flex-direction:column-reverse;justify-content:flex-start;display:flex;overflow:hidden}.traffic-segment{min-block-size:2px;transition:background-color .18s,filter .18s}.traffic-segment.upload{background:var(--ink-accent)}.traffic-segment.download{background:color-mix(in oklch, var(--ink-accent) 28%, var(--surface-quiet))}.traffic-bar.active .traffic-segment.upload,.traffic-bar:hover .traffic-segment.upload,.traffic-bar:focus-visible .traffic-segment.upload{background:color-mix(in oklch, var(--ink-accent) 86%, var(--text-strong))}.traffic-bar.active .traffic-segment.download,.traffic-bar:hover .traffic-segment.download,.traffic-bar:focus-visible .traffic-segment.download{background:color-mix(in oklch, var(--ink-accent) 38%, var(--surface-quiet))}.traffic-tooltip{z-index:3;min-inline-size:150px;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-md);color:var(--text-body);background:var(--surface-raised);border:1px solid var(--line-soft);box-shadow:var(--shadow-float);opacity:0;pointer-events:none;gap:2px;transition:opacity .16s,transform .16s;display:grid;position:absolute;inset-block-end:calc(100% + var(--space-xs));inset-inline-start:50%;transform:translate(-50%,4px)}.traffic-tooltip strong{color:var(--text-strong);font-size:.78rem}.traffic-tooltip span{color:var(--text-muted);white-space:nowrap;font-size:.72rem}.traffic-bar:hover .traffic-tooltip,.traffic-bar:focus-visible .traffic-tooltip{opacity:1;transform:translate(-50%)}.traffic-x-axis{gap:var(--space-xs);color:var(--text-faint);grid-template-columns:repeat(14,1fr);font-size:.72rem;display:grid}.traffic-x-axis span{text-align:center;white-space:nowrap;min-inline-size:0}.traffic-active{align-items:baseline;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);background:var(--surface-quiet);grid-template-columns:auto auto minmax(0,1fr);margin-block-end:var(--space-md);display:grid}.traffic-active span{color:var(--text-muted);font-size:.78rem}.traffic-active strong{color:var(--text-strong);font-size:1rem}.traffic-active small{min-inline-size:0;color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:.78rem;overflow:hidden}.traffic-legend{gap:var(--space-md);grid-template-columns:1fr 1fr;margin:0;display:grid}.traffic-legend div{padding:var(--space-md);border-radius:var(--radius-md);background:var(--surface-quiet)}.traffic-legend dd{margin:var(--space-xs) 0 0;color:var(--text-strong);font-weight:650}.node-list,.domain-list,.template-list{gap:var(--space-sm);display:grid}.node-row{gap:var(--space-md);padding:var(--space-md) 0;border-block-start:1px solid var(--line-soft);grid-template-columns:minmax(0,1fr);display:grid}.node-row:first-child{border-block-start:0;padding-block-start:0}.node-main{gap:var(--space-sm);min-inline-size:0}.node-main div{gap:2px;min-inline-size:0;display:grid}.node-main strong,.domain-row strong,.table-row strong,.token-card strong{color:var(--text-strong);font-weight:650}.node-main span:last-child,.domain-row span,.token-card code{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.status-dot{background:var(--text-faint);border-radius:999px;flex:none;block-size:10px;inline-size:10px}.status-dot.online,.pill.active{background:var(--ok-soft);color:var(--ok-ink)}.status-dot.syncing{background:var(--warn-soft)}.status-dot.offline,.pill.suspended,.pill.disabled,.pill.revoked{background:var(--danger-soft);color:var(--danger-ink)}.node-group-row{gap:var(--space-md);padding:var(--space-md);border:1px solid var(--line-soft);border-radius:var(--radius-md);background:var(--surface-raised);display:grid}.member-chips{gap:var(--space-xs);flex-wrap:wrap;display:flex}.member-chip,.empty-chip{align-items:center;gap:var(--space-xs);min-block-size:30px;padding:0 var(--space-sm);border:1px solid var(--line-soft);color:var(--text-muted);background:var(--surface-quiet);font:inherit;border-radius:999px;font-size:.78rem;display:inline-flex}.member-chip{cursor:pointer}.member-chip svg{block-size:14px;inline-size:14px}.node-meta,.sync-counters{gap:var(--space-xs);flex-wrap:wrap;display:flex}.node-meta span,.sync-counters span,.pill{min-block-size:26px;padding:0 var(--space-sm);background:var(--surface-quiet);color:var(--text-muted);border-radius:999px;align-items:center;font-size:.74rem;font-weight:620;display:inline-flex}.data-table{border:1px solid var(--line-soft);border-radius:var(--radius-md);display:grid;overflow:hidden}.table-row{align-items:center;gap:var(--space-md);min-block-size:64px;padding:0 var(--space-lg);border-block-start:1px solid var(--line-soft);grid-template-columns:1.35fr .75fr .9fr .9fr .8fr;display:grid}.data-table button.table-row{border-block-end:0;border-inline:0;border-block-start:1px solid var(--line-soft);inline-size:100%;color:inherit;text-align:start;font:inherit;cursor:pointer;background:0 0}.data-table button.table-row:hover,.data-table button.table-row.selected{background:color-mix(in oklch, var(--surface-quiet) 82%, var(--ink-accent) 18%)}.users-table .table-row{grid-template-columns:minmax(160px,1.35fr) .55fr .8fr .9fr .6fr}.traffic-table .table-row{grid-template-columns:minmax(160px,1.2fr) .8fr .8fr .8fr .8fr}.device-traffic-table .table-row{grid-template-columns:minmax(150px,1.15fr) .7fr 1fr .7fr .7fr .65fr}.table-row:first-child{border-block-start:0}.table-head{min-block-size:44px;color:var(--text-muted);background:var(--surface-quiet);font-size:.74rem;font-weight:700}.table-row span:first-child{gap:2px;min-inline-size:0;display:grid}.domain-row{gap:var(--space-md);min-block-size:64px;padding-block:var(--space-sm);border-block-start:1px solid var(--line-soft);grid-template-columns:minmax(0,1fr) auto;align-items:center;display:grid}.domain-table{gap:var(--space-xs);display:grid}.domain-table.full .domain-row{grid-template-columns:minmax(0,1fr) auto}.domain-row:first-child{border-block-start:0;padding-block-start:0}.domain-row div:first-child,.domain-row div:last-child{gap:2px;display:grid}.domain-row div:last-child{justify-items:end}.domain-row b{color:var(--text-strong);font-size:1.04rem}.template-row{gap:var(--space-md);padding-block:var(--space-md);border-block-start:1px solid var(--line-soft);grid-template-columns:minmax(0,1fr) auto;align-items:center;display:grid}.template-row:first-child{border-block-start:0;padding-block-start:0}.template-row div{gap:2px;min-inline-size:0;display:grid}.template-row strong{color:var(--text-strong);font-weight:650}.template-row span:not(.pill){color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:.78rem;overflow:hidden}.token-card{gap:var(--space-sm);padding:var(--space-md);border-radius:var(--radius-md);background:var(--surface-quiet);display:grid}.token-manager{gap:var(--space-lg);display:grid}.token-form{gap:var(--space-sm);grid-template-columns:minmax(180px,1.2fr) minmax(120px,.72fr) minmax(140px,.9fr) auto;align-items:end;display:grid}.token-form input,.token-form select{min-block-size:44px;inline-size:100%;padding:0 var(--space-md);border-radius:var(--radius-md);border:1px solid var(--line-soft);color:var(--text-strong);background:var(--surface-raised);font:inherit;outline:0}.token-form input:focus-visible,.token-form select:focus-visible{outline:2px solid color-mix(in oklch, var(--ink-accent) 48%, transparent);outline-offset:3px}.token-helper{gap:var(--space-xs) var(--space-md);color:var(--text-muted);flex-wrap:wrap;font-size:.8rem;display:flex}.panel-subhead h3{margin:var(--space-xs) 0 0;color:var(--text-strong);font-size:1.12rem;line-height:1.2}.token-list{gap:var(--space-sm);display:grid}.token-row{gap:var(--space-md);padding:var(--space-md);border-radius:var(--radius-md);background:var(--surface-quiet);border:1px solid var(--line-soft);grid-template-columns:minmax(0,1fr) auto;align-items:center;display:grid}.token-row code{max-inline-size:min(100%,620px);color:var(--text-muted);font-family:var(--font-code);text-overflow:ellipsis;white-space:nowrap;font-size:.76rem;display:block;overflow:hidden}.device-drilldown{margin-block-start:var(--space-lg)}.device-summary-grid{gap:var(--space-sm);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));display:grid}.device-summary-card{gap:var(--space-md);padding:var(--space-md);border:1px solid var(--line-soft);border-radius:var(--radius-md);background:var(--surface-quiet);display:grid}.device-summary-card>div:first-child{gap:var(--space-xs);display:grid}.device-summary-card strong{color:var(--text-strong)}.device-summary-card small,.node-main small{color:var(--text-muted);font-size:.76rem}.device-summary-card dl{gap:var(--space-xs);grid-template-columns:repeat(3,minmax(0,1fr));margin:0;display:grid}.device-summary-card dt{color:var(--text-muted);font-size:.72rem}.device-summary-card dd{color:var(--text-strong);margin:0;font-weight:650}.token-card code{max-inline-size:100%;color:var(--text-muted);font-family:var(--font-code);font-size:.78rem}.inline-actions{margin-block-start:var(--space-md)}.validation-status{gap:var(--space-xs);min-block-size:32px;padding:0 var(--space-sm);color:var(--ok-ink);background:var(--ok-soft);border-radius:999px;font-size:.8rem;font-weight:650}.rule-editor{gap:var(--space-md);grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);display:grid}.rule-list{gap:var(--space-sm);align-content:start;display:grid}.login-form label,.rule-list label,.form-stack label,.form-grid label,.form-inline label{gap:var(--space-xs);color:var(--text-muted);font-size:.78rem;font-weight:650;display:grid}.login-form input,.rule-list input,.rule-list select,.form-stack input,.form-stack select,.form-inline input,.form-inline select{min-block-size:44px;padding:0 var(--space-md);border-radius:var(--radius-md);background:var(--surface-raised);border:1px solid var(--line-soft)}.form-stack{gap:var(--space-md);display:grid}.form-grid{gap:var(--space-sm);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.form-inline{align-items:end;gap:var(--space-sm);display:flex}.form-inline input,.form-inline select{flex:180px}.form-error{color:var(--danger-ink);margin:0;font-size:.82rem}.form-note{margin:var(--space-sm) 0 0;color:var(--text-muted);font-size:.86rem}.inline-feedback{color:var(--text-muted);margin:0;font-size:.82rem}.rule-editor pre{min-block-size:188px;padding:var(--space-lg);border-radius:var(--radius-md);color:var(--text-strong);background:var(--code-surface);font-family:var(--font-code);margin:0;font-size:.86rem;line-height:1.65;overflow:auto}.audit-ribbon{justify-content:center;gap:var(--space-md);color:var(--text-muted);margin-block-start:var(--space-xl);font-size:.8rem}.audit-ribbon div{gap:var(--space-xs);min-block-size:36px;padding:0 var(--space-md);background:var(--surface-quiet);border-radius:999px}.login-shell{min-block-size:100svh;padding:var(--space-xl);background:var(--surface-canvas);place-items:center;display:grid}.login-panel{gap:var(--space-lg);inline-size:min(100%,420px);padding:var(--space-xl);text-align:center;border-radius:var(--radius-xl);background:var(--surface-raised);border:1px solid var(--line-soft);box-shadow:var(--shadow-float);display:grid}.login-panel .form-stack{text-align:start}.login-panel .primary-button{inline-size:100%}.login-copy{gap:var(--space-sm);display:grid}.auth-brand-label{text-transform:none}.login-copy p:not(.eyebrow){color:var(--text-muted);margin:0}.login-register-toggle,.login-secondary-action{inline-size:100%}.register-page{text-align:center}.register-panel{gap:var(--space-md);border-block-start:1px solid var(--line-soft);text-align:start;padding-block-start:var(--space-md);display:grid}.register-panel.standalone{border-block-start:0;padding-block-start:0}.register-panel label{gap:var(--space-xs);color:var(--text-muted);font-size:.78rem;font-weight:650;display:grid}.register-panel input{min-block-size:44px;inline-size:100%;padding:0 var(--space-md);border-radius:var(--radius-md);color:var(--text-strong);background:var(--surface-raised);border:1px solid var(--line-soft);font:inherit;outline:0}.login-form{gap:var(--space-md);text-align:start;display:grid}.template-board{gap:var(--space-md);display:grid}.template-card{gap:var(--space-md);padding:var(--space-lg);border-radius:var(--radius-lg);background:var(--surface-quiet);border:1px solid var(--line-soft);display:grid}.template-meta,.button-row{align-items:center;gap:var(--space-xs);flex-wrap:wrap;display:flex}.template-meta span{color:var(--text-muted);font-size:.82rem}.audit-list,.rule-list-table{gap:var(--space-sm);display:grid}.audit-list.compact{max-block-size:360px;overflow:auto}.audit-row,.rule-row{gap:var(--space-md);padding-block:var(--space-sm);border-block-start:1px solid var(--line-soft);grid-template-columns:minmax(0,1fr) auto;align-items:center;display:grid}.audit-row:first-child,.rule-row:first-child{border-block-start:0}.audit-row div,.rule-row div:first-child{gap:2px;min-inline-size:0;display:grid}.audit-row strong,.rule-row strong{color:var(--text-strong)}.audit-row span,.audit-row small,.rule-row span{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:.78rem;overflow:hidden}.profile-grid{gap:var(--space-xl);grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:start;display:grid}.profile-grid h2{margin:var(--space-xs) 0;color:var(--text-strong)}.profile-grid p{color:var(--text-muted);margin:0}.profile-grid dl{gap:var(--space-sm);margin:0;display:grid}.profile-grid dl div{justify-content:space-between;gap:var(--space-md);padding-block:var(--space-sm);border-block-start:1px solid var(--line-soft);display:flex}.profile-grid dt{color:var(--text-muted)}.profile-grid dd{color:var(--text-strong);margin:0;font-weight:650}.empty-state{place-items:center;gap:var(--space-xs);min-block-size:140px;color:var(--text-muted);text-align:center;display:grid}.login-form .primary-button{inline-size:100%;margin-block-start:var(--space-xs)}button svg{flex:none;block-size:18px;inline-size:18px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid color-mix(in oklch, var(--ink-accent) 48%, transparent);outline-offset:3px}@media (width<=1180px){.metrics-grid,.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid,.content-grid,.split-layout{grid-template-columns:1fr}.panel.wide{grid-column:auto}}@media (width<=860px){.app-shell{grid-template-columns:1fr}.sidebar{block-size:auto;padding:var(--space-md);border-inline-end:0;border-block-end:1px solid var(--line-soft);position:static;overflow:hidden}.brand-row,.sidebar-footer{display:none}.nav-list{overscroll-behavior-inline:contain;grid-auto-columns:max-content;grid-auto-flow:column;padding-block-end:var(--space-xs);overflow-x:auto}.nav-item{min-inline-size:max-content}.workspace{padding:var(--space-md) var(--space-md) var(--space-xl)}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;margin-block-end:var(--space-md)}.mobile-brand{display:flex}.topbar-status{justify-content:flex-start;inline-size:100%}.metrics-grid,.metric-grid{grid-template-columns:1fr}.login-copy h1{font-size:2rem}.table-row,.table-head{grid-template-columns:1.3fr .8fr .9fr}.table-row span:nth-child(2),.table-row span:nth-child(4),.table-head span:nth-child(2),.table-head span:nth-child(4){display:none}.rule-editor{grid-template-columns:1fr}.token-form{grid-template-columns:1fr 1fr}.token-form .primary-button{grid-column:1/-1}.token-row,.audit-row,.rule-row,.profile-grid{grid-template-columns:1fr}.side-panel{position:static}.audit-ribbon{flex-wrap:wrap}}@media (width<=560px){.metrics-grid,.metric-grid{grid-template-columns:1fr}.workspace{padding-inline:var(--space-sm)}.metric-card{min-block-size:116px}.panel,.metric-card,.login-panel{border-radius:var(--radius-md)}.panel-header{align-items:flex-start}.header-actions,.form-inline,.button-row{flex-wrap:wrap;justify-content:flex-end}.form-grid,.token-form{grid-template-columns:1fr}.table-row,.table-head,.users-table .table-row,.traffic-table .table-row{min-block-size:auto;padding:var(--space-md);grid-template-columns:minmax(0,1fr) auto}.table-row span:nth-child(3),.table-row span:nth-child(4),.table-head span:nth-child(3),.table-head span:nth-child(4){display:none}.token-row code,.audit-row span,.rule-row span{white-space:normal}.reset-button{inline-size:40px;padding-inline:0}.reset-button span{display:none}.topbar-popover{inline-size:min(320px, calc(100vw - var(--space-lg)));inset-inline:0 auto}.traffic-chart{grid-template-columns:1fr;min-block-size:208px}.traffic-scale{display:none}.traffic-plot{grid-template-rows:166px auto}.traffic-grid{inset-block-end:24px}.traffic-bars{block-size:166px}.traffic-active{grid-template-columns:1fr;align-items:start}.traffic-active small{white-space:normal}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}