:root{
  --bg:#f6f4ef; --card:#ffffff; --ink:#1d2433; --muted:#5b6475; --line:#d9d5cb;
  --accent:#1f5fbf; --accent-ink:#ffffff; --accent-soft:#e3edfb; --ok:#1f8a4c; --warn:#c96a00;
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#141821; --card:#1d2330; --ink:#eef1f7; --muted:#a8b0c0; --line:#343c50; --accent:#6aa3ff; --accent-ink:#0b1220; --accent-soft:#223253; --ok:#4cc380; --warn:#ffb04a; }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0; background:var(--bg); color:var(--ink); font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; line-height:1.4;
  padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
[hidden]{display:none !important}
button{font-family:inherit; font-size:1rem; color:inherit}
.page{max-width:560px; margin:0 auto; padding:16px 16px 40px}
h1{font-family:ui-serif,Georgia,serif; font-size:1.7rem; margin:4px 0 2px}
.sub{color:var(--muted); margin:0 0 16px}
.today{background:var(--accent-soft); border:2px solid var(--accent); border-radius:20px; padding:14px; margin-bottom:16px}
.today b{font-size:1.1rem}
.tiles{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.tile{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-height:132px; padding:12px; text-align:center;
  background:var(--card); border:3px solid var(--line); border-radius:22px; text-decoration:none; color:inherit; font-weight:800; font-size:1.1rem}
.tile .e{font-size:2.6rem; line-height:1}
.tile small{font-weight:600; color:var(--muted); font-size:.8rem}
.tile.soon{opacity:.6}
.back{display:inline-flex; align-items:center; min-height:48px; padding:0 14px; border-radius:14px; border:2px solid var(--line); background:var(--card); text-decoration:none; color:inherit; font-weight:800}
.card{background:var(--card); border:2px solid var(--line); border-radius:18px; padding:14px; margin:14px 0}
.foot{margin-top:24px; font-size:.8rem; color:var(--muted); text-align:center}
.update{position:fixed; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom)); max-width:536px; margin:0 auto; z-index:50;
  display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 14px; background:var(--ink); color:var(--bg); border-radius:16px; font-weight:700}
.update button{min-height:44px; padding:0 14px; border-radius:12px; border:0; background:var(--accent); color:var(--accent-ink); font-weight:800; cursor:pointer}
