:root{
  --paper:#F3EFE6; --card:#FFFDF8; --ink:#2A2A28; --pencil:#8A877F; --rule:#C9C4B8;
  --orange:#E8591A; --yellow:#F2C230; --green:#2F7A4B; --red:#C23B2A; --teal:#1C8C8C; --teal2:#5FC4C0;
  --head:'Oswald','Arial Narrow',sans-serif; --body:'Barlow',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace; --hand:'Permanent Marker',cursive;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.35 var(--body);min-height:100vh;padding-bottom:env(safe-area-inset-bottom)}
button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
button:disabled{cursor:not-allowed;opacity:.45}
h1,h2,h3{font-family:var(--head);font-weight:700;letter-spacing:.02em;margin:0;text-transform:uppercase}
small{font-size:.78em}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:600}
.green{color:var(--green)} .red{color:var(--red)} .teal{color:var(--teal)}
.hand{font-family:var(--hand);color:var(--ink);font-weight:400}
.card{background:var(--card);border:1px solid var(--ink);border-radius:3px;box-shadow:2px 2px 0 rgba(42,42,40,.12)}
.ic{width:18px;height:18px;vertical-align:-3px;margin-right:6px}
.gi{width:1.05em;height:1.05em;vertical-align:-.15em;margin-right:3px;object-fit:contain}
.gi.w{filter:brightness(0) invert(1)}

