@font-face{font-family:Bakery;src:url('bakery-display.otf') format('opentype');font-weight:700;font-display:swap}
body{background:var(--yellow);color:var(--blue)}header{padding:18px 5%;border-bottom:2px solid var(--blue);gap:20px;max-width:1600px}.brand{display:block;width:185px;flex-shrink:0;line-height:normal}.brand img{display:block;width:100%;height:auto}.header-note{line-height:1.4;transform:rotate(-3deg)}.bag{border:2px solid var(--blue);border-radius:40px;padding:10px 13px 10px 18px;background:var(--cream);box-shadow:3px 3px 0 var(--blue);white-space:nowrap}.bag span{background:var(--blue);color:var(--yellow);width:28px;height:28px}main{max-width:1600px;grid-template-columns:46% 54%;align-items:start}.story{padding:42px 8% 26px;position:sticky;top:0;min-width:0;border:0}.intro h1{font-family:Bakery,Georgia,serif;font-size:clamp(56px,6.6vw,98px);font-weight:700;letter-spacing:-.055em;line-height:1.02;margin:0 0 22px}.intro h1 em{font-style:normal;display:inline-block;color:var(--yellow);background:var(--blue);border-radius:14px;padding:0 15px 6px;transform:rotate(-4deg);margin:4px 0}.intro>p:last-child{font-size:17px;margin:0 0 30px}.photo-wrap{position:relative;transform:rotate(-3deg);margin-right:12px}.story .photo-wrap>img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;object-position:center 58%;border-radius:18px;border:3px solid var(--blue);box-shadow:8px 8px 0 var(--blue)}.photo-sticker{position:absolute;right:-24px;top:-22px;background:var(--cream);border:2px solid var(--blue);border-radius:50%;width:105px;height:105px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:900;font-size:17px;line-height:1.05;transform:rotate(12deg)}.image-caption{align-items:center;font-weight:700;padding:25px 0 0}.image-caption span:last-child{font-size:26px}.builder{background:var(--cream);border-left:2px solid var(--blue);padding:42px 7% 34px;min-width:0}.builder-top{padding-bottom:24px}.builder-top .eyebrow{display:inline-block;background:var(--yellow);padding:6px 10px;border-radius:6px;margin-bottom:12px}h2{font-family:Bakery,Georgia,serif;font-size:clamp(34px,3.6vw,52px);line-height:1.05;letter-spacing:-.055em;font-weight:700}.builder-top>p:last-child{margin:0;font-size:15px}fieldset{margin-bottom:32px}legend{font-size:19px;font-weight:800;gap:11px}.step{font-size:13px;background:var(--blue);color:var(--cream);width:32px;height:32px;flex-shrink:0;border-radius:10px;transform:rotate(-5deg)}.sizes{grid-template-columns:1fr 1fr;gap:12px}.size{position:relative;padding:17px 14px;border:2px solid var(--blue);border-radius:16px;align-items:flex-start;gap:9px;transition:background .15s,transform .15s}.size:has(input:checked){box-shadow:4px 4px 0 var(--blue);transform:translate(-2px,-2px)}.size input{margin-top:3px;width:17px;height:17px;flex-shrink:0}.size span{min-width:0}.size strong{font-size:17px;line-height:1.15;margin:8px 0 7px}.size small:first-child{font-size:12px;font-weight:800;letter-spacing:.02em}.size b{font-size:20px;position:absolute;bottom:13px;right:12px}.size small:last-child{padding-right:34px}.mix-label{align-items:center}.mix-label strong{background:var(--blue);color:var(--cream);border-radius:30px;padding:4px 12px}.track{height:8px;margin:13px 0 18px;border-radius:8px;overflow:hidden}.flavor{display:grid;grid-template-columns:90px 1fr auto;gap:12px;padding:13px 12px 13px 8px;margin:0 0 12px;border:2px solid var(--blue);border-radius:16px;background:#ffefb8}.flavor-1{background:#f6e0c3}.flavor-2{background:#ead9ce}.cookie-photo{height:86px;width:86px;background-image:url('cookies.png');background-size:300% 100%;background-repeat:no-repeat;border-radius:50%;mix-blend-mode:multiply}.cookie-0{background-position:0 50%}.cookie-1{background-position:50% 50%}.cookie-2{background-position:100% 50%}.flavor-copy{min-width:0}.flavor-tag{font-size:12px;letter-spacing:.02em;font-weight:800;display:block;margin-bottom:5px}.flavor strong{font-family:Bakery,Georgia,serif;font-size:19px;line-height:1.1;display:block;letter-spacing:-.6px}.flavor p{font-size:14px;line-height:1.35;margin:7px 0 0;color:var(--ink)}.counter{gap:7px}.counter button{border:2px solid var(--blue);background:var(--cream);line-height:1}.counter button[data-delta='1']{background:var(--blue);color:var(--cream)}.counter button:hover:not(:disabled){transform:scale(1.07)}.counter output{font-weight:700}textarea{border:2px solid var(--blue);border-radius:14px;padding:16px;min-height:110px;box-shadow:4px 4px 0 var(--yellow)}.note-caption{margin-top:10px}.dates{gap:10px}.date{border:2px solid var(--blue);border-radius:14px}.date:has(input:checked){box-shadow:3px 3px 0 var(--blue)}.checkout{border:0;background:var(--blue);color:var(--cream);border-radius:20px;padding:23px}.checkout>div{gap:14px}.checkout>div>span{font-size:14px}.checkout strong{font-size:28px}.primary{border-radius:40px;border:2px solid var(--blue);gap:12px}.primary:hover{transform:translateY(-2px)}.checkout .primary{background:var(--yellow);color:var(--blue);border-color:var(--yellow)}.checkout .fine{color:var(--cream);text-align:center;margin-bottom:0}#error{color:#fff0b2}footer{background:var(--yellow);border-top:2px solid var(--blue);margin:0 auto;max-width:1600px}footer p{text-align:right}.small{width:145px}dialog{border:3px solid var(--blue);border-radius:24px;box-shadow:8px 8px 0 var(--yellow)}
@media(max-width:1100px) and (min-width:761px){.builder{padding:35px 5%}.flavor{grid-template-columns:70px 1fr}.cookie-photo{width:66px;height:66px}.counter{grid-column:2;justify-content:flex-start}.sizes{grid-template-columns:1fr}.size b{position:static}.size strong{margin:3px 0}.size small:last-child{padding-right:0}.story{padding:42px 7%}.intro h1{font-size:68px}}
@media(max-width:760px){header{padding:13px 5%;gap:14px}.brand{width:155px}.header-note{display:none}.bag{font-size:13px;padding:7px 9px 7px 13px;box-shadow:2px 2px 0 var(--blue)}.bag span{margin-left:5px;width:25px;height:25px}main{display:block}.story{position:relative;display:grid;grid-template-columns:1.05fr 1fr;gap:12px;padding:25px 6% 28px;align-items:center;overflow:hidden}.intro .eyebrow{display:none}.intro h1{font-size:clamp(35px,8.8vw,58px);margin:0 0 12px}.intro h1 em{border-radius:7px;padding:0 9px 3px}.intro>p:last-child{font-size:14px;line-height:1.4;margin:0}.photo-wrap{margin:0;transform:rotate(5deg)}.story .photo-wrap>img{aspect-ratio:3/4;border-radius:12px;border-width:2px;box-shadow:4px 4px 0 var(--blue);object-position:51% 65%}.photo-sticker{width:66px;height:66px;font-size:12px;right:-4px;top:-16px}.image-caption{display:none}.builder{border-left:0;border-top:2px solid var(--blue);padding:28px 5% 32px;border-radius:26px 26px 0 0}.builder-top .eyebrow{display:none}.builder h2{font-size:35px;line-height:1.05;margin-bottom:9px}.builder h2 br{display:none}.builder-top>p:last-child{font-size:14px;margin:0}.builder-top{padding-bottom:24px}.flavor{grid-template-columns:72px 1fr;gap:9px;padding:12px}.cookie-photo{width:70px;height:70px;grid-row:1/3}.flavor strong{font-size:20px}.flavor-tag{font-size:12px}.flavor p{font-size:14px}.counter{grid-column:2;gap:12px}.counter button{width:38px;height:38px;font-size:23px}.size{padding:14px 10px;gap:6px}.size strong{font-size:16px}.size small:first-child{font-size:12px}.size b{font-size:18px;right:9px}.size small:last-child{font-size:14px}.small{width:130px}footer p{font-size:12px;max-width:180px}.checkout{padding:20px}}
@media(max-width:370px){.sizes{grid-template-columns:1fr}.size b{position:static}.size strong{margin:4px 0}.size small:last-child{padding-right:0}header .brand{width:130px}.builder h2{font-size:31px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
