:root { --canvas:#080a09; --surface:#111412; --surface-2:#171b18; --line:#29302b; --line-strong:#3b463e; --ink:#f2f5f2; --muted:#9ca79f; --subtle:#6f7a72; --brand:#7fa48b; --brand-strong:#a9c7b1; --danger:#dc7b72; --warning:#d6ad69; --success:#70b887; }
* { box-sizing:border-box; } [hidden] { display:none !important; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--canvas); font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif; font-size:14px; } button,input { font:inherit; } button { cursor:pointer; } h1,h2,h3,p { margin:0; } h1 { margin-top:5px; font-size:28px; letter-spacing:-.8px; } h2 { margin-top:4px; font-size:20px; letter-spacing:-.4px; } h3 { font-size:14px; font-weight:650; }.eyebrow { color:var(--brand); font-size:10px; font-weight:750; letter-spacing:1.5px; text-transform:uppercase; }.muted { margin-top:14px; color:var(--muted); font-size:12px; line-height:1.65; }
.login-shell { display:grid; min-height:100vh; padding:24px; place-items:center; background:linear-gradient(180deg,#0d110e,var(--canvas)); }.login-card { width:min(100%,420px); padding:34px; border:1px solid var(--line); border-radius:16px; background:var(--surface); box-shadow:0 24px 80px rgba(0,0,0,.28); }.login-card>p:not(.eyebrow) { margin:14px 0 24px; color:var(--muted); line-height:1.7; }.login-card label { display:block; color:var(--muted); font-size:12px; font-weight:650; }.login-card input,.form-grid input { width:100%; margin-top:8px; padding:10px 11px; color:var(--ink); border:1px solid var(--line-strong); border-radius:8px; outline:none; background:#0c0f0d; }.login-card input:focus,.form-grid input:focus { border-color:var(--brand); box-shadow:0 0 0 3px rgba(127,164,139,.14); }.primary,.secondary { min-height:36px; padding:8px 13px; border-radius:8px; font-weight:650; }.primary { color:#08110b; border:1px solid var(--brand-strong); background:var(--brand-strong); }.secondary { color:var(--ink); border:1px solid var(--line-strong); background:var(--surface); }.login-card .primary { width:100%; margin-top:20px; }.error { margin-top:12px !important; color:var(--danger) !important; }
.app-shell { min-height:100vh; }.sidebar { position:fixed; inset:0 auto 0 0; display:flex; width:228px; padding:22px 14px; flex-direction:column; border-right:1px solid var(--line); background:#0b0d0c; }.brand { display:flex; align-items:center; gap:11px; padding:0 8px 22px; }.brand>span { display:grid; width:34px; height:34px; color:#0b130e; border-radius:10px; place-items:center; background:var(--brand-strong); font-family:serif; font-size:20px; }.brand strong,.brand small,.sidebar-foot strong,.sidebar-foot small { display:block; }.brand strong { font-size:14px; }.brand small,.sidebar-foot small { margin-top:2px; color:var(--subtle); font-size:10px; }.sidebar nav { display:grid; gap:3px; }.sidebar nav a { padding:9px 10px; color:var(--muted); border-radius:7px; text-decoration:none; font-size:12px; }.sidebar nav a:hover { color:var(--ink); background:var(--surface-2); }.sidebar-foot { display:flex; align-items:center; gap:9px; margin-top:auto; padding:12px 9px 0; border-top:1px solid var(--line); }.status-dot { width:8px; height:8px; border-radius:50%; background:var(--warning); box-shadow:0 0 0 4px rgba(214,173,105,.1); }
main { width:calc(100% - 228px); max-width:1500px; margin-left:228px; padding:26px 30px 72px; }.topbar { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; padding-bottom:20px; }.topbar-actions { display:flex; gap:8px; }.notice { margin-bottom:24px; padding:11px 13px; color:#d8c5a2; border:1px solid #4a412f; border-radius:8px; background:#18150f; font-size:12px; line-height:1.55; }.section-block { padding-top:24px; scroll-margin-top:12px; }.section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:14px; }.section-head>span,.panel-head>span { color:var(--subtle); font-size:11px; }.badge { padding:4px 8px; color:var(--warning) !important; border:1px solid #5b4a2e; border-radius:999px; background:#18150f; }.metric-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:9px; }.metric { min-height:104px; padding:16px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }.metric p { color:var(--muted); font-size:11px; }.metric strong { display:block; margin:12px 0 6px; font-feature-settings:"tnum"; font-size:22px; letter-spacing:-.5px; }.metric small { color:var(--subtle); font-size:10px; line-height:1.4; }.grid { display:grid; gap:12px; margin-top:12px; }.two-column { grid-template-columns:1fr 1fr; }.panel { padding:17px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }.panel-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:12px; }.list { display:grid; }.list-row { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:51px; padding:10px 0; border-top:1px solid var(--line); }.list-row:first-child { border-top:0; }.list-row>div:first-child { min-width:0; }.list-title { display:block; overflow:hidden; color:var(--ink); font-size:12px; font-weight:650; text-overflow:ellipsis; white-space:nowrap; }.subline { display:block; margin-top:4px; overflow:hidden; color:var(--subtle); font-size:10px; line-height:1.45; text-overflow:ellipsis; }.list-side { display:flex; align-items:flex-end; flex:0 0 auto; flex-direction:column; gap:5px; text-align:right; }.amount { color:var(--brand-strong); font-feature-settings:"tnum"; font-size:13px; font-weight:700; }.state { display:inline-block; padding:3px 7px; color:var(--muted); border-radius:999px; background:var(--surface-2); font-size:10px; }.state.pass,.state.active,.state.approved,.state.published_internal { color:var(--success); background:rgba(112,184,135,.1); }.state.fail,.state.blocked_by_gate,.state.rejected,.state.revoked,.state.reversed,.state.recovery_required { color:var(--danger); background:rgba(220,123,114,.1); }.state.reserved,.state.observing,.state.reserved_annual,.state.submitted,.state.draft { color:var(--warning); background:rgba(214,173,105,.1); }.row-actions { display:flex; gap:6px; }.small-button { padding:5px 7px; color:var(--ink); border:1px solid var(--line-strong); border-radius:6px; background:var(--surface-2); font-size:10px; }.small-button.danger { color:var(--danger); border-color:#5e3935; }.capability-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.capability { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px; border:1px solid var(--line); border-radius:8px; background:#0d100e; }.capability span { color:var(--muted); font-size:11px; }.capability strong { color:var(--danger); font-size:10px; text-transform:uppercase; }
.table-panel { padding:0; overflow:hidden; }.table-wrap { overflow:auto; } table { width:100%; border-collapse:collapse; text-align:left; white-space:nowrap; } th { padding:11px 13px; color:var(--subtle); border-bottom:1px solid var(--line); background:#0d100e; font-size:10px; font-weight:650; letter-spacing:.3px; } td { padding:12px 13px; border-bottom:1px solid var(--line); font-feature-settings:"tnum"; font-size:11px; } tr:last-child td { border-bottom:0; }.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }.form-grid label { color:var(--muted); font-size:11px; font-weight:650; }.form-grid .primary { grid-column:1 / -1; margin-top:3px; }
@media (max-width:1080px) { .metric-grid { grid-template-columns:repeat(3,1fr); }.two-column { grid-template-columns:1fr; } }
@media (max-width:760px) { .sidebar { position:static; width:100%; min-height:auto; }.sidebar nav { grid-template-columns:repeat(3,1fr); }.sidebar-foot { margin-top:16px; }.app-shell { display:block; } main { width:100%; margin:0; padding:22px 14px 56px; }.topbar { align-items:flex-start; flex-direction:column; }.metric-grid { grid-template-columns:repeat(2,1fr); }.section-head { align-items:flex-start; flex-direction:column; }.form-grid { grid-template-columns:1fr; }.capability-list { grid-template-columns:1fr; } }
.grid>*,.panel,.panel-head,.panel-head>* { min-width:0; }.panel-head>span { overflow-wrap:anywhere; text-align:right; }
@media (max-width:760px) { .table-panel { overflow:visible; background:transparent; }.table-wrap { overflow:visible; } table,tbody,tr,td { display:block; width:100%; }.table-wrap thead { display:none; } tbody { display:grid; gap:9px; } tbody tr { padding:5px 12px; border:1px solid var(--line); border-radius:9px; background:var(--surface); } tbody td { display:flex; min-width:0; align-items:flex-start; justify-content:space-between; gap:14px; padding:8px 0; white-space:normal; border-bottom:1px solid var(--line); text-align:right; overflow-wrap:anywhere; } tbody td::before { content:attr(data-label); flex:0 0 auto; color:var(--subtle); font-size:10px; font-weight:650; } tbody td:last-child { border-bottom:0; } tbody td .state { max-width:68%; overflow-wrap:anywhere; text-align:right; } tbody .empty-table-row td { display:block; border:0; text-align:left; } tbody .empty-table-row td::before { content:none; } }
@media (max-width:360px) { .sidebar nav { grid-template-columns:repeat(2,minmax(0,1fr)); }.sidebar nav a { min-width:0; text-align:center; }.panel-head { align-items:flex-start; }.panel-head>span { max-width:58%; } }
.login-card label+label { margin-top:14px; }.topbar-actions { align-items:center; }.grid-panel { margin-top:12px; }.rule-actions { display:flex; gap:8px; margin-top:16px; }.rule-actions button { flex:1; }.small-button[disabled],.primary[disabled],.secondary[disabled] { cursor:not-allowed; opacity:.45; }
@media (max-width:760px) { .topbar-actions { width:100%; flex-wrap:wrap; }.topbar-actions #admin-identity { margin-right:auto; }.rule-actions { flex-direction:column; } }
.state.signed { color:var(--success); background:rgba(112,184,135,.1); }.state.pending,.state.pending_second_approval,.state.under_review { color:var(--warning); background:rgba(214,173,105,.1); }