:root{--bg:#fff8ec;--bg-soft:#fffdf7;--ink:#30251f;--muted:#806f63;--line:#30251f1f;--pink:#ff8fb3;--yellow:#ffd76e;--mint:#9ee6cc;--blue:#9fd8ff;--shadow:0 24px 70px #58391b29}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-height:100vh;color:var(--ink);background:radial-gradient(circle at 12% 10%,#ffd2e8e0,#0000 24rem),radial-gradient(circle at 86% 8%,#9ee6ccb3,#0000 22rem),linear-gradient(135deg,#fff7e6 0%,#fffdf8 48%,#f8fbff 100%);margin:0;font-family:Nunito,Avenir Next,Hiragino Maru Gothic ProN,Yu Gothic,sans-serif}body:before{z-index:-1;pointer-events:none;content:"";background-image:linear-gradient(#30251f09 1px,#0000 1px),linear-gradient(90deg,#30251f09 1px,#0000 1px);background-size:34px 34px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 82%);mask-image:linear-gradient(#000,#0000 82%)}a{color:inherit;text-decoration:none}button,input{font:inherit}button,label{cursor:pointer}.shell{width:min(1180px,100% - 32px);margin:0 auto}.toast{z-index:50;max-width:min(420px,100vw - 32px);color:var(--ink);border:1px solid #fffffff2;border-left:8px solid var(--blue);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffeb;border-radius:20px;align-items:center;gap:14px;padding:14px 14px 14px 18px;animation:.22s ease-out both toast-in;display:flex;position:fixed;top:22px;right:22px;box-shadow:0 18px 44px #58391b2e}.toast.error{border-left-color:var(--pink)}.toast.success{border-left-color:var(--mint)}.toast.leaving{animation:.6s ease-in both toast-out}.toast span{line-height:1.5}.toast button{width:28px;height:28px;color:var(--muted);background:#30251f0f;border:0;border-radius:999px;flex:none;place-items:center;font-size:1.15rem;line-height:1;display:grid}.site-header{justify-content:space-between;align-items:center;gap:20px;padding:24px 0;display:flex}.brand,.nav-links{align-items:center;display:flex}.brand{gap:12px}.brand-mark{color:#fff;background:var(--ink);width:46px;height:46px;box-shadow:7px 7px 0 var(--yellow);border:3px solid #fff;border-radius:16px;place-items:center;font-size:1.5rem;font-weight:900;display:grid;transform:rotate(-7deg)}.brand strong,.brand small{display:block}.brand strong{letter-spacing:.03em;font-size:1rem}.brand small,.muted{color:var(--muted)}.nav-links{border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffb3;border-radius:999px;gap:10px;padding:7px}.nav-links a{border-radius:999px;padding:10px 16px}.nav-links a:hover{background:#fff}.hero,.workspace,.contact-card{grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);align-items:stretch;gap:28px;display:grid}.hero{padding:40px 0 26px}.hero-copy,.hero-card,.upload-panel,.result-panel,.contact-card,.about-grid article{box-shadow:var(--shadow);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffffb8;border:1px solid #ffffffe0;border-radius:36px}.hero-copy{padding:clamp(28px,5vw,56px)}.eyebrow{color:#a6693f;letter-spacing:.14em;text-transform:uppercase;margin:0 0 12px;font-size:.78rem;font-weight:900}h1,h2,h3,p{margin-top:0}h1{letter-spacing:-.07em;max-width:760px;margin-bottom:18px;font-size:clamp(2.7rem,8vw,6.7rem);line-height:.9}h2{letter-spacing:-.04em;margin-bottom:10px;font-size:clamp(1.65rem,3vw,2.55rem);line-height:1}h3{margin-bottom:10px;font-size:1.15rem}.hero-copy p:not(.eyebrow),.section-heading p,.about-hero p,.contact-card p,.about-grid p{color:var(--muted);line-height:1.8}.hero-actions{flex-wrap:wrap;gap:12px;margin-top:30px;display:flex}.primary-button,.secondary-button,.button-link,.download-button{border:0;border-radius:999px;justify-content:center;align-items:center;min-height:48px;padding:0 22px;font-weight:900;transition:transform .18s,box-shadow .18s,opacity .18s;display:inline-flex;position:relative}.primary-button,.button-link{color:#fff;background:var(--ink);box-shadow:0 10px 0 var(--yellow)}.secondary-button,.download-button{color:var(--ink);border:1px solid var(--line);background:#fff}.primary-button:hover,.secondary-button:hover,.button-link:hover,.download-button:hover{transform:translateY(-2px)}.primary-button:disabled{cursor:wait;opacity:.65;transform:none}.hero-card{background:radial-gradient(circle at 24% 20%,#ff8fb3d9,#0000 10rem),radial-gradient(circle at 80% 18%,#9ee6cccc,#0000 12rem),#fffaf0;min-height:420px;position:relative;overflow:hidden}.hero-card:before,.hero-card:after{content:"";border-radius:999px;position:absolute}.hero-card:before{background:var(--yellow);width:220px;height:220px;bottom:-70px;right:-54px}.hero-card:after{background:#82cfffcc;width:180px;height:180px;bottom:28px;left:-40px}.sample-photo{z-index:1;background:linear-gradient(145deg,#ffffff61,#0000),radial-gradient(circle at 50% 28%,#ffe1e9 0 18%,#0000 19%),linear-gradient(135deg,#ffd9a3,#b9edda 55%,#a7d9ff);border:8px solid #fff;border-radius:34px;flex-direction:column;justify-content:space-between;padding:28px;display:flex;position:absolute;inset:64px 58px 104px;overflow:hidden;transform:rotate(4deg);box-shadow:0 24px 40px #452e1f33}.sample-photo span,.floating-note{background:#ffffffbf;border-radius:999px;width:fit-content;padding:8px 12px;font-size:.78rem;font-weight:900}.sample-photo strong{letter-spacing:-.08em;font-size:clamp(2.4rem,6vw,4.2rem);line-height:.85}.floating-note{z-index:2;position:absolute;bottom:50px;right:34px;transform:rotate(-6deg);box-shadow:0 14px 32px #452e1f21}.sparkle{z-index:3;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);background:#fff;width:26px;height:26px;position:absolute}.sparkle-one{animation:3.4s ease-in-out infinite floaty;top:40px;right:42px}.workspace{margin:22px 0 34px}.upload-panel,.result-panel{padding:24px}.section-heading{margin-bottom:18px}.section-heading.wide{max-width:680px}.drop-zone,.result-box{width:100%;min-height:390px;color:var(--muted);background:linear-gradient(135deg,#ffffffe6,#fff7e4bf),repeating-linear-gradient(-45deg,#ff8fb31f 0 10px,#0000 10px 20px);border:2px dashed #30251f2e;border-radius:28px;place-items:center;display:grid;position:relative;overflow:hidden}.file-input{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.drop-zone span,.result-box span{text-align:center;gap:8px;padding:26px;display:grid}.drop-zone strong{color:var(--ink);font-size:1.15rem}.drop-zone small{color:var(--muted)}.drop-zone img,.result-box img,.qr-box img{object-fit:contain;width:100%;height:100%}.drop-zone.has-preview,.result-box.has-result{background:#fff;border-style:solid}.download-button{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffe0;min-height:42px;position:absolute;bottom:16px;right:16px}.status-message{border-radius:16px;margin:14px 0 0;padding:12px 14px;line-height:1.6}.status-message.loading{color:#7b5200;background:#ffd76e3d}.status-message.success{color:#176046;background:#9ee6cc4d}.status-message.error{color:#a23255;background:#ff8fb338}.styles-section{padding:28px 0 70px}.style-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:20px;display:grid}.style-card{text-align:left;min-height:220px;color:var(--ink);background:radial-gradient(circle at 80% 18%, color-mix(in srgb, var(--accent) 42%, transparent), transparent 7.5rem), #ffffffc7;border:2px solid #ffffffe6;border-radius:28px;padding:24px;transition:transform .18s,border-color .18s,box-shadow .18s;position:relative;box-shadow:0 16px 44px #5238201a}.style-card:hover,.style-card.selected{border-color:var(--accent);transform:translateY(-4px)rotate(-.5deg);box-shadow:0 24px 60px #52382029}.style-card.selected:after{color:#fff;background:var(--ink);content:"✓";border-radius:50%;place-items:center;width:28px;height:28px;font-weight:900;display:grid;position:absolute;top:18px;right:18px}.style-pin{background:var(--accent);border-radius:999px;width:42px;height:12px;margin-bottom:28px;display:block;transform:rotate(-7deg)}.style-card strong{margin-bottom:10px;font-size:1.25rem;display:block}.style-card p{min-height:72px;color:var(--muted);margin-bottom:18px;line-height:1.65}.tag-row{flex-wrap:wrap;gap:8px;display:flex}.tag-row small{border:1px solid var(--line);color:var(--muted);background:#ffffffb8;border-radius:999px;padding:6px 10px;font-weight:800}.generate-bar{z-index:5;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffffd6;border:1px solid #ffffffe6;border-radius:24px;justify-content:space-between;align-items:center;gap:18px;margin-top:24px;padding:16px 18px;display:flex;position:sticky;bottom:18px}.generate-bar span,.generate-bar strong{display:block}.generate-bar span{color:var(--muted);font-size:.85rem}.generate-bar strong{font-size:1.15rem}.about-page{padding:34px 0 70px}.about-hero{max-width:820px;box-shadow:var(--shadow);background:#ffffffa6;border:1px solid #ffffffe0;border-radius:36px;margin-bottom:28px;padding:clamp(28px,5vw,54px)}.contact-card{align-items:center;padding:clamp(24px,4vw,40px)}.qr-box{aspect-ratio:1;color:#30251f47;border:1px solid var(--line);background:linear-gradient(135deg,#fffc,#ffd76e61),repeating-linear-gradient(90deg,#30251f0f 0 10px,#0000 10px 20px);border-radius:28px;place-items:center;min-height:260px;font-size:3rem;font-weight:900;display:grid;overflow:hidden}.about-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px;display:grid}.about-grid article{padding:24px}@keyframes floaty{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(10px)rotate(16deg)}}@keyframes toast-in{0%{opacity:0;transform:translateY(-10px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes toast-out{to{opacity:0;transform:translateY(-8px)scale(.98)}}@media (max-width:900px){.hero,.workspace,.contact-card,.about-grid{grid-template-columns:1fr}.hero-card{min-height:340px}.drop-zone,.result-box{min-height:320px}}@media (max-width:640px){.shell{width:min(100% - 20px,1180px)}.site-header{flex-direction:column;align-items:flex-start}.toast{max-width:none;top:12px;left:10px;right:10px}.nav-links{justify-content:space-between;width:100%}.nav-links a{text-align:center;flex:1}.hero{padding-top:16px}.hero-copy,.upload-panel,.result-panel,.about-hero,.contact-card,.about-grid article{border-radius:26px}.sample-photo{inset:52px 28px 92px}.style-grid{grid-template-columns:1fr}.generate-bar{flex-direction:column;align-items:stretch}.generate-bar .primary-button{width:100%}}
