:root{--font-sans:"Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--bg-main:#faf9f5;--bg-sidebar:#faf9f5;--bg-column:#f4f2eb;--bg-card:#fff;--bg-hover:#ebe9e2;--bg-active:#e4e1d8;--bg-overlay:#00000040;--border-subtle:#ebe9e2;--border-base:#e2dfd6;--border-strong:#d4d0c5;--text-primary:#1a1a1a;--text-secondary:#666;--text-tertiary:#8c8a85;--accent:#1a1a1a;--accent-hover:#333;--accent-contrast:#fff;--accent-soft:#1a1a1a14;--focus-ring:#a39e9326;--brand-mark:#1a1a1a;--brand-mark-contrast:#fff;--avatar-bg:#c4b9a8;--avatar-contrast:#fff;--scrollbar-thumb:#d4d0c5;--scrollbar-thumb-hover:#b8b3a8;--danger-text:#d93b48;--danger-bg:#fdf4f5;--danger-border:#f6d6d9;--danger-bg-hover:#fce8ea;--danger-border-hover:#f1c6cb;--shadow-sm:0 2px 8px #0000000a;--shadow-md:0 8px 24px #00000014;--shadow-lg:0 24px 60px #0000001f}:root[data-theme=ocean]{--bg-main:#f3f8fb;--bg-sidebar:#eef5fa;--bg-column:#e3eff8;--bg-card:#fff;--bg-hover:#d8e8f4;--bg-active:#c8ddef;--bg-overlay:#0a1e3047;--border-subtle:#d7e6f0;--border-base:#c5d8e6;--border-strong:#a9c2d4;--text-primary:#14324a;--text-secondary:#47657c;--text-tertiary:#6f899e;--accent:#1f6fa8;--accent-hover:#185a88;--accent-contrast:#fff;--accent-soft:#1f6fa81f;--focus-ring:#1f6fa82e;--brand-mark:#1f6fa8;--brand-mark-contrast:#fff;--avatar-bg:#7fafd0;--avatar-contrast:#fff;--scrollbar-thumb:#9dbcd1;--scrollbar-thumb-hover:#7c9db4;--danger-text:#c43f57;--danger-bg:#fff1f3;--danger-border:#f6cbd2;--danger-bg-hover:#fde4e9;--danger-border-hover:#eeb8c3}:root[data-theme=forest]{--bg-main:#f4f8f4;--bg-sidebar:#eef5ef;--bg-column:#e3eee4;--bg-card:#fff;--bg-hover:#d8e8da;--bg-active:#cbe0ce;--bg-overlay:#12271a42;--border-subtle:#d7e5d8;--border-base:#c4d7c7;--border-strong:#a8c3ad;--text-primary:#1d3323;--text-secondary:#4d6954;--text-tertiary:#738978;--accent:#2f7a4c;--accent-hover:#24613b;--accent-contrast:#fff;--accent-soft:#2f7a4c1f;--focus-ring:#2f7a4c2e;--brand-mark:#2f7a4c;--brand-mark-contrast:#fff;--avatar-bg:#85b294;--avatar-contrast:#fff;--scrollbar-thumb:#a3bfa8;--scrollbar-thumb-hover:#7e9f86;--danger-text:#b93f55;--danger-bg:#fff2f4;--danger-border:#f4cdd5;--danger-bg-hover:#fde5e9;--danger-border-hover:#edbac4}:root[data-theme=sunset]{--bg-main:#fff6f0;--bg-sidebar:#fff1e8;--bg-column:#fce5da;--bg-card:#fff;--bg-hover:#f9d9c8;--bg-active:#f4c9b1;--bg-overlay:#441e113d;--border-subtle:#f1d8cb;--border-base:#eac5b3;--border-strong:#dca790;--text-primary:#4b2a1e;--text-secondary:#7d5446;--text-tertiary:#a07c6f;--accent:#d86a3b;--accent-hover:#b85328;--accent-contrast:#fff;--accent-soft:#d86a3b1f;--focus-ring:#d86a3b2e;--brand-mark:#d86a3b;--brand-mark-contrast:#fff;--avatar-bg:#e5a07d;--avatar-contrast:#fff;--scrollbar-thumb:#d9af9b;--scrollbar-thumb-hover:#bf8d74;--danger-text:#b94157;--danger-bg:#fff2f4;--danger-border:#f4cdd5;--danger-bg-hover:#fde5e9;--danger-border-hover:#edbac4}:root[data-theme=midnight]{--bg-main:#111827;--bg-sidebar:#0f172a;--bg-column:#172033;--bg-card:#1e293b;--bg-hover:#253247;--bg-active:#31435f;--bg-overlay:#02061799;--border-subtle:#263347;--border-base:#334155;--border-strong:#475569;--text-primary:#e5eef9;--text-secondary:#b1c0d6;--text-tertiary:#8a9ab4;--accent:#4f8cff;--accent-hover:#3e74d5;--accent-contrast:#f8fafc;--accent-soft:#4f8cff2e;--focus-ring:#4f8cff33;--brand-mark:#4f8cff;--brand-mark-contrast:#f8fafc;--avatar-bg:#5b7bae;--avatar-contrast:#f8fafc;--scrollbar-thumb:#50627e;--scrollbar-thumb-hover:#647896;--danger-text:#ff8fa1;--danger-bg:#d93b4824;--danger-border:#ff8fa138;--danger-bg-hover:#d93b4838;--danger-border-hover:#ff8fa152;--shadow-sm:0 2px 10px #0206174d;--shadow-md:0 10px 28px #0206176b;--shadow-lg:0 24px 60px #0206178f}*{box-sizing:border-box}html{background:var(--bg-main);overscroll-behavior-x:none;height:100%;overflow-x:hidden}body{background:var(--bg-main);min-width:320px;color:var(--text-primary);font-family:var(--font-sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior-x:none;margin:0;overflow-x:hidden}.board-grid,.column-cards{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) transparent}.board-grid::-webkit-scrollbar{height:6px}.column-cards::-webkit-scrollbar{width:6px}.board-grid::-webkit-scrollbar-track{background:0 0}.column-cards::-webkit-scrollbar-track{background:0 0}.board-grid::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb);background-clip:content-box;border:2px solid #0000;border-radius:999px}.column-cards::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb);background-clip:content-box;border:2px solid #0000;border-radius:999px}.board-grid::-webkit-scrollbar-thumb:hover{background-color:var(--scrollbar-thumb-hover)}.column-cards::-webkit-scrollbar-thumb:hover{background-color:var(--scrollbar-thumb-hover)}button,input{font:inherit}button{cursor:pointer}#root{min-height:100vh}.screen-center{min-height:100vh;color:var(--text-secondary);place-items:center;padding:24px;display:grid}.app-shell{background:var(--bg-main);grid-template-columns:220px minmax(0,1fr);height:100dvh;display:grid;overflow:hidden}.sidebar{border-right:1px solid var(--border-subtle);background:var(--bg-sidebar);align-content:start;gap:20px;padding:20px 16px;display:grid}.theme-switcher{gap:8px;display:grid}.theme-switcher-label{color:var(--text-tertiary);letter-spacing:.02em;padding:0 10px;font-size:12px;font-weight:600}.theme-select{border:1px solid var(--border-base);background:var(--bg-card);width:100%;color:var(--text-primary);border-radius:10px;outline:none;padding:10px 12px;font-size:14px;transition:border-color .2s,box-shadow .2s,background .2s}.theme-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--focus-ring)}.sidebar-title{color:var(--text-primary);letter-spacing:-.02em;padding:4px 10px;font-size:18px;font-weight:700}.main-nav{gap:4px;display:grid}.nav-item{width:100%;color:var(--text-secondary);text-align:left;background:0 0;border:1px solid #0000;border-radius:8px;align-items:center;gap:10px;padding:10px 12px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.nav-item.active{background:var(--bg-active);color:var(--text-primary);font-weight:600}.nav-icon{text-align:center;width:16px;color:inherit;flex-shrink:0;justify-content:center;align-items:center;display:flex}.main-content{flex-direction:column;gap:20px;height:100%;min-height:0;padding:24px 32px;display:flex;overflow:hidden}.topbar,.topbar-actions,.toolbar,.toolbar-row,.board-grid,.column-header,.task-card-footer,.task-meta,.card-actions,.composer-top,.composer-actions{gap:12px;display:flex}.topbar,.topbar-actions,.column-header,.task-card-footer,.composer-top{justify-content:space-between;align-items:center}.composer-actions{justify-content:flex-end;align-items:center}.page-title{letter-spacing:-.02em;color:var(--text-primary);margin:0;font-size:22px;font-weight:600}.page-subtitle{color:var(--text-secondary);margin:4px 0 0;font-size:14px}.icon-button,.ghost-icon-button{width:32px;height:32px;color:var(--text-secondary);background:0 0;border:1px solid #0000;border-radius:8px;place-items:center;padding:0;transition:all .2s;display:grid}.icon-button:hover,.ghost-icon-button:hover{background:var(--bg-hover);color:var(--text-primary)}.icon-button svg,.ghost-icon-button svg,.button-icon svg{width:16px;height:16px}.avatar-badge{background:var(--avatar-bg);width:32px;height:32px;color:var(--avatar-contrast);border-radius:999px;place-items:center;font-size:14px;font-weight:600;display:grid}.primary-button,.secondary-button{border:1px solid var(--border-base);background:var(--bg-card);color:var(--text-primary);border-radius:8px;align-items:center;gap:8px;padding:8px 16px;font-size:14px;font-weight:500;transition:all .2s;display:inline-flex}.primary-button:hover,.secondary-button:hover{background:var(--bg-hover)}.primary-button.strong{border-color:var(--accent);background:var(--accent);color:var(--accent-contrast)}.primary-button.strong:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center}.mobile-search,.mobile-tabs{display:none}.toolbar-row{flex-wrap:wrap}.toolbar-pill{border:1px solid var(--border-base);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;border-radius:8px;padding:8px 14px;font-size:13px;font-weight:500;transition:all .2s}.toolbar-pill:hover{background:var(--bg-hover);color:var(--text-primary)}.search-input{border:1px solid var(--border-base);background:var(--bg-card);width:min(280px,100%);color:var(--text-primary);border-radius:8px;outline:none;padding:8px 14px;font-size:14px;transition:all .2s}.search-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--focus-ring)}.search-input::placeholder{color:var(--text-tertiary)}.feedback-banner{border:1px solid var(--border-base);background:var(--bg-card);color:var(--text-secondary);box-shadow:var(--shadow-sm);border-radius:8px;padding:12px 16px;font-size:14px}.board-grid{flex:1;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;gap:16px;min-height:0;display:grid;overflow:hidden}.board-column{border:1px solid var(--border-subtle);background:var(--bg-column);border-radius:16px;flex-direction:column;gap:14px;min-width:0;min-height:0;padding:14px;display:flex}.column-title{align-items:center;gap:10px;display:flex}.column-title h2{color:var(--text-primary);margin:0;font-size:15px;font-weight:600}.column-title span{background:var(--border-base);min-width:22px;height:22px;color:var(--text-secondary);border-radius:999px;justify-content:center;align-items:center;padding:0 8px;font-size:12px;font-weight:600;display:inline-flex}.column-header{position:relative}.menu-overlay{z-index:40;background:0 0;position:fixed;inset:0}.column-menu{z-index:60;border:1px solid var(--border-subtle);background:var(--bg-card);min-width:160px;box-shadow:var(--shadow-md);border-radius:12px;gap:4px;padding:6px;display:grid;position:absolute;top:36px;right:0}.column-menu-item{width:100%;color:var(--text-primary);text-align:left;background:0 0;border:1px solid #0000;border-radius:8px;padding:10px 12px;font-size:14px;font-weight:500;transition:background .2s}.column-menu-item:hover{background:var(--bg-hover)}.column-cards{-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;flex:1;align-content:start;gap:12px;min-height:0;padding-right:4px;display:grid;overflow-y:auto}.task-card{border:1px solid var(--border-subtle);background:var(--bg-main);box-shadow:var(--shadow-sm);border-radius:12px;gap:16px;padding:16px;transition:box-shadow .2s,transform .2s;display:grid}.task-card:hover{box-shadow:var(--shadow-md)}.task-card h3{color:var(--text-primary);margin:0;font-size:15px;font-weight:500;line-height:1.5}.task-meta span{color:var(--text-tertiary);margin:0;font-size:12px}.task-meta{justify-content:flex-end;align-items:center}.task-avatar{background:var(--avatar-bg);width:24px;height:24px;color:var(--avatar-contrast);border-radius:999px;place-items:center;font-size:12px;font-weight:600;display:grid}.card-actions{flex-wrap:wrap}.chip-button{border:1px solid var(--border-base);background:var(--bg-main);color:var(--text-secondary);border-radius:999px;padding:6px 14px;font-size:13px;font-weight:500;transition:all .2s}.chip-button:hover{background:var(--bg-hover);color:var(--text-primary)}.chip-button.danger{color:var(--danger-text);background:var(--danger-bg);border-color:var(--danger-border)}.chip-button.danger:hover{background:var(--danger-bg-hover);border-color:var(--danger-border-hover)}.add-task-link{border:1px dashed var(--border-strong);color:var(--text-secondary);background:0 0;border-radius:12px;flex-shrink:0;justify-content:flex-start;width:100%;min-height:44px;padding:8px 14px;font-size:14px;font-weight:500;transition:all .2s}.add-task-link:hover{background:var(--accent-soft);color:var(--text-primary)}.empty-column-card{border:1px dashed var(--border-strong);min-height:80px;color:var(--text-tertiary);background:0 0;border-radius:12px;place-items:center;font-size:14px;display:grid}.modal-overlay{background:var(--bg-overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:100;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.composer-panel{border:1px solid var(--border-subtle);background:var(--bg-card);width:min(480px,100%);box-shadow:var(--shadow-lg);border-radius:20px;gap:20px;padding:24px;display:grid}.composer-top h3{color:var(--text-primary);margin:0;font-size:18px;font-weight:600}.composer-top p{color:var(--text-secondary);margin:0 0 4px;font-size:13px}.composer-form{gap:20px;display:grid}.composer-form input{border:1px solid var(--border-base);background:var(--bg-card);width:100%;color:var(--text-primary);box-sizing:border-box;border-radius:10px;outline:none;padding:12px 16px;font-size:15px;transition:all .2s}.composer-form input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--focus-ring)}@media (width<=1180px){.board-grid{grid-template-columns:repeat(3,minmax(260px,1fr));overflow-x:auto}}@media (width<=980px){.app-shell{grid-template-rows:64px 1fr;grid-template-columns:1fr}.sidebar{border-right:none;border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;gap:16px;padding:12px 24px;display:flex}.sidebar-title{padding:0;font-size:18px}.main-nav{gap:8px;display:flex}.theme-switcher{min-width:180px}.nav-item{width:auto;padding:8px 16px}.main-content{padding:20px 24px}.board-grid{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;touch-action:pan-x;grid-template-columns:none;grid-auto-columns:minmax(300px,380px);grid-auto-flow:column;padding-bottom:12px;overflow:auto hidden}.board-column{scroll-snap-align:start}}@media (width<=720px){.app-shell{grid-template-rows:auto 1fr}.sidebar{background:var(--bg-main);border-bottom:1px solid var(--border-subtle);grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 12px;height:auto;padding:10px 16px 12px;display:grid}.sidebar-title{white-space:nowrap;grid-area:1/1;font-size:16px}.main-nav{scrollbar-width:none;grid-area:2/1/auto/-1;justify-content:flex-start;min-width:0;overflow-x:auto}.main-nav::-webkit-scrollbar{display:none}.nav-item{white-space:nowrap;flex-shrink:0;padding:8px 12px;font-size:13px}.theme-switcher{grid-area:1/2;justify-self:end;gap:6px;width:min(148px,42vw);min-width:0}.theme-switcher-label{display:none}.theme-select{width:100%;padding:8px 10px;font-size:13px}.main-content{padding:0 16px calc(16px + env(safe-area-inset-bottom));gap:12px}.topbar,.toolbar,.page-subtitle{display:none}.mobile-search{flex-shrink:0;margin-top:12px;margin-bottom:0;display:block}.mobile-search .search-input{border:1px solid var(--border-base);background:var(--bg-card);border-radius:12px;width:100%;padding:12px 16px;font-size:15px}.mobile-tabs{scrollbar-width:none;-webkit-overflow-scrolling:touch;flex-shrink:0;gap:8px;margin-bottom:0;padding-right:16px;display:flex;overflow-x:auto}.mobile-tabs::-webkit-scrollbar{display:none}.mobile-tab{border:1px solid var(--border-base);background:var(--bg-card);color:var(--text-secondary);white-space:nowrap;border-radius:999px;flex-shrink:0;align-items:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:500;transition:all .2s;display:flex}.mobile-tab.active{background:var(--accent);color:var(--accent-contrast);border-color:var(--accent)}.mobile-tab .count{background:var(--border-base);min-width:18px;height:18px;color:var(--text-secondary);border-radius:999px;justify-content:center;align-items:center;font-size:11px;font-weight:600;display:inline-flex}.mobile-tab.active .count{background:color-mix(in srgb, var(--accent-contrast) 20%, transparent);color:var(--accent-contrast)}.board-grid{grid-auto-columns:calc(100vw - 32px);gap:12px;padding-bottom:0;scroll-padding-inline:16px}.board-column{border-radius:16px;padding:12px}.column-cards{touch-action:pan-x pan-y;gap:10px;max-height:none}.board-grid,.column-cards{scrollbar-width:none}.board-grid::-webkit-scrollbar{display:none}.column-cards::-webkit-scrollbar{display:none}.task-card{border-radius:12px;gap:14px;padding:14px}.task-card h3{font-size:15px;line-height:1.4}.task-card-footer{gap:12px}.task-meta span:last-child{display:none}.card-actions{justify-content:flex-start;gap:8px;width:100%}.chip-button{padding:8px 16px;font-size:13px}.chip-button.danger{padding:8px 16px}.add-task-link{border-radius:12px;justify-content:flex-start;min-height:48px;padding:12px 16px}.composer-panel{gap:16px;padding:20px}.composer-form{gap:16px}.composer-actions{flex-direction:row;gap:12px;display:flex}.composer-actions button{flex:1;justify-content:center}}
