:root[data-theme=dark]{--bg: #0c0e10;--bg-tint: radial-gradient(1200px 800px at 120% -10%, rgba(140, 220, 255, .06), transparent 60%), radial-gradient(900px 700px at -20% 110%, rgba(120, 255, 214, .04), transparent 60%), #0c0e10;--glass: rgba(20,22,26,.55);--glass-strong: rgba(20,22,26,.72);--surface: #13161a;--surface-soft: #101315;--muted: #14171a;--border: rgba(255,255,255,.1);--text: #e7eef5;--subtle: #9aa6b2;--accent: #68e1fd;--accent-2: #84f3cf;--danger: #ff6b7d;--warn: #ffd166;--shadow: 0 10px 30px rgba(0,0,0,.4);--hover-glow: 0 0 0 0 rgba(0,0,0,0);--hover-glow-accent: 0 6px 22px rgba(104, 225, 253, .22);--hover-glow-accent-2: 0 6px 22px rgba(132, 243, 207, .22)}:root[data-theme=light]{--bg: #f6f8fb;--bg-tint: radial-gradient(1000px 700px at 110% -10%, rgba(140, 220, 255, .12), transparent 60%), radial-gradient(800px 600px at -20% 110%, rgba(120, 255, 214, .08), transparent 60%), #f6f8fb;--glass: rgba(255,255,255,.55);--glass-strong: rgba(255,255,255,.82);--surface: #ffffff;--surface-soft: #ffffff;--muted: rgba(0,0,0,.035);--border: rgba(0,0,0,.1);--text: #1a2430;--subtle: #5a6a78;--accent: #1fa3c7;--accent-2: #18b892;--danger: #db5166;--warn: #e7a91a;--shadow: 0 8px 26px rgba(0,0,0,.08);--hover-glow: 0 0 0 0 rgba(0,0,0,0);--hover-glow-accent: 0 10px 24px rgba(31, 163, 199, .18);--hover-glow-accent-2: 0 10px 24px rgba(24, 184, 146, .18)}:root{color-scheme:light dark}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol;background:var(--bg-tint);color:var(--text);transition:background-color .3s ease,color .3s ease,background-image .6s ease}a{color:inherit;text-decoration:none}input,select,button,textarea{font:inherit}:focus-visible{outline:2px solid color-mix(in oklab,var(--accent) 65%,var(--accent-2) 35%);outline-offset:2px;border-radius:10px}:root{--sidebar-w: 260px;--sidebar-w-collapsed: 76px}.layout{display:grid;grid-template-columns:var(--sidebar-w) 1fr;min-height:100vh}.layout.collapsed{grid-template-columns:var(--sidebar-w-collapsed) 1fr}.sidebar{padding:18px;border-right:1px solid var(--border);background:var(--glass);backdrop-filter:blur(14px) saturate(120%);-webkit-backdrop-filter:blur(14px) saturate(120%)}.layout.collapsed .brand .text,.layout.collapsed .nav .label{display:none}.brand{display:flex;align-items:center;gap:10px;margin-bottom:16px}.brand .brand-logo{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,#ffffff1a,#ffffff05);border:1px solid var(--border)}.brand .text{font-weight:700;letter-spacing:.2px}.nav{display:grid;gap:6px}.nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;color:var(--subtle);border:1px solid transparent;transition:transform .06s ease,background .2s ease,color .2s ease,box-shadow .25s ease}.nav a:hover{color:var(--text);background:color-mix(in oklab,var(--muted) 85%,transparent);box-shadow:var(--hover-glow-accent)}.nav a.active{color:var(--text);background:linear-gradient(180deg,color-mix(in oklab,var(--muted) 70%,transparent),transparent);border-color:var(--border)}.main{display:grid;grid-template-rows:auto 1fr}.header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-bottom:1px solid var(--border);background:color-mix(in oklab,var(--surface-soft) 92%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.content{padding:20px}.glass{background:var(--glass);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);backdrop-filter:blur(12px) saturate(120%);-webkit-backdrop-filter:blur(12px) saturate(120%)}.glass-strong{background:var(--glass-strong);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}.card{background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 14px;border-radius:12px;background:color-mix(in oklab,var(--surface) 92%,transparent);color:var(--text);border:1px solid var(--border);cursor:pointer;transition:transform .06s ease,background .2s ease,border-color .2s ease,box-shadow .25s ease,filter .2s ease}.btn:hover{background:color-mix(in oklab,var(--muted) 80%,transparent);box-shadow:var(--hover-glow-accent)}.btn:active{transform:translateY(1px) scale(.99)}.btn.primary{background:color-mix(in oklab,var(--accent) 10%,var(--surface));border-color:color-mix(in oklab,var(--accent) 22%,var(--border))}.btn.primary:hover{box-shadow:var(--hover-glow-accent)}.btn.ghost{background:transparent;border-color:var(--border)}.btn.circle{width:38px;height:38px;border-radius:999px;padding:0}.btn.small{padding:6px 10px;border-radius:10px}.btn.tiny{padding:4px 8px;border-radius:9px;font-size:.85rem}.icon{font-size:1.1rem;line-height:1}.input,.select,.textarea{width:100%;padding:10px 12px;background:color-mix(in oklab,var(--surface) 92%,transparent);color:var(--text);border:1px solid var(--border);border-radius:12px;transition:border-color .2s ease,box-shadow .25s ease,background .2s ease}.input::placeholder,.textarea::placeholder{color:color-mix(in oklab,var(--subtle) 80%,var(--text))}.input:focus,.select:focus,.textarea:focus{border-color:color-mix(in oklab,var(--accent) 50%,var(--accent-2) 50%);box-shadow:0 0 0 3px color-mix(in oklab,var(--accent) 30%,transparent),0 0 0 6px color-mix(in oklab,var(--accent-2) 18%,transparent)}.table{width:100%;border-collapse:collapse;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow)}.table th,.table td{padding:12px 14px}.table thead th{text-align:left;font-weight:600;color:var(--subtle);background:color-mix(in oklab,var(--muted) 75%,transparent)}.table tbody tr{border-top:1px solid var(--border)}.table tbody tr:hover{background:color-mix(in oklab,var(--muted) 65%,transparent)}.chips{display:inline-flex;gap:6px;flex-wrap:wrap}.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;font-size:.85rem;border:1px solid var(--border);background:color-mix(in oklab,var(--surface) 92%,transparent);color:var(--text)}.chip.ok{border-color:color-mix(in oklab,var(--accent-2) 40%,var(--border))}.chip.warn{border-color:color-mix(in oklab,var(--warn) 40%,var(--border))}.chip.bad{border-color:color-mix(in oklab,var(--danger) 40%,var(--border))}.chip.muted{color:var(--subtle)}.modal-backdrop{position:fixed;inset:0;background:#00000073;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:grid;place-items:center;z-index:50;animation:fadeIn .18s ease-out}.modal{width:min(560px,92vw);background:var(--glass-strong);color:var(--text);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);animation:popUp .16s ease-out;display:flex;flex-direction:column;max-height:90vh}.modal header{padding:10px 12px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px dashed var(--border);flex-shrink:0}.modal footer{display:flex;justify-content:flex-end;gap:8px;margin-top:12px;border-top:1px dashed var(--border);padding:10px 12px;flex-shrink:0}.modal .modal-content{padding:12px;overflow-y:auto;flex-grow:1;min-height:0}.login-wrapper{position:relative;min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--bg-tint)}.login-card{background:var(--glass-strong);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);width:min(440px,92vw);padding:22px 20px 18px}.brand-mark{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#ffffff1a,#ffffff05);border:1px solid var(--border)}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin-bottom:16px}.stat{padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--surface);box-shadow:var(--shadow);transition:box-shadow .25s ease,transform .06s ease}.stat .label{color:var(--subtle);font-size:.9rem}.stat .value{font-size:1.6rem;font-weight:700;margin-top:4px}.stat .hint{color:var(--subtle);font-size:.85rem;margin-top:2px}.stat:hover{box-shadow:var(--hover-glow-accent-2);transform:translateY(-1px)}.chart-row{display:grid;grid-template-columns:1.2fr 1fr;gap:12px}@media (max-width: 980px){.chart-row{grid-template-columns:1fr}}.chart-card{padding:12px}.skeleton{background:linear-gradient(90deg,#ffffff0a,#ffffff1f,#ffffff0a);background-size:200% 100%;animation:sk 1.2s linear infinite;border-radius:12px}*::-webkit-scrollbar{height:10px;width:10px}*::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#68e1fd73,#84f3cf73);border-radius:999px}*::-webkit-scrollbar-track{background:#ffffff0a}@keyframes sk{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes fadeIn{0%{opacity:.4}to{opacity:1}}@keyframes popUp{0%{opacity:.7;transform:translateY(6px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}.btn.primary:hover{box-shadow:var(--hover-glow-accent),0 0 0 1px #ffffff0a inset}.brand-gradient{background:linear-gradient(90deg,color-mix(in oklab,var(--accent) 60%,var(--text)),color-mix(in oklab,var(--accent-2) 60%,var(--text)));-webkit-background-clip:text;background-clip:text;color:transparent}.login-options{display:flex;justify-content:space-between;align-items:center;margin-top:4px}.login-options .remember{display:inline-flex;gap:8px;align-items:center;color:var(--subtle)}.login-options input[type=checkbox]{width:16px;height:16px;accent-color:color-mix(in oklab,var(--accent) 60%,var(--accent-2) 40%)}.link-quiet{color:var(--subtle);text-decoration:none;border-bottom:1px dashed transparent;transition:color .2s ease,border-color .2s ease}.link-quiet:hover{color:var(--text);border-color:var(--border)}.spin{animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.helper-error{margin-top:6px}.login-form{display:grid;gap:16px}.field{display:grid;gap:8px;margin-bottom:4px}.login-options{margin-top:2px}.helper-error{margin-top:8px}.login-submit{margin-top:10px}@media (max-width: 480px){.login-submit{width:100%}}.input-affix{position:relative}.input-affix .input{padding-right:42px}.affix-btn{position:absolute;right:6px;top:50%;transform:translateY(-50%);height:28px;min-width:28px;padding:0 6px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--subtle);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s ease,color .2s ease,box-shadow .25s ease,border-color .2s ease}.affix-btn:hover{color:var(--text);background:color-mix(in oklab,var(--muted) 80%,transparent);box-shadow:var(--hover-glow-accent);border-color:color-mix(in oklab,var(--accent) 22%,var(--border))}.affix-btn:active{transform:translateY(-50%) scale(.98)}.toast-container{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:10px;z-index:10001}.toast{padding:12px 16px;border-radius:12px;background:color-mix(in oklab,var(--surface-soft) 95%,transparent);border:1px solid var(--border);color:var(--text);box-shadow:var(--shadow);cursor:pointer;animation:toastIn .2s ease-out;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);width:max-content;max-width:320px}.toast.success{border-left:3px solid var(--accent-2)}.toast.error{border-left:3px solid var(--danger)}.toast.info{border-left:3px solid var(--accent)}@keyframes toastIn{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
