/* Pre-test screen (js/launcher.js).
   Layout and colour taken from the driver's own launcher,
   reference/step1-orientation-01.png (1280x1024). Every value below was
   SAMPLED from that capture with pngjs rather than estimated:

     page ground     rgb(252, 252, 252)  read at (20,600) and (1250,700)
     rules           rgb(56, 82, 164)    the 1px rows at y=285 and y=515,
                                         each running ~1010px wide
     section heading rgb(40, 50, 148)    darkest pixel across the heading's
                                         own row, y=303, x=410..607
     body text       rgb(0, 0, 0)

   The column is 1024px in a 1280px viewport — the rules start and end 128px
   from each edge — so it is expressed as a max-width, not a percentage: a
   percentage would keep re-deriving the same 80% at every viewport, and this
   is a fixed-width sheet in the capture, not a fluid one.

   Deliberately absent: the USMLE wordmark, the "United States Medical
   Licensing Examination®" heading and the FSMB/NBME copyright line that sit
   above and below this sheet in the capture. Trademarks, and NOTICE commits
   that this application ships no NBME content. */

#launcher {
  position: absolute; inset: 0; overflow: auto;
  background: #fcfcfc; color: #000;
  font: normal normal normal 12pt/1.45 var(--font-item);
}
#launcher[hidden] { display: none; }

.launchSheet { max-width: 1024px; margin: 0 auto; padding: 56px 0 0; }

.launchLead { font-weight: bold; margin: 0 0 4px; }
.launchSheet hr {
  border: 0; border-top: 1px solid #3852a4; margin: 22px 0;
}

.launchHeading {
  color: #283294; text-align: center; font-weight: bold;
  font-size: 1em; margin: 0 0 10px;
}
html.white-on-black .launchHeading { color: var(--dark-accent); }

.launchExam {
  max-width: 740px;
  margin: 22px auto 0;
  padding: 18px 24px 20px;
  border: 1px solid #3852a4;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .12);
  text-align: center;
}
.launchExam p { max-width: 64ch; margin: 8px auto 12px; }
.launchFacts {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 5px 0;
  margin: 10px 0 0;
  font-size: .82em;
}
.launchFacts span { padding: 0 13px; border-right: 1px solid #9aa5c9; }
.launchFacts span:last-child { border-right: 0; }
.launchStudyLead { max-width: 65ch; margin: 0 auto 12px; text-align: center; }

/* The radio list is a centred block with left-aligned rows, matching the
   capture: the labels line up with each other, not with the page. */
.launchSizes {
  list-style: none; margin: 0 auto; padding: 0;
  width: max-content; min-width: 340px;
}
.launchSizes li { display: flex; align-items: baseline; gap: 8px; padding: 3px 0; }
.launchSizes input { margin: 0; cursor: pointer; }
.launchSizes label { display: flex; align-items: baseline; gap: 10px; cursor: pointer; }
.sizeCount { min-width: 8.5em; }
.sizeClock { min-width: 8.5em; }
.sizeNote { font-size: .8em; opacity: .72; }
.sizeNote--partial { font-style: italic; }

.launchNote {
  max-width: 62ch; margin: 18px auto 0; font-size: .82em; opacity: .8;
}

.launchGo { text-align: center; margin: 26px 0 0; }
/* Same chrome as #ProceedBtn (css/item.css) — the driver's own button
   treatment — so the launcher's one control does not introduce a second
   button style into a replica that has exactly one. */
#beginBlock, #beginExam {
  font: bold 10pt var(--font-button); color: #fff; cursor: pointer;
  padding: 6px 18px; border: 1px solid var(--chrome); border-radius: 3px;
  background: linear-gradient(var(--chrome-accent), var(--chrome));
}
#beginBlock:hover, #beginExam:hover { background: linear-gradient(var(--chrome), var(--chrome-accent)); }
#beginBlock:disabled, #beginExam:disabled { cursor: wait; opacity: .62; }
#beginBlock:focus-visible, #beginExam:focus-visible { outline: 2px solid var(--chrome); outline-offset: 2px; }
html.white-on-black #beginBlock, html.white-on-black #beginExam {
  background: #000; color: #fff; border-color: #fff;
}
html.white-on-black #beginBlock:hover, html.white-on-black #beginExam:hover { background: #fff; color: #000; }

.launchFoot { font-size: .72em; opacity: .7; margin: 0; }

html.white-on-black #launcher { background: #000; color: #fff; }
html.white-on-black .launchSheet hr { border-top-color: #fff; }
html.white-on-black .launchExam { background: #000; border-color: #fff; }

@media (max-width: 1080px) {
  .launchSheet { width: auto; margin: 0 34px; }
}