/* High IQ v3.3 — gameplay-first visual refinement.
   This layer intentionally sits on top of high-iq.css + high-iq-v3.css. */
.high-iq-shell{
  --hiq33-panel:rgba(7,22,14,.88);
  --hiq33-panel-strong:rgba(5,16,10,.96);
  --hiq33-edge:rgba(143,221,165,.18);
  --hiq33-edge-hot:rgba(230,197,111,.48);
  --hiq33-glow:0 0 0 1px rgba(143,221,165,.04),0 24px 70px rgba(0,0,0,.32);
}

/* Make the challenge console read as the game, not another content section. */
.quiz-console{
  position:relative;
  overflow:clip;
}
.quiz-console::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 16% 12%,rgba(143,221,165,.07),transparent 28rem),
    radial-gradient(circle at 88% 8%,rgba(168,139,232,.08),transparent 26rem),
    linear-gradient(180deg,rgba(255,255,255,.012),transparent 28%);
}
.quiz-console>*{position:relative;z-index:1}
.quiz-console-header h2{font-size:clamp(1.55rem,3vw,2.35rem);letter-spacing:-.035em}
.quiz-console-header .eyebrow{color:#d8c77d}

/* Setup should feel like choosing a game mode. */
#quiz-setup .setup-intro h3{font-size:clamp(1.2rem,2vw,1.55rem);letter-spacing:-.02em}
.preset-button{position:relative;overflow:hidden;text-align:left}
.preset-button strong{display:block;font-size:1rem;letter-spacing:-.01em}
.preset-button span{display:block;margin-top:3px;color:#aebbb2;font-size:.75rem;font-weight:760}
.preset-button.is-active::after{
  content:"SELECTED";
  position:absolute;
  right:10px;
  top:9px;
  padding:3px 6px;
  border:1px solid rgba(230,197,111,.24);
  border-radius:999px;
  color:#f1dd9e;
  font-size:.55rem;
  font-weight:950;
  letter-spacing:.1em;
}
#start-quiz{box-shadow:0 12px 34px rgba(143,221,165,.12)}

/* Active playfield. */
#quiz-panel{
  background:linear-gradient(180deg,rgba(4,16,10,.46),rgba(4,13,9,.16));
}
.quiz-scoreboard{
  box-shadow:0 12px 38px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.03);
}
.quiz-scoreboard>div{position:relative;overflow:hidden}
.quiz-scoreboard>div::after{
  content:"";
  position:absolute;
  inset:auto 9px 6px 9px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(143,221,165,.42),rgba(168,139,232,.28));
  opacity:.55;
}
#live-streak:not(:empty){color:#f0d47f!important;text-shadow:0 0 22px rgba(230,197,111,.14)}

.question-meta{align-items:center}
.question-heading{
  position:relative;
  padding-left:18px;
}
.question-heading::before{
  content:"";
  position:absolute;
  left:0;
  top:.16em;
  bottom:.12em;
  width:4px;
  border-radius:999px;
  background:linear-gradient(180deg,var(--hiq-green),var(--hiq-purple));
  box-shadow:0 0 20px rgba(143,221,165,.15);
}

.answer-option{
  overflow:hidden;
  isolation:isolate;
}
.answer-option::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 0 62%,rgba(255,255,255,.025) 62% 100%);
  opacity:.7;
}
.answer-option:focus-visible{
  outline:3px solid rgba(230,197,111,.72)!important;
  outline-offset:3px!important;
}
.answer-option[aria-pressed="true"]{transform:translateY(-2px)}
.answer-option.is-correct{
  box-shadow:0 0 0 1px rgba(143,221,165,.15),0 18px 42px rgba(26,91,49,.16)!important;
}
.answer-option.is-incorrect{
  box-shadow:0 0 0 1px rgba(228,147,130,.12),0 18px 42px rgba(96,38,31,.12)!important;
}
.answer-option.is-correct .answer-letter::after{content:"✓";margin-left:3px;font-size:.72em}
.answer-option.is-incorrect[aria-pressed="true"] .answer-letter::after{content:"×";margin-left:3px;font-size:.78em}

.quiz-controls{
  position:sticky;
  bottom:0;
  z-index:9;
  margin-left:-6px;
  margin-right:-6px;
  padding:14px 6px 6px;
  background:linear-gradient(180deg,transparent,rgba(5,16,10,.9) 30%,rgba(5,16,10,.96));
  backdrop-filter:blur(8px);
}
.quiz-action.primary{font-weight:900;letter-spacing:.01em}
#lock-answer:not(:disabled),#next-question:not([hidden]){box-shadow:0 12px 34px rgba(143,221,165,.12)}

