:root {
  color-scheme: light;
  --bg: #f3f1ec; --surface: #fbfaf7; --surface-2: #f7f5f0; --card: #fffefa;
  --text: #24231f; --muted: #76736b; --faint: #aaa69d; --border: #dedbd3;
  --accent: #5d6f55; --accent-hover: #4c5d45; --accent-soft: #e6ebe2;
  --danger: #9a4d4d; --danger-soft: #f7e8e6; --shadow: 0 8px 28px rgba(35,32,26,.08);
  --radius: 14px; --radius-sm: 9px; --header-h: 72px;
}
[data-theme="dark"] {
  color-scheme: dark;
  --bg:#1b1b19; --surface:#222220; --surface-2:#272724; --card:#2b2a27;
  --text:#efede7; --muted:#aaa79f; --faint:#77746d; --border:#3b3a36;
  --accent:#9aaf8f; --accent-hover:#adc1a3; --accent-soft:#303a2d;
  --danger:#d98984; --danger-soft:#442c2a; --shadow:0 10px 30px rgba(0,0,0,.22);
}
* { box-sizing:border-box }
html { min-width:320px }
body { margin:0; background:var(--bg); color:var(--text); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:14px; line-height:1.45; min-height:100vh }
button,input,textarea,select { font:inherit; color:inherit }
button { cursor:pointer }
svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }
.skip-link { position:fixed; left:12px; top:-50px; z-index:100; padding:10px 14px; border-radius:8px; background:var(--text); color:var(--bg) }
.skip-link:focus { top:10px }
:focus-visible { outline:3px solid color-mix(in srgb,var(--accent) 65%,transparent); outline-offset:2px }
.app-header { height:var(--header-h); padding:0 clamp(16px,3vw,42px); display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid var(--border); background:color-mix(in srgb,var(--bg) 92%,transparent); position:sticky; top:0; z-index:20; backdrop-filter:blur(12px) }
.brand { display:flex; align-items:center; gap:11px; min-width:0 }.brand h1 { font-size:19px; margin:0; letter-spacing:-.03em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:230px }
.brand-mark { width:26px; height:26px; padding:5px; display:flex; gap:2px; align-items:flex-end; background:var(--text); border-radius:7px }.brand-mark span { width:4px; border-radius:2px; background:var(--bg) }.brand-mark span:nth-child(1){height:8px}.brand-mark span:nth-child(2){height:14px}.brand-mark span:nth-child(3){height:10px}
.header-actions { display:flex; align-items:center; gap:8px }
.button,.icon-button { border:1px solid var(--border); background:var(--surface); min-height:40px; border-radius:9px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:0 13px; font-weight:590; transition:background .15s,border-color .15s,transform .12s }
.button:hover,.icon-button:hover { background:var(--surface-2); border-color:var(--faint) }.button:active,.icon-button:active { transform:translateY(1px) }
.icon-button { width:40px; padding:0 }.icon-button.small { width:34px; min-height:34px }.button svg,.icon-button svg { width:18px;height:18px }
.button.primary { background:var(--accent); border-color:var(--accent); color:#fff }.button.primary:hover { background:var(--accent-hover) }
[data-theme="dark"] .button.primary { color:#172014 }.button.danger { color:var(--danger); border-color:color-mix(in srgb,var(--danger) 35%,var(--border)) }.button.danger:hover { background:var(--danger-soft) }.button.ghost { border-color:transparent;background:transparent }
.button.full { width:100% }.spacer { flex:1 }
.search-wrap { width:clamp(150px,20vw,270px); height:40px; position:relative; display:flex; align-items:center }.search-wrap>svg { position:absolute; left:12px; width:17px; color:var(--muted);pointer-events:none }.search-wrap input { width:100%; height:100%; padding:0 36px; border:1px solid var(--border); border-radius:9px; background:var(--surface) }.search-wrap kbd { position:absolute; right:9px; color:var(--faint); border:1px solid var(--border); border-radius:4px; padding:0 5px; font-size:11px }.search-close,.mobile-search-button{display:none}
kbd { font-family:inherit }
.filter-dot { width:6px;height:6px;border-radius:50%;background:var(--accent);display:none }.has-filters .filter-dot { display:block }
.board { display:grid; grid-template-columns:repeat(3,minmax(270px,1fr)); gap:18px; padding:28px clamp(16px,3vw,42px) 40px; max-width:1600px; margin:0 auto; min-height:calc(100vh - var(--header-h)) }
.column { min-width:0; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius); padding:10px; display:flex; flex-direction:column; height:calc(100vh - var(--header-h) - 68px); min-height:420px }
.column-header { display:flex; align-items:center; gap:9px; padding:8px 6px 13px }.column-header h2 { margin:0; font-size:14px; font-weight:680; letter-spacing:-.01em }.column-count { font-size:12px; color:var(--muted); background:var(--surface); min-width:23px; height:23px; padding:0 7px; display:grid;place-items:center;border-radius:12px;border:1px solid var(--border) }.column-header .icon-button { margin-left:auto;background:transparent;border-color:transparent }
.status-dot { width:8px;height:8px;border-radius:50%;background:#a29e95 }.column[data-column="progress"] .status-dot{background:#ad854e}.column[data-column="done"] .status-dot{background:var(--accent)}
.task-list { overflow-y:auto; min-height:100px; padding:1px 2px 40px; scrollbar-width:thin; scrollbar-color:var(--border) transparent; flex:1 }
.task-card { position:relative; background:var(--card); border:1px solid var(--border); border-radius:11px; padding:14px 14px 13px; margin-bottom:9px; cursor:pointer; transition:border-color .15s,box-shadow .15s,transform .15s; user-select:none }
.task-card:hover { border-color:var(--faint); box-shadow:0 4px 15px rgba(30,28,24,.05); transform:translateY(-1px) }.task-card.dragging { opacity:.38 }.task-card.done { opacity:.78 }
.task-card h3 { font-size:14px;line-height:1.4;margin:0 28px 6px 0;font-weight:630;letter-spacing:-.01em;overflow-wrap:anywhere }.task-card .description { color:var(--muted); margin:0 0 12px; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-line;font-size:13px }
.card-menu-button { position:absolute;right:7px;top:7px;width:32px;min-height:32px;border-color:transparent;background:transparent;opacity:0 }.task-card:hover .card-menu-button,.card-menu-button:focus-visible { opacity:1 }
.card-meta { display:flex;flex-wrap:wrap;align-items:center;gap:6px;color:var(--muted);font-size:11px }.meta-pill,.tag { display:inline-flex;align-items:center;gap:4px;background:var(--surface-2);border-radius:6px;padding:3px 6px;border:1px solid color-mix(in srgb,var(--border) 75%,transparent);max-width:110px }.meta-pill svg{width:13px;height:13px}.meta-pill.overdue{color:var(--danger);background:var(--danger-soft)}.priority-mark{width:6px;height:6px;border-radius:50%;background:var(--faint)}.priority-low .priority-mark{background:#7592a2}.priority-medium .priority-mark{background:#ad854e}.priority-high .priority-mark{background:var(--danger)}
.drop-indicator { height:3px;background:var(--accent);border-radius:2px;margin:2px 5px 8px;box-shadow:0 0 0 2px var(--accent-soft) }
.empty-state { height:100%;min-height:180px;display:grid;place-content:center;text-align:center;padding:24px;color:var(--muted) }.empty-state svg{margin:0 auto 9px;color:var(--faint);width:24px;height:24px}.empty-state strong{color:var(--text);font-size:13px}.empty-state p{margin:4px 0 12px;font-size:12px}.empty-action{border:0;background:transparent;color:var(--accent);font-weight:650;padding:7px}
.no-results { text-align:center;margin:10vh auto;padding:30px;color:var(--muted) }.no-results svg{width:30px;height:30px}.no-results h2{color:var(--text);font-size:18px;margin:12px 0 4px}.no-results p{margin:0 0 18px}
.popover { position:fixed;z-index:45;right:clamp(16px,3vw,42px);top:66px;width:min(350px,calc(100vw - 24px));max-height:calc(100vh - 82px);overflow:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow) }.panel-heading,.dialog-header{display:flex;align-items:center;justify-content:space-between;gap:18px}.panel-heading h2,.dialog-header h2{margin:0;font-size:19px;letter-spacing:-.025em}.eyebrow{margin:0 0 2px;text-transform:uppercase;letter-spacing:.1em;font-size:10px;font-weight:750;color:var(--muted)}
.filter-panel fieldset{border:0;padding:0;margin:20px 0}.filter-panel legend,.choice-list legend{font-size:12px;font-weight:700;margin-bottom:8px}.check-list{display:grid;grid-template-columns:1fr 1fr;gap:4px}.check-list label,.tag-filter-list label{display:flex;align-items:center;gap:8px;padding:6px;border-radius:7px;color:var(--muted)}.check-list label:hover,.tag-filter-list label:hover{background:var(--surface-2);color:var(--text)}input[type=checkbox],input[type=radio]{accent-color:var(--accent);width:16px;height:16px}.tag-filter-list{max-height:120px;overflow:auto}.muted{color:var(--muted);font-size:12px}
.dialog { width:min(620px,calc(100vw - 24px));max-height:calc(100vh - 30px);padding:0;border:1px solid var(--border);border-radius:16px;background:var(--surface);color:var(--text);box-shadow:var(--shadow) }.dialog::backdrop{background:rgba(20,20,18,.38);backdrop-filter:blur(2px)}.dialog[open]{animation:dialog-in .16s ease-out}.dialog form,.settings-dialog>.dialog-header,.settings-scroll{padding:22px 24px}.dialog form>.dialog-header{margin-bottom:22px}.dialog-footer{display:flex;align-items:center;gap:8px;margin-top:24px}.field{display:flex;flex-direction:column;gap:6px}.field label,.setting-row label{font-size:12px;font-weight:680}.optional{font-weight:450;color:var(--muted);margin-left:5px}.full-field{margin-top:15px}.form-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-top:15px}
input,textarea,select{border:1px solid var(--border);border-radius:8px;background:var(--surface-2);padding:9px 10px;min-height:40px;outline:0}textarea{resize:vertical;line-height:1.5}input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent)}.field-error{min-height:0;margin:0;color:var(--danger);font-size:12px}.field-error:not(:empty){margin-top:1px}.invalid{border-color:var(--danger)!important}
.tag-editor{display:flex;align-items:center;flex-wrap:wrap;gap:5px;border:1px solid var(--border);border-radius:8px;background:var(--surface-2);padding:5px;min-height:42px}.tag-editor:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent)}.tag-editor input{border:0;box-shadow:none!important;min-height:30px;padding:4px;background:transparent;min-width:120px;flex:1}.tag-editor #tag-chips{display:contents}.tag-chip{display:inline-flex;align-items:center;gap:3px;background:var(--accent-soft);padding:4px 5px 4px 8px;border-radius:6px;font-size:12px}.tag-chip button{border:0;background:transparent;color:var(--muted);padding:0;line-height:0}.tag-chip svg{width:14px;height:14px}
.settings-dialog{width:min(680px,calc(100vw - 24px))}.settings-dialog>.dialog-header{border-bottom:1px solid var(--border)}.settings-scroll{padding-top:4px;overflow-y:auto;max-height:calc(100vh - 120px)}.settings-section{padding:18px 0;border-bottom:1px solid var(--border)}.settings-section:last-child{border:0}.settings-section h3{font-size:13px;margin:0 0 12px}.settings-section h4{font-size:12px;margin:18px 0 8px}.setting-row,.setting-action{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:9px 0}.setting-row p,.setting-action p{margin:2px 0 0;color:var(--muted);font-size:12px}.setting-row input,.setting-row select{width:210px}.setting-action strong{font-size:13px}.danger-zone{margin-top:6px;padding-top:15px;border-top:1px dashed color-mix(in srgb,var(--danger) 40%,var(--border))}.about>p{color:var(--muted);max-width:580px}.shortcuts{margin:0;display:flex;gap:22px;flex-wrap:wrap}.shortcuts div{display:flex;align-items:center;gap:7px}.shortcuts dt kbd{border:1px solid var(--border);border-bottom-width:2px;background:var(--surface-2);padding:2px 7px;border-radius:5px}.shortcuts dd{margin:0;color:var(--muted);font-size:12px}
.confirm-dialog{width:min(430px,calc(100vw - 24px));text-align:center}.confirm-dialog form{padding:28px}.confirm-dialog h2{font-size:19px;margin:13px 0 5px}.confirm-dialog>form>p{color:var(--muted);margin:0 auto 20px;max-width:330px}.confirm-icon{width:44px;height:44px;margin:auto;display:grid;place-items:center;border-radius:50%;background:var(--danger-soft);color:var(--danger)}.confirm-icon.neutral{background:var(--accent-soft);color:var(--accent)}.confirm-dialog .dialog-footer{justify-content:center}.confirm-dialog .field{text-align:left;margin:0 0 16px}.choice-list{border:0;padding:0;margin:20px 0;text-align:left}.choice-list label{display:flex;align-items:flex-start;gap:10px;padding:10px;border:1px solid var(--border);border-radius:9px;margin-top:7px}.choice-list span{display:flex;flex-direction:column}.choice-list small{color:var(--muted)}
.task-menu{position:fixed;z-index:60;width:190px;padding:6px;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow)}.task-menu button{width:100%;border:0;background:transparent;text-align:left;padding:8px 10px;border-radius:6px;display:flex;align-items:center;gap:8px;font-size:13px}.task-menu button:hover,.task-menu button:focus-visible{background:var(--surface-2)}.task-menu button.danger-item{color:var(--danger)}.task-menu hr{border:0;border-top:1px solid var(--border);margin:5px}
.toast-region{position:fixed;z-index:100;right:18px;bottom:18px;display:flex;flex-direction:column;gap:8px}.toast{background:var(--text);color:var(--bg);padding:11px 14px;border-radius:9px;box-shadow:var(--shadow);font-weight:560;animation:toast-in .2s ease-out;max-width:340px}
@keyframes dialog-in{from{opacity:0;transform:translateY(6px) scale(.99)}}@keyframes toast-in{from{opacity:0;transform:translateY(5px)}}
@media(max-width:850px){.app-header{gap:10px}.icon-label span:not(.filter-dot){display:none}.icon-label{width:40px;padding:0}.search-wrap{width:min(220px,30vw)}.board{display:flex;overflow-x:auto;scroll-snap-type:x proximity;align-items:stretch}.column{min-width:min(86vw,370px);scroll-snap-align:start}.brand h1{max-width:130px}}
@media(max-width:590px){:root{--header-h:62px}.app-header{padding:0 12px}.brand h1{font-size:17px}.brand-mark{display:none}.mobile-search-button{display:inline-flex}.search-wrap{position:absolute;top:68px;left:12px;width:calc(100vw - 24px);z-index:1;display:none;filter:drop-shadow(var(--shadow))}.search-wrap.mobile-open{display:flex}.search-wrap input{padding-right:44px}.search-wrap kbd{display:none}.search-close{position:absolute;right:3px;width:36px;height:36px;border:0;background:transparent;display:grid;place-items:center;color:var(--muted);border-radius:7px}.search-close svg{width:17px;height:17px}.header-actions{gap:5px}.header-actions .icon-button{width:38px;min-height:38px}.button.primary{width:38px;padding:0}.button.primary span{display:none}.board{padding:16px 12px 24px;gap:12px;min-height:calc(100vh - var(--header-h))}.column{height:calc(100vh - var(--header-h) - 40px);min-width:calc(100vw - 36px)}.form-grid{grid-template-columns:1fr}.dialog form,.settings-dialog>.dialog-header,.settings-scroll{padding:18px}.setting-row,.setting-action{align-items:flex-start}.setting-row{flex-direction:column;gap:7px}.setting-row input,.setting-row select{width:100%}.card-menu-button{opacity:1}.shortcuts{flex-direction:column;gap:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}