:root{color-scheme:dark;--bg: #0b0d11;--surface: #151920;--surface-raised: #1b2029;--border: #2a303b;--border-strong: #3d4553;--text: #f3f4f6;--text-muted: #a4acba;--text-faint: #838b99;--accent: #f6b73c;--accent-hover: #ffc961;--accent-active: #e5a628;--accent-ink: #1a1200;--accent-glow: rgba(246, 183, 60, .22);--danger: #ff8f86;--danger-bg: rgba(255, 107, 97, .1);--danger-border: rgba(255, 107, 97, .45);--success: #7fe0a8;--success-bg: rgba(127, 224, 168, .1);--success-border: rgba(127, 224, 168, .4);--radius-s: 10px;--radius: 14px;--radius-l: 24px;--gutter: 16px;--font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-spring: cubic-bezier(.34, 1.4, .64, 1);--dur-fast: .15s;--dur: .26s;--dur-slow: .52s}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;min-height:100dvh;font-family:var(--font);font-size:17px;line-height:1.5;color:var(--text);background-color:var(--bg);background-image:radial-gradient(120% 60% at 50% -10%,#f6b73c21,#f6b73c00 60%);background-repeat:no-repeat;-webkit-font-smoothing:antialiased;overflow-x:hidden}#root{min-height:100dvh}.page{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(var(--gutter),env(safe-area-inset-top)) max(var(--gutter),env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(var(--gutter),env(safe-area-inset-left))}.page__footer{margin-top:20px;font-size:13px;color:var(--text-faint);text-align:center}.card{width:100%;max-width:30rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-l);padding:clamp(20px,5vw,32px);box-shadow:0 1px #ffffff08 inset,0 24px 60px -30px #000c}.header{margin-bottom:24px}.eyebrow{display:inline-flex;align-items:center;gap:8px;margin:0 0 12px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.eyebrow__wall{font-family:var(--font-mono);font-weight:500;letter-spacing:0;text-transform:none;color:var(--accent);background:var(--accent-glow);border-radius:999px;padding:2px 10px;max-width:14ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.title{margin:0;font-size:clamp(26px,7vw,32px);line-height:1.15;font-weight:700;letter-spacing:-.02em;text-wrap:balance}.lede{margin:8px 0 0;color:var(--text-muted);font-size:16px;text-wrap:pretty}.form{display:flex;flex-direction:column;gap:20px}.field{display:flex;flex-direction:column;gap:8px}.field__label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:15px;font-weight:600;color:var(--text)}.field__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;min-height:56px;padding:14px 16px;font:inherit;font-size:17px;line-height:1.45;color:var(--text);background:var(--surface-raised);border:1px solid var(--border-strong);border-radius:var(--radius);outline:none;transition:border-color var(--dur-fast) ease,box-shadow var(--dur-fast) ease,background-color var(--dur-fast) ease}.field__input::placeholder{color:var(--text-faint)}.field__input:hover:not(:disabled){border-color:#4a5364}.field__input:focus,.field__input:focus-visible{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-glow)}.field__input[aria-invalid=true]{border-color:var(--danger-border)}.field__input[aria-invalid=true]:focus{border-color:var(--danger);box-shadow:0 0 0 4px var(--danger-bg)}.field__input:disabled{opacity:.6;cursor:progress}textarea.field__input{min-height:140px;resize:none;field-sizing:content;max-height:40dvh}.counter{font-family:var(--font-mono);font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--text-faint);white-space:nowrap;transition:color var(--dur-fast) ease}.counter[data-level=warn]{color:var(--accent)}.counter[data-level=limit]{color:var(--danger)}.notice{display:flex;align-items:flex-start;gap:12px;margin:0;padding:14px 16px;border-radius:var(--radius);font-size:15px;line-height:1.45;border:1px solid var(--border);background:var(--surface-raised);color:var(--text)}.notice--error{border-color:var(--danger-border);background:var(--danger-bg);color:var(--danger)}.notice--slow{color:var(--text-muted)}.notice__icon{flex:none;width:20px;height:20px;margin-top:1px}.notice__dot{flex:none;width:10px;height:10px;margin-top:6px;border-radius:999px;background:var(--accent)}.button{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:60px;padding:0 20px;font:inherit;font-size:18px;font-weight:700;letter-spacing:-.01em;border-radius:var(--radius);border:1px solid transparent;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background-color var(--dur-fast) ease,border-color var(--dur-fast) ease,transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) ease}.button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.button--primary{color:var(--accent-ink);background:var(--accent);box-shadow:0 10px 30px -12px #f6b73c8c}.button--primary:hover:not(:disabled){background:var(--accent-hover)}.button--primary:active:not(:disabled){background:var(--accent-active);transform:scale(.98);box-shadow:none}.button--primary:disabled{cursor:progress;background:#8a6a2a;color:#1a1200d9;box-shadow:none}.button--secondary{color:var(--text);background:transparent;border-color:var(--border-strong)}.button--secondary:hover{background:var(--surface-raised);border-color:#4a5364}.button--secondary:active{transform:scale(.98)}.button__icon{width:20px;height:20px;flex:none}.done{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px}.done__badge{width:72px;height:72px;margin-bottom:8px;display:grid;place-items:center;border-radius:999px;color:var(--success);background:var(--success-bg);border:1px solid var(--success-border)}.done__badge svg{width:36px;height:36px}.done__title{margin:0;font-size:clamp(26px,7vw,32px);line-height:1.15;font-weight:700;letter-spacing:-.02em}.done__status{margin:0;font-size:18px;font-weight:600;color:var(--text)}.done__hint{margin:4px 0 0;color:var(--text-muted);font-size:16px;max-width:32ch;text-wrap:pretty}.done .button{margin-top:20px}.invalid{text-align:center}.invalid__title{margin:12px 0 8px;font-size:24px;font-weight:700;letter-spacing:-.02em}.invalid__hint{margin:0;color:var(--text-muted)}@media(prefers-reduced-motion:no-preference){.card{animation:card-in var(--dur-slow) var(--ease-out) both}.done__badge{animation:badge-in var(--dur-slow) var(--ease-spring) both}.done__badge svg path{stroke-dasharray:48;stroke-dashoffset:48;animation:check-draw .42s var(--ease-out) .18s forwards}.done__title,.done__status,.done__hint,.done .button{animation:rise-in var(--dur) var(--ease-out) both}.done__status{animation-delay:80ms}.done__hint{animation-delay:.14s}.done .button{animation-delay:.2s}.notice{animation:rise-in var(--dur) var(--ease-out) both}.notice__dot{animation:breathe 1.6s ease-in-out infinite}.spinner{animation:spin .9s linear infinite}}@keyframes card-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes rise-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes badge-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}@keyframes check-draw{to{stroke-dashoffset:0}}@keyframes breathe{0%,to{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1)}}@keyframes spin{to{transform:rotate(360deg)}}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
