/* Extra explanations are phone-only. All existing desktop rules remain intact. */
.phone-only { display:none; }
@media (max-width:720px) {
  .phone-only { display:block; }
  span.phone-only { display:inline; }
  .desktop-copy { display:none !important; }
  html { scroll-padding-top:116px; }
  .announcement { padding:7px 16px; min-height:30px; gap:0; font-size:.75rem; letter-spacing:.02em; }
  .announcement > span:last-child { display:none; }
  header { grid-template-columns:minmax(0,1fr) auto auto; padding:8px 16px 0; gap:6px 12px; min-height:100px; }
  header .brand { width:min(130px,100%); height:44px; min-width:0; }
  header .account-button { font-family:'DM Sans',sans-serif; font-size:.875rem; font-weight:800; padding:8px 0; min-height:44px; white-space:normal; max-width:88px; line-height:1.15; }
  header .cart-button { padding:8px 10px; min-height:44px; font-size:.875rem; border-width:2px; box-shadow:2px 2px #111; }
  header nav { grid-template-columns:1fr 1fr 1fr; }
  header nav a { font-size:.875rem; line-height:1.2; min-height:44px; padding:10px 4px; }
  .hero { padding:24px 20px 30px; gap:24px; }
  .hero .micro-label { font-size:.75rem; margin-bottom:18px; line-height:1.4; gap:12px; }
  .hero .micro-label span:last-child { display:none; }
  .hero h1 { font-size:clamp(2rem,8.8vw,2.6rem); line-height:1.07; letter-spacing:-.035em; }
  .hero h1 em { color:var(--red); text-shadow:2px 2px var(--yellow); }
  .hero-copy > .phone-intro { font-size:1rem; line-height:1.55; font-weight:500; margin:18px 0 22px; max-width:35ch; }
  .hero-actions { grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); gap:18px; }
  .hero-actions > * { font-size:.875rem; line-height:1.35; min-height:48px; }
  .hero-actions .pixel-button { padding:12px; box-shadow:3px 3px #111; }
  .hero-actions .under-button { font-family:'DM Sans',sans-serif; padding:10px 0; text-align:center; }
  .hero .hero-stage { width:100%; max-width:430px; margin:0 auto; min-width:0; }
  .hero-showcase { padding:10px; border-radius:5px; box-shadow:4px 4px #111; }
  .showcase-top { font-size:.75rem; line-height:1.5; padding:2px 0 9px; }
  .showcase-photo { aspect-ratio:1.45; }
  .showcase-photo img { object-fit:contain; }
  .showcase-photo > span { font-size:.75rem; padding:6px 8px; bottom:6px; right:6px; }
  .showcase-caption { padding:12px 0 0; gap:12px; }
  .showcase-caption > div:first-child > span { display:none; }
  .showcase-caption h2 { font-size:1.0625rem; line-height:1.25; letter-spacing:-.015em; }
  .showcase-caption .price-bubble { flex-shrink:0; }
  .showcase-caption .price-bubble strong { font-size:1.375rem; }
  .showcase-caption .price-bubble small { display:none; }
  .phone-picker-hint { font-size:.875rem; font-weight:700; margin:22px 0 8px; line-height:1.4; }
  .hero .hero-picker { margin:0; padding:3px 3px 7px; gap:8px; scroll-snap-type:x proximity; scroll-padding-inline:3px; }
  .hero .hero-picker button { flex:1 0 100px; min-width:0; padding:8px 6px; gap:6px; min-height:74px; flex-direction:column; justify-content:center; text-align:center; border-radius:5px; font-size:.875rem; line-height:1.25; scroll-snap-align:start; }
  .hero .hero-picker img { width:32px; height:32px; flex-basis:32px; border-radius:2px; }
  .hero .hero-picker button[aria-pressed=true] { box-shadow:2px 2px #111; }
  .hero-gift-context { margin-top:8px; padding-top:0; }
  .hero-gift-context p { display:none; }
  .hero-gift-context .save-text { font-size:.875rem; min-height:44px; width:100%; text-align:right; }
  .scroll-cue { display:none; }
  .marquee { padding:10px 0; font-size:.75rem; }
  .section { padding:42px 20px; }
  .section-title h2,.vibe h2,.arcade-title h2,.manifesto h2,.faq h2 { font-size:clamp(1.75rem,7.6vw,2.25rem); line-height:1.1; letter-spacing:-.03em; }
  .section-title { margin-bottom:22px; }
  .section-title > p,.vibe-copy > p,.arcade-title > p { font-size:1rem; line-height:1.6; margin-top:16px; }
  .shop-toolbar { margin-bottom:8px; }
  .filters { padding-block:4px 10px; }
  .filters .filter { min-height:44px; font-size:.875rem; padding:10px 12px; }
  .stock-note { padding:8px 20px; font-size:.75rem; line-height:1.4; }
  .shortlist-link { flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 12px; margin-bottom:20px; padding-bottom:10px; }
  .shortlist-link > span { font-size:.875rem; line-height:1.5; }
  .shortlist-link .save-text { font-size:.875rem; min-height:44px; }
  /* Compact collectible cards: full photo on the left, clear actions on the right. */
  .product-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; }
  .product-card { display:grid; grid-template-columns:minmax(0,.42fr) minmax(0,.58fr); border:2px solid #111; border-radius:8px; box-shadow:4px 4px #111; overflow:hidden; }
  .product-visual { min-width:0; border-bottom:0; border-right:2px solid #111; height:100%; aspect-ratio:auto; }
  .product-visual > button[data-product] { display:flex; width:100%; height:100%; padding:48px 4px 12px; align-items:center; min-height:200px; }
  .product-visual img { width:100%; height:auto; max-height:210px; object-fit:contain; }
  .product-visual .product-tag,.product-visual .quick-view { display:none; }
  .product-visual .heart { top:7px; right:7px; width:44px; height:44px; border-width:2px; box-shadow:2px 2px #111; font-size:25px; }
  .product-info { padding:14px 12px; min-width:0; gap:0; }
  .product-info h3 { font-size:1.0625rem; line-height:1.3; letter-spacing:-.02em; overflow-wrap:anywhere; }
  .product-info .product-kicker,.product-info > p { display:none; }
  .phone-product-details { border:0; border-bottom:1px solid #111; background:none; padding:7px 0; min-height:44px; margin:3px 0 10px; text-align:left; font:700 .875rem/1.4 'DM Sans',sans-serif; align-self:start; }
  .product-buy { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; border:0; padding-top:0; margin-top:auto; }
  .product-price { display:flex; gap:6px; align-items:baseline; flex-wrap:wrap; }
  .product-price strong { font-size:1.375rem; }
  .product-price span { font-size:.75rem; }
  .product-buy .add-button { width:100%; font-family:'DM Sans',sans-serif; font-weight:900; font-size:.875rem; padding:10px 6px; min-height:48px; border-width:2px; box-shadow:2px 2px #111; }
  .vibe { gap:20px; }
  .vibe-copy > .pixel-button { width:auto; max-width:100%; }
  .vibe-copy small { font-size:.8125rem; line-height:1.5; }
  .phone-swipe-hint { font-size:.875rem; line-height:1.5; font-weight:700; margin:4px 0 -14px; }
  .vibe-stack { grid-auto-columns:minmax(0,62%); gap:16px; scroll-snap-type:x proximity; }
  .vibe-stack .mood-card { box-shadow:3px 3px #111; padding:10px; }
  .mood-card strong { font-size:1.5rem; line-height:1.05; left:16px; top:40px; }
  .mood-card i { right:14px; bottom:14px; }
  .arcade-title { margin-bottom:24px; }
  .memory-feature,.detective-feature,.note-feature { padding:20px; border-radius:8px; }
  .memory-feature h3,.arcade-side h3 { font-size:1.5rem; line-height:1.15; margin:18px 0; }
  .arcade-label { gap:8px; }
  .arcade-label > b { font-family:'DM Sans',sans-serif; font-size:.75rem; }
  .arcade-pairs { max-width:300px; gap:7px; margin-bottom:18px; }
  .arcade-pairs span { font-size:1.25rem; animation:none; }
  .prize-grid { width:100%; }
  .prize-grid strong { font-size:1.875rem; }
  .prize-grid b { font-size:1.25rem; }
  .prize-grid > div { min-width:0; padding-block:10px; }
  .memory-feature > p,.detective-feature > p,.note-feature > p { font-size:1rem; line-height:1.55; }
  .memory-feature > small { font-size:.875rem; line-height:1.6; }
  .memory-feature > .pixel-button,.detective-feature > .pixel-button { font-size:.875rem; min-height:48px; }
  .detective-teaser { height:86px; gap:16px; margin:12px 0; }
  .detective-teaser img { width:86px; height:86px; }
  .detective-teaser span { font-size:.875rem; }
  .manifesto { gap:22px; }
  .manifesto-list p { padding:16px 0; font-size:1rem; }
  .final-cta { padding:40px 20px; }
  .final-cta h2 { font-size:2.25rem; line-height:1.1; }
  /* Unearned promotion no longer floats over the shopping controls. */
  .reward-dock[data-earned="false"] { position:static; transform:none; margin:0 20px 24px; width:auto; max-width:none; }
  .reward-dock[data-earned="true"] { width:calc(100% - 24px); max-width:380px; }
  footer { padding-bottom:84px; }
}
@media(max-width:360px) {
  header { padding-inline:12px; gap:6px 8px; }
  header .brand { width:min(102px,100%); }
  header .cart-button { padding-inline:8px; }
  .hero,.section { padding-inline:16px; }
  .hero-actions { gap:12px; }
  .hero .hero-picker button { flex-basis:94px; }
  .product-card { grid-template-columns:minmax(0,.39fr) minmax(0,.61fr); }
  .product-info { padding:12px 10px; }
  .product-info h3 { font-size:1rem; }
  .vibe-stack { margin-inline:-16px; width:calc(100% + 32px); padding-inline:16px; }
}
@media (max-width:720px) and (prefers-reduced-motion:reduce) {
  .vibe-stack,.hero .hero-picker { scroll-snap-type:none; }
}

/* Slim arrival hint: one tap to play, one tap to dismiss. */
#reward-dock.reward-dock[hidden],body:has(#modal[open]) #reward-dock { display:none; }
#reward-dock[data-earned="false"] {
  position:fixed; left:50%; right:auto; bottom:calc(10px + env(safe-area-inset-bottom));
  transform:translateX(-50%); margin:0; width:calc(100% - 24px); max-width:360px;
  display:flex; align-items:center; gap:0; padding:4px; overflow:hidden;
  background:#171721; color:#fff; border:2px solid #fff;
  border-radius:12px; box-shadow:3px 3px 0 #0878ff;
}
#reward-dock .reward-hint-play {
  flex:1; min-width:0; min-height:56px; padding:6px 10px;
  display:flex; flex-direction:row; align-items:center; justify-content:space-between;
  gap:8px; background:transparent; color:#fff; border:0; text-align:left;
}
#reward-dock .reward-hint-copy { min-width:0; white-space:normal; }
#reward-dock .reward-hint-copy strong { display:block; font-size:.875rem; font-weight:900; line-height:1.4; }
#reward-dock .reward-hint-copy small { display:block; margin-top:3px; font-size:.8125rem; font-weight:500; line-height:1.4; color:#dedeea; }
#reward-dock .reward-hint-arrow { color:#ffe62f; font-size:18px; flex-shrink:0; }
#reward-dock .reward-hint-close {
  flex:0 0 44px; width:44px; min-width:44px; min-height:44px;
  padding:0; display:grid; place-items:center; border:0; border-left:1px solid #50505b;
  background:transparent; color:#fff; font-size:24px;
}
#reward-dock .reward-hint-play:hover,#reward-dock .reward-hint-close:hover { background:#30303d; }