/* One deck. Every card on the site is dealt from the same deck: a framed art window carrying its type chip, a name plate
   with the title and one line of detail, and (where it opens) a round toggle that turns from + to ×. The same frame,
   radius, surface, chip and type scale are used by the line-up cards, the "Make a weekend of it" cards, the guests, the
   kinds of play, the timetable and the intro's hand of photos. Loaded last, after landing.css, app-cards.css and magic.css. */
:root{
 --deck-r:24px;--deck-r-in:17px;--deck-pad:8px;
 --deck-bg:linear-gradient(180deg,#14223f 0%,#0d1731 100%);
 --deck-line:#ffffff1c;--deck-line-hi:#96ea1175;
 --deck-shadow:0 16px 36px #00000059,inset 0 1px #ffffff12;
 --deck-shadow-hi:0 26px 54px #00000080,0 0 0 1px #96ea1124,inset 0 1px #ffffff1a;
 --deck-meta:#a9bdd6;
}

/* ---------- The type chip (cards, highlights, the intro hand, the kinds of play) ---------- */
.card-tag,.experience-number{display:inline-flex;align-items:center;gap:7px;min-height:32px;max-width:calc(100% - 24px);padding:5px 12px 5px 9px;border:1px solid #ffffff3d;border-radius:10px;background:#06102acc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font:800 13px/1.2 Nunito,sans-serif;letter-spacing:0;text-transform:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card-tag .svg-icon,.experience-number .svg-icon{width:17px;height:17px;flex:none;color:var(--sky)}

/* ---------- Line-up cards (exhibitors, games, sessions, tournaments) ---------- */
.app-card{padding:var(--deck-pad);border:1px solid var(--deck-line);border-radius:var(--deck-r);background:var(--deck-bg);box-shadow:var(--deck-shadow);overflow:clip}
.app-card:hover{border-color:var(--deck-line-hi);box-shadow:var(--deck-shadow-hi)}
.app-card .card-cover{display:flex;flex-direction:column;height:auto;min-height:0;padding:0;background:none;border-radius:var(--deck-r-in);overflow:visible;color:#fff;text-align:left}
.card-art{position:relative;display:block;width:100%;aspect-ratio:16/10;border-radius:var(--deck-r-in);overflow:hidden;background:#0a1428;isolation:isolate}
.card-art>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--lift)}
.app-card:hover .card-art>img{transform:scale(1.06)}
.app-card .card-cover>img{transform:none}
.app-card .card-scrim{background:linear-gradient(to top,#050b17cc 0%,#050b1700 46%),linear-gradient(to bottom,#050b1766 0%,#050b1700 30%)}
.app-card .card-tag{position:absolute;top:12px;left:12px}
.app-card .card-flag{top:auto;bottom:12px;right:12px}
.app-card .card-logo{position:absolute;left:12px;bottom:12px;z-index:2;width:56px;height:56px;margin:0;border-radius:15px}
.app-card .card-copy{position:static;display:block;min-height:88px;padding:16px 62px 12px 10px}
.app-card .card-copy strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font:850 clamp(20px,1.55vw,23px)/1.15 Nunito,sans-serif;letter-spacing:-.03em}
.app-card .card-copy small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:7px;color:var(--deck-meta);font-size:14.5px;font-weight:650;line-height:1.4}
.app-card .card-copy small .svg-icon{display:inline-block;width:15px;height:15px;margin:-3px 7px 0 0;vertical-align:middle;color:var(--lime)}
.app-card .card-toggle{position:absolute;top:auto;right:10px;bottom:22px;display:grid;place-items:center;width:40px;height:40px;border:1px solid #ffffff2e;border-radius:50%;background:#ffffff0a;color:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;transition:transform .55s cubic-bezier(.3,1.5,.5,1),background .25s,border-color .25s,color .25s}
.card-toggle i{position:relative;display:block;width:14px;height:14px}
.card-toggle i::before,.card-toggle i::after,.sheet-close i::before,.sheet-close i::after{content:'';position:absolute;left:0;top:6px;width:14px;height:2px;border-radius:2px;background:currentColor}
.card-toggle i::after,.sheet-close i::after{transform:rotate(90deg)}
.app-card .card-cover:hover .card-toggle{border-color:var(--lime);background:#96ea1124;color:var(--lime)}
.app-card.expanded .card-toggle{transform:rotate(135deg);border-color:var(--lime);background:var(--lime);color:var(--navy)}
.app-card .card-details-inner{padding-inline:10px;background:none}
.app-card.expanded .card-details-inner{border-top:1px solid #ffffff1a}
.card-details-inner:before,.card-details-inner:after{height:16px}

@media(min-width:761px){
 .app-card.expanded{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start;column-gap:8px}
 .app-card.expanded .card-cover{position:sticky;top:88px;min-height:0;height:auto}
 .app-card.expanded .card-art{aspect-ratio:4/3.4}
 .app-card.expanded .card-copy{padding:20px 70px 16px 12px}
 .app-card.expanded .card-copy strong{-webkit-line-clamp:4;font-size:clamp(28px,2.5vw,38px);line-height:1.06}
 .app-card.expanded .card-copy small{-webkit-line-clamp:4;font-size:15.5px}
 .app-card.expanded .card-toggle{right:12px;bottom:24px;width:46px;height:46px}
 .app-card.expanded .card-logo{width:78px;height:78px;border-radius:20px}
 .app-card.expanded .card-details-inner{border:0!important;padding:10px clamp(18px,2.6vw,36px) 8px}
}

/* A card on its own, in a sheet (timetable sessions and tournaments). */
dialog.card-sheet{width:min(1080px,94vw);max-width:none;max-height:none;margin:auto;padding:0;border:0;background:transparent;overflow:visible;color:#fff}
dialog.card-sheet::backdrop{background:#030617d1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.sheet-body{max-height:88vh;overflow:auto;border-radius:var(--deck-r);overscroll-behavior:contain;scrollbar-width:thin}
.card-sheet .app-card,.card-sheet .app-card:hover{transform:none!important;box-shadow:0 40px 90px #000c,0 0 0 1px #96ea1126}
.card-sheet .card-toggle{display:none}
.card-sheet .card-cover{cursor:default}
.card-sheet .app-card.expanded .card-cover{position:sticky;top:8px}
.card-sheet .app-card.expanded .card-copy{padding-right:12px}
.sheet-close{position:absolute;bottom:-16px;right:-16px;z-index:5;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--lime);color:var(--navy);box-shadow:0 10px 24px #0009;transform:rotate(45deg);transition:transform .45s cubic-bezier(.3,1.5,.5,1)}
.sheet-close i{position:relative;display:block;width:14px;height:14px}
.sheet-close:hover{transform:rotate(135deg)}
.motion-ok dialog.card-sheet[open] .sheet-body{animation:sheet-in .5s cubic-bezier(.2,1.05,.3,1) both}
@keyframes sheet-in{from{opacity:0;transform:translateY(26px) scale(.97)}}
@media(max-width:760px){
 dialog.card-sheet{width:100vw;margin:auto 0 0}
 .sheet-body{max-height:90vh;border-radius:var(--deck-r) var(--deck-r) 0 0}
 .card-sheet .app-card{border-radius:var(--deck-r) var(--deck-r) 0 0}
 .sheet-close{bottom:14px;right:14px}
 .card-sheet .app-card{padding-bottom:68px}
 .card-sheet .app-card.expanded .card-cover{position:static}
}

/* ---------- "Make a weekend of it" ---------- */
.highlight-grid{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}
.highlight-grid .highlight-card{display:flex;flex-direction:column;margin-top:0;grid-column:auto;padding:var(--deck-pad);border:1px solid var(--deck-line);border-radius:var(--deck-r);background:var(--deck-bg);box-shadow:var(--deck-shadow)}
.highlight-grid .highlight-card:hover{border-color:var(--deck-line-hi);box-shadow:var(--deck-shadow-hi)}
.highlight-grid .highlight-art,.highlight-grid .highlight-card:first-child .highlight-art,.highlight-grid .highlight-card:nth-child(3) .highlight-art{height:auto;aspect-ratio:16/11;border-radius:var(--deck-r-in)}
.highlight-art .card-tag{position:absolute;z-index:2;top:12px;left:12px}
.highlight-art .highlight-image-shade{background:linear-gradient(to bottom,#050b1766 0%,#050b1700 34%)}
.highlight-grid .highlight-body,.highlight-grid .highlight-card:nth-child(3) .highlight-body{display:block;padding:18px 12px 12px}
.highlight-body .eyebrow{font:500 12px var(--mono);letter-spacing:.08em;color:#8ea4c2}
.highlight-grid .highlight-body h3{margin:10px 0 8px;font:850 clamp(22px,1.8vw,26px)/1.12 Nunito,sans-serif;letter-spacing:-.03em}
.highlight-grid .highlight-body p{font-size:15px;line-height:1.55;color:var(--deck-meta)}

/* ---------- Guests ---------- */
.guest-grid .guest-card{display:flex;flex-direction:column;grid-template-columns:none;gap:0;min-height:0;padding:var(--deck-pad);border:1px solid var(--deck-line);border-radius:var(--deck-r);background:var(--deck-bg);box-shadow:var(--deck-shadow)}
.guest-grid .guest-card:hover{border-color:var(--deck-line-hi);box-shadow:var(--deck-shadow-hi)}
.guest-grid .guest-card::before,.guest-grid .guest-card::after{display:none}
.guest-grid .guest-image{display:grid;place-items:center;align-self:stretch;justify-self:stretch;width:auto;max-width:none;margin:0;aspect-ratio:16/10;border-radius:var(--deck-r-in);background:radial-gradient(circle at 50% 62%,#1cb8ff2e,transparent 58%),repeating-linear-gradient(135deg,#ffffff05 0 2px,transparent 2px 12px),#0a1428;overflow:hidden}
.guest-grid .guest-image img{width:auto;height:min(84%,206px);max-width:none;object-fit:contain;filter:drop-shadow(0 14px 22px #000a);transition:transform .8s var(--lift)}
.guest-grid .guest-card:hover .guest-image img{transform:translateY(-4px) scale(1.04)}
.guest-grid .guest-card>div:last-child{align-self:stretch;padding:18px 12px 12px;text-align:left}
.guest-grid .guest-card h3{margin:0 0 8px;font:850 clamp(22px,1.8vw,26px)/1.12 Nunito,sans-serif;letter-spacing:-.03em}
.guest-grid .guest-card p{font-size:15px;line-height:1.55;color:var(--deck-meta)}

/* ---------- The kinds of play: real icon tiles, and the panel's picture in the same frame ---------- */
.tabs{gap:12px;margin-bottom:34px;border-bottom:0;overflow:visible}
.tabs button{--c:var(--lime);flex:1 1 0;flex-direction:column;gap:12px;min-width:0;padding:18px 10px 16px;border:1px solid var(--deck-line);border-radius:20px;background:#ffffff05;color:#b7c7dc;font-size:15px;font-weight:850;white-space:nowrap;transition:border-color .25s,background .25s,color .25s,transform .4s var(--lift)}
.tabs button::after{display:none}
.tabs button>span[aria-hidden]{display:grid;place-items:center;width:66px;height:66px;border:1px solid #ffffff17;border-radius:19px;background:#ffffff08;transition:background .3s,border-color .3s,box-shadow .3s}
.tabs button .svg-icon,#experience-tabs [role=tab] .svg-icon{width:36px;height:36px;color:#d3def0;transform:none;transition:color .3s}
.tabs button:hover{border-color:#ffffff33;color:#fff;transform:translateY(-3px)}
.tabs button:hover .svg-icon{color:var(--c)}
.tabs button[aria-selected=true]{border-color:color-mix(in srgb,var(--c) 60%,transparent);background:color-mix(in srgb,var(--c) 9%,#0d1731);color:#fff;border-radius:20px}
.tabs button[aria-selected=true]>span[aria-hidden]{border-color:color-mix(in srgb,var(--c) 70%,transparent);background:color-mix(in srgb,var(--c) 18%,transparent);box-shadow:0 0 28px color-mix(in srgb,var(--c) 35%,transparent)}
.tabs button[aria-selected=true] .svg-icon{color:var(--c)}
@media(max-width:900px){
 .tabs{overflow-x:auto;margin-inline:-20px;padding:4px 20px 10px;scrollbar-width:none}
 .tabs button{flex:0 0 132px;font-size:14px}
 .tabs button>span[aria-hidden]{width:58px;height:58px}
 .tabs .svg-icon,.tabs button .svg-icon{width:32px;height:32px}
}
.experience-media{padding:var(--deck-pad);border:1px solid var(--deck-line);border-radius:var(--deck-r);background:var(--deck-bg);box-shadow:var(--deck-shadow)}
.experience-media img{inset:var(--deck-pad);width:calc(100% - var(--deck-pad) * 2);height:calc(100% - var(--deck-pad) * 2);border-radius:var(--deck-r-in)}
.experience-media::after{inset:var(--deck-pad);border-radius:var(--deck-r-in)}
.experience-media .experience-number{position:absolute;z-index:2;top:20px;left:20px}

/* ---------- Venue card and the finder band share the radius ---------- */
.venue-card{border-radius:var(--deck-r)}
.finder{border-radius:var(--deck-r)}

/* ---------- Intro: the whole tabletop world, dealt as a hand of five ---------- */
.intro-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);grid-template-rows:auto 1fr;column-gap:clamp(40px,5vw,84px);row-gap:26px;align-items:start}
.intro-grid>h2{grid-column:1;grid-row:1}
.intro-grid>div:not(.play-hand){grid-column:1;grid-row:2}
.intro-grid p{font-size:17px;line-height:1.65}
.intro-grid p+p{font-size:15.5px}
.play-hand{--w:clamp(160px,13.6vw,200px);--step:calc(var(--w) * .41);--spread:1;position:relative;grid-column:2;grid-row:1/span 2;height:calc(var(--w) * 1.39 + 70px);margin-top:-10px;translate:-7% 0}
.play-card .card-tag b{max-width:0;overflow:hidden;font-weight:inherit;white-space:nowrap;transition:max-width .45s cubic-bezier(.2,.8,.2,1)}
.play-card:last-child .card-tag b,.play-card:hover .card-tag b,.play-card:focus-visible .card-tag b{max-width:150px}
.play-card .card-tag{gap:0}.play-card:last-child .card-tag,.play-card:hover .card-tag,.play-card:focus-visible .card-tag{gap:7px}
.play-card{--lift-y:0px;--tilt:1;position:absolute;left:50%;bottom:0;width:var(--w);aspect-ratio:.72;margin-left:calc(var(--w) / -2);padding:6px;border:1px solid #ffffff2e;border-radius:20px;background:linear-gradient(180deg,#1a2a4c,#0d1731);box-shadow:0 18px 40px #000b,inset 0 1px #ffffff1f;transform-origin:50% 120%;transform:translateX(calc((var(--n) - 2) * var(--step) * var(--spread))) translateY(var(--lift-y)) rotate(calc((var(--n) - 2) * 6.5deg * var(--spread) * var(--tilt)));transition:transform .6s cubic-bezier(.22,1.2,.36,1),box-shadow .4s,border-color .3s}
.play-card img{display:block;width:100%;height:100%;object-fit:cover;border-radius:14px}
.play-card .card-tag{position:absolute;top:auto;right:auto;left:14px;bottom:14px;max-width:calc(100% - 28px);font-size:12.5px;min-height:30px}
.play-card:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
@media(hover:hover){
 .play-hand:hover{--spread:1.16}
 .play-card:hover,.play-card:focus-visible{--lift-y:-30px;--tilt:.35;z-index:6;border-color:var(--lime);box-shadow:0 30px 60px #000d,0 0 0 1px #96ea1140}
}
html.js-motion:not(.motion-paused) .play-hand:not(.has-entered) .play-card{opacity:0}
html.js-motion:not(.motion-paused) .play-hand.has-entered .play-card{animation:deal .9s cubic-bezier(.2,.95,.3,1.08) backwards;animation-delay:calc(var(--n) * 95ms + 80ms)}
@keyframes deal{from{opacity:0;transform:translateX(0) translateY(70px) rotate(0deg) scale(.9)}}
@media(max-width:1100px){.play-hand{--w:clamp(150px,17vw,190px)}}
@media(max-width:850px){
 .intro{overflow-x:clip}
 .play-hand{translate:none}
 .intro-grid{grid-template-columns:1fr;grid-template-rows:none}
 .intro-grid>h2,.intro-grid>div:not(.play-hand),.play-hand{grid-column:1;grid-row:auto}
 .play-hand{--w:min(170px,31vw);--step:calc(var(--w) * .43);margin:18px 0 6px}
 .intro-stamp{display:none}
}
@media(max-width:420px){.play-hand{--w:118px;--step:52px}.play-card .card-tag{font-size:12px;padding:4px 8px 4px 6px;min-height:26px;left:10px;bottom:10px}.play-card .card-tag .svg-icon{width:14px;height:14px}}

/* ---------- Countdown: no box behind the flaps, digits twice the size ---------- */
.hero-bottom .countdown strong{--cd-gap:clamp(8px,2vw,26px);container-type:inline-size;flex:1 1 auto;min-width:0;gap:var(--cd-gap)}
.countdown .countdown-unit,.countdown .countdown-unit:first-child,.countdown .countdown-unit:last-child{padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.countdown .countdown-unit b{font-size:min(106px,calc((100cqi - var(--cd-gap) * 3) / 7.1))}
.countdown .countdown-unit small{margin-top:12px;font-size:14px}
/* During and after the convention the board gives way to one line. */
#countdown:not(:has(.countdown-unit)){font:900 clamp(34px,4.2vw,64px)/1.05 Nunito,sans-serif;letter-spacing:-.035em;color:var(--lime)}
.flap{box-shadow:0 .08em .2em #000a,inset 0 0 0 1px #ffffff14}

/* ---------- Marquee: the band fades into the page at both ends ---------- */
.ticker{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%)}

/* ---------- Day tabs and type chips with counts ---------- */
.programme-day-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 22px}
.programme-day-tabs button{display:inline-flex;align-items:baseline;gap:8px;min-height:50px;padding:12px 18px;border:1px solid var(--deck-line);border-radius:14px;background:#ffffff05;color:#d7e3f3;transition:border-color .2s,background .2s}
.programme-day-tabs button::before{align-self:center}
.programme-day-tabs button b{font-size:16px;font-weight:850}
.programme-day-tabs button small{font:500 13px var(--mono);color:#8ea4c2}
.programme-day-tabs button em,.filter-chips button em{align-self:center;min-width:22px;padding:1px 7px;border-radius:999px;background:#ffffff17;font-size:12.5px;font-style:normal;font-weight:850;text-align:center}
.programme-day-tabs button:hover{border-color:#ffffff40}
.programme-day-tabs button[aria-pressed=true]{border-color:var(--lime);background:var(--lime);color:var(--navy)}
.programme-day-tabs button[aria-pressed=true] small{color:#1d3a09}
.programme-day-tabs button[aria-pressed=true] em,.filter-chips button[aria-pressed=true] em{background:#08132b26}
.filter-chips button{display:inline-flex;align-items:center;gap:7px}
.filter-chips button .svg-icon{width:17px;height:17px}
.type-chips{margin-top:2px;padding:10px;border:1px dashed #ffffff1f;border-radius:14px}
.type-chips button::before{display:none}
@media(max-width:600px){
 .programme-day-tabs{flex-wrap:nowrap;gap:8px}
 .programme-day-tabs button{flex:1 1 0;flex-direction:column;align-items:center;gap:1px;min-width:0;padding:9px 6px}
 .programme-day-tabs button::before{display:none}
 .programme-day-tabs button em{margin-top:3px}
}
.directory-controls .search-field{min-width:min(480px,100%)}

/* ---------- The timetable ---------- */
.programme-preview{display:block}
.tt{--q:22px;--time:58px;position:relative;padding:var(--deck-pad);border:1px solid var(--deck-line);border-radius:var(--deck-r);background:var(--deck-bg);box-shadow:var(--deck-shadow)}
.tt-head,.tt-body{display:grid;grid-template-columns:var(--time) repeat(var(--venues),minmax(0,1fr));gap:8px}
.tt-head{position:sticky;top:76px;z-index:4;padding:6px 0;border-radius:var(--deck-r-in);background:#101c3af2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.tt-corner{display:grid;place-items:center;font:500 13px var(--mono);color:#8ea4c2;text-align:center}
.tt-venue{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 12px;border:1px solid #ffffff14;border-radius:13px;background:#ffffff06}
.tt-venue .svg-icon{width:26px;height:26px;flex:none;color:var(--v)}
.tt-venue b{display:block;font-size:16px;line-height:1.2}
.tt-venue small{display:block;margin-top:1px;color:var(--deck-meta);font-size:12.5px}
.tt-stage{--v:#1cb8ff}.tt-workshop{--v:#96ea11}.tt-zone-head,.tt-zone,.tt-zone-list{--v:#ffd86a}
.tt-body{position:relative;height:calc(var(--rows) * var(--q));margin-top:8px}
.tt-times{position:relative}
.tt-times span{position:absolute;top:calc(var(--s) * var(--q));right:8px;transform:translateY(-50%);font:500 13px var(--mono);color:#8ea4c2}
.tt-times span:first-child{transform:none}
.tt-col{position:relative;border-radius:14px;background:repeating-linear-gradient(to bottom,#ffffff14 0,#ffffff14 1px,transparent 1px,transparent calc(var(--q) * 4)),repeating-linear-gradient(to bottom,transparent 0,transparent calc(var(--q) * 2),#ffffff07 calc(var(--q) * 2),#ffffff07 calc(var(--q) * 2 + 1px),transparent calc(var(--q) * 2 + 1px),transparent calc(var(--q) * 4)),#ffffff03}
.tt-block{position:absolute;top:calc(var(--s) * var(--q) + 2px);left:calc(var(--lane) / var(--lanes) * 100% + 3px);display:flex;flex-direction:column;gap:3px;width:calc(100% / var(--lanes) - 6px);height:calc(var(--d) * var(--q) - 4px);padding:8px 12px 8px 14px;border:1px solid color-mix(in srgb,var(--v) 42%,transparent);border-radius:12px;background:linear-gradient(180deg,color-mix(in srgb,var(--v) 17%,#0d1731),color-mix(in srgb,var(--v) 8%,#0d1731));box-shadow:inset 3px 0 var(--v);color:#fff;text-align:left;overflow:hidden;cursor:pointer;transition:transform .3s var(--lift),box-shadow .3s,border-color .2s,opacity .3s,filter .3s}
.tt-block:hover,.tt-block:focus-visible{z-index:3;transform:translateY(-2px);border-color:var(--v);box-shadow:inset 3px 0 var(--v),0 12px 26px #000a}
.tt-block:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
.tt-time{display:flex;align-items:center;gap:6px;font:500 12.5px/1.2 var(--mono);color:#d2e1f3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tt-time .svg-icon{width:15px;height:15px;color:var(--v)}
.tt-block strong{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:15.5px;font-weight:850;line-height:1.2;letter-spacing:-.01em}
.tt-block.is-short strong{-webkit-line-clamp:1;line-clamp:1}
.tt-block small{margin-top:auto;color:#b4c6dc;font-size:12.5px;font-weight:700}
.tt-block.is-review{border-style:dashed}
.tt-block.is-review .tt-time::after{content:'';width:7px;height:7px;flex:none;border-radius:50%;background:#ffcf73;box-shadow:0 0 0 3px #ffcf7333}
.tt .is-dim,.tt-list .is-dim{opacity:.22;filter:saturate(.3)}
.tt-zone{position:relative;display:flex;flex-direction:column;gap:6px;min-height:0;padding:6px;border:1px dashed #ffd86a3d;border-radius:14px;background:#ffd86a07;overflow:auto;scrollbar-width:thin}
.tt-zone-note{display:flex;align-items:center;gap:8px;margin:2px 4px 4px;color:#ffe3a1;font-size:13px;font-weight:750}
.tt-zone-note .svg-icon{width:16px;height:16px;color:#ffd86a}
.tt-tourney{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid #ffffff14;border-radius:11px;background:#ffffff08;color:#fff;text-align:left;cursor:pointer;transition:border-color .2s,background .2s,transform .3s var(--lift)}
.tt-tourney:hover,.tt-tourney:focus-visible{border-color:#ffd86a99;background:#ffd86a12;transform:translateX(2px)}
.tt-tourney .svg-icon{width:22px;height:22px;flex:none;color:#ffd86a}
.tt-tourney strong{display:block;font-size:14px;line-height:1.2}
.tt-tourney small{display:block;margin-top:2px;color:var(--deck-meta);font-size:12.5px}
.tt-zone-more{display:block;margin-top:auto;padding:10px;border-radius:11px;color:#ffe3a1;font-size:14px;font-weight:850;text-align:center}
.tt-zone-more:hover{background:#ffd86a14}
.tt-now{position:absolute;left:0;right:0;top:calc(var(--s) * var(--q));z-index:4;height:2px;background:#ff6b7f;box-shadow:0 0 12px #ff6b7f;pointer-events:none}
.tt-times .tt-now-label{position:absolute;right:4px;top:calc(var(--s) * var(--q));z-index:2;transform:translateY(-50%);padding:2px 7px;border-radius:7px;background:#ff6b7f;color:#140510;font:700 12px var(--mono)}
.tt-pending .tt-pending-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.tt-pending .tt-block,.tt-list .tt-block{position:relative;top:auto;left:auto;width:auto;height:auto;min-height:66px}
.tt-list{display:grid;gap:10px}
.tt-slot{display:grid;grid-template-columns:54px minmax(0,1fr);gap:10px;align-items:start}
.tt-slot-time{padding-top:12px;font:600 14px var(--mono);color:#d2e1f3}
.tt-slot-items{display:grid;gap:8px}
.tt-zone-list{margin-top:14px;padding:var(--deck-pad);border:1px solid var(--deck-line);border-radius:var(--deck-r);background:var(--deck-bg)}
.tt-zone-list h3{display:flex;align-items:center;gap:10px;margin:8px 8px 10px;font-size:18px}
.tt-zone-list h3 .svg-icon{width:24px;height:24px;color:#ffd86a}
.tt-zone-list .tt-zone{overflow:visible}
@media(max-width:1100px){.tt{--q:21px}.tt-venue small{display:none}}

/* ---------- The companion app: a premium ad on a night sky ---------- */
.companion-section{position:relative;isolation:isolate;display:block;width:auto;max-width:none;margin:0;padding-block:clamp(96px,11vw,160px);overflow:hidden;border:0;border-radius:0;background:#02040f;box-shadow:none}
.companion-section>.galaxy{position:absolute;inset:0;z-index:-2;display:block;width:100%;height:100%}
.companion-section::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,var(--navy) 0%,#080c2400 16%,#080c2400 84%,var(--navy) 100%)}
.companion-section::before{display:none}
.companion-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,100px);align-items:center}
.companion-copy{position:relative;z-index:2;max-width:620px;padding:0}
.companion-copy .eyebrow{color:var(--sky)}
.companion-copy h2{font-size:clamp(40px,4vw,60px);line-height:1;letter-spacing:-.05em}
@media(min-width:1000px){.companion-copy h2 span{white-space:nowrap}}
.companion-copy h2 span{color:var(--sky)}
.companion-copy>p:not(.eyebrow){font-size:18px;line-height:1.65;color:#c3d2e6}
.companion-copy .companion-features{display:grid;gap:14px;margin:30px 0 36px}
.companion-copy .companion-features span{position:relative;display:flex;align-items:center;min-height:46px;padding-left:62px;color:#eef4ff;font-size:17px;font-weight:800}
.companion-copy .companion-features span::before{content:'';position:absolute;left:0;top:50%;width:46px;height:46px;margin:0;transform:translateY(-50%);border:1px solid #8bd7ff40;border-radius:14px;background:#1cb8ff17;box-shadow:inset 0 1px #ffffff1a;-webkit-mask:none;mask:none}
.companion-copy .companion-features span::after{content:'';position:absolute;left:12px;top:50%;width:22px;height:22px;transform:translateY(-50%);background:var(--sky);-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat}
.companion-features .ico-agenda{--ico:url('../svg/date.svg')}
.companion-features .ico-saved{--ico:url('../svg/medal.svg')}
.companion-features .ico-near{--ico:url('../svg/location.svg')}
.companion-stage{--px:0;--py:0;position:relative;display:grid;justify-items:center;gap:30px;width:100%;perspective:1700px}
.phone-glow{position:absolute;left:50%;top:44%;z-index:-1;width:130%;height:95%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,#1cb8ff47,#1c7dff1a 55%,transparent);filter:blur(34px);pointer-events:none}
.companion-section .companion-device{position:relative;flex:none;width:min(332px,76vw);max-width:none;height:auto;aspect-ratio:332/694;padding:0;border:0;border-radius:58px;background:linear-gradient(145deg,#7d8ba1 0%,#3a4558 12%,#161d29 38%,#232c3b 62%,#5f6c82 86%,#2a3343 100%);box-shadow:inset 0 0 0 1.5px #c6d2e24d,inset 0 0 0 5px #0a0e15,inset 0 0 0 6px #ffffff12,0 60px 100px -24px #000f,0 30px 70px -36px #1cb8ff80;transform:rotateY(calc(-15deg + var(--px) * 14deg)) rotateX(calc(5deg - var(--py) * 9deg)) rotateZ(1.2deg);transform-style:preserve-3d;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.companion-section .companion-device::before{display:none}
.companion-section .companion-device:hover{transform:rotateY(0) rotateX(0) rotateZ(0)}
.companion-section .device-screen{position:absolute;inset:11px;border-radius:47px;overflow:hidden;background:#04081a}
.companion-section .device-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0;background:#04081a}
.phone-island{position:absolute;top:12px;left:50%;z-index:3;width:32%;height:28px;transform:translateX(-50%);border-radius:20px;background:#000;box-shadow:inset 0 0 0 1px #ffffff0f;pointer-events:none}
.phone-island::after{content:'';position:absolute;right:13px;top:50%;width:9px;height:9px;transform:translateY(-50%);border-radius:50%;background:radial-gradient(circle at 35% 35%,#3d5a8a,#0b1220 60%)}
.phone-glare{position:absolute;inset:0;z-index:4;border-radius:inherit;pointer-events:none;background:linear-gradient(118deg,#ffffff24 0%,#ffffff0a 20%,transparent 34%,transparent 72%,#ffffff0c 100%)}
.phone-btn{position:absolute;z-index:-1;width:5px;border-radius:3px;background:linear-gradient(90deg,#1b222d,#6b788c 55%,#1b222d)}
.phone-action{left:-3px;top:17%;height:5%}
.phone-vol-up{left:-3px;top:25%;height:9%}
.phone-vol-down{left:-3px;top:36%;height:9%}
.phone-power{right:-3px;top:28%;height:14%}
.companion-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px}
.float-card{--depth:1;position:absolute;z-index:5;display:flex;align-items:center;gap:12px;max-width:270px;padding:12px 16px 12px 12px;border:1px solid #ffffff29;border-radius:18px;background:#0b1530b8;-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);box-shadow:0 22px 44px #000a,inset 0 1px #ffffff21;transform:translate3d(calc(var(--px) * var(--depth) * -46px),calc(var(--py) * var(--depth) * -34px),0);transition:transform 1s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.float-ico{display:grid;place-items:center;width:42px;height:42px;flex:none;border-radius:13px;background:#1cb8ff1f;color:var(--sky)}
.float-ico .svg-icon{width:22px;height:22px}
.float-card.float-b .float-ico{background:#96ea111f;color:var(--lime)}
.float-card.float-c .float-ico{background:#ffd86a1f;color:#ffd86a}
.float-card small{display:block;font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#8bd7ff}
.float-card b{display:block;margin-top:3px;font-size:14.5px;line-height:1.25;color:#fff}
.float-card em{display:block;margin-top:2px;font-size:12.5px;font-style:normal;color:var(--deck-meta)}
.float-a{left:-4%;top:12%;--depth:1.3}
.float-b{right:-6%;top:42%;--depth:.8}
.float-c{left:2%;bottom:20%;--depth:1.05}
.motion-ok .float-card{animation:float-bob 7s ease-in-out infinite alternate}
.motion-ok .float-b{animation-duration:8.5s;animation-delay:-3s}
.motion-ok .float-c{animation-duration:6.2s;animation-delay:-1.5s}
@keyframes float-bob{to{translate:0 -12px}}
@media(max-width:1100px){.float-a{left:-8%}.float-b{right:-10%}}
@media(max-width:900px){
 .companion-inner{grid-template-columns:1fr}
 .companion-copy{max-width:none}
 .float-card{display:none}
 .companion-section .companion-device{transform:none}
}
@media(prefers-reduced-motion:reduce){.companion-section .companion-device{transform:none}}

/* ---------- Mobile spacing for the deck ---------- */
@media(max-width:1100px){.highlight-grid{gap:16px}}
@media(max-width:760px){
 .highlight-grid{grid-template-columns:1fr}
 .app-card .card-copy{min-height:0}
 .tt{--time:50px}
}
