/* Share the authenticated Results palette, typography and governed score rings. */
@import url('../css/patient_design_system.css');
@import url('../css/patient_score_rings.css');

.fsa {
  --ink: var(--patient-ink); --teal: var(--patient-action); --soft: var(--patient-surface);
  --paper: var(--patient-canvas); --line: var(--patient-line); --muted: var(--patient-muted);
  margin: 0; background: var(--paper); color: var(--ink); font-family: var(--patient-font-sans);
  line-height: 1.55; color-scheme: dark;
}
.fsa * { box-sizing: border-box; }
.fsa [hidden] { display: none !important; }
.fsa a { color: inherit; text-underline-offset: 4px; }
.fsa button, .fsa input { font: inherit; }
.fsa button, .fsa a, .fsa input { touch-action: manipulation; }
.fsa :focus-visible { outline: 3px solid var(--patient-focus); outline-offset: 4px; }
.fsa button { cursor: pointer; }
.fsa button:disabled { cursor: not-allowed; opacity: .6; }
.fsa h1, .fsa h2, .fsa h3, .fsa p { margin-top: 0; }
.fsa h1 { font-size: clamp(2rem, 4vw, 3.45rem); line-height: 1.12; letter-spacing: -.045em; font-weight: 750; margin-bottom: 24px; }
.fsa h2 { font-size: clamp(1.4rem, 2.4vw, 1.9rem); line-height: 1.22; letter-spacing: -.025em; margin-bottom: 16px; }
.fsa p { margin-bottom: 20px; }
.fsa-skip { position: fixed; top: 12px; left: 16px; z-index: 10; background: var(--soft); padding: 0; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.fsa-skip:focus { width: auto; height: auto; padding: 12px; overflow: visible; clip-path: none; }
.fsa-header { max-width: 1280px; margin: auto; padding: 30px 40px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.fsa-header > a:last-child { font-size: .875rem; }
.fsa-header nav { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; font-size: .85rem; }
.fsa-brand { text-decoration: none; font-weight: 750; font-size: 1.1rem; letter-spacing: .24em; flex-shrink: 0; }
.fsa-brand span { display: block; font-size: .68rem; letter-spacing: .08em; font-weight: 400; margin-top: 3px; color: var(--muted); }
.fsa-shell { max-width: 1180px; margin: 30px auto 80px; padding: 0 40px; display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 64px; align-items: start; }
.fsa-intro { position: sticky; top: 65px; padding-top: 48px; }
.fsa-intro > p:not(.fsa-eyebrow) { color: var(--muted); font-size: 1.1rem; line-height: 1.75; }
.fsa-eyebrow { font-size: .72rem; letter-spacing: .17em; font-weight: 750; color: var(--teal); margin-bottom: 18px; }
.fsa-pill { font-size: .78rem; background: var(--soft); border: 1px solid var(--line); border-radius: 30px; display: inline-block; padding: 9px 15px; }
.fsa-workspace { background: var(--patient-panel); border: 1px solid var(--line); border-radius: 24px; overflow: hidden; box-shadow: 0 20px 55px #0002; }
.fsa-steps { display: flex; list-style: none; padding: 24px; margin: 0; border-bottom: 1px solid var(--line); gap: 12px; justify-content: space-between; font-size: .78rem; color: var(--muted); }
.fsa-steps li { display: flex; gap: 7px; align-items: center; }
.fsa-steps span { display: grid; place-items: center; width: 25px; height: 25px; border: 1px solid var(--line); border-radius: 50%; flex-shrink: 0; }
.fsa-steps [aria-current] { color: var(--ink); font-weight: 700; }
.fsa-steps [aria-current] span { background: var(--teal); border-color: var(--teal); color: var(--patient-action-ink); }
.fsa-notice { margin: 22px 32px 0; border-radius: 12px; color: var(--teal); font-size: .9rem; }
.fsa-notice:empty { display: none; }
.fsa-notice.is-error { background: rgb(var(--patient-critical-rgb) / .09); color: var(--patient-critical); padding: 14px; border: 1px solid rgb(var(--patient-critical-rgb) / .45); }
.fsa-panel { padding: 30px 32px 34px; }
.fsa-panel > p { color: var(--muted); font-size: .94rem; }
.fsa-panel label { display: block; font-size: .88rem; font-weight: 600; margin-bottom: 18px; }
.fsa-panel input:not([type=checkbox]):not([type=file]) { display: block; width: 100%; min-width: 0; min-height: 48px; background: var(--paper); color: var(--ink); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; margin-top: 7px; font-size: 1rem; }
.fsa-panel small { display: block; font-size: .76rem; color: var(--muted); font-weight: 400; margin-top: 6px; }
.fsa-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.fsa-consents { border: 0; padding: 10px 0 5px; margin: 7px 0 18px; }
.fsa-consents legend { font-size: .9rem; font-weight: 700; }
.fsa-consents label { display: flex; align-items: flex-start; gap: 10px; font-size: .82rem; font-weight: 400; line-height: 1.55; }
.fsa-consents input { flex: 0 0 20px; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--teal); }
.fsa-marketing { border-top: 1px solid var(--line); padding-top: 14px; }
.fsa-marketing legend { padding-right: 10px; }
.fsa-marketing p { font-size: .8rem; color: var(--muted); margin-bottom: 12px; }
.fsa-marketing-options { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.fsa-marketing-options label { min-height: 28px; margin-bottom: 10px; }
.fsa-button { display: flex; justify-content: center; align-items: center; gap: 12px; width: 100%; min-height: 50px; background: var(--teal); color: var(--patient-action-ink) !important; border: 1px solid var(--teal); border-radius: 12px; padding: 13px 18px; text-decoration: none; font-size: .9rem; font-weight: 750; text-align: center; line-height: 1.4; }
.fsa-button:hover { filter: brightness(1.07); }
.fsa-secondary { background: transparent; color: var(--ink) !important; border-color: var(--patient-line-strong); }
.fsa-secondary:hover { background: var(--soft); }
.fsa-button + .fsa-button { margin-top: 12px; }
.fsa-text-button { border: 0; background: transparent; min-height: 44px; padding: 10px; color: var(--teal); text-decoration: underline; text-underline-offset: 4px; font-size: .85rem; }
.fsa-stage-icon { display: grid; place-items: center; width: 56px; height: 56px; background: var(--soft); border-radius: 18px; color: var(--teal); font-size: 1.8rem; margin-bottom: 25px; }
/* A portrait viewport with contained source pixels. No preview or saved-frame crop. */
.fsa-photo { width: min(100%, 360px); aspect-ratio: 3 / 4; border: 1px solid var(--patient-line-strong); background: #0c1214; border-radius: 20px; overflow: hidden; position: relative; display: grid; place-items: center; text-align: center; margin: 24px auto 18px; }
.fsa-photo img, .fsa-photo video { width: 100%; height: 100%; object-fit: contain; position: absolute; inset: 0; }
.fsa-photo video { transform: scaleX(-1); }
.fsa-photo [data-photo-empty] { padding: 20px; color: var(--muted); font-size: .85rem; }
.fsa-photo [data-photo-empty] > span { font-size: 4rem; display: block; color: var(--teal); opacity: .6; }
.fsa-framing-guide { position: absolute; pointer-events: none; inset: 12% 15% 16%; border: 1px dashed rgb(var(--patient-action-rgb) / .65); border-radius: 48%; }
.fsa-camera-hint { text-align: center; font-size: .8rem; color: var(--muted); }
.fsa-camera-controls { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
.fsa-camera-controls .fsa-button { flex: 1 1 150px; margin: 0; min-width: 0; }
.fsa-file-label { position: relative; overflow: hidden; cursor: pointer; }
.fsa-file-label input { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
.fsa-file-label:focus-within { outline: 3px solid var(--patient-focus); outline-offset: 4px; }
.fsa-panel .fsa-file-label { display: flex; font-size: .9rem; margin: 0; }
.fsa-small { font-size: .8rem !important; color: var(--muted); line-height: 1.6; }
.fsa-progress { height: 4px; border-radius: 9px; overflow: hidden; background: var(--soft); margin: 28px 0; }
.fsa-progress:before { content: ''; display: block; width: 40%; height: 100%; background: var(--teal); animation: fsa-progress 2s ease-in-out infinite alternate; }
@keyframes fsa-progress { to { transform: translateX(150%); } }
.fsa-footer { max-width: 1050px; margin: 0 auto; padding: 24px 40px 40px; text-align: center; color: var(--muted); font-size: .76rem; }
.fsa-report-shell { max-width: 1200px; padding: 0 40px; margin: 35px auto 60px; }
.fsa-report-heading { display: flex; justify-content: space-between; gap: 30px; align-items: center; margin: 35px 0; }
.fsa-report-heading h1 { margin-bottom: 16px; }
.fsa-report-heading > div > p:last-child { font-size: .9rem; color: var(--muted); margin: 0; }
.fsa-report-heading > .fsa-button { width: auto; flex-shrink: 0; }
.fsa-overview { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); border-radius: 24px; overflow: hidden; background: var(--patient-panel); border: 1px solid var(--line); }
.fsa-report-photo { position: relative; overflow: hidden; background: #0c1214; display: grid; place-items: center; min-height: 330px; }
.fsa-report-photo img { display: block; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.fsa-report-photo > p { padding: 28px; }
.fsa-overall { padding: 38px; align-self: center; }
.fsa-overall .fsa-eyebrow { margin-bottom: 10px; }
.fsa-overall-score { display: flex; align-items: center; gap: 24px; margin: 22px 0; }
.fsa .fsa-overall-score .patient-score-ring { --patient-score-ring-size: 112px; flex-shrink: 0; }
.fsa-overall-score p { margin: 0; }
.fsa-score-band { display: block; font-size: 1.3rem; font-weight: 700; margin-bottom: 6px; }
.fsa-overall > p { margin-bottom: 14px; }
.fsa-overall > .fsa-small { margin-bottom: 0; }
.fsa-reading-section { margin-top: 42px; }
.fsa-section-heading { max-width: 760px; }
.fsa-section-heading > p { color: var(--muted); font-size: .95rem; }
.fsa-readings { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-top: 26px; }
.fsa-reading { display: flex; flex-direction: column; align-items: flex-start; text-align: left; border: 1px solid var(--line); background: var(--patient-panel); border-radius: 20px; padding: 24px; color: var(--ink); min-width: 0; }
.fsa-reading-top { display: flex; align-items: center; gap: 17px; width: 100%; margin-bottom: 18px; }
.fsa-reading-top > strong { font-size: 1.05rem; line-height: 1.35; }
.fsa .fsa-reading-top .patient-score-ring { --patient-score-ring-size: 70px; flex-shrink: 0; }
.fsa-reading-band { display: inline-block; border: 1px solid var(--line); padding: 4px 10px; border-radius: 6px; font-size: .78rem; font-weight: 650; }
.fsa-reading[data-tone="positive"] .fsa-reading-band { color: var(--patient-positive); border-color: rgb(var(--patient-positive-rgb) / .4); background: rgb(var(--patient-positive-rgb) / .08); }
.fsa-reading[data-tone="watch"] .fsa-reading-band { color: var(--patient-caution); border-color: rgb(var(--patient-caution-rgb) / .4); background: rgb(var(--patient-caution-rgb) / .08); }
.fsa-reading[data-tone="attention"] .fsa-reading-band { color: var(--patient-critical); border-color: rgb(var(--patient-critical-rgb) / .4); background: rgb(var(--patient-critical-rgb) / .08); }
.fsa-reading > small { display: flex; justify-content: space-between; width: 100%; font-size: .78rem; color: var(--muted); margin-top: 18px; gap: 12px; }
.fsa-reading:hover { background: var(--soft); border-color: var(--patient-line-strong); }
.fsa-reading.is-unavailable { color: var(--muted); }
.fsa-next { padding: 32px; background: rgb(var(--patient-action-rgb) / .045); border: 1px solid var(--line); border-radius: 20px; margin-top: 40px; }
.fsa-next > p:not(.fsa-eyebrow) { max-width: 760px; color: var(--muted); }
.fsa-next-actions { display: flex; gap: 12px; flex-wrap: wrap; margin: 26px 0; }
.fsa-next-actions > * { min-width: 220px; }
.fsa-next-actions .fsa-button { height: 100%; }
.fsa-report-note { padding: 24px 0; font-size: .88rem; color: var(--muted); }
.fsa-report-note h2 { font-size: 1.15rem; letter-spacing: -.01em; }
.fsa-report-note p:last-child { margin-bottom: 0; }
.fsa-reading-dialog { width: min(640px,calc(100% - 32px)); max-height: calc(100dvh - 32px); border: 1px solid var(--patient-line-strong); border-radius: 22px; padding: 0; background: var(--patient-panel); color: var(--ink); box-shadow: 0 20px 90px #0008; }
.fsa-reading-dialog::backdrop { background: #080e10b0; backdrop-filter: blur(4px); }
.fsa-reading-dialog > header { display: flex; justify-content: space-between; gap: 16px; align-items: center; padding: 16px 24px; border-bottom: 1px solid var(--line); position: sticky; top: 0; background: var(--patient-panel); z-index: 1; }
.fsa-reading-dialog > header .fsa-eyebrow { margin: 0; font-size: .65rem; }
.fsa-reading-dialog > header button { min-height: 44px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--soft); color: var(--ink); }
.fsa-reading-dialog [data-reading-body] { padding: 28px; }
.fsa-detail-summary { display: flex; align-items: center; gap: 22px; padding: 20px; background: var(--soft); border-radius: 16px; margin: 22px 0; }
.fsa .fsa-detail-summary .patient-score-ring { --patient-score-ring-size: 88px; flex-shrink: 0; }
.fsa-detail-summary p { margin: 0; }
.fsa-detail-value { font-size: 2rem; line-height: 1.2; font-weight: 700; margin-bottom: 8px !important; }
.fsa-reading-dialog .fsa-report-note { border-top: 1px solid var(--line); margin-top: 24px; padding-bottom: 26px; }
.fsa-reading-dialog .fsa-button { margin-top: 8px; }
.fsa-domain-list { display: grid; gap: 10px; margin: 24px 0; }
.fsa-domain-row { display: flex; justify-content: space-between; align-items: center; gap: 16px; width: 100%; text-align: left; border: 1px solid var(--line); background: var(--soft); color: var(--ink); border-radius: 12px; padding: 15px 17px; min-height: 56px; }
.fsa-domain-row span { font-size: .9rem; }
.fsa-domain-row strong { font-size: .9rem; color: var(--teal); text-align: right; flex-shrink: 0; max-width: 50%; }
.fsa-domain-row[disabled] { opacity: 1; }
.fsa-recover { border-top: 1px solid var(--line); margin-top: 30px; padding-top: 25px; }
.fsa-recover h3 { font-size: 1.05rem; margin-bottom: 8px; }
.fsa-recover p { font-size: .82rem; color: var(--muted); }
.fsa-library { max-width: 1000px; }
.fsa-library > h1 { margin-top: 15px; }
.fsa-library > p { max-width: 700px; color: var(--muted); }
.fsa-library-signin { max-width: 570px; margin-top: 30px; }
.fsa-library-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; margin-top: 30px; }
.fsa-library-card { background: var(--patient-panel); border: 1px solid var(--line); border-radius: 22px; padding: 28px; }
.fsa-library-card h2 { font-size: 1.5rem; }
.fsa-library-card .fsa-button { margin-top: 25px; }
.fsa-report-actions { display: flex; gap: 12px; flex-wrap: wrap; margin: 24px 0; }
.fsa-report-actions > * { min-width: 220px; }
.fsa-report-actions > .fsa-button { width: auto; }
.fsa-report-actions .fsa-button { height: 100%; }
.fsa-booking-context { padding: 24px; border: 1px solid var(--line); background: var(--soft); border-radius: 18px; margin: 26px 0; }
.fsa-booking-context dl { display: grid; grid-template-columns: auto 1fr; gap: 12px 24px; }
.fsa-booking-context dd { margin: 0; }
.fsa-booking-context dt { font-weight: 600; }
@media(max-width:850px) {
  .fsa-shell { gap: 30px; padding: 0 25px; grid-template-columns: minmax(0,.75fr) minmax(0,1.25fr); }
  .fsa-header { padding: 25px; }
  .fsa-intro h1 { font-size: 2.5rem; }
  .fsa-panel { padding: 25px; }
  .fsa-notice { margin: 20px 25px 0; }
  .fsa-steps { padding: 20px 18px; gap: 8px; font-size: .7rem; }
  .fsa-overall { padding: 28px; }
  .fsa-readings { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media(max-width:640px) {
  .fsa-header { padding: 20px; gap: 14px; }
  .fsa-brand { font-size: .95rem; }
  .fsa-header > a:last-child { font-size: .76rem; }
  .fsa-header nav { font-size: .76rem; gap: 10px; justify-content: flex-end; }
  .fsa-shell { display: block; margin: 8px auto 40px; padding: 0 16px; }
  .fsa-intro { position: static; padding: 18px 8px 28px; }
  .fsa-intro h1 { font-size: 2.5rem; margin-bottom: 16px; }
  .fsa-intro > p:not(.fsa-eyebrow) { font-size: .95rem; margin-bottom: 15px; }
  .fsa-eyebrow { margin-bottom: 16px; }
  .fsa-workspace { border-radius: 20px; }
  .fsa-panel { padding: 25px 22px; }
  .fsa-steps { font-size: .72rem; padding: 20px 16px; gap: 6px; }
  .fsa-steps li { gap: 5px; }
  .fsa-steps span { width: 23px; height: 23px; }
  .fsa-notice { margin: 18px 22px 0; }
  .fsa-fields { gap: 12px; }
  .fsa-footer { padding: 20px 24px 32px; }
  .fsa-report-shell { padding: 0 20px; margin-top: 15px; }
  .fsa-report-heading { display: block; margin: 30px 0 25px; }
  .fsa-report-heading > .fsa-button { margin-top: 22px; width: 100%; }
  .fsa-overview { display: block; border-radius: 18px; }
  .fsa-report-photo { min-height: 0; aspect-ratio: 4 / 3; }
  .fsa-report-photo img { max-height: 100%; }
  .fsa-overall { padding: 24px; }
  .fsa .fsa-overall-score .patient-score-ring { --patient-score-ring-size: 96px; }
  .fsa-overall-score { gap: 20px; }
  .fsa-score-band { font-size: 1.1rem; }
  .fsa-reading-section { margin-top: 35px; }
  .fsa-readings { gap: 10px; }
  .fsa-reading { padding: 17px; }
  .fsa-reading-top { flex-direction: column; align-items: flex-start; gap: 14px; }
  .fsa-reading-top > strong { font-size: .96rem; }
  .fsa .fsa-reading-top .patient-score-ring { --patient-score-ring-size: 66px; }
  .fsa-reading-band { font-size: .7rem; padding: 4px 8px; }
  .fsa-next { padding: 25px 22px; }
  .fsa-next-actions > *, .fsa-report-actions > *, .fsa-report-actions > .fsa-button { width: 100%; min-width: 0; }
  .fsa-reading-dialog [data-reading-body] { padding: 24px; }
  .fsa-reading-dialog > header { padding: 12px 18px; }
  .fsa-detail-summary { padding: 16px; gap: 16px; }
  .fsa .fsa-detail-summary .patient-score-ring { --patient-score-ring-size: 72px; }
  .fsa-detail-value { font-size: 1.55rem; }
  .fsa-library-grid { grid-template-columns: 1fr; }
  .fsa-booking-context dl { display: block; }
  .fsa-booking-context dd { margin: 5px 0 18px; }
  .fsa-library-card { padding: 24px; }
}
@media(max-width:360px) {
  .fsa-fields { grid-template-columns: 1fr; }
  .fsa-steps { font-size: .66rem; padding: 17px 12px; }
  .fsa-panel { padding: 24px 18px; }
  .fsa-reading { padding: 14px; }
  .fsa-report-shell { padding: 0 16px; }
  .fsa-reading-dialog [data-reading-body] { padding: 20px; }
}
@media(orientation:landscape) and (max-height:600px) {
  .fsa-photo { width: min(100%, 285px); }
  .fsa-intro { position: static; }
}
@media(prefers-reduced-motion:reduce) { .fsa *, .fsa *:before { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
@media print {
  .fsa { --ink: #172b28; --muted: #40524b; --paper: #fff; --soft: #f3f5f3; --line: #b9c7c1; color-scheme: light; }
  .fsa-header, .fsa-footer, .fsa-next-actions, .fsa-report-actions, .fsa-report-heading > .fsa-button, .fsa-reading-dialog { display: none !important; }
  .fsa-report-shell { max-width: none; margin: 0; padding: 0; }
  .fsa-readings { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .fsa-reading, .fsa-overview, .fsa-next { break-inside: avoid; }
  .fsa-reading, .fsa-overview { background: #fff; }
  .fsa h1 { font-size: 2rem; }
}

/* SMS codes remain in memory; a single native field supports iOS/Android autofill. */
.fsa-contact-note { border-left: 2px solid var(--patient-premium); padding: 0 0 0 16px; margin: 20px 0 24px; }
.fsa-contact-note p { color: var(--muted); font-size: .82rem; }
.fsa .fsa-panel input.fsa-code { letter-spacing: .35em; font-size: 1.5rem; font-weight: 700; }
.fsa-resend-help { margin: 10px 0 0; min-height: 1.6em; }
.fsa-library-code { border-top: 1px solid var(--line); padding-top: 24px; margin-top: 24px; }

.fsa form + .fsa-button { margin-top: 12px; }

.fsa-contact-preferences { border-top: 1px solid var(--line); padding: 28px 0; margin-top: 20px; }
.fsa-contact-preferences h2 { font-size: 1.2rem; }
.fsa-contact-preferences p { color: var(--muted); font-size: .88rem; max-width: 700px; }
.fsa-contact-preferences label { display: flex; align-items: flex-start; gap: 12px; font-size: .88rem; margin-bottom: 20px; }
.fsa-contact-preferences input { flex: 0 0 20px; width: 20px; height: 20px; accent-color: var(--teal); }
.fsa-contact-preferences button { width: auto; }
.fsa-service-contact { border: 1px solid var(--line); border-radius: 16px; padding: 18px; }
.fsa-service-contact legend { padding: 0 8px; }
.fsa-service-contact p { font-size: .82rem; color: var(--muted); }
.fsa-contact-preferences .fsa-marketing-options label { min-height: 44px; align-items: center; }
