:root{
  --brand:#0b5d4b;--brand-dark:#063c33;--brand-blue:#0f4c81;--brand-blue-dark:#0a345a;
  --accent:#16a085;--bg:#f4f7fb;--surface:#ffffff;--surface-2:#f8fafc;--border:#e5eaf0;
  --ink:#172033;--muted:#708090;--shadow:0 10px 32px rgba(15,35,55,.08);
  --sidebar-w:270px;--sidebar-mini:86px;
}
html[data-theme="dark"]{
  --bg:#0d1520;--surface:#141f2c;--surface-2:#192636;--border:#26384b;--ink:#ecf3f8;--muted:#9eb0bf;
  --shadow:0 10px 32px rgba(0,0,0,.2)
}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;transition:background .2s,color .2s}
a{color:inherit}.app-shell{min-height:100vh}.topbar{height:72px;position:fixed;top:0;right:0;left:var(--sidebar-w);z-index:1020;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 24px;transition:left .25s,background .2s}html[data-theme="dark"] .topbar{background:rgba(20,31,44,.92)}
.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar-w);z-index:1030;background:linear-gradient(180deg,var(--brand-dark) 0%,#074a50 52%,var(--brand-blue-dark) 100%);color:#fff;display:flex;flex-direction:column;transition:width .25s,transform .25s;box-shadow:8px 0 30px rgba(0,34,43,.12)}
.sidebar-brand{height:84px;padding:14px 16px;display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(255,255,255,.1)}.brand-logo{width:50px!important;height:50px!important;max-width:50px!important;max-height:50px!important;object-fit:contain!important;display:block!important;flex:0 0 50px;border-radius:13px;background:#fff;padding:3px}.brand-copy{line-height:1.15;min-width:0}.brand-copy strong{display:block;font-size:1rem;white-space:nowrap}.brand-copy small{display:block;margin-top:5px;color:rgba(255,255,255,.72);white-space:nowrap;font-size:.72rem}
.sidebar-menu{padding:12px 10px;overflow-y:auto;flex:1}.menu-caption{padding:11px 12px 6px;color:rgba(255,255,255,.45);font-size:.66rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.sidebar-menu a{color:rgba(255,255,255,.83);border-radius:12px;margin:4px 0;padding:11px 12px;display:flex;gap:11px;align-items:center;text-decoration:none;transition:.18s}.sidebar-menu a:hover,.sidebar-menu a.active{background:rgba(255,255,255,.12);color:#fff}.menu-icon{width:24px;text-align:center;font-size:1.05rem;flex:0 0 24px}.menu-label{white-space:nowrap}.sidebar-footer{padding:12px 14px 16px;border-top:1px solid rgba(255,255,255,.1);font-size:.74rem;color:rgba(255,255,255,.6)}
.main-wrap{margin-left:var(--sidebar-w);padding-top:72px;min-height:100vh;transition:margin-left .25s}.main-content{padding:26px}.page-title{font-weight:800;letter-spacing:-.025em;margin:0}.page-subtitle{color:var(--muted);margin-top:5px}.top-actions{display:flex;align-items:center;gap:10px}.icon-btn{width:40px;height:40px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--ink);display:grid;place-items:center;cursor:pointer}.user-chip{display:flex;align-items:center;gap:10px}.user-avatar{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--brand),var(--brand-blue));color:#fff;display:grid;place-items:center;font-weight:800}.user-meta{line-height:1.15}.user-meta strong{display:block;font-size:.88rem}.user-meta small{color:var(--muted);font-size:.73rem}
.card{background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow);color:var(--ink)}.card-header{background:transparent;border-color:var(--border)}.stat-card{height:100%;position:relative;overflow:hidden}.stat-card:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-28px;top:-28px;background:linear-gradient(135deg,rgba(22,160,133,.08),rgba(15,76,129,.08))}.stat-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(11,93,75,.12),rgba(15,76,129,.12));color:var(--brand-blue);font-size:1.18rem}.stat{font-size:1.85rem;font-weight:850;line-height:1}.text-muted{color:var(--muted)!important}.progress{background:var(--surface-2);border-radius:999px}.progress-bar{border-radius:999px;background:linear-gradient(90deg,var(--brand),var(--accent))}.badge-soft{background:rgba(22,160,133,.13);color:#0d7d68}.table{color:var(--ink)}.table>:not(caption)>*>*{background:transparent;border-color:var(--border)}.table thead th{background:var(--surface-2);color:var(--muted)}.form-control,.form-select{background:var(--surface);color:var(--ink);border-color:var(--border)}.form-control:focus,.form-select:focus{background:var(--surface);color:var(--ink);border-color:#4b8fba;box-shadow:0 0 0 .2rem rgba(15,76,129,.1)}.btn-brand{background:linear-gradient(135deg,var(--brand),var(--brand-blue));border:0;color:#fff}.btn-brand:hover{color:#fff;filter:brightness(.96)}
.notice-card{border-left:4px solid #f59e0b}.notice-item{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px dashed var(--border)}.notice-item:last-child{border:0}.chart-wrap{position:relative;height:300px}.footer-app{text-align:center;color:var(--muted);padding:12px 24px 26px;font-size:.76rem}
body.sidebar-collapsed .sidebar{width:var(--sidebar-mini)}body.sidebar-collapsed .topbar{left:var(--sidebar-mini)}body.sidebar-collapsed .main-wrap{margin-left:var(--sidebar-mini)}body.sidebar-collapsed .brand-copy,body.sidebar-collapsed .menu-label,body.sidebar-collapsed .menu-caption,body.sidebar-collapsed .sidebar-footer span{display:none}body.sidebar-collapsed .sidebar-brand{justify-content:center;padding-inline:10px}body.sidebar-collapsed .sidebar-menu a{justify-content:center;padding-inline:8px}.mobile-overlay{display:none}
/* Landing v1.3 */
.public-body{min-height:100vh;background:#04151c;color:#eaf4f3}.public-nav{position:sticky;top:0;z-index:20;background:rgba(4,21,28,.96);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08);color:#fff}.public-nav .text-muted{color:rgba(255,255,255,.65)!important}.public-logo{width:52px!important;height:52px!important;max-width:52px!important;max-height:52px!important;object-fit:contain!important;display:block!important;background:#fff;border-radius:13px;padding:3px;flex:0 0 52px}.hero{position:relative;overflow:hidden;padding:84px 0 76px;background:linear-gradient(135deg,#031b20 0%,#063c33 45%,#082d4f 100%);color:#fff}.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.04)}.hero:before{width:420px;height:420px;right:-150px;top:-190px}.hero:after{width:260px;height:260px;left:-100px;bottom:-130px}.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(255,255,255,.07);font-size:.8rem}.hero h1{font-size:clamp(2.25rem,5vw,4.6rem);font-weight:900;letter-spacing:-.045em;line-height:.98}.hero-lead{max-width:760px;color:rgba(255,255,255,.8);font-size:1.08rem}.public-body #fitur{background:#071b24;color:#f4f8f8}.public-body #fitur .text-muted{color:#9fb1b8!important}.public-body .feature-card{height:100%;border-radius:20px;background:#0b2530;border:1px solid rgba(255,255,255,.08);box-shadow:0 14px 40px rgba(0,0,0,.18);color:#f7fbfb}.public-body .feature-card .text-muted{color:#a9bbc2!important}.feature-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(22,160,133,.18),rgba(15,76,129,.22));color:#78d5bf;font-weight:800}.public-footer{background:#031218;color:rgba(255,255,255,.67);border-top:1px solid rgba(255,255,255,.06)}
@media(max-width:991.98px){.sidebar{transform:translateX(-100%);width:var(--sidebar-w)}.topbar{left:0;padding:0 14px}.main-wrap{margin-left:0}.main-content{padding:18px 14px}.user-meta{display:none}body.mobile-menu-open .sidebar{transform:translateX(0)}body.mobile-menu-open .mobile-overlay{display:block;position:fixed;inset:0;background:rgba(5,15,25,.45);z-index:1025}.brand-logo{width:46px!important;height:46px!important;max-width:46px!important;max-height:46px!important;flex-basis:46px}.chart-wrap{height:260px}}
@media(max-width:575.98px){.topbar{height:64px}.main-wrap{padding-top:64px}.main-content{padding:16px 11px}.card{border-radius:15px}.stat{font-size:1.55rem}.hero{padding:62px 0 56px}.public-logo{width:48px!important;height:48px!important;max-width:48px!important;max-height:48px!important}.hero h1{font-size:2.5rem}.top-actions{gap:6px}.icon-btn{width:38px;height:38px}}