/* Feedback reads like a reward/review state rather than a plain article card. */
.answer-feedback{position:relative;overflow:hidden}
.answer-feedback::before{
  content:"REVIEW";
  position:absolute;
  right:16px;
  bottom:10px;
  color:rgba(143,221,165,.055);
  font-size:clamp(2.4rem,9vw,6rem);
  font-weight:1000;
  letter-spacing:-.05em;
  line-height:1;
  pointer-events:none;
}
.feedback-heading-row,.explanation-copy,.context-box,.source-drawer{position:relative;z-index:1}
.feedback-heading-row h3{font-size:clamp(1.2rem,2vw,1.55rem);letter-spacing:-.02em}
.source-drawer summary{cursor:pointer;font-weight:860}

/* Results should land like a completed run. */
.results-panel>.eyebrow{color:#e6c56f}
.result-hero{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(230,197,111,.18);
  box-shadow:var(--hiq33-glow);
}
.result-hero::after{
  content:"HIGH IQ";
  position:absolute;
  right:-.04em;
  bottom:-.22em;
  color:rgba(230,197,111,.04);
  font-size:clamp(4rem,14vw,10rem);
  font-weight:1000;
  letter-spacing:-.08em;
  pointer-events:none;
}
.result-hero>*{position:relative;z-index:1}
.result-rank{
  min-width:150px;
  border:1px solid rgba(168,139,232,.22)!important;
  background:linear-gradient(155deg,rgba(168,139,232,.12),rgba(7,22,14,.52))!important;
}
.result-rank strong{font-size:clamp(1.55rem,3vw,2.5rem)!important;letter-spacing:-.04em}
.result-metric{transition:transform .16s ease,border-color .16s ease}
.result-metric:hover{transform:translateY(-2px);border-color:rgba(143,221,165,.28)}

/* De-emphasize study/coverage material compared with the play surface. */
#topics-title,.coverage-panel h3,#quality-title{letter-spacing:-.02em}
.topic-map,.coverage-layout,.quality-strip{opacity:.93}

/* Focus pass: remove pre-game dashboard weight without changing game logic. */
.high-iq-hero{
  gap:18px!important;
  padding:clamp(22px,3.5vw,34px)!important;
  grid-template-columns:minmax(0,1fr) minmax(245px,.42fr)!important;
}
.high-iq-hero h1{font-size:clamp(2rem,4.4vw,3.45rem)!important;line-height:1.02!important}
.high-iq-hero .lede{max-width:700px!important;font-size:.96rem!important;line-height:1.55!important}
.high-iq-hero .actions{
  display:grid!important;
  grid-template-columns:minmax(180px,1.15fr) minmax(160px,.9fr) auto auto;
  gap:8px!important;
  margin-top:18px!important;
}
.high-iq-hero .actions .hero-daily-button{
  order:-3;
  border-color:rgba(143,221,165,.58)!important;
  background:linear-gradient(135deg,rgba(143,221,165,.22),rgba(9,31,18,.7))!important;
  box-shadow:0 12px 34px rgba(143,221,165,.12);
  color:#ecfff1!important;
  font-weight:950!important;
}
.high-iq-hero .actions .button.primary{
  order:-2;
  border-color:rgba(168,139,232,.36)!important;
  background:rgba(168,139,232,.08)!important;
}
.high-iq-hero .actions a[href="/learn/"],
.high-iq-hero .actions a[href="/games/"]{
  min-height:40px!important;
  padding:8px 10px!important;
  border-color:transparent!important;
  background:transparent!important;
  color:#aebbb2!important;
  font-size:.76rem!important;
}
.daily-date-note{margin-top:7px!important;font-size:.7rem!important;color:#aeb8b0!important}
.hero-trust-row{gap:6px!important;margin-top:12px!important;opacity:.72}
.hero-trust-row span{min-height:27px!important;padding:4px 8px!important;font-size:.66rem!important}
.knowledge-panel{padding:16px!important;align-self:stretch}
.knowledge-mark{width:48px!important;height:48px!important;font-size:1.05rem!important}
.knowledge-label{margin:7px 0 9px!important;font-size:.68rem!important}
.knowledge-stats{gap:6px!important}
.knowledge-stats>div{padding:8px!important;border-radius:11px!important}
.knowledge-stats strong{font-size:1.18rem!important}
.knowledge-stats span{font-size:.62rem!important;line-height:1.25!important}
.knowledge-note{display:none!important}

.quiz-console-header{padding-top:17px!important;padding-bottom:17px!important}
#quiz-setup .setup-intro{gap:12px!important;margin-bottom:12px!important}
#quiz-setup .setup-intro p{max-width:780px;font-size:.82rem!important;line-height:1.48!important;color:#9fafa4!important}
.pool-summary{padding:6px 9px!important;font-size:.68rem!important}
.preset-row{margin-bottom:12px!important}
.preset-button{min-height:62px!important;padding:11px 13px!important}
.preset-button strong{font-size:.92rem!important}
.preset-button span{font-size:.68rem!important}
.quiz-setup-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:9px!important}
.field{padding:10px!important;border-radius:13px!important}
.field select{min-height:43px!important}
.quiz-actions{gap:8px!important}
#daily-start{
  order:-3;
  border-color:rgba(143,221,165,.5)!important;
  background:linear-gradient(135deg,rgba(143,221,165,.18),rgba(8,29,17,.68))!important;
  color:#edfff2!important;
  font-weight:920!important;
}
#start-quiz{order:-2}

