:root{--board-bg:#eef0f3;--card-bg:#fffdf5;--text:#2f2b26;--text-muted:#7a746b;--border:#e3ddc9;--accent:#4f7cff;--accent-dark:#3a63e0;--danger:#d1495b;--shadow:#1e1e1e1f 0 4px 10px -2px, #1e1e1e14 0 2px 4px -1px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;font:16px/1.5 var(--sans);color:var(--text);background:var(--board-bg);-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0}h1,h2,h3{margin:0;font-weight:600}p{margin:0}button{font:inherit;cursor:pointer}.app{flex-direction:column;min-height:100svh;display:flex}.app__header{padding:24px 32px 8px}.app__header h1{letter-spacing:-.02em;font-size:24px}@media (width<=640px){.app__header{padding:16px 16px 4px}.app__header h1{font-size:20px}}.app__status{text-align:center;color:var(--text-muted);padding:32px}.app__status--error{color:var(--danger)}.button{border:1px solid #0000;border-radius:8px;padding:8px 16px;font-size:14px;font-weight:600;transition:background-color .15s}.button--primary{background:var(--accent);color:#fff}.button--primary:hover{background:var(--accent-dark)}.button--ghost{border-color:var(--border);color:var(--text);background:0 0}.button--ghost:hover{background:#0000000a}.board{flex:1;padding:8px 32px 48px}.board__toolbar{margin-bottom:20px}.board__grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));align-items:start;gap:20px;display:grid}@media (width<=640px){.board{padding:8px 16px 32px}.board__grid{grid-template-columns:1fr;gap:16px}}.board__empty{text-align:center;color:var(--text-muted);margin-top:60px}.card{background:var(--card-bg);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:10px;flex-direction:column;gap:10px;padding:14px 16px;display:flex}.card__header{align-items:flex-start;gap:8px;display:flex}.card__drag-handle{color:var(--text-muted);cursor:grab;touch-action:none;background:0 0;border:none;margin:-6px 0 -6px -8px;padding:6px 8px;font-size:18px;line-height:1}.card__drag-handle:active{cursor:grabbing}.card__title{word-break:break-word;flex:1;font-size:16px}.card__actions{gap:4px;margin:-6px -8px -6px 0;display:flex}.card__actions button{color:var(--text-muted);background:0 0;border:none;border-radius:6px;padding:6px 8px;font-size:16px;line-height:1}.card__actions button:hover{color:var(--text);background:#0000000f}.card__dates{color:var(--text-muted);flex-direction:column;gap:2px;font-size:12px;display:flex}.card__memo{color:var(--text);white-space:pre-wrap;word-break:break-word;font-size:13px}.subtask-list{border-top:1px dashed var(--border);padding-top:10px}.subtask-list__header{color:var(--text-muted);letter-spacing:.04em;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:12px;font-weight:700;display:flex}.subtask-list__items{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.subtask-list__item{justify-content:space-between;align-items:center;gap:6px;font-size:13px;display:flex}.subtask-list__item label{flex:1;align-items:center;gap:8px;min-width:0;padding:4px 0;display:flex}.subtask-list__item input[type=checkbox]{flex-shrink:0;width:18px;height:18px}.subtask-list__item label span{overflow-wrap:anywhere}.subtask-list__item .is-done{color:var(--text-muted);text-decoration:line-through}.subtask-list__delete{color:var(--text-muted);background:0 0;border:none;margin:-6px -8px -6px 0;padding:6px 8px;font-size:16px}.subtask-list__delete:hover{color:var(--danger)}.subtask-list__add input{border:1px solid #0000;border-radius:6px;width:100%;margin-top:4px;padding:6px;font-size:16px}.subtask-list__add input:hover,.subtask-list__add input:focus{border-color:var(--border);outline:none}.modal-overlay{z-index:10;background:#14120e66;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal{width:100%;max-width:420px;box-shadow:var(--shadow);background:#fff;border-radius:12px;padding:24px}.modal h2{margin-bottom:16px;font-size:18px}.modal__field{color:var(--text-muted);flex-direction:column;gap:4px;margin-bottom:14px;font-size:13px;display:flex;position:relative}.modal__field input,.modal__field textarea{font:inherit;color:var(--text);border:1px solid var(--border);resize:vertical;border-radius:6px;padding:8px 10px;font-size:16px}.modal__subtask-add{margin-top:4px}.modal__counter{color:var(--text-muted);align-self:flex-end;font-size:11px}.modal__actions{justify-content:flex-end;gap:8px;margin-top:20px;display:flex}
