@import"https://fonts.googleapis.com/css2?family=Fraunces:wght@500;600;700&family=Space+Grotesk:wght@400;500;600&display=swap";*,*:before,*:after{box-sizing:border-box}:root{font-family:Space Grotesk,Segoe UI,system-ui,sans-serif;line-height:1.5;font-weight:400;color:#24160e;background-color:#f6efe6;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh}img{max-width:100%;display:block}button,input,textarea{font-family:inherit}.app{min-height:100vh;padding:clamp(24px,6vw,80px);display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 12% 16%,rgba(255,214,165,.55),transparent 45%),radial-gradient(circle at 90% 12%,rgba(255,188,198,.45),transparent 35%),linear-gradient(135deg,#f6efe6,#f7f6ef 55%,#f2ece3)}.hero{width:min(1040px,100%);display:flex;flex-direction:column;gap:clamp(24px,4vw,40px)}.brand{display:flex;align-items:center;gap:18px;color:#25180f}.brand h1{font-family:Fraunces,Times New Roman,serif;font-size:clamp(2.1rem,3.2vw,3rem);letter-spacing:-.02em;margin:6px 0 0}.brand-mark{width:46px;height:46px;border-radius:16px;background:conic-gradient(from 140deg,#edb98a,#f5d6b4,#f3aa95,#f0c082);box-shadow:0 12px 24px #4d2c182e;position:relative}.brand-mark:after{content:"";position:absolute;inset:12px;border-radius:12px;background:#fff9}.brand-eyebrow{text-transform:uppercase;font-size:.78rem;letter-spacing:.24em;color:#7e5a3d;margin:0}.panel{display:grid;grid-template-columns:minmax(260px,1fr) minmax(280px,1.05fr);gap:clamp(18px,4vw,36px);padding:clamp(20px,4vw,44px);background:#ffffffc7;border-radius:30px;border:1px solid rgba(164,126,100,.24);box-shadow:0 28px 60px #5b3f291f;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.hero-visual{min-height:320px;border-radius:26px;background:linear-gradient(180deg,#20140d33,#20140d14),url(/pet-cookie.jpg) center/cover no-repeat;box-shadow:inset 0 0 0 1px #fff9,0 18px 30px #42281833}.photo-visual{background:linear-gradient(180deg,#20140d47,#20140d1f),url(/pet-cookie.jpg) center/cover no-repeat}.panel-copy h2{font-family:Fraunces,Times New Roman,serif;font-size:clamp(1.6rem,2.6vw,2.2rem);margin:0 0 12px;color:#2a1a10}.panel-sub{margin:0 0 24px;color:#5f4636;line-height:1.6}.name-form{display:flex;flex-direction:column;gap:12px}.name-form label{font-weight:600;color:#2a1a10}.input-row{display:grid;grid-template-columns:1fr auto;gap:12px}.name-form input{padding:12px 18px;border-radius:14px;border:1px solid rgba(108,73,49,.35);background:#ffffffd9;font-size:1rem;color:#24160e;outline:none;transition:border .2s ease,box-shadow .2s ease}.name-form input:focus{border-color:#c17a4a;box-shadow:0 0 0 3px #e0985d40}.name-form button{padding:12px 18px;border-radius:14px;border:none;background:#24160e;color:#f8f2ea;font-weight:600;letter-spacing:.02em;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.name-form button:hover{transform:translateY(-1px);box-shadow:0 14px 24px #24160e40}.input-hint{margin:0;color:#7a604e;font-size:.9rem}.bake-cta{margin-top:16px;display:flex;align-items:center;justify-content:space-between;gap:12px}.bake-cta .input-hint{text-align:left}.bake-button{padding:12px 18px;border-radius:14px;border:none;background:#24160e;color:#f8f2ea;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.bake-button:hover{transform:translateY(-1px);box-shadow:0 12px 20px #24160e33}.upload-card{margin:18px 0;padding:18px;border-radius:18px;border:1px dashed rgba(131,93,64,.35);background:#fff9;text-align:center;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}.upload-card.has-image{padding-bottom:12px}.upload-card.is-active{border-color:#c17a4a;background:#fff5eae6;box-shadow:0 12px 22px #5d371d29}.upload-icon{width:52px;height:52px;margin:0 auto 12px;border-radius:16px;background:linear-gradient(135deg,#f5d7b8,#e7b084);position:relative}.upload-icon:after{content:"";position:absolute;inset:14px;border-radius:10px;background:#ffffffb3}.upload-title{margin:0;font-weight:600;color:#2a1a10}.upload-sub{margin:6px 0 14px;color:#7a604e;font-size:.9rem}.upload-button{padding:12px 18px;border-radius:14px;border:none;background:#24160e;color:#f8f2ea;font-weight:600;cursor:pointer}.upload-button:hover{transform:translateY(-1px);box-shadow:0 12px 20px #24160e33}.upload-input{display:none}.upload-preview{position:relative;width:100%;min-height:220px;border-radius:14px;overflow:hidden;margin-bottom:12px;background:#ffffff8c}.upload-preview img{width:100%;height:100%;min-height:260px;max-height:none;object-fit:cover;display:block}.preview-overlay{position:absolute;inset:0;background:linear-gradient(180deg,#1a120c99,#1a120c40 55%,#1a120c8c);display:grid;place-content:center;gap:10px;text-align:center;color:#f9f2ea;padding:16px}.loading-chip{display:inline-flex;justify-self:center;padding:6px 14px;border-radius:999px;background:#fff5ea33;border:1px solid rgba(255,245,234,.35);font-size:.9rem;letter-spacing:.02em}.loading-dots{display:inline-flex;justify-content:center;gap:6px}.loading-dots span{width:8px;height:8px;border-radius:50%;background:#f6e8d8;opacity:.4;animation:pulse 1.2s ease-in-out infinite}.loading-dots span:nth-child(2){animation-delay:.2s}.loading-dots span:nth-child(3){animation-delay:.4s}.loading-step{margin:0;font-size:.85rem;color:#fff5eacc}.upload-status{margin:12px 0 0;color:#7a604e;font-size:.95rem}.upload-error{margin:12px 0 0;color:#8b3d2d;font-size:.95rem}@keyframes pulse{0%,to{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}.modal-overlay{position:fixed;inset:0;background:#19120c73;display:grid;place-items:center;padding:24px;z-index:10;animation:fadeIn .25s ease}.modal{width:min(440px,92vw);background:#fff7ef;border-radius:24px;padding:28px;box-shadow:0 28px 50px #26180e40;border:1px solid rgba(166,126,98,.3);animation:liftIn .28s ease;text-align:left}.modal-eyebrow{margin:0 0 8px;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:#8b6a53}.modal h3{margin:0 0 10px;font-size:1.35rem;color:#2a1a10;font-family:Fraunces,Times New Roman,serif}.modal-sub{margin:0 0 22px;color:#5f4636;line-height:1.6}.modal-actions{display:grid;grid-template-columns:1fr 1.2fr;gap:12px}.modal-actions button{padding:12px 16px;border-radius:14px;font-weight:600}.modal-ghost{border:1px solid rgba(101,69,48,.3);background:transparent;color:#4b3323}.modal-primary{border:none;background:#24160e;color:#f8f2ea}.modal-actions button:hover{transform:translateY(-1px);box-shadow:0 12px 20px #24160e33}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes liftIn{0%{transform:translateY(12px) scale(.98);opacity:.8}to{transform:translateY(0) scale(1);opacity:1}}@media(max-width:820px){.panel{grid-template-columns:1fr;text-align:center}.input-row{grid-template-columns:1fr}.modal{text-align:center}.modal-actions{grid-template-columns:1fr}.bake-cta{flex-direction:column;align-items:stretch}.bake-cta .input-hint{text-align:center}.bake-button,.name-form button{width:100%}}