/* ---------- buttons ---------- */
.primary,.ghost,.tealbtn,.redbtn,.claim{font-family:var(--head);font-weight:600;letter-spacing:.04em;border-radius:3px;min-height:44px;padding:8px 16px;text-transform:uppercase;white-space:nowrap}
.primary{background:var(--orange);border:1px solid #B9430F;color:#fff}
.primary:not(:disabled):active{transform:translateY(1px)}
.ghost{background:var(--card);border:1px solid var(--ink)}
.tealbtn{background:var(--teal);color:#fff;border:1px solid #126767}
.redbtn{background:var(--card);color:var(--red);border:1.5px solid var(--red)}
.sm{min-height:36px;padding:5px 10px;font-size:14px}

/* ---------- top bar ---------- */
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:stretch;gap:0;background:var(--card);border-bottom:1.5px solid var(--ink);padding:8px 14px;box-shadow:0 2px 0 rgba(42,42,40,.08)}
.brand{display:flex;align-items:center;gap:8px;padding-right:18px;margin-right:4px;border-right:1px solid var(--rule)}
.brand img{width:50px;height:50px;object-fit:contain}
.brand h1{font-size:31px;line-height:1}
.brand p{margin:2px 0 0;font:600 11px/1 var(--head);letter-spacing:.14em;color:#55524b}
.ctr{display:flex;flex-direction:column;justify-content:center;padding:0 18px;border-right:1px solid var(--rule)}
.ctr small{font:600 12px/1 var(--head);letter-spacing:.06em;color:#55524b;margin-bottom:5px}
.ctr b{font-size:22px;line-height:1.1;display:flex;align-items:center}
.ctr b.teal{color:var(--teal)}
.ctr b .gi{width:24px;height:24px;margin-right:6px}
#cashv{color:var(--green);transition:color .2s}
#cashv.up{animation:flup .6s} #cashv.down{animation:fldn .6s}
@keyframes flup{0%{color:#1d9a52;transform:scale(1.06)}100%{color:var(--green)}}
@keyframes fldn{0%{color:var(--red);transform:scale(.97)}100%{color:var(--green)}}
.adbtn{margin-left:auto;display:flex;align-items:center;gap:10px;background:var(--card);border:1.5px solid var(--ink);border-radius:3px;padding:4px 14px 4px 10px;min-height:48px}
.adbtn .tri{font-size:22px;line-height:1;padding-right:10px;border-right:1px solid var(--rule)}
.adbtn span{display:flex;flex-direction:column;align-items:flex-start;line-height:1.05}
.adbtn small{font:600 16px var(--head);letter-spacing:.04em}
.adbtn b{font:700 15px var(--head);color:var(--orange)}
.help{margin-left:10px;width:44px;min-height:44px;border:1px solid var(--ink);background:var(--card);border-radius:3px;font:700 20px var(--head);align-self:center}

/* ---------- dashboard ---------- */
.dash{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:16px;padding:16px;max-width:1500px;margin:0 auto}
.side{display:flex;flex-direction:column;gap:16px}
.pane.card{padding:14px}
.phead{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 12px;margin-bottom:12px}
.phead h2{font-size:28px;line-height:1}
.phead small{font:500 13px var(--head);letter-spacing:.05em;color:#55524b}
.phead .sp{flex:1}
.phead .note{font-size:16px;color:#3a3a36;transform:rotate(-2deg);display:inline-block}
.phead button{align-self:center}
.mobstats{display:none}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:12px}

/* property card */
.pcard{position:relative;padding:12px 12px 10px;cursor:pointer;display:flex;flex-direction:column;text-align:left;min-width:0}
.pcard:hover{box-shadow:3px 3px 0 rgba(42,42,40,.18)}
.stampt{position:absolute;top:8px;left:8px;z-index:2;font:700 13px/1 var(--head);letter-spacing:.04em;padding:4px 6px;border:2px solid currentColor;border-radius:2px;transform:rotate(-5deg);background:rgba(255,253,248,.85)}
.stampt.red{color:var(--red)} .stampt.green{color:var(--green)}
.stampt.sm{position:static;transform:rotate(-3deg);font-size:12px;display:inline-block}
.draw{position:relative;aspect-ratio:4/3;margin:14px 0 6px}
.draw img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.draw img.mid,.draw img.full{background:var(--card);transition:clip-path 1.4s steps(14,end)}
.pcard h3{font-size:19px;line-height:1.1;margin-top:2px}
.city{margin:0 0 6px;font-size:13px;color:#5f5c55}
.pcard dl{display:grid;grid-template-columns:auto 1fr;gap:1px 8px;margin:0 0 8px;font-size:14px}
.pcard dt{color:#3f3d38} .pcard dd{margin:0;text-align:right;font-size:13px}
.tape{position:relative;height:12px;border:1px solid var(--ink);background:var(--card);border-radius:2px;overflow:visible}
.tape i{position:absolute;left:0;top:0;bottom:0;background:var(--yellow);transition:width .25s linear}
.tape b{position:absolute;top:0;bottom:0;width:1px;background:var(--ink);opacity:.55}
.tape::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 7px,rgba(42,42,40,.25) 7px 8px);clip-path:inset(0 0 55% 0);pointer-events:none}
.tool{position:absolute;top:-12px;width:24px;height:24px;margin-left:-6px;background:url(assets/hammer.webp) center/contain no-repeat;animation:bob .7s ease-in-out infinite;transition:left .25s linear}
@keyframes bob{0%,100%{transform:rotate(-20deg) translateY(0)}50%{transform:rotate(15deg) translateY(-3px)}}
.crewrow{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:8px;border-top:1px solid var(--rule);min-height:52px}
.crewrow .por{width:40px;height:40px;border-radius:50%;border:1px solid var(--ink);background:#EDE8DC;object-fit:cover}
.crewrow div{display:flex;flex-direction:column;line-height:1.1;flex:1} .crewrow b{font:700 15px var(--head);letter-spacing:.03em} .crewrow small{color:#5f5c55}
.crewrow .chev{font-size:24px;color:var(--pencil)}
.crewrow.empty b{font:600 13px var(--head);color:var(--pencil);letter-spacing:.08em}
.crewrow .dash,.dashslot{width:40px;height:40px;border:1.5px dashed var(--pencil);border-radius:50%;flex:none}
.crewrow.done{justify-content:space-between}
.crewrow .rent{font-size:13px;color:var(--green);display:flex;flex-direction:column;align-items:flex-end;text-align:right}.crewrow .rent small{font:600 11px var(--body);margin-top:2px}
.open{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:200px;background:transparent;border:1.5px dashed var(--pencil);box-shadow:none;padding:16px;color:var(--pencil)}
.open img{width:46%;max-width:110px;opacity:.75}
.open b{font:600 22px var(--head);letter-spacing:.04em}
.open small{font:500 13px/1.3 var(--head);letter-spacing:.06em;text-align:center;max-width:150px}
.open:hover{border-color:var(--orange);color:var(--orange)}

/* ---------- crew rack ---------- */
.auto{display:flex;gap:8px;align-items:flex-start;font-size:14px;margin:-4px 0 12px;cursor:pointer}
.auto input{width:20px;height:20px;accent-color:var(--orange);margin:1px 0 0;flex:none}
.auto small{color:#5f5c55}
.rack{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.tcard{position:relative;padding:8px 8px 8px;display:flex;flex-direction:column;gap:3px;font-size:12px;transform-origin:50% -10px}
.tcard .hook{position:absolute;top:-6px;left:50%;width:14px;height:8px;margin-left:-7px;border:1.5px solid var(--pencil);border-bottom:none;border-radius:8px 8px 0 0}
.tcard.senior{border-width:2.5px}
.tcard.lapse{border-color:var(--red);box-shadow:0 0 0 1px var(--red),2px 2px 0 rgba(194,59,42,.2)}
.pframe{border:1px solid var(--rule);background:#EFEADF;aspect-ratio:1;overflow:hidden}
.pframe .por{width:100%;height:100%;object-fit:cover;display:block}
.tcard h3{font-size:17px;display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:2px}
.dtab{font:700 9px/1 var(--head);background:var(--yellow);padding:3px 4px;letter-spacing:.04em;border-radius:2px}
.stat{display:flex;justify-content:space-between;align-items:center;gap:4px}
.stat small{font-size:11.5px}
.seg{display:flex;gap:2px}.seg i{width:8px;height:7px;background:#DAD5CA}.seg i.on{background:#55524b}
.cost{margin:3px 0 0;font-size:12px;white-space:nowrap;letter-spacing:-.02em}.cost small{font-weight:500;font-size:10px}
.status{margin:0;font-size:11.5px;color:#4a4842;min-height:30px;line-height:1.25}
.tcard button{width:100%;margin-top:auto}
.tcard.swing{animation:swing .85s cubic-bezier(.3,.6,.4,1)}
@keyframes swing{0%{transform:translateY(-40px) rotate(0)}30%{transform:translateY(0) rotate(7deg)}55%{transform:rotate(-4deg)}75%{transform:rotate(2deg)}100%{transform:rotate(0)}}

/* ---------- gems ---------- */
#gems .phead h2{color:var(--ink)}
.free{display:flex;align-items:center;gap:12px;padding:12px;background:#E6F4F2;border-color:var(--teal);margin-bottom:12px}
.free img{width:64px;height:64px;object-fit:contain}
.free div{display:flex;flex-direction:column;flex:1;line-height:1.2}
.free b{font:700 18px var(--head)} .free small{font:500 11px var(--head);letter-spacing:.05em;color:#3e5f5d} .free .mono{font-size:15px;margin-top:4px}
.claim{background:#CFCBC2;border:1px solid #B5B0A5;color:#fff}
.claim.ready{background:var(--teal);border-color:#126767;animation:glow 1.6s ease-in-out infinite}
@keyframes glow{50%{box-shadow:0 0 0 4px rgba(95,196,192,.45)}}
.packs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.pack{display:flex;flex-direction:column;align-items:center;padding:8px 6px;border-color:var(--teal);gap:2px}
.pack img{width:100%;aspect-ratio:1;object-fit:contain}
.pack b{font-size:18px}.pack span{font-size:13px;margin-bottom:6px}
.pack button{width:100%;min-height:40px;padding:4px}
.fine{font-size:12px;color:#5f5c55;margin:10px 0 0}

/* ---------- sheets ---------- */
#sheet{position:fixed;inset:0;z-index:40;display:flex;align-items:flex-start;justify-content:center;padding:84px 16px 16px}
#sheet[hidden]{display:none}
.scrim{position:absolute;inset:0;background:rgba(42,42,40,.32)}
.sheetin{position:relative;width:min(980px,100%);max-height:calc(100vh - 100px);overflow:auto;padding:18px 20px;border-width:1.5px;box-shadow:4px 5px 0 rgba(42,42,40,.25);animation:lay .22s ease-out;border-top:8px solid #4A4F57}
@keyframes lay{from{transform:translateY(24px) rotate(-.6deg);opacity:.3}}
.sheetin.help,.sheetin.sell{width:min(640px,100%)}
.sheethead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px;padding-right:44px}
.sheethead h2{font-size:30px;line-height:1.05}
.sheethead .stampt{position:static}
.cityl{font:500 14px var(--head);letter-spacing:.06em;color:#55524b;text-transform:uppercase}
.x{position:absolute;right:10px;top:8px;width:44px;height:44px;border:none;background:none;font-size:34px;line-height:1}
.facts{display:flex;flex-wrap:wrap;gap:4px 22px;font-size:15px;padding-bottom:10px;border-bottom:1px solid var(--rule);margin-bottom:12px}
.body{font-size:15px;margin:6px 0 12px}
.hgrid{display:grid;grid-template-columns:1.25fr 1fr;gap:12px}
.drawbox{padding:10px}
.pair{display:flex;align-items:center;gap:6px}
.pair figure{flex:1;margin:0;text-align:center}.pair .draw{margin:0}
.pair figcaption{font:600 12px var(--head);letter-spacing:.08em;color:#55524b;border-top:1px solid var(--rule);padding-top:4px}
.arrow{font-size:24px}
.assigned{padding:10px 12px;position:relative}
.assigned .lbl{font:700 13px var(--head);letter-spacing:.05em}
.arow{display:flex;gap:10px;align-items:flex-start;margin:6px 0 10px}
.arow .por.big{width:84px;height:84px;border:1px solid var(--rule);background:#EFEADF;object-fit:cover;flex:none}
.arow div{flex:1;min-width:0}.arow b{font:700 19px var(--head)}.arow .green{display:block;font-size:14px}
.arow p{margin:4px 0 0;font-size:14px}.arow p b{font:600 14px var(--body)}
.margin{transform:rotate(-6deg);font-size:18px;line-height:1.1;align-self:center;flex:none;max-width:110px}
.assigned .tape{height:14px}
.uh{font-size:22px;margin:16px 0 8px}
.form{border:1px solid var(--ink);background:var(--card)}
.urow{display:grid;grid-template-columns:34px minmax(0,1.6fr) 100px 80px minmax(220px,1.5fr);align-items:center;gap:8px;padding:8px 10px;border-top:1px solid var(--rule);position:relative;min-height:54px}
.urow.head{font:600 12px var(--head);letter-spacing:.06em;color:#55524b;min-height:0;padding:6px 10px;border-top:none;background:#F7F3EA}
.urow.prem{box-shadow:inset 4px 0 0 var(--teal)}
.box{width:22px;height:22px;border:1.5px solid var(--ink);display:grid;place-items:center;font-weight:700;color:var(--green)}
.un{display:flex;flex-direction:column;line-height:1.15}.un b{font-weight:600}.un small{color:#5f5c55}
.uc{font-size:14px;display:flex;align-items:center}.ut{font-size:13px;color:#4a4842}
.us{display:flex;align-items:center;gap:8px;flex-wrap:wrap;position:relative}
.us .tape.mini{flex:1;min-width:90px}
.us .rem{font-size:12px}
.ok{color:var(--green);font-size:20px;font-weight:700}
.donestamp{font:700 17px/1 var(--head);color:var(--green);border:2.5px solid var(--green);padding:3px 7px;border-radius:2px;transform:rotate(-8deg);letter-spacing:.06em;display:inline-block}
.donestamp.thump{animation:thump .22s cubic-bezier(.2,.8,.3,1.2) both}
@keyframes thump{0%{transform:scale(1.9) rotate(-16deg);opacity:0}70%{transform:scale(.94) rotate(-7deg);opacity:1}100%{transform:scale(1) rotate(-8deg)}}
.gain{font-size:12px;color:var(--green)}
.pencil{color:#5f5c55;font-size:14px}
.gemalt{min-height:36px;border:1px solid var(--teal);color:var(--teal);background:var(--card);border-radius:3px;padding:4px 8px;font:600 14px var(--mono);display:flex;align-items:center}
.urow.s-done .un b{text-decoration:line-through;text-decoration-color:rgba(42,42,40,.35)}
.sheetfoot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px}
.est{font-size:15px}.est b{font-size:22px;margin-left:8px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0}
.chip{border:1px solid var(--ink);background:var(--card);border-radius:3px;padding:6px 10px;font:600 13px var(--head);letter-spacing:.04em;min-height:36px}
.chip.on{background:var(--ink);color:var(--card)}.chip.add{border-style:dashed;color:var(--orange);border-color:var(--orange)}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.listing{cursor:default}.listing button{margin-top:auto;width:100%}
.listing dd small{font-size:11px}
.lgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.loc{padding:10px;display:flex;flex-direction:column;gap:4px}
.loc img{width:100%;aspect-ratio:4/3;object-fit:contain}
.loc h3{font-size:17px;display:flex;justify-content:space-between}.loc h3 small{color:#5f5c55}
.loc .small{font-size:12px;margin:0 0 4px;color:#4a4842}
.loc.own{border-width:2px}
.loc .stampt.sm{align-self:flex-start;margin:2px 0 4px}
.loc button{width:100%;margin-top:auto}
.how{padding-left:22px;margin:8px 0;font-size:15px}.how li{margin:0 0 9px}

/* ---------- away slip ---------- */
.slipwrap{position:fixed;inset:0;z-index:60;background:rgba(42,42,40,.35);display:flex;align-items:flex-start;justify-content:center;padding:70px 14px 14px;overflow:auto}
.slip{position:relative;width:min(440px,100%);background:#FCFAF2;border:1px solid var(--ink);padding:24px 20px 18px;box-shadow:3px 4px 0 rgba(42,42,40,.25);animation:drop .5s cubic-bezier(.2,.9,.3,1.1);font-size:15px;
  background-image:repeating-linear-gradient(transparent 0 27px,rgba(28,140,140,.12) 27px 28px)}
.perf{position:absolute;left:0;right:0;top:-1px;height:8px;background:radial-gradient(circle at 6px 0,var(--paper) 5px,transparent 5.5px) 0 0/14px 8px repeat-x}
@keyframes drop{from{transform:translateY(-110%) rotate(-3deg)}}
.slip h2{font-size:30px;color:var(--ink)}
.slip ul{padding-left:18px;margin:10px 0}.slip li{margin-bottom:6px}
.slip table{width:100%;border-top:1px dashed var(--pencil);border-bottom:1px dashed var(--pencil);margin:8px 0;padding:4px 0}.slip td:last-child{text-align:right}
.slipnote{text-align:right;font-size:20px;margin:4px 6px 0;transform:rotate(-4deg);color:#3a3a36}
.sliprow{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:12px}
.sliprow .ghost .tri{margin-right:6px}
.small{font-size:12px}

/* ---------- ad overlay, toasts, flyers ---------- */
.adlay{position:fixed;inset:0;z-index:80;background:rgba(20,20,18,.82);display:grid;place-items:center}
.adbox{width:min(360px,90vw);padding:22px;text-align:center;position:relative}
.adtag{position:absolute;left:10px;top:8px;font:700 12px var(--head);border:1px solid var(--ink);padding:1px 5px}
.adplay{font-size:56px;line-height:1}.adtext{margin:6px 0}.adtime{margin:4px 0 12px}
#toasts{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:90;display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none;width:min(520px,92vw)}
.toast{background:var(--ink);color:var(--card);padding:10px 14px;border-radius:3px;font-size:14px;box-shadow:2px 2px 0 rgba(0,0,0,.2);transition:opacity .4s,transform .4s;text-align:center}
.toast.green{border-left:5px solid #57c07f}.toast.red{border-left:5px solid #ff6a55}.toast.teal{border-left:5px solid var(--teal2)}
.toast.out{opacity:0;transform:translateY(8px)}
.flyer{position:fixed;z-index:100;pointer-events:none;border-radius:50%;object-fit:cover}
#boot{position:fixed;inset:0;display:grid;place-items:center;background:var(--paper);font:700 30px var(--head);z-index:200}

.tabs{display:none}

/* ---------- narrower desktop ---------- */
@media (max-width:1180px){
  .wide{display:none}
  .dash{grid-template-columns:minmax(0,1fr) 400px}
}

/* ---------- phone / tablet ---------- */
@media (max-width:899px){
  body{padding-bottom:calc(66px + env(safe-area-inset-bottom))}
  .topbar{padding:6px 8px;gap:0;align-items:center}
  .brand{padding-right:8px;border:none;margin:0}
  .brand img{width:34px;height:34px}
  .brand div{display:none}
  .ctr{padding:0 10px}
  .ctr small{font-size:10px;margin-bottom:3px}
  .ctr b{font-size:17px}
  .ctr b .gi{width:18px;height:18px}
  .gemc{border-right:none}
  .adbtn{padding:3px 8px;min-height:44px;gap:6px}
  .adbtn .tri{font-size:16px;padding-right:6px}
  .adbtn small{font-size:12px}.adbtn b{font-size:12px}
  .help{width:40px;margin-left:6px}
  .dash{display:block;padding:12px}
  .side{display:block}
  .pane{display:none}
  body[data-tab=props] #props,body[data-tab=crew] #crew,body[data-tab=gems] #gems{display:block}
  .pane.card{border:none;box-shadow:none;background:transparent;padding:0}
  .phead h2{font-size:26px}
  .phead .sp{display:none}
  .phead button{flex:1 1 140px}
  .phead .note{order:5;flex-basis:100%}
  .mobstats{display:flex;flex-wrap:wrap;gap:4px 14px;font:500 12px var(--head);letter-spacing:.05em;margin:0 0 10px;color:#55524b}
  .mobstats b{color:var(--ink);font-size:13px}
  .pgrid{grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:10px}
  .open{min-height:150px}
  .rack{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .tcard{font-size:13px}.status{font-size:12.5px}
  .packs{grid-template-columns:repeat(2,1fr)}
  .tabs{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--card);border-top:1.5px solid var(--ink);padding-bottom:env(safe-area-inset-bottom)}
  .tabs button{flex:1;border:none;background:none;min-height:62px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font:600 12px var(--head);letter-spacing:.06em;color:#5f5c55;border-top:3px solid transparent}
  .tabs svg{width:22px;height:22px}
  .tabs button.on{color:var(--orange);border-top-color:var(--orange)}
  #sheet{padding:0;z-index:50}
  .sheetin{width:100%;max-height:none;height:100%;border-radius:0;border-left:none;border-right:none;padding:14px 14px calc(20px + env(safe-area-inset-bottom))}
  .sheethead h2{font-size:24px}
  .hgrid{grid-template-columns:1fr}
  .urow{grid-template-columns:28px minmax(0,1fr) auto;grid-template-areas:"b n c" "b t t" "s s s";row-gap:6px;padding:10px}
  .urow.head{display:none}
  .urow .box{grid-area:b;align-self:start}.urow .un{grid-area:n}.urow .uc{grid-area:c;justify-self:end}
  .urow .ut{grid-area:t;font-size:12px}.urow .ut::before{content:"Time: "}
  .urow .us{grid-area:s}
  .urow .us .primary,.urow .us .tealbtn{flex:1}
  .sheetfoot{flex-direction:column-reverse;align-items:stretch}
  .est{text-align:center}
  .mgrid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
  .lgrid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
  #toasts{bottom:78px}
}
@media (max-width:380px){
  .ctr{padding:0 6px}.ctr b{font-size:15px}
  .adbtn small{display:none}
}