html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.brand-mark{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.2;flex-shrink:0}
.inline-icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.photo-frame.large-photo{width:min(100%,calc(min(65svh,560px) * var(--ratio)))}
.answer-summary{border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:22px}
.revealed-answer{font-size:25px;line-height:1.25;margin:0;color:var(--gold);overflow-wrap:anywhere}
.your-answer{font-size:13px;line-height:1.4;color:var(--muted);margin:9px 0 0}
.fit-reveal{margin:0}
.fit-reveal-row{display:grid;grid-template-columns:85px minmax(0,1fr);gap:12px;padding:11px 0;border-top:1px solid var(--line);align-items:baseline}
.fit-reveal-row:first-child{border-top:0;padding-top:0}
.fit-reveal-row:last-child{padding-bottom:0}
.fit-reveal dt{font-size:10px;letter-spacing:1px;color:var(--muted)}
.fit-reveal dd{margin:0;font-size:14px;line-height:1.4}
.fit-reveal strong{font-weight:600;color:var(--gold)}
.fit-reveal dd span{display:block;font-size:12px;color:var(--error);margin-top:3px}
html[data-page=game]{height:100%;overflow:hidden;scroll-behavior:auto;overscroll-behavior:none}
html[data-page=game] body{height:100svh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}
html[data-page=game] .site-header{width:100%;flex-shrink:0}
html[data-page=game] main{min-height:0;min-width:0;flex:1;outline:none}
html[data-page=game] .site-footer{display:none}
.game-shell{height:100%;min-height:0;width:100%;display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto;gap:16px;margin:0 auto;padding-top:20px;padding-bottom:24px}
.round-bar,.progress-track,.game-heading{margin-bottom:0}
.game-layout{height:100%;min-height:0;grid-template-rows:minmax(0,1fr);align-items:center;width:100%}
.photo-side{height:100%;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto}
.photo-stage,.observe-photo{height:100%;min-height:0;min-width:0;width:100%;display:grid;place-items:center;container-type:size}
.photo-stage .photo-frame,.observe-photo .photo-frame{width:min(100cqw,calc(100cqh * var(--ratio)));height:auto;max-width:100%;max-height:100%}
.photo-placeholder{min-height:0;height:100%;padding:24px;gap:12px}
.observe-ready{align-self:center}
.observe-stage{height:100%;min-height:0;width:100%;display:grid;grid-template-rows:minmax(0,1fr) 3px auto;gap:10px}
.countdown-bar{margin-top:0;width:100%}
.timer-label{margin-top:0}
.feedback{margin-top:0;padding-top:14px}
.fit-option{min-height:44px}
html[data-page=results] .site-footer{display:none}
.results-wrap{padding-top:28px;padding-bottom:24px}
.score-number{font-size:clamp(90px,14svh,120px)}
.score-denominator{margin-bottom:20px}
.result-description{margin-bottom:18px}
.result-stats{margin-top:20px;margin-bottom:20px}
.round-review{margin-top:18px}
@media(hover:none){.answer-button:hover:not(:disabled),.metal-button:hover,.hero-photo:hover{transform:none}}
.answer-button:hover:not(:disabled){border-color:var(--line);transform:none}
@media(hover:hover) and (pointer:fine){.answer-button:hover:not(:disabled){background:var(--soft)}}
@media(hover:none),(pointer:coarse){
  .answer-button:focus:not(:focus-visible){outline:none}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:760px),(max-height:560px) and (max-width:1000px){
  html[data-page=game]{height:100%;overflow:hidden;scroll-behavior:auto;overscroll-behavior:none}
  html[data-page=game] body{height:100svh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;overscroll-behavior:none}
  html[data-page=game] .site-header,html[data-page=results] .site-header{min-height:56px;max-width:none;width:100%;padding:4px 16px;padding-top:max(4px,env(safe-area-inset-top));gap:8px;flex-wrap:nowrap;flex-shrink:0}
  html[data-page=game] .site-header .navigation,html[data-page=results] .site-header .navigation{display:none}
  html[data-page=game] .wordmark,html[data-page=results] .wordmark{font-size:14px;letter-spacing:-.5px;min-height:44px}
  html[data-page=game] .brand-mark,html[data-page=results] .brand-mark{width:20px;height:20px}
  html[data-page=game] .site-header .icon-button,html[data-page=results] .site-header .icon-button{width:44px;height:44px}
  html[data-page=game] main{min-height:0;flex:1;min-width:0;outline:none}
  html[data-page=game] .site-footer,html[data-page=results] .site-footer{display:none}
  .game-shell{height:100%;width:100%;max-width:none;min-height:0;margin:0;padding:6px 16px max(10px,env(safe-area-inset-bottom));display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto;gap:8px}
  .round-bar{margin:0;min-height:32px;gap:8px}
  .round-mode{font-size:10px;gap:4px;white-space:nowrap}
  .round-mode .text-button{width:44px;min-height:44px;justify-content:center;margin-left:-10px}
  .round-stats{font-size:11px;gap:12px;white-space:nowrap}
  .round-stats .streak{display:none}
  .progress-track{margin:0;gap:4px}
  .game-heading{margin:0;min-width:0}
  .game-heading .eyebrow{font-size:8px;letter-spacing:1.6px;line-height:1.3}
  .game-heading h1{font-size:clamp(19px,5.1vw,25px);line-height:1.15;letter-spacing:-.5px;margin:6px auto;max-width:600px;overflow-wrap:break-word}
  .game-heading .game-hint{font-size:11px;line-height:1.3;margin:0}
  .game-layout{width:100%;height:100%;min-height:0;max-width:480px;gap:8px;margin:0 auto;align-self:stretch;align-items:stretch;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
  .game-layout[data-visual=hidden],.game-layout[data-visual=none]{height:auto;display:block;align-self:center}
  .game-layout[data-visual=hidden] .photo-side,.game-layout[data-visual=none] .photo-side{display:none}
  .photo-side{min-height:0;min-width:0;height:100%;display:grid;grid-template-rows:minmax(0,1fr)}
  .photo-stage,.observe-photo{width:100%;height:100%;min-height:0;min-width:0;display:grid;place-items:center;container-type:size}
  .photo-stage .photo-frame,.observe-photo .photo-frame{width:min(100cqw,calc(100cqh * var(--ratio)));height:auto;max-width:100%;max-height:100%;margin:0;border-radius:6px;box-shadow:none}
  .source-tag{display:none}
  .answer-panel{min-width:0;min-height:0}
  .answer-label{font-size:9px;letter-spacing:1.2px;margin:0 0 6px;line-height:1.2}
  .answer-list{gap:6px}
  .answer-button{min-height:44px;padding:8px 10px;gap:10px;font-size:14px;line-height:1.25;border-radius:7px}
  .answer-key{width:22px;height:22px;font-size:10px}
  .boolean-choices .answer-button{min-height:64px;flex-direction:row;font-size:18px;gap:10px;letter-spacing:0}
  .fit-group{margin-bottom:8px}
  .fit-label{font-size:9px;line-height:1.2;margin-bottom:4px}
  .fit-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
  .fit-option{min-width:0;min-height:44px;padding:6px 5px;font-size:12px;line-height:1.2;overflow-wrap:break-word}
  .fit-submit{min-height:44px;margin-top:0;padding:10px 16px;gap:12px}
  .observe-ready{margin:0 auto;align-self:center;width:100%;max-width:420px}
  .observe-ready .photo-placeholder{min-height:0;padding:25px 16px;gap:16px}
  .observe-ready .giant-symbol{font-size:70px}
  .observe-ready h2{font-size:21px}
  .observe-ready .metal-button{min-height:44px;padding:12px 20px;gap:15px}
  .observe-stage{height:100%;min-height:0;width:100%;display:grid;grid-template-rows:minmax(0,1fr) 3px auto;gap:8px;max-width:650px;margin:0 auto}
  .countdown-bar{width:100%;max-width:400px;height:3px;margin:0 auto}
  .timer-label{font-size:10px;line-height:1.2;margin:0}
  .loading-note{align-self:center;margin:0;padding:16px}
  .answer-summary{padding:10px 12px;border-radius:7px}
  .revealed-answer{font-size:19px;line-height:1.2}
  .your-answer{font-size:12px;line-height:1.3;margin-top:5px}
  .fit-reveal-row{grid-template-columns:68px minmax(0,1fr);gap:8px;padding:6px 0}
  .fit-reveal dt{font-size:8px;letter-spacing:.6px}
  .fit-reveal dd{font-size:12px;line-height:1.25}
  .fit-reveal dd span{font-size:11px;line-height:1.25;margin-top:2px}
  .feedback{width:100%;max-width:480px;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin:0 auto;padding-top:10px}
  .feedback .points{font-size:10px;line-height:1.2;margin-bottom:4px}
  .feedback h2{font-size:14px;line-height:1.2;letter-spacing:-.3px;margin:0}
  .feedback p{display:none}
  .feedback .metal-button{width:auto;min-height:44px;padding:10px 14px;gap:10px;font-size:12px;align-self:center;white-space:nowrap}
  .dialog{max-height:calc(100dvh - 32px);overflow:auto;padding:24px 20px}
  .dialog h2{font-size:25px;margin:8px 0 12px}
  .dialog .button-row{margin-top:20px}
  .dialog .metal-button{min-height:44px;padding:12px 20px}
  .results-wrap{padding:16px 16px max(12px,env(safe-area-inset-bottom))}
  .results-wrap .eyebrow{font-size:9px;line-height:1.3}
  .result-stamp{font-size:9px;padding:4px 10px;margin:5px}
  .score-number{font-size:clamp(72px,15svh,110px);line-height:.95;margin:6px 0 0;letter-spacing:-3px}
  .score-denominator{font-size:10px;margin:5px 0 12px}
  .result-title{font-size:25px;line-height:1.1;margin:0 0 8px}
  .result-description{font-size:12px;line-height:1.4;margin-bottom:12px;max-width:330px}
  .result-stats{margin:12px 0;padding:11px 6px;gap:20px}
  .result-stat strong{font-size:20px;margin-bottom:4px}
  .result-stat span{font-size:8px}
  .results-wrap .button-row{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .results-wrap .button-row .metal-button{grid-column:1/-1;min-height:44px;padding:10px 16px;font-size:13px}
  .results-wrap .outline-button{min-height:44px;padding:10px;font-size:12px}
  .round-review{margin-top:12px}
  .round-review summary{min-height:36px;font-size:11px;padding:10px 0}
  .results-wrap>.small{font-size:10px;line-height:1.3;margin:7px 0 0}
  .review-row{font-size:11px;gap:10px;overflow-wrap:anywhere}
  .toast{bottom:max(12px,env(safe-area-inset-bottom));font-size:12px;padding:12px 18px}
}
@media(max-width:380px) and (max-height:650px){
  .game-shell{gap:6px;padding-left:12px;padding-right:12px}
  .game-heading h1{font-size:19px;margin:4px auto}
  .game-heading .game-hint{font-size:10px}
  .results-wrap .result-description,.results-wrap>.small{display:none}
  .results-wrap{padding-top:12px}
}
@media(max-width:599px) and (max-height:560px){
  html[data-page=game] .site-header{display:none}
  .game-heading .eyebrow,.game-heading .game-hint{display:none}
  .game-heading h1{margin:2px auto}
  .game-shell{gap:6px}
  html[data-page=results] .site-header{min-height:48px;padding:0 12px}
  .results-wrap{padding:8px 12px}
  .results-wrap .score-number{font-size:64px;margin-top:2px}
  .results-wrap .result-stats{margin:8px 0;padding:8px 6px}
  .results-wrap .round-review{margin-top:6px}
}
@media(max-height:500px) and (min-width:600px) and (max-width:1000px){
  html[data-page=game] .site-header{min-height:44px;padding-top:0;padding-bottom:0}
  .game-shell{padding:4px 12px max(6px,env(safe-area-inset-bottom));gap:5px}
  .round-bar{min-height:28px}
  .round-mode .text-button{min-height:44px}
  .game-heading .eyebrow,.game-heading .game-hint{display:none}
  .game-heading h1{font-size:19px;margin:2px auto}
  .game-layout[data-visual=photo]{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);grid-template-rows:minmax(0,1fr);max-width:none;gap:16px;align-items:center}
  .game-layout[data-visual=photo] .answer-panel{align-self:center}
  .game-layout[data-visual=hidden],.game-layout[data-visual=none]{max-width:760px}
  .answer-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fit-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .fit-group{margin:0}
  .fit-option{font-size:11px;padding:5px}
  .fit-submit{grid-column:1/-1;justify-self:center;width:200px}
  .observe-ready .photo-placeholder{padding:12px;gap:10px}
  .observe-ready .giant-symbol{display:none}
  .feedback{max-width:none;padding-top:6px}
  .results-wrap{display:grid;grid-template-columns:1fr 1fr;column-gap:24px;row-gap:6px;max-width:850px;padding:12px 16px}
  .results-wrap .eyebrow{grid-column:1/-1;grid-row:1}
  .result-stamp{grid-column:1;grid-row:2;justify-self:center;margin:0}
  .score-number{grid-column:1;grid-row:3;font-size:80px;margin:0}
  .score-denominator{grid-column:1;grid-row:4;margin:0}
  .result-title{grid-column:1;grid-row:5;margin:0;font-size:24px}
  .results-wrap .result-description,.results-wrap>.small{display:none}
  .result-stats{grid-column:2;grid-row:2/4;align-self:center;margin:0;padding:12px 6px}
  .results-wrap .button-row{grid-column:2;grid-row:4/7;align-self:center}
  .round-review{grid-column:1;grid-row:6;margin:0}
  .round-review[open]{grid-column:1/-1;grid-row:7}
}