/* =====================================================================================
   Stream Today - shared creator-site STRUCTURE (mood-agnostic).
   Every template skin links this, then overrides ONLY design tokens (:root --st-*),
   fonts, background treatment, and its signature effects. Baseline treatment here is a
   clean neutral dark; the "sleek" skin is essentially this file with its tokens.
   All layout/components are driven by --st-* tokens so any palette re-themes instantly.
   ===================================================================================== */
:root{
  --st-bg:#0A0B0D; --st-surface:#141519; --st-surface2:#1b1c22;
  --st-text:#f5f6f8; --st-muted:#a1a1aa; --st-line:rgba(255,255,255,.09);
  --st-accent:var(--accent,#6366f1); --st-accent2:var(--accent,#22d3ee);
  --st-radius:16px;
  --st-font-display:'Sora',system-ui,sans-serif; --st-font-body:'Inter',system-ui,sans-serif;
  --st-maxw:1180px; --st-pad:26px;
  --st-shadow:0 30px 80px -30px rgba(0,0,0,.7);
  --st-cardshadow:none;
  --st-ease:.15s;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--st-bg);color:var(--st-text);font-family:var(--st-font-body);line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.st-wrap{max-width:var(--st-maxw);margin:0 auto;padding:0 var(--st-pad);width:100%}
/* never let a grid/flex parent shrink these to content width */
.st-merchgrid,.st-shopgrid,.st-vidgrid,.st-bento,.st-supgrid,.st-galgrid,.st-spongrid,.st-links,.st-sched,.st-gear,.st-faqs{width:100%}

/* ---- living background (aurora) + grain ---- */
.st-bg{position:fixed;inset:0;z-index:-2;overflow:hidden;pointer-events:none}
.st-bg span{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;will-change:transform}
.st-b1{width:52vw;height:52vw;left:-12vw;top:-16vw;background:radial-gradient(circle,color-mix(in srgb,var(--st-accent) 85%,transparent),transparent 65%);animation:stF1 26s ease-in-out infinite}
.st-b2{width:46vw;height:46vw;right:-14vw;top:8vw;background:radial-gradient(circle,color-mix(in srgb,var(--st-accent2) 80%,transparent),transparent 65%);animation:stF2 32s ease-in-out infinite}
.st-b3{width:40vw;height:40vw;left:22vw;bottom:-18vw;background:radial-gradient(circle,color-mix(in srgb,var(--st-accent) 55%,var(--st-accent2)),transparent 66%);opacity:.35;animation:stF3 38s ease-in-out infinite}
@keyframes stF1{50%{transform:translate(8vw,6vw) scale(1.15)}}
@keyframes stF2{50%{transform:translate(-7vw,9vw) scale(1.1)}}
@keyframes stF3{50%{transform:translate(6vw,-7vw) scale(1.2)}}
:root[data-bg="solid"] .st-bg{display:none}
:root.st-hasfx .st-bg{display:none}   /* an animated JS background is active - hide the CSS blobs */
.st-grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
:root[data-grain="0"] .st-grain{display:none}

/* ---- nav ---- */
.st-nav{position:sticky;top:0;z-index:40;backdrop-filter:blur(16px);
  background:color-mix(in srgb,var(--st-bg) 78%,transparent);border-bottom:1px solid var(--st-line)}
.st-navrow{display:flex;align-items:center;gap:12px;height:64px}
.st-brand{display:flex;align-items:center;gap:11px;font-family:var(--st-font-display);font-weight:800;font-size:16px;letter-spacing:-.01em}
.st-mk{width:34px;height:34px;border-radius:9px;overflow:hidden;background:var(--st-surface2);display:grid;place-items:center;
  font-family:var(--st-font-display);font-weight:800;color:var(--st-accent);border:1px solid var(--st-line);flex:0 0 auto}
.st-mk img{width:100%;height:100%;object-fit:cover}
.st-navsp{flex:1}
.st-navlinks{display:flex;gap:4px}
.st-navic{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;color:var(--st-muted);transition:color var(--st-ease),background var(--st-ease)}
.st-navic:hover{color:var(--st-text);background:var(--st-surface2)}
.st-navic svg{width:19px;height:19px}
.st-btn{font-family:var(--st-font-display);font-weight:600;font-size:14px;border-radius:11px;padding:10px 18px;cursor:pointer;
  border:1px solid var(--st-accent);background:var(--st-accent);color:#fff;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
  transition:filter var(--st-ease),box-shadow .2s,transform .12s;will-change:transform}
.st-btn:hover{filter:brightness(1.08);box-shadow:0 8px 26px -8px color-mix(in srgb,var(--st-accent) 70%,transparent)}
.st-btn.ghost{background:transparent;color:var(--st-text);border-color:var(--st-line)}
.st-btn.ghost:hover{background:var(--st-surface2);filter:none;box-shadow:none}
.st-btn.sm{padding:8px 13px;font-size:13px}
@media(max-width:720px){.st-navmod{display:none}.st-navlinks{display:none}}
.st-livedot{width:8px;height:8px;border-radius:50%;background:currentColor;flex:0 0 auto;animation:stPulse 2s infinite}
.st-btn .st-livedot{background:#fff}
@keyframes stPulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55)}70%{box-shadow:0 0 0 7px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}

/* ---- hero ---- */
.st-hero{position:relative;padding:78px 0 46px}
.st-heroglow{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .4s;z-index:0;
  background:radial-gradient(420px 420px at var(--mx,50%) var(--my,40%),color-mix(in srgb,var(--st-accent) 26%,transparent),transparent 70%)}
.st-herogrid{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:center}
.st-hero-center .st-herogrid,.st-hero-stack .st-herogrid{grid-template-columns:1fr;text-align:center;justify-items:center}
.st-hero-center .st-cta,.st-hero-stack .st-cta{justify-content:center}
@media(max-width:900px){.st-herogrid{grid-template-columns:1fr;gap:30px}.st-hero{padding:52px 0 26px}}
.st-eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--st-muted);border:1px solid var(--st-line);border-radius:999px;padding:6px 13px}
.st-eyebrow .st-livedot{color:var(--st-accent)}
.st-h1{font-family:var(--st-font-display);font-weight:800;font-size:clamp(46px,8.4vw,92px);line-height:.96;letter-spacing:-.038em;margin:22px 0 16px;word-break:break-word}
.st-herosub{font-size:clamp(16px,2vw,19px);color:var(--st-muted);max-width:40ch;margin-bottom:28px}
.st-hero-center .st-herosub,.st-hero-stack .st-herosub{margin-left:auto;margin-right:auto}
.st-cta{display:flex;gap:12px;flex-wrap:wrap}
.st-herovis{position:relative;border-radius:calc(var(--st-radius) + 6px);overflow:hidden;aspect-ratio:16/11;border:1px solid var(--st-line);
  background:radial-gradient(120% 120% at 15% 10%,color-mix(in srgb,var(--st-accent) 40%,var(--st-surface2)),var(--st-surface) 70%);
  box-shadow:var(--st-shadow)}
