/* BLP Movers — "Ivory Keys" design system
   ivory ground, black hairline rules instead of boxes, Playfair Display for
   times and names, Open Sans for everything operational, oxblood only for
   the Text ETA button and the stairs warning. */
:root{
  --paper:#F6F4EE; --card:#FFFFFF; --ink:#151515; --mut:#6B6760; --mut2:#8E8A82;
  --line:#CFCBC0; --line-soft:#E6E2D8; --red:#8B1E1E; --red-dark:#6E1616;
  --red-bg:#FBF1F1; --good:#2E7D4F; --good-bg:#E8F2EC; --warn:#B8860B; --warn-bg:#FBF4E3;
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;
  --sans:'Open Sans','Helvetica Neue',Arial,sans-serif;
  --radius:12px; --tap:48px;
  color-scheme:light;
}
*{box-sizing:border-box;margin:0}
html,body{height:100%}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.45;
  display:flex;flex-direction:column;-webkit-font-smoothing:antialiased;overscroll-behavior-y:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:inherit}
[hidden]{display:none!important}
.lite{color:var(--mut);font-size:13px}
.serif{font-family:var(--serif)}
.num{font-variant-numeric:tabular-nums}

/* ---------- top bar ---------- */
.bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:8px;
  padding:calc(8px + env(safe-area-inset-top,0px)) 14px 8px;background:var(--paper);
  border-bottom:2px solid var(--ink)}
.logo{height:36px;width:auto;cursor:pointer}
.barsp{flex:1}
.iconbtn{background:none;border:1px solid var(--line);border-radius:10px;color:var(--ink);
  font-size:17px;width:42px;height:40px;display:grid;place-items:center;flex:none}
