/* Escodebars Syndicate stage (Code mode): the real poker-table artwork with the five bosses sliced out as live sprites.
   Retires the full-screen fibre-optic ribbon layer. Track-suit Daniel stays for Chat mode. */
#fibre-canvas{display:none!important}
body.syn-code-mode #horse-avatar-mount{display:none!important}
body.syn-code-mode .horse-avatar-fibres{display:none!important}
body.syn-code-mode #welcome .welcome-emblem{display:none}

.syndicate-stage{position:relative;flex:none;container-type:size;height:min(74vh,calc(100% * 0.5618),900px);width:min(100%,calc(min(74vh,900px) * 1.7799));max-width:none;margin:0 auto 4px;border-radius:12px;overflow:hidden;background:radial-gradient(120% 90% at 50% 100%,#1a1410 0%,#0b0a10 70%);box-shadow:0 14px 48px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.06)}
.syndicate-stage[hidden]{display:none!important}
.syn-room{position:absolute;left:50%;top:50%;translate:-50% -50%;width:min(100cqw,calc(100cqh * 1.7799));height:min(100cqh,calc(100cqw / 1.7799));container-type:size;overflow:hidden;background:#0d0b12}
.syn-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block;filter:saturate(1.04)}
.syn-boss{position:absolute;inset:0;clip-path:var(--clip);transform-origin:var(--origin);z-index:var(--z,2);transition:transform .6s cubic-bezier(.2,.8,.2,1),filter .4s ease;will-change:transform}
.syn-skin{position:absolute;inset:0;transform-origin:var(--origin);animation:syn-breathe 4.6s ease-in-out infinite;animation-delay:var(--delay,0s)}
.syn-skin img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block}
@keyframes syn-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.006) translateY(-.15%)}}

/* Working: lean in over the table. Speaking: step forward toward the screen and take the light. */
.syndicate-stage[data-state=working] .syn-boss{transform:var(--lean)}
.syndicate-stage[data-state=working] .syn-laptop{--glow:1}
.syn-boss.is-speaking{transform:translateY(-1.5%) scale(1.14)!important;filter:brightness(1.1) drop-shadow(0 0 1.2cqw rgba(255,214,120,.65));z-index:9!important;animation:none!important}
.syndicate-stage.has-speaker .syn-boss:not(.is-speaking){filter:brightness(.68) saturate(.85)}
.syndicate-stage.has-speaker .syn-bg{filter:brightness(.68) saturate(.9)}