.st-herovis img,.st-herovis iframe{width:100%;height:100%;object-fit:cover;border:0}
.st-heromono{display:grid;place-items:center}
.st-heromono span{font-family:var(--st-font-display);font-weight:800;font-size:clamp(90px,17vw,150px);letter-spacing:-.05em;
  color:color-mix(in srgb,var(--st-accent) 65%,transparent)}
.st-hero-center .st-herovis,.st-hero-stack .st-herovis{aspect-ratio:16/9;max-width:900px;margin:8px auto 0}

/* ---- sections + heads ---- */
.st-section{padding:56px 0;position:relative}
.st-head{margin-bottom:26px}
.st-h2{font-family:var(--st-font-display);font-weight:700;font-size:clamp(24px,4vw,36px);letter-spacing:-.02em}
.st-sub{color:var(--st-muted);margin-top:6px;max-width:60ch}
.st-cgo{margin-left:auto;color:var(--st-muted);display:inline-flex;transition:transform .18s,color .18s}
.st-cgo svg{width:18px;height:18px}
.st-tilt:hover .st-cgo{transform:translateX(3px);color:var(--st-accent)}

/* ---- live ---- */
.st-liverow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.st-badge{display:inline-flex;align-items:center;gap:8px;font-family:var(--st-font-display);font-weight:700;font-size:13px;
  padding:8px 14px;border-radius:999px;border:1px solid var(--st-line);background:var(--st-surface)}
