/* Questions you can always read over the nature pictures: the question sits in its own solid box, the opposite colour of the answers.
   Light theme: black box, white words (the answers are white). Dark theme: white box, black words (the answers are dark). */
.qarea .prompt{background:#111114;color:#fff;border-radius:18px;padding:14px 18px;margin-left:0;margin-right:0;box-shadow:0 10px 28px rgba(0,0,0,.28);box-sizing:border-box;max-width:100%}
[data-theme="dark"] .qarea .prompt{background:#fff;color:#111114;box-shadow:0 10px 28px rgba(0,0,0,.35)}
.qarea .prompt .blank{border-bottom-color:currentColor;color:inherit}
#qPrompt{line-height:1.3}
#qPrompt.one{white-space:nowrap;overflow:hidden;text-overflow:clip}
#qPrompt .qWord{font-weight:800;opacity:.75;margin-inline-end:.45em}
/* Hint and Skip: solid and clear on every picture */
[data-theme="dark"] .qarea .foot .softBtn{background:rgba(22,20,34,.9);color:#fff;border:1px solid rgba(255,255,255,.35)}
[data-theme="light"] .qarea .foot .softBtn{background:#fff;color:#000;border:1px solid rgba(0,0,0,.12);box-shadow:0 6px 18px rgba(0,0,0,.14)}
.qarea .foot .softBtn[disabled]{opacity:.55}
/* The title at the top (History · Question 1 of 10): the same clear box as the question */
#quiz .topTitle,#case .topTitle,#vault .topTitle{background:#111114;color:#fff;border-radius:16px;padding:6px 16px 7px;box-shadow:0 8px 22px rgba(0,0,0,.25)}
#quiz .topTitle .t2,#case .topTitle .t2,#vault .topTitle .t2{color:rgba(255,255,255,.78)}
[data-theme="dark"] #quiz .topTitle,[data-theme="dark"] #case .topTitle,[data-theme="dark"] #vault .topTitle{background:#fff;color:#111114}
[data-theme="dark"] #quiz .topTitle .t2,[data-theme="dark"] #case .topTitle .t2,[data-theme="dark"] #vault .topTitle .t2{color:rgba(17,17,20,.7)}
/* room to breathe: back · home · title · score, each with plenty of space */
#quiz .topbar,#case .topbar,#vault .topbar{gap:18px!important;padding-top:8px!important;padding-bottom:14px!important}
@media (min-width:600px){#quiz .topbar,#case .topbar,#vault .topbar{gap:26px!important}}
#quiz .topTitle,#case .topTitle,#vault .topTitle{padding:7px 20px 8px}
#quiz .topTitle .t2,#case .topTitle .t2,#vault .topTitle .t2{margin-top:2px}
/* the score and the round buttons: solid, so they read on light pictures too */
html[data-theme="dark"] #quiz .topbar .iconBtn,html[data-theme="dark"] #case .topbar .iconBtn,html[data-theme="dark"] #vault .topbar .iconBtn,
html[data-theme="dark"] #quiz .iqChip,html[data-theme="dark"] #case .iqChip,html[data-theme="dark"] #vault .iqChip{background:rgba(22,20,34,.9)!important;color:#fff;border-color:rgba(255,255,255,.35)}
html[data-theme="light"] #quiz .topbar .iconBtn,html[data-theme="light"] #case .topbar .iconBtn,html[data-theme="light"] #vault .topbar .iconBtn,
html[data-theme="light"] #quiz .iqChip,html[data-theme="light"] #case .iqChip,html[data-theme="light"] #vault .iqChip{background:#fff!important;color:#111114;border-color:rgba(0,0,0,.12)}
/* the title line on the home page sits on a soft glass card (the nature picture shows through, the words read clearly) */
#home .slogan{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;color:#F6D77E!important;-webkit-text-fill-color:currentColor;position:relative;z-index:0;display:table;margin-left:auto!important;margin-right:auto!important;padding:9px 22px 10px;max-width:calc(100% - 36px);box-sizing:border-box}
#home .slogan::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:999px;background:rgba(18,14,38,.38);border:1px solid rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);box-shadow:0 10px 30px rgba(0,0,0,.18)}
[data-theme="light"] #home .slogan::before{background:rgba(255,255,255,.55);border-color:rgba(255,255,255,.8)}
[data-theme="light"] #home .slogan{color:#7A560E!important}
/* the logo, 30% smaller */
.wordmark .logoImg{height:34px}
@media(max-width:480px){.wordmark .logoImg{height:28px}}
