
@font-face{font-family:'Archivo Black';src:url('/fonts/archivo-black.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Outfit';src:url('/fonts/outfit.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Outfit';src:url('/fonts/outfit-bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
:root{color-scheme:dark;--background:#171717;--foreground:#fff;--card:#1d1e20;--card-foreground:#fff;--popover:#1d1e20;--popover-foreground:#fff;--primary:#235a97;--primary-foreground:#fff;--secondary:#24272c;--secondary-foreground:#fff;--muted:#262a30;--muted-foreground:#b0b5bd;--accent:#a8cff6;--accent-foreground:#171717;--destructive:#ffb7b7;--border:#3c424b;--input:#747c89;--ring:#a8cff6;--radius:0.875rem;--scrollbar-thumb:#646c78;--scrollbar-track:#171717;--scrollbar-hover:#a0a8b2;--scrollbar-active:#a8cff6;--font-body:'Outfit',Arial,sans-serif;--font-display:'Archivo Black',Arial,sans-serif}
@theme inline{--color-background:var(--background);--color-foreground:var(--foreground);--color-card:var(--card);--color-card-foreground:var(--card-foreground);--color-primary:var(--primary);--color-primary-foreground:var(--primary-foreground);--color-secondary:var(--secondary);--color-secondary-foreground:var(--secondary-foreground);--color-muted:var(--muted);--color-muted-foreground:var(--muted-foreground);--color-accent:var(--accent);--color-accent-foreground:var(--accent-foreground);--color-destructive:var(--destructive);--color-border:var(--border);--color-input:var(--input);--color-ring:var(--ring);--font-sans:var(--font-body);--radius-md:var(--radius)}

*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track)}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:var(--scrollbar-track)}
::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border:2px solid var(--scrollbar-track);border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-hover)}
::-webkit-scrollbar-thumb:active{background:var(--scrollbar-active)}
html{scrollbar-gutter:stable}
body{margin:0;background:var(--background);color:var(--foreground);font-family:var(--font-body);font-size:1.125rem;line-height:1.5;-webkit-font-smoothing:antialiased}
button,a{-webkit-tap-highlight-color:transparent}
button:not(:disabled),a{cursor:pointer}
a{color:inherit;text-decoration:none}
button:disabled{cursor:not-allowed}
button:focus-visible,a:focus-visible{outline:2px solid var(--ring);outline-offset:5px}
h1:focus{outline:none}
::selection{background:var(--primary);color:var(--foreground)}
.site-shell{min-height:100svh;display:flex;flex-direction:column;border-top:3px solid var(--primary)}
.site-header{min-height:66px;padding:8px clamp(20px,5vw,80px);border-bottom:1px solid #ffffff12;display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.wordmark{display:block;flex-shrink:0}
.logo-crop{display:block;position:relative;width:110px;height:50px;overflow:hidden;isolation:isolate;background:var(--background);transform:translateY(5px) scale(.8);transform-origin:left center}
.logo-crop img{position:absolute;width:410px;max-width:none;height:auto;left:-148px;top:-21px;mix-blend-mode:screen}
.sound-toggle{color:var(--muted-foreground);padding:12px!important;min-height:44px;height:auto;font-size:1rem;gap:9px;border-radius:var(--radius);white-space:normal;min-width:0}
.sound-toggle{flex-shrink:1}.sound-toggle span{min-width:0}
.sound-toggle:hover{background:var(--secondary);color:var(--foreground)}
.quiz-main{flex:1;display:flex;justify-content:center;align-items:flex-start;padding:1rem 24px 16px}
.quiz-wrap{width:100%;max-width:640px;min-width:0}
.progress-meta{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;font-size:.875rem;letter-spacing:.035em;color:var(--muted-foreground);font-variant-numeric:tabular-nums}
.progress-meta>span:last-child{color:var(--accent);white-space:nowrap}
.progress-track{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin:10px 0 20px}
.progress-track span{height:3px;background:var(--border);transition:background 250ms}
.progress-track span.current{background:var(--accent)}
.progress-track span.done{background:var(--primary)}
h1{font-family:var(--font-display);font-size:clamp(1.75rem,3.2vw,2.375rem);line-height:1.16;letter-spacing:-.035em;text-transform:uppercase;font-weight:400;margin:0;max-width:640px;text-wrap:balance;overflow-wrap:break-word}
.question-description{font-size:1.125rem;color:var(--muted-foreground);margin:12px 0 16px;line-height:1.5}
.tap-instruction{margin:12px 0;font-size:1rem;color:var(--muted-foreground)}
.answer-list{display:grid;gap:10px}
.answer-option{display:flex;align-items:center;gap:1rem;width:100%;height:auto;min-height:64px;justify-content:flex-start;white-space:normal;text-align:left;padding:15px 17px!important;border:1px solid var(--border);background:var(--card);border-radius:var(--radius);font-weight:400;color:var(--foreground);transition:background .18s,border-color .18s,transform .18s}
.answer-option:hover{border-color:#79889b;background:var(--secondary)}
.answer-option:active{transform:scale(.993)}
.answer-option.selected{border-color:var(--accent);background:#1c2b3c}
.answer-option .answer-text{font-size:1.125rem;flex:1;line-height:1.45;min-width:0}
.answer-icon{width:17px;height:17px;color:var(--muted-foreground);flex-shrink:0}
.answer-option.selected .answer-icon{color:var(--accent)}
.answer-option:disabled{opacity:1;pointer-events:none}
.answer-list[aria-busy=true] .answer-option:not(.selected){opacity:.45}
.answer-feedback{min-height:42px;padding:12px 0 4px;display:flex;align-items:flex-start;gap:8px;color:var(--muted-foreground);font-size:1rem;line-height:1.5}
.answer-feedback svg{width:16px;height:16px;flex-shrink:0;margin-top:2px;color:var(--accent)}
.review-proof{padding:12px 16px;margin:1rem 0;background:var(--card);border-left:2px solid var(--accent)}
.review-proof blockquote{font-size:1.25rem;margin:0 0 4px}
.review-proof a{display:inline-block;font-size:.875rem;color:var(--muted-foreground);text-decoration:underline;text-underline-offset:3px}
.review-proof a:hover{color:var(--accent)}
.save-error{font-size:1rem;color:var(--destructive)}
.save-error p{margin:0 0 10px}
.save-error>a{display:inline-block;margin:12px 16px;text-decoration:underline;text-underline-offset:3px;color:var(--accent)}
.retry-button{min-height:44px;height:auto;white-space:normal;font-size:1rem}
.spinner{animation:spin .85s linear infinite}
.question-panel,.result-panel{animation:enter .28s ease-out}
.result-panel{text-align:left;padding-bottom:10px}
.eyebrow{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 12px;font-size:.875rem;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);font-weight:700;overflow-wrap:anywhere}
.result-panel h1{font-size:clamp(2rem,4vw,2.875rem);line-height:1.12}
.result-description{margin:14px 0 20px;font-size:1.125rem;color:var(--muted-foreground);line-height:1.5}
.primary-button{background:var(--primary);color:var(--primary-foreground);border:1px solid #5286bd;min-height:54px;height:auto;border-radius:var(--radius);padding:14px 24px!important;font-size:1.1875rem;font-weight:700;gap:15px;white-space:normal;transition:background .18s,transform .18s}
.primary-button:hover{background:#2d6cac}
.primary-button:active{transform:translateY(1px)}
.primary-button svg{width:19px;height:19px;flex-shrink:0}
.result-button{display:flex;margin:0 0 20px;width:100%}
.allocation{border:1px solid var(--border);border-radius:var(--radius);background:var(--card);padding:18px 20px;text-align:left;margin:0 0 14px}
.allocation-top{font-size:.875rem;letter-spacing:.04em;color:var(--muted-foreground)}
.stock-number{display:flex;align-items:center;flex-wrap:wrap;gap:15px;margin:10px 0 14px}
.stock-number strong{font-family:var(--font-display);font-size:3.1875rem;font-weight:400;line-height:1;color:var(--accent);letter-spacing:-.04em}
.stock-number>span{font-size:1.125rem;line-height:1.5;color:var(--muted-foreground)}
.stock-number b{font-weight:400;color:var(--foreground)}
.stock-meter{height:4px;background:var(--border);border-radius:2px}
.stock-meter span{display:block;height:100%;background:var(--accent);border-radius:inherit}
.reservation-note{font-size:.875rem;line-height:1.5;margin:0;color:var(--muted-foreground)}
.site-footer{padding:15px clamp(20px,5vw,80px);display:flex;justify-content:space-between;flex-wrap:wrap;gap:9px;border-top:1px solid #ffffff12;color:var(--muted-foreground);font-size:.875rem}
.site-footer>span:first-child{letter-spacing:.08em}
@keyframes enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:640px){.site-header{min-height:61px;padding:6px 18px}.logo-crop{width:100px;height:45px}.logo-crop img{width:374px;left:-135px;top:-19px}.sound-toggle{padding:9px 6px!important}.quiz-main{padding:.75rem 20px 12px}.progress-track{margin:9px 0 18px}.question-description{margin:11px 0 15px}.answer-option{padding:14px!important;gap:.75rem}.result-description{margin:12px 0 17px}.result-button{margin-bottom:17px}.allocation{padding:16px}.site-footer{justify-content:center;text-align:center;padding:13px 20px}.site-footer>span:first-child{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){*{scrollbar-color:auto}.answer-option.selected{border:2px solid Highlight}.progress-track span.done,.progress-track span.current,.stock-meter span{background:Highlight;forced-color-adjust:none}button:focus-visible,a:focus-visible{outline-color:Highlight}}

.intro-panel{padding-top:8px}.intro-panel .question-description{margin:16px 0}.intro-panel .result-button{margin-top:24px;margin-bottom:12px}.intro-meta{font-size:1rem;color:var(--muted-foreground);margin:0;text-align:center}

/* One heading-to-choice rhythm across every quiz screen. */
.question-panel > .answer-list{margin-top:24px}
.question-note{font-size:1.125rem;line-height:1.5;color:var(--muted-foreground);margin:16px 0 0}
.question-panel > .review-proof{margin:16px 0 0}
.intro-meta{text-align:left;line-height:1.5}
.intro-saber{position:relative;width:100%;height:clamp(140px,40vw,340px);flex-shrink:0;margin:0 0 -12px;overflow:hidden;background:#000}
.intro-saber img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 50%;transform:scale(1.15)}
.intro-saber::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,transparent 68%,var(--background) 100%)}

.intro-shell{border-top:0}
.intro-shell .site-header{background:#000;border-bottom:0}
.intro-shell .logo-crop{background:#000}

/* Belief-building copy precedes each question; shared answer controls stay unchanged. */
.question-belief { color: var(--muted-foreground); font-size: 1rem; line-height: 1.5; margin: 1rem 0 0; }
.question-belief p { margin: 0 0 .45rem; }
.question-belief p:last-child { margin-bottom: 0; }
.question-panel h1 { text-transform: uppercase; font-size: clamp(1.75rem, 3.2vw, 2.375rem); line-height: 1.25; letter-spacing: -.025em; }

/* Budget-result shell; offer cards use win's canonical reward CSS. */
.budget-results .site-header{min-height:58px;padding:5px 18px}
.budget-results .logo-crop{height:44px}
.budget-results .quiz-main{padding:16px 18px max(12px,env(safe-area-inset-bottom))}
.budget-results .quiz-wrap{max-width:540px}
.budget-results .progress-meta,.budget-results .progress-track,.budget-results .eyebrow,.budget-results .reservation-note,.budget-results .site-footer{display:none}
.budget-results .result-panel{padding-bottom:0}
.budget-results .result-panel h1{font-size:1.75rem;line-height:1.15;letter-spacing:-.025em;text-wrap:initial}

/* Katana opening: an invitation grounded in honor. */
.intro-shell .intro-saber{height:auto;aspect-ratio:1290/680;margin-bottom:0}
.intro-shell .intro-saber img{transform:none;object-fit:contain}
.intro-shell .intro-panel{border-top:1px solid #75899755;padding-top:18px}
.intro-shell .intro-panel .eyebrow{letter-spacing:.14em;font-size:.8rem}
.intro-shell .intro-panel h1{font-size:clamp(1.65rem,6vw,2.65rem);line-height:1.13;letter-spacing:-.025em}
.intro-shell .intro-panel .question-description{letter-spacing:.12em;font-size:.85rem;margin:14px 0}
.intro-shell .intro-panel .result-button{margin-top:8px}
.intro-shell .intro-meta{font-size:.8rem;letter-spacing:.04em}

/* Desktop opens directly on the invitation. */
.intro-saber picture{display:block;width:100%;height:100%}
@media(min-width:900px){
 .intro-shell .intro-saber{display:none}
 .intro-shell .quiz-main{display:flex;align-items:center;justify-content:flex-start;padding:48px clamp(40px,5vw,80px)}
 .intro-shell .quiz-wrap{width:100%;max-width:820px;margin:0}
 .intro-shell .intro-panel{border:0;padding:0;text-align:left}
 .intro-shell .intro-panel .eyebrow{justify-content:flex-start}
 .intro-shell .intro-panel h1{font-size:clamp(2.25rem,4vw,3.5rem);line-height:1.12}
 .intro-shell .intro-panel .result-button{max-width:480px;margin:28px 0 12px}
 .intro-shell .intro-meta{text-align:left}
}
