/* ===========================================================================
   Computational Finance & FinTech — gate.css
   The four transactional pages only: /register/, /results/, /quiz/, /exam/.

   Load order on those pages:
       /css/course-ml.css   (shared, never edited by this course)
       /computationalfinance/assets/course.css
       /computationalfinance/assets/gate.css   <- this file, last

   This file holds the CSS that used to sit in four inline <style> blocks.
   The quiz and exam blocks were byte-identical, so they appear here once.

   DO NOT RENAME A CLASS OR AN ID IN THIS FILE. The register, results, quiz
   and exam scripts generate markup carrying .reg-*, .rs-*, .asm-* and .fa-*
   names and query #fa-*, #rs-* and #reg-* ids. A rename that looks harmless
   breaks a live sitting silently. Restyle, never rename.

   Structure:
     1. moved: quiz + exam block (once)
     2. moved: register block
     3. moved: results block
     4. added: gate primitives — one panel, one field, one button, one status
     5. added: the sitting page head — .asm-hero, .gate-facts, .asm-countdown

   Sections 4 and 5 are scoped with [data-course="computationalfinance"], so
   they beat the unscoped moved rules above them on specificity as well as on
   source order. The moved rules keep their original selectors; they only ever
   load on these four pages.

   --warn-hair is no longer declared here. It lives in the token block in
   course.css, so the results page's .rs-msg.wait border finally renders.
   =========================================================================== */

[hidden]{display:none !important}


/* ===========================================================================
   1. MOVED — quiz/index.html and exam/index.html (one copy, byte-identical)
   =========================================================================== */

/* ---- page-specific components (the shared design system lives in course-ml.css + dl.css) ---- */
.asm-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#fa-config-warning{display:none;margin-bottom:1.1rem;padding:.8rem 1rem;border:1px solid var(--warn);background:var(--warn-soft);color:var(--wait);border-radius:5px;font-size:.86rem;line-height:1.5;font-family:var(--mono)}
#fa-config-warning b{color:var(--wait)}

