/* J'annonce keeps its full-height dark background. The last grid row is always reserved. */
:root{--ad-reserve:calc(80px + env(safe-area-inset-bottom,0px));--game-header:calc(58px + env(safe-area-inset-top,0px))}
html,body{height:100%;min-height:100%;overflow:hidden;background:var(--bg)}
body{padding:0;margin:0}
.app-shell,body[data-screen="home"] .app-shell{height:100svh;height:100dvh;min-height:0;padding-top:0;padding-bottom:0;grid-template-rows:var(--game-header) minmax(0,1fr) var(--ad-reserve)}
.topbar{padding-top:env(safe-area-inset-top,0px);min-width:0}
.top-tools{gap:6px;flex-shrink:0}
.top-tools [data-action="fullscreen"]{flex:none}
#app{padding:8px 0 12px;min-width:0;container-type:size}
#advertising-slot{position:fixed;inset:auto 0 0;height:var(--ad-reserve);box-sizing:border-box;background:transparent;border:0;display:flex;flex-direction:column;align-items:center;gap:5px;padding-top:8px;z-index:10}
.ad-label{font-size:10px;line-height:11px;letter-spacing:.06em;color:var(--muted)}
#ad-frame{width:320px;height:50px;flex:none;line-height:0}
#jannonce-bottom-ad{width:320px;height:50px}
@media(max-width:319px){#ad-frame{visibility:hidden}}
#toast{bottom:calc(var(--ad-reserve) + 10px)}
dialog{bottom:var(--ad-reserve);max-height:calc(100svh - var(--ad-reserve) - 24px);max-height:calc(100dvh - var(--ad-reserve) - 24px)}
.privacy-links{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:12px}
.privacy-links .text-button{min-height:44px}
.privacy-links a{font-size:12px;line-height:1.5;color:var(--muted);text-underline-offset:3px}
/* The reserve is identical while the ad loads, is refused, blocked or unfilled. */
@media(max-width:420px){.edition{display:none}.top-tools{gap:5px}.topbar{gap:8px}.studio img{width:120px}}

/* Compact only the content when the available play area is short. */
@container(max-height:520px){
 .home-screen{gap:12px}.home-intro .eyebrow{margin-bottom:6px}.tagline{font-size:16px;margin-top:6px}
 .oral-demo{padding:14px 17px}.oral-demo>p{font-size:18px;margin:10px 0 12px}.spoken-bids>span{padding:8px 10px}
 .home-actions{gap:7px}.home-promise{font-size:11px}.button-xl{min-height:52px;padding:13px 20px;font-size:19px}
 .home-links .text-button{min-height:30px;padding:5px 2px}.studio-discover{min-height:34px;margin-top:0;padding:6px 13px;font-size:12px}
 .screen-top{min-height:28px;margin-bottom:6px}.back-button{min-height:28px;padding:4px 2px;font-size:12px}
 .question-layout{gap:12px}.topic h1{font-size:clamp(22px,5.7vw,30px);margin:12px 0 8px}.topic-links .text-button{min-height:28px;padding:4px 2px}
 .announcement{padding-top:12px}.announcement-heading label{font-size:16px;margin-top:4px}.target-stepper input{height:70px;font-size:62px}
 #target-caption{margin-bottom:12px}.announcement>.button{min-height:48px;padding-top:13px;padding-bottom:13px}
 .timer-zone{flex-direction:row;justify-content:center;gap:18px}.clock-wrap{width:112px;height:112px}.clock-digits{font-size:52px}
 .timer-layout{gap:7px}.topic-compact h1{font-size:clamp(19px,5.1vw,25px);margin:8px 0 2px}.answer-tracker{padding:6px 2px}
 .count-buttons .button{min-height:48px}.finish-button{min-height:28px;padding:4px 2px}
 .center-screen{gap:8px;padding:0}.status-mark{width:44px;height:44px;margin-bottom:0;border-radius:14px}.status-mark svg{width:25px;height:25px}
 .center-screen h1{font-size:32px}.result-copy{font-size:14px}.result-contract{padding:9px 0;margin:3px 0}.result-contract strong{font-size:40px}
 .center-screen>.button,.verdict-buttons .button{min-height:48px;padding:13px 15px}.center-screen>.text-button{min-height:28px;padding:4px 2px}
 .settings-screen{gap:12px}.section-heading h1{font-size:25px}.section-heading p{font-size:12px;margin-top:5px}
 .setting-group legend{margin-bottom:7px}.segmented label>span{padding:8px 5px;font-size:18px}.theme-body{min-height:38px;padding:8px;font-size:11px}
 .themes-grid{gap:6px}.themes .small-hint{margin-top:6px}.settings-screen>.button{min-height:48px;padding:13px 18px}
}
@container(max-height:450px){
 .home-screen{gap:8px}.home-intro .eyebrow{font-size:9px;margin-bottom:4px}.game-logo{font-size:clamp(30px,9.5vw,39px)}.tagline{font-size:14px;margin-top:4px}
 .oral-demo{padding:10px 13px}.demo-heading{font-size:8px}.oral-demo>p{font-size:16px;margin:8px 0}.spoken-bids>span{font-size:11px;padding:7px 9px}
 .home-actions{gap:5px}.home-links .text-button{min-height:28px}.button-xl{min-height:48px;padding:12px 18px;font-size:18px}.studio-discover{min-height:32px;padding:5px 12px}
 .topic{padding-top:0}.topic h1{font-size:clamp(20px,5.4vw,26px);margin:9px 0 6px}.category-badge{font-size:11px}.category-badge svg{width:15px;height:15px}
 .announcement-heading .eyebrow{font-size:9px}.announcement-heading label{font-size:15px}.target-stepper input{height:62px;font-size:56px}
 .step-button{width:44px;height:44px;min-width:44px}.clock-wrap{width:100px;height:100px}.clock-digits{font-size:46px}
 .center-screen .status-mark{display:none}.center-screen{gap:7px}.center-screen h1{font-size:29px}.recap-question{font-size:15px;padding:10px}
 .judge-target{font-size:15px}.judge-count{font-size:11px}.result-copy{font-size:13px}.result-contract{padding:8px 0}.result-contract strong{font-size:36px}
 .settings-screen{gap:8px}.section-heading h1{font-size:22px}.section-heading p{font-size:11px}.setting-group legend{font-size:12px;margin-bottom:5px}
 .settings-screen .themes-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.theme-body{min-height:40px;padding:7px 5px;gap:4px;font-size:10px}.theme-icon{width:13px;height:13px}.checkmark{display:none}
 .theme-choice input:checked+.theme-body{border-color:var(--lime)}.themes .small-hint{font-size:11px;margin-top:5px}
}
@container(max-height:385px){
 .home-intro .eyebrow,.demo-heading,.home-promise{display:none}.home-screen{gap:6px}.game-logo{font-size:32px}.tagline{margin-top:3px}
 .oral-demo{padding:9px 12px}.oral-demo>p{font-size:15px;margin:0 0 8px}.spoken-bids>span{padding:6px 8px;font-size:10px}
 .button-xl{min-height:44px;padding:10px 16px}.home-links .text-button{min-height:26px;padding:4px 2px}.studio-discover{min-height:30px;font-size:11px}
 .screen-top{min-height:24px;margin-bottom:4px}.back-button{min-height:24px;font-size:11px}.time-chip{font-size:10px}
 .question-layout{gap:8px}.topic h1{font-size:20px;margin:7px 0 5px;line-height:1.15}.topic-links .text-button{min-height:24px;font-size:10px}
 .announcement{padding-top:8px}.announcement-heading .eyebrow{display:none}.announcement-heading label{font-size:14px;margin-top:0}
 .target-stepper input{height:54px;font-size:49px}#target-caption{font-size:11px;margin-bottom:8px}.announcement>.button{min-height:44px;padding:11px 16px;font-size:15px}
 .timer-layout{gap:5px}.topic-compact h1{font-size:19px;margin:6px 0 2px}.clock-wrap{width:90px;height:90px}.clock-digits{font-size:43px}
 .answer-tracker{padding:4px 2px;font-size:12px}.answer-tracker strong{font-size:23px}.count-buttons .button{min-height:44px;padding:11px 12px;font-size:15px}
 .center-screen{gap:5px}.center-screen h1{font-size:27px}.recap-question{padding:8px;font-size:14px}.judge-count{line-height:1.35}.judge-target{font-size:14px}
 .center-screen>.button,.verdict-buttons .button{min-height:44px;padding:11px 12px;font-size:15px}.result-contract>span{font-size:12px;line-height:1.35}
 .settings-screen .section-heading p{display:none}.settings-screen .section-heading h1{font-size:20px}.settings-screen .screen-top .eyebrow{font-size:8px}
 .segmented label>span{padding:6px 5px;font-size:17px}.settings-screen>.button{min-height:44px;padding:11px 16px;font-size:15px}
}

/* Landscape: place panels next to each other, above the same bottom reserve. */
@media(max-height:520px) and (min-width:520px){
 :root{--game-header:calc(44px + env(safe-area-inset-top,0px))}
 .app-shell{padding-left:18px;padding-right:18px}.topbar .icon-button{width:32px;height:32px}.studio img{width:104px}.game-brand{font-size:18px;min-height:36px}
 #app{padding:4px 0 8px}.home-screen{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px 24px;max-width:820px}
 .home-intro{grid-column:1;grid-row:1}.home-intro .eyebrow,.home-promise{display:none}.game-logo{font-size:30px}.tagline{font-size:13px;margin-top:2px}
 .oral-demo{grid-column:2;grid-row:1 / 4;align-self:center}.home-actions{grid-column:1;grid-row:2;gap:3px}.studio-discover{grid-column:1;grid-row:3;justify-self:center}
 .button-xl{min-height:40px;padding:9px 16px;font-size:17px}.home-links .text-button{min-height:24px;padding:3px 2px}.studio-discover{min-height:26px;padding:3px 10px;font-size:11px}
 .play-screen{max-width:100%}.screen-top{min-height:24px;margin-bottom:4px}.question-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:22px;align-items:center}
 .announcement{border-top:0;border-left:1px solid var(--line);padding:0 0 0 20px}.announcement-heading .eyebrow{display:none}.announcement-heading label{font-size:14px;margin-top:0}
 .target-stepper input{height:46px;font-size:42px}.target-stepper{margin:0}#target-caption{font-size:10px;margin-bottom:5px}.announcement>.button{min-height:40px;padding:10px 13px}
 .topic h1{font-size:20px;margin:8px 0 4px}.topic-links .text-button{min-height:24px}.topic-compact h1{font-size:19px}
 .timer-layout{display:grid;grid-template-columns:minmax(0,1.1fr) 98px minmax(0,1fr);gap:18px;align-items:center}.timer-zone{flex-direction:column;gap:2px}
 .clock-wrap{width:84px;height:84px}.clock-digits{font-size:40px}.pause-button{min-height:24px;padding:3px 4px;font-size:11px}
 .answer-tracker{padding:4px 2px;font-size:11px}.answer-tracker strong{font-size:23px}.count-buttons{gap:6px}.count-buttons .step-button{min-width:40px;width:40px}.count-buttons .button{min-height:42px;padding:10px 8px;font-size:14px}
 .finish-button{min-height:24px;font-size:11px}.center-screen{display:grid;grid-template-columns:1fr 1fr;gap:5px 24px;text-align:center;max-width:800px}
 .center-screen .status-mark{display:none}.center-screen>.eyebrow,.center-screen>h1,.center-screen>.result-copy,.center-screen>.judge-target{grid-column:1}
 .center-screen>h1{font-size:28px}.result-screen .result-contract{grid-column:2;grid-row:1 / 3;margin:0;padding:6px 0}.result-screen>.button{grid-column:2;grid-row:3;min-height:42px}
 .result-screen>.text-button{grid-column:2;grid-row:4;min-height:24px}.result-copy{font-size:12px}.result-contract strong{font-size:32px}
 .judge-screen .recap-question{grid-column:2;grid-row:1 / 3;margin:0;padding:8px;font-size:14px}.judge-screen .judge-count{grid-column:1;grid-row:4}
 .judge-screen .verdict-buttons{grid-column:2;grid-row:3;gap:8px;margin:0}.judge-screen>.text-button{grid-column:2;grid-row:4;min-height:24px}
 .verdict-buttons .button{min-height:42px;padding:10px;font-size:14px}.settings-screen{display:grid;grid-template-columns:1fr 1.2fr;gap:5px 20px;max-width:800px}
 .settings-screen>.screen-top{grid-column:1;grid-row:1}.settings-screen>.section-heading{grid-column:1;grid-row:2}.settings-screen .section-heading h1{font-size:18px}.settings-screen .section-heading p{display:none}
 .settings-screen>.setting-group:not(.themes){grid-column:1;grid-row:3}.settings-screen>.themes{grid-column:2;grid-row:1 / 5}.settings-screen>.button{grid-column:1;grid-row:4;min-height:38px;padding:9px 13px;font-size:14px}
 .settings-screen .themes-grid{grid-template-columns:1fr 1fr}.theme-body{min-height:32px;padding:5px;font-size:10px}.setting-group legend{font-size:11px;margin-bottom:4px}
 .segmented label>span{padding:5px;font-size:16px}.themes .small-hint{margin-top:4px;font-size:10px}
}
@media(max-height:380px) and (min-width:520px){
 .home-screen{gap:3px 20px}.game-logo{font-size:27px}.tagline{font-size:12px}.oral-demo{padding:9px 12px}.oral-demo>p{font-size:15px}
 .timer-layout{grid-template-columns:minmax(0,1fr) 78px minmax(0,1fr);gap:12px}.clock-wrap{width:72px;height:72px}.clock-digits{font-size:34px}.clock-label>span:last-child{font-size:7px}
 .topic h1,.topic-compact h1{font-size:18px}.center-screen>h1{font-size:24px}.result-copy{font-size:11px}.center-screen>.eyebrow{font-size:9px}
 .settings-screen>.section-heading{display:none}.settings-screen>.setting-group:not(.themes){grid-row:2}.settings-screen>.button{grid-row:3}.settings-screen>.themes{grid-row:1 / 4}
}

/* BARAE: only the site's own separate banner heading is hidden. */
#advertising-slot > .ad-label{display:none!important}