:root[data-theme="dark"]{--v6-bg:#0B0F19;--v6-panel:rgba(255,255,255,.04);--v6-border:rgba(255,255,255,.08);--v6-text:#fff;--v6-muted:#94A3B8;--v6-violet:#8B5CF6;--v6-emerald:#10B981;--v6-amber:#F59E0B}
[data-theme="dark"] body{background:radial-gradient(circle at 12% -5%,rgba(139,92,246,.17),transparent 30rem),radial-gradient(circle at 90% 15%,rgba(34,211,238,.09),transparent 26rem),var(--v6-bg);color:var(--v6-text);font-family:Inter,"Plus Jakarta Sans",ui-sans-serif,system-ui,sans-serif}
[data-theme="dark"] .top{background:rgba(11,15,25,.82);border-bottom:1px solid var(--v6-border);box-shadow:none;backdrop-filter:blur(18px)}[data-theme="dark"] .nav{background:rgba(11,15,25,.7);border-color:var(--v6-border)}[data-theme="dark"] .page{width:min(1120px,100%);padding-top:28px}
.dash-head{display:flex;justify-content:space-between;align-items:end;gap:22px;margin:2px 0 22px}.dash-head h1{font-size:clamp(26px,3vw,38px);line-height:1.15;letter-spacing:-.045em;margin:5px 0 7px}.dash-head p{margin:0;color:var(--v6-muted,#64748b);font-size:14px}.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:800;color:#A78BFA}.date-control{width:180px;color:var(--v6-muted,#64748b);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.glass{min-width:0;background:var(--v6-panel,white);border:1px solid var(--v6-border,#e5e7eb);border-radius:22px;padding:18px;box-shadow:0 18px 55px rgba(0,0,0,.16);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.glass h2{font-size:17px;letter-spacing:-.025em;margin:4px 0}.glass p{color:var(--v6-muted,#64748b)}
.metric{position:relative;min-height:150px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}.metric:after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-38px;top:-46px;background:currentColor;opacity:.09;filter:blur(2px)}.metric-icon{position:absolute;top:17px;left:18px;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.08);font-weight:900}.metric small{color:var(--v6-muted,#64748b);font-size:11px}.metric strong{font-size:35px;line-height:1;margin-top:4px;letter-spacing:-.04em}.metric p{font-size:11px;margin:8px 0 0}.metric.violet{color:#A78BFA}.metric.emerald{color:#34D399}.metric.amber{color:#FBBF24}.metric.rose{color:#FB7185}
.panel-title{display:flex;align-items:start;justify-content:space-between;gap:12px;margin-bottom:16px}.panel-title p{font-size:11px;margin:4px 0 0}.panel-note{font-size:10px;color:var(--v6-muted,#64748b);border:1px solid var(--v6-border,#e5e7eb);padding:5px 8px;border-radius:999px;white-space:nowrap}
.workload-panel{grid-column:span 2}.workload-list{display:grid;gap:14px}.work-row{display:flex;align-items:center;gap:11px}.avatar{width:35px;height:35px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,#8B5CF6,#6366F1);font-size:10px;font-weight:800;color:#fff}.work-main{flex:1;min-width:0}.work-main>div:first-child{display:flex;justify-content:space-between;gap:8px;margin-bottom:6px}.work-main strong{font-size:12px}.work-main span{font-size:10px;color:var(--v6-muted,#64748b)}.work-row>b{font-size:17px}.work-bar{height:5px;border-radius:99px;background:rgba(148,163,184,.14);overflow:hidden}.work-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#8B5CF6,#22D3EE)}
.status-panel{grid-column:span 2}.donut-wrap{display:flex;align-items:center;justify-content:center;gap:25px;min-height:150px}.donut{width:132px;height:132px;border-radius:50%;display:grid;place-items:center;position:relative}.donut:before{content:"";position:absolute;inset:19px;border-radius:50%;background:#111621}.donut>div{position:relative;display:grid;text-align:center}.donut strong{font-size:25px}.donut small{font-size:9px;color:var(--v6-muted)}.legend{display:grid;gap:7px;min-width:150px}.legend span{display:grid;grid-template-columns:8px 1fr auto;align-items:center;gap:7px;font-size:10px;color:var(--v6-muted)}.legend i{width:7px;height:7px;border-radius:50%}.legend b{color:#fff;font-size:11px}
.risk-panel{grid-column:span 1}.risk-list{display:grid;gap:8px}.risk-list>div{display:grid;grid-template-columns:9px 1fr auto;align-items:center;gap:8px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05);border-radius:11px;padding:9px}.risk-list strong{font-size:11px}.risk-list b{font-size:14px}.risk-dot{width:8px;height:8px;border-radius:50%}.risk-dot.r-Kritis{background:#FB7185}.risk-dot.r-Waspada{background:#FB923C}.risk-dot.r-Perhatian{background:#FBBF24}.risk-dot.r-Normal{background:#34D399}
.briefing-panel{grid-column:span 3}.brief-list{display:grid;gap:7px}.brief-row{width:100%;display:grid;grid-template-columns:8px minmax(0,1fr) auto auto 14px;align-items:center;gap:11px;text-align:left;border:1px solid rgba(255,255,255,.055);background:rgba(255,255,255,.025);color:inherit;border-radius:13px;padding:10px 11px;cursor:pointer;transition:.16s}.brief-row:hover{background:rgba(139,92,246,.09);border-color:rgba(139,92,246,.25);transform:translateX(2px)}.brief-row>span:nth-child(2){display:grid;min-width:0}.brief-row strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brief-row small{font-size:10px;color:var(--v6-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brief-row em{font-style:normal;font-size:9px;border-radius:999px;padding:4px 7px}.brief-row em.r-Kritis{background:rgba(251,113,133,.13);color:#FDA4AF}.brief-row em.r-Waspada{background:rgba(251,146,60,.13);color:#FDBA74}.brief-row em.r-Perhatian{background:rgba(245,158,11,.13);color:#FCD34D}.brief-row em.r-Normal{background:rgba(16,185,129,.13);color:#6EE7B7}.brief-row>b{font-size:10px;color:var(--v6-muted)}.brief-status{width:7px;height:28px;border-radius:99px}.brief-status.s-Baru{background:#60A5FA!important}.brief-status.s-Sedang-desain{background:linear-gradient(#A78BFA,#7C3AED)!important}.brief-status.s-Dijeda,.brief-status.s-Menunggu{background:#F59E0B!important}.brief-status.s-Preview{background:#22D3EE!important}.arrow{color:#64748B;font-size:17px}
[data-theme="light"] .glass{background:rgba(255,255,255,.78);box-shadow:0 16px 45px rgba(35,41,70,.08)}[data-theme="light"] .donut:before{background:#fff}[data-theme="light"] .legend b{color:#172033}[data-theme="light"] .brief-row{border-color:#e8eaf1;background:#fafbfe}[data-theme="light"] .risk-list>div{border-color:#e8eaf1;background:#fafbfe}
@media(max-width:900px){.bento{grid-template-columns:repeat(2,minmax(0,1fr))}.workload-panel,.status-panel,.briefing-panel{grid-column:span 2}.risk-panel{grid-column:span 2}.risk-list{grid-template-columns:repeat(4,1fr)}}@media(max-width:560px){.dash-head{align-items:start;flex-direction:column}.date-control{width:100%}.bento{gap:10px}.glass{padding:14px;border-radius:17px}.metric{min-height:125px}.metric strong{font-size:30px}.workload-panel,.status-panel,.risk-panel,.briefing-panel{grid-column:span 2}.donut-wrap{gap:15px}.donut{width:112px;height:112px}.risk-list{grid-template-columns:repeat(2,1fr)}.brief-row{grid-template-columns:7px minmax(0,1fr) auto 12px}.brief-row>b{display:none}.brief-row em{font-size:0;width:8px;height:8px;padding:0}.dash-head h1{font-size:27px}}