/* The playfield owns the viewport; secondary information sits alongside it. */
.arcade-page.arcade-game-page .arcade-main{max-width:none;padding:6px 12px;gap:5px}
.arcade-game-page .arcade-session{display:grid;grid-template-columns:minmax(0,1fr) clamp(270px,23vw,340px);gap:12px;max-width:none!important;padding:0;border:0;background:transparent;border-radius:0}
.arcade-game-page .arcade-stage,.arcade-game-page .quiz-layout{height:100%;min-height:0;min-width:0;max-width:none;margin:0;border-radius:12px}
.arcade-game-page .arcade-stage{grid-column:1;grid-row:1;background:radial-gradient(ellipse at 50% 50%,#342336,#15111c 75%)}
.arcade-game-page .arcade-stage>canvas{width:100%;height:100%;object-fit:contain}
.arcade-sidebar{grid-column:2;grid-row:1;display:flex;flex-direction:column;min-width:0;min-height:0;gap:9px;padding:12px;border:1px solid #644653;border-radius:12px;background:#211922}
.arcade-sidebar .arcade-hud{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.arcade-sidebar .arcade-hud>div{padding:6px 9px;min-width:0}
.arcade-sidebar .arcade-hud strong{display:block;font-size:22px;line-height:1.4}
.arcade-sidebar .arcade-mistakes{margin:0;font-size:13px;text-align:center}
.arcade-sidebar .arcade-touch-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.arcade-sidebar .arcade-touch-controls button{min-width:0;min-height:46px;padding:4px 2px}
.game-tetris .arcade-touch-controls{grid-template-columns:repeat(5,minmax(0,1fr))}
.arcade-sidebar .arcade-toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.arcade-sidebar .arcade-toolbar button{min-width:0;min-height:34px;padding:4px 5px;font-size:11px}
.game-tetris .arcade-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}
.arcade-sidebar .arcade-item-legend{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:auto;font-size:11px}
.arcade-sidebar .arcade-companion{display:flex!important;flex:1;min-height:50px;height:auto;flex-direction:column;justify-content:center;gap:8px}
.arcade-sidebar .arcade-companion canvas{height:100px;width:100px;max-height:18dvh;max-width:18dvh}
.arcade-sidebar .arcade-live-hint{text-align:center;font-size:12px;line-height:1.6;max-width:none}
.tetris-preview{display:flex;align-items:center;gap:5px;flex:none;min-height:76px}
.tetris-preview>div{flex:1;min-width:0}
.tetris-preview span{font-size:9px;letter-spacing:1px;color:#bca2b2}
.tetris-preview canvas{display:block;width:100%;height:auto;aspect-ratio:260/68}
.tetris-preview>img{width:76px;height:76px;object-fit:contain;flex:none}
.arcade-ranking-inline{flex:1;min-height:0;margin-top:auto;display:flex;flex-direction:column}
.arcade-ranking-inline h2{font-size:13px;color:#edc29a;margin:0 0 5px}
.arcade-ranking-inline p{font-size:10px;line-height:1.4;margin:0 0 5px;color:#bba5b5}
.arcade-ranking-inline table{width:100%;table-layout:fixed;border-collapse:collapse;text-align:left;font-variant-numeric:tabular-nums}
.arcade-ranking-inline th,.arcade-ranking-inline td{font-size:11px;line-height:1.3;padding:3px 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom:1px solid #65475540}
.arcade-ranking-inline th{color:#a98c9e;font-size:9px;font-weight:500}
.arcade-ranking-inline th:first-child{width:35px}.arcade-ranking-inline th:last-child{width:81px}
.arcade-game-page .game-quiz .quiz-layout{display:block;grid-column:1;grid-row:1;border:1px solid #644653;background:radial-gradient(ellipse at 50% 40%,#3d293e60,#18131e 80%)}
.game-quiz .quiz-playfield{height:100%;padding:clamp(12px,2vw,32px);gap:16px;justify-content:center}
.game-quiz .quiz-question-card{padding:20px 24px}
.game-quiz .quiz-question-card h2{font-size:clamp(22px,2.2vw,36px);line-height:1.45}
.game-quiz .quiz-answer{min-height:80px;font-size:clamp(16px,1.5vw,22px);padding:14px 18px}
.game-quiz .quiz-answer>b{font-size:20px}
.quiz-sidebar .quiz-host{display:flex;min-height:52px;gap:7px;flex:none}
.quiz-sidebar .quiz-host>img{width:54px;height:54px}
.quiz-sidebar .quiz-host-name{font-size:9px;letter-spacing:.5px}
.quiz-sidebar .quiz-host-name span{margin-left:4px;font-size:9px}
.quiz-sidebar .quiz-host [data-quiz-host-line]{font-size:10px;line-height:1.4}
.quiz-sidebar .quiz-clock{font-size:14px;white-space:nowrap}
.quiz-sidebar .quiz-lifelines{gap:5px}
.quiz-sidebar .quiz-lifelines>button{min-width:0;padding:5px 3px;min-height:42px}
.quiz-sidebar .quiz-lifelines b{font-size:11px}.quiz-sidebar .quiz-lifelines span{font-size:8px}
.quiz-sidebar .quiz-ladder{display:flex;flex:1;min-height:0;justify-content:center;padding:8px}
.quiz-sidebar .quiz-ladder li{font-size:11px;padding:2px 5px;line-height:1.3}
.quiz-sidebar .quiz-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}
.quiz-sidebar .quiz-show-ladder{display:none}
@media(max-height:800px){
 .arcade-sidebar{padding:8px;gap:7px}
 .arcade-sidebar .arcade-hud>div{padding:3px 7px}
 .arcade-sidebar .arcade-hud strong{font-size:18px;line-height:1.3}
 .arcade-sidebar .arcade-hud small{font-size:8px;line-height:1.4}
 .tetris-preview{min-height:60px}.tetris-preview>img{width:60px;height:60px}
 .arcade-sidebar .arcade-touch-controls button{min-height:42px}
 .arcade-sidebar .arcade-toolbar button{min-height:30px;font-size:10px}
 .arcade-ranking-inline th,.arcade-ranking-inline td{font-size:10px;padding:2px 3px}
 .arcade-ranking-inline h2{font-size:12px;margin-bottom:3px}
 .arcade-ranking-inline p{font-size:9px;margin-bottom:3px}
 .quiz-sidebar .quiz-host{min-height:40px}.quiz-sidebar .quiz-host>img{width:40px;height:40px}
 .quiz-sidebar .quiz-ladder li{font-size:10px;padding:1px 4px}.quiz-sidebar .quiz-ladder ol{gap:2px}
 .quiz-sidebar .quiz-ladder h2{font-size:8px;margin-bottom:5px}.quiz-sidebar .quiz-ladder p{font-size:8px;margin-top:5px}
 .game-quiz .quiz-playfield{padding:12px 18px;gap:12px}
 .game-quiz .quiz-question-card{padding:13px 18px}.game-quiz .quiz-question-card h2{font-size:clamp(20px,2vw,29px)}
 .game-quiz .quiz-answer{min-height:64px;padding:10px 13px;font-size:17px}
}
@media(max-height:650px){
 .arcade-sidebar{gap:5px;padding:6px}
 .arcade-sidebar .arcade-hud>div{padding:2px 6px}.arcade-sidebar .arcade-hud strong{font-size:15px}
 .tetris-preview{min-height:40px}.tetris-preview>img{width:40px;height:40px}
 .tetris-preview canvas{height:28px;object-fit:contain}
 .arcade-sidebar .arcade-touch-controls button{min-height:34px;flex-direction:row;gap:2px}.arcade-sidebar .arcade-touch-controls b{font-size:16px}
 .arcade-sidebar .arcade-touch-controls span{font-size:8px}
 .arcade-sidebar .arcade-toolbar button{min-height:26px;font-size:9px}
 .arcade-ranking-inline th,.arcade-ranking-inline td{font-size:9px;padding:1px 3px}.arcade-ranking-inline p{font-size:8px}
 .quiz-sidebar .quiz-host{min-height:30px}.quiz-sidebar .quiz-host>img{height:30px;width:30px}
 .quiz-sidebar .quiz-lifelines>button{min-height:31px}.quiz-sidebar .quiz-ladder li{padding:0 4px;font-size:9px}
 .arcade-game-page .quiz-sidebar .arcade-hud{gap:4px}
 .arcade-game-page .quiz-sidebar .arcade-hud>div{padding:2px 5px}
 .arcade-game-page .quiz-sidebar .arcade-hud small{font-size:7px;line-height:1.3}
 .arcade-game-page .quiz-sidebar .arcade-hud strong{font-size:14px;line-height:1.25}
 .quiz-sidebar .quiz-ladder{padding:5px;justify-content:flex-start}
 .quiz-sidebar .quiz-ladder ol{gap:1px}
 .quiz-sidebar .quiz-ladder li,.quiz-sidebar .quiz-ladder li>b{font-size:9px;line-height:1.1}
 .quiz-sidebar .quiz-host{min-height:24px}.quiz-sidebar .quiz-host>img{height:24px;width:24px}
 .quiz-sidebar .quiz-host [data-quiz-host-line]{display:none}
 .quiz-sidebar .quiz-ladder h2{margin-bottom:3px}.quiz-sidebar .quiz-ladder p{line-height:1.3;margin-top:3px}
 .game-quiz .quiz-playfield{padding:8px 12px;gap:7px}.game-quiz .quiz-question-card{padding:10px 14px}
 .game-quiz .quiz-question-card h2{font-size:20px;line-height:1.3}.game-quiz .quiz-answer{font-size:14px;min-height:47px;padding:7px 10px;line-height:1.35}
 .game-quiz .quiz-answer>b{font-size:15px}
}
@media(max-width:750px) and (orientation:portrait){
 .arcade-page.arcade-game-page .arcade-main{padding:5px 7px;gap:4px}
 .arcade-game-page .arcade-session{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:7px}
 .arcade-sidebar{grid-column:1;grid-row:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:6px}
 .arcade-sidebar .arcade-hud{grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
 .arcade-sidebar .arcade-hud>div{padding:3px 5px}.arcade-sidebar .arcade-hud strong{font-size:15px}
 .arcade-sidebar .arcade-hud small{font-size:7px;letter-spacing:0}
 .arcade-sidebar .arcade-touch-controls{grid-column:1/-1;display:flex;gap:5px}
 .arcade-sidebar .arcade-touch-controls button{flex:1;min-height:42px;flex-direction:row;gap:6px}
 .arcade-sidebar .arcade-touch-controls b{font-size:18px}.arcade-sidebar .arcade-touch-controls span{font-size:9px}
 .arcade-sidebar .arcade-toolbar{grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
 .arcade-sidebar .arcade-toolbar button{min-height:31px;font-size:10px;padding:3px 2px}
 .game-tetris .arcade-toolbar{grid-template-columns:repeat(5,minmax(0,1fr))}
 .game-tetris .arcade-hud{grid-column:1;grid-row:1;grid-template-columns:repeat(2,minmax(0,1fr))}
 .game-tetris .tetris-preview{grid-column:2;grid-row:1;min-height:0}.tetris-preview>img{width:46px;height:46px}.tetris-preview span{font-size:8px}
 .arcade-sidebar .arcade-companion{grid-column:1/-1;flex-direction:row;min-height:18px;gap:0}
 .arcade-sidebar .arcade-companion canvas{display:none}.arcade-sidebar .arcade-live-hint{font-size:10px;line-height:1.4}
 .arcade-sidebar .arcade-mistakes{grid-column:1/-1;font-size:11px}.arcade-sidebar .arcade-item-legend{display:none}
 .arcade-ranking-inline{display:none}
 .quiz-sidebar .quiz-host{grid-column:1/-1;min-height:21px;gap:7px}.quiz-sidebar .quiz-host>img{display:none}
 .quiz-sidebar .quiz-host-name{display:none}.quiz-sidebar .quiz-host [data-quiz-host-line]{margin:0;font-size:10px}
 .quiz-sidebar .quiz-lifelines{grid-column:1/-1}.quiz-sidebar .quiz-lifelines>button{min-height:32px}
 .quiz-sidebar .quiz-toolbar{grid-template-columns:repeat(5,minmax(0,1fr))}.quiz-sidebar .quiz-toolbar button{font-size:9px}
 .quiz-sidebar .quiz-show-ladder{display:block}.quiz-sidebar .quiz-ladder{display:none}
 .game-quiz .quiz-playfield{padding:10px;gap:9px}.game-quiz .quiz-question-card{padding:12px}
 .game-quiz .quiz-question-card h2{font-size:19px;line-height:1.4}.game-quiz .quiz-answer{font-size:13px;min-height:54px;padding:8px;line-height:1.4}
 .game-quiz .quiz-answer>b{font-size:14px}
}
@media(max-width:750px) and (max-height:700px) and (orientation:portrait){
 .arcade-sidebar{padding:4px;gap:4px}.arcade-sidebar .arcade-hud strong{font-size:13px}.arcade-sidebar .arcade-hud small{font-size:6px}
 .arcade-sidebar .arcade-toolbar button{font-size:9px;min-height:28px}.arcade-sidebar .arcade-touch-controls button{min-height:36px}
 .game-quiz .quiz-playfield{padding:6px;gap:6px}.game-quiz .quiz-question-card{padding:8px 10px}
 .game-quiz .quiz-question-card h2{font-size:15px;line-height:1.35}.game-quiz .quiz-answer{font-size:11px;line-height:1.3;min-height:40px;padding:6px}
 .game-quiz .quiz-answer>b{font-size:12px}.game-quiz .quiz-decision .arcade-primary{min-height:30px;padding:5px 12px;font-size:11px}
 .quiz-sidebar .quiz-lifelines span{display:none}.quiz-sidebar .quiz-lifelines>button{min-height:28px}
}
@media(max-height:550px) and (orientation:landscape){
 .arcade-game-page .arcade-session{grid-template-columns:minmax(0,1fr) 200px;gap:7px}
 .arcade-sidebar{gap:5px;padding:5px;justify-content:center}
 .arcade-sidebar .arcade-hud strong{font-size:13px}.arcade-sidebar .arcade-hud small{font-size:7px}
 .arcade-sidebar .arcade-companion{flex:none;min-height:22px;flex-direction:row}.arcade-sidebar .arcade-companion canvas{display:none}
 .arcade-sidebar .arcade-live-hint{font-size:10px}.arcade-sidebar .arcade-item-legend{display:none}
 .arcade-ranking-inline{display:none}.tetris-preview>img{width:36px;height:36px}
 .game-tetris .arcade-touch-controls{grid-template-columns:repeat(3,minmax(0,1fr))}.game-tetris .arcade-touch-controls button{min-height:30px}
 .quiz-sidebar .quiz-ladder{display:none}.quiz-sidebar .quiz-show-ladder{display:block}
 .quiz-sidebar .quiz-host-name{display:none}.quiz-sidebar .quiz-host [data-quiz-host-line]{font-size:9px}.quiz-sidebar .quiz-host>img{display:none}
 .quiz-sidebar .quiz-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}.quiz-sidebar .quiz-lifelines{gap:3px}
 .quiz-sidebar .quiz-lifelines>button{min-height:30px;padding:3px 1px}.quiz-sidebar .quiz-lifelines b{font-size:9px}.quiz-sidebar .quiz-lifelines span{display:none!important}
 .game-quiz .quiz-playfield{padding:6px 9px;gap:6px}.game-quiz .quiz-question-card{padding:7px 10px}
 .game-quiz .quiz-question-card h2{font-size:15px;line-height:1.3}.game-quiz .quiz-prize{position:static;display:block}
 .game-quiz .quiz-answer{font-size:11px;line-height:1.3;min-height:35px;padding:5px 7px}.game-quiz .quiz-answer>b{font-size:12px}
 .game-quiz .quiz-decision .arcade-primary{min-height:28px;font-size:10px;padding:4px 10px}.game-quiz .quiz-decision>span{font-size:8px}
}
