:root{font-family:SF Pro Display,SF Pro Text,Inter,Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.5;font-weight:400;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-height:100vh;background:#f5f6f8;color:#111827}#root{min-height:100vh}a{color:inherit}:root{--page-bg: #f6f7fb;--page-overlay: #eef2fb;--panel: rgba(255, 255, 255, .85);--panel-solid: #ffffff;--panel-soft: rgba(255, 255, 255, .65);--stroke: rgba(15, 23, 42, .08);--stroke-strong: rgba(15, 23, 42, .18);--text: #0f172a;--text-muted: #4b5563;--text-soft: #94a3b8;--accent: #0a84ff;--accent-strong: #0060df;--accent-soft: rgba(10, 132, 255, .12);--danger: #ff375f;--danger-soft: rgba(255, 55, 95, .14);--radius-lg: 16px;--radius-md: 10px;--radius-sm: 8px;--shadow-soft: 0 16px 32px rgba(15, 23, 42, .1);--shadow-card: 0 12px 24px rgba(15, 23, 42, .08);--font-size-base: 15px;--line-height-base: 1.5;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;font-family:SF Pro Display,SF Pro Text,Inter,Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;color:var(--text);color-scheme:light}*,*:before,*:after{box-sizing:border-box}html,body{height:100%}body{margin:0;background:radial-gradient(120% 120% at 50% 0%,var(--page-overlay) 0%,var(--page-bg) 45%,#e6ebf6 100%);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-size:var(--font-size-base);line-height:var(--line-height-base);overflow-x:hidden}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.app-shell{min-height:100vh;display:flex;flex-direction:column;position:relative;isolation:isolate}.app-shell:before{content:"";position:fixed;inset:auto -160px -160px auto;width:420px;height:420px;background:radial-gradient(circle at center,#0a84ff52,#0a84ff00 70%);filter:blur(0);z-index:-1}.app-header{width:min(1120px,92vw);margin:clamp(1.5rem,4vw,2.75rem) auto 0;padding:clamp(1rem,3vw,1.4rem) clamp(1.1rem,3vw,1.6rem);background:var(--panel);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);display:flex;align-items:center;justify-content:space-between;gap:clamp(1rem,3vw,1.6rem)}[data-has-project=true] .app-header{width:100%;margin:0;border-radius:0}.brand{display:flex;align-items:center;gap:clamp(1rem,3vw,1.35rem)}.brand-mark{width:clamp(46px,5vw,56px);height:clamp(46px,5vw,56px);border-radius:12px;background:linear-gradient(140deg,#0a84ff,#6ee7ff);box-shadow:0 10px 20px #0a84ff40;display:flex;align-items:center;justify-content:center;color:#fff;font-size:clamp(1.35rem,3vw,1.7rem);font-weight:600}.brand-copy h1{margin:0;font-size:clamp(1.75rem,3vw,2.3rem);letter-spacing:-.02em}.tagline{margin:.35rem 0 0;color:var(--text-muted);font-size:.95rem}.header-actions{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;justify-content:flex-end;max-width:40%}.header-note{margin:0;color:var(--text-soft);font-size:.9rem}.project-pill{display:flex;align-items:center;gap:.75rem;padding:.55rem 1rem;border-radius:999px;background:var(--panel-soft);border:1px solid var(--stroke);box-shadow:0 8px 16px #0f172a14}.project-pill .label{text-transform:uppercase;letter-spacing:.14em;font-size:.68rem;color:var(--text-soft);display:block;margin-bottom:.2rem}.project-pill strong{display:block;font-size:.95rem;letter-spacing:-.01em}.project-badge{width:36px;height:36px;border-radius:8px;background:linear-gradient(135deg,var(--accent) 0%,#4cc9ff 100%);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:600;letter-spacing:.04em;box-shadow:0 10px 18px #0a84ff2e}main{width:min(1120px,92vw);margin:clamp(1rem,2.2vw,1.8rem) auto clamp(2rem,3vw,3rem);flex:1;display:flex;flex-direction:column;gap:clamp(1.2rem,2.5vw,1.8rem)}[data-has-project=true] main{width:100%;max-width:100%;margin:0}.messages{position:fixed;top:clamp(1rem,2vw,1.75rem);right:clamp(1rem,5vw,3rem);display:grid;gap:.75rem;z-index:20}.message{min-width:280px;padding:.75rem 1rem;border-radius:var(--radius-sm);border:1px solid transparent;background:var(--panel-solid);box-shadow:0 12px 24px #0f172a1a;font-size:.92rem;line-height:1.4}.message.error{border-color:#ff375f59;background:var(--danger-soft);color:var(--danger)}.message.info{border-color:#0a84ff33;background:var(--accent-soft);color:var(--accent-strong)}.landing{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.75rem,4vw,3rem);align-items:stretch}.panel{background:var(--panel-solid);border-radius:var(--radius-lg);padding:clamp(1.2rem,2.4vw,1.6rem);border:1px solid var(--stroke);box-shadow:var(--shadow-card);display:grid;gap:.9rem}.panel-primary{background:linear-gradient(155deg,#ffffffeb,#ffffffb8 45%,#ffffffa6);border:1px solid rgba(10,132,255,.12)}.panel h2{margin:0;font-size:1.15rem;letter-spacing:-.015em}.panel p{margin:0;line-height:1.6;color:var(--text-muted);font-size:.95rem}.form{display:grid;gap:.9rem}label{font-size:.85rem;font-weight:600;color:var(--text);letter-spacing:.02em}input,textarea{width:100%;background:#ffffffeb;border:1px solid transparent;border-radius:var(--radius-sm);padding:.6rem .8rem;color:var(--text);transition:border .18s ease,box-shadow .18s ease,background .18s ease}input:focus,textarea:focus{outline:none;border-color:#0a84ff59;box-shadow:0 0 0 3px #0a84ff1f;background:#fff}textarea{resize:vertical;min-height:96px}.form-error{margin:-.2rem 0 0;color:var(--danger);font-size:.8rem}.form-actions{display:flex;gap:.75rem}button{border-radius:var(--radius-sm);border:1px solid var(--stroke);padding:.55rem .9rem;background:var(--panel-solid);color:var(--text);font-weight:600;letter-spacing:-.01em;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,border .18s ease,background .18s ease,color .18s ease}button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 16px 32px #0f172a1f}button:focus-visible{outline:2px solid rgba(10,132,255,.45);outline-offset:3px}button:disabled{cursor:not-allowed;opacity:.6;box-shadow:none;transform:none}button.primary{background:linear-gradient(150deg,var(--accent) 0%,#4cc9ff 100%);color:#fff;border-color:transparent}button.primary:hover:not(:disabled){background:linear-gradient(150deg,#0b7dfd,#37b9ff)}button.secondary{background:#0f172a0d;border-color:#0f172a14;color:var(--text)}button.secondary:hover:not(:disabled){border-color:#0f172a2e;background:#0f172a14}button.ghost{background:transparent;border-color:transparent;color:var(--text-muted)}button.ghost:hover:not(:disabled){background:#0f172a0d;color:var(--text)}button.danger{background:var(--danger-soft);border-color:transparent;color:var(--danger)}.share-button.is-copied{background:#0a84ff29;color:var(--accent-strong)}.board{background:var(--panel);border-radius:var(--radius-lg);padding:clamp(1.2rem,2.5vw,1.8rem);border:1px solid var(--stroke);box-shadow:var(--shadow-soft);display:flex;flex-direction:column;gap:clamp(1rem,2.2vw,1.6rem)}[data-has-project=true] .board{border-radius:0;border-left:none;border-right:none;width:100%;min-height:calc(100vh + -0px)}.board-toolbar{display:flex;justify-content:space-between;flex-wrap:wrap;gap:clamp(1.2rem,3vw,2rem)}[data-has-project=true] .board-toolbar{position:static;background:var(--panel);border-bottom:none;padding-bottom:0;margin-bottom:0}.board-headline{display:grid;gap:.7rem;max-width:min(420px,60vw)}.board-headline h2{margin:0;font-size:1.35rem;letter-spacing:-.015em}.board-headline p{margin:0;color:var(--text-muted);font-size:.95rem}.board-metrics{display:inline-flex;flex-wrap:nowrap;gap:.6rem}.metric{display:inline-flex;align-items:center;gap:.45rem;padding:.35rem .75rem;border-radius:999px;background:#0f172a0d;white-space:nowrap}@media (max-width: 900px){.metric{white-space:normal}}.metric-label{font-size:.78rem;color:var(--text-soft);text-transform:uppercase;letter-spacing:.12em}.metric-value{font-weight:600;font-size:.9rem}.board-actions{display:inline-flex;align-items:center;gap:.75rem;flex-wrap:wrap}.board-actions .primary{min-width:180px}.columns{display:grid;grid-template-columns:repeat(4,minmax(240px,1fr));gap:clamp(.8rem,2.2vw,1.2rem)}[data-has-project=true] .columns{grid-template-columns:repeat(4,1fr);gap:clamp(.8rem,2vw,1rem)}.column{background:var(--panel-solid);border-radius:var(--radius-md);border:1px solid var(--stroke);display:flex;flex-direction:column;gap:.7rem;padding:.8rem;min-height:300px;box-shadow:0 10px 20px #0f172a14;transition:border .18s ease,background .18s ease}.column header{display:flex;align-items:center;justify-content:space-between}.column header h3{margin:0;font-size:1.02rem;letter-spacing:-.01em}.count{min-width:34px;padding:.2rem .55rem;border-radius:999px;background:#0f172a0d;color:var(--text-muted);text-align:center;font-size:.78rem}.column.drag-over{border-color:#0a84ff59;background:#0a84ff0d}.column-items{display:flex;flex-direction:column;gap:.6rem;min-height:140px;flex:1}.card{background:#fff;border-radius:12px;border:1px solid rgba(15,23,42,.08);box-shadow:0 12px 24px #0f172a14;padding:.8rem;transition:transform 90ms ease,box-shadow .12s ease,border 90ms ease,background 90ms ease;will-change:transform}.card:hover{border-color:#0a84ff33}.card:focus-visible{outline:2px solid rgba(10,132,255,.45);outline-offset:2px}.card.dragging{box-shadow:0 20px 40px #0a84ff2e;border-color:#0a84ff47}.card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.card-title{display:inline-flex;align-items:center;gap:.4rem}@media (max-width: 720px){.card-title{gap:.6rem}.card-header h4{font-size:1.02rem}}.chevron{display:inline-block;transform:rotate(0);transition:transform .18s ease;color:var(--text-soft)}.chevron.open{transform:rotate(90deg);color:var(--text-muted)}.card-header h4{margin:0;font-size:.98rem;letter-spacing:-.01em;display:-webkit-box;line-clamp:3;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.card-icon-buttons{display:inline-flex;gap:.4rem}.card-icon-button{width:30px;height:30px;border-radius:8px;background:#0f172a0f;border:1px solid transparent;color:var(--text-muted);font-size:.88rem;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .18s ease,color .18s ease,transform .18s ease}.card-icon-button:focus-visible{outline:2px solid rgba(10,132,255,.45);outline-offset:2px}.card-icon-button:hover:not(:disabled){background:#0a84ff29;color:var(--accent-strong)}.card-icon-button.danger{background:var(--danger-soft);color:var(--danger)}.card-icon-button.danger:hover:not(:disabled){background:#ff375f33}.card-content p{margin:.6rem 0 0;color:var(--text-muted);line-height:1.45;overflow-wrap:anywhere}.card-content.is-expanded{cursor:default}.card-meta{margin-top:.85rem;display:flex;justify-content:space-between;align-items:center;font-size:.78rem;color:var(--text-soft)}.card-form textarea{min-height:80px}.card-form button{flex:1}.card-form .ghost{border-style:solid}.invite-hint{padding:.9rem 1rem;border-radius:var(--radius-sm);background:var(--accent-soft);border:1px solid rgba(10,132,255,.25);color:var(--accent-strong);display:grid;gap:.4rem}.drawer-overlay{position:fixed;inset:0;background:#0f172a33;display:flex;justify-content:flex-end;z-index:50}.drawer{width:min(520px,92vw);height:100%;background:var(--panel-solid);border-left:1px solid var(--stroke);box-shadow:-24px 0 54px #0f172a2e;display:flex;flex-direction:column;animation:slideIn .2s ease both}.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1rem;border-bottom:1px solid var(--stroke)}.drawer-form{padding:1rem}.drawer-meta{color:var(--text-soft);font-size:.8rem}@keyframes slideIn{0%{transform:translate(10px);opacity:0}to{transform:translate(0);opacity:1}}@media (prefers-reduced-motion: reduce){*{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important;scroll-behavior:auto!important}}[data-density=compact] body{font-size:14px}[data-density=compact] .panel{padding:.85rem .95rem}[data-density=compact] .board{padding:.9rem;gap:.8rem}[data-density=compact] .columns{gap:.6rem}[data-density=compact] .column{padding:.55rem;gap:.45rem}[data-density=compact] .card{padding:.55rem;border-radius:10px}[data-density=compact] .card-header h4{line-clamp:3;-webkit-line-clamp:3}[data-density=compact] button{padding:.4rem .7rem}[data-density=compact] .drawer-form{padding:.7rem}[data-mode=focus] .app-header,[data-mode=focus] .board{box-shadow:none;background:transparent;border:none}[data-mode=focus] .column{box-shadow:none}[data-mode=focus] .project-pill,[data-mode=focus] .metric{background:transparent;border-color:transparent}[data-mode=focus] .card{box-shadow:0 6px 14px #0f172a14}.invite-hint code{font-family:JetBrains Mono,Fira Code,monospace;background:#ffffffbf;padding:.1rem .45rem;border-radius:.4rem}@media (max-width: 1180px){.columns{grid-template-columns:repeat(2,minmax(0,1fr))}.header-actions{max-width:100%}}.add-item-btn{width:auto;border-style:dashed;border-color:#0f172a33;color:var(--text-muted)}.add-item-btn:hover:not(:disabled){border-color:#0a84ff80;background:#0a84ff0f;color:var(--accent-strong)}.column .add-item-btn{align-self:stretch;min-height:44px}.column.is-empty .add-item-btn{min-height:44px}.quick-add-trigger{width:100%;justify-content:flex-start;color:var(--text-soft)}.quick-add-trigger:hover:not(:disabled){color:var(--text)}.column-items>.quick-add-trigger,.column-items>.quick-add-form{position:static}.quick-add-form{display:grid;grid-template-columns:1fr auto auto;gap:.5rem}.quick-add-form input{padding:.5rem .6rem}.quick-add-actions{display:inline-flex;gap:.5rem}.form-error.small{font-size:.75rem}.status-backlog{border-top:3px solid rgba(15,23,42,.15)}.status-in_progress{border-top:3px solid rgba(10,132,255,.35)}.status-review{border-top:3px solid rgba(245,158,11,.45)}.status-done{border-top:3px solid rgba(16,185,129,.45)}@media (max-width: 900px){.app-header{flex-direction:column;align-items:flex-start}.header-actions{justify-content:flex-start}.landing{grid-template-columns:1fr}.board-toolbar{flex-direction:column;align-items:flex-start}.board-actions button{width:100%}.board-metrics{flex-wrap:wrap}.card-icon-button{width:40px;height:40px}}@media (max-width: 720px){.columns{display:grid;grid-auto-flow:column;grid-auto-columns:90vw;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;gap:.8rem;padding-bottom:.4rem}.column{scroll-snap-align:start}.messages{left:50%;right:auto;transform:translate(-50%)}.project-pill{width:100%;justify-content:flex-start}.board{padding:1.1rem}[data-density=compact] body{font-size:15px}.drawer{width:100vw}.quick-add-form{grid-template-columns:1fr}.quick-add-actions,.quick-add-actions button{width:100%}button{min-height:44px}}