[hidden]{display:none!important}

#study-progress{
  position:fixed;z-index:10;left:22px;bottom:18px;display:flex;align-items:center;gap:11px;
  padding:8px 12px;border:1px solid rgba(113,197,213,.42);background:rgba(6,10,20,.88);
  color:#b8bbca;font:600 10px/1.2 Inter,"Segoe UI",sans-serif;letter-spacing:.08em;
  box-shadow:0 8px 28px rgba(0,0,0,.35);pointer-events:none
}
.study-label{color:#71c5d5}.study-label::before{content:"◇";margin-right:7px}
#study-score{color:#eee5d0;font-size:12px}#study-streak{color:#8d94ad}
#study-progress.unavailable{border-color:rgba(168,91,103,.55)}
#study-progress.unavailable .study-label{color:#cf7d83}
#study-progress.interview-passed{border-color:#8fb9a5;background:rgba(15,38,32,.94);box-shadow:0 0 28px rgba(118,155,147,.34)}
#study-progress.interview-passed .study-label,#study-progress.interview-passed #study-score{color:#b9e0cb}

#question-layer{
  position:fixed;z-index:50;inset:0;display:grid;place-items:center;padding:28px;
  background:rgba(3,5,12,.78);font-family:Inter,"Avenir Next","Segoe UI",sans-serif;color:#d7d5d8;
  cursor:default
}
.question-vignette{position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,rgba(37,60,72,.2),rgba(2,4,10,.86) 72%);pointer-events:none}
.question-card{
  position:relative;width:min(820px,94vw);max-height:94vh;overflow:auto;padding:30px 34px 22px;
  border:1px solid #516b72;background:
    linear-gradient(110deg,rgba(113,197,213,.055),transparent 34%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.014) 0,rgba(255,255,255,.014) 1px,transparent 1px,transparent 5px),
    #0b1020;
  box-shadow:0 30px 100px #000,0 0 42px rgba(113,197,213,.12)
}
.question-card::before,.question-card::after{content:"";position:absolute;background:#71c5d5;opacity:.65}
.question-card::before{left:12px;right:12px;top:8px;height:1px}.question-card::after{top:12px;bottom:12px;left:8px;width:1px}
.question-card header{display:flex;justify-content:space-between;gap:28px;align-items:flex-start;border-bottom:1px solid rgba(215,213,216,.15);padding-bottom:17px}
.eyebrow{margin:0 0 8px;color:#71c5d5;font-size:10px;font-weight:800;letter-spacing:.17em}
.question-card h1{margin:0;font:700 clamp(23px,3.4vw,39px)/1.05 "Iowan Old Style","Palatino Linotype",Georgia,serif;color:#e2ded7}
.question-number{min-width:64px;color:#c8907f;font:700 22px/1 Georgia,serif;text-align:right;letter-spacing:.08em}
.trigger{margin:19px 0 7px;color:#777e96;font-size:10px;letter-spacing:.11em;text-transform:uppercase}
.prompt{margin:0;max-width:720px;color:#eee5d0;font:600 clamp(19px,2.5vw,27px)/1.28 "Iowan Old Style","Palatino Linotype",Georgia,serif}
.instruction{margin:14px 0 12px;color:#9ca3b7;font-size:12px}
.primary-action{margin-top:10px;padding:11px 17px;border:1px solid #71c5d5;background:#172735;color:#e9e2d7;font:800 11px Inter,sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}.primary-action:hover,.primary-action:focus-visible{outline:2px solid #c8907f;outline-offset:2px}
#answer-face{margin-top:18px;animation:turn-card .24s ease-out both;transform-origin:center top}
@keyframes turn-card{from{opacity:0;transform:perspective(700px) rotateY(-12deg) translateY(5px)}to{opacity:1;transform:perspective(700px) rotateY(0) translateY(0)}}
.back-label{margin:0 0 7px;color:#71c5d5;font-size:10px;font-weight:800;letter-spacing:.16em}
.answer-question{margin:0 0 13px;color:#929aad;font:italic 14px/1.4 Georgia,serif}
#accepted-answers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 20px;margin:0;padding:15px 18px 15px 34px;border:1px solid #384458;background:#12192a;color:#e4dfd5;font:500 13px/1.4 Inter,"Segoe UI",sans-serif}
#accepted-answers li::marker{color:#769b93}
.grade-actions{display:flex;gap:10px;margin-top:15px}.grade-actions button{flex:1;padding:12px 15px;border:1px solid #526277;background:#12192a;color:#d9dce4;font:700 12px Inter,sans-serif;text-align:left;cursor:pointer}.grade-actions button span{display:inline-grid;place-items:center;width:22px;height:22px;margin-right:8px;border:1px solid currentColor;color:#71c5d5}.grade-actions button:hover,.grade-actions button:focus-visible{outline:0;border-color:#71c5d5;background:#172436}.grade-actions button:last-child:hover,.grade-actions button:last-child:focus-visible{border-color:#a85b67}
.answer-result{margin-top:18px;padding:17px 18px;border-left:3px solid #769b93;background:#111827}
.answer-result.wrong{border-left-color:#a85b67}.answer-result.passed{position:relative;border:2px solid #769b93;background:linear-gradient(110deg,rgba(118,155,147,.2),rgba(17,24,39,.96));box-shadow:0 0 30px rgba(118,155,147,.2)}.answer-result.passed::after{content:"12 ✓";position:absolute;right:18px;top:15px;color:#b9e0cb;font:700 20px Georgia,serif;letter-spacing:.08em}.result-mark{margin:0 0 4px;color:#769b93;font-size:10px;font-weight:800;letter-spacing:.16em}.answer-result.wrong .result-mark{color:#d3787e}.answer-result.passed .result-mark{padding-right:70px;color:#b9e0cb}
.answer-result h2{margin:0 0 7px;color:#e5ded2;font:700 21px/1.2 Georgia,serif}.answer-result>p:not(.result-mark){margin:6px 0;color:#aeb3c1;font-size:12px;line-height:1.5}
.question-card footer{display:flex;justify-content:space-between;gap:16px;margin-top:20px;padding-top:10px;border-top:1px solid rgba(215,213,216,.12);color:#626b80;font-size:8px;letter-spacing:.1em}.question-card footer a{color:#8299a4;text-decoration:none}.question-card footer a:hover,.question-card footer a:focus-visible{color:#71c5d5;text-decoration:underline;outline:0}

@media(max-width:650px){
  #question-layer{padding:10px}.question-card{padding:24px 20px 16px}#accepted-answers{grid-template-columns:1fr}.grade-actions{flex-direction:column}
  #study-progress{left:8px;bottom:8px}.question-card footer{flex-direction:column}.question-number{font-size:16px;min-width:42px}
}