:root{--bg:#f5f8fc;--panel:#fff;--text:#102033;--muted:#6f7f92;--line:#e6edf5;--nav:#0f1b2b;--blue:#2f80ed;--shadow:0 8px 24px #14285012;--radius:14px}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:Inter,sans-serif}#login-view{flex-direction:column;justify-content:center;align-items:center;height:100vh;display:flex}.login-card{background:var(--panel);text-align:center;border-radius:var(--radius);width:320px;box-shadow:var(--shadow);border:1px solid var(--line);padding:30px}.login-card input{border:1px solid var(--line);box-sizing:border-box;border-radius:8px;outline:none;width:100%;margin-bottom:15px;padding:12px;font-size:14px}.login-card button{background:var(--blue);color:#fff;cursor:pointer;border:none;border-radius:8px;width:100%;padding:12px;font-size:14px;font-weight:700}.topbar{color:#fff;z-index:20;background:linear-gradient(90deg,#0c1827,#132338);align-items:center;gap:28px;height:70px;padding:0 24px;display:flex;position:sticky;top:0;box-shadow:0 4px 16px #0000002e}.brandtext{letter-spacing:.22em;font-size:17px;font-weight:800;line-height:1}.nav{align-items:stretch;gap:6px;height:100%;display:flex}.nav a{color:#c7d2df;border-bottom:3px solid #0000;flex-direction:column;justify-content:center;align-items:center;gap:5px;min-width:90px;padding:0 13px;font-size:11px;text-decoration:none;display:flex}.nav a.active{color:#fff;background:#ffffff0f;border-color:#4da3ff}.top-controls{align-items:center;gap:10px;margin-left:auto;display:flex}.select,.date-input,.theme-toggle{color:#fff;background:#1c2b40;border:1px solid #ffffff1a;border-radius:9px;outline:none;padding:10px 12px;font-size:12px}.date-input{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.theme-toggle{cursor:pointer;font-weight:700}.page{padding:22px 24px 36px}h1{margin:0;font-size:28px}.subtitle{color:var(--muted);margin-top:4px;margin-bottom:18px;font-size:13px}.grid-kpi{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px;display:grid}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.active-members-card{flex-direction:column;justify-content:center;align-items:stretch;padding:18px 18px 16px;display:flex}.active-card-wrap{justify-content:space-between;align-items:center;gap:18px;width:100%;display:flex}.active-card-left{min-width:120px}.kpi-title{color:#4f6177;margin-bottom:5px;font-size:13px;font-weight:700}.kpi-value{letter-spacing:-.03em;font-size:30px;font-weight:800}.active-card-right{align-items:center;gap:14px;margin-left:auto;display:flex}.status-donut{background:#d9e1ea;border-radius:50%;flex:none;width:92px;height:92px;transition:background .3s;position:relative}.status-donut:after{content:"";background:#fff;border-radius:50%;position:absolute;inset:16px}.status-donut-center{z-index:2;color:var(--text);place-items:center;font-size:16px;font-weight:800;display:grid;position:absolute;inset:0}.status-legend{gap:8px;min-width:110px;display:grid}.status-row{grid-template-columns:10px 1fr auto;align-items:center;gap:8px;font-size:12px;display:grid}.status-dot{border-radius:50%;width:9px;height:9px}.status-name{color:var(--muted);font-weight:600}.status-value{color:var(--text);font-weight:800}body.dark{--bg:#0f1720;--panel:#16202c;--text:#f4f7fb;--muted:#9aa8ba;--line:#283445}body.dark .card{background:var(--panel)!important;color:var(--text)!important;border-color:var(--line)!important}body.dark .date-input,body.dark .theme-toggle,body.dark .select{color:#fff;background:#101926}body.dark .status-donut:after{background:var(--panel)}@media (width<=1200px){.active-card-wrap{flex-direction:column;align-items:flex-start}.active-card-right{margin-left:0}}@media (width<=800px){.grid-kpi{grid-template-columns:1fr}}.status-row{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:8px;padding:4px 6px;transition:opacity .2s,background .2s,transform .15s}.status-row:hover{background:#0000000d}body.dark .status-row:hover{background:#ffffff0f}.status-row:active{transform:scale(.98)}.status-row.is-off{opacity:.38}.status-row.is-off .status-name,.status-row.is-off .status-value{text-decoration:line-through}.status-row.is-off .status-dot{filter:grayscale()}.logout-btn{color:#ff6b6b;cursor:pointer;background:#d930251a;border:1px solid #d930254d;border-radius:9px;outline:none;padding:10px 12px;font-size:12px;font-weight:700;transition:all .2s}.logout-btn:hover{color:#ff4c4c;background:#d9302533}