.iconbtn:active{background:#fff}
.iconbtn.bulb{border-color:#E4C55A;background:#FFF8DC}

/* ---------- live share banner ---------- */
.share{display:flex;align-items:center;gap:10px;padding:8px 14px;background:var(--red);color:#fff;font-size:13px;font-weight:600}
.share .dot{width:9px;height:9px;border-radius:50%;background:#fff;animation:pulse 1.4s ease-in-out infinite}
.share .sharetxt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini{border:1.5px solid #fff;background:#fff;color:var(--red);border-radius:999px;padding:5px 12px;font-size:12.5px;font-weight:700}
.mini.ghost{background:transparent;color:#fff}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.share .dot{animation:none}}

/* ---------- main ---------- */
.main{flex:1;padding:12px 18px calc(84px + env(safe-area-inset-bottom,0px));max-width:720px;width:100%;margin:0 auto}
.dayhead{display:flex;align-items:flex-end;gap:10px;padding:6px 0 10px;border-bottom:2px solid var(--ink);margin-bottom:4px}
.dayhead h1{font-family:var(--serif);font-size:24px;font-weight:700;line-height:1.05;flex:1;min-width:0}
.dayhead .sub{font-family:var(--serif);font-style:italic;font-size:13px;color:var(--mut);margin-top:3px}
.daynav{display:flex;gap:6px}
.daynav button{width:40px;height:40px;border-radius:50%;border:0;padding:3px;font-size:17px;font-weight:700;color:var(--ink);
  background:conic-gradient(from 200deg,#E40303,#FF8C00,#FFED00,#008026,#24408E,#732982,#E40303);
  box-shadow:0 2px 8px rgba(0,0,0,.15);position:relative;display:grid;place-items:center}
.daynav button::before{content:"";position:absolute;inset:3px;border-radius:50%;background:#fff}
.daynav button span{position:relative;z-index:1}
.daynav button:active{transform:scale(.94)}
@media (prefers-reduced-motion:no-preference){.daynav button{transition:transform .1s}}
.demo{background:var(--warn-bg);border:1px solid #EAD9A6;border-radius:10px;padding:8px 12px;font-size:12.5px;color:#6b5306;margin:10px 0 2px}

/* ---------- move cards (rules, not boxes) ---------- */
.moves{display:flex;flex-direction:column}
.move{display:grid;grid-template-columns:64px 1fr;gap:12px;padding:16px 0;border-bottom:1px solid var(--line)}
.move.done{opacity:.5}
.move.live{background:linear-gradient(90deg,var(--red-bg),transparent 40%);margin:0 -18px;padding-inline:18px}
.mtime{font-family:var(--serif);font-size:22px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.mtime small{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);margin-top:5px;font-weight:700}
.mtime small.live{color:var(--red)}
.mbody{display:grid;gap:9px;min-width:0}
.mname{font-family:var(--serif);font-size:20px;font-weight:700;line-height:1.1}
.mpiano{font-size:13px;color:#3A3835}
.addr{display:grid;gap:4px;font-size:13px}
.addr .a{display:grid;grid-template-columns:36px 1fr;gap:6px;align-items:baseline}
.addr .a b{font-size:9.5px;letter-spacing:.1em;color:var(--red);font-weight:700}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:700;
  background:#fff;border:1px solid var(--line);color:var(--ink);letter-spacing:.01em}
.chip.warn{background:var(--red);border-color:var(--red);color:#fff}
.chip.good{background:var(--good-bg);border-color:#BFD9C8;color:var(--good)}
.chip.soft{background:transparent;color:var(--mut);font-weight:600}
.btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:2px}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:var(--tap);border-radius:999px;
  border:1.5px solid var(--ink);background:#fff;color:var(--ink);font-weight:700;font-size:14px;padding:0 14px;text-decoration:none;text-align:center}
.btn.primary,.btn.nav{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.btn.eta{background:var(--red);border-color:var(--red);color:#fff}
.btn.eta:active{background:var(--red-dark)}
.btn.wide{width:100%}
.btn.sm{min-height:40px;font-size:13px}
.btn:disabled{opacity:.5}
.mlinks{display:flex;flex-wrap:wrap;gap:4px 14px;padding-top:2px}
.mlinks a{font-size:13.5px;font-weight:600;color:var(--red);text-decoration:underline;text-underline-offset:3px;padding:6px 0;display:inline-flex;align-items:center;gap:5px}
.mlinks a.quiet{color:var(--mut)}
.mnote{font-size:13px;color:var(--mut);white-space:pre-wrap}
details.raw{font-size:13px;color:var(--mut)}
details.raw summary{cursor:pointer;font-weight:600;color:var(--ink);padding:4px 0}
details.raw pre{white-space:pre-wrap;font:inherit;padding:8px 0}
.empty{padding:40px 0;text-align:center;color:var(--mut);font-family:var(--serif);font-style:italic;font-size:17px}

/* ---------- pages ---------- */
.page{display:grid;gap:14px;padding-top:6px}
.page h1{font-family:var(--serif);font-size:24px;font-weight:700;line-height:1.1}
.page h2{font-family:var(--serif);font-size:18px;font-weight:700;padding:14px 0 6px;border-bottom:1px solid var(--ink);margin-bottom:4px}
.page h2 small{font-family:var(--sans);font-weight:600;font-size:12px;color:var(--mut);margin-left:8px}
.page p{color:#3A3835}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px}
.rowk{display:grid;grid-template-columns:110px 1fr;gap:6px 10px;font-size:13.5px;align-items:baseline}
.rowk b{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);font-weight:700}
.back{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--mut);text-decoration:none;font-weight:600}

/* ---------- forms ---------- */
.fld{display:grid;gap:5px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--mut)}
.fld input,.fld select,.fld textarea{font-size:16px;letter-spacing:0;text-transform:none;font-weight:400;color:var(--ink);
  border:1px solid var(--line);border-radius:10px;padding:11px 12px;background:#fff;min-height:var(--tap);width:100%}
.fld textarea{min-height:88px;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:2px solid var(--ink);outline-offset:-1px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
@media (max-width:380px){.grid3{grid-template-columns:1fr 1fr}}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.seg button{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:#fff;font-weight:600;font-size:13.5px}
.seg button.on{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.seg.red button.on{background:var(--red);border-color:var(--red)}
.seg.good button.on{background:var(--good);border-color:var(--good)}
.cond{display:grid;gap:8px}
.condrow{display:grid;gap:6px;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.condrow[data-f]{grid-template-columns:1fr auto;align-items:center}
.condrow:last-child{border-bottom:0}
.condrow .lbl{font-weight:600;font-size:14px}
.condrow .lbl small{display:block;font-weight:400;color:var(--mut);font-size:12px}
.condrow .seg button{min-height:34px;padding:0 10px;font-size:12.5px}
.condrow textarea{grid-column:1/-1;font:inherit;font-size:14px;border:1px solid var(--line);border-radius:8px;padding:8px 10px;min-height:44px;width:100%}
.condrow.flag .lbl{color:var(--red)}
.check{display:flex;align-items:center;gap:10px;font-size:14.5px;padding:10px 0;font-weight:600}
.check input{width:22px;height:22px;accent-color:var(--ink)}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;background:#fff;overflow:hidden}
.stepper button{width:44px;height:44px;border:0;background:none;font-size:20px}
.stepper input{width:56px;text-align:center;border:0;font-size:18px;font-weight:700;font-variant-numeric:tabular-nums}
.stepper input:focus{outline:none}
.msg{font-size:13px;min-height:18px;color:var(--mut)}
.msg.err{color:var(--red)}
.msg.ok{color:var(--good)}

/* photos */
.shots{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}
.shot{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;background:#EEE9DF;border:1px solid var(--line)}
.shot img,.shot video{width:100%;height:100%;object-fit:cover;display:block}
.shot .tag{position:absolute;left:5px;bottom:5px;background:rgba(21,21,21,.85);color:#fff;font-size:10px;font-weight:700;padding:2px 6px;border-radius:6px;letter-spacing:.04em}
.shot .x{position:absolute;top:4px;right:4px;width:24px;height:24px;border-radius:50%;border:0;background:rgba(255,255,255,.92);font-size:12px;line-height:1}
.shot .vid{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:26px;text-shadow:0 1px 6px rgba(0,0,0,.6);pointer-events:none}
.addshot{aspect-ratio:1;border:1.5px dashed var(--line);border-radius:10px;display:grid;place-items:center;text-align:center;font-size:12px;font-weight:700;color:var(--mut);cursor:pointer;background:#fff}
.addshot input{display:none}
.addshot span{display:block;font-size:22px;color:var(--ink)}
.progress{height:8px;border-radius:999px;background:var(--line-soft);overflow:hidden}
.progress i{display:block;height:100%;background:var(--good);width:0;transition:width .2s}

/* signature */
.sigpad{border:1px solid var(--line);border-radius:10px;background:#fff;touch-action:none;display:block;width:100%;height:150px}
.sigrow{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--mut)}
.sigrow button{border:0;background:none;color:var(--red);font-weight:700;text-decoration:underline}

/* ---------- money table (change order) ---------- */
.lines{display:grid;gap:0}
.line{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.line .lt{font-weight:600;font-size:14px}
.line .lt small{display:block;color:var(--mut);font-weight:400;font-size:12px}
.line .amt{font-variant-numeric:tabular-nums;font-weight:700;min-width:64px;text-align:right}
.line.total{border-top:2px solid var(--ink);border-bottom:0;font-family:var(--serif);font-size:20px}
.line .stepper button{width:38px;height:38px}
.line .stepper input{width:40px;font-size:15px}

/* ---------- tabs ---------- */
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:repeat(4,1fr);
  background:var(--paper);border-top:1px solid var(--line);padding:6px 8px calc(8px + env(safe-area-inset-bottom,0px))}
.tabs a{display:grid;justify-items:center;gap:2px;text-decoration:none;font-size:10.5px;color:var(--mut);padding:4px 0;font-weight:600}
.tabs a i{font-style:normal;font-size:20px;line-height:1}
.tabs a.on{color:var(--ink);font-weight:700}

/* ---------- drawer ---------- */
.scrim{position:fixed;inset:0;background:rgba(21,21,21,.35);z-index:30;opacity:0;pointer-events:none;transition:opacity .18s}
.scrim.show{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(300px,84vw);background:var(--ink);color:#E8E4DA;z-index:31;
  padding:calc(18px + env(safe-area-inset-top,0px)) 14px calc(18px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:2px;
  transform:translateX(105%);transition:transform .2s ease;overflow-y:auto}
.drawer.open{transform:none}
.drawer a{display:block;padding:12px 12px;border-radius:8px;text-decoration:none;color:#D9D4C8;font-size:14.5px;font-weight:600}
.drawer a:active{background:#2A2A2A}
.dhead{padding:6px 12px 14px;border-bottom:1px solid #333;margin-bottom:8px}
.dhead b{display:block;font-family:var(--serif);font-size:20px;color:#fff}
.dhead small{color:#9A958A;font-size:12px}
.dsec{margin-top:12px;padding:8px 12px 4px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#7C776C;font-weight:700}
.dfoot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding:14px 12px 0;color:#7C776C;font-size:12px}
.link{background:none;border:0;color:#D9D4C8;text-decoration:underline;padding:0;font-size:13px}

/* ---------- bottom sheet ---------- */
.sheet{position:fixed;inset:0;z-index:40;background:rgba(21,21,21,.45);display:flex;align-items:flex-end;justify-content:center}
.sheetbox{position:relative;background:var(--paper);width:100%;max-width:720px;max-height:92vh;overflow-y:auto;border-radius:18px 18px 0 0;
  padding:14px 18px calc(18px + env(safe-area-inset-bottom,0px));display:grid;gap:12px;animation:up .2s ease}
@keyframes up{from{transform:translateY(30px);opacity:.5}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.sheetbox{animation:none}}
.sheetbox h3{font-family:var(--serif);font-size:20px;font-weight:700}
.sheetbox .handle{width:40px;height:4px;border-radius:2px;background:var(--line);margin:0 auto}
.opts{display:grid;gap:8px}
.opt{display:grid;gap:3px;text-align:left;border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px 14px}
.opt b{font-size:14.5px}
.opt small{color:var(--mut);font-size:12.5px;white-space:pre-wrap}
.opt.red{border-color:var(--red)}
.opt.red b{color:var(--red)}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:calc(90px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:50;
  background:var(--ink);color:#fff;padding:10px 16px;border-radius:999px;font-size:13.5px;font-weight:600;max-width:90vw;text-align:center;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.toast.err{background:var(--red)}

/* ---------- gate ---------- */
#gate{position:fixed;inset:0;z-index:60;background:var(--paper);display:grid;place-items:center;padding:24px}
.gatecard{width:min(380px,100%);display:grid;gap:12px;text-align:center}
.gatecard img{width:200px;margin:0 auto}
.gatecard h1{font-family:var(--serif);font-size:28px}
.gatecard .fld{text-align:left}

/* ---------- upsell / more ---------- */
.ups{display:grid;gap:10px}
.up{border:1px solid var(--line);border-radius:var(--radius);background:#fff;padding:12px 14px;display:grid;gap:6px}
.up b{font-family:var(--serif);font-size:17px}
.up .when{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--red);font-weight:700}
.up p{font-size:13.5px;color:#3A3835}
.up .say{font-style:italic;color:var(--mut);font-size:13px;border-left:2px solid var(--line);padding-left:10px}
.up .act{display:flex;gap:8px;flex-wrap:wrap}
.road{display:grid;gap:8px}
.road div{display:grid;grid-template-columns:auto 1fr;gap:10px;font-size:13.5px;padding:8px 0;border-bottom:1px solid var(--line-soft)}
.road div i{font-style:normal;color:var(--good);font-weight:700}
.road div i.soon{color:var(--mut)}
.tick{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line-soft);font-size:15px}
.tick input{width:24px;height:24px;accent-color:var(--good)}
.tick.done{color:var(--mut);text-decoration:line-through}

/* suggest box (💡) — same fields as the Store Map's box */
.sgtypes{display:flex;gap:6px;flex-wrap:wrap}
.myreq{display:grid;gap:6px}
.myreq div{display:grid;grid-template-columns:auto 1fr;gap:8px;font-size:13px;align-items:baseline}
.st{font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:6px;background:#EEE9DF;color:var(--mut)}
.st.sLive{background:var(--good-bg);color:var(--good)}
.st.sInprogress{background:var(--warn-bg);color:#7a5a06}
.st.sTested{background:#E5E5E5;color:#555}

@media (min-width:600px){
  .move{grid-template-columns:84px 1fr;gap:18px}
  .mtime{font-size:26px}
  .btns{grid-template-columns:1fr 1fr 1fr}
}

/* ---------- Day · Week · Month switcher ---------- */
.vswitch{display:flex;align-items:center;gap:4px;padding:2px;border:1px solid var(--line);border-radius:999px;background:#fff;width:max-content;max-width:100%;margin:4px 0 2px}
.vswitch a{padding:6px 14px;border-radius:999px;font-size:12.5px;font-weight:700;text-decoration:none;color:var(--mut)}
.vswitch a.on{background:var(--ink);color:var(--paper)}
.vswitch .vtoday{margin-left:4px;border:0;background:none;color:var(--red);font-size:12.5px;font-weight:700;padding:6px 10px;text-decoration:underline;text-underline-offset:3px}

/* ---------- calendar (week + month), Google-Calendar-like ---------- */
.cal{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;margin:0 -4px}
.cal .gut{width:34px;flex:none;font-size:9.5px;color:var(--mut);position:relative}
.whead,.allday{display:flex;border-bottom:1px solid var(--line-soft)}
.whead .wday{flex:1;min-width:0;text-align:center;padding:6px 0 4px;text-decoration:none;color:var(--ink);display:grid;justify-items:center;gap:1px}
.whead .wday small{font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);font-weight:700}
.whead .wday b{font-family:var(--serif);font-size:17px;line-height:1.2;width:28px;height:28px;display:grid;place-items:center;border-radius:50%}
.whead .wday.today b{background:var(--red);color:#fff}
.allday{min-height:22px}
.allday .gut{padding:3px 0 0 4px}
.adcell{flex:1;min-width:0;padding:2px 1px;display:grid;gap:2px}
.wgrid{display:flex;position:relative}
.wgrid .hr{position:absolute;right:4px;transform:translateY(-6px)}
.wcol{flex:1;min-width:0;position:relative;border-left:1px solid var(--line-soft)}
.wcol.today{background:#FBF7EE}
.hline{position:absolute;left:0;right:0;border-top:1px solid var(--line-soft)}
.nowline{position:absolute;left:0;right:0;border-top:2px solid var(--red);z-index:3}
.nowline::before{content:"";position:absolute;left:-4px;top:-5px;width:8px;height:8px;border-radius:50%;background:var(--red)}
.ev{position:absolute;left:1px;right:1px;background:var(--ink);color:#fff;border-radius:5px;padding:3px 4px;font-size:9.5px;line-height:1.15;font-weight:700;text-decoration:none;overflow:hidden;z-index:2;
  display:block;white-space:nowrap;text-overflow:ellipsis;border-left:3px solid var(--ink)}
.ev.flight{border-left-color:var(--red);background:var(--red)}
.ev.done{background:#D9D4C8;color:#6B6760;border-left-color:#D9D4C8}
.ev i{font-style:normal;font-size:8px}
.ev.ad{position:static;padding:2px 4px;border-radius:4px}
.mhead{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--mut);padding:6px 0 4px;border-bottom:1px solid var(--line-soft)}
.mgrid{display:grid;grid-template-columns:repeat(7,1fr)}
.mcell{min-height:74px;padding:3px 2px 4px;border-bottom:1px solid var(--line-soft);border-left:1px solid var(--line-soft);display:grid;align-content:start;gap:2px;cursor:pointer;min-width:0}
.mcell:nth-child(7n+1){border-left:0}
.mcell b{font-family:var(--serif);font-size:13px;line-height:1;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;justify-self:start;margin-left:1px}
.mcell.today b{background:var(--red);color:#fff}
.mcell.out{background:#FAF9F5;color:var(--mut2)}
.mcell.out b{color:var(--mut2)}
.mev{display:block;font-size:8.5px;font-weight:700;line-height:1.15;background:var(--ink);color:#fff;border-radius:3px;padding:2px 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mev.flight{background:var(--red)}
.mev.done{background:#D9D4C8;color:#6B6760}
.mmore{font-size:8.5px;color:var(--mut);font-weight:700;padding-left:2px}
@media (min-width:600px){.cal{margin:0}.ev{font-size:11px}.mev{font-size:10.5px}.mcell{min-height:96px}.cal .gut{width:44px;font-size:11px}}

/* offers + bonuses */
.uphead{display:flex;justify-content:space-between;align-items:center;gap:8px}
.bchip{display:inline-flex;align-items:center;padding:3px 9px;border-radius:999px;background:var(--good-bg);color:var(--good);font-size:11px;font-weight:800;letter-spacing:.02em;white-space:nowrap}
.bonus{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;border:1px solid var(--line);border-radius:12px;background:#fff;padding:10px 14px;font-size:13px;color:var(--mut)}
.bonus b{font-family:var(--serif);font-size:16px;color:var(--ink)}
.bonus em{font-style:normal;font-weight:800;color:var(--good);font-variant-numeric:tabular-nums}

.uplink{font-size:12.5px;font-weight:700;color:var(--red);text-decoration:underline;text-underline-offset:3px}

/* =====================================================================
   Desktop & laptop (≥ 900px): the drawer becomes a permanent left rail,
   the bottom tabs disappear, and the board uses the width — two columns
   of moves, wider forms, a taller calendar. Same Ivory Keys system. */
@media (min-width:900px){
  body{display:grid;grid-template-columns:250px minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);height:100%}
  .bar{grid-column:1/-1;padding-inline:24px}
  .bar .logo{height:40px}
  #menuBtn{display:none}
  .share{grid-column:2;margin:0}
  .main{grid-column:2;grid-row:3;overflow-y:auto;max-width:none;padding:24px 40px 48px;width:100%}
  .tabs,.scrim{display:none!important}
  .drawer{grid-column:1;grid-row:2/4;position:static;transform:none;width:auto;height:auto;transition:none;padding:22px 14px;box-shadow:none;border-right:1px solid #2A2A2A}
  .drawer a{padding:11px 14px;font-size:14px}
  .dhead b{font-size:22px}
  .page{max-width:1080px}
  .dayhead h1{font-size:32px}
  .dayhead .sub{font-size:14px}
  .demo{max-width:720px}
  .moves{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;align-items:start}
  .move{grid-template-columns:96px 1fr;gap:16px;padding:20px 0}
  .move.live{margin:0;padding-inline:0;background:none;box-shadow:inset 4px 0 0 var(--red);padding-left:14px}
  .mtime{font-size:28px}
  .mname{font-size:22px}
  .btns{grid-template-columns:1fr 1fr}
  .empty{grid-column:1/-1}
  .grid2{grid-template-columns:1fr 1fr 1fr}
  .cond{grid-template-columns:1fr 1fr;column-gap:32px}
  .cond .condrow{grid-column:auto}
  .ups{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
  .lines{max-width:720px}
  .rowk{grid-template-columns:140px 1fr;font-size:14.5px}
  .cal{margin:0}
  .mcell{min-height:120px}
  .mev{font-size:11px;padding:3px 5px}
  .ev{font-size:12px;padding:5px 6px}
  .cal .gut{width:48px;font-size:11px}
  .whead .wday b{font-size:20px;width:34px;height:34px}
  .sheetbox{max-width:640px;border-radius:18px;margin-bottom:6vh;max-height:86vh}
  .sheet{align-items:center}
  #gate .gatecard{width:420px}
  .toast{bottom:32px}
}
@media (min-width:1400px){
  .main{padding-inline:64px}
  .moves{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:48px}
  .ups{grid-template-columns:repeat(4,minmax(0,1fr))}
}

.gbtn{gap:10px}
.gatealt{text-align:left;display:grid;gap:12px;margin-top:6px}
.gatealt summary{cursor:pointer;color:var(--red);font-weight:700;font-size:13px;text-align:center;list-style:none;text-decoration:underline;text-underline-offset:3px}
.gatealt summary::-webkit-details-marker{display:none}

.sheetx{position:absolute;top:10px;right:12px;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:15px;font-weight:700;display:grid;place-items:center;z-index:2}
.sheetx:active{background:var(--line-soft)}
.sheetbox h3{padding-right:44px}

/* ---------- mover dashboard ---------- */
.dgrid{display:grid;gap:14px}
.dcard h2{padding:0 0 8px;margin-bottom:10px;font-size:19px}
.dcard .h3{font-family:var(--serif);font-size:15px;margin:14px 0 6px}
.dcard .h3 small,.dcard h2 small{font-family:var(--sans);font-weight:600;font-size:11.5px;color:var(--mut);margin-left:6px}
.big{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.big em{font-style:normal;font-family:var(--serif);font-size:40px;font-weight:700;color:var(--good);line-height:1;font-variant-numeric:tabular-nums}
.big span{font-size:12.5px;color:var(--mut)}
.tally{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.tally div{border-top:1px solid var(--line);padding-top:8px}
.tally b{display:block;font-family:var(--serif);font-size:20px;font-variant-numeric:tabular-nums}
.tally span{font-size:12px;color:var(--mut)}
.clockrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.clockstate{flex:1;min-width:140px;display:grid}
.clockstate b{font-family:var(--serif);font-size:18px}
.clockstate.on b{color:var(--good)}
.clockstate small{color:var(--mut);font-size:12px}
.serialin{flex:1;min-width:140px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:16px;min-height:var(--tap);background:#fff}
.pianoclock{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--good-bg);border:1px solid #BFD9C8;border-radius:10px;padding:10px 12px}
.pianoclock b{font-family:var(--serif);font-size:17px}.pianoclock span{flex:1;font-size:12.5px;color:var(--mut)}
.week7{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.dayc{display:grid;gap:3px;text-align:center;font-size:10.5px;font-weight:700;color:var(--mut);letter-spacing:.04em}
.dayc select{font-size:11px;padding:6px 2px;border:1px solid var(--line);border-radius:8px;background:#fff;width:100%;text-align:center}
.tolist{display:grid;gap:4px;font-size:13.5px}
.link.red{color:var(--red);font-size:12px}
.offers{display:grid;gap:8px}
.offer{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff}
.offer .oc{flex:1;min-width:0;display:grid}
.offer .oc b{font-family:var(--serif);font-size:16px}.offer .oc span{font-size:13px}.offer .oc small{font-size:11.5px;color:var(--mut)}
.offer .ob{text-align:right;display:grid}
.offer .ob em{font-style:normal;font-weight:800;font-variant-numeric:tabular-nums;font-size:16px}.offer .ob span{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;color:var(--mut)}
.offer.won{background:var(--good-bg);border-color:#8FC4A3;box-shadow:0 0 0 2px #CFE8D8}
.offer.won .ob em,.offer.won .ob span{color:var(--good)}
.offer.lost{opacity:.55}
.punches{width:100%;border-collapse:collapse;font-size:13px}
.punches th{text-align:left;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);padding:4px 6px 6px;border-bottom:1px solid var(--ink)}
.punches td{padding:8px 6px;border-bottom:1px solid var(--line-soft);font-variant-numeric:tabular-nums}
@media (min-width:900px){.dgrid{grid-template-columns:1fr 1fr 1fr}.dcard.wide{grid-column:1/-1}.big em{font-size:48px}}
.punches tr.flag td{background:var(--warn-bg)}
.punches td.note{color:var(--mut);font-size:12px;max-width:220px}

/* schedule: time-off entry box + save bar */
.tolist{display:grid;gap:6px;margin-bottom:12px}
.tolist div{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:baseline;font-size:13.5px;padding:8px 0;border-bottom:1px solid var(--line-soft)}
.tolist span{color:var(--mut);font-size:12.5px}
.tobox{display:grid;gap:12px;border:1px dashed var(--line);border-radius:12px;padding:14px;background:var(--paper);margin-top:6px}
.toact{display:flex;justify-content:flex-end}
.savebar{display:grid;gap:8px;margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.logtag{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.04em;color:var(--good);background:var(--good-bg);border-radius:6px;padding:1px 6px;vertical-align:1px}
