.thermal-play{--play-tone:var(--teal)}.thermal-play .play-scene{border:1px solid var(--line);background:color-mix(in srgb, var(--play-tone) 5%, var(--paper));border-radius:12px;margin:14px 0;padding:clamp(12px,3vw,22px)}.thermal-play .play-lead{margin:0 0 12px;font-size:1rem;line-height:1.6}.thermal-play .play-choices{flex-wrap:wrap;gap:9px;margin:14px 0;display:flex}.thermal-play button{min-width:44px;min-height:44px}.thermal-play button[aria-pressed=true]{outline:2px solid var(--play-tone);outline-offset:2px}.thermal-play .play-card{border:1px solid var(--line);background:var(--paper);text-align:left;color:var(--ink);cursor:pointer;font:inherit;border-radius:8px;flex:110px;padding:12px}.thermal-play .play-card strong,.thermal-play .play-card span{display:block}.thermal-play .play-card span{color:var(--muted);margin-top:6px;font-size:.82rem}.thermal-play .play-pair{grid-template-columns:1fr 1fr;gap:12px;display:grid}.thermal-play .play-readout{font:1.25rem IBM Plex Mono,monospace}.thermal-play .play-label{color:var(--muted);margin:4px 0;font-size:.85rem}.thermal-play .play-feedback{border-left:3px solid var(--play-tone);background:color-mix(in srgb, var(--play-tone) 5%, var(--paper));margin:12px 0;padding:10px 13px;line-height:1.6}.thermal-play details{border-top:1px solid var(--line);margin-top:20px;padding-top:10px}.thermal-play summary{cursor:pointer;min-height:44px;padding:10px 0;font-size:.95rem}.thermal-play .play-tokens{flex-wrap:wrap;gap:6px;margin:14px 0;display:flex}.thermal-play .play-token{border:1px solid var(--sky);background:color-mix(in srgb, var(--sky) 10%, var(--paper));width:44px;min-height:44px;color:var(--ink);border-radius:7px;place-items:center;font:1rem IBM Plex Mono,monospace;display:grid}.thermal-play .play-token.head{border-color:var(--gold);background:color-mix(in srgb, var(--gold) 13%, var(--paper))}.thermal-play .play-meter{background:var(--line);border-radius:5px;height:24px;margin:8px 0;display:flex;overflow:hidden}.thermal-play .play-meter span{background:var(--teal)}.thermal-play .play-chart{width:100%;margin:16px 0;display:block;overflow:visible}.thermal-play .play-chart text{fill:var(--muted);font:14px IBM Plex Mono,monospace}.thermal-play button:disabled{opacity:.48;cursor:default}.thermal-play .play-note{color:var(--muted);font-size:.85rem;line-height:1.65}@container (width<=430px){.thermal-play .play-chart text{font-size:26px}.thermal-play .play-card{flex-basis:100px}}