/* Shared screen, two seats. Native buttons support touch and keyboard without device permissions. */
#pDuel { align-items: safe center; }
.duel-shell { width: min(960px, 100%); display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: 20px; padding: clamp(16px, 3vw, 28px); background: #1c1745; border: 1px solid #5e4da1; border-radius: 18px; box-shadow: 0 24px 80px #08051b99; }
.duel-main, .duel-side { min-width: 0; display: grid; align-content: start; gap: 14px; }
.duel-main h2 { margin: 0; font-size: clamp(23px, 4vw, 34px); }
.duel-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.duel-top .eyebrow { margin: 0; color: #73ead5; }
.duel-badge { font: 600 10px var(--font-mono); letter-spacing: .08em; border: 1px solid #554685; border-radius: 99px; padding: 6px 9px; color: var(--muted); white-space: nowrap; }
.duel-status { min-height: 24px; font-weight: 700; color: var(--signal); margin: 0; }
.duel-clock { color: #73ead5; font: 600 17px var(--font-mono); font-variant-numeric: tabular-nums; }
.duel-board { width: min(100%, 52vh, 520px); aspect-ratio: 1; margin: 0 auto; display: grid; gap: 4px; padding: 9px; background: #100d2d; border: 1px solid #51447a; border-radius: 14px; touch-action: manipulation; }
.duel-board.gravity { aspect-ratio: 7 / 6; grid-template-columns: repeat(7, 1fr); }
.duel-board.reversi { grid-template-columns: repeat(8, 1fr); background: #132d39; }
.duel-board.five { grid-template-columns: repeat(9, 1fr); gap: 2px; }
.duel-cell { display: grid; place-items: center; border: 1px solid #393057; border-radius: 4px; padding: 0; min-width: 0; min-height: 0; background: #252040; cursor: pointer; position: relative; }
.duel-cell:disabled { cursor: default; opacity: 1; }
.duel-cell:focus-visible, .duel-edge:focus-visible { outline: 3px solid white; z-index: 3; outline-offset: 2px; }
.duel-cell:not(:disabled):hover { background: #4a3d73; border-color: var(--signal); }
.duel-cell::before { content: ''; width: 76%; aspect-ratio: 1; border-radius: 50%; background: #100d2d; box-shadow: inset 0 3px 6px #0005; }
.duel-cell[data-piece="1"]::before { background: radial-gradient(circle at 33% 25%, #ffe8b2, #ffb83f 40%, #dc821c); box-shadow: 0 0 12px #ffb83f44; }
.duel-cell[data-piece="2"]::before { background: radial-gradient(circle at 33% 25%, #c8fff6, #73ead5 40%, #1e9f99); box-shadow: 0 0 12px #73ead544; }
.duel-cell[data-last="true"]::after { content: ''; width: 12%; aspect-ratio: 1; background: #1c1745; border: 1px solid white; border-radius: 50%; position: absolute; }
.duel-cell[data-legal="true"][data-piece="0"]::before { width: 18%; background: #7c719f; }
.duel-board.gravity .duel-cell { border-radius: 50%; background: #342454; }
.duel-board.five .duel-cell { background: linear-gradient(transparent 48%, #4a3b68 48%, #4a3b68 52%, transparent 52%), linear-gradient(90deg, transparent 48%, #4a3b68 48%, #4a3b68 52%, transparent 52%); border: 0; }
.duel-board.five .duel-cell[data-piece="0"]::before { background: transparent; box-shadow: none; }
.duel-board.boxes { gap: 0; padding: 14px; grid-template-columns: 12px 1fr 12px 1fr 12px 1fr 12px 1fr 12px; grid-template-rows: 12px 1fr 12px 1fr 12px 1fr 12px 1fr 12px; }
.duel-dot { border-radius: 50%; background: #eae6ff; width: 10px; height: 10px; align-self: center; justify-self: center; z-index: 2; }
.duel-edge { border: 0; padding: 0; background: #3b3059; position: relative; cursor: pointer; border-radius: 6px; }
.duel-edge::after { content: ''; position: absolute; inset: -7px; }
.duel-edge[data-piece="1"] { background: #ffb83f; }
.duel-edge[data-piece="2"] { background: #73ead5; }
.duel-edge:disabled { cursor: default; opacity: 1; }
.duel-edge:not(:disabled):hover { background: #82709f; }
.duel-box { display: grid; place-items: center; margin: 6px; color: var(--muted); font: 400 clamp(14px, 3vw, 23px) var(--font-display); border-radius: 8px; }
.duel-box[data-piece="1"] { background: #ffb83f33; color: #ffb83f; }
.duel-box[data-piece="2"] { background: #73ead533; color: #73ead5; }
.duel-seats { display: flex; gap: 8px; font: 600 12px var(--font-mono); }
.duel-seats span { padding: 10px; border: 1px solid #544772; border-radius: 8px; flex: 1; color: #ffb83f; }
.duel-seats span:last-child { color: #73ead5; }
.duel-seats [data-turn="true"] { background: #ffffff0a; border-color: currentColor; }
.duel-side h3 { font: 400 17px var(--font-display); margin: 0; }
.duel-side .btn { width: 100%; justify-content: center; }
.duel-actions { display: grid; gap: 9px; }
.duel-invite { display: grid; gap: 7px; }
.duel-invite input { width: 100%; min-width: 0; font-size: 12px; padding: 9px; }
.duel-terms { padding: 12px; background: #100d2d; border-radius: 10px; }
.duel-terms p { margin: 0; }
.duel-history { display: grid; gap: 7px; max-height: 180px; overflow-y: auto; }
.duel-history button { text-align: left; padding: 9px; background: #100d2d; color: var(--text); border: 1px solid var(--line); border-radius: 7px; font: inherit; font-size: 12px; cursor: pointer; }
.duel-rules { font-size: 13px; color: var(--muted); line-height: 1.6; }
.duel-rules summary { color: var(--text); cursor: pointer; }
.match-receipt, .score-challenge { grid-column: 1 / -1; padding: 16px; background: var(--well); border: 1px solid var(--line); border-radius: 12px; display: grid; gap: 10px; }
.match-receipt h3, .score-challenge h3 { font: 400 17px var(--font-display); margin: 0; }
.match-receipt p, .score-challenge p { margin: 0; }
.match-replay { max-height: 240px; overflow-y: auto; padding: 10px 10px 10px 28px; font: 12px/1.8 var(--font-mono); }
.challenge-history { width: min(960px, 100%); margin: 18px auto; padding: 18px; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; }
.challenge-history .duel-history { max-height: 240px; }
@media(max-width: 680px) {
 .duel-shell { grid-template-columns: 1fr; gap: 16px; padding: 16px; }
 .duel-board { width: min(100%, 48vh, 440px); }
 .duel-side { gap: 11px; }
 .duel-actions { grid-template-columns: 1fr 1fr; }
 .duel-actions .btn { padding: 11px 7px; font-size: 13px; }
 .duel-top { gap: 7px; }
 .duel-badge { font-size: 9px; }
}

.boxing-lobby { width: min(620px, 100%); background: #1e173df5; }
.boxing-lobby .boxing-tag { color: #70e8db; }
.boxing-lobby .boxing-options { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.boxing-lobby .boxing-options .btn { justify-content: center; }
.boxing-lobby h2 { color: #fff1d7; }
.boxing-invite { display: grid; gap: 8px; }
.boxing-invite input { width: 100%; min-width: 0; }
.boxing-lobby details summary { cursor: pointer; color: #d6c8ef; font-size: 13px; }
#boxingHud { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.boxing-bars { position: absolute; top: 18px; left: 4%; right: 4%; display: grid; grid-template-columns: minmax(0, 1fr) 110px minmax(0, 1fr); gap: 14px; max-width: 1100px; margin: auto; padding-bottom: 12px; background: #100d25; }
.boxing-side { display: grid; gap: 5px; min-width: 0; }
.boxing-side:last-child { text-align: right; }
.boxing-side label { font: 600 12px var(--font-mono); color: #ffbc48; }
.boxing-side:last-child label { color: #64e8dc; }
.boxing-side progress { appearance: none; width: 100%; height: 16px; border: 1px solid #655078; border-radius: 5px; background: #201831; overflow: hidden; }
.boxing-side progress::-webkit-progress-bar { background: #201831; }
.boxing-side progress::-webkit-progress-value { background: linear-gradient(90deg,#dc7b35,#ffcb63); transition: width .1s; }
.boxing-side:last-child progress::-webkit-progress-value { background: linear-gradient(90deg,#27a6b4,#91f0de); }
.boxing-side progress::-moz-progress-bar { background: #ffbc48; }
.boxing-side:last-child progress::-moz-progress-bar { background: #64e8dc; }
.boxing-side progress.stamina { height: 7px; border: 0; }
.boxing-side .stamina::-webkit-progress-value { background: #a59ad0; }
.boxing-side small { font: 10px var(--font-mono); color: #afa1c3; }
.boxing-round { text-align: center; color: #ffe5ae; font: 400 20px/1.1 var(--font-display); }
.boxing-round small { display: block; color: #b3a4c9; font: 600 10px var(--font-mono); margin-bottom: 4px; }
.boxing-top-actions { position: absolute; top: 98px; left: 4%; right: 4%; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.boxing-top-actions button { pointer-events: auto; padding: 7px 12px; font-size: 12px; }
.boxing-connection { font: 600 10px/1.3 var(--font-mono); letter-spacing: .05em; color: #9cdace; max-width: 55%; }
.boxing-pad { position: absolute; bottom: 18px; left: 4%; right: 4%; display: flex; align-items: end; justify-content: center; gap: clamp(12px, 4vw, 60px); }
.boxing-pad-group { display: grid; grid-template-columns: repeat(4, minmax(48px, 1fr)); gap: 6px; }
.boxing-pad-group.punches { grid-template-columns: repeat(5, minmax(56px, 1fr)); }
.boxing-control { pointer-events: auto; touch-action: none; user-select: none; -webkit-user-select: none; min-height: 48px; min-width: 46px; padding: 7px 9px; border: 1px solid #76628f; border-radius: 10px; background: #211a37ed; color: #e9dff7; font: 700 11px/1.3 var(--font-body); cursor: pointer; box-shadow: 0 4px 0 #100c20; }
.boxing-control small { display: block; margin-top: 3px; color: #9e90b2; font: 10px var(--font-mono); }
.boxing-control[data-pressed="true"], .boxing-control:active { border-color: #ffbc48; background: #56412e; transform: translateY(2px); box-shadow: 0 2px 0 #100c20; }
.boxing-pad-group.punches .boxing-control { border-color: #98704d; }
.boxing-pad-caption { position: absolute; bottom: 1px; left: 4%; right: 4%; text-align: center; color: #a498bc; font: 10px var(--font-mono); }
.boxing-replay-controls { grid-column: 1/-1; display: grid; gap: 10px; }
@media(max-width: 700px) {
 .boxing-bars { grid-template-columns: minmax(0,1fr) 64px minmax(0,1fr); gap: 8px; top: 14px; }
 .boxing-side label { font-size: 10px; }
 .boxing-side small { font-size: 8px; }
 .boxing-round { font-size: 17px; }
 .boxing-round small { font-size: 9px; }
 .boxing-top-actions { top: 87px; }
 .boxing-pad { bottom: 22px; gap: 10px; align-items: stretch; }
 .boxing-pad-group { grid-template-columns: repeat(2, minmax(48px,1fr)); gap: 5px; flex: 1; max-width: 130px; }
 .boxing-pad-group.punches { grid-template-columns: repeat(3,minmax(44px,1fr)); flex: 1.6; max-width: 210px; }
 .boxing-control { min-height: 43px; padding: 5px; font-size: 10px; }
 .boxing-control small { font-size: 9px; margin-top: 1px; }
 .boxing-lobby .boxing-options { gap: 7px; }
 .boxing-lobby .btn { padding-inline: 10px; font-size: 14px; }
}

#actionHud { position: absolute; inset: 0; pointer-events: none; z-index: 3; }
.action-canvas { touch-action: none; }
#actionHud[hidden] { display: none; }
body[data-game="neon-wake"] #pWakeShop .wake-shop{width:min(980px,100%);background:linear-gradient(125deg,#123c37f5,#081e26f5);border-color:#6effbb;color:#e5fff0}
.wake-shop .eyebrow{color:#a9ffce}.wake-shop h2{margin:9px 0;font:800 clamp(24px,4vw,40px)/1.2 var(--font-body);color:#e5fff0}
.wake-shop .fine{color:#b5d6ca}.wake-shop-head{display:flex;justify-content:space-between;gap:18px;align-items:center}
.wake-points{flex:none;text-align:right}.wake-points span{display:block;font:600 11px/1.5 var(--font-mono);color:#c1ddc9}.wake-points strong{display:block;font:800 34px/1.2 var(--font-body);color:#edff80}
.wake-shop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.wake-upgrade{min-width:0;display:grid;gap:10px;text-align:left;min-height:172px;padding:18px;border:1px solid #6fbb98;border-radius:14px;background:#0c302e;color:#e5fff0;cursor:pointer;font-family:var(--font-body)}
.wake-upgrade strong{font-size:19px}.wake-upgrade span{font-size:14px;line-height:1.45;color:#c3ddd1}.wake-upgrade small{font:500 11px var(--font-mono);color:#accab9}.wake-upgrade b{color:#efff8c;font:800 19px var(--font-body)}
.wake-upgrade:hover:enabled{border-color:#edff80;background:#174737}.wake-upgrade:focus-visible{outline:3px solid #edff80;outline-offset:3px}.wake-upgrade:disabled{cursor:default;background:#152a2c;border-color:#496760}.wake-upgrade:disabled :is(strong,b){color:#adc8b8}.wake-shop #wakeShopStatus{color:#b4ffcf;min-height:22px}.wake-shop-actions{flex-wrap:wrap}
@media(max-width:700px){#pWakeShop{padding-bottom:76px}.wake-shop-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.wake-shop-head{align-items:start;gap:8px}.wake-points strong{font-size:28px}.wake-points span{font-size:9px}.wake-upgrade{min-height:170px;padding:13px}.wake-upgrade strong{font-size:17px}.wake-upgrade span{font-size:13px}.wake-shop .row{gap:10px}}
@media(max-width:380px){.wake-shop-grid{grid-template-columns:minmax(0,1fr)}.wake-upgrade{min-height:135px}.wake-shop-head{flex-wrap:wrap}.wake-points{text-align:left}}
.action-top { position: absolute; right: 14px; top: 12px; pointer-events: auto; }
.action-bottom { position: absolute; bottom: 12px; left: 12px; right: 12px; display: grid; justify-items: center; gap: 8px; }
#actionPad { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; pointer-events: auto; }
.action-button { min-width: 58px; min-height: 48px; padding: 10px 16px; border: 1px solid #8ff5df66; border-radius: 12px; color: var(--text); background: #191333ed; font: 700 13px var(--font-mono); touch-action: none; user-select: none; -webkit-user-select: none; cursor: pointer; }
.action-button:active { background: #384464; border-color: var(--spark); }
.action-button:focus-visible { outline: 3px solid var(--spark); outline-offset: 2px; }
#actionHint { margin: 0; color: #d0c7e9; font: 500 12px/1.4 var(--font-mono); text-align: center; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media(max-width: 520px) { .action-button { padding: 10px; min-width: 48px; font-size: 11px; }.action-bottom { bottom: 10px; }.action-top { top: 8px; right: 8px; } }
@media(max-width: 760px), (pointer: coarse) {
 .action-button { min-height: 52px; min-width: 48px; font: 700 14px var(--font-body); }
 .action-key { display: none; }
 .action-top .btn { min-height: 44px; }
 #actionHint { font: 400 12px/1.4 var(--font-body); }
 #actionReadout { position: absolute; top: 14px; left: 12px; right: 120px; width: auto; height: auto; overflow: visible; clip-path: none; margin: 0; font: 600 13px/1.4 var(--font-body); color: var(--text); }
 #actionPad[data-game="neon-wake"] { display: grid; grid-template-columns: repeat(3,48px) minmax(90px,1fr); grid-template-areas: '. up . action' 'left down right action'; gap: 7px; }
 #actionPad[data-game="neon-wake"] [data-action="left"] { grid-area: left; }
 #actionPad[data-game="neon-wake"] [data-action="right"] { grid-area: right; }
 #actionPad[data-game="neon-wake"] [data-action="up"] { grid-area: up; }
 #actionPad[data-game="neon-wake"] [data-action="down"] { grid-area: down; }
 #actionPad[data-game="neon-wake"] [data-action="action"] { grid-area: action; margin-left: 10px; }
}
@media(max-height:500px) and (orientation:landscape) {
 .action-bottom { bottom: 6px; justify-items: stretch; }
 #actionHint { display: none; }
 #actionPad[data-game="neon-wake"] { display: grid; width: 100%; grid-template-columns: repeat(3,44px) minmax(0,1fr) 94px; grid-template-areas: '. up . . action' 'left down right . action'; }
 #actionPad[data-game="neon-wake"] [data-action="left"] { grid-area: left; }
 #actionPad[data-game="neon-wake"] [data-action="right"] { grid-area: right; }
 #actionPad[data-game="neon-wake"] [data-action="up"] { grid-area: up; }
 #actionPad[data-game="neon-wake"] [data-action="down"] { grid-area: down; }
 #actionPad[data-game="neon-wake"] [data-action="action"] { grid-area: action; }
 .action-button { min-height: 44px; min-width: 44px; padding: 7px; }
 .action-key { display: none; }
}

.share-dialog{width:min(600px,calc(100% - 24px));padding:24px}
.share-targets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:16px 0}
.share-target{display:flex;align-items:center;justify-content:center;min-height:48px;padding:10px 8px;border:1px solid var(--af-edge);border-radius:12px;background:var(--af-glass-deep);color:var(--af-cream);font:600 14px/1.3 var(--font-body);text-decoration:none;cursor:pointer}
.share-target:hover{border-color:var(--af-gold);color:var(--af-gold)}
#shareDiscord{flex-direction:column;gap:4px}
.share-target:focus-visible{outline:3px solid var(--af-mint);outline-offset:3px}
.share-apps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.share-apps .share-target{flex-direction:column;gap:4px}.share-target small{color:var(--af-muted);font:400 11px/1.3 var(--font-body)}
.share-link-row{display:flex;gap:8px;margin:16px 0}.share-link-row input{min-width:0;flex:1}
.share-dialog details{margin:16px 0}.share-dialog summary{min-height:44px;cursor:pointer;padding:12px 0;color:var(--af-muted)}
.share-dialog textarea{width:100%;min-height:90px;margin:0 0 10px}.share-dialog .row{flex-wrap:wrap}
.share-dialog #shareStatus{min-height:20px;color:var(--af-mint)}
@media(max-width:600px){.share-dialog{padding:18px}.share-targets{grid-template-columns:repeat(2,minmax(0,1fr))}.share-link-row{flex-wrap:wrap}.share-link-row input{flex-basis:100%}}

.match-voice-toggle{min-height:44px;white-space:nowrap}.match-voice-toggle[data-live="true"]{border-color:var(--af-mint);color:var(--af-mint);box-shadow:0 0 14px #7cf8d21a}.match-voice-dialog{width:min(520px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto}.match-voice-dialog .row{flex-wrap:wrap;gap:10px}.match-voice-dialog p{line-height:1.6}.match-voice-dialog .btn{min-height:44px}.match-voice-dialog .player-dialog-head{align-items:flex-start}.match-voice-dialog .player-dialog-head h2{font-size:clamp(22px,5vw,30px)}@media(max-width:540px){.match-voice-toggle{font-size:12px;padding:9px 12px}.match-voice-dialog .row .btn{flex:1 1 130px}}

.foundry-shell,.open-game-shell { width: min(1060px,calc(100% - 32px)); margin: 24px auto 40px; padding: 26px; border: 1px solid var(--line); border-radius: 18px; background: #211a47f5; box-shadow: 0 18px 60px #0004; }
.foundry-header { display: flex; justify-content: space-between; align-items: start; gap: 20px; }
.foundry-header h2 { font-size: clamp(23px,4vw,34px); margin: 6px 0; }
.foundry-resources { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin: 20px 0; }
.foundry-resources>div { display: grid; gap: 6px; background: var(--well); border-top: 2px solid var(--spark); padding: 16px; border-radius: 10px; }
.foundry-resources span { color: var(--muted); font: 600 11px var(--font-mono); }
.foundry-resources strong { color: var(--signal); font: 400 clamp(19px,3vw,30px) var(--font-display); overflow-wrap: anywhere; }
.foundry-actions { margin: 10px 0; }
.foundry-machine { display: grid; grid-template-columns: 1fr minmax(210px,.6fr); gap: 20px; padding: 20px; border: 1px solid var(--line); background: var(--well); border-radius: 12px; margin: 12px 0; }
.foundry-machine h3 { margin: 0 0 10px; font-size: 20px; }.foundry-machine h3 span { color: var(--signal); margin-left: 12px; }
.foundry-machine p { font-size: 13px; color: var(--muted); line-height: 1.5; margin: 6px 0; }
.foundry-buy { display: grid; gap: 8px; align-content: center; }.foundry-buy>span { color: var(--spark); font: 500 12px var(--font-mono); }
.foundry-prestige { padding: 20px; border: 1px solid #ffbf4b55; border-radius: 12px; margin: 22px 0; }
.foundry-prestige h3 { margin-top: 0; }.foundry-backup { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.foundry-import { display: grid; gap: 5px; font-size: 12px; color: var(--muted); }.foundry-import input { width: min(260px,100%); }
.open-game-shell { width: calc(100% - 32px); max-width: 1380px; }.open-game-links { gap: 18px; font-size: 12px; }
#openGameArea { margin-top: 18px; background: #fff; min-height: 700px; border-radius: 12px; overflow: hidden; }
#openGameArea iframe { display: block; width: 100%; height: max(720px,calc(100dvh - 260px)); border: 0; background: #fff; }
@media(max-width:650px){.foundry-shell,.open-game-shell { width: calc(100% - 16px); padding: 16px; margin-top: 10px; }.foundry-header { flex-wrap: wrap; gap: 10px; }.foundry-resources { grid-template-columns: repeat(2,minmax(0,1fr)); }.foundry-machine { grid-template-columns: 1fr; gap: 12px; padding: 16px; }.foundry-buy { grid-template-columns: minmax(0,1fr); }.open-game-links { gap: 12px; }#openGameArea iframe { height: 760px; }.foundry-header .eyebrow { font-size: 10px; }}