/* SML Live Watch — Phase 1 shell (admin preview ?lw=1)
   Recreated from design handoff "Watch Page.dc.html" — tokens/keyframes verbatim.
   Everything scoped under #sml-lw-root with .slw- classes. */

/* design fonts — pulled in here (not the WPCode loader) so both the live and VOD
   pages get them from one place, and neither can silently ship without it again */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800;900&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

#sml-lw-root{font-family:Archivo,system-ui,sans-serif;color:#e6edf3;background:#04060a;min-height:100vh;padding:0 0 72px;overflow:hidden;position:relative;z-index:1}
#sml-lw-root *{box-sizing:border-box}
#sml-lw-root a{color:#00ff88;text-decoration:none}
#sml-lw-root a:hover{color:#7affc0}
#sml-lw-root button{font-family:Archivo,system-ui,sans-serif}

/* page takeover while preview is on: live-watch.js re-parents #sml-lw-root to be a
   direct child of <body>, then this rule hides everything else (theme page, footer,
   floating launchers) — the admin bar stays. Applies to late-appended nodes too. */
body.slw-on > :not(#sml-lw-root):not(#slw-paste-mount):not(#sml-vw-root):not(#wpadminbar):not(.vcd):not(#sml-global-header):not(#sml-lb-panel):not(#sml-lb-news):not(.sml-lb-floating):not(.sml-nk-panel):not(#sml-ss-global-host):not(#sml-ss-panel):not(#sml-tkpop):not([class*="sml-loop"]):not([id*="loop-kick"]):not([class*="loop-kick"]){display:none !important}
#sml-vw-root{font-family:Archivo,system-ui,sans-serif;color:#e6edf3;background:#04060a;min-height:100vh;padding:0 0 72px;overflow:hidden;position:relative;z-index:1}
#sml-vw-root *{box-sizing:border-box}
#sml-vw-root a{color:#00ff88;text-decoration:none}
#sml-vw-root button{font-family:Archivo,system-ui,sans-serif}
#sml-vw-root .slw-nav-links a{font:600 12px/1 Archivo,sans-serif;color:#5d7085;padding:9px 14px;border-radius:8px}
#sml-vw-root .slw-nav-links a.on{color:#e6edf3;background:#101c26}
#sml-vw-root .slw-titleblk h1 a, #sml-vw-root .slw-cmt a, #sml-vw-root .slw-rv{color:inherit !important;text-decoration:none !important}
#sml-vw-root a.slw-openlink{color:#00ff88 !important}
#sml-vw-root .slw-rec-h .r a{color:#5d7085 !important}
#sml-vw-root .slw-cm-gate a{color:#ffb454 !important;font-weight:600}
body.slw-on{background:#04060a !important}

/* the site's ticker-mention linkifier wraps $SYM text in anchors sitewide —
   keep the links functional but force the design's colors */
#sml-lw-root .slw-tq a, #sml-lw-root .slw-tq a *{color:inherit !important;text-decoration:none !important;border-bottom:none !important}
#sml-lw-root .slw-titleblk h1 a, #sml-lw-root .slw-titleblk h1 a *{color:#00ff88 !important;text-decoration:none !important}
#sml-lw-root .slw-qcard a, #sml-lw-root .slw-qcard a *{color:inherit !important;text-decoration:none !important}
#sml-lw-root .slw-orbit-cap a, #sml-lw-root .slw-ocard .cap a, #sml-lw-root .slw-msg a, #sml-lw-root .slw-pinned a, #sml-lw-root .slw-tt a{color:inherit !important;text-decoration:none !important}

/* ---- keyframes (verbatim from the design) ---- */
@keyframes slwPulseDot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.82)}}
@keyframes slwLiveRing{0%{box-shadow:0 0 0 0 rgba(255,46,102,.55)}70%{box-shadow:0 0 0 14px rgba(255,46,102,0)}100%{box-shadow:0 0 0 0 rgba(255,46,102,0)}}
@keyframes slwSweep{0%{transform:translateX(-120%)}100%{transform:translateX(220%)}}
@keyframes slwMarquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes slwRise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}
@keyframes slwMsgIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes slwScan{0%{transform:translateY(-100%)}100%{transform:translateY(1200%)}}
@keyframes slwBar{0%,100%{transform:scaleY(.28)}50%{transform:scaleY(1)}}
@keyframes slwDrift{0%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-14px,0)}100%{transform:translate3d(0,0,0)}}
@keyframes slwGlow{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes slwMailA{0%{transform:translate(0,0) scale(.5);opacity:0}20%{opacity:1}100%{transform:translate(-16px,-26px) rotate(-24deg);opacity:0}}
@keyframes slwMailB{0%{transform:translate(0,0) scale(.5);opacity:0}20%{opacity:1}100%{transform:translate(2px,-32px) rotate(8deg);opacity:0}}
@keyframes slwMailC{0%{transform:translate(0,0) scale(.5);opacity:0}20%{opacity:1}100%{transform:translate(18px,-24px) rotate(26deg);opacity:0}}
@keyframes slwBoxWob{0%,100%{transform:rotate(0)}25%{transform:rotate(-8deg) scale(1.08)}60%{transform:rotate(7deg) scale(1.05)}}
@keyframes slwMarkPop{0%{transform:scale(.2) rotate(-40deg);opacity:0}60%{transform:scale(1.25) rotate(6deg)}100%{transform:scale(1) rotate(0)}}
@keyframes slwWinPulse{0%,100%{box-shadow:0 0 8px rgba(0,255,136,.35),inset 0 1px 0 rgba(255,255,255,.12)}50%{box-shadow:0 0 26px rgba(0,255,136,.85),inset 0 1px 0 rgba(255,255,255,.2)}}
@keyframes slwTomatoFly{0%{transform:translate(480px,340px) scale(.4) rotate(0deg);opacity:0}12%{opacity:1}55%{transform:translate(110px,-70px) scale(1.5) rotate(420deg)}100%{transform:translate(0,0) scale(1.1) rotate(760deg)}}
@keyframes slwSplatPop{0%{transform:scale(.2);opacity:0}40%{transform:scale(1.35);opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes slwDripDown{0%{transform:translateY(0)}100%{transform:translateY(9px)}}
@keyframes slwArmFlex{0%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(-16deg) scale(1.22)}}
@keyframes slwAffFlash{0%,100%{box-shadow:0 0 0 0 rgba(255,180,84,0);border-color:#3a2c12}50%{box-shadow:0 0 18px 2px rgba(255,180,84,.55);border-color:#ffb454}}
@keyframes slwTwinkle{0%,100%{opacity:.9}50%{opacity:.25}}
@keyframes slwAstroA{0%{transform:translate(-60px,120px) rotate(0deg)}100%{transform:translate(1900px,-40px) rotate(340deg)}}
@keyframes slwAstroB{0%{transform:translate(1800px,60px) rotate(0deg)}100%{transform:translate(-120px,190px) rotate(-300deg)}}
@keyframes slwAstroC{0%{transform:translate(-40px,380px) rotate(0deg)}100%{transform:translate(1900px,300px) rotate(420deg)}}
@keyframes slwNebDrift{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(30px,-14px,0) scale(1.06)}100%{transform:translate3d(0,0,0) scale(1)}}
@keyframes slwBlink{0%,100%{opacity:1}50%{opacity:0}}

/* ---- ambient ---- */
.slw-amb{position:relative;height:0}
.slw-amb-g{position:absolute;top:-160px;left:50%;width:1200px;height:520px;transform:translateX(-50%);background:radial-gradient(ellipse at center,rgba(0,255,136,.10),transparent 62%);filter:blur(20px);animation:slwGlow 9s ease-in-out infinite;pointer-events:none}
.slw-amb-r{position:absolute;top:60px;left:8%;width:520px;height:420px;background:radial-gradient(ellipse at center,rgba(255,46,102,.09),transparent 65%);filter:blur(24px);animation:slwDrift 14s ease-in-out infinite;pointer-events:none}

/* ---- top nav ---- */
.slw-nav{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 40px;border-bottom:1px solid #101822;background:rgba(4,6,10,.95)}
.slw-nav-l{display:flex;align-items:center;gap:26px;min-width:0}
.slw-logo{display:flex;align-items:center;gap:12px;padding:6px 12px 6px 6px;border:1px solid #131c26;border-radius:10px;background:#0b1119;flex:none}
.slw-logo:hover{border-color:#134a33;background:#0d1a15}
.slw-logo img{height:26px;width:auto;display:block}
.slw-logo-div{width:1px;height:20px;background:#1c2833}
.slw-logo-live{display:flex;align-items:center;gap:7px}
.slw-dot{width:7px;height:7px;border-radius:50%;background:#00ff88;animation:slwPulseDot 2.4s ease-in-out infinite}
.slw-logo-live span{font:700 10px/1 Archivo,sans-serif;letter-spacing:.16em;color:#8fa3b5}
.slw-nav-links{display:flex;align-items:center;gap:4px}
#sml-lw-root .slw-nav-links a{font:600 12px/1 Archivo,sans-serif;color:#5d7085;padding:9px 14px;border-radius:8px}
#sml-lw-root .slw-nav-links a:hover{color:#e6edf3}
#sml-lw-root .slw-nav-links a.on{color:#e6edf3;background:#101c26}
.slw-nav-r{display:flex;align-items:center;gap:12px}
.slw-search{display:flex;align-items:center;gap:9px;border:1px solid #131c26;border-radius:8px;background:#0b1119;padding:9px 13px}
.slw-search .q{font:500 11px/1 'IBM Plex Mono',monospace;color:#4c5d6d}
.slw-search .k{font:600 10px/1 'IBM Plex Mono',monospace;color:#2d3a47;border:1px solid #1c2833;border-radius:4px;padding:3px 5px}
.slw-onair{display:flex;align-items:center;gap:8px;border:1px solid #3d1524;border-radius:8px;background:#1a0810;padding:9px 13px}
.slw-onair .d{width:7px;height:7px;border-radius:50%;background:#ff2e66;animation:slwPulseDot 1.4s ease-in-out infinite}
.slw-onair span{font:800 10px/1 Archivo,sans-serif;letter-spacing:.16em;color:#ff859f}

/* ---- ticker tape ---- */
.slw-tq{display:flex;align-items:baseline;gap:9px;flex:none;cursor:default}
.slw-tq .s{font:700 11px/1 'IBM Plex Mono',monospace;color:#8fa3b5;border-bottom:1px dotted #2d3a47}
.slw-tq .p{font:500 11px/1 'IBM Plex Mono',monospace;color:#e6edf3}
.slw-tq .c{font:600 11px/1 'IBM Plex Mono',monospace;color:#00e07a}
.slw-tq .c.dn{color:#ff4757}

/* ---- stage ---- */
.slw-content{position:relative;padding:32px 40px 0;max-width:1780px;margin:0 auto}
.slw-stage{display:flex;gap:24px;align-items:flex-start;flex-wrap:wrap}
.slw-main{flex:3 1 660px;min-width:0;display:flex;flex-direction:column;gap:22px}
.slw-rail{flex:1 1 392px;max-width:440px;display:flex;flex-direction:column;gap:16px}

/* ---- player ---- */
.slw-player{position:relative;border-radius:18px;overflow:hidden;border:1px solid #16202b;background:#070b10;box-shadow:0 40px 90px -40px rgba(0,255,136,.22),0 0 0 1px rgba(0,255,136,.05)}
.slw-frame{position:relative;width:100%;padding-bottom:56.25%}
.slw-media{position:absolute;inset:0;background:#000}
.slw-media iframe,.slw-media video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.slw-media:empty{display:none}
.slw-frame-ph{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 38%,#0d1824,#070b10 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.slw-frame-ph.hide{display:none}
.slw-frame-ph .t2{max-width:70%;text-align:center;line-height:1.5}
.slw-frame-ph .t1{font:800 12px/1 Archivo,sans-serif;letter-spacing:.22em;color:#26333f}
.slw-frame-ph .t2{font:400 10px/1 Archivo,sans-serif;color:#1c2833}
/* Scheduled streams are Watch Pages, not fake video: preserve the creator's
   thumbnail/GIF behind an accessible label until the real feed is live. */
.slw-frame-ph.scheduled{background-color:#07101a;background-repeat:no-repeat;background-size:cover;background-position:center;isolation:isolate}
.slw-frame-ph.scheduled::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.44));z-index:-1}
.slw-frame-ph.scheduled .t1,.slw-frame-ph.scheduled .t2{color:#f5fbff;text-shadow:0 2px 12px rgba(0,0,0,.9)}
.slw-frame-ph.scheduled .t1{font-size:12px}
.slw-frame-ph.scheduled .t2{font-size:12px;font-weight:700}
/* the film-grain treatment only dresses the EMPTY frame — a mounted stream shows
   crystal clear, no scanlines/vignette/sweep over real video */
.slw-frame.clear .slw-scanlines, .slw-frame.clear .slw-vignette, .slw-frame.clear .slw-scan, .slw-frame.clear .slw-sweepwrap{display:none}
.slw-scanlines{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.028) 0 1px,transparent 1px 3px)}
.slw-vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 40%,transparent 40%,rgba(2,4,7,.72) 100%)}
.slw-scan{position:absolute;left:0;right:0;height:120px;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(0,255,136,.07),transparent);animation:slwScan 7s linear infinite}
.slw-sweepwrap{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.slw-sweep{position:absolute;top:0;bottom:0;width:34%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.055),transparent);animation:slwSweep 6.5s ease-in-out infinite}
.slw-topchips{position:absolute;top:18px;left:20px;display:flex;align-items:center;gap:10px;z-index:5}
.slw-livechip{display:flex;align-items:center;gap:8px;background:#ff2e66;border-radius:6px;padding:7px 11px;animation:slwLiveRing 2.6s ease-out infinite}
.slw-livechip .d{width:6px;height:6px;border-radius:50%;background:#fff;animation:slwPulseDot 1.2s ease-in-out infinite}
.slw-livechip span{font:800 10px/1 Archivo,sans-serif;letter-spacing:.16em;color:#fff}
.slw-viewchip{display:flex;align-items:center;gap:7px;background:rgba(6,10,16,.88);border:1px solid #1c2833;border-radius:6px;padding:7px 11px}
.slw-viewchip .n{font:600 11px/1 'IBM Plex Mono',monospace;color:#e6edf3}
.slw-viewchip .w{font:500 10px/1 Archivo,sans-serif;color:#8fa3b5}
.slw-titleblk{position:absolute;left:20px;bottom:88px;display:flex;flex-direction:column;gap:9px;max-width:64%;z-index:4}
.slw-titleblk .ep{display:flex;align-items:center;gap:8px}
.slw-titleblk .ep i{height:3px;width:26px;background:#00ff88;display:block}
.slw-titleblk .ep span{font:700 10px/1 Archivo,sans-serif;letter-spacing:.18em;color:#00ff88}
.slw-titleblk h1{margin:0;font:900 34px/1.05 Archivo,sans-serif;letter-spacing:-.02em;color:#fff;text-shadow:0 6px 30px rgba(0,0,0,.6)}
.slw-titleblk h1 .sym{color:#00ff88;border-bottom:2px dotted #134a33;cursor:default}
.slw-titleblk .who{display:flex;align-items:center;gap:10px}
.slw-titleblk .who .nm{font:500 12px/1 Archivo,sans-serif;color:#c7d6e3}
.slw-titleblk .who .sep{width:4px;height:4px;border-radius:50%;background:#2d3a47}
.slw-titleblk .who .el{font:500 12px/1 'IBM Plex Mono',monospace;color:#8fa3b5}

/* tomato overlays */
.slw-tom-fly{position:absolute;left:44%;top:36%;z-index:14;pointer-events:none}
.slw-tom-fly span{display:inline-block;font-size:46px;animation:slwTomatoFly 1.15s cubic-bezier(.25,.6,.35,1) both;filter:drop-shadow(0 10px 14px rgba(0,0,0,.6)) drop-shadow(0 0 10px rgba(255,60,30,.4))}
.slw-tom-splat{position:absolute;left:44%;top:36%;z-index:13;pointer-events:none;animation:slwSplatPop .3s ease-out both}
.slw-tom-splat .blob{position:relative;width:74px;height:64px}
.slw-tom-splat .b1{position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,rgba(217,46,18,.9),rgba(160,24,6,.75) 55%,transparent 72%);border-radius:46% 54% 58% 42%/52% 48% 55% 45%;filter:blur(1px)}
.slw-tom-splat .d1{position:absolute;left:16px;bottom:-7px;width:7px;height:15px;background:linear-gradient(180deg,rgba(196,34,10,.85),transparent);border-radius:0 0 5px 5px;animation:slwDripDown 1.6s ease-in both}
.slw-tom-splat .d2{position:absolute;left:46px;bottom:-5px;width:5px;height:11px;background:linear-gradient(180deg,rgba(196,34,10,.8),transparent);border-radius:0 0 4px 4px;animation:slwDripDown 2s ease-in .2s both}
.slw-tom-splat .tm{position:absolute;left:19px;top:14px;font-size:29px;transform:scaleY(.72) rotate(-8deg);filter:drop-shadow(0 4px 5px rgba(0,0,0,.55))}
.slw-tom-card{position:absolute;left:20px;top:64px;z-index:14;display:flex;align-items:center;gap:10px;background:rgba(10,5,4,.92);border:1px solid #3d1a14;border-radius:12px;padding:10px 13px;max-width:340px;animation:slwMsgIn .3s ease both}
.slw-tom-card .av{position:relative;width:34px;height:34px;flex:none}
.slw-tom-card .av .c{width:34px;height:34px;border-radius:50%;border:2px solid #ff6b4a;background:#101821;display:flex;align-items:center;justify-content:center;font:700 11px/1 'IBM Plex Mono',monospace;color:#ff8a6a}
.slw-tom-card .av .b{position:absolute;right:-7px;bottom:-6px;font-size:15px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.slw-tom-card .tx{display:flex;flex-direction:column;gap:4px;min-width:0}
.slw-tom-card .h{font:700 10px/1 Archivo,sans-serif;color:#ff8a6a}
.slw-tom-card .n{font:500 11px/1.45 Archivo,sans-serif;color:#ffd9cf;text-wrap:pretty}

/* markers panel */
.slw-markers{position:absolute;left:20px;right:20px;bottom:76px;z-index:15;border:1px solid #1c2833;border-radius:12px;background:rgba(6,10,15,.97);box-shadow:0 30px 70px -20px rgba(0,0,0,.9);overflow:hidden;animation:slwMsgIn .25s ease both}
.slw-markers-h{display:flex;align-items:center;justify-content:space-between;padding:11px 15px;border-bottom:1px solid #131c26}
.slw-markers-h b{font:700 10px/1 Archivo,sans-serif;letter-spacing:.14em;color:#e6edf3}
.slw-markers-h span{font:400 9px/1 Archivo,sans-serif;color:#5d7085}
.slw-markers-g{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#131c26}
.slw-ch{display:flex;flex-direction:column;gap:8px;padding:16px 18px;cursor:pointer;background:#080c12;border-left:2px solid transparent;transition:background .2s ease}
.slw-ch.on{background:#0c1a16;border-left-color:#00ff88}
.slw-ch .r{display:flex;align-items:center;justify-content:space-between;gap:8px}
.slw-ch .t{font:700 12px/1 'IBM Plex Mono',monospace;color:#8fa3b5}
.slw-ch.on .t{color:#00ff88}
.slw-ch .b{font:700 9px/1 Archivo,sans-serif;letter-spacing:.12em;color:#5d7085;background:#101821;border:1px solid #1c2833;border-radius:20px;padding:5px 8px}
.slw-ch.on .b{color:#04060a;background:#00ff88;border:none}
.slw-ch .n{font:700 13px/1.3 Archivo,sans-serif;color:#c7d6e3}
.slw-ch.on .n{color:#fff}

/* control bar */
.slw-ctl{position:absolute;left:0;right:0;bottom:0;padding:14px 20px 16px;background:linear-gradient(180deg,transparent,rgba(3,5,9,.94) 42%);z-index:5}
.slw-prog{position:relative;height:5px;border-radius:3px;background:#1a2530;margin-bottom:13px;cursor:pointer}
.slw-prog .buf{position:absolute;left:0;top:0;bottom:0;width:96%;border-radius:3px;background:#26333f}
.slw-prog .fill{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:linear-gradient(90deg,#0a5c3c,#00ff88)}
.slw-prog .head{position:absolute;top:-4px;width:13px;height:13px;margin-left:-6px;border-radius:50%;background:#00ff88;box-shadow:0 0 14px rgba(0,255,136,.8)}
.slw-prog .mk{position:absolute;top:-3px;width:2px;height:11px;border-radius:1px;background:#3d4c5a}
.slw-prog .mk.past{background:rgba(4,6,10,.7)}
.slw-ctl-row{display:flex;align-items:center;justify-content:space-between;gap:16px}
.slw-ctl-l{display:flex;align-items:center;gap:14px}
.slw-btn-sq{width:34px;height:34px;border-radius:8px;border:none;background:#101c26;color:#e6edf3;font:700 12px/1 Archivo,sans-serif;cursor:pointer}
.slw-btn-sq:hover{background:#16232f}
.slw-btn-sq.play{background:#00ff88;color:#04060a}
.slw-btn-sq.play:hover{background:#7affc0}
.slw-vol{display:flex;align-items:center;gap:8px;height:34px;padding:0 12px;border-radius:8px;border:none;background:#101c26;color:#c7d6e3;font:600 11px/1 Archivo,sans-serif;cursor:pointer}
.slw-vol:hover{background:#16232f}
.slw-vol .g{font:700 12px/1 Archivo,sans-serif}
.slw-vol .bar{width:54px;height:4px;border-radius:2px;background:#26333f;overflow:hidden}
.slw-vol .bar i{display:block;width:72%;height:100%;background:#00ff88}
.slw-vol.muted{background:#1a0810;color:#ff859f}
.slw-vol.muted:hover{background:#24101a}
.slw-vol .ml{font:600 10px/1 Archivo,sans-serif;letter-spacing:.1em}
.slw-loopchip{display:flex;align-items:center;gap:8px;height:34px;padding:0 12px;border-radius:8px;background:#101c26}
.slw-loopchip .d{width:6px;height:6px;border-radius:50%;background:#ff2e66;animation:slwPulseDot 1.4s ease-in-out infinite}
.slw-loopchip span{font:700 10px/1 Archivo,sans-serif;letter-spacing:.12em;color:#e6edf3}
.slw-clock{font:800 15px/1 'IBM Plex Mono',monospace;color:#ff2e66;letter-spacing:.02em;text-shadow:0 0 10px rgba(255,46,102,.5);white-space:nowrap}
.slw-ctl-r{position:relative;display:flex;align-items:center;gap:8px}
.slw-btn-term{font:600 10px/1 Archivo,sans-serif;color:#00ccff;background:rgba(0,204,255,.1);border:1px solid #1b3a4d;padding:9px 11px;border-radius:6px;cursor:pointer;white-space:nowrap}
.slw-btn-term:hover{background:rgba(0,204,255,.2)}
.slw-like{display:flex;align-items:center;gap:5px;font:700 10px/1 'IBM Plex Mono',monospace;color:#c7d6e3;padding:9px 11px;border-radius:8px;cursor:pointer;border:none;background:#101c26;transition:background .2s ease,box-shadow .2s ease}
.slw-like:active{transform:translateY(2px)}
.slw-like .g{font:800 14px/1 Archivo,sans-serif;display:inline-block;filter:grayscale(1) brightness(1.4) drop-shadow(0 1px 2px rgba(0,0,0,.5))}
.slw-like.on{color:#04060a;padding:10px 13px;border-radius:9px;border:1px solid #0a7a48;background:linear-gradient(180deg,#5affb2,#00e07a 55%,#00b35f);box-shadow:0 3px 0 #0a5c3c,0 7px 18px rgba(0,255,136,.4),inset 0 1px 0 rgba(255,255,255,.5)}
.slw-like.on .g{filter:drop-shadow(0 2px 2px rgba(0,0,0,.5)) drop-shadow(0 0 6px rgba(4,6,10,.35));transform:perspective(60px) rotateX(12deg)}
.slw-facepile{display:inline-flex;margin-left:2px}
.slw-facepile i{width:15px;height:15px;border-radius:50%;border:1px solid #1c2833;background:#101821;display:inline-flex;align-items:center;justify-content:center;font:600 7px/1 'IBM Plex Mono',monospace;color:#8fa3b5;font-style:normal}
.slw-facepile i + i{margin-left:-5px}
.slw-tom-btn{display:flex;align-items:center;gap:5px;font:700 10px/1 Archivo,sans-serif;color:#ffd9cf;padding:8px 11px;border-radius:8px;cursor:pointer;background:linear-gradient(180deg,#2b0f08,#1a0805);border:1px solid #5c2415;box-shadow:0 0 12px rgba(255,80,40,.25),inset 0 1px 0 rgba(255,255,255,.08);transition:all .25s ease;white-space:nowrap}
.slw-tom-btn.off{color:#6a4c42;cursor:default;background:#140b08;border-color:#2b1710;box-shadow:none;opacity:.65}
.slw-tom-count{font:700 9px/1 'IBM Plex Mono',monospace;color:#ff8a6a;border:1px solid #5c2415;border-radius:10px;padding:4px 6px}
.slw-tom-btn.off .slw-tom-count{color:#6a4c42;border-color:#2b1710}
.slw-share{display:flex;align-items:center;gap:5px;font:700 10px/1 Archivo,sans-serif;color:#c7d6e3;background:#101c26;border:none;border-radius:8px;padding:8px 11px;cursor:pointer;transition:background .25s ease,box-shadow .25s ease}
.slw-share.mail{background:linear-gradient(180deg,#14304a,#0b1c2c);border:1px solid #1b3a4d;box-shadow:0 0 14px rgba(0,204,255,.35)}
.slw-share.done{color:#fff;background:linear-gradient(180deg,#ff5f7e,#ff2e66 55%,#c01c3c);border:1px solid #8f1330;box-shadow:0 3px 0 #6e0f26,0 7px 16px rgba(255,46,102,.45),inset 0 1px 0 rgba(255,255,255,.35)}
.slw-share .box{position:relative;display:inline-block;font-size:13px;animation:slwBoxWob 1s ease-in-out infinite;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.slw-share .box .m1{position:absolute;left:2px;top:-2px;font-size:9px;animation:slwMailA 1s ease-out infinite}
.slw-share .box .m2{position:absolute;left:4px;top:-2px;font-size:9px;animation:slwMailB 1s ease-out .3s infinite}
.slw-share .box .m3{position:absolute;left:6px;top:-2px;font-size:9px;animation:slwMailC 1s ease-out .6s infinite}
.slw-share .arm{display:inline-block;font-size:13px;animation:slwArmFlex 1.4s ease-in-out infinite;filter:sepia(1) hue-rotate(-12deg) saturate(4.5) brightness(1.15) drop-shadow(0 2px 4px rgba(255,180,84,.55))}
.slw-share .sharers i{border-color:#8a5a14}
.slw-gear{font:600 12px/1 Archivo,sans-serif;color:#8fa3b5;background:#101c26;border:none;border-radius:6px;padding:8px 10px;cursor:pointer;transition:transform .3s ease}
.slw-gear.on{color:#04060a;background:#00ff88;transform:rotate(40deg)}
/* voice cues: mic toggle "listening" state (no rotate) + the button attention-pop */

/* tomato compose */
.slw-tom-pop{position:absolute;left:0;bottom:46px;width:262px;border:1px solid #3d1a14;border-radius:10px;background:#120705;box-shadow:0 20px 50px -18px rgba(0,0,0,.9);z-index:21;padding:13px;display:flex;flex-direction:column;gap:9px}
.slw-tom-pop .hd{display:flex;align-items:center;justify-content:space-between}
.slw-tom-pop .hd b{font:800 10px/1 Archivo,sans-serif;letter-spacing:.1em;color:#ff6b4a}
.slw-tom-pop .hd .wc{font:600 9px/1 'IBM Plex Mono',monospace;color:#ffb454}
.slw-tom-pop .rules{font:400 9px/1.4 Archivo,sans-serif;color:#8a6a5a}
.slw-tom-pop .price{display:flex;align-items:center;justify-content:space-between;border:1px solid #3d1a14;border-radius:8px;background:#1c0c08;padding:8px 10px}
.slw-tom-pop .price .lb{font:700 11px/1 'IBM Plex Mono',monospace;color:#ffb454}
.slw-tom-pop .price .sp{font:400 8px/1.3 Archivo,sans-serif;color:#8a6a5a;text-align:right}
.slw-tom-pop input{border:1px solid #3d1a14;border-radius:8px;padding:9px 11px;background:#1c0c08;color:#ffd9cf;font:400 11px/1 Archivo,sans-serif;outline:none;width:100%}
.slw-tom-pop .ft{display:flex;align-items:center;justify-content:space-between}
.slw-tom-pop .cnt{font:500 9px/1 'IBM Plex Mono',monospace;color:#5d4438}
.slw-tom-pop .btns{display:flex;gap:7px}
.slw-tom-cancel{font:600 10px/1 Archivo,sans-serif;color:#8a6a5a;background:none;border:1px solid #3d1a14;padding:9px 12px;border-radius:7px;cursor:pointer}
.slw-tom-cancel:hover{color:#ffd9cf}
.slw-tom-go{font:800 10px/1 Archivo,sans-serif;color:#fff;background:linear-gradient(180deg,#ff6b4a,#d92e12);border:1px solid #8f2210;padding:9px 13px;border-radius:7px;cursor:pointer;box-shadow:0 3px 0 #6e1a0c}
.slw-tom-go:active{transform:translateY(2px)}

/* settings menu */
.slw-menu{position:absolute;right:0;bottom:46px;width:250px;max-height:420px;overflow:auto;border:1px solid #1c2833;border-radius:10px;background:#0a0f16;box-shadow:0 20px 50px -18px rgba(0,0,0,.9);z-index:20}
.slw-menu .mh{display:flex;align-items:center;justify-content:space-between;padding:11px 13px;border-bottom:1px solid #131c26}
.slw-menu .mh b{font:700 10px/1 Archivo,sans-serif;color:#e6edf3}
.slw-menu .mh span{font:400 9px/1 'IBM Plex Mono',monospace;color:#5d7085}
.slw-menu .sec{padding:9px 13px 4px}
.slw-menu .sec.bt{border-top:1px solid #131c26}
.slw-menu .sec span{font:600 8px/1 Archivo,sans-serif;letter-spacing:.14em;color:#4c5d6d}
.slw-menu .row{display:flex;align-items:center;gap:8px;padding:10px 13px;cursor:pointer}
.slw-menu .row:hover{background:#0c141c}
.slw-menu .row.sel{background:#0c1a16}
.slw-menu .row .ck{font:700 10px/1 Archivo,sans-serif;color:transparent;width:12px}
.slw-menu .row.sel .ck{color:#00ff88}
.slw-menu .row .nm{font:500 11px/1 'IBM Plex Mono',monospace;color:#8fa3b5}
.slw-menu .row.sel .nm{color:#e6edf3}
.slw-menu .row .nt{font:400 9px/1 'IBM Plex Mono',monospace;color:#4c5d6d;margin-left:auto}
.slw-menu .row2{display:flex;align-items:center;justify-content:space-between;padding:10px 13px;cursor:pointer}
.slw-menu .row2:hover{background:#0c141c}
.slw-menu .row2 .l{font:500 11px/1 Archivo,sans-serif;color:#c7d6e3}
.slw-menu .row2 .v{font:500 10px/1 'IBM Plex Mono',monospace;color:#5d7085}
.slw-menu .row2 .v.on{color:#00ff88}

/* ---- multi-screen stream (2 / 3 sources) ---- */
.slw-frame.multi .slw-media{display:grid;gap:6px;padding:6px;background:#070b10}
.slw-frame.multi.lay3 .slw-media{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr}
.slw-frame.multi.lay2 .slw-media{grid-template-columns:2fr 1fr;grid-template-rows:1fr}
.slw-frame.multi.lay1 .slw-media{grid-template-columns:1fr;grid-template-rows:1fr}
.slw-frame.multi .slw-media:empty{display:none}
.slw-scr{position:relative;border-radius:10px;overflow:hidden;background:#000;border:1px solid #16202b;min-height:0;min-width:0}
.slw-scr.main{grid-row:1 / span 2;border-color:#1c2833}
.slw-frame.multi.lay2 .slw-scr.main{grid-row:1}
.slw-frame.multi.lay1 .slw-scr:not(.main){display:none}
.slw-frame.multi.lay2 .slw-scr.side2{display:none}
.slw-scr iframe,.slw-scr video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.slw-scr .tag{position:absolute;top:8px;left:8px;z-index:3;display:flex;align-items:center;gap:6px;font:700 9px/1 Archivo,sans-serif;letter-spacing:.12em;color:#c7d6e3;background:rgba(6,10,16,.85);border:1px solid #1c2833;border-radius:6px;padding:5px 8px;pointer-events:none}
.slw-scr.main .tag{color:#fff}
.slw-scr.main .tag i{width:5px;height:5px;border-radius:50%;background:#ff2e66;display:block;animation:slwPulseDot 1.2s ease-in-out infinite}
.slw-scr .aud{position:absolute;bottom:8px;right:8px;z-index:3;font:600 8px/1 'IBM Plex Mono',monospace;color:#8fa3b5;background:rgba(6,10,16,.85);border:1px solid #1c2833;border-radius:6px;padding:4px 7px;pointer-events:none}
.slw-scr.main .aud{color:#00ff88}
.slw-scr .promote{position:absolute;inset:0;z-index:4;cursor:pointer;background:transparent;border:0;padding:0}
.slw-scr .promote:hover{background:rgba(0,255,136,.06);box-shadow:inset 0 0 0 1px rgba(0,255,136,.45)}
.slw-scr .promote span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font:700 9px/1 Archivo,sans-serif;letter-spacing:.1em;color:#04060a;background:#00ff88;border-radius:20px;padding:7px 11px;opacity:0;transition:opacity .15s ease;white-space:nowrap}
.slw-scr .promote:hover span{opacity:1}
.slw-frame.multi .slw-titleblk{max-width:44%;bottom:96px}
.slw-frame.multi .slw-tom-fly,.slw-frame.multi .slw-tom-splat{left:26%;top:32%}
.slw-laybtn{font:700 9px/1 'IBM Plex Mono',monospace;color:#8fa3b5;background:#101c26;border:none;border-radius:6px;padding:9px 9px;cursor:pointer;white-space:nowrap;display:none}
.slw-laybtn.show{display:inline-block}
.slw-laybtn:hover{color:#e6edf3;background:#16232f}
@media (max-width:768px){
  .slw-frame.multi{padding-bottom:0;height:auto}
  .slw-frame.multi .slw-media{position:relative;grid-template-columns:1fr 1fr !important;grid-template-rows:auto auto !important}
  .slw-frame.multi .slw-scr{aspect-ratio:16/9}
  .slw-frame.multi .slw-scr.main{grid-column:1 / span 2;grid-row:1}
  .slw-frame.multi .slw-scr .promote span{opacity:1;font-size:8px;padding:6px 9px}
  .slw-frame.multi .slw-titleblk,.slw-frame.multi .slw-topchips{position:static;max-width:none;padding:10px 12px 0}
  .slw-frame.multi .slw-ctl{position:relative;padding-top:10px}
}

/* ---- info row: quote card + about ---- */
.slw-inforow{display:flex;align-items:stretch;gap:16px;flex-wrap:wrap}
.slw-qcard{--slw-qaccent:#61e33d;flex:1 1 360px;max-width:440px;height:230px;display:flex;flex-direction:column;position:relative;border:1px solid color-mix(in srgb,var(--slw-qaccent) 60%,#123044);border-radius:14px;background:radial-gradient(circle at 12% 15%,color-mix(in srgb,var(--slw-qaccent) 14%,transparent),transparent 44%),linear-gradient(145deg,#07150f,#04080d 57%,#071018);overflow:hidden;box-shadow:inset 0 0 34px color-mix(in srgb,var(--slw-qaccent) 6%,transparent),0 18px 44px -26px color-mix(in srgb,var(--slw-qaccent) 65%,transparent)}
.slw-qcard.down{--slw-qaccent:#ff3f45}
.slw-qcard:before,.slw-qcard:after{content:"";position:absolute;z-index:2;pointer-events:none;width:28px;height:28px;border-color:var(--slw-qaccent);opacity:.72}
.slw-qcard:before{left:7px;top:7px;border-left:1px solid;border-top:1px solid;border-radius:7px 0 0}
.slw-qcard:after{right:7px;bottom:7px;border-right:1px solid;border-bottom:1px solid;border-radius:0 0 7px}
.slw-qcard-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 13px;border-bottom:1px solid color-mix(in srgb,var(--slw-qaccent) 18%,#12242e)}
.slw-qcard-h .sy{display:flex;align-items:center;gap:10px;min-width:0}
.slw-qlogo{width:38px;height:38px;flex:none;border:1px solid color-mix(in srgb,var(--slw-qaccent) 55%,#34414c);border-radius:9px;background:#f7fafc;display:grid;place-items:center;overflow:hidden;box-shadow:0 0 13px color-mix(in srgb,var(--slw-qaccent) 24%,transparent)}
.slw-qlogo img{width:30px;height:30px;object-fit:contain}
.slw-qlogo span{font:900 12px/1 'IBM Plex Mono',monospace;color:#071018}
.slw-qidentity{display:flex;flex-direction:column;gap:4px;min-width:0}
.slw-qcard-h .sym{font:900 15px/1 'IBM Plex Mono',monospace;color:#fff;text-shadow:0 0 12px color-mix(in srgb,var(--slw-qaccent) 24%,transparent);cursor:default}
.slw-qcard-h .nm{font:500 9px/1.2 Archivo,sans-serif;color:#8294a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slw-vsync{display:flex;align-items:center;gap:6px;flex:none}
.slw-vsync .bars{display:flex;align-items:flex-end;gap:2px;height:12px}
.slw-vsync .bars i{width:2px;background:#00ccff;transform-origin:bottom;animation:slwBar 1s ease-in-out infinite;display:block}
.slw-vsync .bars i:nth-child(1){height:6px}
.slw-vsync .bars i:nth-child(2){height:11px;animation-delay:.18s}
.slw-vsync .bars i:nth-child(3){height:8px;animation-delay:.36s}
.slw-vsync span{font:600 7px/1 Archivo,sans-serif;letter-spacing:.12em;color:#00ccff}
.slw-qcard-b{flex:1;display:flex;flex-direction:column;gap:7px;padding:10px 13px 7px;min-height:0}
.slw-qcard-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.slw-qcard-px{display:flex;align-items:baseline;gap:7px}
.slw-qcard-px .p{font:600 22px/1 'IBM Plex Mono',monospace;color:#fff;letter-spacing:-.02em}
.slw-qcard-px .c{font:800 11px/1 'IBM Plex Mono',monospace;color:#61e33d}
.slw-qcard-px .c.dn{color:#ff4757}
.slw-qcard-grid{display:grid;grid-template-columns:auto auto auto auto;gap:4px 12px;flex:none}
.slw-qcard-grid .k{font:500 7px/1 Archivo,sans-serif;letter-spacing:.1em;color:#4c6b7d}
.slw-qcard-grid .v{font:500 9px/1 'IBM Plex Mono',monospace;color:#c7d6e3}
.slw-qcard-grid .v.hi{color:#61e33d}
.slw-qcard-grid .v.lo{color:#ff7a45}
.slw-qcard-x{display:flex;align-items:center;justify-content:space-between}
.slw-qcard-x span{font:600 7px/1 'IBM Plex Mono',monospace;color:#536879;letter-spacing:.06em}
.slw-qcard-f{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 13px;border-top:1px solid color-mix(in srgb,var(--slw-qaccent) 17%,#12242e);background:color-mix(in srgb,var(--slw-qaccent) 4%,transparent)}
.slw-qcard-f .heard{font:400 9px/1.2 'IBM Plex Mono',monospace;color:#4c6b7d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slw-qcard-f .dots{display:flex;align-items:center;gap:5px;flex:none}
.slw-qcard-f .dots button{width:8px;height:8px;padding:0;border-radius:50%;cursor:pointer;border:none;background:#1c2833;transition:background .2s ease}
.slw-qcard-f .dots button.on{background:#00ccff;box-shadow:0 0 7px rgba(0,204,255,.8)}
.slw-qcard-f .mode{font:700 7px/1 Archivo,sans-serif;letter-spacing:.1em;color:#4c6b7d;border:1px solid #1c2833;border-radius:3px;padding:3px 4px}

.slw-aboutwrap{flex:1.3 1 400px;height:230px;position:relative;perspective:1200px}
.slw-aboutflip{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.3,.7,.3,1)}
.slw-about{position:absolute;inset:0;backface-visibility:hidden;border:1px solid #16202b;border-radius:12px;background:#080c12;padding:12px 14px;display:flex;flex-direction:column;gap:8px;overflow:hidden}
.slw-about.back{transform:rotateY(180deg);border-color:#1c2028;background:#0a0c10;padding:13px 14px}
.slw-about-h{display:flex;align-items:center;gap:11px}
.slw-avatar{position:relative;width:42px;height:42px;flex:none;border-radius:50%;overflow:hidden;border:1px solid #134a33;background:#0d1a15;display:flex;align-items:center;justify-content:center;font:700 13px/1 'IBM Plex Mono',monospace;color:#00ff88}
.slw-about-id{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.slw-about-id .nm{font:700 14px/1 Archivo,sans-serif;color:#e6edf3}
.slw-about-id .nm small{font:400 10px/1 Archivo,sans-serif;color:#5d7085}
.slw-about-id .fo{font:400 10px/1 Archivo,sans-serif;color:#5d7085}
.slw-sub{font:700 10px/1 Archivo,sans-serif;color:#04060a;background:#00ff88;border:none;padding:9px 14px;border-radius:20px;cursor:pointer}
.slw-sub:hover{background:#7affc0}
.slw-sub.notify{color:#c7d6e3;background:#101821;border:1px solid #1c2833;padding:10px 14px}
.slw-sub.notify.on{color:#04060a;background:#00ff88;border:none}
.slw-about-desc{font:400 11px/1.5 Archivo,sans-serif;color:#8fa3b5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-wrap:pretty}
.slw-about-desc a{color:#00ccff;font-weight:600}
.slw-about-desc a:hover{text-decoration:underline;color:#7fe3ff}
.slw-affrow{display:flex;align-items:center;gap:7px}
.slw-affrow .lbl{font:700 7px/1 Archivo,sans-serif;letter-spacing:.14em;color:#8a7a52;flex:none}
.slw-aff{font:600 9px/1 'IBM Plex Mono',monospace;color:#c7a86a;text-decoration:none;border:1px solid #3a2c12;border-radius:20px;padding:7px 10px;background:#150f05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46%}
#sml-lw-root a.slw-aff{color:#c7a86a}
.slw-aff.flash{animation:slwAffFlash 1s ease-in-out infinite;color:#ffb454 !important}
.slw-about-f{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto}
.slw-about-f .cap{font:600 7px/1 Archivo,sans-serif;letter-spacing:.16em;color:#3d4c5a}
.slw-about-f .ctl{display:flex;align-items:center;gap:5px}
.slw-more{font:600 9px/1 Archivo,sans-serif;color:#00ff88;background:none;border:1px solid #134a33;padding:7px 11px;border-radius:6px;cursor:pointer}
.slw-more:hover{background:#0d1a15}
.slw-flipbtn{width:24px;height:24px;border-radius:50%;border:1px solid #1c2833;background:#0b1119;color:#8fa3b5;font:600 10px/1 Archivo,sans-serif;cursor:pointer}
.slw-flipbtn:hover{color:#e6edf3}
.slw-about-f .hint{font:400 8px/1 Archivo,sans-serif;color:#3d4c5a}
.slw-disc-h{display:flex;align-items:center;justify-content:space-between}
.slw-disc-h b{font:700 10px/1 Archivo,sans-serif;letter-spacing:.14em;color:#7d8794}
.slw-disc-h span{font:400 8px/1 'IBM Plex Mono',monospace;color:#3d4c5a}
.slw-disc-t{font:400 10px/1.55 Archivo,sans-serif;color:#6b7581;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;text-wrap:pretty}

/* about modal */
.slw-modal{position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;background:rgba(2,4,7,.9);padding:40px}
.slw-modal-c{width:560px;max-width:92vw;border:1px solid #16202b;border-radius:16px;background:#080c12;padding:26px;display:flex;flex-direction:column;gap:14px}
.slw-modal-h{display:flex;align-items:center;justify-content:space-between}
.slw-modal-h b{font:800 15px/1 Archivo,sans-serif;color:#e6edf3}
.slw-x{font:600 10px/1 Archivo,sans-serif;color:#8fa3b5;background:#101821;border:1px solid #1c2833;padding:9px 12px;border-radius:6px;cursor:pointer}
.slw-x:hover{color:#e6edf3}
.slw-modal-t{font:400 12px/1.7 Archivo,sans-serif;color:#a9bccd;text-wrap:pretty}
.slw-tagrow{display:flex;flex-wrap:wrap;gap:6px}
.slw-tag{font:600 10px/1 'IBM Plex Mono',monospace;color:#00ccff !important;text-decoration:none;border:1px solid #1b3a4d;border-radius:20px;padding:8px 12px;background:rgba(0,204,255,.05)}
.slw-tag:hover{background:rgba(0,204,255,.14)}
.slw-modal .fn{font:400 9px/1.4 Archivo,sans-serif;color:#3d4c5a}
.slw-modal .disc{border-top:1px solid #131c26;padding-top:12px;display:flex;flex-direction:column;gap:7px}
.slw-modal .disc b{font:700 10px/1 Archivo,sans-serif;letter-spacing:.14em;color:#7d8794}
.slw-modal .disc span{font:400 11px/1.65 Archivo,sans-serif;color:#6b7581;text-wrap:pretty}

/* ---- orbit ---- */
.slw-orbit-sec .oh{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 4px 4px}
.slw-orbit-sec .oh .l{font:400 11px/1 Archivo,sans-serif;color:#5d7085}
.slw-orbit-sec .oh .r{font:400 10px/1 'IBM Plex Mono',monospace;color:#4c5d6d}
.slw-orbit{position:relative;height:560px;overflow:hidden;outline:none;background:transparent}
.slw-orbit:focus{box-shadow:inset 0 0 0 2px #134a33;border-radius:14px}
.slw-neb1{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 62% 78% at 50% 46%,rgba(20,16,58,.85),rgba(8,20,34,.5) 55%,transparent 76%)}
.slw-neb2{position:absolute;inset:-8%;pointer-events:none;background:radial-gradient(ellipse 30% 34% at 38% 38%,rgba(103,58,255,.32),transparent 70%),radial-gradient(ellipse 26% 30% at 64% 56%,rgba(0,204,255,.2),transparent 70%),radial-gradient(ellipse 20% 22% at 52% 30%,rgba(255,46,136,.13),transparent 70%);filter:blur(26px);animation:slwNebDrift 16s ease-in-out infinite}
.slw-stars1{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(1.5px 1.5px at 12% 24%,rgba(255,255,255,.9),transparent),radial-gradient(1px 1px at 28% 68%,rgba(255,255,255,.7),transparent),radial-gradient(1.5px 1.5px at 41% 15%,rgba(190,220,255,.9),transparent),radial-gradient(1px 1px at 56% 74%,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 67% 28%,rgba(255,255,255,.95),transparent),radial-gradient(1px 1px at 78% 60%,rgba(190,220,255,.7),transparent),radial-gradient(1.5px 1.5px at 88% 20%,rgba(255,255,255,.85),transparent),radial-gradient(1px 1px at 8% 52%,rgba(255,255,255,.65),transparent),radial-gradient(1px 1px at 93% 78%,rgba(255,255,255,.6),transparent);animation:slwTwinkle 4.2s ease-in-out infinite}
.slw-stars2{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(1px 1px at 18% 82%,rgba(255,255,255,.7),transparent),radial-gradient(1.5px 1.5px at 34% 38%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 49% 55%,rgba(190,220,255,.7),transparent),radial-gradient(1px 1px at 62% 12%,rgba(255,255,255,.7),transparent),radial-gradient(1.5px 1.5px at 74% 44%,rgba(255,255,255,.75),transparent),radial-gradient(1px 1px at 84% 88%,rgba(190,220,255,.65),transparent),radial-gradient(1px 1px at 22% 10%,rgba(255,255,255,.6),transparent);animation:slwTwinkle 5.6s ease-in-out 1.6s infinite}
.slw-floor{position:absolute;left:50%;bottom:60px;width:680px;height:64px;transform:translateX(-50%);pointer-events:none;background:radial-gradient(ellipse at center,rgba(0,204,255,.16),transparent 68%);filter:blur(8px)}
.slw-astroA{position:absolute;top:0;left:0;width:34px;height:28px;pointer-events:none;opacity:.9;background:radial-gradient(circle at 30% 28%,#7c8794,#454d56 52%,#262b31);border-radius:62% 38% 55% 45%/45% 58% 42% 55%;box-shadow:inset -6px -6px 12px rgba(0,0,0,.75),inset 3px 3px 6px rgba(255,255,255,.16),0 4px 14px rgba(0,0,0,.6);animation:slwAstroA 22s linear infinite}
.slw-astroB{position:absolute;top:0;left:0;width:26px;height:22px;pointer-events:none;opacity:.55;filter:blur(1.2px);background:radial-gradient(circle at 32% 30%,#5d6874,#343b43 55%,#1e2329);border-radius:58% 42% 61% 39%/47% 55% 45% 53%;box-shadow:inset -4px -4px 8px rgba(0,0,0,.7),inset 2px 2px 4px rgba(255,255,255,.12);animation:slwAstroB 34s linear infinite}
.slw-astroC{position:absolute;top:0;left:0;width:14px;height:12px;pointer-events:none;opacity:.4;filter:blur(1.6px);background:radial-gradient(circle at 30% 30%,#4c5560,#2a3038 60%,#191d22);border-radius:44% 56% 52% 48%/58% 40% 60% 42%;box-shadow:inset -3px -3px 6px rgba(0,0,0,.7);animation:slwAstroC 46s linear infinite}
.slw-ring-persp{position:absolute;inset:0;perspective:1650px}
.slw-ring{position:absolute;left:50%;top:45%;width:0;height:0;transform-style:preserve-3d}
.slw-ocard{position:absolute;width:304px;height:304px;left:-152px;top:-152px;border-radius:14px;cursor:pointer;overflow:hidden}
/* boxless media cards: the 304px square only anchors the 3D ring math — the image
   itself floats free at natural aspect, whole image always visible, may overlap */
.slw-ocard.img{overflow:visible;border-radius:0;background:transparent}
.slw-ocard.img .oimg{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:170%;max-height:110%;width:auto;height:auto;display:block;border-radius:10px;filter:drop-shadow(0 26px 44px rgba(0,0,0,.8))}
.slw-ocard.img.active .oimg{filter:drop-shadow(0 26px 44px rgba(0,0,0,.8)) drop-shadow(0 0 22px rgba(0,255,136,.35))}
.slw-ocard.img .ocap{position:absolute;left:50%;bottom:-40px;transform:translateX(-50%);white-space:nowrap;max-width:340px;overflow:hidden;text-overflow:ellipsis;display:none;background:rgba(6,10,16,.92);border:1px solid #1c2833;border-radius:16px;padding:8px 13px;font:600 10px/1 Archivo,sans-serif;color:#c7d6e3}
.slw-ocard.img.active .ocap{display:block}
/* orbit manager (admin) */
.slw-orbmgr-row{display:flex;align-items:center;gap:9px;border:1px solid #16202b;border-radius:9px;background:#0b1119;padding:8px 10px}
.slw-orbmgr-row .th{width:64px;height:40px;flex:none;border-radius:6px;background:#101821 center/contain no-repeat;border:1px solid #1c2833}
.slw-orbmgr-row input{flex:1;min-width:0;border:1px solid #1c2833;border-radius:6px;padding:8px 10px;background:#0a0f16;color:#e6edf3;font:400 11px/1 Archivo,sans-serif;outline:none}
.slw-orbmgr-row .rm{font:600 11px/1 Archivo,sans-serif;color:#ff859f;background:#1a0810;border:1px solid #3d1524;border-radius:6px;padding:8px 10px;cursor:pointer;flex:none}
.slw-orbmgr-note{font:400 10px/1.5 Archivo,sans-serif;color:#5d7085}
.slw-ocard .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#101a28,#0a1018 60%,#0d1420);border:1px dashed #1c2833;border-radius:14px}
.slw-ocard .ph span{font:600 11px/1.4 Archivo,sans-serif;color:#3d4c5a;text-align:center;padding:0 20px}
.slw-ocard .cap{position:absolute;left:0;right:0;bottom:0;display:none;flex-direction:column;gap:4px;padding:26px 13px 12px;background:linear-gradient(180deg,transparent,rgba(3,5,9,.9))}
.slw-ocard.active .cap{display:flex}
.slw-ocard .cap b{font:700 12px/1.3 Archivo,sans-serif;color:#fff}
.slw-ocard .cap span{font:400 10px/1.4 Archivo,sans-serif;color:#c7d6e3}
.slw-orbit-ctl{position:absolute;left:0;right:0;bottom:14px;display:flex;align-items:center;justify-content:center;gap:9px}
.slw-orb-nav{width:44px;height:44px;border-radius:50%;border:1px solid #1c2833;background:rgba(6,10,16,.9);color:#e6edf3;font:600 15px/1 Archivo,sans-serif;cursor:pointer}
.slw-orb-nav:hover{border-color:#134a33;color:#00ff88}
.slw-orb-pause{height:44px;padding:0 16px;border-radius:22px;border:1px solid #1c2833;background:rgba(6,10,16,.9);color:#e6edf3;font:600 11px/1 Archivo,sans-serif;cursor:pointer}
.slw-orb-pause:hover{color:#00ff88}
.slw-orb-pause.paused{border-color:#134a33;background:#0d1a15;color:#00ff88}
.slw-orb-count{margin-left:6px;font:600 11px/1 'IBM Plex Mono',monospace;color:#8fa3b5;border:1px solid #1c2833;border-radius:20px;padding:13px 12px;background:rgba(6,10,16,.9)}
.slw-orbit-cap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 4px 0}
.slw-orbit-cap .l{display:flex;flex-direction:column;gap:6px;min-width:0}
.slw-orbit-cap .l b{font:700 13px/1.3 Archivo,sans-serif;color:#e6edf3}
.slw-orbit-cap .l span{font:400 11px/1.5 Archivo,sans-serif;color:#8fa3b5}
.slw-orbit-cap .r{display:flex;align-items:center;gap:9px;flex:none}
.slw-btn2{font:600 11px/1 Archivo,sans-serif;color:#c7d6e3;background:#101821;border:1px solid #1c2833;padding:12px 15px;border-radius:8px;cursor:pointer}
.slw-btn2:hover{background:#16202b}
.slw-openlink{font:600 11px/1 Archivo,sans-serif;color:#00ff88 !important;border:1px solid #134a33;border-radius:8px;padding:12px 15px}

/* lightbox */
.slw-lb{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:rgba(2,4,7,.94);padding:40px}
.slw-lb-row{display:flex;align-items:center;gap:18px}
.slw-lb-nav{width:52px;height:52px;border-radius:50%;border:1px solid #1c2833;background:#0b1119;color:#e6edf3;font:600 17px/1 Archivo,sans-serif;cursor:pointer}
.slw-lb-nav:hover{color:#00ff88}
.slw-lb-img{position:relative;width:640px;max-width:70vw;height:420px;border-radius:16px;overflow:hidden;border:1px solid #1c2833;background:#0a0f16;display:flex;align-items:center;justify-content:center}
.slw-lb-img span{font:600 12px/1 Archivo,sans-serif;color:#3d4c5a}
.slw-lb-cap{display:flex;flex-direction:column;align-items:center;gap:8px}
.slw-lb-cap b{font:700 14px/1 Archivo,sans-serif;color:#fff}
.slw-lb-cap span{font:400 11px/1 Archivo,sans-serif;color:#8fa3b5}
.slw-lb-btns{display:flex;align-items:center;gap:9px}
.slw-lb-open{font:600 11px/1 Archivo,sans-serif;color:#04060a !important;background:#00ff88;border-radius:8px;padding:12px 16px}

/* ---- rail panel + tabs ---- */
.slw-panel{display:flex;flex-direction:column;border:1px solid #16202b;border-radius:14px;background:#080c12;overflow:hidden}
.slw-tabs{display:flex;gap:4px;padding:12px;border-bottom:1px solid #131c26}
.slw-tab{flex:1;font:600 11px/1 Archivo,sans-serif;color:#8fa3b5;background:#0d141c;border:none;padding:11px 0;border-radius:8px;cursor:pointer;white-space:nowrap}
.slw-tab:hover{color:#e6edf3}
.slw-tab.on{font-weight:700;color:#04060a;background:#00ff88}
.slw-tab.on.boost{background:#ffb454}

/* host-cam strip */
.slw-cam{position:relative;border-bottom:1px solid #131c26;background:#070b10;display:none}
.slw-cam.show{display:block}
.slw-cam .fr{position:relative;padding-bottom:46%}
.slw-cam .ph{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 40%,#101a28,#070b10 75%);display:flex;align-items:center;justify-content:center}
.slw-cam .ph span{font:500 10px/1 Archivo,sans-serif;color:#2d3a47}
.slw-cam .chip{position:absolute;bottom:34px;left:10px;display:flex;align-items:center;gap:6px;background:rgba(4,6,10,.8);border:1px solid #1c2833;border-radius:5px;padding:6px 8px;pointer-events:none}
.slw-cam .chip .d{width:5px;height:5px;border-radius:50%;background:#ff2e66;animation:slwPulseDot 1.2s ease-in-out infinite}
.slw-cam .chip b{font:700 8px/1 Archivo,sans-serif;letter-spacing:.12em;color:#fff}
.slw-cam .who{position:absolute;bottom:34px;right:10px;pointer-events:none}
.slw-cam .who span{font:400 8px/1 Archivo,sans-serif;color:#8fa3b5;background:rgba(4,6,10,.8);border:1px solid #1c2833;border-radius:5px;padding:6px 8px;white-space:nowrap;display:inline-block}
.slw-cam .fade{position:absolute;left:0;right:0;bottom:0;height:64px;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(4,6,10,.82))}
.slw-cam .ghost-tabs{position:absolute;left:0;right:0;top:0;display:flex;gap:4px;padding:10px 12px;opacity:.3;transition:opacity .25s ease;background:linear-gradient(180deg,rgba(4,6,10,.7),transparent)}
.slw-cam .ghost-tabs:hover{opacity:1}

/* incoming call banner */
.slw-call{position:relative;border-bottom:1px solid #3d1524;background:linear-gradient(120deg,#1a0810,#12081d 60%,#07161d);overflow:hidden;animation:slwLiveRing 2.2s ease-out infinite;display:none}
.slw-call.show{display:block}
.slw-call .gl{position:absolute;inset:0;background:radial-gradient(ellipse at 20% 50%,rgba(255,46,102,.18),transparent 60%);pointer-events:none}
.slw-call .row{position:relative;display:flex;align-items:center;gap:11px;padding:13px 14px}
.slw-call .av{width:44px;height:44px;flex:none;border-radius:50%;border:2px solid #ff2e66;background:#101821;display:flex;align-items:center;justify-content:center;font:700 13px/1 'IBM Plex Mono',monospace;color:#ff859f;box-shadow:0 0 14px rgba(255,46,102,.6)}
.slw-call .tx{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.slw-call .k{font:800 10px/1 Archivo,sans-serif;letter-spacing:.14em;color:#ff859f}
.slw-call .nm{font:700 12px/1 Archivo,sans-serif;color:#fff}
.slw-call .st{font:500 10px/1 'IBM Plex Mono',monospace;color:#8fa3b5}
.slw-call .st .rd{color:#ff2e66}
.slw-call .btns{display:flex;flex-direction:column;gap:6px;flex:none}
.slw-accept{font:700 10px/1 Archivo,sans-serif;color:#04060a;background:#00ff88;border:none;padding:9px 13px;border-radius:7px;cursor:pointer}
.slw-accept:hover{background:#7affc0}
.slw-decline{font:600 10px/1 Archivo,sans-serif;color:#ff859f;background:#1a0810;border:1px solid #3d1524;padding:9px 13px;border-radius:7px;cursor:pointer}
.slw-decline:hover{background:#24101a}

/* outbound call banner */
.slw-dial{position:relative;border-bottom:1px solid #1b3a4d;background:linear-gradient(120deg,#07161d,#0d1226 60%,#0a0f16);overflow:hidden;display:none}
.slw-dial.show{display:block}
.slw-dial .gl{position:absolute;inset:0;background:radial-gradient(ellipse at 80% 50%,rgba(0,204,255,.14),transparent 60%);pointer-events:none}
.slw-dial .row{position:relative;display:flex;align-items:center;gap:11px;padding:13px 14px}
.slw-dial .avw{position:relative;width:44px;height:44px;flex:none}
.slw-dial .ring{position:absolute;inset:0;border-radius:50%;border:2px solid #00ccff;animation:slwLiveRing 1.6s ease-out infinite}
.slw-dial .av{width:44px;height:44px;border-radius:50%;border:2px solid #00ccff;background:#101821;display:flex;align-items:center;justify-content:center;font:700 13px/1 'IBM Plex Mono',monospace;color:#7fe3ff}
.slw-dial .tx{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.slw-dial .k{font:800 10px/1 Archivo,sans-serif;letter-spacing:.14em;color:#7fe3ff}
.slw-dial .k i{animation:slwBlink 1.2s ease-in-out infinite;font-style:normal}
.slw-dial .nm{font:700 12px/1 Archivo,sans-serif;color:#fff}
.slw-dial .st{font:500 10px/1 'IBM Plex Mono',monospace;color:#8fa3b5}
.slw-dial .st .rd{color:#ff2e66}
.slw-dial .note{position:relative;padding:0 14px 10px}
.slw-dial .note span{font:400 9px/1.3 Archivo,sans-serif;color:#4c6b7d}

/* speak-request row */
.slw-wait{display:none;align-items:center;gap:9px;padding:10px 14px;border-bottom:1px solid #131c26;background:#0b1119}
.slw-wait.show{display:flex}
.slw-wait .av{width:26px;height:26px;flex:none;border-radius:50%;border:1px solid #3a2c12;background:#101821;display:flex;align-items:center;justify-content:center;font:600 9px/1 'IBM Plex Mono',monospace;color:#ffb454}
.slw-wait .tx{font:400 10px/1.4 Archivo,sans-serif;color:#8fa3b5;min-width:0;flex:1}
.slw-wait .tx b{color:#ffb454;font-weight:700}
.slw-wait .d{width:6px;height:6px;flex:none;border-radius:50%;background:#ffb454;animation:slwPulseDot 1.4s ease-in-out infinite}

/* chat */
.slw-pinned{display:flex;align-items:center;gap:9px;padding:8px 10px 8px 16px;border-bottom:1px solid #131c26;background:#0b1119}
.slw-pinned b{font:700 9px/1 Archivo,sans-serif;letter-spacing:.14em;color:#ffb454}
.slw-pinned span{font:400 11px/1.4 Archivo,sans-serif;color:#8fa3b5;flex:1;min-width:0}
.slw-sent{display:flex;align-items:center;gap:9px;padding:10px 16px;border-bottom:1px solid #131c26}
.slw-sent b{font:600 8px/1 Archivo,sans-serif;letter-spacing:.14em;color:#5d7085;flex:none}
.slw-sent .bar{flex:1;height:6px;border-radius:3px;background:#1a2530;overflow:hidden}
.slw-sent .bar i{display:block;height:100%;width:68%;background:linear-gradient(90deg,#0a5c3c,#00ff88)}
.slw-sent .pct{font:700 10px/1 'IBM Plex Mono',monospace;color:#00e07a;flex:none}
.slw-topthreads{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border-bottom:1px solid #131c26;background:#0a0e14}
.slw-topthreads .hd{display:flex;align-items:center;gap:7px}
.slw-topthreads .hd b{font:700 8px/1 Archivo,sans-serif;letter-spacing:.14em;color:#ff7a45}
.slw-topthreads .hd span{font:400 9px/1 Archivo,sans-serif;color:#4c5d6d}
.slw-tt{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:8px;background:#0b1119;border:1px solid #16202b;cursor:pointer}
.slw-tt.first{background:#170d06;border-color:#3a2c12}
.slw-tt .rk{font:800 10px/1 'IBM Plex Mono',monospace;color:#8fa3b5;flex:none}
.slw-tt.first .rk{color:#ff7a45}
.slw-tt .tx{font:600 10px/1 Archivo,sans-serif;color:#c7d6e3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.slw-tt .tx b{font:700 10px/1 Archivo,sans-serif;color:#00ccff}
.slw-tt.first .tx b{color:#ff7a45}
.slw-tt .ct{font:600 9px/1 'IBM Plex Mono',monospace;color:#ff7a45;flex:none}
.slw-feed{position:relative;height:330px;overflow:hidden}
.slw-feed-inner{position:relative;display:flex;flex-direction:column;height:100%;justify-content:flex-end;pointer-events:none}
.slw-msg{display:flex;gap:11px;padding:9px 16px;animation:slwMsgIn .45s ease both;pointer-events:auto;position:relative;z-index:2;transition:transform .18s ease,background .18s ease,box-shadow .18s ease;transform-origin:center left;cursor:default}
.slw-msg:hover{transform:perspective(620px) translateZ(30px) scale(1.035);background:#101c26;box-shadow:0 16px 38px -10px rgba(0,0,0,.9),0 0 0 1px #1f3a4a;border-radius:10px}
.slw-msg .av{width:28px;height:28px;flex:none;border-radius:50%;background:#101821;border:1px solid #1c2833;display:flex;align-items:center;justify-content:center;font:600 10px/1 'IBM Plex Mono',monospace}
.slw-msg .bd{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.slw-msg .hd{display:flex;align-items:baseline;gap:7px}
.slw-msg .hn{font:600 11px/1 Archivo,sans-serif;cursor:pointer;border-bottom:1px dotted transparent}
.slw-msg .at{font:400 9px/1 'IBM Plex Mono',monospace;color:#3d4c5a}
.slw-msg .rp{margin-left:auto;pointer-events:auto;font:600 9px/1 Archivo,sans-serif;color:#5d7085;background:none;border:none;cursor:pointer;padding:2px 4px}
.slw-msg .rm{pointer-events:auto;font:700 10px/1 Archivo,sans-serif;color:#5d7085;background:none;border:1px solid transparent;border-radius:6px;cursor:pointer;padding:1px 5px;opacity:0;transition:opacity .15s,color .15s}
.slw-msg:hover .rm,.slw-msg .rm:focus{opacity:1}
.slw-msg .rm:hover{color:#ff5c7a;border-color:rgba(255,92,122,.4)}
.slw-real .slw-msg .rm{display:inline-block}
.slw-msg .rp:hover{color:#00ff88}
.slw-msg .tx{font:400 12px/1.5 Archivo,sans-serif;color:#a9bccd;text-wrap:pretty}
.slw-msg .open-th{pointer-events:auto;align-self:flex-start;font:600 10px/1 Archivo,sans-serif;color:#00ccff;background:none;border:none;cursor:pointer;padding:2px 0}
.slw-msg .open-th:hover{color:#7fe3ff}
.slw-msg.sys{background:linear-gradient(90deg,rgba(255,180,84,.06),transparent 70%);border-left:2px solid #3a2c12}
.slw-msg.sys .av{border-radius:8px;background:#241c08;border:1px solid #3a2c12;font:600 13px/1 Archivo,sans-serif;color:#ffb454}
.slw-msg.sys .hn{font:700 9px/1 Archivo,sans-serif;letter-spacing:.12em;color:#ffb454;cursor:default}
.slw-composer{display:flex;align-items:center;gap:9px;padding:12px 14px;border-top:1px solid #131c26}
.slw-composer .cin, .slw-q-comp .cin{flex:1;border:1px solid #1c2833;border-radius:20px;padding:10px 14px;background:#0b1119;color:#e6edf3;font:400 11px/1 Archivo,sans-serif;outline:none;min-width:0}
.slw-composer .cin::placeholder, .slw-q-comp .cin::placeholder{color:#3d4c5a}
.slw-composer .cin:disabled{opacity:.5}
.slw-send:disabled{opacity:.5;cursor:default}
.slw-gaterow{font:400 10px/1.5 Archivo,sans-serif;color:#8a7a52;padding:9px 16px;border-top:1px solid #131c26;background:#0d0b04}
.slw-gaterow a, #sml-lw-root .slw-gaterow a{color:#ffb454 !important;font-weight:600}
.slw-chat-empty{font:400 11px/1.6 Archivo,sans-serif;color:#3d4c5a;padding:18px 16px;text-align:center}
/* Keep production Reply controls hidden until the persistent thread API has
   answered successfully. This avoids advertising a control before its server
   feature is installed and ready. */
.slw-real:not(.slw-threads-ready) .slw-msg .rp, .slw-real:not(.slw-threads-ready) .slw-msg .open-th{display:none}
.slw-send{font:700 10px/1 Archivo,sans-serif;color:#04060a;background:#00ff88;border:none;padding:11px 14px;border-radius:20px;cursor:pointer}
.slw-send:hover{background:#7affc0}
/* thread view */
.slw-thread{display:none;flex-direction:column;height:520px}
.slw-thread.show{display:flex}
.slw-thread-h{display:flex;align-items:center;gap:9px;padding:10px 14px;border-bottom:1px solid #131c26;background:#0b1119}
.slw-back{font:600 10px/1 Archivo,sans-serif;color:#8fa3b5;background:#101821;border:1px solid #1c2833;padding:8px 11px;border-radius:6px;cursor:pointer}
.slw-back:hover{color:#e6edf3}
.slw-thread-h b{font:700 9px/1 Archivo,sans-serif;letter-spacing:.14em;color:#00ccff}
.slw-thread-h span{font:500 10px/1 'IBM Plex Mono',monospace;color:#5d7085}
.slw-thread-root{display:flex;gap:11px;padding:13px 14px;border-bottom:1px solid #131c26;background:#0a0e14}
.slw-thread-root .av{width:28px;height:28px;flex:none;border-radius:50%;background:#101821;border:1px solid #1c2833;display:flex;align-items:center;justify-content:center;font:600 10px/1 'IBM Plex Mono',monospace}
.slw-thread-root .bd{display:flex;flex-direction:column;gap:4px;min-width:0}
.slw-thread-root .hn{font:700 12px/1 Archivo,sans-serif;cursor:pointer}
.slw-thread-root .at{font:400 9px/1 'IBM Plex Mono',monospace;color:#3d4c5a}
.slw-thread-root .tx{font:400 13px/1.5 Archivo,sans-serif;color:#e6edf3;text-wrap:pretty}
.slw-thread-list{flex:1;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}
.slw-reply{display:flex;gap:9px;padding:9px 14px 9px 30px;animation:slwMsgIn .4s ease both}
.slw-reply .av{width:24px;height:24px;flex:none;border-radius:50%;background:#101821;border:1px solid #1c2833;display:flex;align-items:center;justify-content:center;font:600 9px/1 'IBM Plex Mono',monospace}
.slw-reply .bd{display:flex;flex-direction:column;gap:3px;min-width:0}
.slw-reply .hn{font:600 10px/1 Archivo,sans-serif;cursor:pointer}
.slw-reply .at{font:400 9px/1 'IBM Plex Mono',monospace;color:#3d4c5a}
.slw-reply .tx{font:400 12px/1.5 Archivo,sans-serif;color:#a9bccd;text-wrap:pretty}
.slw-thread-comp{display:flex;align-items:center;gap:9px;padding:12px 14px;border-top:1px solid #131c26}
.slw-thread-comp input{flex:1;border:1px solid #1c2833;border-radius:20px;padding:10px 14px;background:#0b1119;color:#e6edf3;font:400 11px/1 Archivo,sans-serif;outline:none}
.slw-reply-send{font:700 10px/1 Archivo,sans-serif;color:#04060a;background:#00ccff;border:none;padding:11px 14px;border-radius:20px;cursor:pointer}
.slw-reply-send:hover{background:#7fe3ff}

/* ---- speak tab ---- */
.slw-voice-h{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid #131c26}
.slw-voice-h .eq{width:42px;height:42px;flex:none;border-radius:50%;background:#0d1a15;border:1px solid #134a33;display:flex;align-items:center;justify-content:center;gap:3px}
.slw-voice-h .eq i{width:2px;background:#00ff88;transform-origin:center;animation:slwBar 1.1s ease-in-out infinite;display:block}
.slw-voice-h .eq i:nth-child(1){height:10px}
.slw-voice-h .eq i:nth-child(2){height:18px;animation-delay:.2s}
.slw-voice-h .eq i:nth-child(3){height:12px;animation-delay:.4s}
.slw-voice-h .tx{display:flex;flex-direction:column;gap:5px}
.slw-voice-h .tx b{font:700 13px/1 Archivo,sans-serif;color:#e6edf3}
.slw-voice-h .tx span{font:400 11px/1 Archivo,sans-serif;color:#6b7d8f}
.slw-seats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:16px 18px;border-bottom:1px solid #131c26}
.slw-seat{display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 6px;border:1px solid #16202b;border-radius:10px;background:#0b1119}
.slw-seat .rg{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:600 11px/1 'IBM Plex Mono',monospace;color:#8fa3b5;background:#0b1119;border:1px solid #1c2833}
.slw-seat .rg.live{color:#00ff88;border:2px solid #00ff88}
.slw-seat .rg.speaking{animation:slwPulseDot 2s ease-in-out infinite}
.slw-seat .nm{font:600 10px/1 Archivo,sans-serif;color:#c7d6e3}
.slw-seat .rl{font:600 8px/1 Archivo,sans-serif;letter-spacing:.1em;color:#4c5d6d}
.slw-seat .rl.host{color:#ffb454}
.slw-seat .rl.speaking{color:#00e07a}
.slw-vpass{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #131c26;background:#0b1119}
.slw-vpass b{font:700 10px/1 Archivo,sans-serif;letter-spacing:.14em;color:#ffb454}
.slw-vpass .bal{display:flex;align-items:center;gap:7px}
.slw-vpass .bal span{font:500 10px/1 Archivo,sans-serif;color:#5d7085}
.slw-vpass .bal b{font:700 12px/1 'IBM Plex Mono',monospace;color:#ffb454;letter-spacing:0}
.slw-vbody{display:flex;flex-direction:column;gap:12px;padding:16px 18px}
.slw-verr{font:500 10px/1.5 Archivo,sans-serif;color:#ff859f;border:1px solid #3d1524;background:#1a0810;border-radius:8px;padding:9px 12px}
.slw-vbody .intro{font:400 11px/1.6 Archivo,sans-serif;color:#8fa3b5;text-wrap:pretty}
.slw-tiers{display:flex;flex-direction:column;gap:8px}
.slw-tier{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;border-radius:10px;cursor:pointer;background:#0b1119;border:1px solid #16202b}
.slw-tier.on{background:#0c1a16;border-color:#134a33}
.slw-tier.locked{opacity:.5;cursor:default}
.slw-tier .l{display:flex;align-items:center;gap:11px}
.slw-tier .dot{width:12px;height:12px;border-radius:50%;flex:none;background:transparent;border:2px solid #2d3a47}
.slw-tier.on .dot{background:#00ff88;border-color:#00ff88}
.slw-tier .nm{font:700 12px/1 Archivo,sans-serif;color:#c7d6e3}
.slw-tier.on .nm{color:#fff}
.slw-tier .nt{font:400 10px/1 Archivo,sans-serif;color:#5d7085}
.slw-tier .r{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.slw-tier .pr{font:700 12px/1 'IBM Plex Mono',monospace;color:#8fa3b5}
.slw-tier.on .pr{color:#ffb454}
.slw-tier .sc{font:500 10px/1 'IBM Plex Mono',monospace;color:#8fa3b5}
.slw-vnote{border:1px solid #1c2833;border-radius:8px;padding:11px 13px;background:#0b1119}
.slw-vnote span{font:400 11px/1 Archivo,sans-serif;color:#3d4c5a}
.slw-vreq{font:700 12px/1 Archivo,sans-serif;color:#04060a;background:#00ff88;border:none;padding:14px 0;border-radius:8px;cursor:pointer}
.slw-vreq:hover{background:#7affc0}
.slw-vlisten{font:700 11px/1 Archivo,sans-serif;color:#c7d6e3;background:#101821;border:1px solid #1c2833;padding:13px 0;border-radius:8px;cursor:pointer}
.slw-vlisten:hover{background:#16202b}
.slw-vfine{font:400 10px/1.5 Archivo,sans-serif;color:#3d4c5a}
.slw-vqueue{display:none;flex-direction:column;gap:13px;padding:16px 18px}
.slw-vqueue.show{display:flex}
.slw-vqueue .t{font:700 13px/1 Archivo,sans-serif;color:#ffb454}
.slw-vqueue .card{display:flex;align-items:center;gap:12px;border:1px solid #3a2c12;border-radius:10px;background:#150f05;padding:14px}
.slw-vqueue .pos{font:800 26px/1 'IBM Plex Mono',monospace;color:#ffb454}
.slw-vqueue .card .bd{display:flex;flex-direction:column;gap:5px}
.slw-vqueue .card .bd b{font:600 12px/1 Archivo,sans-serif;color:#e6edf3}
.slw-vqueue .card .bd span{font:400 11px/1 Archivo,sans-serif;color:#8fa3b5}
.slw-mic{display:flex;align-items:center;gap:10px}
.slw-mic .l{font:500 10px/1 Archivo,sans-serif;letter-spacing:.1em;color:#5d7085}
.slw-mic .bars{display:flex;align-items:flex-end;gap:2px;height:20px;flex:1}
.slw-mic .bars i{flex:1;border-radius:1px;background:#00ff88;transition:height .4s ease;display:block;height:6px}
.slw-mic .bars i.amber{background:#ffb454}
.slw-checks{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.slw-checks .c{display:flex;align-items:center;gap:7px}
.slw-checks .c b{font:700 10px/1 Archivo,sans-serif;color:#00e07a}
.slw-checks .c span{font:400 10px/1 Archivo,sans-serif;color:#8fa3b5}
.slw-vleave{font:600 11px/1 Archivo,sans-serif;color:#c7d6e3;background:#101821;border:1px solid #1c2833;padding:12px 0;border-radius:8px;cursor:pointer}
.slw-vleave:hover{background:#16202b}

/* ---- Q&A tab ---- */
.slw-q{display:flex;gap:12px;padding:14px 16px;border-bottom:1px solid #101822}
.slw-q .vote{display:flex;flex-direction:column;align-items:center;gap:3px;flex:none;width:38px;padding:7px 0;border:1px solid #1c2833;border-radius:8px;background:#0b1119}
.slw-q .vote .a{font:700 10px/1 Archivo,sans-serif;color:#00ff88}
.slw-q .vote .n{font:700 12px/1 'IBM Plex Mono',monospace;color:#e6edf3}
.slw-q .bd{display:flex;flex-direction:column;gap:5px;min-width:0}
.slw-q .tx{font:400 12px/1.5 Archivo,sans-serif;color:#c7d6e3;text-wrap:pretty}
.slw-q .mt{display:flex;align-items:center;gap:8px}
.slw-q .who{font:400 10px/1 'IBM Plex Mono',monospace;color:#4c5d6d}
.slw-q .st{font:700 9px/1 Archivo,sans-serif;letter-spacing:.1em;color:#ffb454}
.slw-q .st.answering{color:#00e07a}
.slw-q .st.answered{color:#4c5d6d}
.slw-q-comp{display:flex;align-items:center;gap:9px;padding:12px 14px}
.slw-q-comp .in{flex:1;border:1px solid #1c2833;border-radius:20px;padding:10px 14px;background:#0b1119}
.slw-q-comp .in span{font:400 11px/1 Archivo,sans-serif;color:#3d4c5a}

/* ---- boost tab ---- */
.slw-boost-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid #1f1a0c;background:linear-gradient(180deg,#0d0b04,transparent)}
.slw-boost-h .l{display:flex;flex-direction:column;gap:5px}
.slw-boost-h .t{display:flex;align-items:center;gap:8px}
.slw-boost-h .t b{font:800 12px/1 Archivo,sans-serif;letter-spacing:.04em;color:#e6edf3}
.slw-boost-h .t .live{font:700 8px/1 Archivo,sans-serif;letter-spacing:.12em;color:#ff859f;border:1px solid #3d1524;background:#1a0810;border-radius:20px;padding:4px 7px}
.slw-boost-h .sub{font:400 10px/1.4 Archivo,sans-serif;color:#8a7a52}
.slw-boost-h .r{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.slw-boost-h .r .k{font:500 8px/1 Archivo,sans-serif;letter-spacing:.12em;color:#8a7a52}
.slw-boost-h .r .v{font:800 20px/1 'IBM Plex Mono',monospace;letter-spacing:-.01em;color:#e6edf3}
.slw-boost-h .r .v.warn{color:#ff4757}
.slw-boost-h .r .v.ended{color:#5d7085}
.slw-boost-over{display:none;align-items:center;gap:9px;padding:11px 16px;background:#0c1a16;border-bottom:1px solid #134a33}
.slw-boost-over.show{display:flex}
.slw-boost-over b{font:800 10px/1 Archivo,sans-serif;letter-spacing:.12em;color:#00ff88}
.slw-boost-over span{font:400 10px/1.4 Archivo,sans-serif;color:#8fa3b5}
.slw-boost-over span b{font-weight:700;color:#e6edf3;letter-spacing:0}
.slw-boost-share{display:flex;flex-direction:column;gap:11px;padding:14px 16px;border-bottom:1px solid #131c26}
.slw-boost-share .hd{display:flex;align-items:center;justify-content:space-between}
.slw-boost-share .hd b{font:700 10px/1 Archivo,sans-serif;letter-spacing:.12em;color:#c7d6e3}
.slw-boost-share .hd span{font:500 10px/1 'IBM Plex Mono',monospace;color:#8a7a52}
.slw-plats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.slw-plat{display:flex;flex-direction:column;align-items:flex-start;gap:7px;padding:11px 12px;border-radius:10px;cursor:pointer;text-align:left;background:#0b1119;border:1px solid #1c2833;transition:border-color .2s ease,background .2s ease}
.slw-plat.done{background:#0c1a16;border-color:#134a33;cursor:default}
.slw-plat .mk{width:24px;height:24px;border-radius:7px;display:flex;align-items:center;justify-content:center;font:700 11px/1 'IBM Plex Mono',monospace;background:#101821;border:1px solid #1c2833}
.slw-plat.done .mk{color:#04060a !important;background:#00ff88;border:none}
.slw-plat .nm{font:600 10px/1.2 Archivo,sans-serif;color:#c7d6e3}
.slw-plat.done .nm{color:#e6edf3}
.slw-plat .st{font:600 9px/1 'IBM Plex Mono',monospace;letter-spacing:.06em;color:#8a7a52}
.slw-plat.done .st{color:#00e07a}
.slw-allnine{display:flex;flex-direction:column;gap:7px}
.slw-allnine .hd{display:flex;align-items:center;justify-content:space-between}
.slw-allnine .hd span{font:600 9px/1 Archivo,sans-serif;color:#8a7a52}
.slw-allnine .hd b{font:700 10px/1 'IBM Plex Mono',monospace;color:#ffb454}
.slw-allnine .bar{height:5px;border-radius:3px;background:#1a1508;overflow:hidden}
.slw-allnine .bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#7a5410,#ffb454);transition:width .4s ease}
.slw-bstats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.slw-bstat{display:flex;flex-direction:column;gap:4px;border:1px solid #16202b;border-radius:8px;background:#0b1119;padding:9px 10px}
.slw-bstat b{font:700 13px/1 'IBM Plex Mono',monospace;color:#e6edf3}
.slw-bstat b.cy{color:#00ccff}
.slw-bstat span{font:500 8px/1 Archivo,sans-serif;letter-spacing:.08em;color:#5d7085}
.slw-bstat.gold{border-color:#3a2c12;background:#150f05}
.slw-bstat.gold b{color:#ffb454}
.slw-bstat.gold span{color:#8a7a52}
.slw-lead-h{display:flex;align-items:center;justify-content:space-between;padding:13px 16px 8px}
.slw-lead-h b{font:700 10px/1 Archivo,sans-serif;letter-spacing:.12em;color:#c7d6e3}
.slw-lead-h .upd{display:flex;align-items:center;gap:5px}
.slw-lead-h .upd i{width:5px;height:5px;border-radius:50%;background:#00ff88;animation:slwPulseDot 1.4s ease-in-out infinite;display:block}
.slw-lead-h .upd span{font:500 8px/1 'IBM Plex Mono',monospace;letter-spacing:.1em;color:#00e07a}
.slw-lead-cols{display:grid;grid-template-columns:24px 1fr 42px 58px 58px;gap:0;padding:0 16px 6px}
.slw-lead-cols span{font:600 8px/1 Archivo,sans-serif;letter-spacing:.08em;color:#4c5d6d}
.slw-lead-cols span.r{text-align:right}
.slw-brow{display:grid;grid-template-columns:24px 1fr 42px 58px 58px;align-items:center;padding:9px 16px;border-left:2px solid transparent}
.slw-brow.alt{background:#0a0e14}
.slw-brow.me{background:#0c1a16;border-left-color:#00ff88}
.slw-brow .rk{font:700 12px/1 'IBM Plex Mono',monospace;color:#4c5d6d}
.slw-brow .rk.top{color:#ffb454}
.slw-brow .rk.t3{color:#c7d6e3}
.slw-brow .nm{font:600 11px/1 Archivo,sans-serif;color:#e6edf3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slw-brow .v{font:500 10px/1 'IBM Plex Mono',monospace;color:#8fa3b5;text-align:right}
.slw-brow .v.w{color:#e6edf3}
.slw-brow .lb{font:700 10px/1 'IBM Plex Mono',monospace;color:#ffb454;text-align:right}
.slw-boost-fn{font:400 9px/1.5 Archivo,sans-serif;color:#5d5236;padding:11px 16px;display:block}

/* ---- play tab ---- */
.slw-play-h{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-bottom:1px solid #131c26}
.slw-play-h .t{display:flex;align-items:center;justify-content:space-between;gap:10px}
.slw-play-h .t b{font:800 12px/1 Archivo,sans-serif;letter-spacing:.04em;color:#e6edf3}
.slw-play-h .t span{font:500 10px/1 'IBM Plex Mono',monospace;color:#8fa3b5}
.slw-play-h .g{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.slw-gate{font:700 9px/1 Archivo,sans-serif;letter-spacing:.1em;color:#00e07a;border:1px solid #134a33;border-radius:20px;background:#0d1a15;padding:6px 10px}
.slw-play-h .rank{font:500 10px/1 Archivo,sans-serif;color:#5d7085}
.slw-play-h .rank b{color:#e6edf3;font-weight:700}
.slw-play-h .fn{font:400 10px/1.4 Archivo,sans-serif;color:#5d7085}
.slw-lobby{display:flex;flex-direction:column;gap:13px;padding:14px 16px}
.slw-gtiles{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.slw-gtile{display:flex;flex-direction:column;gap:8px;border:1px solid #16202b;border-radius:12px;background:linear-gradient(180deg,#0d151f,#0a0f16);padding:14px;transition:transform .22s ease,box-shadow .22s ease;box-shadow:0 6px 14px -8px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.05)}
.slw-gtile:hover{transform:perspective(600px) rotateX(5deg) translateY(-5px) scale(1.02);box-shadow:0 20px 38px -14px rgba(0,0,0,.85),0 0 0 1px #1f3a4a}
.slw-gtile .top{display:flex;align-items:center;justify-content:space-between}
.slw-gbadge{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font:700 13px/1 'IBM Plex Mono',monospace;border:1px solid #1c2833;box-shadow:0 3px 0 rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.1)}
.slw-gtile .lv{font:500 9px/1 'IBM Plex Mono',monospace;color:#5d7085}
.slw-gtile .nm{font:700 12px/1 Archivo,sans-serif;color:#e6edf3}
.slw-gtile .mt{font:400 9px/1.3 Archivo,sans-serif;color:#5d7085}
.slw-gtile .rec{font:500 9px/1 'IBM Plex Mono',monospace;color:#8fa3b5}
.slw-gcta{margin-top:4px;font:700 10px/1 Archivo,sans-serif;color:#c7d6e3;background:#101821;border:1px solid #1c2833;padding:10px 0;border-radius:7px;cursor:pointer}
.slw-gcta.primary{color:#04060a;background:#00ff88;border:none}
.slw-gopen{display:flex;flex-direction:column;gap:8px}
.slw-gopen .hd{display:flex;align-items:center;justify-content:space-between}
.slw-gopen .hd b{font:700 10px/1 Archivo,sans-serif;letter-spacing:.12em;color:#c7d6e3}
.slw-gopen .hd a{font:600 10px/1 Archivo,sans-serif;color:#5d7085 !important}
.slw-gopen .hd a:hover{color:#e6edf3 !important}
.slw-gtable{display:flex;align-items:center;justify-content:space-between;gap:9px;border:1px solid #16202b;border-radius:9px;background:#0b1119;padding:9px 11px}
.slw-gtable .l{display:flex;align-items:center;gap:8px;min-width:0}
.slw-gtable .bg{width:28px;height:28px;flex:none;border-radius:8px;display:flex;align-items:center;justify-content:center;font:700 11px/1 'IBM Plex Mono',monospace;border:1px solid #1c2833}
.slw-gtable .bd{display:flex;flex-direction:column;gap:3px;min-width:0}
.slw-gtable .nm{font:600 10px/1 Archivo,sans-serif;color:#e6edf3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slw-gtable .hs{font:400 9px/1 Archivo,sans-serif;color:#5d7085;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slw-gjoin{font:600 9px/1 Archivo,sans-serif;color:#04060a;background:#00ff88;border:none;padding:8px 11px;border-radius:6px;cursor:pointer;flex:none}
.slw-gjoin:hover{background:#7affc0}
/* waiting room */
.slw-gwait{display:none;flex-direction:column;align-items:center;gap:12px;padding:26px 16px 22px}
.slw-gwait.show{display:flex}
.slw-gwait .bg{width:52px;height:52px;border-radius:13px;display:flex;align-items:center;justify-content:center;font:700 19px/1 'IBM Plex Mono',monospace;border:1px solid #1c2833}
.slw-gwait b{font:700 13px/1 Archivo,sans-serif;color:#e6edf3}
.slw-gwait .n{font:400 10px/1.4 Archivo,sans-serif;color:#5d7085;text-align:center}
.slw-gwait .code{display:flex;align-items:center;gap:8px}
.slw-gwait .code b{font:700 13px/2 'IBM Plex Mono',monospace;letter-spacing:.18em;color:#00ccff;border:1px dashed #1b3a4d;border-radius:8px;padding:0 13px;background:#07161d}
/* match */
.slw-gmatch{display:none;flex-direction:column}
.slw-gmatch.show{display:flex}
.slw-gmatch-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 16px;border-bottom:1px solid #131c26;flex-wrap:wrap}
.slw-gmatch-h .l{display:flex;align-items:center;gap:8px}
.slw-gmatch-h .l b{font:700 11px/1 Archivo,sans-serif;color:#e6edf3}
.slw-gmatch-h .r{display:flex;align-items:center;gap:7px}
.slw-ttt-clock{font:800 15px/1 'IBM Plex Mono',monospace;color:#e6edf3;border:1px solid #1c2833;border-radius:8px;padding:9px 11px;background:#0b1119}
.slw-ttt-clock.warn{color:#ff4757}
.slw-forfeit{font:600 9px/1 Archivo,sans-serif;color:#ff859f;background:#1a0810;border:1px solid #3d1524;padding:8px 10px;border-radius:6px;cursor:pointer}
.slw-forfeit:hover{background:#24101a}
.slw-vschips{display:flex;align-items:center;justify-content:center;gap:9px;padding:12px 16px 0}
.slw-vschips .vs{font:500 9px/1 Archivo,sans-serif;color:#4c5d6d}
.slw-pchip{display:flex;align-items:center;gap:7px;padding:9px 12px;border-radius:20px;color:#8fa3b5;background:#101821;border:1px solid #1c2833;transition:background .3s ease}
.slw-pchip.on{color:#04060a;background:#00ff88;border:none}
.slw-pchip .m{font:700 10px/1 'IBM Plex Mono',monospace}
.slw-pchip .n{font:600 9px/1 Archivo,sans-serif}
.slw-ttt-wrap{display:flex;flex-direction:column;align-items:center;gap:12px;padding:14px 16px 18px}
.slw-ttt-persp{perspective:760px}
.slw-ttt{display:grid;grid-template-columns:repeat(3,86px);grid-template-rows:repeat(3,86px);gap:7px;transform:rotateX(14deg);transform-style:preserve-3d;padding:10px;border-radius:14px;background:linear-gradient(180deg,#0c141d,#080d13);box-shadow:0 24px 44px -18px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.05)}
.slw-cell{font:700 32px/1 'IBM Plex Mono',monospace;cursor:pointer;color:#00ccff;background:linear-gradient(180deg,#101823,#0a0f16);border:1px solid #1c2833;border-radius:10px;box-shadow:0 5px 0 #060a0f,0 8px 14px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.08);transition:transform .18s ease,border-color .3s ease,background .3s ease;transform-style:preserve-3d}
.slw-cell:hover{transform:translateZ(16px)}
.slw-cell.x{color:#00ff88;text-shadow:0 0 14px rgba(0,255,136,.8);animation:slwMarkPop .32s ease-out;cursor:default}
.slw-cell.o{color:#00ccff;text-shadow:0 0 14px rgba(0,204,255,.8);animation:slwMarkPop .32s ease-out;cursor:default}
.slw-cell.win{background:linear-gradient(180deg,#10251c,#0c1a16);border-color:#00ff88;box-shadow:none;animation:slwWinPulse 1.1s ease-in-out infinite}
.slw-ttt-status{font:700 14px/1.3 Archivo,sans-serif;color:#e6edf3}
.slw-ttt-status.win{color:#00ff88}
.slw-ttt-status.lose{color:#ff859f}
.slw-ttt-btns{display:none;gap:7px}
.slw-ttt-btns.show{display:flex}
.slw-rematch{font:700 10px/1 Archivo,sans-serif;color:#04060a;background:#00ff88;border:none;padding:11px 14px;border-radius:8px;cursor:pointer}
.slw-rematch:hover{background:#7affc0}
.slw-play-fn{font:400 9px/1.4 Archivo,sans-serif;color:#3d4c5a;text-align:center}

/* ---- chess board (server-authoritative; thin UI) ---- */
.slw-chess{position:relative;display:grid;grid-template-columns:repeat(8,1fr);width:min(384px,86vw);border-radius:12px;overflow:hidden;border:1px solid #1c2833;box-shadow:0 24px 44px -18px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.05)}
/* each cell is its own square — the grid takes its height from the cells, so
   the board never collapses if container aspect-ratio isn't honored */
.slw-sq{aspect-ratio:1;display:flex;align-items:center;justify-content:center;padding:0;margin:0;border:0;line-height:1;font-size:clamp(20px,6.4vw,32px);cursor:pointer;transition:filter .1s ease,box-shadow .12s ease;-webkit-tap-highlight-color:transparent}
.slw-sq.lt{background:#c3ccd9}
.slw-sq.dk{background:#48586a}
.slw-sq:disabled{cursor:default}
.slw-sq:not(:disabled):hover{filter:brightness(1.08)}
.slw-sq.last{box-shadow:inset 0 0 0 4px rgba(0,204,255,.45)}
.slw-sq.sel{box-shadow:inset 0 0 0 4px #00ff88;filter:brightness(1.05)}
.slw-sq .pc{pointer-events:none}
.slw-sq .pc.wp{color:#fcfdff;text-shadow:0 1px 1px rgba(0,0,0,.55),0 0 3px rgba(0,0,0,.35)}
.slw-sq .pc.bp{color:#14181e;text-shadow:0 1px 1px rgba(255,255,255,.3),0 0 2px rgba(255,255,255,.2)}
.slw-promo{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:8px;background:rgba(6,10,16,.9);z-index:3;backdrop-filter:blur(2px)}
.slw-promo button{display:flex;align-items:center;justify-content:center;width:54px;height:54px;font-size:32px;line-height:1;border-radius:10px;border:1px solid #2a3a48;background:#0e1620;cursor:pointer;transition:border-color .2s,background .2s}
.slw-promo button:hover{border-color:#00ff88;background:#12202b}

/* ---- recommended ---- */
.slw-rec{border:1px solid #16202b;border-radius:14px;background:#080c12;overflow:hidden}
.slw-rec-h{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:1px solid #131c26}
.slw-rec-h .l{display:flex;flex-direction:column;gap:4px}
.slw-rec-h .l b{font:700 12px/1 Archivo,sans-serif;color:#e6edf3}
.slw-rec-h .l span{font:400 9px/1 Archivo,sans-serif;color:#5d7085}
.slw-rec-h .r{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.slw-rec-h .r a{font:600 10px/1 Archivo,sans-serif;color:#5d7085 !important}
.slw-rec-h .r a:hover{color:#e6edf3 !important}
.slw-rec-h .r span{font:400 9px/1 'IBM Plex Mono',monospace;color:#3d4c5a}
.slw-rv{display:flex;gap:10px;padding:10px 14px;border-bottom:1px solid #0e141c;cursor:pointer}
.slw-rv:hover{background:#0b1119}
.slw-rv .th{position:relative;width:148px;flex:none;border-radius:7px;overflow:hidden;background:#0b1119}
.slw-rv .th .ar{padding-bottom:56.25%}
.slw-rv .th .ph{position:absolute;inset:0;background:linear-gradient(150deg,#101a26,#0a0f16);display:flex;align-items:center;justify-content:center}
.slw-rv .th .ph span{font:600 9px/1 Archivo,sans-serif;color:#26333f}
.slw-rv .badge{position:absolute;top:5px;left:5px;display:flex;align-items:center;font:700 8px/1 Archivo,sans-serif;letter-spacing:.1em;color:#8fa3b5;background:rgba(4,6,10,.86);border:1px solid #1c2833;border-radius:4px;padding:5px 6px}
.slw-rv .badge.live{color:#fff;background:#ff2e66;border:none}
.slw-rv .dur{position:absolute;right:5px;bottom:5px;font:600 8px/1 'IBM Plex Mono',monospace;color:#fff;background:rgba(4,6,10,.85);border-radius:4px;padding:4px 5px}
.slw-rv .bd{display:flex;flex-direction:column;gap:5px;min-width:0;padding-top:2px}
.slw-rv .tt{font:600 11px/1.35 Archivo,sans-serif;color:#e6edf3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-wrap:pretty}
.slw-rv .mt{display:flex;align-items:center;gap:6px}
.slw-rv .mt .d{width:6px;height:6px;border-radius:50%;flex:none;background:#3d4c5a}
.slw-rv .mt .d.live{background:#ff2e66;animation:slwPulseDot 1.4s ease-in-out infinite}
.slw-rv .mt .d.soon{background:#ffb454}
.slw-rv .mt span{font:400 9px/1.4 'IBM Plex Mono',monospace;color:#8fa3b5}

/* ==== VOD (uploaded video) watch page — forked from the live page ==== */
.slw-vod .slw-frame-ph{display:none}
.slw-vod .slw-media video{object-fit:contain;background:#000}
/* poster art can be loud — a bottom scrim keeps the title block legible before play;
   it fades once the video is actually playing (frame.playing) */
.slw-vod .slw-frame::after{content:"";position:absolute;left:0;right:0;bottom:0;height:52%;background:linear-gradient(180deg,transparent,rgba(3,5,9,.55) 40%,rgba(3,5,9,.9));pointer-events:none;z-index:3;transition:opacity .4s ease}
.slw-vod .slw-frame.playing::after{opacity:0}
.slw-vod .slw-sub{text-decoration:none;display:inline-flex;align-items:center}
.slw-upchip{display:flex;align-items:center;gap:8px;background:rgba(6,10,16,.88);border:1px solid #134a33;border-radius:6px;padding:7px 11px}
.slw-upchip span{font:800 10px/1 Archivo,sans-serif;letter-spacing:.16em;color:#00ff88}
.slw-vodclock{font:800 15px/1 'IBM Plex Mono',monospace;color:#00ff88;letter-spacing:.02em;text-shadow:0 0 10px rgba(0,255,136,.4);white-space:nowrap}
.slw-facecam{position:absolute;top:18px;right:20px;width:19%;min-width:150px;border-radius:10px;overflow:hidden;border:1px solid #1c2833;background:#0a0f16;box-shadow:0 16px 40px -14px rgba(0,0,0,.75);z-index:5}
.slw-facecam .fr{position:relative;padding-bottom:56.25%;background:#070b10}
.slw-facecam .fr video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.slw-facecam .lb{display:flex;align-items:center;justify-content:space-between;padding:6px 9px;background:rgba(4,6,10,.9)}
.slw-facecam .lb b{font:600 8px/1 Archivo,sans-serif;letter-spacing:.1em;color:#c7d6e3}
.slw-facecam .lb span{font:500 8px/1 'IBM Plex Mono',monospace;color:#5d7085}
/* comments module */
.slw-cm{border:1px solid #16202b;border-radius:14px;background:#080c12;overflow:hidden}
.slw-cm-h{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #131c26}
.slw-cm-h .l{display:flex;align-items:baseline;gap:10px}
.slw-cm-h .l b{font:700 13px/1 Archivo,sans-serif;color:#e6edf3}
.slw-cm-h .l span{font:500 10px/1 'IBM Plex Mono',monospace;color:#5d7085}
.slw-cm-h .r{display:flex;gap:6px}
.slw-cm-sort{font:600 10px/1 Archivo,sans-serif;color:#8fa3b5;background:#0d141c;border:1px solid #1c2833;border-radius:20px;padding:8px 12px;cursor:pointer}
.slw-cm-sort.on{color:#04060a;background:#00ff88;border-color:#00ff88;font-weight:700}
.slw-cm-comp{display:flex;align-items:center;gap:11px;padding:14px 18px;border-bottom:1px solid #0e141c}
.slw-cm-comp .av{width:34px;height:34px;flex:none;border-radius:50%;border:1px solid #1c2833;background:#101821;display:flex;align-items:center;justify-content:center;font:600 11px/1 'IBM Plex Mono',monospace;color:#00ff88;background-size:cover;background-position:center}
.slw-cm-comp input{flex:1;border:none;border-bottom:1px solid #1c2833;background:none;color:#e6edf3;font:400 12px/1 Archivo,sans-serif;padding:9px 2px;outline:none;min-width:0}
.slw-cm-comp input::placeholder{color:#3d4c5a}
.slw-cm-comp input:focus{border-bottom-color:#00ff88}
.slw-cm-post{font:700 10px/1 Archivo,sans-serif;color:#4c5d6d;background:#101c26;border:none;border-radius:7px;padding:10px 14px;cursor:default;transition:all .2s ease}
.slw-cm-post.ready{color:#04060a;background:#00ff88;cursor:pointer}
.slw-cm-gate{font:400 10px/1.5 Archivo,sans-serif;color:#8a7a52;padding:10px 18px;border-bottom:1px solid #0e141c;background:#0d0b04}
#sml-lw-root .slw-cm-gate a{color:#ffb454 !important;font-weight:600}
.slw-cmt{display:flex;gap:11px;padding:14px 18px;border-bottom:1px solid #0e141c;animation:slwMsgIn .3s ease both}
.slw-cmt .av{width:30px;height:30px;flex:none;border-radius:50%;border:1px solid #1c2833;background:#101821;display:flex;align-items:center;justify-content:center;font:600 10px/1 'IBM Plex Mono',monospace;background-size:cover;background-position:center}
.slw-cmt .bd{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}
.slw-cmt .hd{display:flex;align-items:baseline;gap:8px}
.slw-cmt .hd b{font:700 11px/1 Archivo,sans-serif;color:#c7d6e3}
.slw-cmt .hd span{font:400 9px/1 'IBM Plex Mono',monospace;color:#4c5d6d}
.slw-cmt .tx{font:400 12px/1.55 Archivo,sans-serif;color:#aebccb;text-wrap:pretty;word-break:break-word}
.slw-cmt .acts{display:flex;align-items:center;gap:14px}
.slw-cmt .lk{font:600 10px/1 Archivo,sans-serif;color:#8fa3b5;background:none;border:none;cursor:pointer;padding:0}
.slw-cmt .lk.on{color:#00ff88}
.slw-cmt .rp{font:600 10px/1 Archivo,sans-serif;color:#5d7085;background:none;border:none;cursor:pointer;padding:0}
.slw-cmt .rp:hover{color:#e6edf3}
.slw-cmt .tg{font:600 10px/1 Archivo,sans-serif;color:#00ccff;background:none;border:none;cursor:pointer;padding:0}
.slw-cmt .thread{display:flex;flex-direction:column;gap:12px;border-left:2px solid #16202b;padding:10px 0 2px 14px;margin-top:4px}
.slw-cmt .thread .cmr{display:flex;gap:9px}
.slw-cmt .thread .av{width:24px;height:24px;font-size:9px}
.slw-cmt .thread .hd b{font-size:10px}
.slw-cmt .thread .tx{font-size:11px;line-height:1.5}
.slw-cmt .rcomp{display:flex;align-items:center;gap:8px;margin-top:6px}
.slw-cmt .rcomp input{flex:1;border:none;border-bottom:1px solid #1c2833;background:none;color:#e6edf3;font:400 11px/1 Archivo,sans-serif;padding:7px 2px;outline:none;min-width:0}
.slw-cm-empty{font:400 11px/1.6 Archivo,sans-serif;color:#3d4c5a;padding:22px 18px;text-align:center}
.slw-cm-more{font:600 10px/1 Archivo,sans-serif;color:#8fa3b5;background:#0d141c;border:1px solid #1c2833;border-radius:8px;padding:10px;cursor:pointer;margin:12px 18px 16px;display:block;width:calc(100% - 36px)}
/* home-group card */
.slw-hg{display:block;border:1px solid #16202b;border-radius:14px;background:#080c12;overflow:hidden;text-decoration:none;cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease}
.slw-hg:hover{border-color:#134a33;box-shadow:0 14px 40px -18px rgba(0,255,136,.25)}
.slw-hg .ban{position:relative}
.slw-hg .ban .fr{position:relative;padding-bottom:38%;background:linear-gradient(140deg,#0d1a15,#07161d 60%,#0a0f16);background-size:cover;background-position:center}
.slw-hg .ban .fade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 38%,rgba(8,12,18,.94));pointer-events:none}
.slw-hg .ban .tag{position:absolute;top:10px;left:12px;font:700 8px/1 Archivo,sans-serif;letter-spacing:.14em;color:#8fa3b5;background:rgba(4,6,10,.85);border:1px solid #1c2833;border-radius:5px;padding:6px 8px}
.slw-hg .ban .row{position:absolute;left:12px;right:12px;bottom:10px;display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.slw-hg .ban .row b{font:700 13px/1 Archivo,sans-serif;color:#fff}
.slw-hg .ban .row span{font:500 9px/1 'IBM Plex Mono',monospace;color:#7affc0}
.slw-hg .bd{display:flex;flex-direction:column;gap:9px;padding:12px 14px}
.slw-hg .bd p{margin:0;font:400 11px/1.5 Archivo,sans-serif;color:#8fa3b5;text-wrap:pretty}
.slw-hg .bd span{font:600 10px/1 Archivo,sans-serif;color:#00ff88}

/* ---- preview banner ---- */
.slw-banner{position:fixed;left:14px;bottom:14px;z-index:99;display:flex;align-items:center;gap:10px;background:#0d1a15;border:1px solid #134a33;border-radius:10px;padding:10px 13px;box-shadow:0 16px 40px -12px rgba(0,0,0,.8)}
.slw-banner b{font:700 10px/1 Archivo,sans-serif;letter-spacing:.1em;color:#00ff88}
.slw-banner span{font:400 10px/1 Archivo,sans-serif;color:#8fa3b5}
.slw-banner select{font:500 10px/1 Archivo,sans-serif;color:#c7d6e3;background:#0b1119;border:1px solid #1c2833;border-radius:6px;padding:6px 8px}
.slw-banner a{font:600 10px/1 Archivo,sans-serif;color:#5d7085 !important}

/* ---- responsive ---- */
@media (max-width:1200px){
  .slw-rail{max-width:none}
}
@media (max-width:768px){
  .slw-nav{padding:14px 16px;flex-wrap:wrap}
  .slw-nav-links{display:none}
  .slw-content{padding:18px 14px 0}
  .slw-titleblk h1{font-size:22px}
  .slw-titleblk{bottom:78px}
  .slw-markers-g{grid-template-columns:1fr}
  .slw-orbit{height:420px}
  .slw-ocard{width:220px;height:220px;left:-110px;top:-110px}
  .slw-ttt{grid-template-columns:repeat(3,72px);grid-template-rows:repeat(3,72px)}
  .slw-banner{left:8px;bottom:8px;flex-wrap:wrap;max-width:calc(100vw - 16px)}
}
@media (prefers-reduced-motion:reduce){
  #sml-lw-root *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
}
/* Super Chat gift in the live chat (owner call 2026-09-10) */
.slw-composer{position:relative}.slw-gift{flex:none;width:38px;height:38px;border-radius:50%;border:1px solid #6b4a12;background:radial-gradient(circle at 30% 30%,#3a2a08,#1c1408);color:#ffd166;font-size:17px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px rgba(255,209,102,.12)}.slw-gift:hover{filter:brightness(1.2);transform:translateY(-1px)}.slw-giftpop{position:absolute;left:12px;right:12px;bottom:calc(100% + 8px);z-index:40;background:#0d1520;border:1px solid #2a2f1a;border-radius:14px;padding:12px;box-shadow:0 22px 50px -14px rgba(0,0,0,.9);font-family:Archivo,sans-serif}.slw-giftpop .gp-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}.slw-giftpop .gp-h b{font-size:13px;color:#ffd166;flex:1}.slw-giftpop .gp-bal{font:600 11px/1 'IBM Plex Mono',monospace;color:#00ff88}.slw-giftpop .gp-x{background:none;border:0;color:#8798ac;cursor:pointer;font-size:14px}.slw-giftpop .gp-tiers{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-bottom:10px}.slw-giftpop .gp-tier{text-align:left;border:1px solid #1c2833;background:#0b1119;color:#e6edf3;border-radius:10px;padding:9px 10px;cursor:pointer;display:flex;flex-direction:column;gap:3px}.slw-giftpop .gp-tier b{font:800 13px/1 Archivo,sans-serif;color:#ffd166}.slw-giftpop .gp-tier span{font-size:10.5px;color:#8798ac;line-height:1.3}.slw-giftpop .gp-tier.on{border-color:#ffd166;background:#1c1408}.slw-giftpop .gp-tier.locked{opacity:.45;cursor:not-allowed}.slw-giftpop .gp-msg{width:100%;box-sizing:border-box;border:1px solid #1c2833;border-radius:10px;padding:9px 12px;background:#0b1119;color:#e6edf3;font:400 12px/1.2 Archivo,sans-serif;outline:none;margin-bottom:10px}.slw-giftpop .gp-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.slw-giftpop .gp-send{font:800 12px/1 Archivo,sans-serif;color:#1c1408;background:#ffd166;border:0;padding:11px 16px;border-radius:20px;cursor:pointer}.slw-giftpop .gp-send:disabled{opacity:.45;cursor:not-allowed}.slw-giftpop .gp-top{font-size:11px;color:#ff8f9c;text-decoration:none!important}.slw-giftpop .gp-note{font-size:11.5px;color:#00ff88;margin-top:8px}.slw-giftpop .gp-note.bad{color:#ff8f9c}.slw-giftpop .gp-note a{color:#63a4ff!important}.slw-giftpop .gp-fine{font-size:10px;color:#4d5d6b;margin-top:8px;line-height:1.4}.slw-msg.sc{background:linear-gradient(90deg,rgba(255,209,102,.16),rgba(255,209,102,.04));border-left:3px solid #ffd166;border-radius:10px;margin:4px 8px}.slw-msg.sc .tx{color:#ffe9b0;font-weight:600}.slw-msg.sc .av{border-color:#ffd166}
/* Super Chat gift v2: creator-set options, message vs speak (2026-09-10) */
.slw-giftpop .gp-tabs{display:flex;gap:6px;margin-bottom:10px}.slw-giftpop .gp-tab{flex:1;border:1px solid #1c2833;background:#0b1119;color:#8798ac;border-radius:9px;padding:8px;font:700 11px/1 Archivo,sans-serif;cursor:pointer}.slw-giftpop .gp-tab.on{border-color:#ffd166;color:#ffd166;background:#1c1408}.slw-giftpop .gp-lbl{font:700 9.5px/1 'IBM Plex Mono',monospace;letter-spacing:.5px;color:#6b7c8c;margin:2px 0 8px}.slw-giftpop .gp-amts{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;align-items:center}.slw-giftpop .gp-amt{border:1px solid #1c2833;background:#0b1119;color:#e6edf3;border-radius:999px;padding:7px 11px;font:800 11px/1 Archivo,sans-serif;cursor:pointer}.slw-giftpop .gp-amt.on{border-color:#ffd166;color:#ffd166;background:#1c1408}.slw-giftpop .gp-custom{width:92px;border:1px solid #1c2833;border-radius:999px;padding:7px 11px;background:#0b1119;color:#ffd166;font:800 11px/1 Archivo,sans-serif;outline:none}
/* Games Plus: visual lobby, CPU seats, Connect Four / Checkers / Spades boards (2026-09-10) */
.slw-gseats{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:4px 0 2px}.slw-gseat{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:84px;padding:10px 8px;border-radius:12px;background:#0b1119;border:1px solid #1c2833}.slw-gseat.me{border-color:#00ff88}.slw-gseat.cpu{border-color:#7d8cff}.slw-gseat.empty{border-style:dashed}.slw-gseat .av{width:36px;height:36px;border-radius:50%;background:#101821 center/cover no-repeat;border:1px solid #1c2833;display:flex;align-items:center;justify-content:center;font:700 12px/1 'IBM Plex Mono',monospace;color:#e6edf3}.slw-gseat .av.cpu{font-size:18px}.slw-gseat.empty .av i{width:10px;height:10px;border-radius:50%;background:#00ff88;animation:slwPulse 1.2s ease-in-out infinite}@keyframes slwPulse{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}.slw-gseat b{font:700 10.5px/1 Archivo,sans-serif;color:#e6edf3;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slw-gseat small{font:400 9px/1 'IBM Plex Mono',monospace;color:#5d7085}.slw-gwacts{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.slw-gwacts .slw-rematch,.slw-gwacts .slw-btn2{margin:0}.slw-gcpu{margin-top:6px;background:#0d0f1d!important;color:#7d8cff!important;border:1px solid #2a2f5a!important}.slw-gnote{display:block;margin-top:6px;font:400 9px/1.3 Archivo,sans-serif;color:#5d7085}.slw-gwide{margin-top:12px}.slw-c4{display:grid;gap:5px;padding:10px;border-radius:14px;background:linear-gradient(180deg,#0f2a5a,#0a1a3a);box-shadow:0 24px 44px -18px rgba(0,0,0,.9);margin:6px auto;max-width:360px}.slw-c4c{aspect-ratio:1;border:0;border-radius:50%;background:#070c15;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center}.slw-c4c:disabled{cursor:default}.slw-c4c i{display:block;width:78%;height:78%;border-radius:50%;background:transparent}.slw-c4c.p1 i{background:radial-gradient(circle at 35% 35%,#ff8b8b,#c8102e)}.slw-c4c.p2 i{background:radial-gradient(circle at 35% 35%,#fff0a8,#e0a336)}.slw-c4c:not(:disabled):not(.p1):not(.p2):hover i{background:rgba(255,255,255,.12)}.slw-ck{display:grid;grid-template-columns:repeat(8,1fr);gap:0;border:3px solid #2a1c10;border-radius:8px;overflow:hidden;margin:6px auto;max-width:384px}.slw-ckc{aspect-ratio:1;border:0;padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer}.slw-ckc.l{background:#e9d7b5;cursor:default}.slw-ckc.d{background:#6b4a2a}.slw-ckc.sel{box-shadow:inset 0 0 0 3px #00ff88}.slw-ckc i{display:flex;align-items:center;justify-content:center;width:74%;height:74%;border-radius:50%;font-size:16px;font-style:normal}.slw-ckc i.p1{background:radial-gradient(circle at 35% 35%,#fff,#bdbdbd);color:#333}.slw-ckc i.p2{background:radial-gradient(circle at 35% 35%,#555,#0a0a0a);color:#eee}.slw-sp{display:flex;flex-direction:column;gap:8px;margin:6px 0}.slw-spscore{display:flex;justify-content:space-between;gap:8px;font:500 10px/1 'IBM Plex Mono',monospace;color:#8fa3b5}.slw-spscore b{color:#e6edf3}.slw-sptable{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px;border-radius:14px;background:radial-gradient(circle at 50% 40%,#0f3d2b,#08160f);border:1px solid #1c2833}.slw-sprow{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}.slw-spmid{flex:1;text-align:center;font:600 10px/1 Archivo,sans-serif;color:#7affc0}.slw-spseat{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 8px;border-radius:10px;border:1px solid transparent;min-width:96px}.slw-spseat.turn{border-color:#00ff88}.slw-spseat b{font:700 10.5px/1 Archivo,sans-serif;color:#e6edf3}.slw-spseat small{font:400 8.5px/1.3 'IBM Plex Mono',monospace;color:#8fa3b5;text-align:center}.slw-card{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:40px;height:56px;border-radius:7px;background:#fff;border:1px solid #cfd6de;font:800 13px/1 Archivo,sans-serif;cursor:default;box-shadow:0 4px 10px -4px rgba(0,0,0,.8)}.slw-card i{font-style:normal;font-size:14px}.slw-card.slot{background:transparent;border:1px dashed #2a3a4a;box-shadow:none}.slw-card.played{width:34px;height:48px}.slw-card.ok{cursor:pointer;transform:translateY(-6px);box-shadow:0 0 0 2px #00ff88,0 8px 14px -6px rgba(0,0,0,.9)}.slw-card.dim{opacity:.35}.slw-sphand{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;padding:6px 0}.slw-spbid{display:flex;flex-wrap:wrap;gap:5px;align-items:center;justify-content:center}.slw-spbid span{font:600 10px/1 Archivo,sans-serif;color:#8fa3b5}.slw-spbid button{min-width:32px;height:30px;border-radius:8px;border:1px solid #1c2833;background:#0b1119;color:#e6edf3;font:700 11px/1 Archivo,sans-serif;cursor:pointer}.slw-spbid button:hover{border-color:#00ff88}
/* Games on phones (2026-09-10): boards fill the panel width, cells stay tappable, no hover-only affordances */
html.sml-mobile .slw-c4{max-width:100%;gap:4px;padding:8px}html.sml-mobile .slw-ck{max-width:100%}html.sml-mobile .slw-ttt-persp{width:min(100%,280px)}html.sml-mobile .slw-ttt{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto;width:100%;box-sizing:border-box;transform:none}html.sml-mobile .slw-ttt .slw-cell{aspect-ratio:1;height:auto}html.sml-mobile .slw-card{width:36px;height:50px}html.sml-mobile .slw-spseat{min-width:0;flex:1}html.sml-mobile .slw-gseat{min-width:72px}html.sml-mobile .slw-c4c,html.sml-mobile .slw-ckc,html.sml-mobile .slw-cell,html.sml-mobile .slw-card.ok,html.sml-mobile .slw-spbid button{touch-action:manipulation}html.sml-mobile .slw-gwacts .slw-rematch,html.sml-mobile .slw-gwacts .slw-btn2,html.sml-mobile .slw-gwacts .slw-back{width:100%;justify-content:center}
/* Watch-page comments: creator pin / highlight / tools + ?c= focus (2026-09-10) */
@keyframes slwHlGlow{0%,100%{box-shadow:0 0 0 1px rgba(255,159,28,.55),0 0 18px rgba(255,59,141,.35)}50%{box-shadow:0 0 0 1px rgba(123,92,255,.8),0 0 30px rgba(255,159,28,.6)}}
@keyframes slwHlSweep{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes slwFocusFlash{0%{background:rgba(0,255,136,.22)}100%{background:transparent}}
.slw-cmt.is-hl,.cmr.is-hl{position:relative;border-radius:14px;margin:6px 8px;padding:14px;background:linear-gradient(120deg,rgba(255,159,28,.12),rgba(255,59,141,.12),rgba(123,92,255,.12),rgba(255,159,28,.12));background-size:200% 100%;animation:slwHlGlow 2.4s ease-in-out infinite,slwHlSweep 6s linear infinite}
.slw-cmt.is-hl .tx,.cmr.is-hl .tx{color:#fff;font-weight:600;font-size:13px}
.slw-cmt.is-pinned{background:linear-gradient(180deg,rgba(0,255,136,.06),transparent)}
.slw-cmt .pin-tag{font:700 9.5px/1 'IBM Plex Mono',monospace;letter-spacing:.6px;color:#00ff88;text-transform:uppercase;margin-bottom:2px}
.slw-cmt .hd i.cr-tag,.cmr .hd i.cr-tag{font:800 8.5px/1 Archivo,sans-serif;letter-spacing:.8px;color:#04060a;background:#00ff88;border-radius:4px;padding:3px 5px;font-style:normal}
.slw-cmt .hd i.hl-tag,.cmr .hd i.hl-tag{font:800 8.5px/1 Archivo,sans-serif;letter-spacing:.4px;color:#fff;background:linear-gradient(90deg,#ff3b8d,#ff5c7a);border-radius:4px;padding:3px 6px;font-style:normal;animation:slwWinPulse 1.6s ease-in-out infinite}
.slw-cmt .acts .tl,.cmr .acts .tl{font:600 10px/1 Archivo,sans-serif;color:#8fa3b5;background:#0d141c;border:1px solid #1c2833;border-radius:20px;padding:6px 9px;cursor:pointer;transition:color .15s ease,border-color .15s ease,transform .12s ease}
.slw-cmt .acts .tl:hover,.cmr .acts .tl:hover{color:#00ff88;border-color:#00ff88}
.slw-cmt .acts .tl.on,.cmr .acts .tl.on{color:#ff5c7a;border-color:#ff3b8d;background:rgba(255,59,141,.08)}
.slw-cmt .acts .tl.dl:hover,.cmr .acts .tl.dl:hover{color:#ff5c7a;border-color:#ff5c7a}
.slw-cmt .lk{transition:color .15s ease,transform .12s ease}
.slw-cmt .lk:hover{color:#c7d6e3}
.slw-cmt .lk.on{animation:slwLkPop .28s ease}
@keyframes slwLkPop{0%{transform:scale(1)}45%{transform:scale(1.28)}100%{transform:scale(1)}}
.cmr .acts{display:flex;gap:8px;margin-top:4px}
.slw-cmt .acts,.cmr .acts{flex-wrap:wrap;row-gap:6px}
/* ---- emoji reactions (Phase 2) ---- */
.rxwrap{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.slw-cmt .rxt,.cmr .rxt{font-size:14px;line-height:1;padding:2px 5px;border-radius:9px;transition:background .15s ease,transform .12s ease}
.slw-cmt .rxt:hover,.cmr .rxt:hover{background:#0d141c}
.slw-cmt .rxt.on,.cmr .rxt.on{background:rgba(0,255,136,.1)}
.rxpick{display:inline-flex;align-items:center;gap:2px;background:#0d141c;border:1px solid #1c2833;border-radius:20px;padding:3px 5px;animation:slwRxIn .16s ease}
@keyframes slwRxIn{from{opacity:0;transform:translateY(3px) scale(.96)}to{opacity:1;transform:none}}
.rxpick .rxo{font-size:16px;line-height:1;background:none;border:none;cursor:pointer;padding:3px 4px;border-radius:7px;transition:transform .12s ease,background .12s ease}
.rxpick .rxo:hover{transform:scale(1.25)}
.rxpick .rxo.on{background:rgba(0,255,136,.14)}
.slw-cmt .rxc,.cmr .rxc{display:inline-flex;align-items:center;gap:3px;font:600 10px/1 Archivo,sans-serif;color:#8fa3b5;background:#0d141c;border:1px solid #1c2833;border-radius:20px;padding:4px 8px;cursor:pointer;transition:color .15s ease,border-color .15s ease}
.slw-cmt .rxc:hover,.cmr .rxc:hover{border-color:#2a3a49;color:#c7d6e3}
.slw-cmt .rxc.on,.cmr .rxc.on{color:#00ff88;border-color:#134a33;background:rgba(0,255,136,.08)}
/* ---- inline edit (Phase 2) ---- */
.cmedit{display:flex;flex-direction:column;gap:7px;margin:2px 0}
.cmedit .cmein{width:100%;box-sizing:border-box;resize:vertical;min-height:38px;background:#0d141c;border:1px solid #1c2833;border-radius:8px;color:#e6edf3;font:400 12px/1.5 Archivo,sans-serif;padding:8px 10px;outline:none;transition:border-color .15s ease}
.cmedit .cmein:focus{border-color:#00ff88}
.cmedit-a{display:flex;align-items:center;gap:10px}
.cmedit-x{font:600 10px/1 Archivo,sans-serif;color:#5d7085;background:none;border:none;cursor:pointer;padding:0}
.cmedit-x:hover{color:#e6edf3}
.slw-cmt .hd i.ed-tag,.cmr .hd i.ed-tag,.slw-cmt i.ed-tag,.cmr i.ed-tag{font:400 9px/1 'IBM Plex Mono',monospace;color:#4c5d6d;font-style:normal;margin-left:6px}
.slw-cmt.is-focus,.cmr.is-focus{animation:slwFocusFlash 2.4s ease-out 1}

/* phones: the tomato compose opened upward from the controls row and its top third sat under the sticky
   site header; anchor it to the bottom of the viewport as a sheet (2026-09-13) */
html.sml-mobile .slw-tom-pop{position:fixed;left:8px;right:8px;bottom:calc(env(safe-area-inset-bottom,0px) + 8px);width:auto;z-index:2147483100}

/* ---- Boost paste helper (Stocktwits · moomoo · Instagram have no share composer) 2026-09-14 ---- */
.slw-modal.slw-paste{z-index:2147483200;padding:24px}
.slw-modal.slw-paste .slw-modal-c{width:540px;gap:12px}
.slw-paste-status{font:800 13px/1.4 Archivo,sans-serif;color:#04120a;background:#38f58a;border-radius:10px;padding:13px 14px;letter-spacing:.01em}
.slw-paste-status.warn{background:#ffb454}
.slw-paste-text{width:100%;box-sizing:border-box;min-height:104px;border:1px solid #1c2833;border-radius:10px;background:#0b1119;color:#e6edf3;padding:12px;font:500 13px/1.5 Archivo,sans-serif;resize:vertical}
.slw-paste-btns{display:flex;gap:8px;flex-wrap:wrap;align-items:stretch}
.slw-paste-btns .slw-rematch{flex:1;min-width:170px;font-size:12px}
.slw-paste-btns .slw-x{padding:12px 14px;font-size:11px}
html.sml-mobile .slw-modal.slw-paste{padding:10px;align-items:flex-end}
html.sml-mobile .slw-modal.slw-paste .slw-modal-c{width:100%;max-width:100%;padding:16px;max-height:calc(100dvh - 20px);overflow:auto}

/* ---- phone hero (2026-09-14): the 16:9 frame is only ~194px wide-open on a phone, so the title block (bottom-anchored),
   the OFF AIR chips and the NOT LIVE placeholder all landed on the same rows. Chips stay top-left, the title is
   anchored under them and clamped to two lines, the placeholder text sits above the control bar, and while the
   control bar moves BELOW the frame (see the phone control-row block), so the frame stays 16:9. ---- */
html.sml-mobile .slw-frame:not(.multi) .slw-topchips{top:12px;left:12px;gap:8px}
html.sml-mobile .slw-frame:not(.multi) .slw-titleblk{top:50px;bottom:auto;left:12px;right:12px;max-width:none;gap:6px}
html.sml-mobile .slw-frame:not(.multi) .slw-titleblk h1{font-size:19px;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html.sml-mobile .slw-frame:not(.multi) .slw-titleblk .who .nm,html.sml-mobile .slw-frame:not(.multi) .slw-titleblk .who .el{font-size:11px}
html.sml-mobile .slw-frame:not(.multi) .slw-frame-ph{justify-content:flex-end;padding-bottom:16px;gap:8px}
html.sml-mobile .slw-frame:not(.multi) .slw-frame-ph .t2{max-width:86%}

/* ---- control row (2026-09-14): on a 1280-wide desktop the frame is ~740px but the row needed ~850px, so
   Share / ⧉ / ⚙ were clipped outside the frame. The player is an inline-size container; under 880px the
   row tightens (smaller gaps and pads, shorter volume bar, smaller clock, "Terminal →" label). ---- */
.slw-player{container-type:inline-size}
@container (max-width: 880px){
  .slw-ctl-row{gap:10px}
  .slw-ctl-l{gap:8px}
  .slw-ctl-r{gap:6px}
  .slw-vol{padding:0 9px}
  .slw-vol .bar{width:36px}
  .slw-loopchip{padding:0 9px}
  .slw-clock{font-size:12px}
  .slw-btn-term{font-size:0;padding:9px}
  .slw-btn-term > *{display:none}
  .slw-btn-term::before{content:"Terminal →";font-size:10px}
  .slw-like,.slw-share,.slw-tom-btn{padding:8px 9px}
  .slw-tom-count{padding:3px 5px}
  .slw-gear{padding:8px}
}

/* ---- phone control row (2026-09-14): the row needs ~680px and a phone frame is ~305px wide, so Like / Tomato /
   Share / ⧉ / ⚙ were cut off. On phones the bar sits under the video instead of over it (top:100%), wraps, and
   the frame reserves its height through --slw-ctl-h (set by a ResizeObserver in live-watch.js, 132px fallback). ---- */
html.sml-mobile .slw-frame:not(.multi){margin-bottom:var(--slw-ctl-h,132px)}
html.sml-mobile .slw-frame:not(.multi) .slw-ctl{top:100%;bottom:auto;padding:10px 12px 12px;background:#070b10;border-top:1px solid #101822}
html.sml-mobile .slw-frame:not(.multi) .slw-ctl-row,html.sml-mobile .slw-frame:not(.multi) .slw-ctl-l,html.sml-mobile .slw-frame:not(.multi) .slw-ctl-r{flex-wrap:wrap;gap:8px}
html.sml-mobile .slw-frame:not(.multi) .slw-ctl-row{justify-content:flex-start}

/* ---- VOD premiere card (scheduled upload before its time) 2026-09-15 ---- */
.slw-premiere{position:absolute;inset:0;background:#000 center/cover no-repeat;display:flex;align-items:flex-end;z-index:6}
.slw-premiere-in{width:100%;padding:56px 20px 18px;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.78) 40%,rgba(0,0,0,.92));color:#fff;display:flex;flex-direction:column;gap:6px}
.slw-premiere-tag{font:800 11px/1.3 Archivo,sans-serif;letter-spacing:.16em;color:#00ff88;text-transform:uppercase}
.slw-premiere-in b{font:800 22px/1.15 Archivo,sans-serif;letter-spacing:-.01em;text-shadow:0 4px 20px rgba(0,0,0,.7)}
.slw-premiere-in span:last-child{font:500 13px/1.4 Archivo,sans-serif;color:#cfd8e3}
/* the card carries the title, so the frame's own title overlay steps aside; transport is inert until the time */
.slw-premiere-on .slw-titleblk{display:none}
.slw-premiere-on #vw-play,.slw-premiere-on .slw-prog,.slw-premiere-on .slw-vodclock{opacity:.35;pointer-events:none}
html.sml-mobile .slw-premiere-in{padding:40px 12px 12px;gap:4px}
html.sml-mobile .slw-premiere-in b{font-size:16px}
html.sml-mobile .slw-premiere-in span:last-child{font-size:12px}

/* ---- premiere mode: countdown, live badge, join button, chat panel (2026-09-15) ---- */
.slw-premiere-cd{display:flex;align-items:baseline;gap:10px;margin:4px 0}
.slw-premiere-cd .lbl{font:800 10px/1 Archivo,sans-serif;letter-spacing:.18em;color:#8fa3b5}
.slw-premiere-cd .cd{font:800 26px/1 'IBM Plex Mono',monospace;color:#00ff88;letter-spacing:.02em}
.slw-upchip.prem-live{background:#ff2e66;color:#fff}
.slw-upchip.prem-live span{color:#fff}
.slw-upchip.prem-up{background:#0f2a1e;border:1px solid #1e8a5a}
.slw-prem-join{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:7;display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 22px;border:1px solid #00ff88;border-radius:14px;background:rgba(4,8,12,.82);color:#e6edf3;cursor:pointer;box-shadow:0 20px 60px -20px rgba(0,255,136,.5)}
.slw-prem-join b{font:800 16px/1 Archivo,sans-serif;color:#00ff88}
.slw-prem-join span{font:500 11px/1.3 Archivo,sans-serif;color:#8fa3b5}
.slw-premiere-live .slw-prog{cursor:default}
.vw-chat{border:1px solid #16202b;border-radius:16px;background:#080c12;display:flex;flex-direction:column;max-height:420px;overflow:hidden}
.vw-chat-h{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid #131c26}
.vw-chat-h .dot{width:8px;height:8px;border-radius:50%;background:#ff2e66}
.vw-chat-h b{font:800 12px/1 Archivo,sans-serif;color:#e6edf3;letter-spacing:.04em}
.vw-chat-h .st{margin-left:auto;font:600 10px/1 Archivo,sans-serif;color:#8fa3b5;letter-spacing:.08em;text-transform:uppercase}
.vw-chat-list{flex:1;overflow:auto;padding:10px 12px;display:flex;flex-direction:column;gap:8px;min-height:160px}
.vw-chat-empty{font:400 11px/1.4 Archivo,sans-serif;color:#5d7085;text-align:center;padding:22px 0}
.vw-chat-msg{display:flex;gap:8px;align-items:flex-start}
.vw-chat-msg .av{width:26px;height:26px;flex:none;border-radius:50%;background:#101821;display:flex;align-items:center;justify-content:center;font:700 9px/1 Archivo,sans-serif;color:#8fa3b5;overflow:hidden}
.vw-chat-msg .av img{width:100%;height:100%;object-fit:cover}
.vw-chat-msg .bd{min-width:0;flex:1}
.vw-chat-msg .bd b{font:700 11px/1 Archivo,sans-serif;color:#00ff88}
.vw-chat-msg .bd .t{font:500 9px/1 Archivo,sans-serif;color:#5d7085;margin-left:6px}
.vw-chat-msg .bd p{margin:3px 0 0;font:400 12px/1.4 Archivo,sans-serif;color:#c7d6e3;word-break:break-word}
.vw-chat-msg.sc .bd p{color:#ffd76a}
.vw-chat-comp{display:flex;gap:8px;padding:10px 12px;border-top:1px solid #131c26}
.vw-chat-comp input{flex:1;min-width:0;height:36px;border-radius:9px;border:1px solid #1c2833;background:#0b1119;color:#e6edf3;padding:0 12px;font:500 12px/1 Archivo,sans-serif}
.vw-chat-comp button{height:36px;padding:0 14px;border:none;border-radius:9px;background:#00ff88;color:#04060a;font:800 11px/1 Archivo,sans-serif;cursor:pointer}
.vw-chat-note{padding:0 12px 10px;font:500 11px/1.3 Archivo,sans-serif;color:#ffb454}
.vw-chat-gate{padding:12px 14px;border-top:1px solid #131c26;font:500 12px/1.4 Archivo,sans-serif;color:#8fa3b5}
.vw-chat-gate a{color:#00ff88;font-weight:700}
html.sml-mobile .vw-chat{max-height:340px}
html.sml-mobile .slw-premiere-cd .cd{font-size:22px}

/* ===== Signed-out chat lock (owner 2026-09-23) =====
   Live/scheduled chat stays readable through a 25% tint; a join card asks visitors to sign up or sign in.
   Shared by the live watch page (.slw-lock in #slw-pane-0) and premiere chat (.vw-chat .slw-lock). */
.slw-lock{position:absolute;left:0;right:0;bottom:0;top:0;z-index:8;display:flex;align-items:center;justify-content:center;padding:14px;overflow:auto;
  background:rgba(4,8,13,.25);-webkit-backdrop-filter:blur(1.2px);backdrop-filter:blur(1.2px);cursor:default}
.slw-lock-card{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;width:min(300px,100%);margin:auto;padding:16px 16px 14px;border-radius:14px;
  background:linear-gradient(180deg,rgba(11,18,26,.96),rgba(7,12,18,.97));border:1px solid rgba(0,255,136,.38);
  box-shadow:0 0 0 1px rgba(0,0,0,.5),0 14px 44px rgba(0,0,0,.6),0 0 34px rgba(0,255,136,.16);animation:slwLockIn .45s cubic-bezier(.2,.9,.3,1) both}
.slw-lock-k{display:inline-flex;align-items:center;gap:7px;font:700 9.5px/1 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.14em;color:#00ff88}
.slw-lock-k i{width:7px;height:7px;border-radius:50%;background:#00ff88;box-shadow:0 0 0 0 rgba(0,255,136,.6);animation:slwLockPulse 1.8s ease-out infinite}
.slw-lock-t{font:700 19px/1.15 Archivo,system-ui,sans-serif;color:#f2f7fb;letter-spacing:-.01em}
.slw-lock-s{font:400 12px/1.5 Archivo,system-ui,sans-serif;color:#9fb0bf;max-width:250px}
.slw-lock-p{display:block;width:100%;margin-top:4px;padding:11px 14px;border-radius:10px;background:#00ff88;color:#04120a !important;font:800 13px/1 Archivo,system-ui,sans-serif;text-decoration:none !important;
  letter-spacing:.01em;box-shadow:0 6px 22px rgba(0,255,136,.32);transition:transform .15s,box-shadow .15s}
.slw-lock-p:hover,.slw-lock-p:focus-visible{transform:translateY(-1px);box-shadow:0 9px 28px rgba(0,255,136,.45);outline:0}
.slw-lock-a{font:600 11.5px/1 Archivo,system-ui,sans-serif;color:#b9c7d3 !important;text-decoration:underline !important;text-underline-offset:3px}
.slw-lock-a:hover{color:#fff !important}
.slw-lock.nudge .slw-lock-card{animation:slwLockNudge .7s ease both}
@keyframes slwLockIn{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
@keyframes slwLockPulse{0%{box-shadow:0 0 0 0 rgba(0,255,136,.6)}70%,100%{box-shadow:0 0 0 9px rgba(0,255,136,0)}}
@keyframes slwLockNudge{0%,100%{transform:none}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
@media (prefers-reduced-motion:reduce){.slw-lock-card,.slw-lock-k i,.slw-lock.nudge .slw-lock-card{animation:none}}

/* channel emotes */
.slw-emote{height:1.7em;width:auto;max-width:5em;vertical-align:-.45em;margin:0 1px}
.slw-emo{background:transparent;border:0;color:#9fb2c7;font-size:20px;line-height:1;cursor:pointer;padding:0 6px}
.slw-emo:hover{color:#fff}
.slw-composer{position:relative}
.slw-emopop{position:absolute;left:0;bottom:calc(100% + 8px);width:min(320px,92vw);background:#0b131f;border:1px solid #223146;border-radius:12px;padding:10px;box-shadow:0 14px 40px rgba(0,0,0,.5);z-index:30}
.slw-emopop[hidden]{display:none}
.slw-emopop .ep-note{font-size:12px;color:#9fb2c7;margin:0 0 8px;line-height:1.45}
.slw-emopop .ep-note.lock{color:#f5a623}
.slw-emopop .ep-note a{color:#2b6cff;font-weight:700}
.slw-emopop .ep-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;max-height:190px;overflow:auto}
.slw-emopop .ep-e{background:#0d1622;border:1px solid #182130;border-radius:8px;padding:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;aspect-ratio:1}
.slw-emopop .ep-e:hover{border-color:#2b6cff}
.slw-emopop .ep-e.off{opacity:.4;cursor:not-allowed}
.slw-emopop .ep-e img{max-width:100%;max-height:100%;object-fit:contain}

/* ---------- chapters, transcript, cards + end screen (sml-video-extras, 2026-09-25) ---------- */
#sml-vw-root .slw-vx-cur{background:none;border:0;color:#c7d6e3;font:600 12px/1 Archivo,sans-serif;cursor:pointer;padding:0 0 0 10px;max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#sml-vw-root .slw-vx-cur:hover{color:#00ff88}
#sml-vw-root .slw-vx-card{border:1px solid #16202b;border-radius:14px;background:#080c12;overflow:hidden}
#sml-vw-root .slw-vx-h{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:13px 16px;border-bottom:1px solid #131c26}
#sml-vw-root .slw-vx-h .l{display:flex;align-items:baseline;gap:10px}
#sml-vw-root .slw-vx-h b{font:700 13px/1 Archivo,sans-serif;color:#e6edf3;letter-spacing:.02em}
#sml-vw-root .slw-vx-h .l span{font:600 11px/1 'IBM Plex Mono',monospace;color:#5d7085}
#sml-vw-root .slw-vx-h .r{display:flex;align-items:center;gap:12px}
#sml-vw-root .slw-vx-h input[type=search]{background:#0d141c;border:1px solid #1c2833;border-radius:8px;color:#e6edf3;font:500 12px/1 Archivo,sans-serif;padding:7px 10px;width:210px}
#sml-vw-root .slw-vx-follow{display:flex;align-items:center;gap:6px;color:#8fa3b5;font:600 11px/1 Archivo,sans-serif;white-space:nowrap}
#sml-vw-root .slw-vx-chs{list-style:none;margin:0;padding:6px;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:4px}
#sml-vw-root .slw-vx-chs button{width:100%;display:flex;gap:10px;align-items:center;text-align:left;background:none;border:1px solid transparent;border-radius:10px;padding:9px 10px;cursor:pointer;color:#c7d6e3}
#sml-vw-root .slw-vx-chs button:hover{background:#0b1119}
#sml-vw-root .slw-vx-chs button.on{border-color:#134a33;background:rgba(0,255,136,.06);color:#e6edf3}
#sml-vw-root .slw-vx-chs .t{font:700 12px/1 'IBM Plex Mono',monospace;color:#00ccff;min-width:46px}
#sml-vw-root .slw-vx-chs .n{font:600 13px/1.3 Archivo,sans-serif}
#sml-vw-root .slw-vx-txb{max-height:360px;overflow-y:auto;padding:6px 8px 10px;scroll-behavior:smooth}
#sml-vw-root .slw-vx-txb p{display:flex;gap:10px;margin:0;padding:6px 8px;border-radius:8px;color:#8fa3b5;font:400 14px/1.55 Archivo,sans-serif}
#sml-vw-root .slw-vx-txb p.on{background:rgba(0,204,255,.07);color:#e6edf3}
#sml-vw-root .slw-vx-txb p button{flex:0 0 auto;background:none;border:0;padding:2px 0;cursor:pointer;color:#00ccff;font:700 12px/1.5 'IBM Plex Mono',monospace;min-width:46px;text-align:left}
#sml-vw-root .slw-vx-layer{position:absolute;inset:0;z-index:8;pointer-events:none}
#sml-vw-root .slw-vx-layer>*{pointer-events:auto}
#sml-vw-root .slw-vx-pill{position:absolute;top:56px;right:12px;display:none;align-items:center;gap:8px;max-width:60%;background:rgba(4,6,10,.82);border:1px solid #1c2833;border-radius:999px;padding:6px 10px;color:#e6edf3;font:600 12px/1.2 Archivo,sans-serif;cursor:pointer;backdrop-filter:blur(6px)}
#sml-vw-root .slw-vx-pill.has{display:flex}
#sml-vw-root .slw-vx-pill.show{padding:5px 12px 5px 5px;animation:slwVxIn .35s ease}
#sml-vw-root .slw-vx-pill img{width:34px;height:34px;border-radius:50%;object-fit:cover}
#sml-vw-root .slw-vx-pill span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#sml-vw-root .slw-vx-pop{position:absolute;top:56px;right:12px;width:min(340px,80%);display:none;background:rgba(8,12,18,.96);border:1px solid #1c2833;border-radius:14px;padding:10px;max-height:70%;overflow-y:auto}
#sml-vw-root .slw-vx-pop.open{display:block;animation:slwVxIn .25s ease}
#sml-vw-root .slw-vx-pop .hd{display:flex;justify-content:space-between;align-items:center;margin:0 2px 8px}
#sml-vw-root .slw-vx-pop .hd b{font:700 12px/1 Archivo,sans-serif;color:#8fa3b5;letter-spacing:.06em;text-transform:uppercase}
#sml-vw-root .slw-vx-pop .x{background:none;border:0;color:#8fa3b5;cursor:pointer;font-size:14px}
#sml-vw-root .slw-vx-ct,#sml-vw-root .slw-vx-et{display:flex;gap:10px;align-items:center;text-decoration:none;color:#e6edf3;border-radius:10px;padding:6px}
#sml-vw-root .slw-vx-ct:hover{background:#0b1119}
#sml-vw-root .slw-vx-ct .im{flex:0 0 96px;height:54px;border-radius:8px;overflow:hidden;background:#101c26}
#sml-vw-root .slw-vx-ct .im img,#sml-vw-root .slw-vx-et .im img{width:100%;height:100%;object-fit:cover;display:block}
#sml-vw-root .slw-vx-ct .tx,#sml-vw-root .slw-vx-et .tx{display:flex;flex-direction:column;gap:3px;min-width:0}
#sml-vw-root .slw-vx-ct b,#sml-vw-root .slw-vx-et b{font:700 13px/1.25 Archivo,sans-serif;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#sml-vw-root .slw-vx-ct small,#sml-vw-root .slw-vx-et small{font:500 11px/1.2 Archivo,sans-serif;color:#8fa3b5}
#sml-vw-root .slw-vx-ct em,#sml-vw-root .slw-vx-et em{font:700 10px/1 'IBM Plex Mono',monospace;color:#00ff88;font-style:normal;letter-spacing:.06em;text-transform:uppercase}
#sml-vw-root .k-channel .im{border-radius:50%!important;width:54px;flex-basis:54px!important}
#sml-vw-root .slw-vx-ct .sub,#sml-vw-root .slw-vx-et .sub{margin-left:auto;background:#00ff88;color:#04060a;border-radius:999px;padding:6px 12px;font:800 11px/1 Archivo,sans-serif}
#sml-vw-root .slw-vx-end{position:absolute;inset:0 0 88px;display:none;align-items:center;justify-content:center;pointer-events:none!important}
#sml-vw-root .slw-vx-end.show{display:flex;animation:slwVxIn .4s ease}
#sml-vw-root .slw-vx-end .g{display:grid;grid-template-columns:repeat(2,minmax(0,260px));gap:12px;pointer-events:auto;padding:0 16px}
#sml-vw-root .slw-vx-end.n1 .g{grid-template-columns:minmax(0,300px)}
#sml-vw-root .slw-vx-et{flex-direction:row;align-items:center;background:rgba(8,12,18,.9);border:1px solid #1c2833;padding:8px;transition:transform .15s,border-color .15s}
#sml-vw-root .slw-vx-et:hover{transform:translateY(-2px);border-color:#00ff88}
#sml-vw-root .slw-vx-et .im{flex:0 0 112px;height:63px;border-radius:8px;overflow:hidden;background:#101c26;display:block}
#sml-vw-root .slw-vx-end.n1 .slw-vx-et,#sml-vw-root .slw-vx-end.n2 .slw-vx-et{flex-direction:column;align-items:stretch}
#sml-vw-root .slw-vx-end.n1 .slw-vx-et .im,#sml-vw-root .slw-vx-end.n2 .slw-vx-et .im{flex:none;height:clamp(70px,14vw,130px)}
#sml-vw-root .slw-vx-end .g{transform-origin:center}
#sml-vw-root .slw-vx-et.k-channel,#sml-vw-root .slw-vx-end.n1 .slw-vx-et.k-channel,#sml-vw-root .slw-vx-end.n2 .slw-vx-et.k-channel{flex-direction:row;align-items:center}
#sml-vw-root .slw-vx-et.k-channel .im,#sml-vw-root .slw-vx-end .slw-vx-et.k-channel .im{height:54px;flex:0 0 54px}
#sml-vw-root .slw-vx-et.k-link .im{display:flex;align-items:center;justify-content:center}
#sml-vw-root .slw-vx-et.k-link .im img{width:40px;height:40px;object-fit:contain}
#sml-vw-root .slw-frame.slw-vx-ending .slw-titleblk{opacity:0;transition:opacity .3s}
@keyframes slwVxIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (max-width:768px){
  #sml-vw-root .slw-vx-h .r{width:100%}
  #sml-vw-root .slw-vx-h input[type=search]{flex:1;width:auto}
  #sml-vw-root .slw-vx-cur{display:none}
  #sml-vw-root .slw-vx-pill,#sml-vw-root .slw-vx-pop{top:44px;right:8px}
  #sml-vw-root .slw-vx-end{inset:0 0 64px}
  html.sml-mobile #sml-vw-root .slw-vx-end{inset:0}
  #sml-vw-root .slw-vx-end .g{gap:6px;padding:0 8px;width:100%;box-sizing:border-box;grid-template-columns:repeat(4,minmax(0,1fr))}
  #sml-vw-root .slw-vx-end.n1 .g{grid-template-columns:minmax(0,160px)}
  #sml-vw-root .slw-vx-end.n2 .g{grid-template-columns:repeat(2,minmax(0,160px))}
  #sml-vw-root .slw-vx-end.n3 .g{grid-template-columns:repeat(3,minmax(0,1fr))}
  #sml-vw-root .slw-vx-end .slw-vx-et,#sml-vw-root .slw-vx-end .slw-vx-et.k-channel{flex-direction:column;align-items:stretch;gap:4px;padding:4px}
  #sml-vw-root .slw-vx-end .slw-vx-et .im,#sml-vw-root .slw-vx-end .slw-vx-et.k-channel .im{flex:none!important;width:100%;height:auto!important;aspect-ratio:16/9;border-radius:6px}
  #sml-vw-root .slw-vx-end .slw-vx-et.k-channel .im{width:56%;margin:0 auto;aspect-ratio:1;border-radius:50%!important}
  #sml-vw-root .slw-vx-end .slw-vx-et .sub,#sml-vw-root .slw-vx-end .slw-vx-et small,#sml-vw-root .slw-vx-end .slw-vx-et em{display:none}
  #sml-vw-root .slw-vx-end .slw-vx-et b{font-size:10.5px;line-height:1.2;text-align:center}
}
