/* Bay theme's own touches over the shared look: the hand-drawn side borders and card frames
   (decor.js draws them), and the wish cards' warm tones and shadows. */
/* watercolor side stripes like the invite border */
body::after{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:30;
  background:
    linear-gradient(90deg, transparent calc(max(4px, env(safe-area-inset-left,0px)) ), rgba(141,169,207,.70) 0 calc(max(4px, env(safe-area-inset-left,0px)) + 6px), transparent 0 calc(max(4px, env(safe-area-inset-left,0px)) + 10px), rgba(59,90,140,.42) 0 calc(max(4px, env(safe-area-inset-left,0px)) + 11.5px), transparent 0),
    linear-gradient(270deg, transparent calc(max(4px, env(safe-area-inset-right,0px)) ), rgba(141,169,207,.70) 0 calc(max(4px, env(safe-area-inset-right,0px)) + 6px), transparent 0 calc(max(4px, env(safe-area-inset-right,0px)) + 10px), rgba(59,90,140,.42) 0 calc(max(4px, env(safe-area-inset-right,0px)) + 11.5px), transparent 0);
}
/* drawn version (script): same two-line border, wobbly edges, crisp on any screen */
html.sides body::after{display:none}
.side{position:fixed; top:0; bottom:0; width:13px; height:100%; z-index:30; pointer-events:none; overflow:visible}
.side.l{left:max(4px, env(safe-area-inset-left,0px))}
.side.r{right:max(4px, env(safe-area-inset-right,0px)); transform:scaleX(-1)}
.side .wash{fill:rgba(141,169,207,.70)}
.side .ink{fill:none; stroke:rgba(59,90,140,.42); stroke-width:1.5; stroke-linecap:round}
/* hand-drawn ink frame (SVG, drawn by script) - crisp on every screen, unlike a filter */
.card.framed::before{display:none}
.frame{position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none}
.frame path{fill:none; stroke:var(--line); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round}
/* wish cards: each a slightly different white, with warm paper shadows */
.note{
  box-shadow:
    0 1px 1px rgba(70,58,44,.10),
    0 3px 6px -2px rgba(70,58,44,.12),
    0 14px 22px -14px rgba(40,52,84,.38),
    inset 0 0 0 1px rgba(255,255,255,.55),
    inset 0 0 26px rgba(150,130,100,.07);
}
.note[data-v="0"]{--tone:#fffefb}
.note[data-v="1"]{--tone:#fefcf6}
.note[data-v="2"]{--tone:#fdfeff}
.note[data-v="3"]{--tone:#fefaf2}
.note[data-v="4"]{--tone:#fffdf8}
.note[data-v="5"]{--tone:#fffcf7}
