@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600;700&family=Spline+Sans+Mono:wght@400;500;600&display=swap";:root{font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;line-height:1.5}html,body{width:100%;min-width:320px;min-height:100vh;margin:0;padding:0}body{display:block}#root{height:auto;min-height:100vh;margin:0}.board{--font-display:"Spline Sans Mono", "IBM Plex Mono", monospace;--font-body:"IBM Plex Mono", monospace;--bg:#eceff3;--bg-ambient:radial-gradient(circle at 10% 10%, #5561731f, transparent 40%), radial-gradient(circle at 90% 0%, #58657a1a, transparent 38%);--panel:#f5f7fa;--panel-2:#e6eaf0;--panel-3:#dde2ea;--border:#78829459;--text:#2f3540;--text-muted:#5e6778;--accent:#6b7280;--accent-strong:#2563eb;--shadow-panel:0 16px 32px #171b211f;--shadow-card:0 10px 22px #171b2124;--shadow-header:0 22px 44px #0f172a33;--header-bg:linear-gradient(130deg, #4a5260 0%, #586171 55%, #667082 100%);--header-text:#f3f5f8;--header-pill:#e8ecf229;--header-pill-border:#e8ecf247;--chip:#e5e9ef99;--waiting:#d97706;--active:#2563eb;--paused:#dc2626;--completed:#0891b2;--radius-xl:18px;--radius-lg:14px;--radius-md:10px;width:100%;height:auto;min-height:100vh;color:var(--text);font-family:var(--font-body);background:var(--bg);flex-direction:column;display:flex;position:relative;overflow:visible}.board:before{content:"";background:var(--bg-ambient);pointer-events:none;z-index:0;position:absolute;inset:0}.board.board-mode-dark{--bg:#1f2329;--bg-ambient:radial-gradient(circle at 8% 10%, #78829433, transparent 40%), radial-gradient(circle at 90% 0%, #646f802e, transparent 38%);--panel:#1f2329f5;--panel-2:#171b21e0;--panel-3:#2c323c;--border:#78829452;--text:#d0d5dd;--text-muted:#98a1af;--accent:#7c8595;--accent-strong:#60a5fa;--shadow-panel:0 16px 32px #0a0c10a3;--shadow-card:0 10px 22px #0a0c1099;--shadow-header:0 24px 48px #080910b3;--header-bg:linear-gradient(130deg, #2a3039 0%, #343c48 58%, #3f4856 100%);--header-text:#d7dce3;--header-pill:#a3acba29;--header-pill-border:#a3acba47;--chip:#2c323cb3;--waiting:#f59e0b;--active:#60a5fa;--paused:#f87171;--completed:#67e8f9}.board-header,.board-columns{z-index:1;position:relative}.board-header{border-radius:calc(var(--radius-xl) + 6px);background:var(--header-bg);color:var(--header-text);border:1px solid var(--header-pill-border);box-shadow:var(--shadow-header);justify-content:space-between;align-items:center;gap:1.25rem;margin:1.2rem 1.2rem 0;padding:1.35rem 1.6rem;display:flex}.board-title{font-family:var(--font-display);letter-spacing:.02em;align-items:center;gap:.75rem;margin:0;font-size:clamp(1.5rem,2.6vw,2.2rem);display:inline-flex}.board-subtitle{letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb, var(--header-text) 70%, transparent);margin:.2rem 0 0;font-size:.82rem}.board-logo{object-fit:contain;border-radius:10px;width:40px;height:40px;padding:.35rem}.board-meta{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.6rem;display:flex}.meta-pill{background:var(--header-pill);border:1px solid var(--header-pill-border);letter-spacing:.02em;border-radius:999px;padding:.45rem .9rem;font-size:.8rem;font-weight:600}.mode-toggle-button,.language-toggle-button,.add-task-button,.task-button{font-family:var(--font-body);cursor:pointer;border:none;transition:transform .2s,box-shadow .2s,background .2s}.mode-toggle-button,.language-toggle-button,.add-task-button{background:var(--header-pill);color:var(--header-text);border:1px solid var(--header-pill-border);border-radius:999px;align-items:center;gap:.4rem;padding:.5rem .95rem;font-size:.8rem;font-weight:600;display:inline-flex}.mode-toggle-button{justify-content:center;width:36px;height:36px;padding:0}.language-toggle-button{justify-content:center;width:36px;height:36px;padding:0;font-size:1.35rem;line-height:1}.mode-toggle-button:hover,.language-toggle-button:hover,.add-task-button:hover,.task-button-primary:hover{transform:translateY(-1px)}.mode-toggle-button:focus-visible,.language-toggle-button:focus-visible,.add-task-button:focus-visible,.task-button:focus-visible,.task-card:focus-visible,.task-card-button:focus-visible,.task-menu-button:focus-visible,.task-input:focus-visible,.task-textarea:focus-visible,.task-group-select:focus-visible,.task-color-input:focus-visible{outline:2px solid color-mix(in srgb, var(--accent-strong) 70%, transparent);outline-offset:2px}.board-columns{flex:auto;grid-template-columns:repeat(4,minmax(0,1fr));align-content:stretch;align-items:stretch;gap:1.1rem;min-height:0;padding:1.25rem;display:grid;overflow:visible}.column{background:var(--panel-2);border-radius:var(--radius-xl);border:1px solid var(--border);min-width:260px;min-height:0;box-shadow:var(--shadow-panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);flex-direction:column;padding:1rem;display:flex}.column-header{justify-content:space-between;align-items:center;margin-bottom:.85rem;display:flex}.column-title{color:var(--text);align-items:center;gap:.55rem;font-size:.9rem;font-weight:700;display:inline-flex}.column-title h2{text-transform:uppercase;letter-spacing:.08em;margin:0;font-size:.92rem}.column-count{background:var(--panel-3);border:1px solid var(--border);min-width:28px;height:28px;color:var(--text);border-radius:8px;justify-content:center;align-items:center;font-size:.78rem;font-weight:700;display:inline-flex}.state-dot{border-radius:50%;width:10px;height:10px}.state-waiting{background:var(--waiting)}.state-active{background:var(--active)}.state-paused{background:var(--paused)}.state-completed{background:var(--completed)}.column-drop{border-radius:var(--radius-lg);border:1px solid #0000;flex-direction:column;flex:auto;gap:.75rem;min-height:clamp(220px,32vh,340px);padding:.2rem;transition:background .2s,border-color .2s;display:flex}.column-drop[data-over=true]{background:color-mix(in srgb, var(--accent-strong) 14%, transparent);border-color:color-mix(in srgb, var(--accent-strong) 45%, transparent)}.column-drop[data-disabled=true]{opacity:.6;background:repeating-linear-gradient(45deg, color-mix(in srgb, var(--panel-3) 65%, transparent), color-mix(in srgb, var(--panel-3) 65%, transparent) 8px, color-mix(in srgb, var(--panel) 70%, transparent) 8px, color-mix(in srgb, var(--panel) 70%, transparent) 16px);border-color:color-mix(in srgb, var(--border) 80%, transparent)}.task-card-shell{z-index:0;position:relative}.task-card-shell:focus-within{z-index:5}.task-card{background:var(--panel);width:100%;color:inherit;text-align:left;border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);cursor:grab;touch-action:none;box-sizing:border-box;flex-direction:column;gap:.4rem;transition:transform .16s,box-shadow .16s;display:flex;position:relative}.task-card-button{color:inherit;text-align:left;cursor:pointer;box-sizing:border-box;background:0 0;border:none;flex-direction:column;gap:.4rem;width:100%;margin:0;padding:.85rem .9rem 1rem;display:flex}.task-card:hover{transform:translateY(-2px)}.task-card[data-dragging=true]{opacity:0;box-shadow:none;transform:none}.drag-overlay-card{pointer-events:none;cursor:grabbing;box-shadow:none}.task-card-header{justify-content:space-between;align-items:center;gap:.6rem;display:flex}.task-badge{color:#f8fafc;text-overflow:ellipsis;white-space:nowrap;border:1px solid #fff3;border-radius:6px;max-width:11rem;padding:.15rem .5rem;font-size:.7rem;font-weight:700;overflow:hidden}.task-badge-muted{background:var(--panel-3);color:var(--text-muted);border-color:var(--border)}.task-title{color:var(--text);font-size:.95rem;font-weight:700}.task-description{color:var(--text-muted);min-height:1.6rem;font-size:.82rem;line-height:1.4}.task-activity-time{background:var(--chip);border:1px solid var(--border);color:var(--text-muted);border-radius:999px;padding:.12rem .4rem;font-size:.68rem;font-weight:700;position:absolute;bottom:.65rem;right:.65rem}.task-menu-button{border:1px solid var(--border);background:var(--panel-3);width:30px;height:30px;color:var(--text-muted);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;transition:background .2s,color .2s;display:inline-flex}.task-menu-button:hover{color:var(--text);background:color-mix(in srgb, var(--text) 8%, var(--panel-3))}.task-menu-container{position:relative}.task-menu{background:var(--panel);border:1px solid var(--border);min-width:150px;box-shadow:var(--shadow-header);z-index:50;border-radius:12px;flex-direction:column;gap:.15rem;padding:.35rem;display:flex;position:absolute;top:2.2rem;right:0}.task-menu-item{color:var(--text);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:8px;align-items:center;gap:.5rem;padding:.45rem .55rem;font-size:.82rem;font-weight:600;display:flex}.task-menu-item:hover{background:var(--panel-3)}.task-menu-item-danger{color:#dc2626}.task-modal-backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:80;background:#0f121a73;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.task-modal{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-xl);width:min(94vw,440px);max-height:calc(100dvh - 2rem);box-shadow:var(--shadow-header);color:var(--text);padding:1.25rem;overflow-y:auto}.task-modal-header{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.task-modal-title{font-family:var(--font-display);color:var(--text);margin:0;font-size:1.3rem}.task-form{flex-direction:column;gap:.95rem;margin-top:1rem;display:flex}.task-field{color:var(--text-muted);flex-direction:column;gap:.35rem;font-size:.82rem;display:flex}.task-input,.task-textarea,.task-group-select{width:100%;font-family:var(--font-body);color:var(--text);border:1px solid var(--border);background:var(--panel-3);box-sizing:border-box;border-radius:10px;outline:none;padding:.6rem .7rem;font-size:.9rem}.board-mode-dark .task-input[type=datetime-local],.board-mode-dark .task-input[type=date]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.board-mode-light .task-input[type=datetime-local],.board-mode-light .task-input[type=date]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}.task-group-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7l5 6 5-6' stroke='%23808493' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right .75rem center;background-repeat:no-repeat;background-size:1rem;padding-right:2.4rem}.task-input:focus,.task-textarea:focus,.task-group-select:focus{border-color:color-mix(in srgb, var(--accent-strong) 60%, transparent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent-strong) 20%, transparent)}.task-textarea{resize:vertical}.task-color-wrapper{align-items:center;gap:.55rem;display:inline-flex;position:relative}.task-color-input{opacity:0;cursor:pointer;width:3rem;height:2rem;position:absolute;top:0;left:0}.task-color-swatch{border:1px solid var(--border);border-radius:8px;width:3rem;height:2rem}.task-color-hex{font-size:.8rem;font-family:var(--font-body);color:var(--text-muted)}.task-actions{justify-content:flex-end;gap:.65rem;display:flex}.task-button{border-radius:999px;padding:.5rem 1rem;font-size:.82rem;font-weight:600}.task-button-ghost{background:var(--panel-3);color:var(--text);border:1px solid var(--border)}.task-button-primary{background:var(--accent-strong);color:#f8fafc}.task-delete-text{color:var(--text-muted);margin:0;line-height:1.45}.task-button:disabled{opacity:.6;cursor:not-allowed}@media (max-width:900px){.board-header{flex-direction:column;align-items:flex-start;gap:.85rem}.board-meta{justify-content:flex-start;gap:.5rem;width:100%}}@media (max-width:560px){.board-header{padding:1.1rem 1.1rem 1rem}.board-title{font-size:1.35rem}.board-logo{width:34px;height:34px}.board-meta{flex-direction:column;align-items:stretch;display:flex}.meta-pill{justify-content:center;align-self:stretch;padding:.4rem .75rem;font-size:.78rem;display:inline-flex}.add-task-button,.mode-toggle-button,.language-toggle-button{justify-content:center;width:100%}.mode-toggle-button,.language-toggle-button{height:36px}}@media (max-width:760px){.board{height:auto;min-height:100dvh}.board-columns{grid-template-columns:1fr;gap:.9rem;padding:1rem}.column{min-width:0;min-height:clamp(260px,40vh,380px)}.column-drop{min-height:clamp(200px,30vh,300px)}.board-subtitle{display:none}}
