:root{--bg: #f9f9f9;--bg-alt: #f0eee9;--ink: #222222;--ink-m: rgba(34, 34, 34, .48);--rule: rgba(34, 34, 34, .1);--accent: #f75b1d;--accent-s: rgba(247, 91, 29, .07);--white: #ffffff;--fu: "Urbanist", system-ui, sans-serif;--fm: "Geist Mono", ui-monospace, monospace;--hp: clamp(1.25rem, 4vw, 4rem);--vp: clamp(4rem, 8vw, 8rem);--cm: 720px;--sp: max(var(--hp), calc((100% - var(--cm)) / 2));--rad: 12px;--rad-btn: 10px;--smooth: cubic-bezier(.84, 0, .16, 1);--ease: .8s cubic-bezier(.84, 0, .16, 1);--fast-ease: .5s cubic-bezier(.84, 0, .16, 1);--color-ease: .4s ease-out}*{box-sizing:border-box;margin:0}html,body{background:var(--bg);color:var(--ink);font-family:var(--fu);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}#root{min-height:100dvh;display:flex;flex-direction:column}.lbl{font-family:var(--fm);font-size:.625rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-m)}.lbl--accent{color:var(--accent)}.screen{flex:1;display:flex;flex-direction:column;justify-content:center;padding:var(--vp) var(--sp);max-width:100%}.screen h1{font-size:clamp(2rem,5vw,3.75rem);font-weight:700;line-height:1;letter-spacing:-.04em;margin:1rem 0 1.5rem}.screen p{color:var(--ink-m);font-size:clamp(1rem,1.6vw,1.25rem);max-width:56ch}.frame{flex:1;display:flex;flex-direction:column;padding:0 var(--sp)}.frame-header{padding:1.25rem 0;display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--rule)}.progress{height:2px;background:var(--rule);border-radius:1px;overflow:hidden;flex:1;max-width:220px}.progress>div{height:100%;background:var(--accent);transition:width var(--fast-ease)}.save-state{font-family:var(--fm);font-size:.56rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-m);min-width:7ch;text-align:right}.save-state--error{color:var(--accent)}.step{flex:1;display:flex;flex-direction:column;justify-content:center;padding:clamp(2rem,6vh,4rem) 0;max-width:640px}.step-title{margin-bottom:.75rem}.step h2{font-size:clamp(1.5rem,3vw,2.25rem);font-weight:700;line-height:1.15;letter-spacing:-.03em;margin-bottom:.75rem}.step .hint{color:var(--ink-m);font-size:.9375rem;margin-bottom:1rem}.step-error{color:var(--accent);font-size:.9375rem;margin-top:.75rem}.input,.textarea{font-family:var(--fu);font-size:1.125rem;color:var(--ink);background:var(--white);border:1px solid var(--rule);border-radius:var(--rad-btn);padding:.85rem 1rem;width:100%;transition:border-color var(--color-ease)}.input:focus,.textarea:focus{outline:none;border-color:var(--ink)}.textarea{min-height:9.5rem;resize:vertical;line-height:1.6}.triple{display:grid;gap:.75rem}.choices{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.choice{font-family:var(--fu);font-size:1.0625rem;font-weight:500;color:var(--ink);background:var(--white);border:1px solid var(--rule);border-radius:var(--rad-btn);min-height:56px;padding:.85rem 1.25rem;text-align:left;cursor:pointer;transition:border-color var(--color-ease),background-color var(--color-ease)}.choice:hover{border-color:var(--ink-m)}.choice:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.choice[aria-pressed=true]{border-color:var(--accent);background:var(--accent-s)}.btn-primary,.btn-ghost{font-family:var(--fu);font-weight:600;font-size:.875rem;height:44px;padding:0 1.5rem;border-radius:var(--rad-btn);border:none;cursor:pointer;transition:background-color .18s ease-out,opacity .18s ease-out}.btn-primary{background:var(--accent);color:var(--white)}.btn-primary:hover{background:var(--ink)}.btn-primary:disabled{background:var(--ink-m);cursor:default}.btn-ghost{background:var(--ink);color:var(--white)}.btn-ghost:hover{opacity:.8}.btn-quiet{font-family:var(--fu);font-weight:500;font-size:.875rem;height:44px;padding:0 1rem;border-radius:var(--rad-btn);border:1px solid var(--rule);background:transparent;color:var(--ink-m);cursor:pointer;transition:border-color var(--color-ease),color var(--color-ease)}.btn-quiet:hover{border-color:var(--ink-m);color:var(--ink)}.btn-primary:focus-visible,.btn-ghost:focus-visible,.btn-quiet:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.step-nav{display:flex;align-items:center;gap:.75rem;margin-top:1.75rem}.step-nav .spacer{flex:1}.lang-row{display:flex;gap:.75rem;margin:1.5rem 0 2rem}.lang-row .choice{flex:0 0 auto;min-width:140px}.photo-drop{border:1px dashed var(--rule);border-radius:var(--rad);background:var(--white);padding:2rem 1.5rem;text-align:center;color:var(--ink-m);cursor:pointer;transition:border-color var(--color-ease)}.photo-drop:hover,.photo-drop:focus-visible{border-color:var(--ink-m);outline:none}.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:.75rem;margin-top:1rem}.photo-cell{position:relative;aspect-ratio:1;border:1px solid var(--rule);border-radius:var(--rad-btn);overflow:hidden;background:var(--bg-alt)}.photo-cell img{width:100%;height:100%;object-fit:cover;display:block}.photo-cell button{position:absolute;top:4px;right:4px;width:28px;height:28px;border-radius:50%;border:none;background:var(--ink);color:var(--white);font-size:.9rem;line-height:1;cursor:pointer}.voice{margin-top:1rem;display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.voice-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);animation:voice-pulse 1.2s ease-in-out infinite}@keyframes voice-pulse{50%{opacity:.3}}.voice audio{height:40px;max-width:100%}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.hp-field{position:absolute;left:-9999px;opacity:0;pointer-events:none}@media(max-width:640px){.choices{grid-template-columns:1fr}.step{justify-content:flex-start;padding-top:2rem}}@media(prefers-reduced-motion:reduce){.voice-dot{animation:none}.progress>div,.input,.textarea,.choice,.btn-primary,.btn-ghost,.btn-quiet,.photo-drop{transition:none}}