:root{--bg: #f6f7f9;--surface: #ffffff;--text: #1d2129;--muted: #5f6673;--border: #dfe3e8;--primary: #1c64d6;--primary-text: #ffffff;--danger: #c92a2a;--do: #d9480f;--schedule: #1c7ed6;--delegate: #e67700;--eliminate: #868e96;--radius: 10px;color-scheme:light dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:15px;line-height:1.4}@media(prefers-color-scheme:dark){:root{--bg: #14161a;--surface: #1d2026;--text: #e8eaed;--muted: #9aa1ad;--border: #2f343c;--primary: #4c8df6;--danger: #ff6b6b;--do: #ff8a4c;--schedule: #4dabf7;--delegate: #fcc419;--eliminate: #adb5bd}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit;color:inherit}input,select,textarea{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:8px 10px;min-width:0}button{cursor:pointer;border:1px solid var(--border);background:var(--surface);border-radius:8px;padding:8px 14px}button:disabled{opacity:.55;cursor:default}button.primary{background:var(--primary);border-color:var(--primary);color:var(--primary-text);font-weight:600}button.danger{color:var(--danger)}button.link{border:none;background:none;color:var(--primary);padding:4px}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.muted{color:var(--muted)}.error{color:var(--danger);margin:0}.grow{flex:1}.brand{display:flex;align-items:center;gap:8px;font-weight:700}.brand h1{margin:0;font-size:1.5rem}.auth{min-height:100vh;display:grid;place-items:center;padding:16px}.auth-card{width:min(380px,100%);background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:28px;display:flex;flex-direction:column;gap:14px}.auth-card label,.dialog label{display:flex;flex-direction:column;gap:4px;font-size:.9rem;color:var(--muted)}.auth-card label input{color:var(--text)}.app{max-width:1280px;margin:0 auto;padding:0 16px 32px}.topbar{display:flex;align-items:center;gap:16px;padding:14px 0;flex-wrap:wrap}.spaces{display:flex;gap:6px;flex:1;flex-wrap:wrap}.chip{border-radius:999px;padding:5px 14px;font-size:.9rem}.chip.active{background:var(--text);color:var(--bg);border-color:var(--text)}.account{display:flex;align-items:center;gap:8px}.quick-add{display:flex;gap:8px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:10px;margin-bottom:12px}.quick-add .grow{min-width:220px}.notice{background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--delegate);border-radius:8px;padding:8px 12px;margin:0 0 12px}.matrix{display:grid;grid-template-columns:28px 1fr 1fr;grid-template-rows:28px minmax(260px,auto) minmax(260px,auto);gap:12px}.axis{display:grid;color:var(--muted);font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em}.axis-top{grid-column:2 / 4;grid-row:1;grid-template-columns:1fr 1fr;gap:12px;text-align:center;align-items:end}.axis-side{grid-column:1;grid-row:2 / 4;grid-template-rows:1fr 1fr;gap:12px}.axis-side span{writing-mode:vertical-rl;transform:rotate(180deg);text-align:center}.q-do{grid-column:2;grid-row:2;--q: var(--do)}.q-schedule{grid-column:3;grid-row:2;--q: var(--schedule)}.q-delegate{grid-column:2;grid-row:3;--q: var(--delegate)}.q-eliminate{grid-column:3;grid-row:3;--q: var(--eliminate)}.quadrant{background:var(--surface);border:1px solid var(--border);border-top:4px solid var(--q);border-radius:var(--radius);padding:12px 14px;display:flex;flex-direction:column;transition:background .15s,box-shadow .15s}.quadrant.over{box-shadow:0 0 0 2px var(--q);background:color-mix(in srgb,var(--q) 6%,var(--surface))}.quadrant header{display:flex;align-items:center;justify-content:space-between}.quadrant h2{margin:0;font-size:1.05rem;color:var(--q)}.count{font-size:.85rem;color:var(--muted);font-variant-numeric:tabular-nums}.hint{margin:2px 0 10px;font-size:.82rem;color:var(--muted)}.quadrant ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;flex:1}.task{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--border);border-radius:8px;padding:8px 10px;background:var(--surface);cursor:grab}.task.completing .title{text-decoration:line-through;color:var(--muted)}.task:active{cursor:grabbing}.task input[type=checkbox]{margin-top:3px;width:16px;height:16px;accent-color:var(--q)}.task-body{all:unset;flex:1;display:flex;flex-direction:column;gap:4px;cursor:pointer;min-width:0}.task-body:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:4px}.title{overflow-wrap:anywhere}.meta{display:flex;flex-wrap:wrap;gap:6px;font-size:.8rem;color:var(--muted)}.due.soon{color:var(--do);font-weight:600}.due.overdue{color:var(--danger);font-weight:600}.tag{background:color-mix(in srgb,var(--muted) 14%,transparent);border-radius:4px;padding:0 6px}.empty{text-align:center;margin-top:16px}.dialog{width:min(560px,calc(100% - 32px));border:1px solid var(--border);border-radius:14px;background:var(--surface);color:var(--text);padding:22px}.dialog::backdrop{background:#0006}.dialog form{display:flex;flex-direction:column;gap:12px}.dialog h2{margin:0 0 4px;font-size:1.15rem}.dialog label>*{color:var(--text)}.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.actions{display:flex;gap:8px;margin-top:6px}.devices{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.devices li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px;border:1px solid var(--border);border-radius:10px}.pair{display:flex;align-items:flex-end;gap:8px}.pair label{flex:1}.dialog h3{margin:8px 0 0;font-size:1rem}.token-box{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--border);border-radius:10px}.token-box p{margin:0}.token{word-break:break-all;font-size:.9rem;padding:8px;border-radius:6px;background:var(--bg)}@media(max-width:760px){.matrix{grid-template-columns:1fr;grid-template-rows:none}.axis{display:none}.topbar{gap:10px}.account{margin-left:auto}.spaces{order:3;flex:1 0 100%;flex-wrap:nowrap;overflow-x:auto}.q-do,.q-schedule,.q-delegate,.q-eliminate{grid-column:1;grid-row:auto}.quadrant{min-height:140px}.row{grid-template-columns:1fr}}
