/* Immersive sections (avatar strip + gameplay previews). Uses syndicate.css tokens. */
.imm,.imm-strip{--c:var(--ss-koda);position:relative;margin:28px auto;max-width:1100px;padding:20px;border-radius:16px;border:1px solid color-mix(in srgb,var(--c) 30%,var(--ss-line));background:radial-gradient(120% 80% at 0% 0%,color-mix(in srgb,var(--c) 12%,transparent),transparent 60%),linear-gradient(180deg,var(--ss-panel2),var(--ss-panel));box-shadow:0 18px 40px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.03) inset;overflow:hidden;color:var(--ss-txt);font-family:var(--ss-font-body);box-sizing:border-box}
.imm *,.imm-strip *{box-sizing:border-box}
.imm::before,.imm-strip::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,1) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,1) 1px,transparent 1px);background-size:28px 28px;opacity:.05;-webkit-mask:radial-gradient(80% 80% at 50% 40%,#000,transparent);mask:radial-gradient(80% 80% at 50% 40%,#000,transparent)}
.imm>*,.imm-strip>*{position:relative}
.imm h2,.imm-strip h2{font-family:var(--ss-font-head);font-size:clamp(22px,4vw,30px);line-height:1.15;margin:0 0 6px;letter-spacing:-.01em}
.imm .eb,.imm-strip .eb{display:inline-block;font:700 12px/1 var(--ss-font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--c);margin-bottom:8px}
.imm-hl{color:var(--c)}
.imm p.sub{color:var(--ss-dim);margin:0 0 14px;font-size:15px;line-height:1.5}
.imm-grid{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:820px){.imm-grid{grid-template-columns:1.6fr 1fr;align-items:start}}
.imm-media{position:relative;border-radius:16px;overflow:hidden;border:1px solid color-mix(in srgb,var(--c) 45%,transparent);box-shadow:0 0 0 1px rgba(0,0,0,.5),0 14px 34px rgba(0,0,0,.55),0 0 28px color-mix(in srgb,var(--c) 22%,transparent);aspect-ratio:16/10;background:#05060a}
.imm-media img,.imm-media video{display:block;width:100%;height:100%;object-fit:cover}
.imm-media video{position:absolute;inset:0}
.imm-media .tag{position:absolute;left:10px;top:10px;z-index:2;font:700 12px/1 var(--ss-font-body);letter-spacing:.08em;text-transform:uppercase;padding:7px 10px;border-radius:999px;background:rgba(5,6,10,.82);color:var(--ss-txt);border:1px solid color-mix(in srgb,var(--c) 55%,transparent)}
.imm-media figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px 12px 9px;font-size:13px;color:#d7dceb;background:linear-gradient(transparent,rgba(5,6,10,.9))}
.imm-side{display:grid;gap:14px;grid-template-columns:120px 1fr;align-items:start}
@media(min-width:820px){.imm-side{grid-template-columns:1fr}}
.imm-card{margin:0;border-radius:16px;overflow:hidden;border:1px solid var(--ss-line);box-shadow:0 10px 26px rgba(0,0,0,.5);transform:rotate(-2deg);max-width:240px}
.imm-card img{display:block;width:100%;height:auto}
.imm-card figcaption{font-size:12px;color:var(--ss-dim);padding:6px 8px;background:var(--ss-panel)}
.imm-do{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:8px}
.imm-do li{display:flex;gap:10px;align-items:baseline;font-size:15px;line-height:1.4}
.imm-do li b{font-family:var(--ss-font-head);color:var(--ss-txt)}
.imm-do li::before{content:"";flex:none;width:8px;height:8px;border-radius:2px;background:var(--c);box-shadow:0 0 8px var(--c);transform:rotate(45deg) translateY(-1px)}
.imm-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;min-width:44px;padding:0 20px;border-radius:14px;font:700 15px/1 var(--ss-font-body);text-decoration:none;color:#06070b;background:var(--c);box-shadow:0 6px 20px color-mix(in srgb,var(--c) 35%,transparent),0 0 0 1px rgba(255,255,255,.18) inset;transition:transform .2s,box-shadow .2s}
.imm-cta:hover{transform:translateY(-2px);box-shadow:0 10px 26px color-mix(in srgb,var(--c) 45%,transparent)}
.imm-cta:focus-visible,.imm-av:focus-visible{outline:3px solid #fff;outline-offset:3px}
.imm-note{font-size:13px;color:var(--ss-dim);margin:10px 0 0}
/* Home avatar strip */
.imm-strip{--c:var(--ss-tunnel);background:radial-gradient(40% 60% at 18% 70%,color-mix(in srgb,var(--ss-koda) 20%,transparent),transparent 70%),radial-gradient(40% 60% at 50% 75%,color-mix(in srgb,var(--ss-tauron) 18%,transparent),transparent 70%),radial-gradient(40% 60% at 82% 70%,color-mix(in srgb,var(--ss-phoenix) 18%,transparent),transparent 70%),linear-gradient(180deg,var(--ss-panel2),var(--ss-bg));text-align:center}
.imm-strip p.sub{color:var(--ss-dim);max-width:560px;margin:0 auto 16px;font-size:15px}
.imm-avs{list-style:none;margin:0 0 18px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.imm-av{--c:var(--ss-koda);display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px 14px;border-radius:16px;text-decoration:none;color:var(--ss-txt);min-height:44px;border:1px solid color-mix(in srgb,var(--c) 40%,transparent);background:radial-gradient(90% 70% at 50% 35%,color-mix(in srgb,var(--c) 22%,transparent),transparent 70%),rgba(10,12,20,.75);box-shadow:0 10px 24px rgba(0,0,0,.45);transition:transform .25s,box-shadow .25s}
.imm-av:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(0,0,0,.5),0 0 22px color-mix(in srgb,var(--c) 35%,transparent)}
.imm-av img{width:100%;max-width:150px;height:clamp(110px,24vw,190px);object-fit:contain;filter:drop-shadow(0 8px 14px rgba(0,0,0,.6))}
.imm-av b{font-family:var(--ss-font-head);font-size:17px}
.imm-av .side{font:700 12px/1.2 var(--ss-font-body);letter-spacing:.1em;text-transform:uppercase;color:var(--c)}
.imm-av.t{--c:var(--ss-tauron)}.imm-av.z{--c:var(--ss-phoenix)}
@media(prefers-reduced-motion:reduce){.imm-cta,.imm-av{transition:none}.imm-cta:hover,.imm-av:hover{transform:none}}