:root{font-family:system-ui,sans-serif;color:#e8ecf1;background:#0f1419;--surface:#182029;--text:#e8ecf1;--muted:#97a4b4;--line:#243040;--accent:#5fb3f6;--ok:#3ecf8e;--warn:#f0b35a;--bad:#ef6b73}body{margin:0;background:#0f1419}button,input,textarea,select{font:inherit}main{max-width:720px;margin:0 auto;padding:12px 16px 84px}p{line-height:1.6;color:var(--muted)}.bar{display:flex;align-items:center;justify-content:space-between;height:52px;padding:0 16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#0f1419;z-index:2}.brand{font-weight:600}.tabs{position:fixed;bottom:0;left:0;right:0;display:flex;background:#0f1419;border-top:1px solid var(--line);padding:6px 8px calc(6px + env(safe-area-inset-bottom))}.tabs button{flex:1;background:none;border:0;color:var(--muted);padding:10px;border-radius:10px;font-weight:500;display:flex;gap:6px;justify-content:center;align-items:center}.tabs button.on{color:var(--text);background:var(--surface)}.tabs b{background:var(--bad);color:#fff;border-radius:10px;padding:0 7px;font-size:12px;line-height:18px}h2{font-size:20px;font-weight:600;margin:16px 0 8px}h3{font-size:13px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin:18px 0 6px}.group h2{display:flex;align-items:center;gap:8px;font-size:15px}.count{background:var(--surface);color:var(--muted);border-radius:10px;padding:0 8px;font-size:12px;line-height:20px;font-weight:500}.g-late h2{color:var(--bad)}.g-today h2{color:var(--warn)}.due-row,.item{display:flex;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:8px}.due-row input,.item>input{width:22px;height:22px;accent-color:var(--ok);flex:none}.due-row .main,.item-body{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0;text-align:left;background:none;border:0;color:inherit;padding:0}.title{font-size:16px;color:var(--text)}.sub{font-size:13px;color:var(--muted)}.item.done .title{text-decoration:line-through;color:var(--muted)}.when{display:flex;flex-direction:column;align-items:flex-end;font-size:13px;color:var(--muted);flex:none}.when b{color:var(--text);font-weight:600}.when.late b{color:var(--bad)}.when.today b{color:var(--warn)}.when small{font-size:12px}.tx-row{display:flex;flex-direction:column;gap:3px;width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:8px;color:var(--text)}.primary{background:var(--accent);color:#06243a;border:0;border-radius:10px;padding:12px 18px;font-weight:600}.wide{width:100%;margin:8px 0 12px}.actions{display:flex;gap:8px;margin-top:8px}.actions button{border:0;border-radius:10px;padding:12px 16px;background:#263040;color:var(--text)}.actions .primary{background:var(--accent);color:#06243a}.sheet{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:12px;margin-top:12px}.sheet label,.add,.edit{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}input[type=text],input:not([type]),input[type=date]{background:#0f1419;border:1px solid var(--line);border-radius:10px;color:var(--text);padding:11px 12px;font-size:16px;width:100%;box-sizing:border-box}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.seg{display:flex;gap:6px}.seg button{flex:1;background:#0f1419;border:1px solid var(--line);color:var(--muted);border-radius:10px;padding:10px}.seg button.on{border-color:var(--accent);color:var(--text)}.hint{font-size:13px}.error{color:var(--bad)}.detail-head .back{background:none;border:0;color:var(--accent);padding:4px 0}.detail-head h2{margin:6px 0 2px}.add{background:var(--surface);border:1px dashed var(--line);border-radius:12px;padding:12px;gap:8px}.add-link{background:none;border:0;color:var(--accent);padding:8px 2px;text-align:left}.edit{flex:1;gap:6px}.edit button{align-self:flex-start;background:#263040;color:var(--text);border:0;border-radius:8px;padding:8px 12px}.edit .danger{color:var(--bad)}.close-tx{margin-top:24px;background:none;border:1px solid var(--line);color:var(--muted);border-radius:10px;padding:10px 14px}.toggle{font-size:13px;color:var(--muted);display:flex;gap:6px;align-items:center;margin-top:12px}.empty{margin:14vh auto;max-width:460px;text-align:center}@media(min-width:860px){.tabs{position:sticky;top:52px;bottom:auto;border-top:0;border-bottom:1px solid var(--line);justify-content:center}.tabs button{flex:0 0 auto;padding:10px 20px}main{padding-bottom:40px}}
