*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,sans-serif;background:#f5f8f8;color:#132323;line-height:1.55}.topbar{height:68px;background:#fff;border-bottom:1px solid #dfe7e7;display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:20}.brand{font-weight:800;font-size:1.25rem;color:#0f2d2d;text-decoration:none;letter-spacing:-.04em}.brand span{color:#0d9488}.topbar nav{display:flex;gap:10px;align-items:center}.shell{display:flex;min-height:calc(100vh - 68px)}.sidebar{width:240px;background:#102d2d;color:#d9eeee;padding:22px 14px;display:flex;flex-direction:column;gap:6px}.sidebar a{color:#d9eeee;text-decoration:none;padding:11px 13px;border-radius:10px}.sidebar a:hover{background:#174545}.sidebar i{width:22px}.content{width:100%;max-width:1400px;margin:auto;padding:30px}.footer{text-align:center;padding:28px;color:#617171}.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:100}.btn,.btn-outline{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:10px;padding:10px 15px;background:#0d9488;color:white;text-decoration:none;font-weight:700;cursor:pointer}.btn-outline{background:transparent;color:#0d766e;border:1px solid #0d9488}.icon-btn{border:0;background:transparent;font-size:1rem;padding:9px;cursor:pointer}.user-chip{font-size:.9rem;color:#536363}.hero{background:linear-gradient(135deg,#0d3c3a,#0d9488);color:#fff;border-radius:22px;padding:36px;box-shadow:0 12px 30px #12333322}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.card{background:#fff;border:1px solid #e2eaea;border-radius:16px;padding:20px;box-shadow:0 5px 18px #102d2d0c}.metric{font-size:2rem;font-weight:800}.progress{height:9px;background:#dfeaea;border-radius:999px;overflow:hidden}.progress>i{display:block;height:100%;background:#0d9488;width:var(--progress,0);transition:width 1s}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:12px;border-bottom:1px solid #e3eaea;text-align:left}.form{max-width:650px}.field{margin:14px 0}.field label{display:block;font-weight:700;margin-bottom:6px}.field input,.field select,.field textarea{width:100%;padding:12px;border:1px solid #cbd8d8;border-radius:10px;background:#fff;font:inherit}.flash{padding:13px 16px;border-radius:10px;margin-bottom:18px}.flash.success{background:#dcfce7;color:#166534}.flash.error{background:#fee2e2;color:#991b1b}.badge{width:105px;height:105px;border-radius:50%;background:#e1f5f2;border:5px solid #0d9488;display:flex;align-items:center;justify-content:center;font-size:2rem;color:#0d766e}.badge-grid{display:flex;gap:22px;flex-wrap:wrap}.muted{color:#607070}.actions{display:flex;gap:10px;flex-wrap:wrap}.rank{font-size:1.4rem}.offline{font-size:.85rem;color:#0d766e}@media(max-width:900px){.sidebar{width:74px}.sidebar a{font-size:0}.sidebar i{font-size:1rem}.grid{grid-template-columns:1fr 1fr}.content{padding:18px}}@media(max-width:620px){.topbar{padding:0 14px}.user-chip{display:none}.grid{grid-template-columns:1fr}.sidebar{position:fixed;bottom:0;left:0;right:0;width:100%;height:58px;z-index:30;flex-direction:row;justify-content:space-around;padding:5px}.sidebar a{font-size:.65rem;padding:7px}.sidebar i{display:block;margin:auto}.shell{padding-bottom:58px}.content{padding:14px}.hero{padding:25px}.table{min-width:650px}}body.dark{background:#0b1717;color:#e5eeee}body.dark .topbar,body.dark .card,body.dark .field input,body.dark .field select,body.dark .field textarea{background:#102222;color:#e5eeee;border-color:#284040}body.dark .brand{color:#fff}