/* Responsive website layout layered over the approved Rounds design. */
html { scroll-behavior:smooth; }
body { display:block;padding:0;min-height:100dvh;font-size:15px; }
body::before { z-index:-1; }
button,input,select { font:inherit; }
.site-header { max-width:1360px;padding:28px 48px;margin:auto;display:flex;align-items:center;gap:30px; }
.site-brand { display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font-size:30px;font-weight:780;letter-spacing:-1.3px;line-height:1; }
.site-brand .brand-icon { width:38px;height:38px;border-radius:11px; }
.brand-suffix { display:block;font-size:10px;letter-spacing:3px;font-weight:500;margin:5px 0 0 2px; }
.site-tagline { font-size:10px;letter-spacing:1.8px;color:var(--muted); }
.header-account { margin:0 0 0 auto;padding:10px 18px;width:auto;font-size:13px;min-height:43px; }
.web-layout { position:relative;display:grid;grid-template-columns:minmax(275px,.75fr) minmax(0,1fr);gap:80px;max-width:1230px;margin:38px auto 55px;padding:0 38px;align-items:start; }
.website-intro { position:sticky;top:75px;padding-top:60px; }
.website-intro h1 { font-size:clamp(40px,4.6vw,61px);font-weight:630;line-height:1.08;letter-spacing:-2.8px;margin:24px 0; }
.website-intro h1 em { color:var(--lime);font-style:normal; }
.website-intro p { font-size:15px;line-height:1.75;color:var(--muted); }
.intro-detail { display:flex;align-items:center;gap:9px;margin-top:43px;font-size:10px;letter-spacing:1.3px;font-weight:650; }
.intro-dot { width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px #d5f66570; }
.website-intro .intro-fine { max-width:335px;font-size:13px; }
.website-intro .editorial-notice { max-width:345px;margin-top:40px;border-top:1px solid var(--line);padding-top:20px;font-size:11px;line-height:1.8; }
.device { width:100%;height:auto;min-height:740px;border:1px solid rgba(190,215,244,.19);border-radius:25px;overflow:visible;zoom:1;box-shadow:0 22px 80px #0004; }
.app { overflow:visible;flex:1;scrollbar-width:auto; }
.screen { padding:23px 30px 27px; }
.account-status { border-bottom:1px solid var(--line);padding:14px 25px;min-height:47px;display:flex;gap:9px;align-items:center;justify-content:space-between;color:var(--muted);font-size:11px;line-height:1.5; }
.account-status strong { color:var(--ink);font-weight:500;overflow-wrap:anywhere; }
.account-status .text-button { flex-shrink:0;font-size:11px;min-height:30px; }
.account-status.is-saving { color:var(--lime); }
.account-status.is-error { color:#ffb5a9; }
.home-title { font-size:36px; }
.hero { padding:25px; }
.hero-description { font-size:13px;max-width:270px; }
.hero h2 { font-size:35px; }
.hero-meta,.hero-footer { font-size:12px; }
.primary,.secondary { font-size:14px;min-height:47px; }
.navigation { position:sticky;bottom:14px;margin:0 14px 14px;min-height:66px;flex-shrink:0; }
.no-nav .navigation { display:none; }
.topbar { display:none; }
.section-heading h2 { font-size:15px; }
.text-button { font-size:12px; }
.focus-row { flex-wrap:wrap; }
.focus-chip { font-size:11px; }
.question-stem { font-size:16px;line-height:1.65; }
.answer-option { font-size:14px; }
.feedback p { font-size:14px;line-height:1.75; }
.quiz-screen { padding-bottom:0; }
.quiz-bottom { position:sticky;bottom:0;margin-left:-30px;margin-right:-30px;padding:18px 30px;border-radius:0 0 25px 25px; }
.quiz-bottom .note { font-size:11px;margin-bottom:0; }
.modal-overlay { position:fixed;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:22px; }
.modal { border-radius:23px;max-width:490px;max-height:calc(100dvh - 44px);overflow:auto;width:100%;padding:28px; }
.modal-handle { display:none; }
.modal p { font-size:14px;line-height:1.65; }
.modal .note { font-size:12px; }
.modal-icon { margin-top:0; }
.modal-heading h2 { font-size:28px; }
.toast { position:fixed;z-index:50;left:50%;bottom:28px;right:auto;transform:translate(-50%,20px);max-width:520px;width:calc(100% - 32px);font-size:13px;text-align:center;pointer-events:none; }
.toast.visible { transform:translate(-50%,0); }
.site-footer { max-width:1270px;margin:0 auto;padding:10px 38px 26px;display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:11px;color:var(--muted); }
.auth-form .form-field { margin:17px 0; }
.auth-form input { width:100%;font-size:16px;min-height:47px;border-radius:10px; }
.auth-form .form-field label { display:block;margin-bottom:7px;color:var(--muted);font-size:13px; }
.auth-links { display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;margin-top:17px; }
.form-status { min-height:22px;color:var(--muted);font-size:13px;line-height:1.55; }
.form-status.is-error { color:#ffb5a9; }
.account-email { overflow-wrap:anywhere; }
.account-card { border:1px solid var(--line);border-radius:16px;padding:20px;margin:24px 0; }
.account-card p { margin-top:0;font-size:13px;color:var(--muted); }
.gate-screen { padding:44px 30px; }
.gate-screen h1 { font-size:33px;letter-spacing:-1px;line-height:1.15; }
.gate-screen p { color:var(--muted);line-height:1.75; }
.gate-screen .primary { margin-top:24px; }
.cloud-note { display:flex;gap:8px;align-items:center;font-size:11px;color:var(--muted);margin-top:16px; }
.cloud-note svg { width:14px;height:14px;color:var(--lime); }
.skip-link { position:fixed;top:-100px;left:16px;padding:12px;background:var(--lime);color:#102016;z-index:100; }
.skip-link:focus { top:10px; }
.noscript { padding:25px;text-align:center; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible { outline:3px solid var(--lime);outline-offset:3px; }
body.cloud-busy .device { cursor:progress; }
@media(min-width:1400px) { .web-layout { grid-template-columns:450px minmax(0,650px);max-width:1330px;gap:110px; } }
@media(max-width:1000px) { .web-layout { gap:35px;grid-template-columns:minmax(240px,.65fr) minmax(0,1fr);padding:0 25px; }.site-header { padding:24px 25px; }.site-tagline { display:none; }.website-intro h1 { font-size:43px; }.screen { padding:23px; }.quiz-bottom { margin-left:-23px;margin-right:-23px;padding-left:23px;padding-right:23px; } }
@media(max-width:760px) { .web-layout { grid-template-columns:1fr;gap:0;margin:5px auto 20px;max-width:620px;padding:0 18px; }.website-intro { position:static;padding:12px 7px 25px; }.website-intro h1 { font-size:37px;letter-spacing:-1.5px;margin:15px 0; }.website-intro h1 br:first-child { display:none; }.website-intro>p { font-size:13px; }.website-intro .intro-detail,.website-intro .intro-fine,.website-intro .editorial-notice { display:none; }.site-header { max-width:620px;padding:20px 23px; }.site-brand { font-size:26px; }.device { min-height:670px; }.site-footer { max-width:620px;padding:10px 25px 26px;flex-wrap:wrap;gap:4px; }.navigation { bottom:max(10px,env(safe-area-inset-bottom)); }.home-title { font-size:32px; }.screen { padding:20px; }.quiz-bottom { margin-left:-20px;margin-right:-20px;padding:16px 20px; }.account-status { padding:10px 20px; }.modal-overlay { padding:14px; }.modal { padding:24px;max-height:calc(100dvh - 28px); }.community-map-stage { min-width:0; }.hero { padding:22px; }.hero-description { font-size:12px; }.hero h2 { font-size:32px; } }
@media(max-width:380px) { .web-layout { padding:0 10px; }.screen { padding:18px; }.home-title { font-size:30px; }.orbit { width:55px;height:55px; }.hero { padding:19px; }.account-status { padding:10px 16px; }.site-header { padding:18px; }.header-account { padding:9px 12px; }.focus-chip { font-size:10px; }.quiz-bottom { margin-left:-18px;margin-right:-18px;padding:16px 18px; } }

@media(max-width:760px) { body.is-member .website-intro { display:none; } .app { scroll-margin-top:20px; } }

/* Guest practice opens on the question, with account choices after the round. */
body.guest-practice .website-intro { display:none; }
body.guest-practice .web-layout { display:block;max-width:860px;margin-top:14px; }
body.guest-practice.practice-focus .device { min-height:0; }
body.guest-practice.practice-focus .site-header { max-width:1050px;padding-top:20px;padding-bottom:16px; }
body.guest-practice.practice-focus .account-status { min-height:39px;padding-top:7px;padding-bottom:7px; }
body.guest-practice.practice-focus .screen { padding-top:18px; }
body.guest-practice.practice-focus .question-title { font-size:30px;line-height:1.15;margin-top:13px; }
body.guest-practice.practice-focus .question-stem { font-size:16px;line-height:1.6; }
.draft-strip { color:var(--muted);font-size:10px;line-height:1.5;margin:0 0 18px; }
.guest-save-card,.guest-import-card { background:rgba(213,246,107,.045);border:1px solid rgba(213,246,107,.2);border-radius:17px;padding:22px;margin:24px 0;text-align:left; }
.guest-save-card h2 { font-size:22px;letter-spacing:-.6px;margin:0 0 10px; }
.guest-save-card p,.guest-import-card p { font-size:13px;line-height:1.65;color:var(--muted);margin:8px 0 17px; }
.guest-save-card .note { font-size:11px;margin-bottom:0; }
.guest-import-card { margin:0 0 23px; }
.guest-import-card .primary { font-size:13px; }
.guest-import-card .text-button { display:block;margin:8px auto 0; }
.guest-import-card .account-email { color:var(--ink); }
.import-conflicts { border-left:2px solid #d5f66b70;padding-left:14px;margin:20px 0; }
.import-conflicts p { font-size:12px; }
.completion .completion-learning-note { font-size:12px; }
.completion-later { display:block;margin:14px auto;min-height:40px; }
@media(max-width:760px) {
 body.guest-practice.practice-focus .web-layout { margin-top:0;padding:0 10px; }
 body.guest-practice.practice-focus .site-header { padding:14px 20px; }
 body.guest-practice.practice-focus .site-brand { font-size:23px; }
 body.guest-practice.practice-focus .site-brand .brand-icon { width:32px;height:32px; }
 body.guest-practice.practice-focus .brand-suffix { font-size:8px; }
 body.guest-practice.practice-focus .header-account { min-height:38px;padding:8px 12px;font-size:12px; }
 body.guest-practice.practice-focus .question-title { font-size:25px; }
 body.guest-practice.practice-focus .question-stem { font-size:15px;line-height:1.55; }
 body.guest-practice.practice-focus .quiz-header { margin-bottom:13px; }
 body.guest-practice.practice-focus .answer-option { min-height:48px;padding:11px;font-size:13px; }
 body.guest-practice.practice-focus .draft-strip { font-size:9px;margin-bottom:13px; }
 body.guest-practice.practice-focus .quiz-bottom { padding-top:13px;padding-bottom:13px; }
 .guest-save-card,.guest-import-card { padding:18px; }
}

.guest-loading { padding:35px 8px; }.guest-loading h1 { font-size:32px;line-height:1.2;letter-spacing:-1px; }.guest-loading p { color:var(--muted);font-size:14px; }

.intro-about { margin-top:20px; }.auth-divider { display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--muted);font-size:12px; }.auth-divider::before,.auth-divider::after { content:'';height:1px;background:var(--line);flex:1; }.google-auth-button { display:block;width:180px;height:40px;margin:16px auto 0;padding:0;border:0;border-radius:4px;background:transparent;cursor:pointer; }.google-auth-button img { display:block;width:180px;height:40px; }.google-auth-button:focus-visible { outline:3px solid var(--lime);outline-offset:4px; }.google-auth-button:disabled { opacity:.55;cursor:wait; }

/* Answer results use text, icons, and opaque color surfaces together. */
.visually-hidden { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
.answer-copy { display:flex;flex-direction:column;gap:5px;min-width:0; }
.answer-options.is-answered .answer-option { opacity:1;-webkit-text-fill-color:currentColor;cursor:default; }
.answer-options.is-answered .answer-option.correct { background:#164b35;border:2px solid #65e49c;color:#f0fff5;box-shadow:none; }
.answer-options.is-answered .answer-option.incorrect { background:#632834;border:2px solid #ff929c;color:#fff4f4;box-shadow:none; }
.answer-options.is-answered .answer-option.correct .answer-letter { color:#0b3521;background:#9df7c2;border-color:#9df7c2; }
.answer-options.is-answered .answer-option.incorrect .answer-letter { color:#521521;background:#ffc1c7;border-color:#ffc1c7; }
.answer-result-label { display:flex;align-items:center;gap:6px;font-size:12px;font-weight:750;line-height:1.4; }
.answer-result-label svg { width:17px;height:17px;stroke-width:2.7;flex-shrink:0; }
.answer-result-summary { display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;border:2px solid;padding:10px 13px;border-radius:11px;margin:0 0 11px;font-size:14px;line-height:1.35; }
.answer-result-summary svg { width:21px;height:21px;stroke-width:2.7;flex-shrink:0; }
.answer-result-summary strong { font-size:16px; }
.answer-result-summary span { margin-left:auto;font-size:13px; }
.answer-result-summary.is-correct,.feedback-status.is-correct { color:#f0fff5;background:#164b35;border-color:#65e49c; }
.answer-result-summary.is-incorrect,.feedback-status.is-incorrect { color:#fff4f4;background:#632834;border-color:#ff929c; }
.feedback-status { display:flex;align-items:center;gap:10px;border:2px solid;border-radius:12px;padding:13px 15px;margin:0 0 17px;font-size:21px;font-weight:750; }
.feedback-status svg { width:25px;height:25px;stroke-width:2.7; }
.quiz-bottom { z-index:3; }
.feedback { scroll-margin-top:20px; }
.question-tools { display:flex;margin:-5px 0 18px; }
.lab-reference-button { display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:9px 13px;border:1px solid #68829f;border-radius:10px;background:#22344c;color:#edf5ff;font-size:13px;font-weight:600; }
.lab-reference-button svg { width:17px;height:17px; }
.lab-reference-button:hover { background:#2d4563; }
.modal.lab-reference-modal { --lab-dialog-padding:24px;max-width:680px;padding:0;overscroll-behavior:contain; }
.lab-reference-modal .modal-icon { display:none; }
.lab-reference-modal .modal-heading { position:sticky;top:0;z-index:2;background:#1d3048;margin:0;padding:20px var(--lab-dialog-padding) 15px;border-bottom:1px solid #49617e; }
.lab-reference-content { padding:18px var(--lab-dialog-padding) var(--lab-dialog-padding); }
.lab-reference-modal .modal-heading h2 { font-size:24px; }
.lab-reference-modal .modal-heading .icon-button { width:42px;height:42px;margin-top:-5px; }
.lab-values-table { border-collapse:collapse;width:100%;margin:23px 0 28px;font-size:12px;line-height:1.45;table-layout:fixed; }
.lab-values-table caption { text-align:left;font-size:16px;font-weight:650;color:var(--ink);padding-bottom:10px; }
.lab-values-table th,.lab-values-table td { text-align:left;vertical-align:top;border-bottom:1px solid #425773;padding:9px 8px;overflow-wrap:anywhere; }
.lab-values-table thead th { color:#c5d5e9;background:#233750;font-size:11px;font-weight:600; }
.lab-values-table th:first-child { width:44%;padding-left:0; }
.lab-values-table th:nth-child(2) { width:29%; }
.lab-values-table th:nth-child(3) { width:27%; }
.lab-values-table tbody th { color:#edf3fc;font-weight:500; }
.lab-values-table td { color:#dbe8f6; }
.lab-values-table th small { display:block;font-size:10px;font-weight:400;color:#b9cbe0;margin-top:4px; }
.lab-reference-content>.lab-values-table:first-child { margin-top:0; }
.lab-values-matches caption { color:var(--lime); }
.lab-values-table .lab-value-highlight th,.lab-values-table .lab-value-highlight td { background:#493b1d;color:#fff7db;border-bottom-color:#a78f52; }
.lab-values-table .lab-value-highlight th:first-child { border-left:3px solid var(--lime);padding-left:10px; }
.lab-values-table .lab-value-highlight th small { color:#ece0bb; }
.lab-reference-sources { border-top:1px solid var(--line);padding-top:15px;margin-bottom:23px; }
.lab-reference-sources h3 { margin:0 0 10px;font-size:14px; }
.lab-reference-sources ul { padding-left:19px;margin:0; }
.lab-reference-sources li { font-size:11px;line-height:1.6;margin-bottom:9px; }
.lab-reference-sources a { color:var(--lime); }
.lab-reference-sources li span { display:block;color:var(--muted); }
@media(max-width:480px) {
  .answer-result-summary { padding:9px 10px;gap:7px; }
  .answer-result-summary strong { font-size:15px; }
  .answer-result-summary span { font-size:12px; }
  .answer-result-label { font-size:11px; }
  .modal.lab-reference-modal { --lab-dialog-padding:20px; }
  .lab-reference-modal .modal-heading h2 { font-size:22px; }
  .lab-values-table { font-size:11px; }
  .lab-values-table th,.lab-values-table td { padding:9px 5px; }
  .lab-values-table th:first-child { width:44%; }
  .lab-values-table th:nth-child(2) { width:28%; }
  .lab-values-table th:nth-child(3) { width:28%; }
}