[data-game="volte"]{--game-primary:#885507;--game-interactive:#885507;--game-surface:#FFE5A6}
.volte-game{max-width:760px;margin:auto}.volte-game fieldset{display:grid;gap:12px;border:1px solid #ddd6c8;border-radius:16px;padding:16px}.volte-game label{display:block;margin:12px 0}.volte-game input{accent-color:#885507}.volte-game .game-mascot{width:120px;height:120px;display:block;margin:auto}.volte-game .game-settings{display:grid;gap:14px}.volte-game .btn{white-space:normal;min-height:54px;height:auto}.volte-game button:disabled{opacity:.48;cursor:default}.volte-game .btn:focus-visible{outline:3px solid #222826;outline-offset:4px}.volte-duel{display:flex;flex-direction:column;border:2px solid #885507;border-radius:24px;overflow:hidden;background:#fffaf0}.volte-zone{padding:16px;display:grid;gap:8px;background:#f2eee5;min-height:200px}.volte-zone.current{background:#ffe5a6;border-inline-start:7px solid #885507}.volte-zone.opposed{transform:rotate(180deg)}.volte-player{display:flex;justify-content:space-between;gap:12px;font-weight:800;overflow-wrap:anywhere}.volte-zone p{margin:0;font-size:.85rem}.volte-challenge{display:flex;gap:16px;align-items:center;text-align:left;font-size:clamp(1.15rem,3.5vw,1.6rem);font-weight:700;overflow-wrap:anywhere}.volte-letter{font-size:2.8rem;line-height:1;background:white;border-radius:12px;min-width:64px;padding:10px;text-align:center;box-shadow:0 3px 0 #d5c49d}.volte-challenge small{display:block;font-size:.85rem;margin-top:4px;font-weight:500}.volte-clock{font-variant-numeric:tabular-nums;font-size:2.8rem;font-weight:900;line-height:1}.volte-divider{text-align:center;background:#885507;color:white;font-size:1.3rem;line-height:1}.volte-controls,.volte-tools{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.volte-controls>*{flex:1 1 180px}.volte-tools>*{flex:1 1 220px}.volte-group{padding:24px;border-radius:24px;background:#ffe5a6;display:grid;gap:16px}.volte-group h2{overflow-wrap:anywhere;margin:0}.volte-scores{display:flex;flex-wrap:wrap;gap:10px}.volte-scores span{padding:8px 12px;background:white;border:1px solid #ded5c0;border-radius:12px}.volte-status{font-size:.95rem}.volte-game .game-intro{margin-bottom:20px}.volte-game .game-intro h1{font-size:2.5rem}.volte-game .game-intro p{margin:4px 0}body:has([data-game="volte"]) .site-footer{display:none}@media(max-width:420px){.volte-zone{padding:12px;gap:7px}.volte-game .game-intro h1{font-size:2rem}.volte-game .game-intro .eyebrow{font-size:.65rem}.volte-zone .btn{padding:12px}.volte-challenge{gap:10px}}@media(prefers-reduced-motion:reduce){.volte-game *{animation:none!important;transition:none!important}}
/* The face-to-face board remains visible between exchanges on a phone. */
body:has(.volte-duel) .shell{padding:0 12px 12px}body:has(.volte-duel) .site-header{min-height:60px;margin-bottom:8px}body:has(.volte-duel) .volte-game .game-intro{display:none}body:has(.volte-duel) main.play{max-width:760px}body:has(.volte-duel) .volte-duel{height:calc(100svh - 270px);min-height:390px}body:has(.volte-duel) .volte-zone{min-height:0;flex:1;gap:3px;padding:9px 12px}body:has(.volte-duel) .volte-zone .volte-challenge{font-size:1.05rem}body:has(.volte-duel) .volte-zone .volte-letter{font-size:1.8rem;min-width:44px;padding:6px}body:has(.volte-duel) .volte-clock{font-size:1.6rem}body:has(.volte-duel) .volte-zone .btn{min-height:44px;padding:9px}body:has(.volte-duel) .volte-controls{margin:8px 0;gap:6px}body:has(.volte-duel) .volte-controls>.btn{flex:1 1 42%;min-height:44px;font-size:.8rem;padding:8px}body:has(.volte-duel) .volte-tools{margin:10px 0}body:has(.volte-duel) .volte-tools .btn{font-size:.8rem;padding:10px}body:has(.volte-duel) .volte-status{font-size:.8rem;margin:6px 0}@media(max-height:620px),(min-resolution:3dppx) and (max-width:320px){body:has(.volte-duel) .volte-duel{height:auto;min-height:0}body:has(.volte-duel) .volte-zone{min-height:200px}}@media(min-width:750px){body:has(.volte-duel) .volte-duel{height:600px}}

.volte-cue{font-size:clamp(1.8rem,5vw,3rem);text-align:center;line-height:1.15}.volte-flash .volte-zone{border-inline-start:0}.volte-flash .volte-zone .btn{font-weight:800}

/* Independent two-letter game identity. */
[data-game="mot"]{--game-primary:#AE2947;--game-interactive:#AE2947;--game-surface:#FBE0E5}.mot-game input{accent-color:#AE2947}.mot-game .volte-duel{border-color:#AE2947;background:#fff5f7}.mot-game .volte-zone.current{background:#FBE0E5;border-color:#AE2947}.mot-game .volte-divider{background:#AE2947}body:has([data-game="mot"]) .site-footer{display:none}

.mot-letters{display:flex;gap:8px}.mot-letters>span{display:grid;text-align:center;gap:4px}.mot-letters small{font-size:.7rem;max-width:90px;overflow-wrap:anywhere}.mot-letters .volte-letter{display:block}.mot-game .volte-challenge{flex-wrap:wrap}.mot-game .volte-cue{font-size:1.3rem}

/* Keep both zones in flow: enlarged text may grow the board rather than overlap controls. */
.volte-game .volte-duel.volte-flash {height:auto;min-height:max(390px,calc(100svh - 270px));}
@media (min-width:750px) {.volte-game .volte-duel.volte-flash {min-height:600px;}}
@media (max-height:620px) {.volte-game .volte-duel.volte-flash {min-height:0;}}

/* The shared-phone duel always scrolls naturally; a fixed board must not clip actions. */
body:has(.volte-flash) .volte-duel.volte-flash{height:auto;min-height:0;overflow:visible}body:has(.volte-flash) .volte-zone{flex:none;min-height:180px;gap:8px;padding:14px}.mot-game .volte-zone{color:#222826}.mot-game .volte-zone .btn:not(.secondary),.mot-game .volte-controls .btn:not(.secondary){background:#AE2947!important;color:#fff!important}.mot-game .volte-zone .btn:disabled{background:#fff!important;color:#575d59!important;opacity:1;border:1px solid #b9bdbb}.hidden-letters{font-size:.9rem;color:#575d59;min-height:48px;display:flex;align-items:center}

/* Essential prompts stay together on small phones, while long text can still scroll. */
@media(max-width:420px){body:has(.volte-flash) .volte-zone{padding:10px;gap:4px;min-height:170px}.mot-game .volte-challenge{gap:6px}.hidden-letters{min-height:24px;font-size:.75rem}}
