@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;
:root { --bg: #0a0a0f; --surface: #12121a; --surface-2: #1a1a26; --surface-3: #222232; --border: #2a2a3a; --accent: #6366f1; --accent-hover: #818cf8; --accent-muted: rgba(99,102,241,.15); --text: #e8e8ef; --text-muted: #8888a8; --text-subtle: #555570; --success: #22c55e; --warning: #f59e0b; --danger: #ef4444; --radius: 10px; --radius-sm: 6px; --radius-lg: 16px; --sidebar-width: 220px; --topbar-height: 56px; font-family: "Inter", system-ui, sans-serif; font-size: 14px; line-height: 1.5; } 400;500;600;700&display=swap');
*,*::before,*::after {box-sizing: border-box; margin: 0; padding: 0;} body {background: var(--bg); color: var(--text); min-height: 100vh; overflow-x: hidden;} a {color: var(--accent); text-decoration: none;} a:hover {color: var(--accent-hover);} button {cursor: pointer; font-family: inherit; font-size: inherit; border: none; background: none; color: inherit;} ::-webkit-scrollbar {width: 6px; height: 6px;} ::-webkit-scrollbar-track {background: var(--surface);} ::-webkit-scrollbar-thumb {background: var(--border); border-radius: 3px;} .layout {display: flex; min-height: 100vh;} .main-content {flex: 1; margin-left: var(--sidebar-width); padding-top: var(--topbar-height); min-height: 100vh; background: var(--bg);} @media (max-width: 767px) {.main-content {margin-left: 0; padding-bottom: 64px;} .sidebar-el {display: none;}} @media (min-width: 768px) and (max-width: 1279px) {:root { --sidebar-width: 64px; } .sidebar-label {display: none;}} .page-container {padding: 24px; max-width: 1400px; margin: 0 auto;} @media (max-width: 767px) {.page-container {padding: 16px;}});