.st-badge .st-livedot{animation:none}
.st-badge-off{color:var(--st-muted)}.st-badge-off .st-livedot{background:var(--st-muted);animation:none}
.st-badge-on{color:#fff;background:#e23;border-color:#e23}.st-badge-on .st-livedot{background:#fff;animation:stPulse 1.6s infinite}
.st-livemeta{color:var(--st-muted);font-size:13.5px}
.st-player{border-radius:var(--st-radius);overflow:hidden;border:1px solid var(--st-line);background:#000;aspect-ratio:16/9;box-shadow:var(--st-shadow)}
.st-player iframe{width:100%;height:100%;border:0}
.st-16x9{aspect-ratio:16/9}

/* ---- videos ---- */
.st-vidgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.st-vcard{background:var(--st-surface);border:1px solid var(--st-line);border-radius:var(--st-radius);overflow:hidden;display:flex;flex-direction:column;transition:border-color .18s;box-shadow:var(--st-cardshadow)}
.st-vcard:hover{border-color:var(--st-accent)}
.st-vthumb{aspect-ratio:16/9;background:#000 center/cover no-repeat;display:grid;place-items:center;position:relative}
.st-vph{background:var(--st-surface2);color:var(--st-muted)}
.st-vph svg,.st-vplay svg{width:34px;height:34px}
.st-vplay{color:#fff;filter:drop-shadow(0 2px 8px rgba(0,0,0,.6));opacity:.92;position:relative;z-index:1}
.st-vthumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
/* clean centered play cue on video cards (own class so per-template .st-vplay skins don't apply) */
.st-vcue{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:rgba(10,10,12,.5);color:#fff;display:grid;place-items:center;z-index:1;backdrop-filter:blur(2px);transition:background .2s ease,transform .2s ease,opacity .2s ease;opacity:.9}
.st-vcue svg{width:22px;height:22px;margin-left:2px}
.st-vcard:hover .st-vcue{background:var(--st-accent);transform:translate(-50%,-50%) scale(1.08);opacity:1}
@media (prefers-reduced-motion:reduce){.st-vcue{transition:none}}
.st-vtitle{padding:12px 14px;font-weight:600;font-size:14px}
/* Latest-video facade: crisp maxres still + our play button; loads the iframe only on click */
.st-ytfacade{position:relative;display:block;width:100%;padding:0;border:1px solid var(--st-line);cursor:pointer;background:#000}
.st-ytfacade img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.st-ytplay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;height:76px;display:grid;place-items:center;border-radius:50%;background:rgba(10,10,12,.62);color:#fff;transition:transform .2s ease,background .2s ease;z-index:1}
.st-ytplay svg{width:30px;height:30px;margin-left:3px}
.st-ytfacade:hover .st-ytplay{transform:translate(-50%,-50%) scale(1.08);background:var(--st-accent)}
@media (prefers-reduced-motion:reduce){.st-ytplay{transition:none}}
.st-linkcta,.st-linkrow{display:flex;align-items:center;gap:13px;padding:16px 18px;border-radius:var(--st-radius);background:var(--st-surface);border:1px solid var(--st-line);transition:border-color .18s,transform .14s;box-shadow:var(--st-cardshadow)}
.st-linkcta:hover{border-color:var(--st-accent)}
.st-linkcta b{font-family:var(--st-font-display);font-weight:600}
.st-linkcta span:last-child{margin-left:auto;color:var(--st-muted);font-size:13px;display:inline-flex;align-items:center;gap:6px}
.st-linkcta svg{width:18px;height:18px}
.st-ci{width:40px;height:40px;border-radius:11px;background:var(--st-surface2);display:grid;place-items:center;color:var(--st-accent);flex:0 0 auto}
.st-ci svg{width:21px;height:21px}

/* ---- bento socials ---- */
.st-bento{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:900px){.st-bento{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.st-bento{grid-template-columns:1fr}}
.st-cell{position:relative;display:flex;align-items:center;gap:13px;padding:18px;border-radius:var(--st-radius);
  background:color-mix(in srgb,var(--st-surface) 75%,transparent);border:1px solid var(--st-line);overflow:hidden;
  backdrop-filter:blur(6px);transition:border-color .18s,transform .16s;will-change:transform;box-shadow:var(--st-cardshadow)}
.st-cell:hover{border-color:var(--st-accent)}
.st-cell::before{content:"";position:absolute;inset:0;opacity:0;transition:opacity .2s;pointer-events:none;
  background:radial-gradient(240px 240px at var(--st-gx,50%) var(--st-gy,50%),color-mix(in srgb,var(--st-accent) 22%,transparent),transparent 70%)}
.st-cell:hover::before{opacity:1}
.st-bento-hero .st-big{grid-column:span 2;grid-row:span 2;flex-direction:column;align-items:flex-start;justify-content:space-between;min-height:180px}
@media(max-width:520px){.st-bento-hero .st-big{grid-column:span 1;grid-row:auto;min-height:0;flex-direction:row;align-items:center}}
.st-ct{min-width:0}
.st-ct b{font-family:var(--st-font-display);font-weight:600;font-size:15px;display:block}
.st-ch{color:var(--st-muted);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.st-big .st-ci{width:52px;height:52px}.st-big .st-ci svg{width:26px;height:26px}
.st-big .st-ct b{font-size:19px}

/* ---- support / cta grids ---- */
.st-supgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.st-supcard,.st-contact{display:flex;align-items:center;gap:14px;padding:20px;border-radius:var(--st-radius);
  background:linear-gradient(135deg,color-mix(in srgb,var(--st-accent) 16%,var(--st-surface)),var(--st-surface2));
  border:1px solid var(--st-line);transition:transform .16s,border-color .18s;will-change:transform;box-shadow:var(--st-cardshadow)}
.st-supcard:hover,.st-contact:hover{border-color:var(--st-accent)}
.st-supcard b,.st-contact b{font-family:var(--st-font-display);font-weight:600;font-size:15px}
.st-contact{max-width:520px}

/* ---- about ---- */
.st-aboutrow{display:grid;grid-template-columns:.8fr 1.2fr;gap:36px;align-items:center}
.st-aboutrow.st-noimg{grid-template-columns:1fr;max-width:760px}
@media(max-width:820px){.st-aboutrow{grid-template-columns:1fr;gap:22px}}
.st-aboutimg img{width:100%;border-radius:calc(var(--st-radius) + 4px);border:1px solid var(--st-line);aspect-ratio:1;object-fit:cover}
.st-rich p{color:var(--st-muted);margin-bottom:12px;font-size:16px}
.st-rich p:last-child{margin-bottom:0}

/* ---- schedule ---- */
.st-tz{display:inline-block;color:var(--st-muted);font-size:13px;margin:-14px 0 16px}
.st-sched{display:flex;flex-direction:column;gap:10px}
.st-schrow{display:grid;grid-template-columns:150px 1fr auto;gap:14px;align-items:center;padding:16px 20px;border-radius:var(--st-radius);
  background:var(--st-surface);border:1px solid var(--st-line);transition:border-color .18s,transform .14s;will-change:transform;box-shadow:var(--st-cardshadow)}
.st-schrow:hover{border-color:var(--st-accent)}
.st-schday{font-family:var(--st-font-display);font-weight:700}
.st-schtitle{color:var(--st-muted)}
.st-schtime{font-family:var(--st-font-display);font-weight:600;color:var(--st-accent)}
@media(max-width:600px){.st-schrow{grid-template-columns:1fr auto}.st-schtitle{display:none}}

/* ---- sponsors ---- */
.st-spongrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.st-spon{height:96px;display:grid;place-items:center;padding:18px;border-radius:var(--st-radius);background:var(--st-surface);border:1px solid var(--st-line);
  transition:border-color .18s,transform .14s;will-change:transform;box-shadow:var(--st-cardshadow)}
.st-spon:hover{border-color:var(--st-accent)}
.st-spon img{max-height:52px;width:auto;object-fit:contain;filter:grayscale(1) brightness(1.4);opacity:.8;transition:filter .2s,opacity .2s}
.st-spon:hover img{filter:none;opacity:1}
.st-spon span{font-family:var(--st-font-display);font-weight:700;color:var(--st-muted)}

/* ---- merch ---- */
.st-merchgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
/* product cards share the class name .st-merch with the merch SECTION; templates that make the
   section span all columns (bento/panels/cabinet) must NOT make the cards span all - keep them in the grid */
.st-merchgrid>.st-merch,.st-shopgrid>.st-merch{grid-column:auto!important}
.st-merch{background:var(--st-surface);border:1px solid var(--st-line);border-radius:var(--st-radius);overflow:hidden;display:flex;flex-direction:column;transition:border-color .18s,transform .14s;will-change:transform;box-shadow:var(--st-cardshadow)}
.st-merch:hover{border-color:var(--st-accent)}
.st-merchimg{aspect-ratio:1;background:var(--st-surface2) center/cover no-repeat;display:grid;place-items:center;color:var(--st-muted)}
.st-merchimg svg{width:40px;height:40px}
.st-merchft{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 15px}
.st-merchft b{font-family:var(--st-font-display);font-weight:600;font-size:14px}
.st-price{color:var(--st-accent);font-weight:700;font-family:var(--st-font-display)}
.st-price .st-was,.st-mprice .st-was{color:var(--st-muted);font-weight:500;text-decoration:line-through;margin-right:6px;opacity:.8}
/* shop toolbar: collection chips + search */
.st-shopbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;justify-content:space-between;margin-bottom:20px}
.st-shopchips{display:flex;flex-wrap:wrap;gap:8px}
.st-chip{font:inherit;font-size:13px;font-weight:600;padding:7px 14px;border-radius:999px;cursor:pointer;color:var(--st-muted);background:var(--st-surface);border:1px solid var(--st-line);transition:color .15s,border-color .15s,background .15s}
.st-chip:hover{color:var(--st-text);border-color:var(--st-accent)}
.st-chip.on{color:var(--st-bg);background:var(--st-accent);border-color:var(--st-accent)}
.st-shopsearch input{font:inherit;font-size:14px;padding:9px 14px;border-radius:999px;color:var(--st-text);background:var(--st-surface);border:1px solid var(--st-line);min-width:200px;outline:none}
.st-shopsearch input:focus{border-color:var(--st-accent)}
.st-shopempty{grid-column:1/-1;color:var(--st-muted);padding:32px;text-align:center}
/* sale / sold-out badges on product cards */
.st-merchimgwrap{position:relative;display:block}
.st-merchbadge{position:absolute;top:10px;left:10px;z-index:2;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:5px 10px;border-radius:999px;font-family:var(--st-font-display)}
.st-merchbadge.st-sale{background:var(--st-accent);color:var(--st-bg)}
.st-merchbadge.st-sold{background:var(--st-surface2);color:var(--st-muted);border:1px solid var(--st-line)}
.st-merchbadge.st-low{background:#f5b301;color:#231a00}
/* product-card meta + star rating */
.st-merchmeta{display:flex;flex-direction:column;gap:3px;min-width:0}
.st-cardrating{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--st-muted)}
.st-cardstars{font-size:11px;letter-spacing:-1px;color:var(--st-line)}
.st-cardstars .st-star.on{color:#f5b301}
.st-cardrcount{font-size:11px}
/* "you may also like" */
.st-related{grid-column:1/-1;margin-top:20px;border-top:1px solid var(--st-line);padding-top:16px}
.st-relhd{font-family:var(--st-font-display);font-weight:700;font-size:15px;margin-bottom:12px}
.st-relgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.st-relcard{font:inherit;text-align:left;cursor:pointer;background:var(--st-surface2);border:1px solid var(--st-line);border-radius:12px;overflow:hidden;color:var(--st-text);display:flex;flex-direction:column;transition:border-color .15s,transform .15s}
.st-relcard:hover{border-color:var(--st-accent);transform:translateY(-3px)}
.st-relimg{aspect-ratio:1;background:var(--st-surface) center/cover no-repeat;display:grid;place-items:center;color:var(--st-muted)}
.st-relimg svg{width:26px;height:26px}
.st-reltitle{padding:8px 10px 2px;font-size:12.5px;font-weight:600;line-height:1.3}
.st-relprice{padding:0 10px 10px;font-size:12px;color:var(--st-accent);font-weight:700}
.st-lock{display:inline-flex;vertical-align:middle;margin-right:5px}.st-lock svg{width:13px;height:13px}
@media(max-width:680px){.st-relgrid{grid-template-columns:repeat(2,1fr)}.st-related{grid-column:auto}}
/* in-modal stock note */
.st-mstock{font-size:13px;font-weight:600;min-height:1.1em;margin:2px 0}
.st-mstock.st-low{color:var(--st-accent)}
.st-mstock.st-sold{color:var(--st-muted)}

/* ---- gear ---- */
.st-gear{display:flex;flex-direction:column;gap:8px}
.st-gearrow{display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:12px;background:var(--st-surface);border:1px solid var(--st-line);transition:border-color .18s;box-shadow:var(--st-cardshadow)}
.st-gearrow:hover{border-color:var(--st-accent)}
.st-gearlabel{color:var(--st-muted);min-width:120px}
.st-gearname{font-family:var(--st-font-display);font-weight:600}

/* ---- faq ---- */
.st-faqs{display:flex;flex-direction:column;gap:10px;max-width:820px}
.st-faq{background:var(--st-surface);border:1px solid var(--st-line);border-radius:12px;overflow:hidden}
.st-faq summary{list-style:none;cursor:pointer;padding:16px 18px;font-family:var(--st-font-display);font-weight:600;display:flex;align-items:center;justify-content:space-between;gap:10px}
.st-faq summary::-webkit-details-marker{display:none}
.st-faqx{color:var(--st-accent);font-size:22px;line-height:1;transition:transform .2s}
.st-faq[open] .st-faqx{transform:rotate(45deg)}
.st-faqa{padding:0 18px 16px;color:var(--st-muted)}
.st-faqa p{margin-bottom:8px}

/* ---- gallery ---- */
.st-galgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.st-galcell{position:relative;border-radius:var(--st-radius);overflow:hidden;border:1px solid var(--st-line);aspect-ratio:1;will-change:transform}
.st-galcell img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.st-galcell:hover img{transform:scale(1.06)}
.st-galcap{position:absolute;left:0;right:0;bottom:0;padding:10px 12px;font-size:12.5px;color:#fff;
  background:linear-gradient(0deg,rgba(0,0,0,.7),transparent)}

/* ---- links ---- */
.st-links{display:flex;flex-direction:column;gap:10px;max-width:640px}
.st-linkrow:hover{border-color:var(--st-accent)}
.st-linkrow b{font-family:var(--st-font-display);font-weight:600}

/* ---- marquee ---- */
.st-marquee{border-top:1px solid var(--st-line);border-bottom:1px solid var(--st-line);overflow:hidden;
  background:color-mix(in srgb,var(--st-surface) 60%,transparent);padding:15px 0;backdrop-filter:blur(6px)}
.st-mqtrack{display:inline-flex;white-space:nowrap;animation:stMq 36s linear infinite;will-change:transform}
/* reduced-motion: a frozen marquee shows doubled text and reads as broken — glide very slowly instead */
.st-mqtrack.st-still{animation-duration:150s}
.st-mqtrack span{font-family:var(--st-font-display);font-weight:800;font-size:18px;padding:0 22px;color:var(--st-text)}
.st-mqtrack span.a{color:var(--st-accent)}
@keyframes stMq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---- footer ---- */
.st-foot{border-top:1px solid var(--st-line);padding:30px 0;margin-top:20px}
.st-footrow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;color:var(--st-muted);font-size:13px}
.st-foot a{color:var(--st-accent)}

/* =========================== LAYOUT ARCHITECTURES ===========================
   Each template sets window.__ST_LAYOUT__ so the SAME content renders as a
   structurally different site (not just recolored). */
.st-flow{display:block}

/* profile hero (hub / bento) — link-in-bio: avatar + name + CTAs, no media box */
.st-hero-profile{text-align:center;padding:64px 0 22px}
.st-hero-profile .st-herocopy{display:flex;flex-direction:column;align-items:center;max-width:640px;margin:0 auto}
.st-avatar{width:120px;height:120px;border-radius:50%;overflow:hidden;border:2px solid var(--st-line);background:var(--st-surface2);display:grid;place-items:center;margin-bottom:18px;box-shadow:var(--st-shadow)}
.st-avatar img{width:100%;height:100%;object-fit:cover}
.st-avatar.st-heromono span{font-family:var(--st-font-display);font-weight:800;font-size:50px;color:var(--st-accent)}
.st-hero-profile .st-cta{justify-content:center}

/* full-screen spotlight hero */
.st-hero-full{min-height:86vh;display:flex;align-items:center}
.st-hero-full .st-herogrid{width:100%}

/* ---- HUB: narrow single column, no top nav, socials up front (Linktree/Bento vibe) ---- */
:root[data-layout="hub"] .st-nav{display:none}
:root[data-layout="hub"] .st-flow{max-width:600px;margin:0 auto}
:root[data-layout="hub"] .st-section{padding:24px 0}
:root[data-layout="hub"] .st-section .st-wrap{max-width:600px}
:root[data-layout="hub"] .st-bento{grid-template-columns:1fr 1fr}
:root[data-layout="hub"] .st-bento-hero .st-big{grid-column:span 2;grid-row:auto;min-height:0;flex-direction:row;align-items:center}
:root[data-layout="hub"] .st-player,:root[data-layout="hub"] .st-supgrid{grid-template-columns:1fr}

/* ---- BENTO: content mosaic (glass tiles of mixed sizes) ---- */
:root[data-layout="bento"] .st-flow{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:16px;padding:0 var(--st-pad);align-items:start;grid-auto-flow:row dense}
:root[data-layout="bento"] .st-section{padding:0}
:root[data-layout="bento"] .st-section .st-wrap{max-width:none;padding:22px;background:color-mix(in srgb,var(--st-surface) 68%,transparent);border:1px solid var(--st-line);border-radius:var(--st-radius);backdrop-filter:blur(8px)}
:root[data-layout="bento"] .st-live,:root[data-layout="bento"] .st-videos,:root[data-layout="bento"] .st-cta.st-section{grid-column:span 2}
@media(max-width:720px){:root[data-layout="bento"] .st-flow{grid-template-columns:1fr}:root[data-layout="bento"] .st-live,:root[data-layout="bento"] .st-videos{grid-column:auto}}

/* ---- MAGAZINE: newspaper-style multi-column flow ---- */
:root[data-layout="magazine"] .st-flow{max-width:1160px;margin:0 auto;padding:0 var(--st-pad)}
@media(min-width:880px){
  :root[data-layout="magazine"] .st-flow{columns:2;column-gap:44px}
  :root[data-layout="magazine"] .st-section{break-inside:avoid;-webkit-column-break-inside:avoid;display:inline-block;width:100%;padding:22px 0}
  :root[data-layout="magazine"] .st-section .st-wrap{max-width:none;padding:0}
  :root[data-layout="magazine"] .st-live,:root[data-layout="magazine"] .st-socials{column-span:all}
}

/* ---- SIDEBAR: fixed left rail, content scrolls right ---- */
.st-shell{display:grid;grid-template-columns:300px 1fr;min-height:100vh}
.st-side{position:sticky;top:0;height:100vh;align-self:start;display:flex;flex-direction:column;gap:16px;padding:34px 26px;
  border-right:1px solid var(--st-line);background:color-mix(in srgb,var(--st-surface) 55%,transparent);backdrop-filter:blur(8px)}
.st-side .st-brand{font-size:22px}
.st-side .st-navlinks{flex-wrap:wrap;gap:6px}
.st-sidetag{color:var(--st-muted);font-size:14px;line-height:1.5}
.st-side .st-navmod{margin-top:auto}
.st-mainc{min-width:0}
:root[data-layout="sidebar"] .st-hero{padding:44px 0 20px}
:root[data-layout="sidebar"] .st-herogrid{grid-template-columns:1fr}
:root[data-layout="sidebar"] .st-herovis{display:none}
@media(max-width:820px){.st-shell{grid-template-columns:1fr}.st-side{position:static;height:auto;border-right:0;border-bottom:1px solid var(--st-line);flex-direction:row;flex-wrap:wrap;align-items:center}.st-side .st-navmod{margin-top:0;margin-left:auto}}

/* ---- PANELS (y2k windowed): each section a framed window ---- */
:root[data-layout="panels"] .st-flow{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:18px;padding:0 var(--st-pad);align-items:start;grid-auto-flow:row dense}
:root[data-layout="panels"] .st-section{padding:0}
:root[data-layout="panels"] .st-section .st-wrap{max-width:none;padding:20px;border:1px solid var(--st-line);border-radius:var(--st-radius);background:var(--st-surface)}
:root[data-layout="panels"] .st-live,:root[data-layout="panels"] .st-videos{grid-column:span 2}
@media(max-width:720px){:root[data-layout="panels"] .st-flow{grid-template-columns:1fr}:root[data-layout="panels"] .st-live,:root[data-layout="panels"] .st-videos{grid-column:auto}}

/* ---- CABINET (arcade HUD): heavy-bordered panel grid ---- */
:root[data-layout="cabinet"] .st-flow{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding:0 var(--st-pad);align-items:start;grid-auto-flow:row dense}
:root[data-layout="cabinet"] .st-section{padding:0}
:root[data-layout="cabinet"] .st-section .st-wrap{max-width:none;padding:18px;border:2px solid var(--st-accent);background:var(--st-surface)}
:root[data-layout="cabinet"] .st-live,:root[data-layout="cabinet"] .st-videos,:root[data-layout="cabinet"] .st-socials{grid-column:span 2}
@media(max-width:720px){:root[data-layout="cabinet"] .st-flow{grid-template-columns:1fr}:root[data-layout="cabinet"] .st-live,:root[data-layout="cabinet"] .st-videos,:root[data-layout="cabinet"] .st-socials{grid-column:auto}}

/* ---- store: product modal, cart drawer, cart FAB ---- */
.st-shoploading{color:var(--st-muted);font-size:14px;padding:8px 2px}
.st-merch[disabled]{opacity:.55;cursor:default}
.st-merch{font:inherit;text-align:left;cursor:pointer;color:inherit}
.st-modal{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:20px;animation:stFade .18s ease}
@keyframes stFade{from{opacity:0}}
.st-modalbox{position:relative;width:min(880px,100%);max-height:90vh;overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:0;
  background:var(--st-surface);border:1px solid var(--st-line);border-radius:calc(var(--st-radius) + 4px);box-shadow:0 40px 100px -30px rgba(0,0,0,.7)}
@media(max-width:680px){.st-modalbox{grid-template-columns:1fr}}
.st-mx{position:absolute;top:12px;right:12px;z-index:2;width:34px;height:34px;border-radius:50%;border:1px solid var(--st-line);background:var(--st-surface2);color:var(--st-text);cursor:pointer;font-size:15px}
.st-mgal{position:relative;background:var(--st-surface2);min-height:300px;display:grid;place-items:center;overflow:hidden}
.st-mgal img{width:100%;height:100%;object-fit:cover}
.st-mgal.st-vph{color:var(--st-muted)}.st-mgal.st-vph svg{width:56px;height:56px}
.st-mdots{position:absolute;bottom:12px;left:0;right:0;display:flex;gap:6px;justify-content:center}
.st-mdots button{width:8px;height:8px;border-radius:50%;border:0;background:rgba(255,255,255,.5);cursor:pointer}
.st-mdots button.on{background:#fff}
.st-minfo{padding:26px 26px 24px}
.st-minfo h3{font-family:var(--st-font-display);font-weight:700;font-size:24px;margin-bottom:6px}
.st-mprice{font-family:var(--st-font-display);font-weight:700;color:var(--st-accent);font-size:20px;margin-bottom:14px}
.st-mdesc{color:var(--st-muted);font-size:14.5px;margin-bottom:14px}
.st-mtag{display:inline-block;font-size:12px;color:var(--st-accent);border:1px solid var(--st-line);border-radius:999px;padding:4px 10px;margin-bottom:14px}
.st-mvar{display:block;margin-bottom:14px}
.st-mvarlbl,.st-mvar span{display:block;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--st-muted);margin-bottom:7px}
/* variant pills (theme-styled, readable on every skin — replaces native <select>) */
.st-mopts{display:flex;flex-wrap:wrap;gap:8px}
.st-mopt{font:inherit;font-weight:600;font-size:14px;padding:9px 16px;min-width:44px;border-radius:10px;cursor:pointer;
  background:var(--st-surface2);border:1.5px solid var(--st-line);color:var(--st-text);transition:border-color .15s,background .15s,color .15s}
.st-mopt:hover{border-color:var(--st-accent)}
.st-mopt.on{background:var(--st-accent);border-color:var(--st-accent);color:var(--st-bg)}
.st-mopt.st-optsold{opacity:.45;cursor:not-allowed;text-decoration:line-through}
.st-mopt.st-optsold:hover{border-color:var(--st-line)}
/* legacy select fallback (if any theme still renders one) */
.st-mvar select{width:100%;background:var(--st-surface2);border:1px solid var(--st-line);border-radius:10px;color:var(--st-text);padding:10px 12px;font:inherit}
.st-mvar select option{background:var(--st-bg,#111);color:var(--st-text,#fff)}
.st-mact{margin-top:18px;display:flex;flex-direction:column;gap:12px}
.st-mqty{display:inline-flex;align-items:center;gap:2px;border:1px solid var(--st-line);border-radius:10px;overflow:hidden;width:max-content}
.st-mqty button{width:38px;height:40px;border:0;background:var(--st-surface2);color:var(--st-text);font-size:18px;cursor:pointer}
.st-mqty input,.st-mqty span{width:46px;text-align:center;background:transparent;border:0;color:var(--st-text);font:600 15px var(--st-font-body)}
.st-mbuy,.st-madd,.st-checkout{width:100%;justify-content:center}
.st-cartfab{position:fixed;right:20px;bottom:20px;z-index:70;width:56px;height:56px;border-radius:50%;border:0;cursor:pointer;
  background:var(--st-accent);color:#fff;display:grid;place-items:center;box-shadow:0 12px 30px -8px color-mix(in srgb,var(--st-accent) 70%,transparent)}
.st-cartfab svg{width:24px;height:24px}
.st-cartn{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;border-radius:10px;background:var(--st-text);color:var(--st-bg);font:700 11px var(--st-font-body);display:grid;place-items:center;padding:0 5px}
.st-cartov{justify-content:flex-end;padding:0}
.st-cartbox{width:min(420px,100%);height:100%;overflow:auto;background:var(--st-surface);border-left:1px solid var(--st-line);display:flex;flex-direction:column;padding:18px;animation:stSlide .22s ease}
@keyframes stSlide{from{transform:translateX(30px);opacity:.6}}
.st-carthd{display:flex;align-items:center;justify-content:space-between;font-family:var(--st-font-display);font-size:18px;margin-bottom:14px}
.st-carthd .st-mx{position:static}
.st-cartlist{flex:1;display:flex;flex-direction:column;gap:12px}
.st-crow{display:grid;grid-template-columns:56px 1fr auto auto;gap:10px;align-items:center;border-bottom:1px solid var(--st-line);padding-bottom:12px}
.st-crow img{width:56px;height:56px;object-fit:cover;border-radius:10px;background:var(--st-surface2)}
.st-cmeta{min-width:0}.st-cmeta b{display:block;font-size:14px;font-family:var(--st-font-display)}
.st-cvar{display:block;color:var(--st-muted);font-size:12px}
.st-cprice{color:var(--st-accent);font-size:13px;font-weight:600}
.st-crm{border:0;background:transparent;color:var(--st-muted);cursor:pointer;font-size:14px}
.st-cempty{color:var(--st-muted);padding:30px 0;text-align:center}
.st-promo{display:flex;gap:8px;margin:14px 0 4px}
.st-promo input{flex:1;background:var(--st-surface2);border:1px solid var(--st-line);border-radius:10px;color:var(--st-text);padding:10px 12px;font:inherit}
.st-promobtn{background:var(--st-surface2);border:1px solid var(--st-line);border-radius:10px;color:var(--st-text);padding:0 14px;cursor:pointer;font:600 13px var(--st-font-body)}
.st-promomsg{font-size:12.5px;min-height:16px;margin-bottom:4px}
.st-promomsg.ok{color:var(--st-accent)}.st-promomsg.bad{color:#e23}
.st-cartft{display:flex;align-items:center;justify-content:space-between;font-family:var(--st-font-display);font-size:18px;margin:14px 0}
.st-cnote{color:var(--st-muted);font-size:11.5px;text-align:center;margin-top:8px}
.st-embedov{align-items:flex-start;padding:0;overflow:auto}
.st-embedbox{position:relative;width:min(680px,100%);margin:24px auto;background:var(--st-surface);border:1px solid var(--st-line);border-radius:calc(var(--st-radius) + 4px);padding:20px;box-shadow:0 40px 100px -30px rgba(0,0,0,.7)}
.st-embedbox .st-mx{position:absolute;top:12px;right:12px;z-index:2}
#st-embed{min-height:320px}
.st-reviews{grid-column:1/-1;border-top:1px solid var(--st-line);margin-top:20px;padding-top:18px}
.st-revhd{display:flex;align-items:center;justify-content:space-between;font-family:var(--st-font-display);margin-bottom:12px}
.st-revavg{font-size:14px;color:var(--st-muted)}
.st-star{color:var(--st-line)}.st-star.on{color:#f5b301}
.st-revlist{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}
.st-rev{background:var(--st-surface2);border:1px solid var(--st-line);border-radius:12px;padding:12px 14px}
.st-revtop{display:flex;align-items:center;gap:8px;margin-bottom:4px;flex-wrap:wrap}.st-revtop b{font-size:13px}
.st-revstars{font-size:13px}
.st-rev p{color:var(--st-muted);font-size:14px}
.st-revverif{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:#1a9d5a;background:rgba(26,157,90,.12);border:1px solid rgba(26,157,90,.3);padding:2px 8px;border-radius:999px}
.st-revverif svg{width:12px;height:12px}
.st-revform{display:flex;flex-direction:column;gap:8px}
.st-revnote{font-size:12.5px;color:var(--st-muted);background:var(--st-surface2);border:1px solid var(--st-line);border-radius:10px;padding:8px 12px}
.st-revrow2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.st-revrate{font-size:22px;cursor:pointer;user-select:none}.st-revrate .st-star{transition:color .1s}
.st-revname,.st-revbody,.st-revemail,.st-revref{background:var(--st-surface2);border:1px solid var(--st-line);border-radius:10px;color:var(--st-text);padding:10px 12px;font:inherit;width:100%}
.st-revname:focus,.st-revbody:focus,.st-revemail:focus,.st-revref:focus{outline:none;border-color:var(--st-accent)}
.st-revbody{min-height:70px;resize:vertical}
.st-revmsg{font-size:12.5px;color:var(--st-accent);min-height:15px}
.st-revmsg.bad{color:#ff6b7a}
@media(max-width:680px){.st-reviews{grid-column:auto}.st-revrow2{grid-template-columns:1fr}}
/* ---- customer order-history page (/store-orders), themed via --st-* tokens ---- */
.st-ordbox{max-width:460px;background:var(--st-surface);border:1px solid var(--st-line);border-radius:var(--st-radius);padding:24px;box-shadow:var(--st-cardshadow)}
.st-ordbox .st-mvarlbl{margin-top:6px}
.st-ordbox .st-btn{margin-top:14px;width:100%;justify-content:center}
.st-omsg{font-size:13px;color:var(--st-accent);min-height:1em;margin-top:10px}.st-omsg.bad{color:#ff6b7a}
.st-ordlist{display:flex;flex-direction:column;gap:14px;max-width:640px;margin-top:20px}
.st-ord{background:var(--st-surface);border:1px solid var(--st-line);border-radius:var(--st-radius);padding:18px 20px;box-shadow:var(--st-cardshadow)}
.st-ordtop{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px}
.st-ordtop b{font-family:var(--st-font-display);font-size:15px}
.st-ordbadge{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:4px 10px;border-radius:999px;background:color-mix(in srgb,var(--st-accent) 20%,transparent);color:var(--st-accent)}
.st-ordbadge.st-refunded,.st-ordbadge.st-disputed{background:#3a2323;color:#ff9a9a}
.st-ordsub{font-size:13px;color:var(--st-muted);margin-bottom:10px}
.st-orditem{display:flex;justify-content:space-between;gap:10px;font-size:14px;padding:3px 0;color:var(--st-text)}
.st-ordmeta{font-size:13px;color:var(--st-muted);margin-top:8px;border-top:1px solid var(--st-line);padding-top:8px}.st-ordmeta a{color:var(--st-accent)}
.st-ordback{display:inline-block;margin-top:22px;color:var(--st-muted);text-decoration:none;font-size:14px}.st-ordback:hover{color:var(--st-text)}

/* ---- reveals ---- */
[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
[data-reveal].in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important}
  [data-reveal]{opacity:1!important;transform:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

/* ============================================================
   DONATION "tip page" (engine __ST_PAGE__=donate) - a premium glass
   card built from each theme's own tokens so it matches the site.
   ============================================================ */
.st-donpanel{max-width:560px;margin:0 auto;display:flex;flex-direction:column;gap:22px;}
.st-donhead{text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px;}
.st-donhead .st-h1{margin:0;}
.st-donhead .st-herosub{margin:0;max-width:44ch;}
/* the card */
.st-doncard{
  display:flex;flex-direction:column;gap:16px;padding:clamp(20px,4vw,30px);
  border-radius:calc(var(--st-radius,18px) + 4px);
  background:color-mix(in srgb, var(--st-text,#fff) 5%, transparent);
  border:1px solid var(--st-line,rgba(255,255,255,.12));
  box-shadow:0 30px 70px -34px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(14px) saturate(1.2); -webkit-backdrop-filter:blur(14px) saturate(1.2);
  position:relative;overflow:hidden;
}
.st-doncard::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,transparent,var(--st-accent,#6d5efc),transparent);opacity:.8;}
.st-donlabel{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--st-muted,#8a90a2);font-weight:700;}
/* amount buttons */
.st-donamts{display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
.st-donamt{
  padding:12px 18px;border-radius:14px;cursor:pointer;font-weight:800;font-size:16px;min-width:70px;
  color:var(--st-text,#eee);border:1.5px solid var(--st-line,rgba(255,255,255,.14));
  background:color-mix(in srgb, var(--st-text,#fff) 4%, transparent);
  transition:transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.st-donamt:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--st-accent,#6d5efc) 55%,transparent);}
.st-donamt.active{background:var(--st-accent,#6d5efc);color:#fff;border-color:transparent;box-shadow:0 10px 26px -10px color-mix(in srgb,var(--st-accent,#6d5efc) 80%,transparent);}
.st-doncustom{display:inline-flex;align-items:center;gap:0;position:relative;}
.st-doncustom>span{position:absolute;left:12px;opacity:.6;font-weight:700;pointer-events:none;}
.st-donother{width:110px;padding-left:24px !important;}
/* inputs — theme-consistent (never white-on-dark) */
.st-doninput{
  width:100%;padding:13px 15px;border-radius:13px;font-family:inherit;font-size:15px;
  color:var(--st-text,#eee);border:1.5px solid var(--st-line,rgba(255,255,255,.14));
  background:color-mix(in srgb, var(--st-text,#fff) 5%, transparent);
  transition:border-color .18s ease, box-shadow .18s ease;
}
.st-doninput::placeholder{color:var(--st-muted,#8a90a2);opacity:.85;}
.st-doninput:focus{outline:none;border-color:var(--st-accent,#6d5efc);box-shadow:0 0 0 3px color-mix(in srgb,var(--st-accent,#6d5efc) 22%,transparent);}
textarea.st-donmsg{resize:vertical;min-height:82px;line-height:1.5;}
.st-donfield{position:relative;display:flex;flex-direction:column;gap:4px;}
.st-doncount{font-size:12px;color:var(--st-muted,#8a90a2);text-align:right;}
/* TTS toggle switch */
.st-dontts{display:flex;align-items:center;gap:12px;cursor:pointer;user-select:none;font-size:14.5px;color:var(--st-text,#eee);}
.st-dontts input{position:absolute;opacity:0;width:0;height:0;}
.st-donttsw{position:relative;width:44px;height:25px;border-radius:999px;flex:none;transition:background .2s ease, border-color .2s ease;
  background:color-mix(in srgb, var(--st-text,#fff) 15%, transparent);border:1px solid var(--st-line,rgba(255,255,255,.14));}
.st-donttsw::after{content:"";position:absolute;top:2px;left:2px;width:19px;height:19px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.4);transition:transform .2s ease;}
.st-dontts input:checked + .st-donttsw{background:var(--st-accent,#6d5efc);border-color:transparent;}
.st-dontts input:checked + .st-donttsw::after{transform:translateX(19px);}
.st-dontts input:focus-visible + .st-donttsw{box-shadow:0 0 0 3px color-mix(in srgb,var(--st-accent,#6d5efc) 30%,transparent);}
/* pay + footnotes */
.st-donpay{width:100%;justify-content:center;font-size:16.5px;padding:15px 24px;margin-top:2px;}
.st-donmsgline{font-size:13px;min-height:17px;color:var(--st-muted,#8a90a2);}
.st-donmsgline.bad{color:#ff6b6b;}
.st-donor{display:flex;align-items:center;gap:12px;margin:4px 0 2px;color:var(--st-muted,#8a90a2);font-size:12px;text-transform:uppercase;letter-spacing:.12em;}
.st-donor::before,.st-donor::after{content:"";flex:1;height:1px;background:var(--st-line,rgba(255,255,255,.12));}
.st-donpaypal{min-height:44px;margin-top:2px;}
.st-donsecure{font-size:12.5px;color:var(--st-muted,#8a90a2);text-align:center;margin:2px 0 0;opacity:.9;}
.st-dontotal{font-size:13.5px;color:var(--st-muted,#8a90a2);text-align:center;margin:0;}
.st-donthanks{background:color-mix(in srgb,var(--st-accent,#6d5efc) 15%,transparent);border:1px solid color-mix(in srgb,var(--st-accent,#6d5efc) 42%,transparent);border-radius:14px;padding:14px 16px;font-size:14.5px;text-align:center;color:var(--st-text,#eee);}

/* Public "Support the stream" tip section (injected by the engine when tips are live) */
.st-tipsec .st-tipsecwrap{text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px;}
.st-tipsec .st-h2{margin:0;}
.st-tipsec .st-h2::after{margin-left:auto;margin-right:auto;}
.st-tipsecsub{max-width:48ch;margin:0;color:var(--st-muted,#8a90a2);}
.st-tipsecbtn{font-size:16px;padding:14px 30px;}
.st-tipsecstat{font-size:13px;color:var(--st-muted,#8a90a2);opacity:.85;}
.st-tipwall{width:100%;max-width:640px;margin-top:8px;}
.st-tipwallhd{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--st-muted,#8a90a2);margin-bottom:12px;}
.st-tipwallgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;}
.st-tipwallcard{display:flex;align-items:center;gap:9px;padding:11px 13px;border-radius:14px;background:var(--st-surface2,rgba(255,255,255,.04));border:1px solid var(--st-line,rgba(255,255,255,.08));text-align:left;}
.st-tipwallcard.top{border-color:color-mix(in srgb,var(--st-accent,#a855f7) 45%,transparent);background:color-mix(in srgb,var(--st-accent,#a855f7) 8%,var(--st-surface2,rgba(255,255,255,.04)));}
.st-tipwallrank{font-size:15px;min-width:22px;text-align:center;font-weight:700;color:var(--st-muted,#8a90a2);}
.st-tipwallcard.top .st-tipwallrank{font-size:18px;}
.st-tipwallname{flex:1;font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.st-tipwallamt{font-weight:800;font-size:14px;color:var(--st-accent,#a855f7);}
.st-donttshint{font-size:12px;color:var(--st-muted,#8a90a2);opacity:.85;margin-top:-6px;line-height:1.4;}
.st-donfinal{font-size:12px;color:var(--st-muted,#8a90a2);text-align:center;margin:2px 0 0;opacity:.75;letter-spacing:.02em;}
/* donate: Twitch sign-in / anonymous identity */
.st-donid{display:flex;flex-direction:column;gap:6px;}
.st-dontwitch{background:#9146ff;border-color:#9146ff;color:#fff;justify-content:center;width:100%;}
.st-dontwitch:hover{filter:brightness(1.08);}
.st-donsignedin{font-size:14.5px;color:var(--st-text,#eee);padding:11px 14px;border-radius:12px;border:1px solid color-mix(in srgb,var(--st-accent,#6d5efc) 40%,transparent);background:color-mix(in srgb,var(--st-accent,#6d5efc) 12%,transparent);}
.st-donsignedin b{color:var(--st-accent,#6d5efc);}
.st-donsignout{font-size:12px;color:var(--st-muted,#8a90a2);margin-left:6px;text-decoration:underline;}
.st-donanon{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--st-muted,#8a90a2);cursor:pointer;user-select:none;margin-top:-2px;}
.st-donanon input{width:16px;height:16px;accent-color:var(--st-accent,#6d5efc);cursor:pointer;}
