:root{--canvas:#fbf6f0;--surface:#fff;--border:#ece3d9;--ink:#2a2320;--muted:#8a7e74;--teal:#0fa68c;--teal-press:#0d8c76;--coral:#ff6b3d;--coral-cta:#e0521e;--coral-press:#c8471a;--color-darkroom:#2a2320;--color-parchment:#fbf6f0;--color-chamomile:#e0521e;--color-fern:#0fa68c;--color-mist:#c4b5a2;--color-bg:#fbf6f0;--color-surface:#fff;--color-surface-mid:#ece3d9;--color-surface-deep:#e0d8ce;--color-text-primary:#2a2320;--color-text-secondary:#6b5e54;--color-text-tertiary:#8a7e74;--color-text-inverse:#fff;--color-chamomile-light:#0fa68c1a;--color-chamomile-deep:#0d8c76;--color-fern-light:#0fa68c14;--color-fern-surface:#0fa68c1a;--border-hairline:1px solid #2a23200f;--border-subtle:1px solid #2a23201f;--border-emphasis:1px solid #2a23203d;--border-gold:1px solid #0fa68c4d;--shadow-sm:0 1px 3px #1c151112, 0 1px 2px #1c15110a;--shadow-md:0 4px 12px #1c151117, 0 2px 4px #1c15110d;--shadow-lg:0 8px 24px #1c15111c, 0 4px 8px #1c151112;--shadow-portrait:0 2px 4px #1c15110f, 0 8px 20px #1c15111a, 0 20px 40px #1c151117;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--radius-pill:999px;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--sp-7:48px;--sp-8:64px;--sp-9:96px;--ease-spring:cubic-bezier(.23, 1, .32, 1);--ease-out-expo:cubic-bezier(.16, 1, .3, 1);--ease-warm:cubic-bezier(.34, 1.04, .64, 1);--duration-quick:.14s;--duration-medium:.28s;--duration-slow:.5s;--duration-reveal:.9s}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;min-height:100dvh}body{background:var(--color-bg);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:Manrope,system-ui,sans-serif;font-size:15px;font-weight:400;line-height:1.65}nav,.tab-bar,.btn{-webkit-user-select:none;user-select:none}.t-display{letter-spacing:-.01em;font-family:Boska,serif;font-size:42px;font-weight:700;line-height:1.05}.t-headline{letter-spacing:-.005em;font-family:Boska,serif;font-size:26px;font-weight:500;line-height:1.2}.t-title{font-family:Boska,serif;font-size:18px;font-weight:500;line-height:1.3}.t-body{font-family:Manrope,sans-serif;font-size:15px;font-weight:400;line-height:1.65}.t-label{letter-spacing:.08em;text-transform:uppercase;font-family:Manrope,sans-serif;font-size:11px;font-weight:600;line-height:1.4}.t-button{letter-spacing:.01em;font-family:Manrope,sans-serif;font-size:15px;font-weight:600}.t-caption{font-family:Manrope,sans-serif;font-size:12px;font-weight:400;line-height:1.5}.wordmark{letter-spacing:.04em;text-transform:uppercase;font-family:Boska,serif;font-weight:700}.wordmark .pet{color:var(--ink)}.wordmark .click{color:var(--teal)}.btn{border-radius:var(--radius-pill);cursor:pointer;letter-spacing:.01em;white-space:nowrap;transition:transform var(--duration-quick) var(--ease-spring), box-shadow var(--duration-quick) ease, background-color var(--duration-quick) ease;border:none;justify-content:center;align-items:center;gap:8px;min-width:120px;padding:16px 32px;font-family:Manrope,sans-serif;font-size:15px;font-weight:600;text-decoration:none;display:inline-flex}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none!important}.btn-primary{background:var(--coral-cta);color:#fff;box-shadow:0 1px 2px #e0521e2e,0 4px 12px #e0521e3d}.btn-primary:not(:disabled):hover{background:var(--coral-press);transform:translateY(-1px);box-shadow:0 1px 2px #e0521e38,0 6px 20px #e0521e52}.btn-secondary{color:var(--color-darkroom);background:0 0;border:1.5px solid #1c15113d}.btn-secondary:not(:disabled):hover{background:#1c15110a;border-color:#1c151166}.btn-ghost{color:var(--color-text-secondary);border:var(--border-subtle);background:0 0}.btn-full{width:100%}.btn-sm{min-width:unset;padding:10px 20px;font-size:13px}.btn-icon{min-width:unset;border-radius:var(--radius-md);padding:12px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner{animation:1s linear infinite spin}.portrait-card{background:var(--color-surface);box-shadow:var(--shadow-portrait);cursor:pointer;transition:transform .3s var(--ease-warm), box-shadow .3s ease;border-radius:4px;padding:10px 10px 28px;position:relative}.portrait-card:hover{transform:translateY(-6px)rotate(-.5deg);box-shadow:0 4px 8px #1c151112,0 16px 40px #1c151124,0 32px 60px #1c15111a}.portrait-card:after{content:"";pointer-events:none;border-radius:2px;position:absolute;inset:10px 10px 28px;box-shadow:inset 0 0 0 1px #1c151112}.portrait-card img{aspect-ratio:3/4;object-fit:cover;background:var(--color-surface-mid);border-radius:2px;width:100%;display:block}.portrait-card .portrait-label{color:var(--color-text-secondary);text-align:center;margin-top:8px;font-family:Boska,serif;font-size:13px;font-weight:400;line-height:1.2}@keyframes portrait-materialize{0%{opacity:0;filter:brightness(.7)blur(2px);transform:scale(.96)}45%{filter:brightness(1.06)blur()}to{opacity:1;filter:brightness();transform:scale(1)}}.portrait-revealed{animation:portrait-materialize var(--duration-reveal) var(--ease-out-expo) forwards}.portrait-skeleton{background:linear-gradient(135deg, var(--color-surface-mid) 0%, #f4edd899 50%, var(--color-surface-mid) 100%)}@keyframes gentle-pulse{0%,to{opacity:.5}50%{opacity:.9}}.skeleton{background:var(--color-surface-mid);border-radius:4px;animation:2s ease-in-out infinite gentle-pulse}.grain-overlay{pointer-events:none;z-index:9999;opacity:.028;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}.tab-bar{-webkit-backdrop-filter:blur(24px)saturate(1.4);border-top:var(--border-hairline);padding-bottom:env(safe-area-inset-bottom);z-index:40;background:#fbf6f0f0;display:flex;position:fixed;bottom:0;left:0;right:0}.tab-item{cursor:pointer;color:var(--color-mist);background:0 0;border:none;flex-direction:column;flex:1;align-items:center;gap:4px;padding:10px 0 8px;text-decoration:none;transition:color .15s;display:flex}.tab-item.active{color:var(--color-fern)}.tab-item span{letter-spacing:.04em;text-transform:uppercase;font-family:Manrope,sans-serif;font-size:10px;font-weight:600}input[type=text],input[type=tel],input[type=email],textarea,select{background:var(--color-surface);border:var(--border-subtle);border-radius:var(--radius-md);color:var(--color-text-primary);appearance:none;outline:none;width:100%;padding:14px 16px;font-family:Manrope,sans-serif;font-size:16px;font-weight:400;transition:border-color .2s,box-shadow .2s}input:focus,textarea:focus,select:focus{border-color:#0fa68c80;box-shadow:0 0 0 3px #0fa68c14}input::placeholder,textarea::placeholder{color:var(--color-mist)}.otp-boxes{justify-content:center;gap:8px;display:flex}.otp-box{background:var(--color-surface);border:var(--border-subtle);border-radius:var(--radius-sm);width:48px;height:60px;color:var(--color-text-primary);text-align:center;caret-color:var(--color-fern);outline:none;font-family:Boska,serif;font-size:24px;font-weight:700;transition:border-color .2s}.otp-box:focus{border-color:var(--teal);box-shadow:0 0 0 3px #0fa68c1a}.otp-box.error{border-color:#b84040}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.shake{animation:.4s shake}.sheet-overlay{z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#1c151166;position:fixed;inset:0}.sheet{background:var(--color-surface);border-top:var(--border-subtle);z-index:51;padding-bottom:env(safe-area-inset-bottom);border-radius:24px 24px 0 0;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -8px 40px #1c15111f}.select-card{background:var(--color-surface);border:var(--border-subtle);border-radius:var(--radius-md);cursor:pointer;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:100px;padding:20px 16px;transition:border-color .2s,background .2s,box-shadow .2s;display:flex}.select-card:hover{border-color:#3a54404d}.select-card.selected{border-color:var(--color-fern);background:var(--color-fern-surface);box-shadow:0 0 0 3px #3a544014}.select-card .emoji{font-size:32px;line-height:1}.upload-zone{border-radius:var(--radius-lg);cursor:pointer;text-align:center;background:var(--color-surface);border:2px dashed #3a544040;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:48px 24px;transition:border-color .2s,background .2s;display:flex}.upload-zone:hover,.upload-zone.drag-over{border-color:var(--color-fern);background:var(--color-fern-surface)}.credit-badge{border-radius:var(--radius-pill);color:var(--teal-press);background:#0fa68c1a;border:1px solid #0fa68c4d;align-items:center;gap:4px;padding:4px 10px;font-family:Manrope,sans-serif;font-size:12px;font-weight:600;display:inline-flex}.page{background:var(--color-bg);scrollbar-width:none;height:100dvh;overflow:hidden auto}.page::-webkit-scrollbar{display:none}.page-content{padding:0 0 calc(80px + env(safe-area-inset-bottom,0)) 0;min-height:100%}.px-5{padding-left:var(--sp-5);padding-right:var(--sp-5)}.status-pill{border-radius:var(--radius-pill);letter-spacing:.04em;align-items:center;gap:4px;padding:4px 10px;font-family:Manrope,sans-serif;font-size:11px;font-weight:600;display:inline-flex}.status-pill.generating{color:var(--teal-press);background:#0fa68c1a}.status-pill.complete{background:var(--color-fern-surface);color:var(--color-fern)}.status-pill.failed{color:#8b2020;background:#b43c3c1a}.flex{display:flex}.flex-col{flex-direction:column;display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:var(--sp-1)}.gap-2{gap:var(--sp-2)}.gap-3{gap:var(--sp-3)}.gap-4{gap:var(--sp-4)}.gap-5{gap:var(--sp-5)}.w-full{width:100%}.text-center{text-align:center}.text-primary{color:var(--color-text-primary)}.text-secondary{color:var(--color-text-secondary)}.text-tertiary{color:var(--color-text-tertiary)}.text-chamomile{color:var(--color-chamomile)}.text-fern{color:var(--color-fern)}.mt-2{margin-top:var(--sp-2)}.mt-3{margin-top:var(--sp-3)}.mt-4{margin-top:var(--sp-4)}.mt-5{margin-top:var(--sp-5)}.mt-6{margin-top:var(--sp-6)}.mt-7{margin-top:var(--sp-7)}
