/* Copyright 2026 Gold Standard Builder Services LLC. Funtime's first Mystery launch. */
@font-face{font-family:'Funtime Fantasy';src:url('/assets/fonts/cinzel-decorative-bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
.ff-launch-banner{--launch-art:url('/assets/mystery-launch/v1/oom-traea-pineapple.webp');background:#160c24;color:#ffecb3;position:relative;isolation:isolate;border-bottom:1px solid #9c642c}
.ff-launch-scene{position:relative;max-width:2172px;margin:auto;width:100%;aspect-ratio:2172/320;background:var(--launch-art) left top/100% auto no-repeat}
.ff-launch-content{position:absolute;inset:13% 18% 12% 19%;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.25fr) minmax(90px,.53fr);gap:clamp(12px,1.5vw,32px);align-items:center}
.ff-launch-banner a{color:#ffedb2;text-decoration:none}
.ff-launch-banner a:focus-visible{outline:3px solid #d4ffff;outline-offset:5px}
.ff-launch-brand{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px}
.ff-launch-title{font-family:'Funtime Fantasy',Georgia,serif;font-weight:700;text-transform:uppercase;font-size:clamp(26px,3vw,65px);line-height:.98;letter-spacing:-.055em;color:#ffde8b;text-shadow:0 1px #fff0b4,1px 3px #6e2e0d,2px 4px #09000d,0 0 14px #d87e2270}
.ff-launch-tagline{font-family:Georgia,serif;font-size:clamp(12px,1.12vw,24px);font-style:italic;line-height:1.2;white-space:nowrap;color:#fff0b4}
.ff-launch-clock{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px}
.ff-launch-clock>div{aspect-ratio:150/132;background:url('/assets/mystery-launch/v1/timer-frame.svg') center/100% 100% no-repeat;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10% 5%;box-sizing:border-box;filter:drop-shadow(0 0 5px #e9a32b45)}
.ff-launch-clock strong{font-family:Georgia,serif;font-size:clamp(26px,2.65vw,56px);font-weight:700;line-height:1.05;font-variant-numeric:tabular-nums;color:#fff0b6;text-shadow:0 2px #6b350e}
.ff-launch-clock span{font-family:Georgia,serif;font-size:clamp(11px,.9vw,20px);text-transform:uppercase;line-height:1.4;letter-spacing:.02em}
.ff-launch-date{font-family:Georgia,serif;font-size:clamp(12px,1.05vw,22px);font-style:italic;text-align:center;margin:4px 0 0;line-height:1.3;color:#fff1c3;white-space:nowrap}
.ff-launch-notify{display:flex;align-items:center;justify-content:center;text-align:center;font-family:Georgia,serif;text-transform:uppercase;font-weight:700;font-size:clamp(13px,1.2vw,26px);line-height:1.15;min-height:clamp(44px,3.5vw,70px);padding:8px 10px;border:3px solid #f6ca69;border-radius:12px;background:linear-gradient(#5af4f2 0,#087f8e 18%,#004253 60%,#11b5bd 100%);box-shadow:0 0 0 2px #63320e,inset 0 0 0 1px #f8e5a1,0 0 18px #20d3e450;text-shadow:0 2px 3px #042a37;transition:filter .18s}
.ff-launch-notify:hover{filter:brightness(1.2)}


.ff-launch-status{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.ff-launch-character{display:none}
.ff-launch-title{display:flex;flex-direction:column}
.ff-launch-banner [data-countdown-clock][hidden]{display:none}
@media(max-width:1150px) and (min-width:701px){.ff-launch-content{inset:15% 18% 9% 18%;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:6px 15px}.ff-launch-brand{grid-row:1/3}.ff-launch-title{font-size:3.6vw}.ff-launch-tagline{font-size:1.4vw;white-space:normal}.ff-launch-countdown{align-self:end}.ff-launch-clock>div{aspect-ratio:150/115}.ff-launch-clock strong{font-size:2.8vw}.ff-launch-date{font-size:12px;margin:0}.ff-launch-notify{grid-column:2;justify-self:center;min-height:30px;padding:3px 24px;font-size:13px;border-width:2px}.ff-launch-scene{min-height:176px;background-size:auto 400px;background-position:top center}}
@media(max-width:700px){.ff-launch-scene{aspect-ratio:auto;height:340px;background:radial-gradient(ellipse at 50% 10%,#43206c,#190d2b 68%);overflow:hidden}.ff-launch-character{display:block;position:absolute;top:0;width:135px;height:145px;background-image:var(--launch-art);background-repeat:no-repeat;background-size:960px 320px;mask-image:linear-gradient(#000 80%,transparent);-webkit-mask-image:linear-gradient(#000 80%,transparent)}.ff-launch-oom{left:0;background-position:left top}.ff-launch-traea{right:0;background-position:right top}.ff-launch-content{position:relative;inset:auto;display:flex;flex-direction:column;gap:9px;padding:45px 18px 18px;box-sizing:border-box;z-index:1}.ff-launch-brand{gap:8px;margin:0 95px;min-height:87px;justify-content:center}.ff-launch-title{font-size:24px;line-height:1.05}.ff-launch-tagline{font-size:13px;white-space:normal;width:170px;line-height:1.25}.ff-launch-countdown{width:min(360px,100%)}.ff-launch-clock{gap:2px}.ff-launch-clock>div{aspect-ratio:150/132}.ff-launch-clock strong{font-size:30px}.ff-launch-clock span{font-size:12px}.ff-launch-date{font-size:15px;margin-top:3px}.ff-launch-notify{min-height:40px;font-size:16px;border-width:2px;padding:5px 35px}.ff-launch-banner::after{content:'';position:absolute;bottom:0;left:0;right:0;height:5px;background:linear-gradient(#fcdf8a,#864515,#f3c968)}}
@media(max-width:380px){.ff-launch-brand{margin:0 78px}.ff-launch-title{font-size:21px}.ff-launch-character{width:120px;background-size:860px auto}}
@media(prefers-reduced-motion:reduce){.ff-launch-notify{transition:none}}
@media(max-width:1150px) and (min-width:701px){.ff-launch-scene{min-height:0;background-size:100% auto;background-position:left top}.ff-launch-content{inset:9% 18% 3% 19%;gap:2px 12px}.ff-launch-notify{min-height:24px;padding:1px 20px;font-size:12px}.ff-launch-date{font-size:11px}.ff-launch-clock strong{font-size:2.6vw}.ff-launch-clock span{font-size:10px}}
/* Keep both drinks visible and type clear of the portraits on phones. */
@media(max-width:700px){.ff-launch-scene{height:365px}.ff-launch-character{width:50%;height:142px;background-size:950px auto;mask-image:linear-gradient(#000 90%,transparent);-webkit-mask-image:linear-gradient(#000 90%,transparent)}.ff-launch-content{padding:141px 16px 14px;gap:8px}.ff-launch-brand{margin:0;min-height:0;gap:5px}.ff-launch-title{font-size:25px;line-height:1.1}.ff-launch-title br{display:none}.ff-launch-title br::after{content:' '}.ff-launch-tagline{width:auto;font-size:13px;white-space:normal}.ff-launch-clock>div{aspect-ratio:150/118}.ff-launch-notify{min-height:38px}.ff-launch-date{font-size:14px}}
@media(max-width:380px){.ff-launch-character{background-size:840px auto;height:127px}.ff-launch-content{padding-top:129px}.ff-launch-scene{height:345px}.ff-launch-title{font-size:22px}}
@media(max-width:700px){.ff-launch-title{flex-direction:row;gap:.25em}}

/* Anchor each label to the center of its painted frame. */
.ff-launch-name{position:absolute;top:14.69%;transform:translate(-50%,-50%);font-family:Georgia,serif;font-style:italic;font-weight:700;color:#ffedb2;text-shadow:0 2px #321117;text-align:center;white-space:nowrap;font-size:clamp(14px,1.55vw,32px);line-height:1}
.ff-launch-name-oom{left:8.93%;width:10.13%;font-size:clamp(12px,1.3vw,28px)}
.ff-launch-name-traea{left:85.87%;width:7.55%}
@media(max-width:1150px) and (min-width:701px){.ff-launch-name{font-size:1.3vw}.ff-launch-name-oom{font-size:1.2vw}}
@media(max-width:700px){.ff-launch-name{top:20.56px;font-size:12px;z-index:2}.ff-launch-name-oom{left:84.85px;width:96px}.ff-launch-name-traea{left:calc(100% - 134.28px);width:72px}}
@media(max-width:380px){.ff-launch-name{top:18.18px}.ff-launch-name-oom{left:75.03px;width:85px;font-size:10.5px}.ff-launch-name-traea{left:calc(100% - 118.73px);width:63px;font-size:11px}}