/* Season VIII, "Boss Court Diorama" (owner pick opt-5, 2026-11-01). Scoped to #season .s8. */
#season .s8{--s8-in:28px;--s8-out:80px;--g5-gold-fill:linear-gradient(180deg,#f8e3a0 0%,#e7c260 45%,#c99a2e 100%);--g5-gold-ink:#1d1307;text-align:center;color:var(--og-ink,#f0e8d6)}
#season .s8 h2,#season .s8 h3{font-family:Marcellus,serif;font-weight:400;color:#f3dc8a;margin:0}
#season .s8 p{margin:0}
.s8-mast{margin-bottom:24px}
.s8-kick{font:600 13px/1 "Source Sans 3",sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#e8c873;text-shadow:0 1px 6px #000}
.s8-kick .num{font-family:Marcellus,serif;font-size:20px}
#season .s8-mast h2{font-size:clamp(44px,2.4rem + 3vw,96px);line-height:1;margin:10px 0 14px;text-shadow:0 4px 30px rgba(0,0,0,.9)}
#season .s8-lede{display:inline-block;max-width:36ch;padding:10px 18px;font-size:clamp(17px,1rem + .4vw,22px)}

/* the feature descriptions: centred, comfortable measure (owner change 1) */
#season .s8-copy{max-width:600px;margin:var(--s8-in) auto 0;padding:18px 22px;text-align:center}
#season .s8-copy h3{font-size:clamp(23px,1.1rem + .8vw,32px);margin-bottom:6px}
#season .s8-copy p{max-width:52ch;margin-inline:auto;line-height:1.5;font-size:clamp(16px,.95rem + .2vw,18px)}

/* the court: three bosses, the middle one forward */
.s8-court{display:flex;justify-content:center;align-items:flex-end;gap:clamp(6px,2vw,28px)}
.s8-boss{margin:0;flex:0 1 auto}
.s8-boss img{display:block;width:100%;height:auto;border-radius:50%;background:radial-gradient(circle at 50% 40%,#3b2c1a,#120d09 70%);
 box-shadow:0 0 0 2px #e8c873,0 0 0 6px #2a241c,0 0 46px rgba(255,214,130,.4),0 24px 50px rgba(0,0,0,.7)}
.s8-boss.mid{width:min(380px,40vw);position:relative;z-index:1}
.s8-boss.side{width:min(280px,28vw);margin-bottom:22px}
.s8-boss figcaption{margin-top:12px;display:inline-block;font:400 clamp(12px,.6rem + .6vw,20px)/1.2 Marcellus,serif;letter-spacing:.06em;text-transform:uppercase;color:#f3dc8a;background:#17120d;border:1px solid rgba(232,200,115,.45);padding:5px 12px;border-radius:10px}

/* real game screens + clips */
.s8-shots{display:flex;justify-content:center;gap:clamp(10px,2.4vw,28px);margin-top:var(--s8-in)}
/* rhythm: plate -> its content = --s8-in; content -> the next plate = --s8-out */
#season .s8-shots+.s8-copy,#season .s8-fan+.s8-copy,#season .s8-charms+.s8-copy,#season .s8-court+.s8-copy{margin-top:var(--s8-out)}
#season .s8-court+.s8-copy{margin-top:calc(var(--s8-in) + 8px)}
.s8-shot{margin:0;width:min(280px,30vw);flex:0 1 auto}
.s8-shot img,.s8-shot video{display:block;width:100%;height:auto;aspect-ratio:1170/2532;object-fit:cover;border-radius:clamp(12px,2vw,22px);background:#000;
 box-shadow:0 0 0 1px #e8c873,0 0 24px rgba(240,205,120,.3),0 16px 36px rgba(0,0,0,.6)}
.s8-shot figcaption{margin-top:10px;display:inline-block;font-weight:600;font-size:clamp(12px,.7rem + .4vw,16px);color:#f3dc8a;background:rgba(18,13,9,.9);padding:4px 10px;border-radius:8px}
.s8-vid{position:relative}
.s8-vid video{cursor:pointer}
.s8-play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;border:2px solid #e8c873;background:rgba(18,13,9,.85);color:#f3dc8a;display:grid;place-items:center;cursor:pointer;padding:0}
.s8-play[hidden]{display:none}
.s8-play svg{width:28px;height:28px;fill:currentColor;margin-left:3px}
.s8-play:focus-visible,.s8-vid video:focus-visible{outline:3px solid #ffe08a;outline-offset:3px}

/* the Deep: the game's own Go Deeper plank, live text (src/ui/GoDeeperPlank.css) */
.s8-deep{margin-top:var(--s8-out)}
.s8-gdp{position:relative;width:min(560px,86vw);aspect-ratio:900/249;margin:0 auto;container-type:size;filter:drop-shadow(0 0 22px rgba(255,214,130,.35))}
.s8-gdp-art{position:absolute;inset:0;width:100%;height:100%;display:block}
.s8-gdp-lbl{position:absolute;left:14%;top:22%;right:22%;bottom:22%;display:flex;align-items:center;justify-content:center;gap:.6em;white-space:nowrap;line-height:1;
 font-family:Marcellus,Cinzel,Georgia,serif;font-size:min(34cqh,6cqw);letter-spacing:.06em;text-transform:uppercase}
.s8-gdp-p{display:inline-flex;align-items:center;gap:.18em;letter-spacing:.08em}
.s8-gdp-p b{font-weight:400}
.s8-gdp-dk{height:1.3em;width:auto;display:inline-block}
.s8-gdp-t,.s8-gdp-p b{color:#cfeaff}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
 .s8-gdp-t,.s8-gdp-p b{color:transparent;-webkit-text-fill-color:transparent;
  background-image:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.95) 50%,transparent 58%),linear-gradient(172deg,#fff 0 18%,#cfeaff 18% 36%,#a9d8f7 36% 50%,#fff 50% 58%,#cfeaff 58% 78%,#a9d8f7 78% 100%);
  background-size:300% 100%,100% 100%;background-position:120% 0,0 0;background-repeat:no-repeat;-webkit-background-clip:text;background-clip:text;animation:s8-glint 5s ease-in-out infinite}
 .s8-gdp-p b{animation-delay:.25s}
}
@keyframes s8-glint{0%,55%{background-position:120% 0,0 0}85%,100%{background-position:-20% 0,0 0}}
.s8-shots.two .s8-shot{width:min(260px,30vw)}
#season .s8-keys img{display:block;width:56px;height:auto;margin:0 auto 8px;filter:drop-shadow(0 0 14px rgba(160,220,255,.55))}

/* loot */
.s8-loot{margin-top:var(--s8-out)}
.s8-fan{list-style:none;padding:0;margin:var(--s8-in) auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1100px}
.s8-fan li:nth-child(odd){transform:rotate(-2deg)}.s8-fan li:nth-child(even){transform:rotate(2deg) translateY(8px)}
.s8-fan img{display:block;width:100%;height:auto;border-radius:10px;box-shadow:0 0 0 1px #e8c873,0 12px 28px rgba(0,0,0,.6)}
.s8-charms{list-style:none;padding:0;margin:var(--s8-in) auto 0;display:grid;grid-template-columns:repeat(6,1fr);gap:18px;max-width:900px}
.s8-charms img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:50%;padding:6px;box-sizing:border-box;
 background:radial-gradient(circle,#3b2c1a,#120d09 70%);box-shadow:0 0 0 1px #e8c873,0 10px 24px rgba(0,0,0,.6)}
#season .s8-ctas{justify-content:center;margin-top:var(--s8-out)}

/* hover tilt (fine pointers only; s8.js drives --rx/--ry/--lift) */
.s8-fan img,.s8-charms img{transform:perspective(800px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--lift,0px)) scale(var(--sc,1));transition:transform .45s cubic-bezier(.22,1,.36,1);will-change:auto}
.s8-fan li.is-tilt img,.s8-charms li.is-tilt img{transition:transform .12s ease-out;will-change:transform}

/* phone: compact, still centred (owner change 4) */
@media (max-width:600px){
 #season .s8-mast h2{font-size:48px}
 #season .s8{--s8-in:18px;--s8-out:52px}
 #season .s8-copy{padding:14px 16px}
 #season .s8-copy h3{font-size:22px}
 #season .s8-copy p{font-size:16px}
 .s8-boss.side{margin-bottom:14px}
 .s8-boss figcaption{padding:4px 7px;letter-spacing:.02em;margin-top:8px}
 .s8-shots{gap:8px}
 .s8-shot,.s8-shots.two .s8-shot{width:calc((100% - 16px)/3)}
 .s8-shots.two .s8-shot{width:calc((100% - 8px)/2.6)}
 .s8-shot figcaption{padding:3px 6px;line-height:1.25}
 .s8-play{width:44px;height:44px;margin:-22px 0 0 -22px}
 .s8-play svg{width:20px;height:20px}
 .s8-gdp{width:100%}
 .s8-fan{grid-template-columns:repeat(2,1fr);gap:10px}
 .s8-fan li:nth-child(n){transform:none}
 .s8-fan li:nth-child(n+5){display:none}
 .s8-charms{grid-template-columns:repeat(3,1fr);gap:14px;max-width:300px;padding:0 4px}
 .s8-charms img{padding:3px}
 #season .s8-ctas{flex-direction:column;align-items:stretch}
}
@media (prefers-reduced-motion:reduce){.s8-gdp-t,.s8-gdp-p b{animation:none}.s8-fan img,.s8-charms img{transform:none!important;transition:none}}
