:root {
  color-scheme: light;
  --ink: #132638;
  --muted: #536675;
  --navy: #0f2f46;
  --sea: #1f766f;
  --sea-soft: #dcecea;
  --sand: #f4efe5;
  --paper: #fffdf8;
  --line: #d9dedf;
  --error: #9f2f2f;
  --success: #246346;
  --shadow: 0 24px 70px rgba(15, 47, 70, 0.12);
  --radius: 20px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { background: var(--sand); scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: linear-gradient(180deg, #f7f3eb 0%, #eef4f3 100%); min-height: 100vh; }
a { color: var(--sea); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid #f2b65f; outline-offset: 3px; }
.skip-link { position: fixed; left: 1rem; top: 1rem; transform: translateY(-200%); z-index: 50; background: white; padding: .75rem 1rem; border-radius: 8px; }
.skip-link:focus { transform: translateY(0); }
.site-header { background: var(--navy); color: white; padding: 1rem clamp(1rem, 4vw, 4rem); display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand { color:white; text-decoration:none; font-weight:800; letter-spacing:.045em; text-transform:uppercase; }
.environment-badge { border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.35rem .7rem; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; }
.shell { width:min(1040px, calc(100% - 2rem)); margin: clamp(2rem, 6vw, 5rem) auto; }
.hero, .panel { background:rgba(255,253,248,.96); border:1px solid rgba(15,47,70,.12); border-radius:var(--radius); box-shadow:var(--shadow); }
.hero { display:grid; grid-template-columns:1.1fr .9fr; overflow:hidden; }
.hero-copy { padding:clamp(2rem,5vw,5rem); }
.hero-aside { background:var(--navy); color:white; padding:clamp(2rem,5vw,4rem); display:flex; flex-direction:column; justify-content:center; }
.eyebrow { color:var(--sea); font-size:.82rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
h1 { font-family: Georgia, "Times New Roman", serif; font-size:clamp(2.2rem,6vw,4.5rem); line-height:1.04; margin:.45rem 0 1.25rem; font-weight:600; letter-spacing:-.025em; }
h2 { font-family: Georgia, "Times New Roman", serif; font-size:clamp(1.8rem,4vw,2.7rem); line-height:1.15; margin:0 0 .65rem; }
h3 { margin:0 0 .5rem; }
.lead { font-size:1.12rem; line-height:1.7; color:var(--muted); max-width:62ch; }
.hero-aside ul { padding-left:1.2rem; line-height:1.8; }
.actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.5rem; }
.button, button { appearance:none; border:0; border-radius:12px; padding:.85rem 1.2rem; font:inherit; font-weight:750; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; min-height:46px; }
.button.primary, button.primary { background:var(--sea); color:white; }
.button.secondary, button.secondary { background:transparent; color:var(--navy); border:1px solid var(--navy); }
button.ghost { background:transparent; color:var(--muted); text-decoration:underline; padding-inline:.4rem; }
button:disabled { opacity:.55; cursor:not-allowed; }
.panel { padding:clamp(1.4rem,4vw,3rem); }
.panel.narrow { max-width:760px; margin-inline:auto; }
.notice { background:var(--sea-soft); border-left:4px solid var(--sea); padding:1rem 1.1rem; border-radius:10px; line-height:1.55; }
.development-note { background:#fff4dc; border:1px solid #e8c777; padding:.8rem; border-radius:10px; color:#5d4511; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem 1.25rem; }
.field { display:flex; flex-direction:column; gap:.45rem; }
.field.full { grid-column:1/-1; }
label, legend { font-weight:720; }
input, textarea, select { width:100%; border:1px solid #aebbc1; border-radius:10px; background:white; color:var(--ink); font:inherit; padding:.78rem .85rem; min-height:46px; }
textarea { resize:vertical; line-height:1.5; }
.checkbox-line { display:grid; grid-template-columns:auto 1fr; gap:.65rem; align-items:start; font-weight:500; }
.checkbox-line input { width:1.15rem; min-height:auto; margin-top:.2rem; }
.status { margin:1rem 0; padding:.9rem 1rem; border-radius:10px; background:#eef2f3; }
.status[data-kind="error"] { color:var(--error); background:#f9e7e7; }
.status[data-kind="success"] { color:var(--success); background:#e5f3e9; }
.status[data-kind="warning"] { color:#705411; background:#fff3d2; }
.success-card { text-align:center; padding:2rem; }
.code { font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:.9rem; word-break:break-all; }
.assessment-layout { display:grid; grid-template-columns:220px minmax(0,1fr); gap:1.4rem; align-items:start; }
.progress-panel { position:sticky; top:1rem; background:var(--navy); color:white; border-radius:var(--radius); padding:1.25rem; }
progress { width:100%; accent-color:#6bc2b6; }
.progress-panel p { margin:.6rem 0 0; }
.question-card { border:0; border-top:1px solid var(--line); padding:1.6rem 0; margin:0; }
.question-card:first-of-type { border-top:0; }
.question-card[data-invalid="true"] { border-left:4px solid var(--error); padding-left:1rem; }
legend { float:left; width:100%; font-size:1.08rem; line-height:1.5; margin-bottom:.65rem; }
legend + * { clear:both; }
.question-number { display:inline-grid; place-items:center; width:2rem; height:2rem; border-radius:50%; background:var(--sea-soft); color:var(--sea); font-size:.84rem; margin-right:.35rem; }
.question-help, .screen-intro { color:var(--muted); line-height:1.6; }
.choice-grid { display:grid; gap:.65rem; }
.choice-grid.compact { grid-template-columns:repeat(2,minmax(0,1fr)); }
.choice { display:grid; grid-template-columns:auto 1fr; gap:.7rem; align-items:start; background:white; border:1px solid var(--line); border-radius:12px; padding:.85rem; font-weight:520; line-height:1.45; cursor:pointer; }
.choice:has(input:checked) { border-color:var(--sea); background:var(--sea-soft); }
.choice input { width:1.1rem; min-height:auto; margin-top:.15rem; accent-color:var(--sea); }
.other-answer { margin-top:.8rem; max-width:560px; }
.character-count { display:block; text-align:right; color:var(--muted); font-size:.82rem; margin-top:.25rem; }
.field-error { color:var(--error); font-weight:700; }
.questionnaire-footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; border-top:1px solid var(--line); padding-top:1.25rem; margin-top:1rem; }
.footer-actions { display:flex; gap:.65rem; }
.save-state { color:var(--muted); font-size:.9rem; }
.security-box { border:1px solid var(--line); background:#f8faf9; border-radius:12px; padding:1rem; margin:1rem 0; }
.resume-panel { margin-top:1rem; padding:1rem; background:var(--sea-soft); border-radius:12px; }
.site-footer { text-align:center; color:var(--muted); padding:2rem 1rem 3rem; font-size:.9rem; }
@media (max-width: 820px) {
  .hero, .assessment-layout { grid-template-columns:1fr; }
  .progress-panel { position:static; }
  .form-grid, .choice-grid.compact { grid-template-columns:1fr; }
  .questionnaire-footer { align-items:flex-start; flex-direction:column; }
  .footer-actions { width:100%; }
  .footer-actions button { flex:1; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }