:root{font-family:Segoe UI,Arial,sans-serif;color:#23364a;background:#edf2f5;font-size:14px;line-height:1.5}
*{box-sizing:border-box}body{margin:0}
.app{max-width:1050px;margin:auto;min-height:100vh;background:#fff;box-shadow:0 0 40px #17364a0a}
header{position:relative;padding:26px 30px;color:#fff;background:#193b45}
h1{margin:3px 0;font-size:27px;letter-spacing:-.5px}header p{margin:0;color:#d1e2e5;max-width:720px}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:#a7d4c4}
.phase{position:absolute;right:30px;top:35px;background:#31525b;padding:5px 12px;border-radius:20px;font-size:12px}
.muted{font-size:12px;color:#62756d}
button,input,select,textarea{font:inherit;border:1px solid #cbd8df;border-radius:7px;background:#fff;color:inherit}
button{padding:7px 11px;cursor:pointer}button:hover{background:#f0f6f4;border-color:#839d92}button:disabled{opacity:.6;cursor:wait}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid #267d64;outline-offset:2px}
input,select,textarea{padding:8px}textarea{width:100%;resize:vertical}
.primary{background:#267b60;color:#fff;border-color:#267b60;font-weight:600;white-space:nowrap}.primary:hover{background:#1e664f}
.key-panel{padding:22px 30px;background:#f4f9f7;border-bottom:1px solid #dce7e2}
.key-panel form{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.key-panel input{width:260px}#key-error{color:#a23b2f;font-size:12px}
.toolbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap;padding:12px 30px;border-bottom:1px solid #e2e8ed;font-size:12px}
.toolbar select,.toolbar input{margin-left:5px;width:auto}.toolbar .name input{width:150px}
#status{margin-left:auto;font-size:12px;color:#567366}#status.error{color:#a23b2f}
#todos{padding:18px 30px}
.empty{padding:65px 12px;text-align:center;color:#6e7f8d}
.todo{border:1px solid #dfe7ec;border-left:5px solid #9fb3bd;border-radius:10px;padding:14px 16px;margin-bottom:14px;background:#fff}
.todo.status-proposed{border-left-color:#7c93c9}.todo.status-agreed{border-left-color:#298368}.todo.status-in_progress{border-left-color:#d99a1e}
.todo.status-done{border-left-color:#6b8f7f;background:#f6faf7}.todo.status-done h3{text-decoration:line-through;color:#6c7d75}
.todo.status-dropped{border-left-color:#b8b8b8;opacity:.75}
.todo-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap}
.todo h3{margin:0;font-size:16px}
.badges{display:flex;gap:5px;flex-wrap:wrap}
.badge{font-size:10px;padding:2px 8px;border-radius:12px;background:#edf1f4;color:#5d6e7a;white-space:nowrap}
.badge-proposed{background:#e7ecf8;color:#3f5aa3}.badge-agreed{background:#e2f3ec;color:#1f6b52}.badge-in_progress{background:#fbf0d8;color:#8a5f0b}
.badge-done{background:#e5efe9;color:#3f6a58}.badge-dropped{background:#ececec;color:#777}
.priority-now{background:#fde6e1;color:#a23b2f}.priority-next{background:#eef4f7;color:#4a6577}.priority-later{background:#f1f1f1;color:#777}
.details{white-space:pre-wrap;overflow-wrap:anywhere;margin:9px 0 6px}
.meta{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:#778794}.meta .source{font-style:italic}
.controls{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}.controls select{font-size:12px;padding:5px 7px}
.comments{margin-top:10px;border-top:1px dashed #e2e8ed;padding-top:8px}
.comments summary{cursor:pointer;font-size:12px;font-weight:600;color:#437565}
.comment{margin:8px 0 0 12px;padding:8px 11px;background:#f0f8f4;border:1px solid #dfebe4;border-radius:3px 12px 12px}
.comment-meta{font-size:12px;font-weight:600;margin-bottom:3px}.comment-meta time{font-weight:400;color:#778794;margin-left:8px}
.comment-text{white-space:pre-wrap;overflow-wrap:anywhere}
.comment-form{display:flex;gap:8px;margin:9px 0 0 12px;align-items:flex-start}.comment-form textarea{min-height:44px}
.compose{padding:17px 30px;border-top:1px solid #e2e8ed}.compose summary{cursor:pointer;font-weight:600}
.compose form{margin-top:12px;display:grid;gap:10px}.compose label{display:grid;gap:4px;font-size:12px;color:#566d7c}
.fields{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.compose-foot{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
@media(max-width:700px){header,.key-panel,.toolbar,#todos,.compose{padding-left:17px;padding-right:17px}.phase{position:static;display:inline-block;margin-top:12px}
h1{font-size:24px}.fields{grid-template-columns:1fr 1fr}#status{width:100%;margin:0}.comment-form{flex-direction:column}.comment-form .primary{align-self:flex-end}}