:root {
  --ink: #102033;
  --muted: #5d6c7d;
  --soft: #edf2f7;
  --line: #d8e0e9;
  --blue: #0b57b7;
  --blue-dark: #073f86;
  --blue-soft: #eaf2fd;
  --white: #ffffff;
  --danger: #b42318;
  --shadow: 0 16px 44px rgba(16,32,51,.08);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: #f4f7fa;
  font-synthesis: none;
}
* { box-sizing: border-box; }
html { min-width: 320px; max-width:100%; overflow-x:clip; scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; max-width:100%; overflow-x:clip; background: linear-gradient(180deg,#eef3f8 0,#f7f9fb 220px,#f4f7fa 100%); }
button,input,select,textarea { font: inherit; }
button { cursor: pointer; }
button:disabled,input:disabled,select:disabled,textarea:disabled { cursor:not-allowed; opacity:.58; }
:where(a,button,input,select,textarea):focus-visible { outline:3px solid #78aee9; outline-offset:2px; }
.skip-link { position: fixed; z-index: 99; left: 1rem; top: -4rem; background: var(--ink); color: white; padding: .75rem 1rem; border-radius: .5rem; }
.skip-link:focus-visible { top: 1rem; }
.topbar { height: 78px; padding: 0 clamp(1rem,4vw,4.5rem); display: flex; align-items: center; gap: .85rem; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--line); }
.brand-mark { width: 38px; height: 38px; background: var(--blue); border-radius: 9px; position: relative; flex: 0 0 auto; }
.brand-mark span,.brand-mark i,.brand-mark b { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: white; }
.brand-mark span { left: 8px; top: 16px; }.brand-mark i { right: 7px; top: 8px; }.brand-mark b { right: 7px; bottom: 8px; }
.brand-mark::before,.brand-mark::after { content:""; position:absolute; width:17px; height:2px; left:13px; background:white; transform-origin:left center; }
.brand-mark::before { top:17px; transform:rotate(-27deg); }.brand-mark::after { top:20px; transform:rotate(27deg); }
.brand-copy { display:flex; flex-direction:column; line-height:1.2; }.brand-copy strong { font-size:1.05rem; letter-spacing:-.01em; }.brand-copy span { color:var(--muted); font-size:.78rem; margin-top:.18rem; }
.header-actions { margin-left:auto; display:flex; align-items:center; gap:1rem; }
.language-selector { display:flex; align-items:center; gap:.38rem; color:#789; font-size:.8rem; white-space:nowrap; }
.language-selector button { min-height:38px; border:0; border-bottom:2px solid transparent; background:transparent; color:#506174; padding:.42rem .28rem; font-weight:650; }
.language-selector button:hover { color:var(--blue); }
.language-selector button[aria-pressed="true"] { color:var(--blue-dark); border-bottom-color:var(--blue); }
.prototype-badge { border:1px solid #bdd0e8; background:#f5f9fe; color:#184f8d; padding:.38rem .65rem; border-radius:999px; font-size:.78rem; font-weight:650; white-space:nowrap; }
.app-shell { width:min(1180px,calc(100% - 2rem)); margin:2rem auto; display:grid; grid-template-columns:270px minmax(0,1fr); align-items:start; gap:1.5rem; }
.progress-panel,.workspace { background:var(--white); border:1px solid var(--line); box-shadow:var(--shadow); }
.progress-panel { border-radius:16px; padding:1.25rem; position:sticky; top:1.5rem; }
.progress-intro { display:flex; justify-content:space-between; gap:.75rem; align-items:baseline; font-size:.82rem; color:var(--muted); }.progress-intro strong { color:var(--blue); font-size:.78rem; }
.progress-track { height:7px; background:var(--soft); overflow:hidden; border-radius:999px; margin:.7rem 0 1.25rem; }.progress-track span { display:block; height:100%; width:14.28%; background:var(--blue); transition:width .25s ease; }
#step-nav { display:grid; gap:.15rem; }
.mobile-step-picker { display:none; }
.step-link { width:100%; display:flex; align-items:center; gap:.7rem; border:0; background:transparent; color:#6a7787; text-align:left; padding:.65rem .5rem; border-radius:.55rem; font-size:.88rem; }
.step-link .num { width:25px; height:25px; border:1px solid #cad4df; border-radius:50%; display:grid; place-items:center; font-size:.72rem; flex:0 0 auto; }
.step-link.active { background:var(--blue-soft); color:var(--blue-dark); font-weight:700; }.step-link.active .num { background:var(--blue); border-color:var(--blue); color:white; }.step-link.complete .num { border-color:#7fa1c9; color:var(--blue); }
.privacy-note { border-top:1px solid var(--line); margin-top:1.1rem; padding-top:1.1rem; display:flex; gap:.7rem; }.privacy-note svg { width:22px; height:22px; stroke:var(--blue); fill:none; stroke-width:1.8; flex:0 0 auto; }.privacy-note div { display:flex; flex-direction:column; gap:.18rem; }.privacy-note strong { font-size:.78rem; }.privacy-note span { color:var(--muted); font-size:.72rem; line-height:1.4; }
.workspace { border-radius:18px; min-height:590px; overflow:hidden; }
.step-header { padding:2rem 2.25rem 1.4rem; border-bottom:1px solid var(--line); }.eyebrow { color:var(--blue); text-transform:uppercase; font-size:.75rem; font-weight:800; letter-spacing:.09em; }.step-header h1 { font-size:clamp(1.7rem,3vw,2.25rem); letter-spacing:-.035em; margin:.55rem 0 .55rem; }.step-header p { margin:0; color:var(--muted); max-width:68ch; line-height:1.55; }
.form-body { padding:1.9rem 2.25rem 2.2rem; }.field { margin-bottom:1.6rem; }.field:last-child { margin-bottom:0; }.field-label, legend { display:block; font-size:.93rem; font-weight:750; margin-bottom:.6rem; }.hint { display:block; color:var(--muted); font-size:.8rem; font-weight:400; margin:.22rem 0 .65rem; line-height:1.45; }
fieldset { border:0; padding:0; margin:0 0 1.65rem; min-width:0; }
input[type="text"],select,textarea { width:100%; border:1px solid #bbc8d6; background:white; color:var(--ink); border-radius:8px; padding:.78rem .85rem; min-height:46px; outline:none; transition:border-color .15s,box-shadow .15s; }
textarea { min-height:110px; resize:vertical; line-height:1.5; }
input[type="text"]:focus-visible,select:focus-visible,textarea:focus-visible { border-color:var(--blue); box-shadow:0 0 0 3px rgba(11,87,183,.13); }
.grid-2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.1rem; }.choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; }.choice-grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.choice { position:relative; display:flex; gap:.65rem; align-items:flex-start; min-height:46px; min-width:0; padding:.75rem .8rem; border:1px solid #ccd6e0; border-radius:8px; color:#34465a; background:#fff; cursor:pointer; line-height:1.35; font-size:.88rem; overflow-wrap:anywhere; }
.choice:hover { border-color:#8fa9c5; }.choice:has(input:checked) { border-color:var(--blue); background:var(--blue-soft); color:#093f83; }.choice:has(input:focus-visible) { border-color:var(--blue); box-shadow:0 0 0 3px rgba(11,87,183,.13); }.choice:has(input:disabled) { cursor:not-allowed; opacity:.58; }.choice input { width:18px; height:18px; margin:.08rem 0 0; accent-color:var(--blue); flex:0 0 auto; }
.form-actions { margin-top:2rem; padding-top:1.35rem; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:.75rem; }.form-actions.single { justify-content:flex-end; }.button { min-height:44px; border:1px solid transparent; border-radius:8px; padding:.7rem 1.05rem; font-weight:750; display:inline-flex; align-items:center; justify-content:center; gap:.5rem; }.button-primary { background:var(--blue); color:white; }.button-primary:hover { background:var(--blue-dark); }.button-secondary { background:white; color:#30445b; border-color:#bdc9d6; }.button-secondary:hover { background:#f5f8fb; }.button-quiet { background:transparent; border-color:transparent; color:var(--blue); }.button-quiet:hover { background:var(--blue-soft); }.button-danger { background:#a92b22; color:white; }.button-danger:hover { background:#84251d; }
.error-summary { border:1px solid #efb6b1; background:#fff3f2; color:#84251d; padding:1rem; border-radius:8px; margin-bottom:1.35rem; }.error-summary strong { display:block; margin-bottom:.2rem; }.error-summary ul { margin:.45rem 0 0; padding-left:1.25rem; }.invalid { border-color:var(--danger)!important; }.invalid-group .choice { border-color:#d88b84; }.field-error { color:var(--danger); font-size:.82rem; font-weight:650; line-height:1.45; margin:.5rem 0 0; }
.review-grid { display:grid; gap:1rem; }.review-card { border:1px solid var(--line); border-radius:10px; padding:1rem 1.1rem; min-width:0; }.review-card header { display:flex; align-items:center; justify-content:space-between; gap:1rem; }.review-card h2 { margin:0; font-size:1rem; }.review-card dl { margin:.8rem 0 0; display:grid; grid-template-columns:160px minmax(0,1fr); gap:.48rem 1rem; font-size:.84rem; }.review-card dt { color:var(--muted); }.review-card dd { margin:0; overflow-wrap:anywhere; white-space:pre-wrap; }
.result-header { padding:1.8rem 2.25rem; background:#0d2746; color:white; }.result-header .eyebrow { color:#a9cdf9; }.result-header h1 { margin:.45rem 0 .4rem; font-size:clamp(1.7rem,3vw,2.2rem); }.result-header p { margin:0; color:#cfdae7; line-height:1.5; }
.result-toolbar { display:flex; gap:.65rem; flex-wrap:wrap; padding:1rem 2.25rem; border-bottom:1px solid var(--line); background:#f8fafc; position:sticky; top:0; z-index:2; }
.brief { padding:1.5rem 2.25rem 2.25rem; }.brief-section { padding:1.2rem 0; border-bottom:1px solid var(--line); }.brief-section:last-child { border-bottom:0; }.brief-section h2 { margin:0 0 .7rem; font-size:1.05rem; color:#143a66; }.brief-section p { margin:.4rem 0; line-height:1.6; color:#33465a; }.brief-section ul { margin:.45rem 0 0; padding-left:1.2rem; }.brief-section li { margin:.38rem 0; line-height:1.5; color:#33465a; }
.interpretation { background:#f2f7fd; border:1px solid #c9dcf3; border-radius:12px; padding:1.15rem 1.2rem; }.interpretation h2 { margin:0 0 .35rem; }.legend { display:flex; gap:.5rem; flex-wrap:wrap; margin:.8rem 0 1rem; }.legend span { font-size:.72rem; padding:.3rem .48rem; border:1px solid #c4d4e6; background:white; border-radius:4px; }.tech-card { background:white; border-left:3px solid var(--blue); padding:.9rem 1rem; margin:.75rem 0; border-radius:0 7px 7px 0; }.tech-card h3 { margin:0 0 .45rem; font-size:.98rem; color:var(--ink); }.tech-card p { margin:.35rem 0 0; font-size:.86rem; }.tech-card .matched { padding:.55rem .65rem; background:#f7f9fc; border-radius:5px; }.tech-card .conditional { border-left:2px solid #91a5bb; padding-left:.65rem; }.verification { margin-top:.7rem!important; font-size:.8rem!important; color:var(--muted)!important; }
.commercial-handoff { margin:0 2.25rem 2.25rem; padding:1.35rem 1.45rem; border:1px solid #bdd0e8; border-radius:12px; background:#f7faff; }.commercial-handoff h2 { margin:0 0 .55rem; color:#143a66; font-size:1.15rem; }.commercial-handoff>p { max-width:72ch; color:#33465a; line-height:1.55; }.commercial-handoff-link { width:fit-content; margin-top:.65rem; text-decoration:none; }.commercial-handoff-support { margin:.8rem 0 0; font-size:.82rem; }.commercial-handoff-trust { margin:.35rem 0 0; font-size:.82rem; font-weight:700; color:#253b52!important; }
.print-brand,.print-context { display:none; }
#toast { position:fixed; left:50%; bottom:1.25rem; max-width:min(92vw,560px); transform:translate(-50%,120px); background:#14283e; color:white; padding:.75rem 1rem; border-radius:8px; box-shadow:var(--shadow); font-size:.85rem; transition:transform .2s; z-index:20; } #toast.show { transform:translate(-50%,0); } #toast.error { background:#84251d; }
dialog { width:min(460px,calc(100% - 2rem)); border:0; border-radius:12px; padding:0; color:var(--ink); box-shadow:0 24px 72px rgba(16,32,51,.28); } dialog::backdrop { background:rgba(16,32,51,.52); }.dialog-card { padding:1.35rem; }.dialog-card h2 { margin:0 0 .55rem; font-size:1.25rem; }.dialog-card p { margin:0; color:var(--muted); line-height:1.55; }.dialog-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:.65rem; margin-top:1.35rem; }
footer { width:min(1180px,calc(100% - 2rem)); margin:0 auto 1.5rem; display:flex; justify-content:space-between; align-items:flex-start; gap:2rem; color:#657386; font-size:.72rem; } footer p { margin:0; max-width:720px; text-align:right; line-height:1.45; }
@media (max-width:850px) { .app-shell { grid-template-columns:1fr; margin-top:1rem; }.progress-panel { position:static; }.progress-panel #step-nav { display:none; }.mobile-step-picker { display:block; margin-top:1rem; }.mobile-step-picker label { display:block; font-size:.78rem; font-weight:750; margin-bottom:.4rem; }.mobile-step-picker select { min-height:44px; }.privacy-note { margin-top:1rem; }.workspace { min-height:0; } }
@media (max-width:620px) { .topbar { height:auto; min-height:70px; padding:.8rem 1rem; flex-wrap:wrap; }.brand-copy { min-width:0; flex:1; }.brand-copy span { max-width:30ch; }.header-actions { width:100%; margin-left:46px; justify-content:space-between; gap:.65rem; }.language-selector button { min-height:44px; }.prototype-badge { font-size:.72rem; padding:.32rem .52rem; }.app-shell { width:min(100% - 1rem,1180px); gap:.75rem; }.progress-panel { border-radius:12px; padding:1rem; }.workspace { border-radius:12px; }.step-header,.form-body,.result-header,.brief { padding-left:1.15rem; padding-right:1.15rem; }.result-toolbar { padding:.85rem 1.15rem; position:static; }.grid-2,.choice-grid,.choice-grid.three { grid-template-columns:1fr; }.review-card header { align-items:flex-start; }.review-card dl { grid-template-columns:1fr; gap:.15rem; }.review-card dd { margin-bottom:.6rem; }.form-actions { flex-wrap:wrap; }.form-actions.single .button-primary,.form-actions .button-primary { margin-left:auto; }.button { min-height:46px; }.commercial-handoff { margin:0 1.15rem 1.15rem; padding:1.1rem; }.commercial-handoff-link { width:100%; } footer { flex-direction:column; gap:.45rem; } footer p { text-align:left; } }
@page { margin:14mm 15mm 16mm; }
@media print { html,body { width:auto; min-width:0; overflow:visible; background:white; color:#102033; font-size:10.5pt; }.skip-link,.topbar,.progress-panel,.result-toolbar,.commercial-handoff,body>footer,#toast,dialog { display:none!important; }.app-shell { display:block; width:100%; margin:0; }.workspace { min-height:0; overflow:visible; border:0; box-shadow:none; }.print-brand { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; padding:0 0 .55rem; border-bottom:1px solid #9aa8b7; color:#102033; }.print-brand strong { font-size:13pt; }.print-brand span { font-size:9pt; color:#4f6073; }.result-header { background:white; color:#102033; border-bottom:2px solid #102033; padding:.85rem 0 1rem; break-after:avoid-page; }.result-header .eyebrow { color:#33465a; }.result-header p { display:none; }.result-header h1 { font-size:22pt; }.brief { padding:0; }.print-context { display:block; margin:1rem 0 .35rem; padding:.65rem .75rem; border:1px solid #c8d1dc; color:#33465a; font-size:9pt; line-height:1.45; }.brief-section { padding:.9rem 0; break-inside:auto; }.brief-section h2 { break-after:avoid-page; page-break-after:avoid; }.brief-section p,.brief-section li { orphans:3; widows:3; }.brief-section li { break-inside:avoid; }.interpretation { background:white; border:0; border-radius:0; padding:.9rem 0 0; }.legend span { border-color:#9eabb8; }.tech-card { border:1px solid #c8d1dc; border-left:3px solid #315d91; border-radius:0 5px 5px 0; break-inside:avoid-page; page-break-inside:avoid; }.tech-card .matched { background:#f3f5f7; } }
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; transition:none!important; } }