@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-color:#0b0f19;--bg-surface:#151a28;--bg-surface-hover:#1e2433;--text-main:#f1f5f9;--text-muted:#94a3b8;--primary-accent:#6366f1;--primary-accent-hover:#4f46e5;--secondary-accent:#ec4899;--border-color:#ffffff14;--border-focus:#6366f180;--glass-bg:#151a2899;--glass-border:#ffffff1a;--glass-shadow:0 8px 32px 0 #0000005e;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--shadow-glow:0 0 15px #6366f166;--transition-fast:.15s ease-in-out;--transition-normal:.3s ease-in-out}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5;overflow:hidden}a{color:var(--primary-accent);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--text-main)}button{cursor:pointer;color:inherit;background:0 0;border:none;outline:none;font-family:inherit}.glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--bg-surface-hover);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary-accent)}h1,h2,h3,h4,h5,h6{color:var(--text-main);font-weight:600}.text-muted{color:var(--text-muted)}.flex{display:flex}.flex-col{flex-direction:column;display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:.5rem}.gap-4{gap:1rem}.w-full{width:100%}.h-full{height:100%}.btn-primary{background-color:var(--primary-accent);color:#fff;transition:all var(--transition-fast);box-shadow:var(--shadow-md);border-radius:6px;padding:.5rem 1rem;font-weight:500}.btn-primary:hover{background-color:var(--primary-accent-hover);box-shadow:var(--shadow-glow);transform:translateY(-1px)}.btn-secondary{background-color:var(--bg-surface);border:1px solid var(--border-color);color:var(--text-main);transition:all var(--transition-fast);border-radius:6px;padding:.5rem 1rem;font-weight:500}.btn-secondary:hover{background-color:var(--bg-surface-hover);border-color:var(--primary-accent)}.btn-icon{color:var(--text-muted);transition:all var(--transition-fast);border-radius:6px;justify-content:center;align-items:center;padding:.5rem;display:flex}.btn-icon:hover{background-color:var(--bg-surface-hover);color:var(--text-main)}#root{width:100vw;height:100vh;display:flex;overflow:hidden}.app-container{background:radial-gradient(circle at top left, #1e1b4b, var(--bg-color) 40%);flex:1;display:flex;position:relative;overflow:hidden}.sidebar{border-right:1px solid var(--border-color);width:260px;height:100%;transition:width var(--transition-normal);z-index:10;flex-direction:column;display:flex}.main-content{flex-direction:column;flex:1;display:flex;overflow:hidden}.top-nav{border-bottom:1px solid var(--border-color);z-index:5;align-items:center;height:60px;padding:0 1.5rem;display:flex}.board-canvas{flex:1;align-items:flex-start;gap:1.5rem;padding:1.5rem;display:flex;overflow:auto hidden}input,textarea{background-color:var(--bg-surface);border:1px solid var(--border-color);color:var(--text-main);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);border-radius:6px;padding:.5rem .75rem;font-family:inherit;font-size:.875rem}input:focus,textarea:focus{border-color:var(--primary-accent);box-shadow:0 0 0 2px var(--border-focus);outline:none}input::placeholder,textarea::placeholder{color:var(--text-muted)}.mobile-only-btn{display:none}.settings-modal-inner{display:flex}.settings-modal-tabs{border-right:1px solid var(--border-color);background-color:#0000001a;width:200px;padding:24px 16px}@media (width<=768px){.mobile-only-btn{color:var(--text-main);display:block}.sidebar{transition:left var(--transition-normal);z-index:50;background-color:var(--bg-surface);position:absolute;top:0;bottom:0;left:-260px}.sidebar.mobile-open{left:0}.sidebar-overlay{z-index:40;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#00000080;display:none;position:absolute;inset:0}.sidebar-overlay.mobile-open{display:block}.settings-modal-inner{flex-direction:column}.settings-modal-tabs{border-bottom:1px solid var(--border-color);display:flex;overflow-x:auto;border-right:none!important;width:100%!important;padding:12px 16px!important}.settings-modal-tabs h2{display:none}.settings-modal-tabs button{white-space:nowrap;margin-right:8px;width:auto!important;margin-bottom:0!important}.board-canvas{gap:1rem;padding:1rem}}[data-theme=light]{--bg-color:#f8fafc;--bg-surface:#fff;--bg-surface-hover:#f1f5f9;--text-main:#0f172a;--text-muted:#64748b;--border-color:#00000014;--border-focus:#6366f180;--glass-bg:#fffc;--glass-border:#0000000d;--glass-shadow:0 4px 16px #00000014;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--shadow-glow:0 0 15px #6366f133}[data-theme=light] .app-container{background:radial-gradient(circle at top left, #e0e7ff, var(--bg-color) 40%)}[data-theme=light] ::-webkit-scrollbar-thumb:hover{background:#94a3b8}