/* Celebrate: CELEBRATE_TOMMY_GUNS. Recoil shake on the sprites, strobing room light, guns up at 50-65 degrees. */
.syndicate-stage[data-state=celebrate] .syn-boss{transform:var(--lean);animation:syn-recoil .085s steps(2,jump-none) infinite;animation-delay:var(--delay,0s)}
@keyframes syn-recoil{0%,100%{transform:var(--lean) translate(0,0)}50%{transform:var(--lean) translate(.35%,-1%) rotate(-.8deg)}}
.syn-strobe{position:absolute;inset:0;z-index:20;pointer-events:none;background:#fff6dc;opacity:0;mix-blend-mode:overlay}
.syndicate-stage[data-state=celebrate] .syn-strobe{animation:syn-strobe .16s steps(2,jump-none) infinite}
@keyframes syn-strobe{0%,100%{opacity:0}50%{opacity:.6}}
.syndicate-stage[data-state=celebrate] .syn-bg{animation:syn-roomflash .22s steps(2,jump-none) infinite}
@keyframes syn-roomflash{0%,100%{filter:brightness(1) saturate(1.04)}50%{filter:brightness(1.5) saturate(1.15)}}
.syn-gun{position:absolute;left:var(--gx);top:var(--gy);width:var(--gw,13cqw);aspect-ratio:200/90;z-index:12;pointer-events:none;opacity:0;transform-origin:40% 67%;transform:translate(-40%,-67%) scaleX(var(--flip,1)) rotate(var(--ga,-58deg)) scale(.6);transition:opacity .12s ease,transform .22s cubic-bezier(.2,1.5,.4,1);filter:drop-shadow(0 .4cqw .6cqw rgba(0,0,0,.65))}
.syn-gun svg{width:100%;height:100%;display:block;overflow:visible}
.syndicate-stage[data-state=celebrate] .syn-gun{opacity:1;transform:translate(-40%,-67%) scaleX(var(--flip,1)) rotate(var(--ga,-58deg));animation:syn-kick .085s steps(2,jump-none) infinite;animation-delay:var(--delay,0s)}
@keyframes syn-kick{0%,100%{transform:translate(-40%,-67%) scaleX(var(--flip,1)) rotate(var(--ga,-58deg))}50%{transform:translate(-40%,-67%) scaleX(var(--flip,1)) rotate(calc(var(--ga,-58deg) + 3deg)) translateX(-2.5%)}}

/* Table props: glowing mini laptops with live terminals, and the hands of poker. */
.syn-laptop{position:absolute;left:var(--x);top:var(--y);width:var(--w,8.6cqw);translate:-50% -100%;z-index:var(--z,6);transform:perspective(70cqw) rotateX(14deg) rotateY(var(--ry,0deg));transform-style:preserve-3d;pointer-events:none}
.syn-screen{position:relative;aspect-ratio:16/10;border-radius:.45cqw .45cqw .15cqw .15cqw;background:#06100d;border:.18cqw solid #2a2f3a;box-shadow:0 0 calc(.6cqw + 1.6cqw * var(--glow,0)) rgba(90,255,200,calc(.25 + .5 * var(--glow,0))),inset 0 0 .5cqw rgba(120,255,220,.25);overflow:hidden;transform-origin:50% 100%;transform:rotateX(-20deg);transition:box-shadow .5s}
.syn-term{margin:0;padding:.25cqw .35cqw;color:#8ff5cf;font:500 .66cqw/1.3 var(--mono,"Cascadia Code",Consolas,monospace);white-space:pre;overflow:hidden;text-shadow:0 0 .35cqw rgba(120,255,210,.55)}
.syn-base{height:.55cqw;margin-top:-.05cqw;border-radius:0 0 .4cqw .4cqw;background:linear-gradient(#3a3f4b,#1f232c);box-shadow:0 .25cqw .5cqw rgba(0,0,0,.55)}
.syn-cards{position:absolute;left:var(--x);top:var(--y);translate:-50% -50%;z-index:5;display:flex;gap:.12cqw;transform:perspective(70cqw) rotateX(52deg) rotate(var(--r,0deg));pointer-events:none}
.syn-card{width:2.1cqw;height:3cqw;border-radius:.25cqw;background:#f7f3e8;color:#1a1a1a;font:700 1cqw/1 system-ui,sans-serif;display:grid;place-items:center;box-shadow:0 .1cqw .3cqw rgba(0,0,0,.5);transform:rotate(var(--tilt,0deg))}
.syn-card.red{color:#c0262d}
.syn-fx{position:absolute;inset:0;width:100%;height:100%;z-index:15;pointer-events:none}
.syn-caption{position:absolute;left:50%;bottom:1.6cqw;translate:-50% 0;z-index:30;max-width:92%;padding:.55cqw 1.4cqw;border-radius:99px;border:1px solid rgba(255,255,255,.12);background:rgba(8,8,14,.72);color:#eee6d2;font:650 1.35cqw/1.25 system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;backdrop-filter:blur(4px);transition:background .25s,color .25s}
.syndicate-stage[data-state=celebrate] .syn-caption{background:rgba(234,179,8,.94);color:#15120a;border-color:#ffe08a;box-shadow:0 0 2cqw rgba(234,179,8,.6)}

/* Until the artwork file is in place: felt table, faint sprite windows and name plates so nothing is a mystery. */
.syndicate-stage.no-art .syn-room{background:radial-gradient(62% 46% at 50% 62%,#1f5a3a 0,#143d28 45%,#0d0b12 72%)}
.syndicate-stage.no-art .syn-skin{background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.03));outline:1px dashed rgba(255,255,255,.18);outline-offset:-1px}
.syn-plate{position:absolute;left:var(--x);top:var(--y);translate:-50% -50%;z-index:8;color:#e6d9b8;font:700 1.6cqw/1 system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;opacity:0;pointer-events:none;text-shadow:0 .1cqw .4cqw rgba(0,0,0,.8)}
.syndicate-stage.no-art .syn-plate{opacity:.85}
.syn-debug{position:absolute;inset:0;width:100%;height:100%;z-index:40;pointer-events:none}
.syn-debug polygon{fill:rgba(255,0,180,.06);stroke:#ff3fc0;stroke-width:1.5;vector-effect:non-scaling-stroke}
.syn-debug circle{vector-effect:non-scaling-stroke}
.syn-debug text{font:700 13px system-ui,sans-serif;fill:#fff;paint-order:stroke;stroke:#000;stroke-width:3px}

body.no-motion .syn-skin,body.no-motion .syn-boss,body.no-motion .syn-strobe,body.no-motion .syn-gun,body.no-motion .syn-bg{animation:none!important}
@media (prefers-reduced-motion:reduce){.syn-skin,.syn-boss,.syn-strobe,.syn-gun,.syn-bg{animation:none!important}}
@media (max-width:800px){.syndicate-stage{height:min(48vh,420px);width:min(100%,calc(min(48vh,420px) * 1.7799));border-radius:12px;margin:4px auto 2px}}
