.hero { min-height: 0; padding-top: 40px; padding-bottom: 22px; }
.hero-copy { margin-top: 22px; }
.section-title h2 { font-size: clamp(2rem, 8vw, 4.6rem); line-height: 1; }
.card-description { font-size: .9rem; line-height: 1.4; }
.card-name { line-height: 1.12; }
.section-kicker, .section-note, .notice { font-size: .875rem; }
.app { padding-bottom: 154px; }
.cart-bar { min-height: 98px; gap: 8px; padding: 8px 12px; }
.cart-button { padding-inline: 12px; }
.chamuko { position: relative; display: block; padding: 0; background: transparent; border: 0; flex-shrink: 0; overflow: hidden; width: 84px; height: 84px; cursor: pointer; }
.chamuko-art { display: block; width: 100%; height: 100%; background: url('assets/chamuko-poses.png') 0 0 / 200% 200% no-repeat; transform-origin: center bottom; }
.chamuko[data-pose='watch'] .chamuko-art { background-position: 100% 0; }
.chamuko[data-pose='sit'] .chamuko-art { background-position: 0 100%; }
.chamuko[data-pose='celebrate'] .chamuko-art { background-position: 100% 100%; }
.chamuko.react .chamuko-art { animation: ch-reaction .7s ease both; }
.chamuko.hide .chamuko-art { animation: ch-hide .95s ease both; }
.chamuko.peek .chamuko-art { animation: ch-peek .8s ease both; }
.dessert-companion { align-self: center; justify-self: center; text-align: center; }
.dessert-companion .chamuko { width: clamp(120px, 24vw, 210px); height: clamp(120px, 24vw, 210px); }
.dessert-companion p { margin: 0; font-size: .9rem; color: var(--muted); }
.cart-bar.pulse { animation: cart-pulse .45s ease; }
.add.added { background: var(--cream); color: var(--black); }
.quantity button { width: 44px; height: 44px; }
.cart-row { grid-template-columns: 1fr auto; }
.cart-row > strong { grid-column: 2; text-align: right; }
.flying-product { position: fixed; z-index: 20; width: 58px; height: 58px; border-radius: 50%; background: var(--red) center/cover; border: 2px solid var(--cream); pointer-events: none; box-shadow: 0 4px 15px #0008; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; clip-path: inset(50%); overflow: hidden; white-space: nowrap; }
button:focus-visible { outline: 3px solid var(--red); outline-offset: 4px; }
.chamuko:focus-visible { outline-color: var(--cream); }
@keyframes ch-reaction { 0%,100% { transform: translateY(0) rotate(0); } 35% { transform: translateY(-7px) rotate(-4deg); } 70% { transform: rotate(3deg); } }
@keyframes ch-hide { 0%,100% { transform: translateY(0); } 40%,65% { transform: translateY(105%); } }
@keyframes ch-peek { from { transform: translateY(105%); } to { transform: translateY(0); } }
@keyframes cart-pulse { 50% { box-shadow: 0 0 0 4px var(--red), 0 10px 32px #0008; } }
@media (min-width:620px) and (orientation:portrait) { .grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .card-image { height: 230px; } .card-copy { padding: 20px; } .card-name { font-size: 2rem; } .add { width: 60px; height: 58px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; } }