/* css/daily.css — Today's Tint, the archive, Test Kitchen, tester links and the Stockroom (daily-client agent).
   The solo play surface (.solo*) has the wall on screen: chrome is ink / paper / white only (the router sets body.wall-on). The home,
   summary and results cards (.d-*) are no-wall screens and may use signage colours through the shared classes.
   PILLAR 1: nothing here applies filter, opacity, blending, gradient, shadow or animation to the wall or to a chip. Everything animated
   (ticket print, stamp, card flip, share slide-up) lives on paper elements outside the .wall-mat. */

/* ---------------------------------------------------------------- the solo play surface: top bar 44 · ticket · wall · strip · bottom bar */
.solo{ position:relative; display:flex; flex-direction:column; width:100%; max-width:560px; height:100dvh; margin:0 auto; background:var(--paper); overflow:hidden; }
.solo-top{ flex:0 0 auto; display:flex; align-items:center; gap:2px; min-height:44px; padding:var(--sat) calc(var(--sar) + 4px) 0 calc(var(--sal) + 4px); }
.solo-iconbtn{ flex:0 0 auto; width:44px; height:44px; padding:0; border:0; border-radius:4px; background:transparent; color:var(--ink); font-size:26px; line-height:1; display:grid; place-items:center;
  -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
.solo-iconbtn.pressed{ background:var(--rule); }
.solo-title{ flex:1 1 auto; min-width:0; display:flex; align-items:center; flex-wrap:wrap; gap:0 8px; line-height:1.15; }
.solo-title b{ font:900 var(--fs-m)/1.15 var(--font-sign); text-transform:uppercase; letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.solo-prog{ font-size:var(--fs-s); color:var(--ink-2); font-weight:700; white-space:nowrap; }
.solo-pill{ padding:0 6px; border:2px solid var(--ink); border-radius:3px; background:var(--card); font:900 var(--fs-xs)/1.35 var(--font-sign); text-transform:uppercase; letter-spacing:-.01em; }

/* ticket: paper receipt with the Request in heavy caps, the Actually… under it (arrives after the first Lock in), then the chip card */
.solo-ticket{ position:relative; flex:0 0 auto; min-height:58px; padding:5px 14px 6px; background:var(--card); border-top:1px solid var(--rule); border-bottom:2px solid var(--ink); overflow:hidden;
  -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
.tk-req{ font:900 var(--fs-ticket)/1.05 var(--font-sign); text-transform:uppercase; letter-spacing:-.01em; word-break:break-word; padding-right:92px; }
.tk-act{ font:700 var(--fs-l)/1.2 var(--font-ui); margin-top:1px; padding-right:92px; }
.tk-aisle{ position:absolute; right:8px; top:6px; max-width:84px; padding:0 5px; border:1.5px solid var(--ink); border-radius:3px; background:var(--paper); font:700 10px/1.4 var(--font-ui); text-align:center; }
.tk-card .cc-line{ display:flex; align-items:baseline; flex-wrap:wrap; gap:0 10px; padding-right:96px; }
.tk-card .cc-name{ font:800 var(--fs-l)/1.2 var(--font-ui); }
.tk-card .cc-code{ font:700 var(--fs-s)/1.2 var(--font-code); color:var(--ink-2); }
.tk-card .cc-words{ font-size:var(--fs-s); line-height:1.25; color:var(--ink-2); padding-right:96px; }
.solo-ticket.fx-stamp-host{ position:relative; }

/* the wall takes whatever height is left; createWall fills it */
.solo-wall{ position:relative; flex:1 1 0; min-height:180px; }

/* hint / note strip: fixed height so the wall never jumps between steps */
.solo-strip{ flex:0 0 auto; display:flex; align-items:center; flex-wrap:wrap; gap:2px 8px; min-height:52px; padding:3px 12px; background:var(--paper); border-top:1px solid var(--rule); font-size:var(--fs-s); line-height:1.25; }
.solo-strip.warn{ font-weight:700; } .solo-strip.warn::before{ content:"! "; font-weight:900; }
.solo-strip.sealed{ font-weight:600; }
.solo-strip.early{ font-size:var(--fs-xs); }
.solo-strip .lightcard{ flex:1 1 auto; width:100%; margin:0; }
.solo-heat{ flex:1 1 auto; min-width:0; }
.solo-flag{ min-height:44px; padding:6px 12px; border:2px solid var(--ink); border-radius:4px; background:var(--card); font-weight:700; font-size:var(--fs-s); text-align:left;
  -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
.solo-flag[aria-pressed="true"]{ background:var(--ink); color:var(--paper); }
.solo-flag[aria-pressed="true"]::before{ content:"✓ "; }
.solo-flag.pressed{ text-decoration:underline; }

/* bottom bar */
.solo-bar{ flex:0 0 auto; display:flex; align-items:stretch; gap:8px; min-height:72px; padding:8px calc(var(--sar) + 12px) calc(var(--sab) + 8px) calc(var(--sal) + 12px); background:var(--paper); border-top:2px solid var(--ink); }
.solo-bar .btn{ min-height:56px; }
.solo-bar .grow{ flex:1 1 0; min-width:0; }
.solo-tagbtn{ flex:0 0 auto; min-width:56px; padding:0 12px; }
.solo-tagbtn[aria-pressed="true"]{ --bg:var(--ink); --fg:var(--paper); }
.solo-locked, .solo-wait{ flex:1; display:grid; place-items:center; font:900 var(--fs-xl)/1 var(--font-sign); text-transform:uppercase; letter-spacing:-.01em; }
.solo-wait{ font:700 var(--fs-m)/1.2 var(--font-ui); text-transform:none; }
.solo-res{ flex:0 1 46%; min-width:0; display:flex; flex-direction:column; justify-content:center; line-height:1.15; }
.solo-ringword{ font:900 var(--fs-s)/1.1 var(--font-sign); text-transform:uppercase; letter-spacing:-.01em; }
.solo-pts{ font:800 var(--fs-l)/1.15 var(--font-ui); font-variant-numeric:tabular-nums; }

/* ---------------------------------------------------------------- home / summary / archive / Stockroom cards */
.d-screen{ padding-bottom:calc(var(--sab) + 24px); }
.d-sign{ display:flex; justify-content:center; }
.d-sign svg{ max-width:100%; height:auto; }
.d-rings{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5, 1fr); gap:6px; }
.d-ring{ position:relative; display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px 2px 6px; min-height:84px; border:2px dashed var(--rule); border-radius:4px; background:var(--paper); text-align:center; }
.d-ring.done{ border:2px solid var(--ink); background:var(--card); }
.d-ring.sealed{ border:2px solid var(--ink-2); }
.d-ring.now{ border:2px solid var(--ink); }
.d-sym{ font-size:calc(26px * var(--tx)); line-height:1.15; font-weight:900; font-family:var(--font-sign); }
.d-word{ font-size:calc(11px * var(--tx)); font-weight:700; line-height:1.15; }
.d-pts{ font:800 var(--fs-xs)/1.1 var(--font-ui); font-variant-numeric:tabular-nums; }
.d-enc{ position:absolute; top:-9px; left:50%; transform:translateX(-50%); padding:0 5px; border:1.5px solid var(--ink); border-radius:3px; background:var(--tag); color:#16171a; font:900 9px/1.5 var(--font-sign); text-transform:uppercase; white-space:nowrap; }
.d-score{ display:flex; align-items:baseline; justify-content:center; gap:4px; }
.d-score b{ font:900 calc(52px * var(--tx))/1 var(--font-sign); font-variant-numeric:tabular-nums; }
.d-score span{ font:800 var(--fs-xl)/1 var(--font-ui); color:var(--ink-2); }
.d-steady{ text-align:center; font-weight:800; font-size:var(--fs-l); }
.d-xp{ font-weight:800; margin:0; }
.d-note{ margin:0; }
.d-share{ margin:0; padding:12px 14px; background:var(--paper); border:2px dashed var(--ink); border-radius:4px; font:700 var(--fs-m)/1.5 var(--font-ui); white-space:pre-wrap; word-break:break-all; user-select:all; -webkit-user-select:all; }
.d-sharecard{ transform-origin:50% 100%; }
.d-arch .d-played{ color:var(--ink-2); font-weight:600; }
.d-updated{ margin:0; font-weight:700; } .d-updated::before{ content:"✓ "; }
.d-clerks{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.d-clerk{ display:flex; align-items:center; gap:10px; padding:8px 10px; min-height:48px; border:1.5px solid var(--rule); border-radius:4px; background:var(--card); }
.d-clerk.me{ border:2px solid var(--ink); }
.d-clerk .d-place{ flex:0 0 36px; font:900 var(--fs-l)/1 var(--font-sign); }
.d-clerk .d-glyph{ flex:0 0 auto; display:inline-flex; }
.d-clerk .d-cname{ flex:1; font-weight:700; display:flex; align-items:center; gap:8px; }
.d-clerk .d-ctotal{ font:900 var(--fs-xl)/1 var(--font-sign); font-variant-numeric:tabular-nums; }
.d-push .aisle-h, .d-kitchen .aisle-h{ margin-bottom:0; }

@media (max-width:360px){ .d-ring{ min-height:78px; } .d-sym{ font-size:calc(22px * var(--tx)); } }
@media (orientation:landscape) and (max-height:520px){ .solo-strip{ min-height:44px; } }