/* Public student application + digital ID card. Keep this route independent
   from the authenticated dashboard theme so the shareable link feels like a
   polished welcome page on both light and dark system settings. */
body.registration-page { background:#edf5ff; color:#0e1b47; }
body.registration-page #app { display:block; min-height:100svh; }
body.registration-page #app-header { display:none !important; }
body.registration-page #app-main { width:100% !important; max-width:none !important; padding:0 !important; margin:0 !important; overflow:visible !important; }

.student-registration-shell {
  --sr-ink:#0d1947;
  --sr-muted:#657492;
  --sr-blue:#3158f5;
  --sr-purple:#6554e8;
  --sr-teal:#16a99d;
  --sr-coral:#f17e73;
  min-height:100svh;
  padding:clamp(22px,3.4vw,44px) clamp(16px,5vw,76px) 24px;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at 3% 92%, rgba(193,222,255,.8), transparent 31%),
    radial-gradient(circle at 96% 7%, rgba(201,242,237,.82), transparent 27%),
    linear-gradient(135deg,#f3f8ff 0%,#edf5ff 52%,#eefafa 100%);
  font-family:"Sukhumvit Set","Plus Jakarta Sans","Noto Sans Thai",system-ui,sans-serif;
}

.student-registration-shell::before,
.student-registration-shell::after {
  content:"";
  position:absolute;
  z-index:-1;
  pointer-events:none;
  border:1px dashed rgba(91,193,193,.38);
  border-radius:50%;
  opacity:.7;
}
.student-registration-shell::before { width:380px; height:220px; right:-170px; top:102px; transform:rotate(-18deg); }
.student-registration-shell::after { width:310px; height:150px; left:-170px; bottom:52px; transform:rotate(17deg); }

.sr-registration-content { width:min(1240px,100%); margin:0 auto; }
.sr-topbar { display:flex; align-items:center; justify-content:space-between; gap:26px; }
.sr-masthead { display:flex; align-items:center; gap:clamp(18px,3.4vw,48px); min-width:0; }
.sr-brand { display:flex; flex:0 0 auto; flex-direction:column; align-items:center; width:max-content; color:var(--sr-ink); line-height:1; position:relative; z-index:2; }
.sr-brand img { display:block; width:clamp(154px,16vw,198px); height:auto; object-fit:contain; }
.sr-brand>span { margin-top:1px; color:#26386e; font-size:clamp(8px,.82vw,11px); font-weight:850; letter-spacing:.16em; line-height:1; }
.sr-intro-heading { min-width:0; }
.sr-eyebrow,.sr-card-kicker { display:block; color:#6c7da8; font-size:.64rem; font-weight:900; letter-spacing:.17em; line-height:1.3; }
.sr-intro-heading h1 { color:var(--sr-ink); font-size:clamp(34px,4vw,56px); font-weight:850; line-height:1.04; letter-spacing:-2px; margin:9px 0 0; }
.sr-intro-heading h1 em,.sr-success-copy h1 em { color:var(--sr-purple); font-style:normal; }
.sr-topbar-status { display:flex; align-items:center; gap:10px; flex:0 0 auto; padding:10px 14px; border:1px solid rgba(114,146,193,.18); border-radius:14px; background:rgba(255,255,255,.58); box-shadow:0 8px 20px rgba(55,89,143,.05); }
.sr-live-dot { width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:#16b89d; box-shadow:0 0 0 5px rgba(22,184,157,.12); }
.sr-topbar-status div { display:flex; flex-direction:column; gap:2px; }
.sr-topbar-status strong { color:#173467; font-size:.68rem; font-weight:900; }
.sr-topbar-status small { color:#75839d; font-size:.6rem; white-space:nowrap; }

.sr-layout { width:100%; margin:46px auto 0; display:grid; grid-template-columns:minmax(300px,.84fr) minmax(560px,1.16fr); gap:clamp(30px,5.2vw,72px); align-items:start; }
.sr-intro { min-width:0; padding:28px 0 20px; }
.sr-intro-kicker { display:inline-flex; align-items:center; gap:8px; color:#5b6fa2; font-size:.7rem; font-weight:900; letter-spacing:.05em; }
.sr-intro-kicker span { display:grid; place-items:center; width:24px; height:24px; border-radius:8px; background:#e3e8ff; color:#5e50dc; font-size:.9rem; box-shadow:0 6px 12px rgba(91,80,220,.1); }
.sr-intro-details { margin-top:20px; }
.sr-intro-details>p { max-width:440px; color:#405275; font-size:clamp(17px,1.45vw,20px); line-height:1.62; margin:0; }
.sr-intro-pills { display:flex; flex-wrap:wrap; gap:7px; margin-top:22px; }
.sr-intro-pills span { display:inline-flex; align-items:center; gap:6px; padding:7px 10px; border:1px solid rgba(110,142,191,.2); border-radius:999px; background:rgba(255,255,255,.62); color:#4c5d80; font-size:.64rem; font-weight:750; box-shadow:0 7px 18px rgba(47,91,151,.05); }
.sr-intro-pills b { display:grid; place-items:center; width:19px; height:19px; border-radius:50%; background:#e1e7ff; color:#6155dc; font-size:.55rem; }

.sr-intro-benefits { display:grid; gap:10px; margin-top:27px; }
.sr-benefit { display:flex; align-items:center; gap:11px; padding:12px 13px; border:1px solid rgba(126,156,201,.16); border-radius:15px; background:rgba(255,255,255,.48); box-shadow:0 9px 22px rgba(47,91,151,.04); }
.sr-benefit-icon { display:grid; place-items:center; width:32px; height:32px; flex:0 0 32px; border-radius:10px; background:#e5e9ff; color:#5b4edb; font-size:1.05rem; font-weight:900; }
.sr-benefit-icon.is-teal { background:#dff7f2; color:#089889; }
.sr-benefit-icon.is-coral { background:#fff0e8; color:#e5725e; }
.sr-benefit div { min-width:0; display:flex; flex-direction:column; gap:3px; }
.sr-benefit strong { color:#172c58; font-size:.75rem; font-weight:900; }
.sr-benefit small { color:#71809c; font-size:.64rem; line-height:1.4; }
.sr-intro-callout { display:flex; align-items:flex-start; gap:10px; max-width:440px; margin-top:19px; padding:12px 13px; border:1px solid rgba(22,169,157,.18); border-radius:14px; background:rgba(235,253,249,.68); }
.sr-callout-mark { display:grid; place-items:center; width:22px; height:22px; flex:0 0 22px; border-radius:50%; background:#c9f2e9; color:#078d7e; font-size:.72rem; font-weight:900; }
.sr-intro-callout div { display:flex; flex-direction:column; gap:3px; }
.sr-intro-callout strong { color:#12675f; font-size:.72rem; font-weight:900; }
.sr-intro-callout small { color:#5b7d79; font-size:.63rem; line-height:1.45; }
.sr-intro-visual { position:relative; min-height:120px; overflow:hidden; margin-top:25px; padding:17px 19px; border-radius:20px; background:linear-gradient(123deg,#172456 0%,#3d369a 58%,#159b9b 100%); box-shadow:0 16px 30px rgba(39,48,129,.18); isolation:isolate; }
.sr-intro-visual::before { content:""; position:absolute; width:210px; height:90px; right:-54px; top:22px; border:1px solid rgba(255,255,255,.22); border-radius:50%; transform:rotate(-16deg); }
.sr-intro-visual::after { content:""; position:absolute; width:130px; height:54px; right:-20px; top:39px; border:1px solid rgba(255,255,255,.16); border-radius:50%; transform:rotate(-16deg); }
.sr-visual-copy { position:relative; z-index:2; display:flex; flex-direction:column; gap:6px; }
.sr-visual-copy span { color:#8fe9de; font-size:.52rem; font-weight:900; letter-spacing:.16em; }
.sr-visual-copy strong { color:#fff; font-size:1.03rem; line-height:1.15; letter-spacing:.01em; }
.sr-visual-orbit { position:absolute; right:16px; top:32px; width:132px; height:60px; border:1px dashed rgba(150,246,236,.58); border-radius:50%; transform:rotate(-16deg); }
.sr-visual-orbit::before { content:""; position:absolute; inset:11px 24px; border:1px solid rgba(255,255,255,.25); border-radius:50%; }
.sr-visual-orbit i,.sr-visual-orbit b,.sr-visual-orbit em { position:absolute; display:block; border-radius:50%; }
.sr-visual-orbit i { width:10px; height:10px; right:22px; top:1px; background:#ff9a91; box-shadow:0 0 0 6px rgba(255,154,145,.12); }
.sr-visual-orbit b { width:7px; height:7px; left:11px; bottom:8px; background:#68e1d1; }
.sr-visual-orbit em { width:5px; height:5px; right:54px; bottom:1px; background:#ffd26a; }
.sr-visual-score { position:absolute; z-index:2; right:17px; bottom:13px; color:rgba(255,255,255,.48); font-size:.45rem; font-weight:800; letter-spacing:.14em; line-height:1.35; text-align:right; }
.sr-visual-score strong { color:#fff; font-size:.61rem; }

.sr-card { width:100%; max-width:700px; justify-self:end; padding:clamp(25px,3vw,34px); border:1px solid rgba(255,255,255,.96); border-radius:25px; background:rgba(255,255,255,.94); box-shadow:0 24px 60px rgba(52,91,151,.13),0 5px 16px rgba(52,91,151,.05); backdrop-filter:blur(18px); }
.sr-card-heading { display:flex; align-items:flex-start; gap:13px; margin-bottom:17px; }
.sr-step-badge { display:grid; place-items:center; flex:0 0 40px; width:40px; height:40px; border-radius:12px; background:linear-gradient(145deg,#7568eb,#4f43bd); color:white; font-size:.72rem; font-weight:900; box-shadow:0 8px 19px rgba(89,75,210,.2); }
.sr-card-heading h2,.sr-result-heading h2 { color:var(--sr-ink); font-size:clamp(22px,2.1vw,28px); line-height:1.2; letter-spacing:-.7px; margin:4px 0 4px; }
.sr-card-heading p { color:var(--sr-muted); font-size:.72rem; line-height:1.5; margin:0; }
.sr-form-progress { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; margin-bottom:19px; padding:4px; border:1px solid #e7edf6; border-radius:11px; background:#f6f8fc; }
.sr-form-progress div { display:flex; align-items:center; justify-content:center; gap:5px; min-width:0; padding:6px 4px; border-radius:8px; color:#9aa6ba; font-size:.59rem; font-weight:800; white-space:nowrap; }
.sr-form-progress div.is-active { background:#fff; color:#4f46c7; box-shadow:0 3px 9px rgba(58,76,129,.08); }
.sr-form-progress span { display:grid; place-items:center; width:17px; height:17px; flex:0 0 17px; border-radius:50%; background:#e6ebf5; color:#8490a7; font-size:.5rem; }
.sr-form-progress .is-active span { background:#e1e6ff; color:#5044cf; }
.sr-avatar-row { display:flex; align-items:center; gap:13px; min-height:76px; padding:10px 12px; margin-bottom:20px; border:1px solid #e1e8f4; border-radius:16px; background:linear-gradient(135deg,#f7f9ff,#f0fbfa); }
.sr-avatar-picker { position:relative; display:grid; place-items:center; flex:0 0 64px; width:64px; height:64px; padding:0; overflow:hidden; border:3px solid #fff; border-radius:50%; background:#dfe8ff; color:#4e53bc; box-shadow:0 7px 16px rgba(38,75,145,.14); cursor:pointer; }
.sr-avatar-picker:focus-visible { outline:3px solid var(--sr-blue); outline-offset:3px; }
.sr-avatar-picker img,.student-id-card-avatar img { display:block; width:100%; height:100%; object-fit:cover; }
.sr-avatar-initials { display:grid; place-items:center; width:100%; height:100%; color:#4e53bc; font-size:1.08rem; font-weight:900; letter-spacing:.02em; }
.sr-avatar-camera { position:absolute; right:-1px; bottom:-1px; display:grid; place-items:center; width:22px; height:22px; border:2px solid #fff; border-radius:50%; background:var(--sr-blue); color:#fff; font-size:.9rem; line-height:1; }
.sr-avatar-copy { min-width:0; display:flex; flex:1; flex-direction:column; gap:3px; }
.sr-avatar-copy strong { color:var(--sr-ink); font-size:.8rem; }
.sr-avatar-copy strong small { margin-left:4px; color:#8793a9; font-size:.6rem; font-weight:700; }
.sr-avatar-copy span { color:#526384; font-size:.68rem; }
.sr-avatar-copy>small { color:#7d8aa3; font-size:.6rem; line-height:1.4; }
.sr-avatar-arrow { display:grid; place-items:center; width:24px; height:24px; flex:0 0 24px; border-radius:8px; background:#e2f4f2; color:#169b91; font-size:.9rem; font-weight:800; }
.sr-section-label { display:flex; align-items:baseline; gap:9px; margin:18px 0 10px; color:#3f527b; font-size:.67rem; font-weight:900; letter-spacing:.04em; }
.sr-section-label small { color:#99a5b8; font-size:.57rem; font-weight:700; letter-spacing:0; }
.sr-section-label i { align-self:center; flex:1; height:1px; background:#e7ebf2; }
.sr-field-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px 13px; }
.sr-field { min-width:0; display:flex; flex-direction:column; gap:6px; }
.sr-field.sr-span-2 { grid-column:span 2; }
.sr-field>span { color:#233458; font-size:.68rem; font-weight:850; }
.sr-field>span b,.sr-consent b { color:#e84f5e; }
.sr-field>span small { color:#8793a8; font-size:.59rem; font-weight:700; }
.sr-field input,.sr-field select { width:100%; min-width:0; height:43px; padding:0 12px; border:1.5px solid #d5deec; border-radius:9px; outline:0; background:#fff; color:#17264c; font:inherit; font-size:.75rem; transition:border-color .16s,box-shadow .16s,background .16s; }
.sr-field input::placeholder { color:#a8b2c4; }
.sr-field input:focus,.sr-field select:focus { border-color:var(--sr-blue); box-shadow:0 0 0 4px rgba(49,88,245,.1); }
.sr-field small { color:#8490a8; font-size:.58rem; line-height:1.35; }
.sr-password-wrap { position:relative; }
.sr-password-wrap input { padding-right:50px; }
.sr-password-wrap button { position:absolute; top:50%; right:7px; min-width:34px; height:28px; padding:0 5px; transform:translateY(-50%); border:0; border-radius:7px; background:#f0f4fa; color:#526384; font:inherit; font-size:.6rem; font-weight:800; cursor:pointer; }
.sr-password-wrap button:hover { background:#e4ebfa; color:var(--sr-blue); }
.sr-password-strength { min-height:11px; font-weight:700; }
.sr-password-strength.weak { color:#d04d5f; }.sr-password-strength.medium { color:#b37b14; }.sr-password-strength.strong { color:#098d7d; }
.sr-consent { display:flex; align-items:flex-start; gap:8px; margin:19px 0 14px; color:#66738c; font-size:.61rem; line-height:1.55; cursor:pointer; }
.sr-consent input { flex:0 0 auto; width:16px; height:16px; margin:1px 0 0; accent-color:var(--sr-blue); }
.sr-submit,.sr-secondary-button { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:48px; padding:0 16px; border:0; border-radius:10px; font:inherit; font-size:.76rem; font-weight:850; cursor:pointer; transition:transform .16s,box-shadow .16s,background .16s; }
.sr-submit { background:linear-gradient(135deg,#3158f5,#5c4cde); color:#fff; box-shadow:0 10px 21px rgba(60,76,208,.2); }
.sr-submit b { font-size:1.25rem; line-height:1; font-weight:500; }
.sr-submit:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 14px 27px rgba(60,76,208,.27); }
.sr-submit:disabled { cursor:wait; opacity:.65; }
.sr-form-status { margin:10px 0 0; padding:9px 11px; border-radius:9px; color:#5d6983; background:#eff4ff; font-size:.65rem; line-height:1.45; }
.sr-form-status.is-loading { color:#4f46b8; background:#eef0ff; }.sr-form-status.is-error { color:#bd2547; background:#fff0f3; }.sr-form-status.is-success { color:#08766a; background:#eafaf7; }
.sr-secure-note { display:flex; align-items:center; justify-content:center; gap:6px; margin:12px 0 0; color:#8591a8; font-size:.57rem; }
.sr-secure-note span { color:var(--sr-teal); }
.sr-footer { position:relative; z-index:1; margin-top:27px; color:#657392; text-align:center; font-size:.59rem; letter-spacing:.04em; }
.sr-footer span { padding:0 7px; color:#f28b61; }

/* Success + ID card */
.sr-success-shell { min-height:100svh; }
.sr-success-shell>.sr-brand { margin:0 auto; }
.sr-success-shell>.sr-brand img { width:230px; }
.sr-success-layout { width:min(1180px,100%); min-height:calc(100svh - 150px); margin:30px auto 0; display:grid; grid-template-columns:minmax(260px,.74fr) minmax(580px,1.26fr); gap:clamp(25px,5vw,76px); align-items:center; }
.sr-success-copy { padding-bottom:25px; }
.sr-success-check { display:grid; place-items:center; width:56px; height:56px; margin-bottom:22px; border-radius:18px; background:#dff8f2; color:#079681; font-size:2rem; font-weight:900; box-shadow:0 10px 25px rgba(18,159,143,.12); }
.sr-success-copy h1 { color:var(--sr-ink); font-size:clamp(42px,5vw,70px); font-weight:850; line-height:1.1; letter-spacing:-2.5px; margin:13px 0 18px; }
.sr-success-copy>p { max-width:430px; color:#445477; font-size:1rem; line-height:1.65; margin:0; }
.sr-success-actions { display:flex; flex-wrap:wrap; gap:10px; max-width:470px; margin-top:27px; }
.sr-success-actions .sr-submit { width:auto; flex:1 1 230px; }
.sr-secondary-button { width:auto; flex:1 1 180px; justify-content:center; gap:12px; border:1px solid #cbd7e9; background:rgba(255,255,255,.68); color:#35466b; }
.sr-secondary-button:hover { border-color:#8ea9de; background:#fff; }
.sr-success-warning { max-width:470px; margin-top:15px; padding:11px 13px; border:1px solid #f4d28d; border-radius:10px; background:#fff8e7; color:#876519; font-size:.68rem; line-height:1.55; }
.sr-card-result-panel { min-width:0; padding:clamp(22px,3vw,36px); border:1px solid rgba(255,255,255,.95); border-radius:25px; background:rgba(255,255,255,.78); box-shadow:0 24px 66px rgba(52,91,151,.13); backdrop-filter:blur(15px); }
.sr-result-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; margin-bottom:19px; }
.sr-result-heading h2 { margin-top:5px; }
.sr-result-chip { flex:0 0 auto; padding:6px 10px; border:1px solid #9ce3d8; border-radius:999px; background:#eafff9; color:#078b78; font-size:.58rem; font-weight:900; letter-spacing:.12em; }
.sr-result-chip.is-pending { border-color:#f1d28c; background:#fff8e7; color:#9a6b0a; }
.student-id-card { position:relative; min-height:370px; overflow:hidden; padding:28px 30px 22px; border-radius:25px; color:#fff; background:linear-gradient(133deg,#5f78ef 0%,#7d6be5 43%,#d17fce 66%,#f2a15e 82%,#30b8b4 100%); box-shadow:0 17px 36px rgba(54,78,169,.24); isolation:isolate; }
.student-id-card::before,.student-id-card::after { content:""; position:absolute; z-index:-1; border:1px solid rgba(255,255,255,.34); border-radius:50%; transform:rotate(-15deg); pointer-events:none; }
.student-id-card::before { width:540px; height:250px; right:-170px; top:55px; }.student-id-card::after { width:430px; height:220px; left:-180px; bottom:-95px; }
.student-id-card-glow { position:absolute; z-index:-1; width:220px; height:220px; right:-80px; top:-100px; border-radius:50%; background:rgba(255,255,255,.18); filter:blur(5px); }
.student-id-card-top,.student-id-card-brand,.student-id-card-footer { display:flex; align-items:center; justify-content:space-between; }
.student-id-card-top { align-items:flex-start; gap:15px; }
.student-id-card-brand { justify-content:flex-start; min-width:0; }
.student-id-card-logo { display:block; width:clamp(145px,34%,190px); height:auto; filter:brightness(0) invert(1); }
.student-id-card-type { padding-top:6px; color:rgba(255,255,255,.88); font-size:.59rem; font-weight:800; letter-spacing:.16em; }
.student-id-card-main { display:flex; align-items:center; gap:20px; margin-top:32px; }
.student-id-card-avatar { display:grid; place-items:center; flex:0 0 100px; width:100px; height:100px; overflow:hidden; border:4px solid rgba(255,255,255,.94); border-radius:50%; background:rgba(255,255,255,.22); color:#fff; box-shadow:0 8px 20px rgba(35,53,150,.2); }
.student-id-card-avatar .sr-avatar-initials { color:#fff; font-size:1.65rem; }
.student-id-card-identity { min-width:0; }
.student-id-card-identity small { display:block; margin-bottom:3px; color:rgba(255,255,255,.86); font-size:.61rem; }
.student-id-card-identity>strong { display:block; color:#fff; font:800 1.32rem/1.1 "Plus Jakarta Sans",Arial,sans-serif; letter-spacing:.06em; text-shadow:0 4px 14px rgba(37,46,145,.18); }
.student-id-card-identity h3 { margin:8px 0 3px; overflow:hidden; color:#fff; font-size:1.45rem; font-weight:900; text-shadow:0 4px 14px rgba(37,46,145,.18); text-overflow:ellipsis; white-space:nowrap; }
.student-id-card-identity span { display:block; overflow:hidden; color:rgba(255,255,255,.86); font-size:.68rem; text-overflow:ellipsis; white-space:nowrap; }
.student-id-card-meta { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 12px; margin-top:23px; padding:15px 0 13px; border-top:1px solid rgba(255,255,255,.45); border-bottom:1px solid rgba(255,255,255,.45); }
.student-id-card-field { min-width:0; padding:11px 12px 10px; border:1px solid rgba(255,255,255,.42); border-radius:13px; background:rgba(255,255,255,.11); }
.student-id-card-field.is-credential { border-color:rgba(255,255,255,.72); background:rgba(255,255,255,.2); box-shadow:inset 0 1px 0 rgba(255,255,255,.16); }
.student-id-card-field:last-child { grid-column:1 / -1; }
.student-id-card-field small { display:block; color:rgba(255,255,255,.9); font-size:.52rem; font-weight:900; letter-spacing:.13em; }
.student-id-card-field strong { display:block; overflow:hidden; margin-top:4px; color:#fff; font-size:.84rem; font-weight:850; letter-spacing:.02em; text-overflow:ellipsis; white-space:nowrap; }
.student-id-card-footer { justify-content:flex-start; gap:10px; margin-top:14px; color:rgba(255,255,255,.8); font-size:.54rem; letter-spacing:.1em; }
.student-id-card-dot { width:4px; height:4px; border-radius:50%; background:#73e5d7; }
.sr-card-security-note { display:flex; align-items:flex-start; gap:7px; margin:14px 2px 0; color:#7a6d4e; font-size:.65rem; line-height:1.5; }
.sr-card-security-note span { display:grid; place-items:center; flex:0 0 16px; width:16px; height:16px; border-radius:50%; background:#f4d895; color:#745916; font-size:.65rem; font-weight:900; }

@media(max-width:1050px) {
  .sr-layout,.sr-success-layout { display:flex; flex-direction:column; align-items:stretch; gap:28px; min-height:0; margin-top:34px; }
  .sr-intro { padding:0; }
  .sr-card,.sr-card-result-panel { max-width:none; }
  .sr-intro-details>p,.sr-intro-callout { max-width:680px; }
  .sr-intro-benefits { max-width:680px; grid-template-columns:repeat(3,minmax(0,1fr)); }
  .sr-benefit { align-items:flex-start; flex-direction:column; min-height:116px; }
  .sr-intro-visual { max-width:680px; }
  .sr-success-copy { max-width:680px; padding:0; }
  .sr-success-actions { max-width:680px; }
}

@media(max-width:700px) {
  .student-registration-shell { padding-inline:16px; }
  .sr-topbar { align-items:flex-start; }
  .sr-topbar-status { display:none; }
  .sr-layout { margin-top:28px; }
  .sr-intro-heading h1 { font-size:clamp(31px,7vw,46px); }
  .sr-intro-details>p { font-size:1rem; }
  .sr-intro-benefits { grid-template-columns:1fr; }
  .sr-benefit { flex-direction:row; min-height:0; align-items:center; }
  .sr-intro-visual { min-height:110px; }
  .sr-card,.sr-card-result-panel { padding:22px 17px; border-radius:21px; }
  .sr-form-progress div { font-size:.55rem; }
  .sr-field-grid { grid-template-columns:1fr; gap:11px; }
  .sr-field.sr-span-2 { grid-column:auto; }
  .sr-avatar-row { padding:10px; }
}

@media(max-width:560px) {
  .student-registration-shell { padding-top:17px; }
  .student-registration-shell:not(.sr-success-shell) .sr-masthead { display:grid; grid-template-columns:clamp(128px,36vw,156px) minmax(0,1fr); column-gap:clamp(15px,5vw,28px); align-items:start; width:100%; }
  .student-registration-shell:not(.sr-success-shell) .sr-brand { width:100%; align-items:flex-start; margin-left:1px; }
  .student-registration-shell:not(.sr-success-shell) .sr-brand img { width:100%; }
  .student-registration-shell:not(.sr-success-shell) .sr-masthead .sr-intro-heading { align-self:start; padding-top:7px; }
  .student-registration-shell:not(.sr-success-shell) .sr-masthead .sr-eyebrow { font-size:.49rem; letter-spacing:.09em; line-height:1.25; }
  .student-registration-shell:not(.sr-success-shell) .sr-masthead .sr-intro-heading h1 { margin-top:8px; font-size:clamp(25px,7.8vw,36px); letter-spacing:-1.2px; line-height:1.04; }
  .sr-layout { margin-top:25px; gap:23px; }
  .sr-intro-kicker { font-size:.63rem; }
  .sr-intro-details { margin-top:15px; }
  .sr-intro-details>p { font-size:.88rem; line-height:1.6; }
  .sr-intro-pills { margin-top:15px; gap:5px; }
  .sr-intro-pills span { padding:6px 8px; font-size:.57rem; }
  .sr-intro-benefits { margin-top:20px; gap:8px; }
  .sr-benefit { padding:10px; }
  .sr-benefit strong { font-size:.69rem; }
  .sr-benefit small { font-size:.58rem; }
  .sr-intro-callout { margin-top:14px; padding:10px; }
  .sr-intro-visual { display:none; }
  .sr-card-heading { margin-bottom:15px; }
  .sr-card-heading h2,.sr-result-heading h2 { font-size:21px; }
  .sr-card-heading p { font-size:.64rem; }
  .sr-form-progress { margin-bottom:15px; }
  .sr-form-progress div { gap:3px; padding:5px 2px; font-size:.48rem; }
  .sr-form-progress span { width:15px; height:15px; flex-basis:15px; font-size:.45rem; }
  .sr-avatar-row { margin-bottom:17px; }
  .sr-avatar-arrow { display:none; }
  .sr-section-label { margin-top:15px; }
  .sr-section-label small { display:none; }
  .sr-consent { margin-top:16px; font-size:.58rem; }
  .student-id-card { min-height:0; padding:21px 18px 17px; border-radius:19px; }
  .student-id-card-main { gap:12px; margin-top:24px; }
  .student-id-card-logo { width:145px; }
  .student-id-card-avatar { flex-basis:76px; width:76px; height:76px; border-width:3px; }
  .student-id-card-identity>strong { font-size:1rem; }.student-id-card-identity h3 { font-size:1.1rem; }.student-id-card-identity span { font-size:.57rem; }
  .student-id-card-meta { gap:9px 10px; margin-top:19px; }.student-id-card-field { padding:9px 10px 8px; }.student-id-card-field strong { font-size:.68rem; }.student-id-card-field small { font-size:.45rem; }
  .student-id-card-footer { font-size:.45rem; }
  .sr-success-actions { flex-direction:column; }.sr-success-actions .sr-submit,.sr-secondary-button { width:100%; flex:auto; }
}

@media(prefers-reduced-motion:reduce) { .student-registration-shell *,.student-registration-shell *::before,.student-registration-shell *::after { animation:none !important; transition:none !important; } }
@media print {
  body.registration-page { background:#fff; }
  .student-registration-shell { min-height:0; padding:0; background:#fff; }
  .sr-brand,.sr-success-copy,.sr-result-heading,.sr-card-security-note,.sr-footer { display:none !important; }
  .sr-success-layout { display:block; min-height:0; margin:0; }
  .sr-card-result-panel { padding:0; border:0; box-shadow:none; background:#fff; }
  .student-id-card { width:100%; max-width:760px; margin:20mm auto; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}