:root[data-app=family]{--ac:#8b7bff;--ac-ink:#fff;
  --p-leo:#34d399;--p-eva:#c084fc;--p-diego:#60a5fa;--p-mum:#f472b6;--p-family:#fbbf24}
#shell{display:block}
.side{display:none}
main{padding:0 16px 24px;max-width:1400px;margin:0 auto}
.login{max-width:360px;margin:12vh auto 0;text-align:center;padding:0 20px}.login .logo{width:84px;height:84px;border-radius:22px;margin-bottom:12px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--tab-h) + var(--sab) + 20px);z-index:30;background:var(--tx);color:var(--bg);padding:10px 18px;border-radius:99px;font-weight:600;font-size:var(--t-s);animation:rise .3s var(--ease)}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--pc,var(--mu));flex:none}
.who{display:inline-flex;gap:3px}
.hero{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:16px 4px 4px;flex-wrap:wrap}
.hero .clock{font-size:var(--t-hero);font-weight:800;letter-spacing:-.04em;line-height:1}
.hero .date{font-size:var(--t-l);font-weight:700}
.wx{display:flex;gap:10px;align-items:center}.wx .t{font-size:var(--t-xl);font-weight:800}
.grid2{display:grid;gap:12px}
.lanes{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.lane{background:var(--card);border:1px solid var(--bd);border-radius:var(--r-l);padding:12px;border-top:4px solid var(--pc)}
.lane h3{display:flex;align-items:center;gap:8px;font-size:var(--t-b);margin-bottom:8px}
.ev{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;margin:6px 0;border-radius:var(--r-s);background:color-mix(in srgb,var(--pc,var(--mu)) 14%,var(--card));border-left:4px solid var(--pc,var(--mu));cursor:pointer;min-height:44px}
.ev .tm{font-size:var(--t-s);font-weight:700;color:var(--tx2);min-width:44px;font-variant-numeric:tabular-nums}
.ev .tt{font-weight:650;line-height:1.25}.ev .sub{font-size:var(--t-xs);color:var(--mu);margin-top:2px}
.ev.done{opacity:.45}.ev.hol{--pc:var(--p-family)}
.flag{font-size:11px;font-weight:700;color:var(--warn);background:color-mix(in srgb,var(--warn) 15%,transparent);padding:1px 6px;border-radius:6px;margin-left:4px;white-space:nowrap}
.cd{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}
.cdc{flex:none;min-width:130px;background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:12px}
.cdc b{display:block;font-size:var(--t-xl);font-weight:800;line-height:1}.cdc span{font-size:var(--t-s);color:var(--tx2)}
/* week */
.wkbar{display:flex;align-items:center;gap:8px;padding:12px 4px 6px;flex-wrap:wrap}
.wkbar h2{font-size:var(--t-l);flex:1;min-width:150px}
.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.day{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:8px;min-height:240px;display:flex;flex-direction:column}
.day.today{border-color:var(--ac);box-shadow:0 0 0 2px var(--ac-soft)}
.day.hol{background:color-mix(in srgb,var(--p-family) 6%,var(--card))}
.day .dh{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:4px;cursor:pointer}
.day .dh b{font-size:var(--t-l);font-weight:800}.day .dh span{font-size:var(--t-xs);font-weight:700;text-transform:uppercase;color:var(--mu)}
.day .ev{padding:6px 8px;margin:4px 0;font-size:var(--t-s);gap:6px}.day .ev .tm{min-width:0;font-size:11px}
.day .foot{margin-top:auto;border-top:1px solid var(--bd);padding-top:6px;font-size:var(--t-xs);color:var(--tx2)}
.day .foot div{display:flex;gap:4px;align-items:center;min-height:22px}
.add{border:1px dashed var(--bd2);background:transparent;color:var(--mu);min-height:36px;font-size:var(--t-s);margin-top:4px;width:100%}
/* month */
.month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.mh{font-size:var(--t-xs);font-weight:700;color:var(--mu);text-align:center;padding:4px}
.mc{background:var(--card);border:1px solid var(--bd);border-radius:10px;min-height:92px;padding:5px;cursor:pointer;overflow:hidden}
.mc.out{opacity:.4}.mc.today{border-color:var(--ac)}.mc.hol{background:color-mix(in srgb,var(--p-family) 9%,var(--card))}
.mc b{font-size:var(--t-s)}.mc .mi{font-size:11px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:1px 4px;margin-top:2px;border-radius:4px;background:color-mix(in srgb,var(--pc) 22%,transparent)}
/* lists */
.li{display:flex;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid var(--bd);min-height:52px}
.li .ck{width:30px;height:30px;min-height:30px;border-radius:50%;padding:0;border:2px solid var(--bd2);background:transparent;flex:none}
.li.done .ck{background:var(--ok);border-color:var(--ok)}.li.done .tt{text-decoration:line-through;color:var(--mu)}
.qa{display:flex;gap:8px;margin:8px 0}
.meal{display:grid;grid-template-columns:90px 1fr;gap:10px;align-items:center;margin:6px 0}
.meal b{font-size:var(--t-s)}
.pchips{display:flex;gap:6px;flex-wrap:wrap}
.pchip{min-height:40px;border-radius:99px;padding:6px 14px;font-weight:650;font-size:var(--t-s);border:2px solid var(--pc);background:transparent}
.pchip.on{background:var(--pc);color:#111}
.src{font-size:var(--t-xs);color:var(--mu);background:var(--card2);border-radius:var(--r-s);padding:10px;margin-top:12px}
.src a{color:var(--ac)}
.step{display:flex;gap:6px;margin:8px 0 14px}.step i{flex:1;height:5px;border-radius:3px;background:var(--card3)}.step i.on{background:var(--ac)}
.duty{display:grid;grid-template-columns:110px 1fr 1fr;gap:8px;align-items:center;margin:6px 0}
.sheet{max-width:640px;margin:0 auto}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kiosk .tabbar,.kiosk .side{opacity:.85}
/* iPad / desktop: side rail */
@media (min-width:900px){
  body{padding-bottom:var(--sab)}
  #shell{display:grid;grid-template-columns:96px 1fr;min-height:100vh}
  .side:not([hidden]){display:flex;flex-direction:column;gap:6px;padding:calc(var(--sat) + 16px) 10px 16px;position:sticky;top:0;height:100vh;border-right:1px solid var(--bd);background:var(--bg2)}
  .side button{border:0;background:transparent;display:flex;flex-direction:column;align-items:center;gap:4px;min-height:72px;border-radius:16px;color:var(--mu);font-size:12px;font-weight:650}
  .side button.on{background:var(--ac-soft);color:var(--ac)}.side svg{width:28px;height:28px}
  .side .sp{flex:1}
  .tabbar{display:none!important}
  main{padding:0 24px 24px}
  .grid2{grid-template-columns:1.6fr 1fr}
  .toast{bottom:30px}
  .scrim{align-items:center}.sheet{border-radius:var(--r-xl);max-height:90vh}.sheet::before{display:none}
}
@media (max-width:899px){
  .week{grid-template-columns:1fr;gap:6px}.day{min-height:0}.day .dh{justify-content:flex-start;gap:8px}
  .mc{min-height:56px}.mc .mi{display:none}.mc .dots{display:flex;gap:2px;flex-wrap:wrap;margin-top:3px}.mc .dots .dot{width:7px;height:7px}
  .hero .clock{font-size:var(--t-xxl)}
}
@media (min-width:900px){.mc .dots{display:none}}
.ev .tt{overflow-wrap:anywhere}.day .flag{display:inline-block;margin:2px 0 0}
@media (min-width:900px){.side:not([hidden]){padding-bottom:84px}}