*{box-sizing:border-box}:root{--bg:#f7f6f3;--panel:#fff;--text:#222;--muted:#888;--border:#e6e3dd;--accent:#7f9c89;--soft:#e3ece6;--hour:58px;--time:31%;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",sans-serif}body{margin:0;background:var(--bg);color:var(--text)}button,input,select{font:inherit}button{cursor:pointer}#app{max-width:720px;margin:auto;padding:env(safe-area-inset-top) 16px calc(86px + env(safe-area-inset-bottom));min-height:100vh}header{height:54px;display:flex;align-items:center;justify-content:space-between;letter-spacing:.14em}header button,.calhead button{border:0;background:none;font-size:20px}.calendar{background:#fff;border:1px solid var(--border);border-radius:24px;padding:13px 14px 9px;box-shadow:0 8px 30px #0000000d}.calhead{display:grid;grid-template-columns:36px 1fr 36px;align-items:center;text-align:center}.calhead b{font-size:17px}.week,.grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.week{margin-top:9px;text-align:center;color:var(--muted);font-size:11px}.grid{margin-top:3px}.day{min-height:31px;border:0;border-radius:11px;background:none;position:relative;font-size:13px}.day.other{opacity:.23}.day.today{background:var(--accent);color:white;font-weight:850}.day.selected:not(.today){outline:1.5px solid var(--accent)}.dots{position:absolute;bottom:1px;left:50%;transform:translateX(-50%);display:flex;gap:2px}.dot{width:3px;height:3px;border-radius:50%}.calendar>button{width:100%;border:0;background:none;color:var(--muted);padding:6px;font-size:12px}.calendar.big .day{min-height:48px;font-size:15px}.dailyhead{display:flex;justify-content:space-between;align-items:center;margin:18px 2px 8px}.dailyhead small,#routine>small{letter-spacing:.18em;color:var(--muted);font-weight:750}.dailyhead button{width:36px;height:36px;border:0;border-radius:50%;background:#222;color:#fff;font-size:22px}.timeline{position:relative;background:#fff;border:1px solid var(--border);border-radius:22px;overflow:hidden;box-shadow:0 8px 30px #0000000d}.hourrow{height:var(--hour);display:grid;grid-template-columns:var(--time) 1fr}.hourlabel{position:relative;text-align:right;padding-right:14px;border-right:1px solid var(--border);color:var(--muted);font-size:13px;font-weight:600;transform:translateY(-7px)}.hourspace{border-top:1px solid #f0eeea}.hourrow:first-child .hourspace{border-top:0}.events{position:absolute;inset:0;pointer-events:none}.event{position:absolute;left:calc(var(--time) + 9px);right:9px;border:1px solid #0000000d;border-radius:14px;padding:7px 8px 6px 35px;text-align:left;overflow:hidden;pointer-events:auto}.event .ico{position:absolute;left:8px;top:6px;font-size:18px}.event b{font-size:13px}.event small{display:block;font-size:10px;opacity:.65;margin-top:2px}.now{position:absolute;left:0;right:0;height:0;z-index:5}.minute{position:absolute;right:calc(100% - var(--time) + 7px);top:-10px;background:var(--accent);color:#fff;border-radius:10px;padding:3px 6px;font-size:10px;font-weight:800;min-width:28px;text-align:center}.nowdot{position:absolute;left:calc(var(--time) - 4px);top:-4px;width:8px;height:8px;background:var(--accent);border-radius:50%}.nowline{position:absolute;left:var(--time);right:0;top:-1px;height:2px;background:var(--accent)}#routine{padding-top:18px}.icons{margin-top:8px;display:grid;grid-template-columns:repeat(8,1fr);background:#fff;border:1px solid var(--border);border-radius:20px;padding:8px}.ricon{position:relative;min-height:44px;border:0;background:none;font-size:20px;filter:grayscale(1);opacity:.45}.ricon.done{filter:none;opacity:1}.ricon.done:before{content:"";position:absolute;inset:12px 2px;background:var(--c);opacity:.28;border-radius:50% 35% 45% 30%;z-index:-1}nav{position:fixed;left:50%;bottom:calc(10px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(calc(100% - 32px),688px);display:grid;grid-template-columns:repeat(3,1fr);padding:6px;background:#ffffffe8;backdrop-filter:blur(14px);border:1px solid var(--border);border-radius:20px}nav button{border:0;background:none;padding:11px;color:var(--muted);border-radius:14px}nav .active{background:var(--soft);color:#222;font-weight:750}.hidden{display:none!important}dialog{width:min(92vw,520px);border:0;border-radius:26px;padding:0}dialog::backdrop{background:#0004;backdrop-filter:blur(2px)}dialog form{padding:20px;display:flex;flex-direction:column;gap:14px}.dialoghead{display:flex;justify-content:space-between;align-items:center}.dialoghead button{border:0;background:none;font-size:20px}label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}input,select{width:100%;padding:12px;border:1px solid var(--border);border-radius:14px;background:#fff}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.actions{display:flex;gap:10px}.actions button,#newcat{padding:12px;border:1px solid var(--border);border-radius:14px;background:#fff}.actions .save{flex:1;background:#222;color:#fff}.catrow{display:grid;grid-template-columns:1fr 54px 35px;gap:8px;margin:8px 0}.catrow input[type=color]{height:42px;padding:3px}@media(max-width:390px){:root{--time:30%;--hour:55px}}
/* v0.1.2 — keep the final hour comfortably visible above the bottom nav */
.timeline-section{padding-bottom:78px}
.timeline:after{
  content:"12 AM";
  position:absolute;
  left:0;
  bottom:-8px;
  width:var(--time);
  padding-right:14px;
  text-align:right;
  color:var(--muted);
  font-size:13px;
  font-weight:600;
  pointer-events:none
}