/* Birthday look (Oct 28 2026). Loaded AFTER style.css + theme-light.css on the birthday pages only (/b/, the birthday
   maker and video maker, home, 404). Adds the coral/teal party accents and the cover "gift tag tied with a ribbon"
   (PLAN 4d). CSS only, no inline styles (CSP unchanged). Text colours keep the white theme's contrast. */
:root{--b-coral:#ff7f6e;--b-coral-dk:#c94a3a;--b-teal:#2ec4b6;--b-yellow:#ffd23f;--b-lilac:#b79ced}
.card{border-color:var(--b-coral)}
/* Cover: the blurred picture is wrapped like a present (one ribbon across, one down), the tag hangs from it. */
.cover .art::before,.cover .art::after{content:"";position:absolute;z-index:1;background:linear-gradient(90deg,rgba(255,255,255,.25),rgba(255,255,255,0) 40%),var(--b-coral);box-shadow:0 2px 6px rgba(80,20,10,.25)}
.cover .art::before{left:0;right:0;top:46%;height:30px;margin-top:-15px}
.cover .art::after{top:0;bottom:0;left:50%;width:30px;margin-left:-15px}
.cover .tagpanel{border-color:var(--b-coral-dk);background:rgba(255,250,240,.95)}
.cover .tagpanel::before{border-color:var(--b-coral-dk);background:#fff}
/* the string from the ribbon to the tag's hole */
.cover .tagpanel::after{content:"";position:absolute;top:-40px;left:50%;width:4px;height:34px;margin-left:-2px;border-radius:2px;background:var(--b-coral-dk)}
.tagpanel h1{color:#7a2a1e}
.tagpanel p{color:#6b3a2a}
/* small party touches on the white pages */
.brand{color:#a33a2b}
.step{background:var(--b-teal);color:#0d2e2b}
.progress-steps .bar>div{background:var(--b-teal)}
.picker-tip{margin:.6rem 0 0}

/* QA D1 (Oct 28): on phones the card fills most of the width, so the reveal's confetti + balloons (canvas.fx.party,
   js/fx.js) are drawn OVER the card instead of behind it. pointer-events stay none (style.css), so every tap and the
   tap-to-skip still work. It lasts at most 2.5 s, then the canvas is cleared. Desktop (700 px and up) keeps the
   behind-the-card look. The Christmas canvas has no "party" class, so this never applies to it. */
@media (max-width: 699px) { canvas.fx.party { z-index: 30; } }