/* Short interaction feedback; all content is visible without JavaScript. */
:root { --rail-clearance: calc(92px + env(safe-area-inset-top, 0px)); }
html { scroll-padding-top: var(--rail-clearance); }
.section { scroll-margin-top: 0; }
.workflow-tabs, #entry-test, #course-grid, #library-title { scroll-margin-top: 0; }
.premium-button, .primary-button, .secondary, .text-link, .text-button { position: relative; }
:is(.premium-button,.primary-button,.secondary,.text-link,.text-button,.course-open) > span[aria-hidden=true]:last-child {
  transition: transform 180ms ease;
}
:is(.premium-button,.primary-button,.secondary):active { transform: translateY(1px) scale(.985); }
.save-button { transition: background 160ms ease, color 160ms ease; }
.save-button svg { transition: transform 180ms ease, fill 180ms ease; }
.save-button[aria-pressed=true] svg { fill: #aadfc42b; }
.workflow-tabs button .workflow-icon { transition: color 180ms ease, transform 180ms ease; }
.workflow-tabs button[aria-selected=true] .workflow-icon { transform: translateY(-1px); }
.workflow-screen img { transition: opacity 180ms ease; }
.workflow-screen:active img { opacity: .82; }
.membership { position: relative; isolation: isolate; overflow: hidden; }
.offer-glint {
  position: absolute; width: 28%; height: 150%; left: 0; top: -25%; pointer-events: none;
  opacity: 0; z-index: -1;
  background: linear-gradient(90deg, transparent, #ceffdd18 45%, #eaffe923 52%, transparent);
}
.membership-start { min-height: 3.5em; }
.membership-start strong { font: inherit; color: #ddf5ca; }
.included-grid > div { border-radius: 12px; transition: background-color 180ms ease; }
.included-grid > div[data-chosen=true] { background-color: #c7ffd909; }
.purchase-questions summary > span { transition: transform 180ms ease; }
.purchase-questions details[open] summary > span { transform: rotate(45deg); }
.proof-handoff {
  margin: 26px 0 19px; padding: 19px 20px; border: 1px solid #bce7d126;
  border-radius: 14px; background: linear-gradient(120deg,#bdfce110,#bdfce102);
}
.proof-handoff small { display: block; font-size: 10px; letter-spacing: .8px; color: #9dc7b4; margin-bottom: 8px; }
.proof-handoff strong { font-size: 17px; line-height: 1.5; font-weight: 500; color: #e0f4e9; }
.proof-handoff p { font-size: 12px; line-height: 1.75; color: #a8bfb9; margin-top: 9px; }
.membership-rail { position: fixed; z-index: 45; top: calc(10px + env(safe-area-inset-top, 0px)); left: 16px; right: 16px; pointer-events: none; }
.membership-rail-inner {
  max-width: 550px; margin-inline: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 14px; padding: 9px 10px 9px 19px; border-radius: 17px; pointer-events: auto;
  border: 1px solid #d0ffe131; background: #14241ff5;
  box-shadow: inset 0 1px 0 #f3fff51a, 0 8px 32px #0005;
}
.membership-rail-label { display: flex; flex: 1 1 max-content; flex-wrap: wrap; align-items: baseline; gap: 3px 12px; min-width: 0; }
.membership-rail-label strong { color: #d5ede0; font-size: 12px; font-weight: 500; }
.membership-rail-label span { color: #a7c1b2; font-size: 12px; white-space: nowrap; }
.membership-rail .premium-button { min-height: 44px; font-size: 12px; padding: 10px 15px; flex-shrink: 0; gap: 12px; }
.launch-offer { display: inline-flex; align-items: center; margin-top: 16px; padding: 7px 10px; border: 1px solid #d3f8b94d; border-radius: 999px; background: #c6f5ac12; box-shadow: inset 0 1px 0 #edffda24; color: #d7f6c1; font-size: 11px; line-height: 1.5; }
.standard-price { color: #b0c9a5; font-size: 12px; line-height: 1.6; margin: -4px 0 20px; }
.standard-price s { text-decoration-color: #b0c9a5aa; }
.membership-price .billing-line { line-height: 1.6; }
@media (hover:hover) and (pointer:fine) {
  :is(.premium-button,.primary-button,.secondary,.text-link,.text-button):hover > span[aria-hidden=true]:last-child { transform: translate(2px,-1px); }
  .course-card:hover .card-meta .arrow { transform: translate(3px,-2px); }
  .course-card:hover .course-cover { border-color: #afd7c852; }
  .workflow-screen:hover img { opacity: 1; }
  .save-button:hover svg { transform: translateY(-2px); }
}
@media (hover:none) {
  .course-card:hover, .premium-button:hover, .primary-button:hover { transform: none; }
}
@media (max-width:650px) {
  .workflow-screen img { aspect-ratio: 1.6; min-height: 0; object-fit: contain; }
  .glass, .entry-proof, .site-header { backdrop-filter: none; }
  .ambient { display: none; }
  .membership-rail { left: 12px; right: 12px; }
  .membership-rail-inner { gap: 10px; padding-left: 13px; }
  .membership-rail-label { flex-direction: column; gap: 1px; }
  .membership-rail-label strong, .membership-rail-label span { font-size: 11px; }
  .membership-rail .premium-button { font-size: 11px; padding-inline: 12px; }
  .proof-handoff { padding: 17px; }
  .proof-handoff strong { font-size: 16px; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
  :is(.premium-button,.primary-button,.secondary):active, .workflow-tabs button[aria-selected=true] .workflow-icon,
  :is(.premium-button,.primary-button,.secondary,.text-link,.text-button):hover > span[aria-hidden=true]:last-child,
  .course-card:hover .card-meta .arrow, .save-button:hover svg { transform: none; }
}
