:root{--bg: #f6f5f2;--surface: #ffffff;--surface2: #fbfaf8;--border: #e8e4dd;--line: #f0ede7;--chip: #f0ede7;--ink: #211e1a;--ink2: #6d685f;--ink3: #a39d92;--accent: #4f46e5;--accent2: #eef0fe;--accent-hover: #4338ca;--brand-grad: linear-gradient(135deg, #4f46e5 0%, #3730a3 100%);--good: #15803d;--goodbg: #e8f5ec;--warn: #b45309;--warnbg: #fbeedd;--bad: #b91c1c;--badbg: #fbe9e9;--bad-hover: #a01818;--side: #211f1b;--side2: #2c2a25;--side-ink: #cdc7bb;--side-ink2: #8b857a;--num: "Space Grotesk", ui-sans-serif, system-ui;--ui: ui-sans-serif, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--r-sm: 4px;--r-ctl: 8px;--r-panel: 12px;--r-pill: 999px;--t: .2s ease;--mask: rgba(0, 0, 0, .45);--scrim: rgba(0, 0, 0, .5);--focus-ring: 0 0 0 3px var(--accent2);--shadow-card: 0 4px 12px rgba(0, 0, 0, .08);--shadow-modal: 0 10px 40px rgba(0, 0, 0, .12);font-family:var(--ui);color:var(--ink)}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--bg)}.frame{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:212px 1fr;width:100vw;height:100vh;background:var(--bg)}.frame .side{z-index:100;display:flex;flex-direction:column;overflow-y:auto;background:var(--side);border-right:1px solid var(--side2)}.frame .right-col{display:flex;flex-direction:column;overflow:hidden}.frame .top{display:flex;flex-shrink:0;gap:var(--sp-4);align-items:center;min-height:60px;padding:var(--sp-3) var(--sp-5);background:var(--surface);border-bottom:1px solid var(--border)}.frame .body{flex:1;padding:var(--sp-5) 22px;overflow-y:auto}@media(max-width:900px){.frame{grid-template-columns:1fr}.frame .side{position:fixed;top:0;left:0;z-index:200;width:212px;height:100vh;transition:translate .3s ease;translate:-100% 0}.frame .side.open{translate:0 0}.frame .body{padding:var(--sp-4) var(--sp-3)}}@media(max-width:640px){.frame .body{padding:var(--sp-3)}}.side .brand{display:flex;flex-shrink:0;gap:var(--sp-3);align-items:center;padding:var(--sp-4);border-bottom:1px solid var(--side2)}@media(max-width:640px){.side .brand{padding:var(--sp-3)}}.side .brand-logo{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:40px;height:40px;font-size:18px;font-weight:700;color:#fff;background:var(--brand-grad);border-radius:var(--r-ctl)}@media(max-width:640px){.side .brand-logo{width:32px;height:32px;font-size:16px}}.side .brand-info{flex:1;min-width:0}.side .brand-name{font-size:13px;font-weight:600;line-height:1.2;color:var(--side-ink)}@media(max-width:640px){.side .brand-name{font-size:12px}}.side .brand-desc{margin-top:2px;font-size:11px;color:var(--side-ink2)}@media(max-width:640px){.side .brand-desc{font-size:10px}}.nav-container{flex:1;padding:var(--sp-3) 0;overflow-y:auto}.navgrp{margin-bottom:var(--sp-2)}.navgrp-label{display:block;padding:var(--sp-2) var(--sp-3);font-size:10px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--side-ink2)}.nav-item{display:flex;gap:10px;align-items:center;width:100%;padding:var(--sp-2) var(--sp-3);font-size:13px;text-align:left;color:var(--side-ink);cursor:pointer;background:none;border:none;border-left:2px solid transparent;transition:background var(--t),color var(--t),border-color var(--t)}.nav-item:hover:not(.active){background:var(--side2)}.nav-item.active{font-weight:600;color:#fff;background:var(--accent);border-left-color:var(--accent)}@media(max-width:640px){.nav-item{padding:6px 10px;font-size:12px}}.nav-icon{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:16px;height:16px;color:currentColor}.nav-label{flex:1;min-width:0}.profile-zone{display:flex;flex-shrink:0;gap:10px;align-items:center;padding:var(--sp-3);border-top:1px solid var(--side2)}@media(max-width:640px){.profile-zone{padding:10px}}.profile-avatar{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:32px;height:32px;font-size:12px;font-weight:600;color:#fff;background:var(--accent);border-radius:50%}@media(max-width:640px){.profile-avatar{width:28px;height:28px;font-size:11px}}.profile-info{flex:1;min-width:0;font-size:12px}.profile-name{font-weight:600;color:var(--side-ink)}.profile-role{font-size:11px;color:var(--side-ink2)}.profile-logout{flex-shrink:0;padding:var(--sp-1) var(--sp-2);font-size:11px;white-space:nowrap;color:var(--side-ink);cursor:pointer;background:none;border:none;border-radius:var(--r-sm);transition:background var(--t)}.profile-logout:hover{background:var(--side2)}.top-breadcrumbs{display:flex;flex:0 0 auto;gap:6px;align-items:center;font-size:12px;color:var(--ink3)}@media(max-width:640px){.top-breadcrumbs{display:none}}.breadcrumb-group{font-weight:500}.breadcrumb-sep{color:var(--ink3)}.breadcrumb-page{color:var(--ink2)}.top-title{flex:1;margin:0;font-size:18px;font-weight:700;color:var(--ink)}@media(max-width:900px){.top-title{font-size:16px}}@media(max-width:640px){.top-title{font-size:14px}}.nav-label,.profile-name,.profile-role,.top-title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.hamburger{display:none}@media(max-width:900px){.hamburger{display:flex;flex-shrink:0;align-items:center;justify-content:center;padding:var(--sp-1);color:var(--ink);cursor:pointer;background:none;border:none}.hamburger:hover{opacity:.7}}.sidebar-backdrop{display:none}@media(max-width:900px){.sidebar-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:150;display:block;background:var(--scrim)}}button.btn{padding:7px 14px;font-size:13px;font-weight:500;color:#fff;cursor:pointer;background:var(--accent);border:none;border-radius:var(--r-ctl);transition:background var(--t)}button.btn:hover:not(:disabled){background:var(--accent-hover)}button.btn:disabled{cursor:not-allowed;opacity:.5}button.btn.sm{padding:5px 10px;font-size:12px}button.btn.ghost,button.btn.gray{color:var(--ink);background:#fff;border:1px solid var(--border)}button.btn.ghost:hover:not(:disabled),button.btn.gray:hover:not(:disabled){background:var(--surface2)}button.btn.danger{background:var(--bad)}button.btn.danger:hover:not(:disabled){background:var(--bad-hover)}input,select,textarea{padding:7px 9px;font-family:inherit;font-size:13px;border:1px solid var(--border);border-radius:var(--r-ctl);transition:border-color var(--t),box-shadow var(--t)}input:focus,select:focus,textarea:focus{border-color:var(--accent);outline:none;box-shadow:var(--focus-ring)}input[type=checkbox]{width:16px;height:16px;padding:0;accent-color:var(--accent)}.check-line{display:flex;gap:6px;align-items:center;font-size:12px;cursor:pointer}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-panel)}.panel-h{display:flex;align-items:center;padding:14px var(--sp-4);border-bottom:1px solid var(--line)}.panel-h h3{margin:0;font-size:13.5px;font-weight:600;color:var(--ink)}.panel-b{padding:var(--sp-4)}.panel-actions{margin-left:auto}.card{padding:var(--sp-4);margin-bottom:var(--sp-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-panel)}.tbl,table{width:100%;font-size:12.5px;background:var(--surface);border-collapse:collapse}.tbl th,table th{padding:9px var(--sp-4);font-size:10.5px;font-weight:600;letter-spacing:.6px;text-align:left;text-transform:uppercase;color:var(--ink3);border-bottom:1px solid var(--line)}.tbl td,table td{padding:10px var(--sp-4);color:var(--ink);border-bottom:1px solid var(--line)}.tbl tr:hover td,table tr:hover td{background:var(--surface2)}.tbl .num,table .num{font-family:var(--num);font-feature-settings:"tnum";text-align:right}.tbl.compact th,.tbl.compact td{padding:var(--sp-2) 10px;font-size:12px}.pill{display:inline-flex;gap:var(--sp-1);align-items:center;padding:3px 9px;font-size:11px;font-weight:600;color:var(--ink2);background:var(--chip);border-radius:var(--r-pill)}.pill.g{color:var(--good);background:var(--goodbg)}.pill.w{color:var(--warn);background:var(--warnbg)}.pill.b{color:var(--bad);background:var(--badbg)}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;overflow:hidden;background:var(--border);border:1px solid var(--border);border-radius:var(--r-panel)}.stat{display:flex;flex-direction:column;gap:6px;padding:var(--sp-4);background:var(--surface)}.stat .k{font-size:11.5px;letter-spacing:.4px;text-transform:uppercase;color:var(--ink2)}.stat .v{font-family:var(--num);font-size:25px;font-weight:600;font-feature-settings:"tnum";color:var(--ink)}.user-detail{display:flex;flex-direction:column;gap:var(--sp-4)}.detail-section h4{margin:0 0 10px;font-size:13px;font-weight:700}.timeline-list{display:flex;flex-direction:column;gap:var(--sp-2)}.timeline-item{display:grid;grid-template-columns:150px 80px 1fr;gap:10px;align-items:start;padding:var(--sp-2) 10px;font-size:12px;background:var(--surface2);border:1px solid var(--line);border-radius:var(--r-ctl)}@media(max-width:900px){.timeline-item{grid-template-columns:1fr}}.timeline-title{display:flex;flex-direction:column;gap:var(--sp-1);min-width:0}.timeline-title-text{line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}.link-btn{align-self:flex-start;padding:0;font:inherit;font-size:12px;color:var(--accent);cursor:pointer;background:transparent;border:0}.link-btn:hover{text-decoration:underline}.audit-actor{font-family:monospace;font-size:12px}.audit-brief{font-size:11px;color:var(--ink3)}.audit-json{max-height:200px;margin:var(--sp-1) 0 0;padding:var(--sp-1);overflow:auto;font-size:11px;background:var(--surface2);border-radius:var(--r-sm)}.row{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center;margin-bottom:var(--sp-3)}.muted{color:var(--ink3)}.field{display:flex;flex-direction:column;gap:var(--sp-1);font-size:13px}.toast{position:fixed;top:var(--sp-4);right:var(--sp-4);z-index:50;padding:10px var(--sp-4);font-size:14px;color:#fff;border-radius:var(--r-panel);animation:toast-in .3s ease}.toast.ok{background:var(--good)}.toast.err{background:var(--bad)}@keyframes toast-in{0%{opacity:0;translate:400px 0}}.modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:var(--mask);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:mask-in .2s ease}@keyframes mask-in{0%{opacity:0}}.modal-card{display:flex;flex-direction:column;max-width:calc(100vw - 24px);max-height:80vh;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-panel);box-shadow:var(--shadow-modal);animation:card-in .3s ease}@keyframes card-in{0%{opacity:0;translate:0 20px}}.modal-header{display:flex;gap:var(--sp-3);align-items:center;justify-content:space-between;padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--line)}.modal-title{flex:1;margin:0;font-size:16px;font-weight:600;color:var(--ink)}.modal-close{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:var(--sp-1) var(--sp-2);font-size:18px;color:var(--ink2);cursor:pointer;background:none;border:none;border-radius:var(--r-sm);transition:background var(--t),color var(--t)}.modal-close:hover{color:var(--ink);background:var(--surface2)}.modal-body{flex:1;padding:var(--sp-5);font-size:13px;line-height:1.6;overflow:auto}.modal-footer,.modal-footer-actions{display:flex;gap:var(--sp-2);justify-content:flex-end}.modal-footer{padding:var(--sp-4) var(--sp-5);background:var(--surface2);border-top:1px solid var(--line)}.login-page{display:flex;align-items:center;justify-content:center;width:100%;height:100vh;padding:var(--sp-4);background:linear-gradient(135deg,#f6f5f2,#fbfaf8)}.login-container{width:100%;max-width:360px;padding:40px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-panel);box-shadow:var(--shadow-card)}@media(max-width:640px){.login-container{padding:32px var(--sp-5)}}.login-brand{margin-bottom:32px;text-align:center}.login-brand .brand-logo{display:flex;align-items:center;justify-content:center;width:56px;height:56px;margin:0 auto var(--sp-4);font-size:24px;font-weight:700;color:#fff;background:var(--brand-grad);border-radius:var(--r-panel)}@media(max-width:640px){.login-brand .brand-logo{width:48px;height:48px;font-size:20px}}.login-brand .brand-name{margin:0 0 var(--sp-1);font-size:18px;font-weight:600;color:var(--ink)}@media(max-width:640px){.login-brand .brand-name{font-size:16px}}.login-brand .brand-desc{margin:0;font-size:13px;color:var(--ink2)}.login-form{display:flex;flex-direction:column;gap:var(--sp-3)}.login-form input{width:100%;padding:10px var(--sp-3)}.login-form input:disabled{cursor:not-allowed;opacity:.6}.login-form button{width:100%;padding:10px var(--sp-4);font-size:14px;font-weight:600}.login-form button:disabled{opacity:.6}
