:root{--brand:#4f46e5;--ink:#211d18;--ink-soft:#6f675b;--paper:#f6f1e9;--raised:#fffdf9;--line:#e8e0d2;--brand-tint:color-mix(in srgb, var(--brand) 12%, var(--raised));--brand-edge:color-mix(in srgb, var(--brand) 32%, var(--line));--brand-soft:color-mix(in srgb, var(--brand) 60%, var(--ink));--on-brand:#fff;--r-lg:22px;--r-md:16px;--shadow:0 18px 50px -22px color-mix(in srgb, var(--brand) 30%, #000 12%);--safe-b:env(safe-area-inset-bottom,0px);--safe-t:env(safe-area-inset-top,0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-family:Hanken Grotesk,system-ui,-apple-system,sans-serif}.display{font-optical-sizing:auto;letter-spacing:-.01em;font-family:Fraunces,Georgia,serif;font-weight:600}.app{min-height:100svh;padding:calc(var(--safe-t) + 8px) 0 0;flex-direction:column;display:flex;position:relative;overflow:hidden}.ambient{z-index:0;pointer-events:none;position:fixed;inset:0}.glow{background:radial-gradient(60% 60% at 50% 0%, color-mix(in srgb, var(--brand) 26%, transparent), transparent 70%);filter:blur(8px);width:130vw;height:70vh;position:absolute;top:-28%;left:50%;transform:translate(-50%)}.grain{opacity:.05;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:absolute;inset:0}.topbar{z-index:1;flex-direction:column;gap:14px;padding:14px 22px 0;display:flex;position:relative}.brand{align-items:center;gap:10px;display:flex}.brand-logo{object-fit:contain;max-width:130px;max-height:30px}.brand-dot{background:var(--brand);width:10px;height:10px;box-shadow:0 0 0 4px color-mix(in srgb, var(--brand) 18%, transparent);border-radius:50%}.brand-name{color:var(--ink);letter-spacing:-.01em;font-size:15px;font-weight:600}.progress{gap:6px;display:flex}.seg{background:var(--line);border-radius:99px;flex:1;height:4px;transition:background .3s;overflow:hidden}.seg.done{background:var(--brand)}.seg.active{background:linear-gradient(90deg, var(--brand) 0 45%, color-mix(in srgb, var(--brand) 25%, var(--line)) 45%)}.stage{z-index:1;flex-direction:column;flex:1;justify-content:center;width:100%;max-width:540px;margin:0 auto;padding:24px 22px;display:flex;position:relative}.panel{width:100%}.qcount{letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb, var(--brand) 70%, var(--ink-soft));margin:0 0 12px;font-size:12px;font-weight:600}.question{text-wrap:balance;margin:0 0 26px;font-size:clamp(27px,7.4vw,38px);line-height:1.12}.nps{flex-direction:column;gap:16px;display:flex}.mood{align-items:center;gap:10px;min-height:34px;display:flex}.mood-emoji{font-size:26px;line-height:1;animation:.35s cubic-bezier(.34,1.56,.64,1) both pop}.mood-label{color:var(--ink);font-size:15px;font-weight:600}.mood-label.hint{color:var(--ink-soft);font-weight:500}.scale{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.chip{border:1.5px solid var(--line);background:var(--raised);width:44px;height:44px;color:var(--ink);cursor:pointer;border-radius:13px;flex:none;font-family:inherit;font-size:17px;font-weight:600;transition:transform .12s cubic-bezier(.34,1.56,.64,1),border-color .15s,background .15s,color .15s,box-shadow .15s}.chip:active{transform:scale(.9)}.chip.sel{border-color:var(--brand);background:var(--brand);color:var(--on-brand);box-shadow:0 10px 20px -8px color-mix(in srgb, var(--brand) 70%, transparent);transform:translateY(-3px)scale(1.06)}.legend{color:var(--ink-soft);justify-content:space-between;font-size:12px;display:flex}.stars{justify-content:center;gap:10px;display:flex}.star{width:clamp(44px,15vw,62px);height:clamp(44px,15vw,62px);color:var(--line);cursor:pointer;background:0 0;border:none;padding:4px;transition:transform .14s cubic-bezier(.34,1.56,.64,1),color .15s}.star:active{transform:scale(.86)}.star.on{color:var(--brand);filter:drop-shadow(0 6px 12px color-mix(in srgb, var(--brand) 45%, transparent));transform:scale(1.06)}.choices{flex-direction:column;gap:10px;display:flex}.choice{border:1.5px solid var(--line);background:var(--raised);border-radius:var(--r-md);width:100%;color:var(--ink);text-align:left;cursor:pointer;justify-content:space-between;align-items:center;gap:12px;padding:17px 18px;font-family:inherit;font-size:16px;font-weight:600;transition:transform .1s,border-color .15s,background .15s;display:flex}.choice:active{transform:scale(.99)}.choice .tick{opacity:0;color:var(--brand);font-size:15px;transition:opacity .15s,transform .15s;transform:scale(.5)}.choice.sel{border-color:var(--brand);background:var(--brand-tint)}.choice.sel .tick{opacity:1;transform:none}.field{border:1.5px solid var(--line);border-radius:var(--r-md);width:100%;min-height:132px;color:var(--ink);background:var(--raised);resize:none;padding:16px;font-family:inherit;font-size:16px;line-height:1.5;transition:border-color .15s,box-shadow .15s}.field::placeholder{color:color-mix(in srgb, var(--ink-soft) 75%, transparent)}.field:focus{border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb, var(--brand) 16%, transparent);outline:none}.navbar{z-index:1;padding:14px 22px calc(16px + var(--safe-b));background:linear-gradient(to top, var(--paper) 62%, transparent);justify-content:space-between;align-items:center;gap:12px;display:flex;position:relative}.navbar.single{justify-content:stretch}.btn{cursor:pointer;border:none;border-radius:99px;justify-content:center;align-items:center;gap:8px;height:54px;padding:0 24px;font-family:inherit;font-size:16px;font-weight:600;transition:transform .1s,opacity .2s,box-shadow .2s;display:inline-flex}.btn:active{transform:scale(.97)}.btn:disabled{cursor:default}.btn.primary{background:var(--brand);color:var(--on-brand);box-shadow:0 14px 30px -12px color-mix(in srgb, var(--brand) 75%, transparent);flex:1}.btn.primary:disabled{background:color-mix(in srgb, var(--brand) 32%, var(--line));color:color-mix(in srgb, var(--on-brand) 80%, transparent);box-shadow:none}.btn.ghost{color:var(--ink-soft);background:0 0;padding:0 16px}.btn.ghost:disabled{opacity:.4}.arrow{font-size:18px;line-height:1}.endcard{text-align:center;flex-direction:column;align-items:center;gap:8px;display:flex}.endcard .display{margin:4px 0 0;font-size:clamp(28px,8vw,40px);line-height:1.1}.endcard .btn.primary{flex:none;min-width:220px;margin-top:18px;text-decoration:none}.endmark{background:var(--brand-tint);width:76px;height:76px;color:var(--brand-soft);box-shadow:inset 0 0 0 1.5px var(--brand-edge);border-radius:50%;place-items:center;margin:0 auto 6px;font-size:34px;display:grid}.endmark.pop{animation:.5s cubic-bezier(.34,1.56,.64,1) both pop}.muted{color:var(--ink-soft);max-width:32ch;margin:6px 0 0;font-size:15px;line-height:1.5}.loader{border:3px solid var(--line);border-top-color:var(--brand);border-radius:50%;width:34px;height:34px;margin:0 auto;animation:.7s linear infinite spin}.in-fwd{animation:.34s cubic-bezier(.22,1,.36,1) both slideIn}.in-back{animation:.34s cubic-bezier(.22,1,.36,1) both slideInBack}@keyframes slideIn{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes slideInBack{0%{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}@keyframes pop{0%{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}
