@import url("https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600&family=Geist+Mono:wght@400;500&family=Newsreader:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&display=swap");:root{--ink:#1f1a14;--ink-soft:#4a4138;--muted:#8a7e72;--line:rgba(31,26,20,0.12);--line-soft:rgba(31,26,20,0.06);--paper:#f6f1e8;--paper-2:#efe7d6;--paper-3:#e7dcc6;--card:#fbf7ef;--accent:#c2531a;--accent-2:#d97a2c;--teal:#1f4d4a;--teal-2:#2d6b66;--serif:"Newsreader",ui-serif,Georgia,serif;--sans:"Geist",ui-sans-serif,system-ui,sans-serif;--mono:"Geist Mono",ui-monospace,"SFMono-Regular",monospace}*{box-sizing:border-box}body,html{margin:0;padding:0;height:100%}body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow:hidden}::selection{background:var(--accent);color:var(--paper)}.app{height:100vh;display:grid;grid-template-rows:auto 1fr auto}.topbar{display:grid;grid-template-columns:1fr auto 1fr;padding:22px 40px;border-bottom:1px solid var(--line-soft);background:var(--paper);z-index:5}.brand,.topbar{align-items:center}.brand{display:flex;gap:12px;font-family:var(--serif);font-weight:500;font-size:17px;letter-spacing:-.01em}.brand-mark{width:28px;height:28px;position:relative;display:inline-block}.brand-mark:after,.brand-mark:before{content:"";position:absolute;inset:0;border-radius:50%}.brand-mark:before{background:var(--accent);transform:translateX(-5px);mix-blend-mode:multiply;opacity:.92}.brand-mark:after{background:var(--teal);transform:translateX(5px);mix-blend-mode:multiply;opacity:.92}.brand-name{font-style:italic;color:var(--ink)}.brand-name b{font-style:normal;font-weight:600}.stepper{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);display:flex;gap:14px;align-items:center}.stepper .label-of{color:var(--ink-soft)}.topbar-right{display:flex;justify-content:flex-end;align-items:center;gap:12px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.save-pill{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--line);padding:6px 12px;border-radius:999px;background:var(--card)}.save-dot{width:6px;height:6px;border-radius:50%;background:var(--teal-2);box-shadow:0 0 0 3px rgba(45,107,102,.18)}.save-pill.is-saving .save-dot{background:var(--accent);box-shadow:0 0 0 3px rgba(194,83,26,.18)}.save-pill.is-error{color:var(--accent)}.save-pill.is-error .save-dot{background:var(--accent);box-shadow:0 0 0 3px rgba(194,83,26,.22)}.stage{position:relative;overflow:hidden;background:var(--paper)}.scene,.scenes{position:absolute;inset:0}.scene{display:grid;grid-template-columns:1.05fr 1fr;opacity:0;pointer-events:none;transition:opacity .48s ease}.scene.is-active{opacity:1;pointer-events:auto}.scene-left{position:relative;padding:64px 56px 64px 64px;justify-content:space-between;border-right:1px solid var(--line-soft);overflow:hidden}.scene-left,.scene-right{display:flex;flex-direction:column}.scene-right{padding:64px 80px 64px 64px;justify-content:center;overflow-y:auto}.scene[data-tone=cream] .scene-left{background:var(--paper)}.scene[data-tone=warm] .scene-left{background:var(--paper-2)}.scene[data-tone=warmer] .scene-left{background:var(--paper-3)}.scene[data-tone=teal] .scene-left{background:var(--teal);color:var(--paper)}.scene[data-tone=teal] .scene-left .eyebrow{color:rgba(246,241,232,.6)}.scene[data-tone=teal] .scene-left .left-body,.scene[data-tone=teal] .scene-left .left-title{color:rgba(246,241,232,.88)}.scene[data-tone=teal] .scene-left .left-title em{color:var(--accent-2)}.scene[data-tone=teal] .scene-left .left-meta{color:rgba(246,241,232,.55);border-color:rgba(246,241,232,.18)}.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:10px}.eyebrow .num{color:var(--accent);font-weight:500}.scene[data-tone=teal] .eyebrow .num{color:var(--accent-2)}.eyebrow .rule{flex:none;width:28px;height:1px;background:currentColor;opacity:.4}.left-content{margin-top:28px;max-width:460px}.left-title{font-family:var(--serif);font-weight:400;font-size:44px;line-height:1.08;letter-spacing:-.02em;text-wrap:pretty;margin:0 0 24px}.left-title em{font-style:italic;color:var(--accent)}.left-body{font-size:15px;line-height:1.6;color:var(--ink-soft);max-width:420px}.left-meta{border-top:1px solid var(--line);padding-top:18px;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);display:flex;justify-content:space-between;gap:20px}.flourish{position:absolute;pointer-events:none;opacity:.85}.flourish-arc{bottom:-120px;right:-80px;width:380px;height:380px}.flourish-arc,.flourish-arc-inner{border-radius:50%;border:1px solid var(--line)}.flourish-arc-inner{bottom:-60px;right:-20px;width:240px;height:240px}.scene[data-tone=teal] .flourish-arc,.scene[data-tone=teal] .flourish-arc-inner{border-color:rgba(246,241,232,.12)}.dot-grid{width:140px;height:140px;background-image:radial-gradient(currentColor 1px,transparent 1.4px);background-size:12px 12px;color:var(--accent);opacity:.35}.q-wrap{max-width:560px}.q-num{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}.q-num .req{color:var(--accent);margin-left:6px}.q-title{font-family:var(--serif);font-weight:400;font-size:32px;line-height:1.15;letter-spacing:-.015em;color:var(--ink);margin:0 0 12px;text-wrap:pretty}.q-help{font-size:14.5px;color:var(--ink-soft);line-height:1.55;margin-bottom:32px;max-width:520px}.field-text{width:100%;border:none;border-bottom:1.5px solid var(--line);background:transparent;padding:14px 2px;font:inherit;font-family:var(--serif);font-size:22px;color:var(--ink);outline:none;transition:border-color .2s}.field-text::placeholder{color:var(--muted);font-style:italic}.field-text:focus{border-bottom-color:var(--accent)}.field-textarea{width:100%;min-height:110px;border:1px solid var(--line);background:var(--card);border-radius:6px;padding:14px 16px;font:inherit;font-size:15px;color:var(--ink);resize:vertical;outline:none;transition:border-color .2s,box-shadow .2s;line-height:1.5}.field-textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(194,83,26,.12)}.field-textarea::placeholder{color:var(--muted);font-style:italic}.options{display:flex;flex-direction:column;gap:10px}.option{position:relative;display:flex;align-items:flex-start;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:8px;background:var(--card);cursor:pointer;transition:border-color .18s,background .18s}.option:hover{border-color:var(--ink-soft);background:#fffaf0}.option input{position:absolute;opacity:0;pointer-events:none}.option .check,.option .radio{flex:none;margin-top:3px;width:16px;height:16px;border:1.5px solid var(--ink-soft);background:transparent;display:grid;place-items:center;transition:border-color .18s,background .18s}.option .radio{border-radius:50%}.option .check{border-radius:4px}.option .check-dot,.option .radio:after{content:"";width:7px;height:7px;background:var(--paper);transform:scale(0);transition:transform .2s cubic-bezier(.4,1.6,.4,1)}.option .radio:after{border-radius:50%}.option .check-dot{border-radius:2px}.option input:checked~.opt-body .check,.option input:checked~.opt-body .radio,.option.is-selected .check,.option.is-selected .radio{border-color:var(--accent);background:var(--accent)}.option input:checked~.opt-body .check-dot,.option input:checked~.opt-body .radio:after,.option.is-selected .check-dot,.option.is-selected .radio:after{transform:scale(1)}.option.is-selected{border-color:var(--accent);background:#fffaf0}.option-text{font-size:15.5px;color:var(--ink);line-height:1.5;flex:1 1}.opt-body{display:flex;gap:14px;flex:1 1;align-items:flex-start}.rank-help{margin-bottom:18px;padding:12px 14px;border-left:2px solid var(--accent);background:rgba(194,83,26,.05);font-size:13.5px;color:var(--ink-soft);border-radius:0 6px 6px 0}.rank-grid{display:grid;grid-template-columns:1fr;grid-gap:6px;gap:6px;max-height:380px;overflow-y:auto;padding-right:6px}.rank-grid::-webkit-scrollbar{width:6px}.rank-grid::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}.rank-row{display:grid;grid-template-columns:1fr auto;align-items:center;grid-gap:14px;gap:14px;padding:10px 14px;border:1px solid var(--line-soft);border-radius:6px;background:var(--card);transition:border-color .18s,background .18s}.rank-row:hover{border-color:var(--line);background:#fffaf0}.rank-row.is-ranked{border-color:var(--accent);background:#fffaf0}.rank-name{font-size:14.5px;color:var(--ink)}.rank-controls{display:flex;gap:6px}.rank-btn{border:1px solid var(--line);background:var(--paper);width:30px;height:30px;border-radius:50%;font-family:var(--mono);font-size:11px;font-weight:500;color:var(--ink-soft);cursor:pointer;display:grid;place-items:center;transition:all .18s;padding:0}.rank-btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.rank-btn:disabled{opacity:.35;cursor:not-allowed}.rank-btn.is-active{background:var(--accent);color:var(--paper);border-color:var(--accent)}.rank-summary{margin-top:16px;padding:14px 16px;border:1px dashed var(--line);border-radius:6px;background:rgba(31,77,74,.04);font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--ink-soft);line-height:1.7}.rank-summary .slot{color:var(--muted)}.rank-summary .slot-label{display:inline-block;width:38px;opacity:.7}.rank-summary .slot b{color:var(--teal);font-weight:500;font-family:var(--sans);font-size:13px;letter-spacing:0}.rank-summary .slot.empty b{color:var(--muted);font-style:italic}.inline-error{margin-top:14px;color:#9b2c2c;font-size:13.5px}.footer{display:grid;grid-template-columns:1fr auto 1fr;padding:20px 40px;border-top:1px solid var(--line-soft);background:var(--paper);grid-gap:20px;gap:20px;z-index:5}.footer,.progress{align-items:center}.progress{display:flex;gap:12px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.progress-track{position:relative;width:220px;height:4px;background:var(--line-soft);border-radius:2px;overflow:hidden}.progress-fill{position:absolute;left:0;top:0;bottom:0;background:var(--accent);transition:width .48s cubic-bezier(.4,.1,.2,1);border-radius:2px}.progress-time{color:var(--ink-soft)}.nav-keys{display:flex;align-items:center;gap:16px;justify-content:center;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.key,.nav-keys{font-family:var(--mono)}.key{display:inline-grid;place-items:center;min-width:22px;padding:0 6px;height:22px;border:1px solid var(--line);border-radius:4px;background:var(--card);font-size:11px;color:var(--ink-soft)}.nav-buttons{display:flex;gap:10px;justify-content:flex-end;min-height:44px}.btn,.nav-buttons{align-items:center}.btn{font-family:var(--sans);font-size:14px;font-weight:500;padding:12px 20px;border-radius:6px;cursor:pointer;border:1px solid transparent;transition:all .18s;display:inline-flex;gap:8px;letter-spacing:-.005em}.btn-ghost{background:transparent;color:var(--ink-soft);border-color:var(--line)}.btn-ghost:hover{border-color:var(--ink-soft);color:var(--ink)}.btn-ghost:disabled{opacity:.35;cursor:not-allowed}.btn-primary{background:var(--ink);color:var(--paper)}.btn-primary:hover{background:var(--accent)}.btn-primary:disabled{background:var(--paper-3);color:var(--muted);cursor:not-allowed}.btn-primary svg{transition:transform .18s}.btn-primary:hover svg{transform:translateX(3px)}.scene.intro,.scene.outro{grid-template-columns:1fr}.scene.intro .scene-left,.scene.outro .scene-left{border-right:none;padding:80px;display:grid;place-content:center;text-align:left}.scene.intro .left-content{max-width:720px}.intro-headline{font-family:var(--serif);font-weight:400;font-size:64px;line-height:1.04;letter-spacing:-.025em;margin:24px 0 28px;text-wrap:balance}.intro-headline em{color:var(--accent);font-style:italic}.intro-body{font-size:17px;line-height:1.6;color:var(--ink-soft);max-width:620px;margin-bottom:40px}.intro-meta{display:flex;gap:40px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--line);padding-top:20px;max-width:620px}.intro-meta div b{display:block;color:var(--ink);font-family:var(--serif);font-weight:400;font-size:24px;letter-spacing:-.01em;text-transform:none;margin-bottom:4px}.start-btn{margin-top:40px;font-size:15px;padding:16px 28px}.outro-mark{width:80px;height:80px;position:relative;margin-bottom:32px}.outro-mark:after,.outro-mark:before{content:"";position:absolute;inset:0;border-radius:50%;mix-blend-mode:multiply}.outro-mark:before{background:var(--accent);transform:translateX(-14px)}.outro-mark:after{background:var(--teal);transform:translateX(14px)}.outro-actions{display:flex;gap:12px;margin-top:32px}.record-id{margin:18px 0 0;font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:var(--teal-2)}.scene.is-active .left-content>*,.scene.is-active .q-wrap>*{animation:rise .6s cubic-bezier(.2,.6,.2,1) both}.scene.is-active .left-content>:first-child,.scene.is-active .q-wrap>:first-child{animation-delay:80ms}.scene.is-active .left-content>:nth-child(2),.scene.is-active .q-wrap>:nth-child(2){animation-delay:.16s}.scene.is-active .left-content>:nth-child(3),.scene.is-active .q-wrap>:nth-child(3){animation-delay:.24s}.scene.is-active .left-content>:nth-child(4),.scene.is-active .q-wrap>:nth-child(4){animation-delay:.32s}.scene.is-active .left-content>:nth-child(5),.scene.is-active .q-wrap>:nth-child(5){animation-delay:.4s}.stage.is-nudging .scene.is-active{animation:nudge .28s}@keyframes rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes nudge{0%{transform:translateX(0)}30%{transform:translateX(-6px)}60%{transform:translateX(6px)}to{transform:translateX(0)}}@media (max-width:920px){body{overflow:auto}.app{height:auto;min-height:100vh}.scene{grid-template-columns:1fr}.scene-left{border-right:none;border-bottom:1px solid var(--line-soft)}.scene-left,.scene-right{padding:36px 28px}.left-title{font-size:30px}.q-title{font-size:24px}.footer,.topbar{padding:16px 20px}.topbar{grid-template-columns:1fr;gap:12px}.stepper,.topbar-right{justify-content:flex-start}.progress-track{width:120px}.nav-keys{display:none}.footer{grid-template-columns:1fr;justify-items:start}.nav-buttons{width:100%;justify-content:flex-start;flex-wrap:wrap}.scene.intro .scene-left,.scene.outro .scene-left{padding:48px 28px}.intro-headline{font-size:40px}.intro-meta{flex-direction:column;gap:14px}.outro-actions{flex-wrap:wrap}}