*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0f1117;--bg2: #171921;--bg3: #1e2130;--border: rgba(255,255,255,.07);--border2: rgba(255,255,255,.12);--text: #e8eaf0;--text2: #8b909e;--text3: #555b6e;--accent: #4f7cff;--accent2: #3d6aff;--green: #3ecf8e;--red: #f87171;--amber: #fbbf24;--purple: #a78bfa;--font: "DM Sans", system-ui, sans-serif;--mono: "DM Mono", monospace;--radius: 10px;--radius-lg: 14px}html,body{height:100%;background:var(--bg);color:var(--text);font-family:var(--font);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}#root{height:100%;display:flex}a{color:inherit;text-decoration:none}button{cursor:pointer;font-family:var(--font)}input,textarea,select{font-family:var(--font)}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}.app-layout{display:flex;width:100%;height:100%}.app-sidebar{width:220px;flex-shrink:0;background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:24px 0}.app-main{flex:1;overflow:auto;padding:32px 40px}.app-bottom-nav{display:none}.grid-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.grid-3col{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.grid-4col{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}@media (max-width: 768px){.app-sidebar{display:none}.app-main{padding:20px 16px 90px}.app-bottom-nav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:100;background:var(--bg2);border-top:1px solid var(--border);padding:8px 0 max(8px,env(safe-area-inset-bottom))}.app-bottom-nav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:4px 0;font-size:10px;color:var(--text3);transition:color .15s}.app-bottom-nav a.active{color:var(--accent)}.grid-2col{grid-template-columns:1fr}.grid-3col,.grid-4col{grid-template-columns:1fr 1fr}.hide-mobile{display:none!important}.mobile-full{width:100%;justify-content:center}}@media (max-width: 480px){.app-main{padding:16px 12px 90px}.grid-4col{grid-template-columns:1fr 1fr}}@keyframes spin{to{transform:rotate(360deg)}}