/* loading / error state boxes */
.asm-statebox{display:flex;align-items:center;gap:.9rem;padding:1.15rem 1.2rem;border:1px solid var(--line-strong);border-radius:8px;background:#fff;margin:1.6rem 0}
.asm-statebox .txt{font-size:.96rem;color:var(--ink-soft);line-height:1.5}
.asm-statebox.err{border-color:var(--warn-hair);background:var(--warn-soft)}
.asm-statebox.err .txt{color:var(--wait)}
.asm-retry-btn{margin-left:auto;flex:none;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--wait);background:#fff;border:1px solid var(--warn-hair);border-radius:5px;padding:.5rem .8rem;cursor:pointer}
.asm-retry-btn:hover{background:var(--warn);color:#fff}
.asm-spinner{width:1.15rem;height:1.15rem;flex:none;border-radius:50%;border:2px solid var(--line-strong);border-top-color:var(--accent);animation:asm-spin .8s linear infinite}
@keyframes asm-spin{to{transform:rotate(360deg)}}

/* pre-open hero + big countdown */
.asm-hero{margin:1.4rem 0 1.2rem;padding:1.7rem 1.6rem 1.6rem;border:1px solid var(--line-strong);border-radius:10px;background:linear-gradient(160deg,#fff 0%,var(--accent-soft) 165%);text-align:center}
.asm-hero .hero-label{font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:.7rem}
.asm-hero .hero-clock{font-family:var(--mono);font-weight:600;font-size:clamp(1.7rem,7vw,2.9rem);line-height:1.02;color:var(--accent-strong);letter-spacing:.01em;font-variant-numeric:tabular-nums}
.asm-hero .hero-when{margin-top:.95rem;font-family:var(--serif);font-size:1.05rem;color:var(--ink);line-height:1.45}
.asm-hero .hero-when b{color:var(--accent-strong)}
.asm-hero .hero-sub{margin-top:.5rem;font-size:.86rem;color:var(--ink-faint);line-height:1.5}

/* instructor preview control */
.asm-preview{margin-top:1.4rem}
.asm-preview-toggle{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);background:none;border:none;cursor:pointer;padding:.2rem 0;border-bottom:1px dotted var(--ink-faint)}
.asm-preview-toggle:hover,.asm-preview-toggle:focus-visible{color:var(--accent);border-bottom-color:var(--accent)}
.asm-preview-panel{margin-top:.7rem;display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.asm-preview-panel input{min-height:2.4rem;padding:0 .7rem;border:1px solid var(--line-strong);border-radius:5px;background:#fff;color:var(--ink);font-family:var(--sans);font-size:.9rem;outline:none;flex:1 1 180px;min-width:0}
.asm-preview-panel input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.asm-preview-panel button.go{min-height:2.4rem;padding:0 1rem;border:1px solid var(--accent);border-radius:5px;background:var(--accent);color:#fff;font:600 .82rem/1 var(--sans);cursor:pointer}
.asm-preview-panel button.go:hover{background:var(--accent-strong)}
.asm-preview-msg{flex-basis:100%;font-size:.82rem;color:var(--ink-faint);min-height:1rem}
.asm-preview-msg.err{color:var(--crimson)}
.asm-preview-msg.ok{color:var(--good)}

/* preview-mode banner (open state) */
.asm-preview-banner{display:none;align-items:center;gap:.7rem;margin:0 0 1.2rem;padding:.75rem 1rem;border:1px solid var(--warn);background:var(--warn-soft);border-radius:6px;color:var(--wait);font-size:.9rem;line-height:1.45}
.asm-preview-banner.show{display:flex}
.asm-preview-banner .tag{flex:none;font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;background:var(--warn);color:#fff;padding:.24rem .5rem;border-radius:4px}

/* identify */
.asm-panel{border:1px solid var(--line-strong);border-radius:6px;padding:1.1rem 1.15rem;background:#fff;margin:.9rem 0}
.asm-field label{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:.4rem}
.asm-field input{width:100%;min-height:2.7rem;padding:0 .75rem;border:1px solid var(--line-strong);border-radius:5px;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:.98rem;outline:none;transition:border-color .15s,box-shadow .15s,background-color .15s}
.asm-field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:#fff}
.asm-status{margin-top:.85rem;padding:.65rem .8rem;border-radius:5px;font-size:.88rem;line-height:1.5;display:none}
.asm-status.show{display:block}
.asm-status.ok{background:var(--good-soft);color:var(--ok);border:1px solid var(--good-hair)}
.asm-status.err{background:var(--crimson-soft);color:var(--err);border:1px solid var(--crimson-hair)}
.asm-status.wait{background:var(--warn-soft);color:var(--wait);border:1px solid var(--warn-hair)}

/* countdown to close */
.asm-countdown{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;margin:1rem 0;padding:.85rem 1rem;border:1px solid var(--line-strong);border-radius:6px;background:var(--paper)}
.asm-countdown .label{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}
.asm-countdown .clock{font-family:var(--mono);font-size:1.25rem;font-weight:600;color:var(--accent-strong);letter-spacing:.02em;font-variant-numeric:tabular-nums}
.asm-countdown .note{font-size:.78rem;color:var(--ink-faint);flex-basis:100%}
[data-course="computationalfinance"] .asm-countdown.past .clock{color:var(--crimson)}

/* questions */
.fa-q{border:1px solid var(--line-strong);border-radius:8px;padding:1.1rem 1.2rem;margin:.9rem 0;background:#fff}
.fa-q-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.6rem}
.fa-q-headL{display:flex;align-items:center;gap:.6rem;min-width:0}
.fa-q-n{display:inline-grid;place-items:center;width:1.7rem;height:1.7rem;flex:none;border-radius:50%;background:var(--accent);color:#fff;font-family:var(--mono);font-size:.8rem;font-weight:600}
.fa-qtype{font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);border:1px solid var(--accent-hair);border-radius:4px;padding:.18rem .45rem;white-space:nowrap}
.fa-q-marks{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap}
.fa-q-stem{font-family:var(--sans);font-size:1rem;line-height:1.6;color:var(--ink);margin-bottom:.85rem}
/* anti-cheat: question text cannot be selected or copied */
.fa-q-stem,.fa-opt-text,.fa-blank-hint,.fa-qtype,.fa-q-marks{-webkit-user-select:none;-moz-user-select:none;user-select:none}
.fa-opts{display:grid;gap:.5rem}
.fa-opt{display:flex;align-items:flex-start;gap:.7rem;padding:.7rem .85rem;border:1px solid var(--line-strong);border-radius:6px;background:var(--paper);cursor:pointer;transition:border-color .12s,background-color .12s}
.fa-opt:hover{border-color:var(--accent-hair);background:#fff}
.fa-opt input{margin-top:.15rem;flex:none;width:1.05rem;height:1.05rem;accent-color:var(--accent)}
.fa-opt:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.fa-opt-text{font-size:.95rem;line-height:1.5;color:var(--ink)}
.fa-blank-wrap{display:flex;flex-direction:column;gap:.35rem}
.fa-blank{width:100%;max-width:440px;min-height:2.7rem;padding:0 .8rem;border:1px solid var(--line-strong);border-radius:5px;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:1rem;outline:none;transition:border-color .15s,box-shadow .15s,background-color .15s}
.fa-blank:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:#fff}
.fa-blank-hint{font-family:var(--mono);font-size:.66rem;letter-spacing:.03em;color:var(--ink-faint)}
.fa-text{width:100%;min-height:9rem;padding:.75rem .85rem;border:1px solid var(--line-strong);border-radius:6px;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:.98rem;line-height:1.6;outline:none;resize:vertical}
.fa-text:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:#fff}
.fa-wordcount{margin-top:.35rem;text-align:right;font-family:var(--mono);font-size:.68rem;color:var(--ink-faint)}
.fa-wordcount.under,.fa-wordcount.over{color:var(--wait)}
.fa-wordcount.ok{color:var(--good)}

/* deadline-closed notice */
.asm-closed-notice{display:none;margin:.6rem 0;padding:1.1rem 1.2rem;border:1px solid var(--warn-hair);background:var(--warn-soft);border-radius:6px}
.asm-closed-notice.show{display:block}
.asm-closed-notice .title{font-family:var(--serif);font-weight:700;font-size:1.1rem;color:var(--wait);margin-bottom:.5rem}
.asm-closed-notice p{font-size:.9rem;color:var(--wait);line-height:1.6;margin-bottom:.55rem}
.asm-closed-notice code{font-family:var(--mono);font-size:.82rem;color:var(--wait);background:#fff;padding:.15rem .4rem;border-radius:3px}

/* submit */
.asm-actions{margin-top:1.3rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.asm-submit-btn{min-height:2.9rem;padding:0 1.5rem;border:1px solid var(--accent);border-radius:6px;background:var(--accent);color:#fff;font:600 .95rem/1 var(--sans);cursor:pointer;transition:background-color .15s,transform .15s,box-shadow .15s}
.asm-submit-btn:hover:not(:disabled){background:var(--accent-strong);transform:translateY(-1px);box-shadow:0 10px 20px var(--accent-shadow)}
.asm-submit-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.asm-submit-btn:disabled{opacity:.45;cursor:not-allowed}
.asm-spinner-row{display:none;align-items:center;gap:.6rem;font-size:.88rem;color:var(--ink-soft)}
.asm-spinner-row.show{display:flex}
.asm-result-panel{display:none;margin-top:1.3rem;padding:1.15rem 1.25rem;border-radius:6px}
.asm-result-panel.show{display:block}
.asm-success{border:1px solid var(--accent-hair);background:var(--good-soft)}
.asm-success .title{font-family:var(--serif);font-weight:700;font-size:1.15rem;color:var(--accent-strong);margin-bottom:.7rem}
.asm-success dl{display:grid;grid-template-columns:auto 1fr;gap:.35rem 1rem;font-size:.86rem}
.asm-success dt{font-family:var(--mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-strong);white-space:nowrap;padding-top:.1rem}
.asm-success dd{font-family:var(--mono);font-size:.82rem;color:var(--accent-strong);word-break:break-all}
.asm-success .authoritative{margin-top:.9rem;padding-top:.8rem;border-top:1px dashed var(--accent-hair);font-size:.88rem;color:var(--accent-strong);font-weight:600}
.asm-fallback{border:1px solid var(--crimson-hair);background:var(--crimson-soft)}
.asm-fallback .title{font-family:var(--serif);font-weight:700;font-size:1.1rem;color:var(--err);margin-bottom:.6rem}
.asm-fallback p{font-size:.9rem;color:var(--err);line-height:1.6;margin-bottom:.6rem}
.asm-fallback code{display:block;padding:.6rem .7rem;border-radius:4px;background:#fff;font-family:var(--mono);font-size:.82rem;color:var(--err);word-break:break-all;margin:.4rem 0}
.asm-hp{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;opacity:0;overflow:hidden}

@media (max-width:620px){
  .asm-actions{flex-direction:column;align-items:stretch}
  .asm-submit-btn{width:100%}
}


/* ===========================================================================
   2. MOVED — register/index.html
   =========================================================================== */

/* Register-specific form styling only. Everything else (chrome, tokens, buttons,
   notice, index-nav, footer) comes from /css/course-ml.css and dl.css so the
   page reads as one system with the rest of the course site. */

#reg-config-warning{display:none;margin:1.1rem 0;padding:.8rem 1rem;border:1px solid var(--warn);
  background:var(--warn-soft);color:var(--wait);border-radius:5px;font-size:.86rem;line-height:1.5;
  font-family:var(--mono)}
#reg-config-warning b{color:var(--wait)}

.reg-panel{border:1px solid var(--line-strong);border-radius:8px;padding:1.3rem 1.35rem;background:#fff;
  margin:1.4rem 0;box-shadow:0 1px 2px rgba(26,26,23,.04)}
.reg-field-row{display:grid;grid-template-columns:1fr 1fr;gap:.95rem}
@media (max-width:600px){.reg-field-row{grid-template-columns:1fr}}
.reg-field{margin-bottom:.95rem}
.reg-field:last-of-type{margin-bottom:0}
.reg-field label{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-faint);margin-bottom:.4rem}
.reg-field input{width:100%;min-height:2.7rem;padding:0 .75rem;border:1px solid var(--line-strong);
  border-radius:5px;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:.98rem;
  outline:none;transition:border-color .15s,box-shadow .15s,background-color .15s}
.reg-field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:#fff}
.reg-field .hint{margin-top:.35rem;font-size:.78rem;color:var(--ink-faint);line-height:1.45}

.reg-actions{margin-top:1.2rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.reg-submit-btn{min-height:2.9rem;padding:0 1.5rem;border:1px solid var(--accent);border-radius:6px;
  background:var(--accent);color:#fff;font:600 .95rem/1 var(--sans);cursor:pointer;
  display:inline-flex;align-items:center;gap:.5rem;
  transition:background-color .15s,transform .15s,box-shadow .15s}
.reg-submit-btn:hover:not(:disabled){background:var(--accent-strong);transform:translateY(-1px);
  box-shadow:0 10px 20px var(--accent-shadow)}
.reg-submit-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.reg-submit-btn:disabled{opacity:.5;cursor:not-allowed}
.reg-spinner-row{display:none;align-items:center;gap:.6rem;font-size:.88rem;color:var(--ink-soft)}
.reg-spinner-row.show{display:flex}
.reg-spinner{width:1.15rem;height:1.15rem;border-radius:50%;border:2px solid var(--line-strong);
  border-top-color:var(--accent);animation:reg-spin .8s linear infinite}
@keyframes reg-spin{to{transform:rotate(360deg)}}

.reg-status{margin-top:.9rem;padding:.65rem .8rem;border-radius:5px;font-size:.88rem;line-height:1.5;display:none}
.reg-status.show{display:block}
.reg-status.err{background:var(--crimson-soft);color:var(--err);border:1px solid var(--crimson-hair)}

/* success result: the big minted ID */
.reg-result{display:none;margin:1.4rem 0;padding:1.4rem 1.4rem 1.5rem;border-radius:8px;
  border:1px solid var(--good-hair);background:var(--good-soft)}
.reg-result.show{display:block}
.reg-result .r-label{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ok);margin-bottom:.5rem}
.reg-result .r-id{font-family:var(--mono);font-weight:600;font-size:clamp(1.8rem,7vw,2.6rem);
  letter-spacing:.04em;color:var(--ok);line-height:1;font-variant-numeric:tabular-nums;word-break:break-all}
.reg-result .r-msg{margin-top:.9rem;font-size:.94rem;line-height:1.6;color:var(--ok)}
.reg-result .r-msg b{color:var(--ok)}
.reg-result .r-existing{margin-top:.7rem;font-size:.86rem;color:var(--ok);line-height:1.55}
.reg-result .r-next{margin-top:1rem;padding-top:.9rem;border-top:1px dashed var(--good-hair);
  font-size:.88rem;line-height:1.6;color:var(--ok)}
.reg-result .r-next a{color:var(--accent-strong);font-weight:600;border-bottom:1px solid var(--accent-hair)}

/* fallback if the network fails twice */
.reg-fallback{display:none;margin:1.2rem 0;padding:1.1rem 1.2rem;border-radius:8px;
  border:1px solid var(--crimson-hair);background:var(--crimson-soft)}
.reg-fallback.show{display:block}
.reg-fallback .title{font-family:var(--serif);font-weight:700;font-size:1.05rem;color:var(--err);margin-bottom:.5rem}
.reg-fallback p{font-size:.9rem;color:var(--err);line-height:1.6;margin-bottom:.5rem}
.reg-fallback code{font-family:var(--mono);font-size:.82rem;color:var(--err);background:#fff;
  padding:.15rem .4rem;border-radius:3px}

/* honeypot: hidden from real users, left for bots */
.reg-hp{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;opacity:0;overflow:hidden}


/* ===========================================================================
   3. MOVED — results/index.html
   =========================================================================== */

/* ---- lookup panel ---- */
.rs-panel{border:1px solid var(--line-strong);border-radius:8px;padding:1.25rem 1.3rem;background:#fff;
  margin:1.3rem 0;box-shadow:0 1px 2px rgba(26,26,23,.04)}
.rs-row{display:flex;gap:.8rem;align-items:flex-end;flex-wrap:wrap}
.rs-field{flex:1 1 260px;min-width:0}
.rs-field label{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-faint);margin-bottom:.4rem}
.rs-field input{width:100%;min-height:2.8rem;padding:0 .8rem;border:1px solid var(--line-strong);
  border-radius:5px;background:var(--paper);color:var(--ink);font-family:var(--mono);
  font-size:1.02rem;letter-spacing:.06em;text-transform:uppercase;outline:none;
  transition:border-color .15s,box-shadow .15s,background-color .15s}
.rs-field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:#fff}
.rs-btn{min-height:2.8rem;padding:0 1.4rem;border:1px solid var(--accent);border-radius:6px;
  background:var(--accent);color:#fff;font:600 .95rem/1 var(--sans);cursor:pointer;
  display:inline-flex;align-items:center;gap:.5rem;transition:background-color .15s,transform .15s}
.rs-btn:hover:not(:disabled){background:var(--accent-strong);transform:translateY(-1px)}
.rs-btn:disabled{opacity:.5;cursor:not-allowed}
.rs-hint{margin-top:.55rem;font-size:.8rem;color:var(--ink-faint);line-height:1.5}

.rs-msg{margin:1rem 0;padding:.75rem .9rem;border-radius:5px;font-size:.9rem;line-height:1.55}
.rs-msg.err{background:var(--crimson-soft);color:var(--err);border:1px solid var(--crimson-hair)}
.rs-msg.wait{background:var(--warn-soft);color:var(--wait);border:1px solid var(--warn-hair)}
.rs-msg.none{background:var(--paper);color:var(--ink-soft);border:1px solid var(--line-strong)}

/* ---- summary band ---- */
.rs-summary{display:grid;grid-template-columns:auto 1fr;gap:1.4rem;align-items:center;
  margin:1.4rem 0;padding:1.2rem 1.3rem;border:1px solid var(--accent-hair);
  border-radius:8px;background:var(--accent-soft)}
.rs-summary .who{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent-strong);margin-bottom:.35rem}
.rs-summary .name{font-family:var(--serif);font-size:1.35rem;font-weight:700;color:var(--ink);line-height:1.2}
.rs-summary .sub{margin-top:.45rem;font-size:.88rem;color:var(--ink-soft);line-height:1.5}
.rs-donut{width:118px;height:118px;flex:none}
@media (max-width:560px){
  .rs-summary{grid-template-columns:1fr;justify-items:center;text-align:center}
}

/* ---- the list of sittings ---- */
.rs-list{display:grid;gap:.55rem;margin:1.2rem 0}
.rs-item{border:1px solid var(--line-strong);border-radius:7px;background:#fff;overflow:hidden}
.rs-item.awaiting{background:var(--paper);opacity:.72}
.rs-head{display:grid;grid-template-columns:auto 1fr auto auto;gap:.9rem;align-items:center;
  width:100%;padding:.85rem 1rem;background:none;border:0;cursor:pointer;text-align:left;
  font-family:inherit;transition:background-color .12s}
.rs-head:hover{background:var(--accent-soft)}
.rs-head:disabled{cursor:default}
.rs-head:disabled:hover{background:none}
.rs-n{display:inline-grid;place-items:center;width:1.9rem;height:1.9rem;flex:none;border-radius:50%;
  background:var(--accent);color:#fff;font-family:var(--mono);font-size:.72rem;font-weight:600}
.rs-item.awaiting .rs-n{background:var(--line-strong);color:var(--ink-faint)}
.rs-item.exam .rs-n{border-radius:6px}
.rs-t{min-width:0}
.rs-t .l{font-weight:600;font-size:.98rem;color:var(--ink);line-height:1.3}
.rs-t .d{font-size:.8rem;color:var(--ink-faint);line-height:1.4;margin-top:.15rem}
.rs-mark{font-family:var(--mono);font-size:1.05rem;font-weight:600;color:var(--accent-strong);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.rs-mark .pc{display:block;font-size:.68rem;font-weight:400;color:var(--ink-faint);text-align:right}
.rs-await{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-faint);white-space:nowrap}
.rs-chev{color:var(--ink-faint);transition:transform .18s;flex:none}
.rs-item.open .rs-chev{transform:rotate(90deg)}

.rs-body{display:none;padding:0 1rem 1.1rem;border-top:1px solid var(--line)}
.rs-item.open .rs-body{display:block}
.rs-secs{display:grid;gap:.5rem;margin:1rem 0}
.rs-sec{display:grid;grid-template-columns:minmax(90px,150px) 1fr auto;gap:.8rem;align-items:center}
.rs-sec .l{font-size:.86rem;color:var(--ink-soft)}
.rs-sec .tr{height:.5rem;border-radius:3px;background:var(--paper-2);overflow:hidden}
.rs-sec .fl{display:block;height:100%;background:var(--accent);border-radius:3px}
.rs-sec .v{font-family:var(--mono);font-size:.82rem;color:var(--ink);font-variant-numeric:tabular-nums;
  white-space:nowrap}
.rs-sec.low .fl{background:var(--warn)}

.rs-qtable{width:100%;border-collapse:collapse;margin-top:.9rem;font-size:.86rem}
.rs-qtable th{text-align:left;font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-faint);font-weight:500;padding:.4rem .5rem;
  border-bottom:1px solid var(--line-strong)}
.rs-qtable td{padding:.45rem .5rem;border-bottom:1px solid var(--line);vertical-align:top;color:var(--ink)}
.rs-qtable td.num{font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.rs-qtable tr.miss td{color:var(--ink-soft)}
.rs-tick{color:var(--good)}
.rs-cross{color:var(--crimson)}
.rs-tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.rs-comment{margin-top:1rem;padding:.85rem 1rem;border-left:3px solid var(--accent);
  background:var(--paper);border-radius:0 5px 5px 0;font-size:.9rem;line-height:1.6;color:var(--ink-soft)}
.rs-spin{width:1.1rem;height:1.1rem;border-radius:50%;border:2px solid var(--line-strong);
  border-top-color:var(--accent);animation:rs-spin .8s linear infinite;display:inline-block;
  vertical-align:-.2rem;margin-right:.5rem}
@keyframes rs-spin{to{transform:rotate(360deg)}}


/* ===========================================================================
   4. GATE PRIMITIVES — one panel, one field, one button, one status
   Scoped, so these win over the moved rules above on specificity as well as
   on source order. Class names are the existing ones; nothing is renamed.
   =========================================================================== */

/* --- one panel ------------------------------------------------------------ */
[data-course="computationalfinance"] :is(.reg-panel,.rs-panel,.asm-panel,.panel){border:1px solid var(--line-strong);border-radius:var(--r);background:#fff;padding:1.15rem 1.2rem;margin:1.3rem 0;box-shadow:0 1px 2px rgba(26,26,23,.04)}

/* --- one field: white on white, separated by the hairline; the site's own
   grammar, and focus is then the only thing that adds colour ---------------- */
[data-course="computationalfinance"] :is(.reg-field,.rs-field,.asm-field){margin-bottom:.95rem}
[data-course="computationalfinance"] :is(.reg-field,.rs-field,.asm-field):last-child{margin-bottom:0}
[data-course="computationalfinance"] :is(.reg-field,.rs-field,.asm-field) label{display:block;margin-bottom:.4rem;font-family:var(--mono);font-size:var(--lbl-lg);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
[data-course="computationalfinance"] :is(.reg-field,.rs-field,.asm-field) :is(input,textarea){width:100%;min-height:2.75rem;padding:.6rem .8rem;border:1px solid var(--line-strong);border-radius:var(--r);background:#fff;color:var(--ink);font-family:var(--sans);font-size:1rem;outline:none;transition:border-color .15s,box-shadow .15s}
[data-course="computationalfinance"] :is(.reg-field,.rs-field,.asm-field) input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
/* The rule above sets outline:none on these inputs at (0,2,1), which beat the
   site-wide :where() focus ring and left the student-ID field with no visible
   focus for a keyboard user. Restate the ring at matching specificity. */
[data-course="computationalfinance"] :is(.reg-field,.rs-field,.asm-field) :is(input,textarea):focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px}
/* A control's boundary must clear 3:1 against its ground (WCAG 1.4.11);
   --line-strong composites to #d1d1d0 on white, which is 1.53:1. */
[data-course="computationalfinance"] :is(.reg-field,.rs-field,.asm-field) :is(input,textarea){border-color:#8c8880}
[data-course="computationalfinance"] :is(.reg-field .hint,.rs-hint,.asm-field .hint){margin-top:.35rem;font-size:.82rem;line-height:1.5;color:var(--ink-soft)}

/* The student ID is a code everywhere it is typed or shown. */
[data-course="computationalfinance"] :is(#rs-id,#fa-id-input,#fa-preview-id){font-family:var(--mono);font-size:1.02rem;letter-spacing:.08em;text-transform:uppercase;font-variant-numeric:tabular-nums}
[data-course="computationalfinance"] :is(#rs-id,#fa-id-input,#fa-preview-id)::placeholder{text-transform:none;letter-spacing:.04em;color:var(--ink-faint)}

/* --- one button: colour change only, never a lift, always 44px of target --- */
/* Keep every :is() list here to SINGLE classes. :is() takes the specificity of
   its most specific argument, so one compound like `.asm-preview-panel button.go`
   inside this list raised the whole base rule to (0,3,1) and beat the accent rule
   below it at (0,2,0) - which left both submit buttons rendering white. A comma
   list scores each selector separately, so the compound goes on its own line. */
[data-course="computationalfinance"] :is(.btn,.reg-submit-btn,.rs-btn,.asm-submit-btn,.asm-retry-btn,.ri-go),
[data-course="computationalfinance"] .asm-preview-panel button.go{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:2.75rem;padding:0 1.25rem;border:1px solid var(--line-strong);border-radius:var(--r);background:#fff;color:var(--ink);font-family:var(--sans);font-weight:600;font-size:.92rem;line-height:1;cursor:pointer;text-decoration:none;transition:background-color .15s ease,border-color .15s ease,color .15s ease}
[data-course="computationalfinance"] :is(.btn,.reg-submit-btn,.rs-btn,.asm-submit-btn,.ri-go) i{font-size:.85rem}
[data-course="computationalfinance"] :is(.btn--primary,.reg-submit-btn,.rs-btn,.asm-submit-btn,.ri-go){background:var(--accent);border-color:var(--accent);color:#fff}
[data-course="computationalfinance"] :is(.btn--primary,.reg-submit-btn,.rs-btn,.asm-submit-btn,.ri-go):hover:not(:disabled){background:var(--accent-strong);border-color:var(--accent-strong);transform:none;box-shadow:none}
[data-course="computationalfinance"] :is(.btn--primary,.reg-submit-btn,.rs-btn,.asm-submit-btn,.ri-go) i{color:#fff}
[data-course="computationalfinance"] :is(.btn--quiet,.asm-retry-btn):hover:not(:disabled){background:var(--paper);border-color:var(--accent-hair);color:var(--accent-strong)}
[data-course="computationalfinance"] .btn--sm,
[data-course="computationalfinance"] .asm-preview-panel button.go{min-height:2.25rem;padding:0 .9rem;font-size:.85rem}
[data-course="computationalfinance"] :is(.btn,.reg-submit-btn,.rs-btn,.asm-submit-btn,.asm-retry-btn,.ri-go):disabled{opacity:.45;cursor:not-allowed}

/* A button is not body copy: the href-driven arrow must not render inside one. */
[data-course="computationalfinance"] :is(.btn,.ri-go,.reg-submit-btn,.rs-btn,.asm-submit-btn) a[href]::after,
[data-course="computationalfinance"] a:is(.btn,.ri-go)::after{content:none}

/* --- one status system ---------------------------------------------------- */
[data-course="computationalfinance"] :is(.reg-status,.rs-msg,.asm-status){border-radius:var(--r);font-size:.9rem;line-height:1.5}
[data-course="computationalfinance"] :is(.rs-msg.wait,.asm-status.wait){border:1px solid var(--warn-hair);color:var(--ink-soft)}
[data-course="computationalfinance"] :is(.reg-status.err,.rs-msg.err,.asm-status.err){border:1px solid var(--crimson-hair);color:var(--err)}
[data-course="computationalfinance"] :is(.rs-msg.ok,.asm-status.ok){border:1px solid var(--good-hair);color:var(--ok)}

/* The minted ID is an event in the course's own colour, not an off-brand green. */
[data-course="computationalfinance"] .reg-result{background:var(--accent-soft);border:1px solid var(--accent-hair);border-radius:var(--r)}
[data-course="computationalfinance"] .reg-result :is(.r-label,.r-id){color:var(--accent-strong)}
[data-course="computationalfinance"] .reg-result :is(.r-msg,.r-existing,.r-next){color:var(--ink-soft)}
[data-course="computationalfinance"] .r-id{font-family:var(--mono);letter-spacing:.06em}
[data-course="computationalfinance"] .asm-success{background:var(--accent-soft);border:1px solid var(--accent-hair);border-radius:var(--r)}

/* The reason line under the registration fallback; replaces an inline style. */
[data-course="computationalfinance"] .reg-fallback .why{font-size:.78rem;color:var(--err)}


/* ===========================================================================
   5. THE SITTING PAGE HEAD — .asm-hero, .gate-facts, .asm-countdown
   Quiz and exam only, and both load this file, so the component lives here
   rather than in course.css.
   =========================================================================== */

[data-course="computationalfinance"] .asm-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.2rem;align-items:center;margin:1.4rem 0 1.1rem;padding:1.35rem 1.4rem;border:1px solid var(--line-strong);border-left:3px solid var(--accent);border-radius:0 var(--r) var(--r) 0;background:#fff;text-align:left}
[data-course="computationalfinance"] .asm-hero .gh-label{display:block;margin-bottom:.35rem;font-family:var(--mono);font-size:var(--lbl-md);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
[data-course="computationalfinance"] .asm-hero .hero-clock{font-family:var(--mono);font-size:clamp(1.5rem,5vw,2.2rem);font-variant-numeric:tabular-nums;color:var(--accent-strong);justify-self:end}
[data-course="computationalfinance"] .asm-hero.is-unscheduled .hero-clock{display:none}
@media (max-width:620px){[data-course="computationalfinance"] .asm-hero{grid-template-columns:minmax(0,1fr)}[data-course="computationalfinance"] .asm-hero .hero-clock{justify-self:start}}

/* The three facts that bind, in the .course-meta idiom. */
[data-course="computationalfinance"] .gate-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:1.1rem 0 1.3rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
[data-course="computationalfinance"] .gate-facts > div{min-width:0;padding:.85rem .9rem;border-left:1px solid var(--line)}
[data-course="computationalfinance"] .gate-facts > div:first-child{border-left:0;padding-left:0}
[data-course="computationalfinance"] .gate-facts .k{display:block;margin-bottom:.28rem;font-family:var(--mono);font-size:var(--lbl-md);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
[data-course="computationalfinance"] .gate-facts .v{font-family:var(--serif);font-size:1.02rem;color:var(--ink)}
@media (max-width:560px){[data-course="computationalfinance"] .gate-facts{grid-template-columns:minmax(0,1fr)}[data-course="computationalfinance"] .gate-facts > div{border-left:0;border-top:1px solid var(--line);padding-left:0}[data-course="computationalfinance"] .gate-facts > div:first-child{border-top:0}}

/* A sitting closing is the normal end of every sitting, not an alarm. --warn
   is kept for #fa-closed-notice alone, where a deadline passed mid-sitting. */
[data-course="computationalfinance"] #fa-closed .asm-closed-notice{background:var(--paper);border:1px solid var(--line-strong);border-left:3px solid var(--line-strong);border-radius:0 var(--r) var(--r) 0}
[data-course="computationalfinance"] #fa-closed .asm-closed-notice p{color:var(--ink-soft)}

/* The clock stays on screen during a timed paper, with a progress count. */
/* Not sticky: an ancestor .card sets overflow:hidden in the shared sheet,
   which disables position:sticky for everything inside it. */
[data-course="computationalfinance"] .asm-countdown{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;padding:.7rem .95rem;border:1px solid var(--line-strong);border-radius:var(--r);background:rgba(255,255,255,.94);backdrop-filter:saturate(140%) blur(8px)}
[data-course="computationalfinance"] .asm-countdown .clock{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:1.1rem;color:var(--accent-strong)}
[data-course="computationalfinance"] .asm-countdown .prog{margin-left:auto;font-family:var(--mono);font-size:var(--lbl-md);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}