/* During a question, keep only decision-relevant metadata visible. */
.question-id-chip,.verified-chip{display:none!important}
.quiz-scoreboard{gap:4px!important;padding:5px!important;border-radius:14px!important}
.quiz-scoreboard>div{
  min-height:48px!important;
  padding:7px 9px!important;
  border-color:transparent!important;
  background:transparent!important;
}
.quiz-scoreboard>div::after{inset:auto 11px 4px 11px!important;opacity:.34!important}
.quiz-scoreboard span{font-size:.58rem!important}
.quiz-scoreboard strong{font-size:.98rem!important}
.quiz-progress{margin:10px 0 15px!important}
.question-meta{margin-bottom:8px!important}
.question-heading{margin:9px 0 20px!important;font-size:clamp(1.55rem,3.15vw,2.5rem)!important;line-height:1.18!important}

@media (min-width:981px){
  #quiz-panel{padding:28px 30px 32px!important}
  .answer-grid{gap:14px}
  .answer-option{min-height:104px!important;padding:19px!important}
}

@media (max-width:980px){
  .high-iq-hero{grid-template-columns:1fr!important}
  .knowledge-panel{display:grid!important;grid-template-columns:auto 1fr;align-items:center;gap:10px!important}
  .knowledge-panel .knowledge-stats{grid-column:1/-1}
  .high-iq-hero .actions{grid-template-columns:1fr 1fr auto auto!important}
  .quiz-setup-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media (max-width:680px){
  .quiz-console{margin-inline:-8px;border-radius:18px!important}
  #quiz-panel{padding:14px 12px 18px!important}
  .quiz-scoreboard{position:sticky;top:2px;border-radius:14px}
  .quiz-scoreboard>div{min-height:44px!important}
  .question-meta{margin-top:4px}
  .question-heading{padding-left:13px;margin-top:10px!important}
  .question-heading::before{width:3px}
  .answer-option{min-height:76px!important;border-radius:15px!important}
  .answer-copy{font-size:.96rem}
  .quiz-controls{margin-left:-2px;margin-right:-2px;padding:12px 2px 2px}
  .quiz-controls .note{font-size:.72rem}
  .answer-feedback{padding:16px!important}
  .result-hero{padding:18px!important}
  .result-rank{min-width:0;width:100%}

  .high-iq-hero{padding:20px!important}
  .high-iq-hero h1{font-size:clamp(2rem,10vw,2.8rem)!important}
  .high-iq-hero .lede{font-size:.9rem!important;line-height:1.5!important}
  .high-iq-hero .actions{grid-template-columns:1fr 1fr!important}
  .high-iq-hero .actions a[href="/learn/"],
  .high-iq-hero .actions a[href="/games/"]{display:none!important}
  .hero-trust-row{display:none!important}
  .knowledge-panel{padding:12px!important}
  .knowledge-mark,.knowledge-label{display:none!important}
  .knowledge-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px!important}
  .knowledge-stats>div{padding:7px 4px!important;text-align:center}
  .knowledge-stats strong{font-size:1rem!important}
  .knowledge-stats span{font-size:.54rem!important}
  .quiz-console-header{padding:14px!important}
  #quiz-setup{padding:14px!important}
  #quiz-setup .setup-intro p{font-size:.76rem!important}
  .preset-row{grid-template-columns:repeat(3,1fr)!important;gap:6px!important}
  .preset-button{min-height:58px!important;padding:9px!important}
  .preset-button.is-active::after{display:none!important}
  .quiz-setup-grid{grid-template-columns:1fr!important;gap:7px!important}
  .field{padding:8px!important}
}

@media (max-width:440px){
  .high-iq-hero .actions{grid-template-columns:1fr!important}
  .knowledge-stats{grid-template-columns:1fr 1fr!important}
  .preset-row{grid-template-columns:1fr!important}
}

@media (prefers-reduced-motion:reduce){
  .result-metric,.answer-option,.preset-button{transition:none!important}
  .answer-option[aria-pressed="true"],.result-metric:hover,.preset-button:hover{transform:none!important}
}

@media (forced-colors:active){
  .question-heading::before,.quiz-scoreboard>div::after,.answer-option::after,.answer-feedback::before,.result-hero::after{display:none!important}
  .quiz-controls{background:Canvas!important;backdrop-filter:none!important}
  .question-id-chip,.verified-chip{display:inline-flex!important}
}