:root{color-scheme:light;--navy:#17324b;--gold:#c6a460;--muted:#748598;--line:#e4eaf0}*{box-sizing:border-box}body{margin:0;background:#f3f5f7;color:var(--navy);font:15px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif}aside{position:fixed;inset:0 auto 0 0;width:250px;padding:36px 24px;background:linear-gradient(155deg,#19324b,#0b1d30);color:#e8edf3;overflow:auto}.eyebrow{color:#a8823e;font-size:11px;font-weight:700;letter-spacing:2.2px}.demo-title{font-size:23px;font-weight:650;margin:12px 0}.sidebar-note{font-size:12px;color:#a9b9ca}.nav-label{margin:36px 12px 16px;font-size:10px;color:#a9b9ca;letter-spacing:2px}.nav-item{padding:11px 14px;margin:4px 0;color:#b9c7d5;font-size:13px}.nav-item.active{border:1px solid #526071;border-left:3px solid var(--gold);border-radius:7px;color:#e1c995;background:#ffffff0a}.nav-item small{display:block;font-size:9px;opacity:.7}.bottom{margin:24px 14px}.workspace{margin-left:250px}header{min-height:75px;border-top:5px solid var(--gold);background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:16px 32px;font-size:12px;color:var(--muted)}.badge,.tag{background:#f6efdf;color:#927139;border-radius:5px;padding:6px 10px;font-size:10px;font-weight:600;white-space:nowrap}.content{padding:30px 32px}h1{font-size:32px;letter-spacing:-1px;line-height:1.2;margin:12px 0}p{color:var(--muted)}.intro>p:last-child{margin-top:14px}.notice{font-size:12px;background:#e9eff4;border:1px solid #d6e0e9;padding:12px 16px;border-radius:7px;margin:25px 0}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.metrics article,.panel{background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px}.metrics article{border-top:3px solid var(--gold)}.metrics p{font-size:12px;margin:0 0 20px}.metrics h2{font-size:27px;letter-spacing:-1px;margin:0 0 10px}.metrics h2 span{font-size:20px;color:var(--muted)}small,.hint{font-size:11px;color:var(--muted)}.details{display:grid;grid-template-columns:1.45fr 1fr;gap:22px;margin-top:24px}.panel h2{margin:0 0 24px;font-size:20px;display:flex;align-items:center;justify-content:space-between;gap:10px}.panel h2 .tag{font-size:10px}table{width:100%;border-collapse:collapse;font-size:12px}th{text-align:left;background:#f5f7f9;color:var(--muted);font-size:10px;font-weight:600;text-transform:uppercase}td,th{padding:13px 10px;border-bottom:1px solid #edf0f4}td small{display:block;font-size:10px}.number{text-align:right;white-space:nowrap}.chart{height:250px;display:flex;align-items:end;justify-content:space-around;gap:24px;padding:0 14px;margin:32px 0 22px}.chart>div{width:28%;text-align:center;font-size:11px;color:var(--muted)}.bar{border-radius:4px 4px 0 0;margin-bottom:12px}.kh{height:63px;background:#bed0df}.vn{height:105px;background:#d9c392}.ch{height:210px;background:#244764}.flow{margin-top:24px;padding:22px 24px;background:#fff;border:1px solid var(--line);border-radius:12px}.flow>div{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#a8823e}.flow strong{color:var(--navy);margin-left:8px}.flow .hint{margin-bottom:0}.login{display:grid;place-items:center;min-height:100vh;background:linear-gradient(135deg,#10273d,#244763)}.login-card{padding:52px;max-width:520px;margin:24px;border-radius:18px;background:#fff;border-top:4px solid var(--gold);box-shadow:0 20px 80px #0003}.login h1{font-size:43px}.login button{border:0;border-radius:7px;background:var(--navy);color:white;width:100%;padding:16px 20px;font:600 15px system-ui;cursor:pointer;margin:15px 0}.login button:hover{background:#294d6a}.login button:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.login button span{float:right}.login .hint{text-align:center;line-height:1.8}@media(min-width:1650px){.content{max-width:1650px;margin:auto}}@media(max-width:1150px){aside{width:210px;padding:26px 18px}.workspace{margin-left:210px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.details{grid-template-columns:1fr}.chart{height:240px}}@media(max-width:640px){aside{position:static;width:100%;padding:16px 20px}.demo-title{font-size:20px;margin:0}.nav-label,.nav-item,.sidebar-note,aside>.eyebrow{display:none}.workspace{margin-left:0}header{padding:15px 18px;font-size:10px}.content{padding:20px 16px}h1{font-size:27px}.metrics{gap:10px}.metrics article{padding:15px}.metrics h2{font-size:22px}.metrics p{min-height:36px;margin-bottom:12px}.panel{padding:18px 12px}td,th{padding:12px 6px}.flow>div{flex-wrap:wrap;font-size:12px}.flow{padding:18px}.login-card{padding:32px 24px}.login h1{font-size:34px}}
