/* schedule — dark, thumb-first, one column. Big tap targets because this is
   used one-handed while doing something else. */
:root{
  --bg:#0b0d12; --card:#141821; --card2:#1b2130; --line:#242c3d;
  --fg:#e8ecf4; --dim:#8b97ad; --accent:#5aa9ff; --ok:#3ddc97; --warn:#ffb454; --bad:#ff6b6b;
  --safe-b:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);
  font:16px/1.45 -apple-system,BlinkMacSystemFont,"SF Pro Text",Segoe UI,Roboto,sans-serif}
#app{max-width:640px;margin:0 auto;padding:0 14px calc(84px + var(--safe-b))}
.hidden{display:none!important}

header{position:sticky;top:0;z-index:5;background:linear-gradient(var(--bg) 76%,transparent);padding:14px 0 8px}
.hdr{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
h1{font-size:26px;margin:0;letter-spacing:-.02em}
h2{font-size:18px;margin:0 0 10px}
.banner{margin-top:8px;padding:10px 12px;border-radius:10px;background:#2a2233;color:var(--warn);font-size:14px}

.list{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.day{margin:14px 2px 2px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.day.overdue{color:var(--bad)}
.item{display:flex;gap:12px;align-items:flex-start;background:var(--card);border:1px solid var(--line);
  border-radius:14px;padding:12px 13px}
.item.done{opacity:.45}
.item.done .t{text-decoration:line-through}
.item .time{font-variant-numeric:tabular-nums;color:var(--accent);font-weight:600;min-width:52px}
.item .body{flex:1;min-width:0}
.item .t{font-weight:600;overflow-wrap:anywhere}
.item .m{color:var(--dim);font-size:13px;margin-top:2px;overflow-wrap:anywhere;white-space:pre-wrap}
.item .src{color:var(--dim);font-size:11px;text-transform:uppercase;letter-spacing:.06em;margin-top:4px}
.tick{appearance:none;border:1.5px solid var(--line);background:transparent;border-radius:50%;
  width:30px;height:30px;min-width:30px;color:var(--ok);font-size:16px;line-height:1;cursor:pointer}
.tick.on{background:var(--ok);border-color:var(--ok);color:#06231a}
.del{appearance:none;border:0;background:transparent;color:var(--dim);font-size:18px;padding:2px 4px;cursor:pointer}
.del:active{color:var(--bad)}
.empty{color:var(--dim);text-align:center;padding:38px 10px;font-size:15px}

.add,.settings{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;margin-top:10px;
  display:flex;flex-direction:column;gap:10px}
input,select{width:100%;background:var(--card2);border:1px solid var(--line);color:var(--fg);
  border-radius:11px;padding:12px;font-size:16px;font-family:inherit}
input:focus,select:focus{outline:2px solid var(--accent);outline-offset:-1px}
.row{display:flex;gap:10px}
.row>*{flex:1}
.remind{display:flex;align-items:center;gap:10px;color:var(--dim);font-size:14px}
.remind select{width:auto;flex:1}
button{font-family:inherit;font-size:16px;cursor:pointer}
.primary{background:var(--accent);color:#04121f;border:0;border-radius:11px;padding:12px;font-weight:600}
.ghost{background:transparent;color:var(--fg);border:1px solid var(--line);border-radius:11px;padding:12px}
.hint{color:var(--dim);font-size:13px;margin:0}
hr{border:0;border-top:1px solid var(--line);margin:4px 0;width:100%}

nav{position:fixed;left:0;right:0;bottom:0;display:flex;gap:6px;justify-content:center;
  padding:8px 10px calc(8px + var(--safe-b));background:rgba(11,13,18,.92);
  backdrop-filter:blur(12px);border-top:1px solid var(--line)}
.tab{flex:1;max-width:180px;background:transparent;color:var(--dim);border:0;padding:11px 6px;border-radius:11px}
.tab.active{color:var(--fg);background:var(--card)}