:root{--bg:#f4f6fa;--panel:#fff;--ink:#172033;--muted:#687386;--line:#e4e8f0;--nav:#10192b;--nav2:#17243a;--primary:#3568e8;--primary-soft:#eef3ff;--success:#18865d;--warning:#b66a06;--danger:#c8384a;--info:#2774c9;--shadow:0 8px 28px rgba(25,42,70,.07)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:var(--ink);background:var(--bg)}button,input,select{font:inherit}button,a{transition:.18s ease}.app-shell{display:flex;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:var(--nav);color:#d7deeb;display:flex;flex-direction:column;z-index:20;box-shadow:8px 0 24px rgba(7,14,28,.08)}.brand{height:72px;display:flex;align-items:center;gap:12px;padding:0 20px;border-bottom:1px solid rgba(255,255,255,.08)}.brand-mark{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#4a7cff,#65a5ff);font-weight:800;color:#fff}.brand-copy{display:flex;flex-direction:column}.brand-copy strong{font-size:15px;color:#fff}.brand-copy small{color:#8897ad;margin-top:2px}.sidebar nav{padding:16px 12px;overflow:auto;flex:1}.nav-group{margin:2px 0}.nav-parent{width:100%;height:44px;border:0;border-radius:8px;background:transparent;color:#adbacd;display:flex;align-items:center;gap:12px;padding:0 12px;text-decoration:none;cursor:pointer}.nav-parent i{width:22px;text-align:center;font-style:normal;font-size:17px;color:#8496af}.nav-parent span{flex:1;text-align:left;font-size:14px}.nav-parent b{font-weight:400;transition:.18s}.nav-parent:hover,.nav-parent.active{background:var(--nav2);color:#fff}.nav-parent.active i{color:#70a4ff}.nav-children{display:none;padding:4px 0 6px 34px}.nav-group.expanded .nav-children{display:block}.nav-group.expanded .nav-parent b{transform:rotate(180deg)}.nav-child{height:34px;display:flex;align-items:center;gap:9px;padding:0 10px;color:#8f9eb2;text-decoration:none;border-radius:7px;font-size:13px}.nav-child>span{width:4px;height:4px;border-radius:50%;background:#5d6c82}.nav-child em{margin-left:auto;min-width:22px;padding:2px 6px;border-radius:10px;background:#73313e;color:#ffc4ce;font-style:normal;font-size:11px;text-align:center}.nav-child:hover,.nav-child.active{color:#fff;background:rgba(255,255,255,.06)}.nav-child.active>span{background:#6ea0ff;box-shadow:0 0 0 3px rgba(92,139,236,.18)}.sidebar-foot{height:52px;margin:0 12px 12px;padding:0 12px;border:1px solid rgba(255,255,255,.08);border-radius:9px;display:flex;align-items:center;gap:8px;font-size:12px;color:#8493aa}.system-dot{width:7px;height:7px;background:#2fd09c;border-radius:50%;box-shadow:0 0 0 3px rgba(47,208,156,.12)}.workspace{width:calc(100% - 248px);margin-left:248px;min-width:0}.topbar{height:64px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:10}.environment{display:flex;align-items:center;gap:9px;color:#536074;font-size:13px}.environment b{font-size:11px;background:#eaf0ff;color:#3b69d5;padding:3px 7px;border-radius:10px}.topbar-actions{display:flex;align-items:center;gap:8px}.icon-button{width:36px;height:36px;border:1px solid var(--line);background:#fff;border-radius:8px;color:#5d6879;cursor:pointer}.icon-button:hover{background:#f6f8fc;color:#234fb7}.menu-button{display:none}.user-button{border:0;background:transparent;display:flex;align-items:center;gap:8px;padding:4px 5px;border-radius:8px;color:#667085;cursor:pointer}.user-button:hover{background:#f5f7fb}.user-button>span:nth-child(2){display:flex;flex-direction:column;text-align:left}.user-button strong{font-size:13px;color:#2e384b}.user-button small{font-size:11px}.avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:#e8efff;color:#315fc9;font-size:13px;font-weight:700}.content-wrap{max-width:1500px;margin:auto;padding:22px 28px 44px}.breadcrumb{display:flex;align-items:center;gap:8px;font-size:12px;color:#9099a8;margin-bottom:14px}.breadcrumb a{color:#66768e;text-decoration:none}.breadcrumb strong{font-weight:500;color:#536074}.page-header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:20px}.page-header h1{font-size:25px;margin:0 0 5px;letter-spacing:-.02em}.page-header p{margin:0;color:var(--muted);font-size:13px}.page-actions{display:flex;gap:8px}.button{height:36px;border-radius:7px;border:1px solid transparent;padding:0 14px;cursor:pointer;font-size:13px;font-weight:600}.button.primary{background:var(--primary);color:#fff}.button.primary:hover{background:#2858cc}.button.secondary{background:#fff;border-color:#d9dee8;color:#48556a}.button.secondary:hover{border-color:#aeb9c9;background:#fafbfc}.button.warning{background:#fff5e8;border-color:#edc88f;color:#9a5908}.button.danger{background:var(--danger);color:#fff}.filter-panel,.panel{background:var(--panel);border:1px solid var(--line);border-radius:11px;box-shadow:var(--shadow)}.filter-panel{padding:17px 18px 12px;margin-bottom:16px}.filter-grid{display:grid;grid-template-columns:180px minmax(220px,1fr) 180px auto;gap:12px;align-items:end}.filter-grid label{display:flex;flex-direction:column;gap:7px;color:#5e6879;font-size:12px;font-weight:600}.filter-grid select,.filter-grid input{width:100%;height:36px;border:1px solid #d9dee8;border-radius:7px;background:#fff;color:#263247;padding:0 10px;outline:none}.filter-grid select:focus,.filter-grid input:focus{border-color:#6c94ed;box-shadow:0 0 0 3px rgba(53,104,232,.1)}.search-box{position:relative}.search-box span{position:absolute;left:10px;top:8px;color:#8994a5}.search-box input{padding-left:30px}.filter-actions{display:flex;gap:8px}.filter-meta{display:flex;justify-content:space-between;gap:14px;margin-top:13px;padding-top:11px;border-top:1px solid #edf0f5;font-size:11px;color:#8791a1}.filter-meta span:first-child{display:flex;gap:9px}.filter-meta b{color:#59677c;font-weight:500}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}.metrics article{background:#fff;border:1px solid var(--line);border-radius:11px;padding:17px 18px;box-shadow:var(--shadow);min-width:0}.metrics article>span{font-size:12px;color:#697588}.metrics strong{display:block;font-size:24px;margin:9px 0 8px;white-space:nowrap;letter-spacing:-.03em}.metrics small{display:block;color:#8a94a3;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metrics small.positive{color:var(--success)}.risk-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fffaf2;border:1px solid #f1d7aa;border-radius:10px;padding:13px 15px;margin-bottom:16px}.risk-banner>div{display:flex;align-items:center;gap:11px}.risk-banner>div>b{display:grid;place-items:center;width:28px;height:28px;background:#f8e4bd;color:#9a5a0a;border-radius:8px}.risk-banner span{display:flex;flex-direction:column;gap:3px}.risk-banner strong{font-size:13px}.risk-banner small{color:#876e4c}.panel-head{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:18px}.panel-head h2{font-size:15px;margin:0 0 4px}.panel-head p{font-size:12px;color:#7d8898;margin:0}.segmented{display:flex;background:#f3f5f9;padding:3px;border-radius:8px}.segmented button{height:29px;padding:0 10px;border:0;background:transparent;color:#748093;border-radius:6px;font-size:12px;cursor:pointer}.segmented button.active{background:#fff;color:#315fc9;box-shadow:0 1px 4px rgba(29,43,68,.12)}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse;min-width:820px}th,td{height:52px;padding:0 18px;border-top:1px solid #edf0f5;text-align:left;font-size:12px;white-space:nowrap}th{height:42px;background:#fafbfc;color:#7d8797;font-size:11px;font-weight:600}td{color:#4d596c}td a{color:#3568e8;text-decoration:none;font-weight:600}.money{font-weight:650;color:#2f394b}.status{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:12px;font-size:11px}.status i{width:5px;height:5px;border-radius:50%;background:currentColor}.status.success{background:#eaf8f2;color:#187959}.status.warning{background:#fff5e5;color:#a4610a}.status.danger{background:#ffedf0;color:#b93448}.status.info{background:#eaf3ff;color:#286bb8}.status.muted{background:#f0f2f5;color:#737e8e}.status.draft{background:#f3efff;color:#7253b8}.text-button{border:0;background:transparent;color:#3767cf;padding:4px 6px;cursor:pointer;font-size:12px}.danger-text{color:#bd3a4b}.pagination{height:56px;padding:0 18px;border-top:1px solid #edf0f5;display:flex;align-items:center;justify-content:space-between;color:#7b8594;font-size:11px}.pagination div{display:flex;gap:4px}.pagination button{min-width:28px;height:28px;border:1px solid #e0e4eb;background:#fff;border-radius:6px;color:#667286;cursor:pointer}.pagination button.active{border-color:#4876df;background:#3568e8;color:#fff}.pagination button:disabled{opacity:.45}.placeholder{padding:54px 28px;text-align:center}.placeholder-visual{width:66px;height:66px;margin:0 auto 17px;border-radius:18px;background:linear-gradient(145deg,#eef3ff,#f7f9ff);display:grid;place-items:center;color:#4773d9;font-size:30px;border:1px solid #dce5fa}.placeholder h2{font-size:18px;margin:0 0 9px}.placeholder p{max-width:620px;margin:0 auto;color:#758094;font-size:13px;line-height:1.7}.placeholder-actions{display:flex;justify-content:center;gap:9px;margin-top:21px}.state-strip{display:flex;justify-content:center;flex-wrap:wrap;gap:7px;margin-top:35px;padding-top:23px;border-top:1px solid #edf0f5}.feedback-state{min-height:282px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-top:1px solid #edf0f5;color:#7d8797}.state-symbol{width:45px;height:45px;border-radius:13px;background:#f1f4f9;display:grid;place-items:center;font-size:20px;margin-bottom:13px}.feedback-state.error .state-symbol{background:#ffedf0;color:#b93448}.feedback-state h3{margin:0 0 7px;font-size:15px;color:#39465a}.feedback-state p{margin:0 0 15px;font-size:12px}.spinner{width:20px;height:20px;border:2px solid #cdd8ed;border-top-color:#3568e8;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.toast{position:fixed;right:24px;bottom:24px;padding:12px 16px;background:#213047;color:#fff;border-radius:9px;box-shadow:0 12px 32px rgba(15,25,41,.24);font-size:13px;opacity:0;transform:translateY(12px);pointer-events:none;transition:.2s;z-index:40}.toast.show{opacity:1;transform:none}.toast.info{background:#275f9b}.confirm-dialog{width:min(420px,calc(100% - 32px));border:0;border-radius:13px;padding:0;box-shadow:0 24px 70px rgba(13,23,41,.28)}.confirm-dialog::backdrop{background:rgba(15,24,38,.48)}.confirm-dialog form{padding:26px;text-align:center}.dialog-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;margin:0 auto 13px;background:#fff0e6;color:#ba5c19;font-size:21px;font-weight:700}.confirm-dialog h2{font-size:18px;margin:0 0 9px}.confirm-dialog p{color:#707b8c;line-height:1.6;font-size:13px;margin:0}.dialog-actions{display:flex;justify-content:center;gap:9px;margin-top:22px}
@media(max-width:1180px){.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.filter-grid{grid-template-columns:160px minmax(200px,1fr) 150px}.filter-actions{grid-column:1/-1;justify-content:flex-end}}
@media(max-width:900px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.workspace{width:100%;margin-left:0}.menu-button{display:inline-grid;place-items:center}.topbar{padding:0 16px}.content-wrap{padding:18px 18px 36px}.filter-grid{grid-template-columns:1fr 1fr}.filter-actions{grid-column:1/-1}.sidebar.open::after{content:"";position:fixed;left:248px;top:0;width:calc(100vw - 248px);height:100vh;background:rgba(12,20,34,.35)}}
@media(max-width:620px){.environment{display:none}.content-wrap{padding:16px 12px 28px}.page-header{flex-direction:column}.page-actions{width:100%}.page-actions .button{flex:1}.filter-grid{grid-template-columns:1fr}.filter-actions{grid-column:auto}.filter-meta{align-items:flex-start;flex-direction:column}.metrics{grid-template-columns:1fr}.risk-banner{align-items:flex-start;flex-direction:column}.risk-banner .button{width:100%}.panel-head{align-items:flex-start;flex-direction:column}.segmented{width:100%;overflow:auto}.segmented button{flex:1}.pagination{gap:12px;align-items:flex-start;height:auto;padding:14px;flex-direction:column}.user-button>span:nth-child(2),.user-button>span:last-child{display:none}}

#mainContent:focus{outline:none}