/* ============================================================
   FEATURES — the one signature interaction on each page
   (split-flap countdown, follow-a-rupee, scratch cards, ...).
   Loaded after components.css on the pages that use them.
   One easing, no chrome shadows, gold on emerald.
   ============================================================ */
:root{--sig-ease:cubic-bezier(.28,.11,.32,1)}


/* ---------- CAUSE · follow a rupee ---------- */
.rupee{position:relative;padding:0}
.rupee__track{height:210vh}
.rupee__stage{
  position:sticky;top:0;height:100vh;height:100svh;
  display:flex;align-items:center;padding:1.5rem 0 calc(96px + env(safe-area-inset-bottom));
}
.rupee__stage .wrap{display:flex;flex-direction:column;align-items:center;text-align:center;width:100%}
.rupee__title{margin-top:.3rem}
.rupee__cap{min-height:1.6em;margin:.5rem auto 0;max-width:30rem;color:var(--c-on-dark-soft);font-size:1.0625rem}
.rupee__cap.is-in{animation:rupee-cap .6s var(--sig-ease)}
@keyframes rupee-cap{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.rupee__svg{width:min(560px,100%);max-height:min(44vh,360px);margin-top:.6rem;overflow:hidden}
.rupee-route{fill:none;stroke:var(--fund);stroke-width:2;stroke-linecap:round;opacity:.35}
.rupee-jar__glass{fill:color-mix(in srgb,var(--c-on-dark) 4%,transparent);stroke:color-mix(in srgb,var(--c-on-dark) 45%,transparent);stroke-width:2}
.rupee-jar__lip{fill:color-mix(in srgb,var(--c-on-dark) 30%,transparent)}
.rupee-jar__fill{fill:var(--fund);opacity:.9}
.rupee-jar__amt{text-anchor:middle;font-family:var(--font-display);font-weight:700;font-size:24px;fill:var(--fund);opacity:.3;transition:opacity .4s var(--sig-ease)}
.rupee-jar__amt.is-on{opacity:1}
.rupee-jar__pct{text-anchor:middle;font-family:var(--font-display);font-weight:700;font-size:22px;fill:var(--c-on-dark);opacity:.9}
.rupee-jar__name{text-anchor:middle;font-family:var(--font-body);font-size:15px;fill:var(--c-on-dark-soft)}
.rupee-bit circle{fill:var(--fund)}
.rupee-bit text{text-anchor:middle;font-family:var(--font-display);font-weight:700;font-size:13px;fill:var(--c-tile-void)}
.rupee-bit{opacity:0}
.rupee-coin__rim{fill:#B8862E}
.rupee-coin__face{fill:#DDAE4C;stroke:#F3D58A;stroke-width:1.5}
.rupee-coin__val{text-anchor:middle;font-family:var(--font-display);font-weight:700;font-size:16px;fill:#3A2A0C}
.rupee__try{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;margin-top:1rem;color:var(--c-on-dark-soft);font-size:.9375rem}
.rupee__try span{margin-right:.25rem}
.rupee__chip{
  min-height:44px;padding:0 1rem;border-radius:999px;cursor:pointer;
  font:inherit;font-weight:600;color:var(--c-on-dark);
  background:transparent;border:1px solid color-mix(in srgb,var(--c-on-dark) 28%,transparent);
  transition:background .3s var(--sig-ease),color .3s var(--sig-ease),transform .2s var(--sig-ease);
}
.rupee__chip:active{transform:scale(.95)}
.rupee__chip[aria-pressed="true"]{background:var(--c-primary);border-color:var(--c-primary);color:var(--c-on-primary)}
.rupee__hint{margin-top:.8rem;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--c-on-dark-soft);opacity:.7;transition:opacity .4s}
.rupee__svg.is-done ~ .rupee__hint{opacity:0}
.rupee.is-static .rupee__track{height:auto}
.rupee.is-static .rupee__stage{position:static;height:auto;padding:4rem 0}
@media (max-width:600px){
  .rupee__track{height:190vh}
  .rupee__cap{min-height:3.1em}
  .rupee__svg{max-height:42vh;width:calc(100% + 24px);margin-inline:-12px}
  .rupee-jar__name{font-size:18px}
  .rupee-jar__amt{font-size:28px}
  .rupee__try{gap:.4rem}
  .rupee__try span{flex-basis:100%;margin:0 0 .1rem}
  .rupee__chip{padding:0 .85rem}
}

/* ---------- LUCKY DRAW · scratch cards ---------- */
.scratch{
  position:absolute;inset:0;z-index:1;width:100%;height:100%;
  cursor:grab;touch-action:pan-y;outline:none;
  transition:opacity .6s var(--sig-ease),transform .6s var(--sig-ease);
}
.scratch:active{cursor:grabbing}
.scratch:focus-visible{outline:2px solid var(--c-primary-on-dark);outline-offset:-4px}
.scratch.is-gone{opacity:0;transform:scale(1.03);pointer-events:none}
.lucky-prize__photo.has-foil .lucky-medal,
.lucky-prize__photo.has-foil .lucky-chip{z-index:2}
.lucky-prize__photo.has-foil::after{z-index:1;opacity:0}
.lucky-prize__photo.has-foil img{transform:none !important}
/* a slow glint across untouched foil, so it asks to be scratched */
.scratch__sheen{
  position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;
}
.scratch__sheen::before{
  content:"";position:absolute;top:-20%;bottom:-20%;left:-40%;width:30%;
  background:linear-gradient(100deg,transparent,rgba(255,250,230,.45),transparent);
  transform:skewX(-18deg);animation:scratch-glint 3.6s var(--sig-ease) infinite;
}
@keyframes scratch-glint{0%,55%{left:-40%}100%{left:120%}}
/* once it falls away, one soft gold sweep over the photo */
.lucky-prize__photo.is-revealed::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,transparent 35%,rgba(246,222,150,.35) 50%,transparent 65%);
  background-size:300% 100%;animation:scratch-sweep 1.1s var(--sig-ease) forwards;
}
@keyframes scratch-sweep{from{background-position:100% 0}to{background-position:0 0;opacity:0}}
@media (prefers-reduced-motion:reduce){.scratch__sheen{display:none}.lucky-prize__photo.is-revealed::before{display:none}}

/* ---------- SPONSORS · your brand at the fair ---------- */
.bp{max-width:880px;margin:0 auto}
.bp__scene{width:100%;height:auto;border-radius:var(--r-lg);background:var(--c-tile-void);display:block}
.bp-far{fill:color-mix(in srgb,var(--c-on-dark) 6%,var(--c-tile-void));stroke:color-mix(in srgb,var(--c-on-dark) 6%,var(--c-tile-void));stroke-width:3}
.bp-wire{fill:none;stroke:color-mix(in srgb,var(--c-on-dark) 22%,transparent);stroke-width:1.2}
.bp-bulb{fill:#F3D58A;animation:bp-twinkle 2s var(--sig-ease) var(--d) infinite alternate}
@keyframes bp-twinkle{from{opacity:.45}to{opacity:1}}
.bp-arch rect{fill:#5B4520}
.bp-arch__top{fill:none;stroke:#5B4520;stroke-width:16;stroke-linecap:round}
.bp-rope{stroke:#8C6A2E;stroke-width:2}
.bp-banner{transform-box:view-box;transform-origin:400px 86px}
.bp-banner.is-swing{animation:bp-swing 1.4s var(--sig-ease)}
@keyframes bp-swing{0%{transform:rotate(0)}20%{transform:rotate(1.6deg)}45%{transform:rotate(-1.1deg)}70%{transform:rotate(.5deg)}100%{transform:rotate(0)}}
.bp-banner__cloth{fill:#F4EAD2}
.bp-banner__edge{fill:none;stroke:#C9962E;stroke-width:1.5}
.bp-banner__small,.bp-board__small{text-anchor:middle;font-family:var(--font-mono);font-size:10px;letter-spacing:.22em;fill:#8C6A2E}
.bp-banner__by,.bp-board__by{text-anchor:middle;font-family:var(--font-body);font-size:11px;fill:#6E5A36}
.bp-banner__name{text-anchor:middle;font-family:var(--font-display);font-weight:700;fill:#123A26}
.bp-stall__roof{fill:#1F6B45}
.bp-stall__strip{fill:#F4EAD2}
.bp-stall__name{text-anchor:middle;font-family:var(--font-display);font-weight:700;fill:#123A26}
.bp-stall__leg,.bp-board__leg{fill:#5B4520}
.bp-stall__table{fill:color-mix(in srgb,var(--c-on-dark) 14%,var(--c-tile-void))}
.bp-board__panel{fill:#123A26;stroke:#C9962E;stroke-width:1.5}
.bp-board__small{fill:#DDAE4C}
.bp-board__title{text-anchor:middle;font-family:var(--font-display);font-weight:700;font-size:22px;fill:#F4EAD2}
.bp-board__rule{stroke:#C9962E;stroke-width:1;opacity:.6}
.bp-board__by{fill:#B9C7B2;font-size:10px}
.bp-board__name{text-anchor:middle;font-family:var(--font-display);font-weight:700;fill:#DDAE4C}
.bp-ground{fill:color-mix(in srgb,var(--c-on-dark) 4%,var(--c-tile-void))}
.bp__form{display:flex;gap:.6rem;margin-top:1rem;flex-wrap:wrap}
.bp__input{
  flex:1 1 240px;min-height:48px;padding:0 1.1rem;border-radius:999px;
  font:inherit;font-size:1.0625rem;color:var(--c-ink);background:var(--c-surface);
  border:1px solid var(--c-line);outline:none;transition:border-color .3s var(--sig-ease);
}
.bp__input:focus{border-color:var(--c-primary)}
.bp__send{flex:none}
@media (max-width:520px){.bp__send{flex:1 1 100%;justify-content:center}}
@media (prefers-reduced-motion:reduce){.bp-bulb{animation:none}}

/* ---------- MOVIES · now showing ---------- */
.cine-lineup{position:relative}
.cine-dim,.cine-beam{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .5s var(--sig-ease)}
.cine-dim{z-index:1;background:rgba(3,6,4,.62)}
.cine-beam{
  z-index:2;
  background:
    radial-gradient(1.4px 1.4px at 20% 30%,rgba(255,244,214,.75),transparent),
    radial-gradient(1px 1px at 60% 70%,rgba(255,244,214,.6),transparent),
    radial-gradient(1.2px 1.2px at 80% 20%,rgba(255,244,214,.7),transparent),
    radial-gradient(1px 1px at 35% 85%,rgba(255,244,214,.55),transparent),
    linear-gradient(180deg,rgba(255,240,205,.24),rgba(255,240,205,.05));
  background-size:140px 160px,110px 130px,170px 150px,120px 180px,100% 100%;
  animation:cine-dust 14s linear infinite;
  transition:opacity .5s var(--sig-ease),clip-path .45s var(--sig-ease);
}
@keyframes cine-dust{to{background-position:40px -160px,-30px -130px,25px -150px,-20px -180px,0 0}}
.cine-lens{position:absolute;z-index:2;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#FFF1CF;opacity:0;transition:opacity .5s var(--sig-ease);pointer-events:none}
.cine-lineup.is-showing .cine-dim,.cine-lineup.is-showing .cine-beam,.cine-lineup.is-showing .cine-lens{opacity:1}
.cine-lineup.is-showing .cine-poster{position:relative;transition:opacity .5s var(--sig-ease)}
.cine-lineup.is-showing .cine-poster.is-lit{z-index:3}
.cine-lineup.is-showing .cine-poster.is-lit .cine-poster__frame{filter:brightness(1.12)}
.cine-lineup.is-showing .cine-pollbar{position:relative;z-index:3}
@media (prefers-reduced-motion:reduce){.cine-beam{animation:none}}
/* the torn ticket */
.cine-stub{position:fixed;z-index:60;pointer-events:none;display:flex;transform:translate(-50%,-100%)}
.cine-stub span{
  display:block;padding:.35rem .55rem;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.16em;font-weight:600;
  background:#DDAE4C;color:#2A1E07;transition:transform .9s var(--sig-ease),opacity .9s var(--sig-ease) .3s;
}
.cine-stub__a{border-radius:4px 0 0 4px;border-right:1.5px dashed rgba(42,30,7,.5)}
.cine-stub__b{border-radius:0 4px 4px 0}
.cine-stub.is-torn .cine-stub__a{transform:translate(-14px,-26px) rotate(-16deg);opacity:0}
.cine-stub.is-torn .cine-stub__b{transform:translate(14px,-18px) rotate(14deg);opacity:0}

/* ---------- PROGRAMME · drag through the day ---------- */
.dayscrub{margin:0 0 2.2rem;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--c-line)}
.dayscrub__sky{display:block;width:100%;height:auto;max-height:190px;aspect-ratio:800/150}
.dayscrub__stars circle{fill:#F4EAD2}
.dayscrub__stars,.dayscrub__lights,[data-ds-moon],.dayscrub__sun{transition:opacity .4s var(--sig-ease)}
.dayscrub__sun{fill:#F6DE96}
.dayscrub__moon{fill:#F4EAD2}
.dayscrub__fair path,.dayscrub__fair circle{fill:#0A110C;stroke:#0A110C}
.dayscrub__fair circle{fill:none}
.dayscrub__wire{stroke:rgba(10,17,12,.9);stroke-width:1.2}
.dayscrub__lights circle{fill:#F3D58A}
.dayscrub__row{padding:1rem 1.2rem 1.1rem;background:var(--c-surface)}
.dayscrub__read{margin:0 0 .7rem;min-height:1.6em;max-width:none;font-size:1.0625rem;color:var(--c-ink-soft)}
.dayscrub__read b{font-family:var(--font-mono);font-weight:600;color:var(--c-primary-ink);margin-right:.35rem}
.dayscrub__range{
  -webkit-appearance:none;appearance:none;width:100%;height:44px;margin:0;background:transparent;cursor:pointer;
}
.dayscrub__range::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(90deg,var(--c-primary) var(--ds-p,0%),var(--c-line) var(--ds-p,0%))}
.dayscrub__range::-moz-range-track{height:4px;border-radius:4px;background:var(--c-line)}
.dayscrub__range::-moz-range-progress{height:4px;border-radius:4px;background:var(--c-primary)}
.dayscrub__range::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;margin-top:-10px;border-radius:50%;background:var(--c-primary);border:3px solid var(--c-surface);transition:transform .2s var(--sig-ease)}
.dayscrub__range::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--c-primary);border:3px solid var(--c-surface)}
.dayscrub__range:active::-webkit-slider-thumb{transform:scale(1.12)}
.dayscrub__range:focus-visible{outline:2px solid var(--c-primary);outline-offset:2px;border-radius:8px}
.dayscrub__ends{display:flex;justify-content:space-between;margin:.1rem 0 0;max-width:none;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c-ink-mute)}
.timeline__stop{transition:opacity .3s var(--sig-ease)}
.timeline__stop.is-scrub .timeline__label{color:var(--c-primary-ink)}
.timeline__stop.is-scrub .timeline__dot{transform:scale(1.5);background:var(--c-primary-on-dark,var(--c-primary))}
.timeline__dot{transition:transform .3s var(--sig-ease),background .3s var(--sig-ease)}

/* ---------- DONATE · your gift, made real ---------- */
.giftmade{display:flex;align-items:center;gap:1rem;margin:1rem 0 1.1rem;padding:.9rem 1rem;border-radius:var(--r-md);background:color-mix(in srgb,var(--c-gold) 8%,transparent);border:1px solid color-mix(in srgb,var(--c-gold) 22%,transparent)}
.giftmade.is-empty{display:none}
.giftmade__art{position:relative;flex:none;width:64px;height:64px;color:var(--c-gold)}
.giftmade__art svg{position:absolute;inset:0;width:64px;height:64px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.giftmade__art .gm-fill{fill:color-mix(in srgb,currentColor 28%,transparent)}
.giftmade__art .gm-line{stroke:var(--c-primary-on-dark,var(--c-primary))}
.giftmade__art svg.is-in{animation:gm-in .6s var(--sig-ease) both}
.giftmade__art svg.is-out{animation:gm-out .36s var(--sig-ease) forwards}
@keyframes gm-in{from{opacity:0;transform:translateY(-14px) scale(.8)}to{opacity:1;transform:none}}
@keyframes gm-out{to{opacity:0;transform:translateY(12px) scale(.9)}}
.giftmade__body{min-width:0;flex:1}
.giftmade .donate-funds{margin:0}
.giftmade__split{display:flex;flex-wrap:wrap;gap:.3rem .9rem;margin-top:.45rem;font-size:.8125rem;color:var(--c-ink-mute)}
.giftmade__split span{display:inline-flex;align-items:baseline;gap:.3rem}
.giftmade__split span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--fund);align-self:center}
.giftmade__split b{font-weight:600;color:var(--c-ink)}

/* ---------- STALLS · pick your spot ---------- */
.is-booking .vm-zone--stall.is-open > rect{fill:color-mix(in srgb,var(--c-primary) 22%,var(--c-surface));stroke:var(--c-primary)}
.is-booking .vm-zone--stall.is-open.is-active > rect{fill:var(--c-primary)}
.is-booking .vm-zone--stall{cursor:pointer}
.vm-panel__open{display:inline-flex;align-items:center;gap:.45rem;margin:.2rem 0 .5rem;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c-primary-ink)}
.vm-panel__open-dot{width:8px;height:8px;border-radius:50%;background:var(--c-primary-on-dark,var(--c-primary));animation:bp-twinkle 1.4s var(--sig-ease) infinite alternate}
.vm-panel__book{margin-top:.9rem}
[data-venuemap-panel].is-swap{animation:rupee-cap .45s var(--sig-ease)}

/* ---------- GET INVOLVED · three-tap role finder ---------- */
.rf{margin:0 0 1.6rem;padding:1.4rem 1.5rem;border-radius:var(--r-lg);background:var(--c-surface);border:1px solid var(--c-line);animation:rupee-cap .5s var(--sig-ease)}
.rf__count{margin:0;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--c-ink-mute)}
.rf__q{margin:.35rem 0 1rem;font-family:var(--font-display);font-weight:700;font-size:clamp(1.4rem,3vw,1.8rem);line-height:1.15;color:var(--c-ink)}
.rf__text{margin:-.4rem 0 1rem;color:var(--c-ink-soft)}
.rf__when{display:inline-block;margin-left:.3rem;padding:.1rem .6rem;border-radius:999px;font-size:.8125rem;font-weight:600;color:var(--c-primary-ink);background:color-mix(in srgb,var(--c-primary) 14%,transparent)}
.rf__opts{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.rf__opt,.rf__again{
  min-height:44px;padding:0 1.1rem;border-radius:999px;cursor:pointer;font:inherit;font-weight:600;
  color:var(--c-ink);background:transparent;border:1px solid var(--c-line);
  transition:background .3s var(--sig-ease),border-color .3s var(--sig-ease),transform .2s var(--sig-ease);
}
.rf__opt:hover{border-color:var(--c-primary)}
.rf__opt:active,.rf__again:active{transform:scale(.95)}
.rf__again{border:0;color:var(--c-ink-mute);font-weight:400}
.card.is-match{border-color:var(--c-primary);box-shadow:inset 0 0 0 1px var(--c-primary)}
.card{transition:border-color .4s var(--sig-ease),box-shadow .4s var(--sig-ease)}

/* ---------- FIND MY DONATION · the receipt prints out ---------- */
.rp-slot{height:6px;margin:1.2rem auto 0;width:min(100%,480px);border-radius:6px;background:var(--c-tile-void);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--c-on-dark) 10%,transparent);opacity:0;transition:opacity .4s var(--sig-ease)}
.rp-slot.is-on{opacity:1}
.lookup-ticket.rp{animation:rp-feed 1.1s steps(9,end) var(--rp-d,0s) both}
@keyframes rp-feed{from{clip-path:inset(0 0 100% 0);transform:translateY(-40px)}to{clip-path:inset(0 0 0 0);transform:none}}
