/* INVITO foil: the special section (Round 15). Three variants in templates/foil.html,
   one shown (assets/sp-old/sp.js). Scoped under .fosp; sits between "the evening"
   and the venue, in the template's own paper fields. */
.fosp{--fx:cubic-bezier(.16,1,.3,1);padding-top:clamp(34px,8vw,52px);padding-bottom:clamp(30px,7vw,48px)}
.fosp .w{display:flex;flex-direction:column;align-items:center}
.fosp-cap{display:flex;align-items:center;gap:14px;justify-content:center;font:600 11.5px/1 var(--sans);letter-spacing:.34em;text-indent:.34em;text-transform:uppercase;direction:ltr;color:var(--terra)}
.fosp-cap::before,.fosp-cap::after{content:"";height:1px;width:30px;background:currentColor;opacity:.45}
.fosp-t{margin:12px 0 0;font:400 clamp(32px,8.8vw,44px)/1.14 var(--serif);letter-spacing:0;color:var(--ink);text-wrap:balance}
.fosp-lede{margin:6px auto 0;max-width:24em;font:300 16.5px/1.5 var(--sans);color:var(--ink-2);text-wrap:balance}
.fosp .spk-lm{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.fosp .spk-lm>span{display:block}
.fosp-st{position:relative;margin:16px auto 0;width:min(340px,100%);touch-action:pan-y;-webkit-user-select:none;user-select:none}
.fosp-sw{position:relative;display:grid;width:100%;margin-top:14px}
.fosp-sw>*{grid-area:1/1;min-width:0}
.fosp-ok{visibility:hidden;opacity:0;font:400 19px/1.4 var(--serif);color:var(--ink)}
.fosp-ok small{display:block;margin-top:3px;font:300 14.5px/1.45 var(--sans);color:var(--ink-2)}
.fosp-lnk{-webkit-appearance:none;appearance:none;border:0;background:none;cursor:pointer;display:inline-flex;align-items:center;min-height:42px;padding:0 14px;
  font:400 15px/1.2 var(--sans);color:inherit;text-decoration:underline;text-underline-offset:5px;text-decoration-color:rgba(180,145,63,.6)}
.fosp-fx{position:absolute;left:0;top:0;pointer-events:none;z-index:1}
.fosp .w{z-index:2}
.fosp :focus-visible{outline:2px solid var(--bronze);outline-offset:3px;border-radius:8px}
.fosp-gold{background:var(--foil) 0 0/240% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}

/* sage field (a): light copy */
.fosp.f-sage .fosp-cap{color:rgba(246,243,234,.88)}
.fosp.f-sage .fosp-t{color:#FBF8EF}
.fosp.f-sage .fosp-lede,.fosp.f-sage .fosp-ok small{color:rgba(250,247,238,.9)}
.fosp.f-sage .fosp-ok{color:#FBF8EF}

/* the press room (b) */
.fosp-dk{background:radial-gradient(90% 60% at 50% 46%,#3a2c1c,#211910 62%,var(--dark));color:var(--on-dark)}
.fosp-dk::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;mix-blend-mode:overlay;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 5px)}
.fosp-dk .fosp-cap{color:var(--bronze-lit)}
.fosp-dk .fosp-t{color:var(--on-dark)}
.fosp-dk .fosp-lede,.fosp-dk .fosp-ok small{color:var(--on-dark-2)}
.fosp-dk .fosp-ok{color:var(--on-dark)}

/* ---------- a: scratch and win ---------- */
.fosp-tk{position:relative;height:308px;border-radius:12px;
  background:linear-gradient(176deg,#fdfaf3,#f1e9da 70%,#e9dfcc);
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 2px 3px rgba(30,40,25,.18),0 28px 36px -22px rgba(23,30,20,.65)}
.fosp-tk::before{content:'';position:absolute;inset:9px;border:1px solid rgba(180,145,63,.55);border-radius:7px;pointer-events:none}
.fosp-tk::after{content:'';position:absolute;left:14px;right:14px;top:226px;border-top:1.5px dashed rgba(124,97,32,.35);pointer-events:none}
.fosp-nt{position:absolute;top:218px;width:18px;height:18px;border-radius:50%;background:var(--sage);box-shadow:inset 0 2px 3px rgba(0,0,0,.18)}
.fosp-nt.l{left:-9px}.fosp-nt.r{right:-9px}
.fosp-hd{position:absolute;left:0;right:0;top:24px;font:600 10.5px/1 var(--sans);letter-spacing:.32em;text-indent:.32em;color:var(--bronze-deep);direction:ltr}
.fosp-no{position:absolute;top:22px;inset-inline-end:22px;font:300 italic 13px/1 var(--latin);color:rgba(124,97,32,.75);direction:ltr}
.fosp-nm{position:absolute;left:24px;right:24px;top:42px;font:400 22px/1.25 var(--serif);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fosp-coins{position:absolute;left:0;right:0;top:86px;display:flex;justify-content:center;gap:12px}
.fosp-coin{position:relative;width:94px;height:94px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 50% 42%,#fffdf7,#efe5d1);box-shadow:inset 0 2px 4px rgba(90,64,20,.22),inset 0 0 0 1px rgba(180,145,63,.4)}
.fosp-coin>span{position:relative;font:400 19px/1.12 var(--serif);color:var(--ink);padding:0 7px;text-wrap:balance}
.fosp-coin canvas{position:absolute;inset:0;border-radius:50%;cursor:pointer;touch-action:none}
.fosp-coin i{position:absolute;inset:0;border-radius:50%;overflow:hidden;pointer-events:none}
.fosp-coin i::after{content:'';position:absolute;top:-20%;bottom:-20%;left:-60%;width:45%;transform:translateX(var(--gx,-40px)) rotate(18deg);
  background:linear-gradient(90deg,rgba(255,252,236,0),rgba(255,252,236,.75),rgba(255,252,236,0))}
.fosp-sc{position:absolute;left:0;right:0;top:192px;font:300 italic 17px/1 var(--latin);color:rgba(111,101,86,.85);pointer-events:none;direction:ltr}
.fosp-pz{position:absolute;left:22px;right:22px;top:238px;height:56px;border-radius:6px;display:grid;place-items:center;visibility:hidden;
  background:var(--foil) 100% 0/240% 100%;box-shadow:inset 0 1px 0 rgba(255,250,225,.7),inset 0 -2px 0 rgba(90,64,20,.25)}
.fosp-pz b{display:block;font:600 11.5px/1 var(--sans);letter-spacing:.06em;color:#4a3910}
.fosp-pz em{display:block;margin-top:5px;font:normal 400 20px/1.1 var(--serif);color:#2e2208;white-space:nowrap}
.fosp-tk .fosp-und{position:absolute;left:22px;right:22px;top:238px;height:56px;display:grid;place-items:center;
  font:300 14px/1.3 var(--sans);color:rgba(111,101,86,.8)}

/* ---------- b: your name in gold foil ---------- */
.fosp-b .fosp-st{height:262px}
.fosp-die{position:absolute;left:50%;top:0;margin-left:-115px;z-index:5;pointer-events:none;will-change:transform}
.fosp-dsh{position:absolute;left:50%;top:150px;width:300px;height:90px;margin-left:-150px;z-index:3;pointer-events:none;opacity:0;
  background:radial-gradient(closest-side,rgba(20,12,4,.55),rgba(20,12,4,0))}
.fosp-heat{position:absolute;left:50%;top:132px;width:280px;height:70px;margin-left:-140px;z-index:4;pointer-events:none;opacity:0;
  background:radial-gradient(closest-side,rgba(255,214,140,.55),rgba(255,214,140,0))}
.fosp-card{position:absolute;left:50%;top:96px;width:300px;height:162px;margin-left:-150px;z-index:2;transform-origin:50% 100%}
.fosp-card canvas{position:absolute;inset:0}
.fosp-cs{position:absolute;left:50%;top:150px;width:330px;height:130px;margin-left:-165px;z-index:1;pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%,rgba(0,0,0,.6),rgba(0,0,0,0))}
.fosp-foot{position:absolute;left:0;right:0;bottom:20px;font:300 13.5px/1.45 var(--sans);color:#6f6556;z-index:2}
.fosp-foot span{display:block;font:400 italic 15.5px/1.2 var(--latin);color:var(--bronze-deep);direction:ltr}
.fosp-in{display:flex;flex-direction:column;align-items:center;gap:10px}
.fosp-fld{display:block;width:100%;max-width:300px;padding:12px 18px;border-radius:14px;border:1px solid var(--line-d);background:rgba(36,28,19,.75);
  color:var(--on-dark);font:400 18px/1.4 var(--sans);text-align:center;-webkit-appearance:none;appearance:none}
.fosp-fld::placeholder{color:var(--on-dark-2);opacity:.75}
.fosp-fld:focus{outline:none;border-color:var(--bronze-lit)}
.fosp-fld.shk{animation:fospShk .5s var(--fx)}
@keyframes fospShk{20%{transform:translateX(-8px)}40%{transform:translateX(7px)}60%{transform:translateX(-5px)}80%{transform:translateX(3px)}}
.fosp-go{-webkit-appearance:none;appearance:none;border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 30px;border-radius:999px;
  font:600 16.5px/1 var(--sans);color:#2a1f0c;background:var(--foil) 30% 0/220% 100%;
  box-shadow:inset 0 1px 0 rgba(255,250,225,.75),inset 0 -2px 0 rgba(90,64,20,.3),0 14px 26px -14px rgba(0,0,0,.8);transition:transform .4s var(--fx)}
.fosp-go:active{transform:scale(.96);transition-duration:.1s}
.fosp-go[disabled]{opacity:.55;pointer-events:none}
.fosp-go svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ---------- c: foil stamped bingo ---------- */
.fosp-c .fosp-st{width:min(344px,100%)}
.fosp-card3{position:relative;padding:12px;border-radius:10px;background:linear-gradient(178deg,#fbf7ee,#efe7d6);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 2px 3px rgba(40,30,15,.12),0 24px 32px -22px rgba(40,30,15,.5)}
.fosp-card3::before{content:'';position:absolute;inset:6px;border:1px solid rgba(180,145,63,.45);border-radius:6px;pointer-events:none}
.fosp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.fosp-cell{-webkit-appearance:none;appearance:none;border:0;cursor:pointer;position:relative;height:84px;border-radius:6px;overflow:hidden;display:grid;place-items:center;padding:6px;
  background:#f6f0e3;box-shadow:inset 0 2px 3px rgba(90,64,20,.18),inset 0 -1px 0 rgba(255,255,255,.9),inset 0 0 0 1px rgba(180,145,63,.32)}
.fosp-cell span{position:relative;z-index:2;font:400 14.5px/1.25 var(--sans);color:var(--ink);text-wrap:balance}
.fosp-cell .f{position:absolute;inset:0;z-index:1;opacity:0;background:var(--foil) 0 0/300% 300%;
  box-shadow:inset 0 1px 0 rgba(255,250,225,.75),inset 0 -2px 2px rgba(90,64,20,.35)}
.fosp-cell .f::after{content:'';position:absolute;top:-30%;bottom:-30%;left:-50%;width:40%;transform:translateX(var(--gx,-60px)) rotate(16deg);
  background:linear-gradient(90deg,rgba(255,252,236,0),rgba(255,252,236,.8),rgba(255,252,236,0))}
.fosp-cell.on span{color:#2f220b;font-weight:600}
.fosp-cell.free span{font:400 20px/1.1 var(--serif)}
.fosp-stamp{position:absolute;left:0;top:0;z-index:6;pointer-events:none;opacity:0}
.fosp-cnt{font:300 15px/1.5 var(--sans);color:var(--ink-2)}
.fosp-cnt small{display:block;font-size:13.5px;color:var(--muted)}
.fosp-bingo{display:block;font:400 36px/1.1 var(--serif);background-image:var(--foil-d)}

@media (prefers-reduced-motion:reduce){.fosp-fld.shk{animation:none}}