/* ==========================================================================
   /streamers — casino streamers on Kick (issue #106).

   Layers on assets/css/crash-tracker.css (the .crx system) and only adds what
   that file has no component for: the casino-streams switch, the rankings
   toolbar (with the platform filter) and table cells (with each channel's
   identifiers, #708), the casinos view, the method panel,
   the per-channel drawer (HTML chart, heatmap, sessions) and the share
   dialog. Scope: .crx.stx. Text never goes below 12px; phone controls are
   48px tall.
   ========================================================================== */

.crx.stx{padding-bottom:0}

/* Identity tile: the headset glyph on a cyan → violet tint (no single casino
   owns the page). */
.stx .crx-mark{display:grid;place-items:center;background:linear-gradient(150deg,rgba(79,199,234,.22),rgba(123,77,242,.2));color:var(--cyan,#4FC7EA)}
.stx .crx-mark svg{width:28px;height:28px}
.stx .crx-tag.stx-dek{display:block;flex:0 0 100%;padding:0;border:0;border-radius:0;background:transparent}
.stx .crx-ident-text{min-width:0}
@media (max-width:560px){.stx .crx-facts,.stx .crx-facts li{white-space:normal}}

/* --------------------------------------------------------------------------
   Casino-streams switch
   -------------------------------------------------------------------------- */

.stx-scope{display:flex;align-items:center;gap:8px 18px;flex-wrap:wrap;margin:0 0 12px;padding:12px 16px;border-color:rgba(46,212,127,.22);background:linear-gradient(90deg,rgba(46,212,127,.07),transparent 60%),var(--card)}
.stx:not(.is-casino-only) .stx-scope{border-color:var(--hair);background:var(--card)}
.stx-switch{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:36px;font-size:15px;font-weight:700;color:#fff;cursor:pointer;user-select:none}
.stx-switch em{font-style:normal;font-weight:500;color:var(--ink-3)}
.stx-switch input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.stx-switch i{flex:0 0 auto;width:42px;height:24px;border-radius:999px;background:var(--surface-3,#293046);border:1px solid var(--hair-2);position:relative;transition:background .16s}
.stx-switch i::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .16s}
.stx-switch input:checked+i{background:var(--up,#2ED47F);border-color:transparent}
.stx-switch input:checked+i::after{transform:translateX(18px);background:#0B1A12}
.stx-switch input:focus-visible+i{outline:2px solid var(--cyan,#4FC7EA);outline-offset:2px}
.stx-scope-note{flex:1 1 320px;font-size:13px;color:var(--ink-3)}
.stx .stx-scope-off,.stx.is-casino-only .stx-scope-on{display:inline}
.stx .stx-scope-on,.stx.is-casino-only .stx-scope-off{display:none}

/* Four tiles; the scoped rule out-specificises the base fold. */
.stx .crx-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1080px){.stx .crx-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.stx .crx-kpi .val.stx-kpi-name{color:var(--gold,#F5C451);overflow:hidden;text-overflow:ellipsis}

/* Avatars */
.stx-av{display:grid;place-items:center;flex:0 0 auto;width:32px;height:32px;border-radius:50%;overflow:hidden;background:var(--card);border:1px solid var(--hair)}
.stx-av img{width:100%;height:100%;object-fit:cover}
.stx-av.is-mono{font:800 13px/1 var(--font-display,"Sora",sans-serif);color:var(--cyan,#4FC7EA);background:color-mix(in srgb,var(--cyan,#4FC7EA) 14%,var(--card))}

/* --------------------------------------------------------------------------
   Rankings
   -------------------------------------------------------------------------- */

.stx-board{padding:0;overflow:hidden}
.stx-toolbar{display:flex;flex-direction:column;gap:10px;padding:12px 14px;border-bottom:1px solid var(--hair)}
.stx-toolbar-row{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap}
.stx-tabs,.stx-win,.stx-plat{max-width:100%}
/* Platform filter (#708): "Also on" X, YouTube, …; a platform nobody links is disabled with its count 0. */
.stx-plat button{display:inline-flex;align-items:center;gap:6px;padding-left:10px;padding-right:10px}
.stx-plat .stx-id-ic{flex:0 0 auto;width:14px;height:14px}
.stx-plat-n{font-size:12px;font-weight:600;color:var(--ink-4);font-variant-numeric:tabular-nums}
.stx-plat button[aria-pressed="true"] .stx-plat-n{color:var(--ink-2)}
.stx .stx-plat button:disabled{opacity:.42;cursor:not-allowed}
.stx .stx-plat button:disabled:hover{color:var(--ink-3)}
.stx-search{position:relative;display:block;flex:1 1 240px;min-width:0;max-width:440px}
.stx-search input{width:100%;height:38px;padding:0 12px 0 36px;border:1px solid var(--hair-2);border-radius:999px;background:var(--card-2);color:var(--ink);font:inherit;font-size:14px;outline:none}
.stx-search input:focus{border-color:var(--cyan,#4FC7EA)}
.stx-search input::placeholder{color:var(--ink-4)}
.stx-search>svg{position:absolute;left:12px;top:50%;width:16px;height:16px;transform:translateY(-50%);fill:none;stroke:var(--ink-4);stroke-width:2;stroke-linecap:round;pointer-events:none}
.stx-pick .crx-select{height:38px;max-width:220px}
.stx-count{margin-left:auto;font-size:12.5px;font-weight:600;color:var(--ink-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.stx-tab-note{padding:9px 14px;border-bottom:1px solid var(--hair);font-size:12.5px;color:var(--ink-3);background:rgba(79,199,234,.04)}

.stx-scroll{max-height:none}
.stx-table{min-width:0}
.stx-th{padding:0!important}
.stx-sortbtn{display:flex;align-items:center;gap:5px;width:100%;min-height:40px;padding:8px 12px;font:inherit;font-size:12.5px;font-weight:600;line-height:1.25;color:var(--ink-3);text-align:inherit;white-space:normal}
.stx-sortbtn:hover{color:#fff}
.stx-th.r .stx-sortbtn{justify-content:flex-end;text-align:right}
.stx-th{vertical-align:bottom}
.stx-th-plain{display:block;padding:11px 12px}
.stx-sortbtn i{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;opacity:0}
.stx-th[aria-sort="ascending"] .stx-sortbtn i{opacity:1;border-bottom:5px solid var(--cyan,#4FC7EA)}
.stx-th[aria-sort="descending"] .stx-sortbtn i{opacity:1;border-top:5px solid var(--cyan,#4FC7EA)}
.stx-th[aria-sort="ascending"] .stx-sortbtn,.stx-th[aria-sort="descending"] .stx-sortbtn{color:#fff}
.stx-table td{padding:8px 12px}
.stx-table tbody tr[data-slug]{cursor:pointer}
.stx-table tr.is-live td{background:rgba(229,51,79,.035)}
.stx-n{width:1%;color:var(--ink-4)}
.stx-who-cell{min-width:0}
.stx .stx-who{display:flex;align-items:center;gap:10px;width:100%;min-height:40px;text-align:left;color:inherit}
.stx-who-text{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.stx-who-name{font-size:14px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}
.stx .stx-who:hover .stx-who-name{text-decoration:underline;text-underline-offset:3px}
.stx-who-sub{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--ink-4);white-space:nowrap}
.stx-state{display:inline-flex;align-items:center;gap:5px}
.stx-state.is-live{color:var(--down-l,#FF7A94);font-weight:700;font-variant-numeric:tabular-nums}
.stx-state.is-live i{width:7px;height:7px;border-radius:50%;background:#FF4D6A;box-shadow:0 0 0 3px rgba(255,77,106,.16)}
.stx-state.is-unknown{color:var(--gold,#F5C451);font-weight:600}
.stx-lang{padding:0 5px;border-radius:5px;border:1px solid var(--hair-2);font-size:12px;font-weight:700;color:var(--ink-3);letter-spacing:.03em}
.stx-new{padding:0 6px;border-radius:5px;background:rgba(79,199,234,.12);color:var(--cyan,#4FC7EA);font-size:12px;font-weight:700}
/* Identifiers (#708): Kick and the accounts the streamer links, as small icon links under the name (outside the
   button that opens the drawer, indented past the avatar). Phones and touch screens get them as full-size buttons
   in the drawer instead (below), so no tiny targets there. */
.stx-ids{display:flex;flex-wrap:nowrap;gap:3px;margin:4px 0 0 42px}
.stx .stx-id{display:grid;place-items:center;flex:0 0 auto;width:22px;height:22px;border-radius:6px;border:1px solid var(--hair);background:var(--card-2);color:var(--ink-3);transition:color .16s,border-color .16s,background .16s}
.stx .stx-id:hover,.stx .stx-id:focus-visible{color:#fff;border-color:rgba(79,199,234,.45);background:rgba(79,199,234,.1)}
.stx .stx-id:focus-visible{outline:2px solid var(--cyan,#4FC7EA);outline-offset:1px}
.stx-id-ic{display:block;width:13px;height:13px}
@media (max-width:767px),(pointer:coarse){.stx-table .stx-ids{display:none}}
.stx-table td.stx-cas{min-width:110px;white-space:normal;line-height:1.3}
.stx-cas-name{color:var(--ink);font-weight:600}
.stx-src{display:block;font-size:12px;color:var(--ink-4);font-style:italic;cursor:help}
.stx-na{color:var(--ink-4)}
.stx-hw b{color:#fff;font-weight:700}
.stx-live-txt{color:var(--down-l,#FF7A94);font-weight:700}
.stx-chg{font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.stx-chg.up{color:var(--up,#2ED47F)}
.stx-chg.down{color:var(--down-l,#FF7A94)}
.stx-chg.flat{color:var(--ink-3)}
.stx-chg.up::before{content:"▲ ";font-size:.8em}
.stx-chg.down::before{content:"▼ ";font-size:.8em}
.stx-table .stx-chg-col{display:none}
.stx-table.is-rising .stx-chg-col{display:table-cell}
.stx-spark-cell{width:1%}
.stx-spark{display:block;width:96px;height:24px}
.stx-spark polyline{fill:none;stroke:var(--cyan,#4FC7EA);stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.stx-spark.is-flat polyline{stroke:var(--ink-4);opacity:.5}
.stx-act{width:1%;padding:4px 8px!important}
.stx .stx-row-share{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;color:var(--ink-4);transition:color .16s,background .16s}
.stx .stx-row-share svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.stx .stx-row-share:hover,.stx .stx-row-share[aria-expanded="true"]{color:#fff;background:var(--card-2)}
.stx-more{justify-content:space-between;flex-wrap:wrap}
.stx-more-btns{display:flex;gap:8px;flex-wrap:wrap}

/* --------------------------------------------------------------------------
   Casinos view
   -------------------------------------------------------------------------- */

.stx-ops{min-width:0}
.stx-ops th{white-space:normal;line-height:1.25;vertical-align:bottom}
.stx-ops td{padding:9px 12px}
.stx-op{display:flex;align-items:center;gap:10px}
.stx-op-mark{display:grid;place-items:center;flex:0 0 auto;width:28px;height:28px;border-radius:8px;overflow:hidden;background:var(--card-2);border:1px solid var(--hair)}
.stx-op-mark img{width:100%;height:100%;object-fit:cover}
.stx-op-mark.is-mono{font:800 13px/1 var(--font-display,"Sora",sans-serif);color:var(--gold,#F5C451)}
.stx-op-name{font-weight:700;color:#fff}
.stx-share-cell{display:flex;align-items:center;gap:10px;min-width:170px}
.stx-bar{flex:1 1 auto;height:8px;border-radius:999px;background:var(--card-2);overflow:hidden;min-width:80px}
.stx-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2ED47F,#4FC7EA)}
.stx-share-cell b{min-width:48px;text-align:right;color:#fff;font-weight:700}
.stx-top{white-space:normal!important}
.stx-top-chip{display:inline-flex;align-items:center;gap:6px;margin:2px 8px 2px 0;padding:2px 9px 2px 2px;border-radius:999px;background:var(--card-2);border:1px solid var(--hair);font-size:12.5px;color:var(--ink-2);vertical-align:middle}
.stx-top-chip .stx-av{width:22px;height:22px;font-size:12px}
.stx .stx-top-chip:is(button):hover{border-color:rgba(79,199,234,.4);color:#fff}

/* --------------------------------------------------------------------------
   Method + note
   -------------------------------------------------------------------------- */

.stx-method{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (max-width:900px){.stx-method{grid-template-columns:1fr}}
.stx-method .crx-hint p,.stx-method .crx-hint ul{margin-top:5px;color:var(--ink-3)}
.stx-method .crx-hint ul{padding-left:18px;display:grid;gap:3px}
.stx-method .stx-refuse{border-color:rgba(245,196,81,.25);background:linear-gradient(180deg,rgba(245,196,81,.05),transparent),var(--card-2)}
.stx .crx-note{margin:6px 0 26px;font-size:13px;line-height:1.7;color:var(--ink-3)}
.stx .crx-note a{color:var(--cyan,#4FC7EA);text-decoration:underline;text-underline-offset:2px}
/* The shared FAQ meta and index numbers run at 11.5px; this page keeps the 12px floor. */
.stx .ct-fq-meta,.stx .ct-fq-meta *,.stx .ct-fq-ix{font-size:12px}

/* --------------------------------------------------------------------------
   Drawer
   -------------------------------------------------------------------------- */

body.stx-drawer-open{overflow:hidden}
.stx-overlay{position:fixed;inset:0;z-index:9990;background:rgba(7,9,15,.64)}
.stx-drawer{position:fixed;top:0;right:0;z-index:9991;width:min(680px,100%);height:100vh;height:100dvh;overflow-y:auto;overscroll-behavior:contain;background:var(--card);border-left:1px solid var(--hair-2);box-shadow:-28px 0 64px -38px rgba(0,0,0,.9)}
.stx-drawer:focus{outline:none}
.stx-d-banner{height:120px;background:radial-gradient(circle at 20% 0,rgba(79,199,234,.22),transparent 55%),linear-gradient(145deg,var(--card-2),var(--card));background-size:cover;background-position:center}
.stx-d-banner img{width:100%;height:100%;object-fit:cover}
.stx-d-head{display:flex;align-items:flex-start;gap:14px;padding:0 20px;margin-top:-34px}
.stx-d-head .stx-av{width:76px;height:76px;border:3px solid var(--card);font-size:26px}
.stx-d-title{min-width:0;flex:1 1 auto;padding-top:40px}
.stx .stx-d-title h2{font-size:21px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stx-d-meta{display:flex;flex-wrap:wrap;gap:2px 0;margin-top:3px;font-size:12.5px;color:var(--ink-3)}
.stx-d-meta span+span::before{content:"·";margin:0 7px;color:var(--ink-4)}
.stx .stx-d-close{flex:0 0 auto;display:grid;place-items:center;width:40px;height:40px;margin-top:42px;border-radius:50%;border:1px solid var(--hair-2);background:var(--card-2);color:var(--ink-2);font-size:22px;line-height:1}
.stx .stx-d-close:hover{color:#fff}
.stx-d-body{padding:14px 20px 40px}
.stx-d-now{margin-bottom:12px;padding:10px 12px;border-radius:11px;border:1px solid rgba(255,77,106,.22);background:rgba(255,77,106,.06);font-size:13px;color:var(--ink-2);line-height:1.55}
.stx-d-now b{color:var(--down-l,#FF7A94)}
.stx-d-now.is-unknown{border-color:rgba(245,196,81,.3);background:rgba(245,196,81,.06)}
.stx-d-now.is-unknown b{color:var(--gold,#F5C451)}
.stx-d-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.stx-d-idsec{margin:0 0 14px}
.stx .stx-d-idsec .stx-d-sec{margin:0 0 8px}
.stx-d-ids{display:flex;flex-wrap:wrap;gap:8px}
.stx .stx-d-id{display:inline-flex;align-items:center;gap:9px;min-width:44px;min-height:44px;max-width:100%;padding:5px 14px 5px 12px;border-radius:12px;border:1px solid var(--hair-2);background:var(--card-2);color:var(--ink-2);text-decoration:none;transition:color .16s,border-color .16s,background .16s}
.stx .stx-d-id:hover,.stx .stx-d-id:focus-visible{color:#fff;border-color:rgba(79,199,234,.45);background:rgba(79,199,234,.08)}
.stx .stx-d-id .stx-id-ic{flex:0 0 auto;width:18px;height:18px}
.stx-d-id-t{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.stx-d-id-t b{font-size:13px;font-weight:700;color:#fff}
.stx-d-id-t small{max-width:200px;overflow:hidden;font-size:12px;color:var(--ink-3);text-overflow:ellipsis;white-space:nowrap}
.stx-d-desc{margin:0 0 14px;padding-left:12px;border-left:2px solid var(--hair-2);font-size:13px;color:var(--ink-3);line-height:1.6}
.stx-d-desc cite{display:block;margin-top:3px;font-size:12px;font-style:normal;color:var(--ink-4)}
.stx .stx-d-sec{margin:22px 0 10px;font-family:var(--font-body,"Inter",sans-serif);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-4)}
.stx-d-sec small{margin-left:6px;font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--ink-4)}
.stx-d-range{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.stx .stx-d-range .stx-d-sec{margin:0}
.stx-d-range{margin-top:18px}
.stx-d-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.stx-d-card{padding:10px 12px;border:1px solid var(--hair);border-radius:11px;background:var(--card-2)}
.stx-d-card span{display:block;font-size:12px;font-weight:600;color:var(--ink-4)}
.stx-d-card b{display:block;margin-top:2px;font-size:18px;color:#fff}
.stx-d-share{margin-top:8px;font-size:12.5px;color:var(--ink-3)}
.stx-d-share b{color:var(--up,#2ED47F)}
.stx-d-chart{display:flex;align-items:flex-end;gap:1px;height:150px;border-bottom:1px solid var(--hair-2);background:repeating-linear-gradient(to top,transparent 0,transparent 37px,rgba(255,255,255,.04) 37px,rgba(255,255,255,.04) 38px)}
.stx .stx-d-col{flex:1 1 0;height:100%;display:flex;align-items:flex-end;border-radius:2px 2px 0 0;cursor:crosshair}
.stx-d-col i{display:block;width:100%;border-radius:2px 2px 0 0;background:linear-gradient(180deg,#4FC7EA,rgba(79,199,234,.5))}
.stx-d-col:hover i,.stx-d-col:focus-visible i{filter:brightness(1.3)}
.stx-d-col.is-pre i{height:100%!important;background:repeating-linear-gradient(135deg,rgba(169,175,196,.08) 0 3px,transparent 3px 6px)}
.stx-d-x{display:flex;justify-content:space-between;margin-top:5px;font-size:12px;color:var(--ink-4);font-variant-numeric:tabular-nums}
.stx-d-read{margin-top:6px;min-height:1.5em;font-size:12.5px;color:var(--ink-3)}
.stx-d-read b{color:var(--ink)}
.stx-heat{display:grid;grid-template-rows:repeat(7,12px);grid-auto-flow:column;grid-auto-columns:12px;gap:3px;overflow-x:auto;padding-bottom:2px}
.stx-heat i{display:block;width:12px;height:12px;border-radius:3px;background:var(--card-2);border:1px solid var(--hair)}
.stx-heat i.l1{background:rgba(46,212,127,.25);border-color:transparent}
.stx-heat i.l2{background:rgba(46,212,127,.45);border-color:transparent}
.stx-heat i.l3{background:rgba(46,212,127,.7);border-color:transparent}
.stx-heat i.l4{background:#2ED47F;border-color:transparent}
.stx-heat i.pre{background:transparent;border:1px dashed rgba(255,255,255,.08)}
.stx-heat i.out{visibility:hidden}
.stx-heat-key{display:flex;align-items:center;gap:4px;margin-top:6px;font-size:12px;color:var(--ink-4)}
.stx-heat-key i{display:inline-block;width:11px;height:11px;border-radius:3px}
.stx-d-sessions{width:100%;border-collapse:collapse}
.stx-d-sessions .stx-d-scas{display:block;margin-top:2px;font-size:12px;color:var(--ink-3)}
.stx-d-sessions th,.stx-d-sessions td{padding:7px 8px;border-bottom:1px solid var(--hair);font-size:12.5px;text-align:right;white-space:nowrap;vertical-align:middle}
.stx-d-sessions th{font-size:12px;font-weight:600;color:var(--ink-4)}
.stx-d-sessions th:first-child,.stx-d-sessions td:first-child{text-align:left}
.stx-d-sessions td.l{text-align:left}
.stx-d-sessions .stx-d-stitle{display:block;max-width:190px;overflow:hidden;text-overflow:ellipsis;font-size:12px;color:var(--ink-4)}
.stx-cat-badge{display:inline-block;padding:0 6px;border-radius:5px;font-size:12px;font-weight:700;background:rgba(46,212,127,.12);color:var(--up,#2ED47F)}
.stx-cat-badge.is-other{background:var(--card-2);color:var(--ink-3);font-weight:600}
.stx-curve{display:block;width:90px;height:22px;margin-left:auto}
.stx-curve polyline{fill:none;stroke:var(--cyan,#4FC7EA);stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.stx-d-bars{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.stx-d-bars li{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) auto;align-items:center;gap:10px;font-size:13px;color:var(--ink-2)}
.stx-d-bars li span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stx-d-bars .stx-bar i{background:linear-gradient(90deg,#A78BFA,#4FC7EA)}
.stx-d-bars b{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.stx-d-note{margin-top:16px;font-size:12.5px;color:var(--ink-4);line-height:1.6}
.stx-d-note a{color:var(--cyan,#4FC7EA);text-decoration:underline;text-underline-offset:2px}
.stx-d-empty{padding:14px;border-radius:10px;background:var(--card-2);font-size:13px;color:var(--ink-3)}

/* --------------------------------------------------------------------------
   Share buttons + dialog (the on-chain / weekly records pattern)
   -------------------------------------------------------------------------- */

.stx .stx-share-btn{gap:7px}
.stx .stx-share-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.stx [aria-busy="true"]{opacity:.6;cursor:progress}
.stx-share-pop{position:fixed;z-index:9995;left:12px;top:12px;width:400px;max-width:calc(100vw - 24px);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;padding:14px 16px 16px;border-radius:16px;background:var(--card,#1B2030);border:1px solid var(--hair-2);box-shadow:0 28px 70px -20px rgba(0,0,0,.85),0 0 0 1px rgba(79,199,234,.14);color:var(--ink);font-size:13px;line-height:1.45;text-align:left}
.stx-share-pop:focus{outline:none}
.stx-share-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.stx .stx-share-head h2{margin:0;font-size:16px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stx .stx-share-x{display:grid;place-items:center;flex:0 0 auto;width:36px;height:36px;margin-right:-8px;border-radius:50%;font-size:22px;line-height:1;color:var(--ink-3)}
.stx .stx-share-x:hover{color:#fff;background:rgba(255,255,255,.06)}
.stx-share-sub{margin:0 0 10px;color:var(--ink-3);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stx-share-frame{position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#12151F;border:1px solid var(--hair-2)}
.stx-share-frame.is-portrait{aspect-ratio:4/5;max-height:46vh;max-height:46dvh;margin:0 auto}
.stx-share-preview{display:block;width:100%;height:100%}
.stx-share-wait{position:absolute;inset:0;display:grid;place-items:center;margin:0;padding:14px 18px;background:#12151F;color:var(--ink-3);font-size:12.5px;text-align:center}
.stx-share-text{display:grid;gap:5px;margin:12px 0}
.stx-share-text span{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.stx .stx-share-text textarea{display:block;width:100%;margin:0;padding:8px 10px;border-radius:10px;border:1px solid var(--hair-2);background:var(--card-2);color:var(--ink);font:12.5px/1.5 var(--font-body,"Inter",sans-serif);resize:vertical;word-break:break-word}
.stx-share-acts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.stx .stx-share-act{display:flex;align-items:center;justify-content:center;gap:8px;height:42px;min-width:0;padding:0 10px;border-radius:10px;border:1px solid var(--hair-2);background:var(--card-2);color:var(--ink);font-size:13px;font-weight:600;line-height:1;text-decoration:none;white-space:nowrap}
.stx .stx-share-act span{overflow:hidden;text-overflow:ellipsis}
.stx .stx-share-act svg{width:16px;height:16px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.stx .stx-share-act svg.is-fill{fill:currentColor;stroke:none}
.stx .stx-share-act:hover{border-color:rgba(79,199,234,.5);background:rgba(79,199,234,.08);color:#fff}
.stx .stx-share-act.is-native,.stx .stx-share-act[data-stx-act="download"]{grid-column:1/-1}
.stx .stx-share-act.is-native{border-color:transparent;background:var(--grad-aa);color:#fff}
.stx .stx-share-act[aria-disabled="true"]{opacity:.45;cursor:not-allowed;pointer-events:none}
.stx .stx-share-act[data-stx-act="copy_image"][hidden]+.stx-share-act{grid-column:1/-1}
.stx-share-note{margin:10px 0 0;color:var(--gold,#F5C451);font-size:12px;line-height:1.45}
.stx-share-scrim{position:fixed;inset:0;z-index:9994;background:rgba(8,10,16,.6)}
.stx-share-pop.is-sheet{left:0;right:0;top:auto;bottom:0;width:auto;max-width:none;max-height:88vh;max-height:88dvh;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));border-radius:18px 18px 0 0;border-bottom:0}
.stx-share-pop.is-sheet .stx-share-act{height:48px}
.stx .stx-share-pop.is-sheet .stx-share-x{width:48px;height:48px;margin-right:-10px}
.stx-share-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:9996;max-width:calc(100vw - 32px);margin:0;padding:10px 16px;border-radius:999px;background:#0F1220;border:1px solid rgba(79,199,234,.45);color:var(--ink);font-size:13px;font-weight:600;text-align:center;opacity:0;pointer-events:none;transform:translate(-50%,8px);transition:opacity .2s,transform .2s}
.stx-share-toast.is-on{opacity:1;transform:translate(-50%,0)}
.stx-share-toast:empty{display:none}

/* --------------------------------------------------------------------------
   Breakpoints
   -------------------------------------------------------------------------- */

@media (max-width:1240px){
	.stx-table .stx-lg,.stx-ops .stx-lg{display:none}
	.stx-share-cell{min-width:130px}
}
@media (max-width:760px){
	.stx .crx-seg button,.stx .stx-share-btn,.stx-pick .crx-select,.stx-search input,.stx-sortbtn,.stx-switch,.stx .crx-more .crx-btn{min-height:48px}
	.stx-switch{font-size:14px}
	.stx-toolbar{padding:10px}
	.stx-tabs{overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap}
	.stx-tabs::-webkit-scrollbar{display:none}
	/* The platform chips wrap inside their own pill (a scrolling row would still widen the page's min-content). */
	.stx-plat{flex-wrap:wrap;border-radius:18px}
	.stx-search{flex-basis:100%;max-width:none}
	.stx-pick{flex:1 1 calc(50% - 5px);min-width:0}
	.stx-pick .crx-select{width:100%;max-width:none}
	.stx-count{width:100%;margin-left:0}
	.stx-table,.stx-ops{min-width:0}
	.stx-table .stx-sm,.stx-ops .stx-sm{display:none}
	.stx-table td,.stx-ops td{padding:8px 6px}
	.stx-ops th{padding:10px 6px}
	.stx-sortbtn{padding:8px 6px;min-width:44px}
	.stx-who-cell{min-width:0}
	.stx-who-name{max-width:150px}
	.stx .stx-row-share{width:44px;height:44px}
	.stx .stx-who{min-height:44px}
	.stx-share-cell{min-width:120px}
	.stx .stx-top-chip{min-height:44px}
	.stx-d-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
	.stx .stx-d-close{width:48px;height:48px}
	.stx-d-head{padding:0 14px}
	.stx-d-body{padding:12px 14px 36px}
}
@media (max-width:560px){
	.stx-table .stx-md,.stx-ops .stx-md{display:none}
	.stx-who-name{max-width:132px}
	.stx-who-sub{flex-wrap:wrap;white-space:normal;gap:2px 7px}
	.stx-op{min-width:0}
	.stx-op-name{max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
	.stx-share-cell{min-width:0}
	.stx-bar{min-width:36px}
	.stx-scope{padding:10px 12px}
}
@media (max-width:480px){
	.stx-table .stx-xs,.stx-ops .stx-xs{display:none}
	.stx-table.is-rising .stx-hw{display:none}
	.stx-who-name{max-width:112px}
	.stx-act{padding:4px 2px!important}
	.stx-who{gap:8px}
	.stx-av{width:28px;height:28px}
	.stx-op{gap:6px}
	.stx-op-mark{width:24px;height:24px}
	.stx-share-cell{gap:6px}
	.stx-share-cell b{min-width:40px}
	.stx-bar{min-width:24px}
}
@media (prefers-reduced-motion:reduce){
	.stx *{transition:none!important}
	.stx-share-toast{transition:none}
}