

:root{
  
  --font-body:"Inter","Plus Jakarta Sans","Segoe UI",Roboto,system-ui,sans-serif;
  --font-display:"Inter","Plus Jakarta Sans",system-ui,sans-serif;

  
  --bg:#101115;
  --bg-panel:#191a20;
  --bg-2:#191a20;
  --bg-3:#22232c;
  --bg-4:#2b2c37;
  --bg-canvas:#101115; --bg-surface:#191a20; --bg-surface-2:#22232c; --bg-elevate:#2b2c37;
  --bg-glass:rgba(16,17,21,.82);
  --bg-stage:#101115;

  
  --line:#2d2e39;
  --line-soft:#24252e;
  --bd-strong:#3a3b48;

  
  --txt:#f1f1f5;
  --txt-dim:#a1a3b4;
  --txt-mut:#6e7082;

  
  --accent:#b29aff;
  --accent-2:#c9b9ff;
  --accent-3:#7654d6;
  --accent-h:#8468e0;
  --accent-ring:rgba(178,154,255,.30);
  --accent-blue:#b29aff;
  --grad:linear-gradient(120deg,#7654d6,#b29aff);
  --violet:#b29aff;
  --violet-2:#c9b9ff;
  --violet-dim:rgba(178,154,255,.13);

  
  --ok:#73d8b0;    --ok-dim:rgba(115,216,176,.13);
  --warn:#edc774;  --warn-2:#f5d896; --warn-dim:rgba(237,199,116,.13);
  --danger:#ff94aa;--danger-h:#ff7a95; --danger-dim:rgba(255,148,170,.13);
  --gold:#edc774;  --gold-2:#f5d896;

  
  --ac-soft:#292239;
  --ac-dim:rgba(118,84,214,.18);
  --ac-mid:rgba(178,154,255,.32);

  
  --dv-1:#9a6dff;   
  --dv-2:#c67f1a;   
  --dv-3:#e8557f;   
  --dv-grid:rgba(255,255,255,.055);
  --dv-axis:#6e7082;

  --radius:14px;
  --grid-dot:rgba(178,154,255,.07);
  --stage-shadow:none;
  --shadow:0 10px 30px rgba(0,0,0,.4);
}

:root{ --on-accent:#16111f; }
html[data-bvmode="light"]{ --on-accent:#ffffff; }

html[data-bvmode="light"]{
  --bg:#f4f5f8;
  --bg-panel:#ffffff;
  --bg-2:#ffffff;
  --bg-3:#f0f1f5;
  --bg-4:#e6e8ef;
  --bg-canvas:#f4f5f8; --bg-surface:#ffffff; --bg-surface-2:#f0f1f5; --bg-elevate:#e6e8ef;
  --bg-glass:rgba(244,245,248,.85);
  --bg-stage:#f4f5f8;

  --line:#e1e2ea;
  --line-soft:#ecedf2;
  --bd-strong:#cdcfdb;

  --txt:#20212c;
  --txt-dim:#656777;
  --txt-mut:#8e90a1;

  --accent:#6b45d5;
  --accent-2:#5a37bd;
  --accent-3:#7654d6;
  --accent-h:#6b45d5;
  --accent-ring:rgba(107,69,213,.28);
  --accent-blue:#6b45d5;
  --grad:linear-gradient(120deg,#7654d6,#9a7ae8);
  --violet:#6b45d5;
  --violet-2:#5a37bd;
  --violet-dim:rgba(107,69,213,.10);

  --ok:#147957;    --ok-dim:rgba(20,121,87,.10);
  --warn:#946514;  --warn-2:#7a5210; --warn-dim:rgba(148,101,20,.10);
  --danger:#ad3551;--danger-h:#93283f; --danger-dim:rgba(173,53,81,.09);
  --gold:#946514;  --gold-2:#7a5210;

  --ac-soft:#eee8fc;
  --ac-dim:rgba(118,84,214,.12);
  --ac-mid:rgba(107,69,213,.28);

  
  --dv-1:#6b45d5;
  --dv-2:#ba6a00;
  --dv-3:#ce1f63;
  --dv-grid:rgba(32,33,44,.08);
  --dv-axis:#8e90a1;

  --grid-dot:rgba(107,69,213,.10);
  --shadow:0 10px 30px rgba(32,33,44,.08);
}

body{font-size:13px;line-height:1.5;-webkit-font-smoothing:antialiased}

body{padding-left:212px;padding-top:60px}
.rail{width:212px;background:linear-gradient(180deg,#1c1d25,var(--bg-panel) 45%);padding:0}
html[data-bvmode="light"] .rail{background:linear-gradient(180deg,#fafbfd,var(--bg-panel) 45%)}
.topbar{left:212px;height:60px}

.rail-brand{padding:22px 14px 4px;min-height:0;gap:10px}
.rail-brand .logo{width:33px;height:33px;border-radius:10px;box-shadow:0 5px 18px rgba(118,84,214,.24)}
.brand-txt{font-size:17px;font-weight:600;letter-spacing:-.6px}
.brand-sub{font-size:9.5px;letter-spacing:1.5px;color:var(--txt-mut);font-weight:500}

.rail-nav{padding:18px 13px 12px}
.rail-grp{font-size:10px;letter-spacing:1.5px;font-weight:500;color:var(--txt-mut);padding:14px 10px 5px}
.rail-nav .rail-grp:first-child{padding-top:0}
.rail-item{padding:10px;border-radius:8px;gap:10px;font-size:12px;font-weight:500;min-height:39px;margin:1px 0;color:var(--txt-dim)}
.rail-item svg.sic{width:17px;height:17px;opacity:1}
.rail-item:hover{background:var(--bg-3);color:var(--txt)}
.rail-item.active{background:var(--ac-soft);color:var(--accent);box-shadow:inset 0 0 0 1px var(--ac-mid)}

.rail-item.active::before{left:-13px;top:12px;bottom:12px;width:2px;border-radius:2px;background:var(--accent);box-shadow:0 0 9px var(--ac-mid)}

.rail-foot{padding:12px 13px 14px;border-top:0}
.sb-live{border-radius:10px;padding:10px 11px;margin-bottom:10px;border:1px solid var(--ac-mid);background:var(--ac-soft)}
.sb-live.off{border-color:var(--line);background:var(--bg-3);opacity:1}
.sb-live-top{font-size:10px;letter-spacing:1.3px;font-weight:600}
.sb-live-time{font-size:18px;font-weight:600}
.sb-live-meta{font-size:11px;color:var(--txt-mut)}
.user-row{border-top:1px solid var(--line);padding:14px 4px 0;gap:9px}
.rail-avatar{width:30px;height:30px;background:var(--ac-soft);color:var(--accent);font-size:11px;font-weight:600}
.user-name{font-size:12px;font-weight:500}
.user-role{font-size:11px;color:var(--txt-mut)}

body.railmini{padding-left:64px}
body.railmini .topbar{left:64px}

.topbar{background:var(--bg);border-bottom:1px solid var(--line);padding:0 30px;gap:14px;backdrop-filter:none}
.topbar::after{content:"";position:absolute;bottom:-1px;left:30px;width:80px;height:1px;background:linear-gradient(90deg,var(--accent),transparent)}
.tb-title{display:flex;align-items:baseline;gap:7px;min-width:0}

.tb-crumb{font-size:12px;color:var(--txt-mut);white-space:nowrap}
.tb-sep{font-size:12px;color:var(--txt-mut);opacity:.6}
.tb-title h1{font-size:12px;font-weight:400;color:var(--txt-dim);letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-title p{display:none}
@media(max-width:700px){.tb-crumb,.tb-sep{display:none}}

.topbar .icon-btn{width:35px;height:35px;border-radius:7px;background:transparent;border-color:transparent;color:var(--txt-mut)}
.topbar .icon-btn:hover{background:var(--bg-3);color:var(--txt);border-color:transparent}
.topbar .icon-btn.on{background:var(--ac-soft);border-color:var(--ac-mid);color:var(--accent)}

.stage{padding:0;gap:0}
.bgrid{border-radius:0;box-shadow:none;background-color:var(--bg);
  background-image:
    radial-gradient(circle,var(--grid-dot) .8px,transparent 1px),
    radial-gradient(ellipse 610px 310px at 88% 110px,var(--violet-dim),transparent 75%),
    radial-gradient(ellipse 380px 650px at 2% 880px,var(--ac-dim),transparent 80%);
  background-size:22px 22px,100% 100%,100% 100%;
  background-position:10px 9px,0 0,0 0}
.bgrid.pg .wb{padding:30px 30px 60px}
.bgrid.pg .wb > .tab-pane{max-width:1240px}
@media(max-width:980px){.bgrid.pg .wb{padding:20px 16px 40px}}

.pghead{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.pghead h1{margin:0;font-size:24px;line-height:1.3;letter-spacing:-.8px;font-weight:600;color:var(--txt);font-family:var(--font-display)}
.pghead p{margin:4px 0 0;font-size:12.5px;color:var(--txt-dim)}
.pghead-act{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

.bvh-card{background:var(--bg-2);border:1px solid var(--line);border-radius:10px}
.bvh-card-h{padding:15px 17px 0}
.bvh-card-b{padding:14px 17px 17px}
.bvh-card h3{font-size:14px;font-weight:600;letter-spacing:-.15px}
.bvh-sub{font-size:11.5px;color:var(--txt-mut)}
.bvh-grid{gap:16px}
.bvh-mt{margin-top:16px}
.bvh-stat{padding:15px 17px 14px}
.bvh-stat-l{font-size:11px;font-weight:500;color:var(--txt-mut)}
.bvh-stat-v{font-size:23px;font-weight:600;letter-spacing:-.6px;margin-top:3px}
.bvh-hero{background:linear-gradient(150deg,var(--violet-dim),transparent 60%),var(--bg-2);border-color:var(--ac-mid)}

.bvbtn{display:inline-flex;align-items:center;justify-content:center;gap:7px;
  border:1px solid var(--line);border-radius:7px;background:var(--bg-2);color:var(--txt);
  padding:8px 13px;min-height:35px;font:500 12px/1 var(--font-body);cursor:pointer;
  white-space:nowrap;text-decoration:none;transition:.15s;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.bvbtn:hover{background:var(--bg-3)}
.bvbtn svg.sic{width:15px;height:15px}
.bvbtn-primary{background:var(--accent-3);border-color:var(--accent-3);color:#fff;
  box-shadow:0 3px 13px rgba(118,84,214,.25),inset 0 1px 0 rgba(255,255,255,.13)}
.bvbtn-primary:hover{background:var(--accent-3);filter:brightness(1.12)}
.bvbtn-quiet{border-color:transparent;background:transparent;color:var(--txt-dim);box-shadow:none}
.bvbtn-quiet:hover{background:var(--bg-3);color:var(--txt)}

#bvhome > .pghead{margin-bottom:18px}
.bvh-welcome{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap;
  padding:22px;border:1px solid var(--line);background:var(--bg-2);border-radius:10px;
  box-shadow:0 7px 23px rgba(0,0,0,.24),inset 0 1px 0 rgba(178,154,255,.06)}
html[data-bvmode="light"] .bvh-welcome{box-shadow:0 7px 23px rgba(32,33,44,.05),inset 0 1px 0 rgba(107,69,213,.05)}
.bvh-welcome-main{min-width:0;flex:1 1 320px}
.bvh-welcome h2{margin:12px 0 0;font-size:21px;font-weight:600;letter-spacing:-.5px;color:var(--txt);font-family:var(--font-display)}
.bvh-welcome p{margin:8px 0 0;font-size:12px;color:var(--txt-dim);max-width:52ch}
.bvh-wlabel{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:5px;
  background:var(--bg-3);color:var(--txt-mut);font-size:10px;font-weight:600;letter-spacing:.7px}
.bvh-wdot{width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 auto}

#bvhome.bvh-live .bvh-wlabel{color:var(--danger);background:var(--danger-dim);border:1px solid rgba(255,148,170,.22)}
#bvhome.bvh-live .bvh-wdot{animation:tblive 1.6s infinite}
.bvh-wchips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.bvh-wchips span{display:inline-flex;align-items:center;padding:3px 8px;border-radius:5px;
  background:var(--bg-3);color:var(--txt-dim);font-size:10.5px}
.bvh-welcome-side{flex:0 0 auto;text-align:right;min-width:140px}
.bvh-wtime{font-size:25px;font-weight:600;letter-spacing:-.6px;font-variant-numeric:tabular-nums;color:var(--txt);line-height:1.2}
.bvh-wviewers{margin:3px 0 0!important;font-size:12px;color:var(--txt-dim)}
.bvh-wviewers span{font-variant-numeric:tabular-nums}
.bvh-welcome-side .bvh-delta{margin-top:7px}

.bvh-welcome > .bvh-spark{position:absolute;left:0;right:0;bottom:0;width:100%;height:38px;opacity:.45;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent)}
@media(max-width:700px){.bvh-welcome-side{text-align:left}}

.bvh-g3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1080px){.bvh-g3{grid-template-columns:1fr}}
.bvh-quick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
@media(max-width:860px){.bvh-quick{grid-template-columns:1fr}}
.bvh-qcard{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:17px;text-align:left;
  background:var(--bg-2);border:1px solid var(--line);border-radius:9px;cursor:pointer;
  color:var(--txt);font-family:inherit;transition:.15s;
  box-shadow:0 7px 23px rgba(0,0,0,.2)}
html[data-bvmode="light"] .bvh-qcard{box-shadow:0 7px 23px rgba(32,33,44,.04)}
.bvh-qcard:hover{border-color:var(--accent)}
.bvh-qic{color:var(--accent);display:grid;place-items:center}
.bvh-qic svg.sic{width:19px;height:19px}
.bvh-qt{font-size:13px;font-weight:600}
.bvh-qs{font-size:11px;color:var(--txt-mut)}

.nav-count{font-size:9px;font-weight:600;padding:1px 5px;letter-spacing:.3px;border-radius:5px}
.ri-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

#bvhome:not(.bvh-live) .bvh-welcome > .bvh-spark{display:none}

@media (max-width:1100px){
  body,body.railmini{padding-left:64px}
  .topbar,body.railmini .topbar{left:64px;padding:0 16px}
  .topbar::after{left:16px}
  .rail{width:64px;padding:0}
  .rail-brand{padding:14px 0 12px;justify-content:center}
  .rail-nav{padding:4px 8px 12px}
  .rail-grp{padding:0}
  .rail-item{width:40px;justify-content:center;padding:8.5px 0;gap:0;margin:0 auto}
  .rail-foot{padding:10px 8px 12px}
  .user-row{border-top:0;padding:10px 0 0}
}

.rail-settings{padding:0 13px 10px;flex:0 0 auto}

.pgtabs{display:flex;gap:22px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin:-6px 0 20px}
.pgtab{border:0;border-bottom:2px solid transparent;background:none;padding:0 0 11px;margin-bottom:-1px;
  color:var(--txt-mut);font:500 12px/1 var(--font-body);cursor:pointer;transition:.15s}
.pgtab:hover{color:var(--txt-dim)}
.pgtab[aria-selected="true"]{border-color:var(--accent);color:var(--txt)}

.cp-overlay{position:fixed;inset:0;z-index:500;display:flex;justify-content:center;
  align-items:flex-start;padding:14vh 16px 16px;background:rgba(6,6,9,.55);backdrop-filter:blur(3px)}
html[data-bvmode="light"] .cp-overlay{background:rgba(32,33,44,.28)}
.cp-overlay[hidden]{display:none}
.cp-overlay .searchbox{width:100%;max-width:560px;padding:13px 16px;border-radius:12px;
  background:var(--bg-2);border:1px solid var(--bd-strong);box-shadow:0 22px 60px rgba(0,0,0,.45)}
html[data-bvmode="light"] .cp-overlay .searchbox{box-shadow:0 22px 60px rgba(32,33,44,.18)}
.cp-overlay .searchbox input{font-size:15px}
.cp-overlay .cp-box{left:0;right:0;min-width:0}

.plat-chips{gap:14px;margin-right:2px}
.plat-chip{padding:0;border:0;background:none;gap:6px;font-size:11px;color:var(--txt-mut)}
.plat-chip .pl-name{white-space:nowrap}
.plat-chip .st,.plat-chip .conn-dot{width:6px;height:6px;background:var(--txt-mut)}
.plat-chip.ok .conn-dot,.conn-pill.ok .conn-dot{background:var(--ok)}
.plat-chip.off{opacity:.55}
@media(max-width:900px){.plat-chip .pl-name{display:none}.plat-chips{gap:8px}}

.tb-hidden-btn{display:none!important}
.tb-more-btn{position:relative}
.tb-more-dot{position:absolute;top:6px;right:6px;width:6px;height:6px;border-radius:50%;
  background:var(--danger);box-shadow:0 0 0 2px var(--bg)}
.tb-more{position:fixed;z-index:400;min-width:212px;padding:6px;
  background:var(--bg-2);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow)}
.tb-more button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border:0;border-radius:7px;
  background:none;color:var(--txt-dim);font:500 12px/1 var(--font-body);cursor:pointer;text-align:left}
.tb-more button:hover{background:var(--bg-3);color:var(--txt)}
.tb-more kbd{margin-left:auto;font-family:var(--font-body);font-size:10px;color:var(--txt-mut);
  background:var(--bg-3);border:1px solid var(--line);border-radius:5px;padding:1px 5px}
.tb-more-badge{margin-left:auto;min-width:17px;padding:1px 5px;border-radius:9px;
  background:var(--danger-dim);color:var(--danger);font-size:10px;font-weight:600;text-align:center}

.bgrid.studio{overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}

.bgrid.studio > .sg-top{position:absolute;top:0;left:0;right:0;z-index:2;pointer-events:none}
.bgrid.studio > .sg-top > *{pointer-events:auto}
.bgrid.studio > .sg-top .pghead{margin-bottom:14px}
.bgrid.studio .sg-spacer{pointer-events:none}

.sg-livepill{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;
  background:var(--bg-3);color:var(--txt-mut);font-size:11px;font-weight:600;letter-spacing:.6px}
.sg-livepill b{font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:0}
.sg-livepill.on{background:var(--danger-dim);color:var(--danger);border:1px solid rgba(255,148,170,.22)}
.sg-livepill.on .bvh-wdot{animation:tblive 1.6s infinite}

.sg-topline{display:flex;flex-wrap:wrap;gap:8px 26px;align-items:baseline;
  padding:0 0 16px;font-size:12px;color:var(--txt-mut)}
.sg-topline strong{font-size:19px;font-weight:600;letter-spacing:-.5px;color:var(--txt);
  font-variant-numeric:tabular-nums;margin-right:5px}

.sg-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;
  padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:16px}
.sg-bar-l,.sg-bar-r{display:flex;gap:8px;flex-wrap:wrap}

.bgrid.studio.sg-editing .bvw > .wc{border-color:var(--ac-mid)}
.bgrid.studio.sg-editing .wh{cursor:move}

.bgrid.studio.sg-stacked{overflow-y:auto}
.bgrid.studio.sg-stacked > .sg-top{position:static}
.bgrid.studio.sg-stacked .sg-spacer{display:none}
.bgrid.studio.sg-stacked{padding:0 16px 40px}
.bgrid.studio.sg-stacked > .sg-top{padding-left:0!important;padding-right:0!important}
.bgrid.studio.sg-stacked .bvw{position:static!important;width:auto!important;height:auto!important;
  min-width:0;min-height:0;margin:0 0 12px;transform:none!important}
.bgrid.studio.sg-stacked .bvw > .wc{height:auto}

.bgrid.studio.sg-stacked .bvw[data-id="video"] .wb{aspect-ratio:16/9}
.bgrid.studio.sg-stacked .bvw[data-id="chat"] .wb,
.bgrid.studio.sg-stacked .bvw[data-id="followers"] .wb,
.bgrid.studio.sg-stacked .bvw[data-id="activity"] .wb,
.bgrid.studio.sg-stacked .bvw[data-id="chatters"] .wb{height:420px}
.bgrid.studio.sg-stacked .bvw[data-id="notes"] .wb{height:190px}
.bgrid.studio.sg-stacked .bvw .wb{overflow:auto}
.bgrid.studio.sg-stacked .bvrh,.bgrid.studio.sg-stacked .bvre{display:none!important}
.bgrid.studio.sg-stacked .wh{cursor:default!important}

.an-canvas-sub{position:relative;height:96px;margin-top:6px;padding-top:14px;border-top:1px solid var(--line)}
.an-sublabel{position:absolute;top:2px;left:0;font-size:10.5px;color:var(--txt-mut);letter-spacing:.2px}

.an-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:-8px 0 14px;font-size:11.5px;color:var(--txt-mut)}
.an-howto{margin-left:auto;background:none;border:0;padding:0;cursor:pointer;font:inherit;
  color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.an-howto-box{margin:-4px 0 16px;padding:14px 16px;border:1px solid var(--line);border-radius:9px;
  background:var(--bg-3);font-size:11.5px;color:var(--txt-dim);line-height:1.6}
.an-howto-box[hidden]{display:none}
.an-howto-box p{margin:0 0 8px}
.an-howto-box p:last-child{margin:0}
.an-howto-box b{color:var(--txt)}

.an-stats{grid-template-columns:repeat(6,minmax(0,1fr));gap:0;margin-bottom:20px;
  background:none;border:0}
.an-stat{background:none;border:0;border-right:1px solid var(--line);border-radius:0;
  padding:4px 20px 4px 0;margin-right:20px}
.an-stat:last-child{border-right:0;margin-right:0}
.an-stat-l{font-size:11px;font-weight:500;color:var(--txt-mut)}
.an-stat-l i{display:none}
.an-stat-v{font-size:23px;font-weight:600;letter-spacing:-.6px;margin-top:3px}
.an-stat-s{font-size:10.5px;margin-top:4px}
.an-stat{padding-right:16px;margin-right:16px}
@media(max-width:1280px){
  .an-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 0}
  .an-stat:nth-child(3n){border-right:0;margin-right:0}
}
@media(max-width:820px){
  .an-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .an-stat:nth-child(3n){border-right:1px solid var(--line);margin-right:16px}
  .an-stat:nth-child(2n){border-right:0;margin-right:0}
}

.an-sekme{display:flex;gap:22px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:18px;background:none;padding:0}
.an-sekme button{border:0;border-bottom:2px solid transparent;background:none;padding:0 0 11px;margin-bottom:-1px;
  color:var(--txt-mut);font:500 12px/1 var(--font-body);cursor:pointer;border-radius:0;box-shadow:none}
.an-sekme button:hover{color:var(--txt-dim);background:none}
.an-sekme button.on{border-color:var(--accent);color:var(--txt);background:none;box-shadow:none}

.anp-prog{background:var(--bg-3)}

#pane-sounds .st-wrap{display:block}
#pane-sounds .st-side{display:flex;flex-direction:row;flex-wrap:wrap;gap:22px;position:static;max-height:none;
  border-bottom:1px solid var(--line);padding:0;margin-bottom:20px}
#pane-sounds .st-cat{padding:0 0 11px;margin-bottom:-1px;border:0;border-bottom:2px solid transparent;
  background:none;color:var(--txt-mut);font:500 12px/1 var(--font-body);border-radius:0;width:auto}
#pane-sounds .st-cat i{display:none}
#pane-sounds .st-cat:hover{color:var(--txt-dim)}
#pane-sounds .st-cat.on{border-color:var(--accent);color:var(--txt);font-weight:500}
#pane-sounds .st-cat.on::before{display:none}
#pane-sounds .st-panel{max-width:1000px}

#pane-sounds .modal-section.an-card > h4{text-transform:none;color:var(--txt);font-size:14px;letter-spacing:-.15px}
#pane-sounds .modal-section.an-card > h4 i{color:var(--txt-mut);font-size:15px}

#pane-sounds .st-seg{background:var(--bg-3);border:1px solid var(--line);border-radius:9px;padding:3px;gap:2px;display:inline-flex}
#pane-sounds .st-seg button{font-size:12px;font-weight:500;color:var(--txt-mut);padding:6px 14px;border-radius:7px;border:0;background:none}
#pane-sounds .st-seg button.on{background:var(--bg-2);color:var(--txt);box-shadow:0 1px 5px rgba(0,0,0,.25)}
html[data-bvmode="light"] #pane-sounds .st-seg button.on{box-shadow:0 1px 4px rgba(32,33,44,.12)}

.tp-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media(max-width:900px){.tp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tp-card{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:11px;cursor:pointer;
  background:var(--bg-2);border:1px solid var(--line);border-radius:10px;color:var(--txt);
  font-family:inherit;text-align:left;transition:.15s}
.tp-card:hover{border-color:var(--bd-strong)}
.tp-card.on{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.tp-name{font-size:12.5px;font-weight:600;margin-top:7px}
.tp-desc{font-size:11px;color:var(--txt-mut);line-height:1.35}

.tp-prev{display:block;position:relative;width:100%;aspect-ratio:16/9;border-radius:6px;overflow:hidden;
  border:1px solid var(--line)}
.tp-prev i{position:absolute;display:block;border-radius:2px}
.tp-rail{left:6%;top:12%;bottom:12%;width:16%}
.tp-a{left:28%;right:7%;top:14%;height:30%}
.tp-b{left:28%;right:7%;bottom:14%;height:30%}
.tp-default{background:#191a20}.tp-default .tp-rail{background:#2d2e39}.tp-default .tp-a,.tp-default .tp-b{background:#22232c;box-shadow:inset 0 0 0 1px #3a3b48}
.tp-terminal{background:#0d1512}.tp-terminal .tp-rail{background:#1d3329}.tp-terminal .tp-a,.tp-terminal .tp-b{background:#14251d;box-shadow:inset 0 0 0 1px #2f5c43}
.tp-konsol{background:#1a1408}.tp-konsol .tp-rail{background:#3a2c12}.tp-konsol .tp-a,.tp-konsol .tp-b{background:#2a2010;box-shadow:inset 0 0 0 1px #6b5320}
.tp-pog{background:#1c0f26}.tp-pog .tp-rail{background:#3d1d52}.tp-pog .tp-a,.tp-pog .tp-b{background:#2d1640;box-shadow:inset 0 0 0 1px #7b34a8;border-radius:5px}
html[data-bvmode="light"] .tp-default{background:#fff}
html[data-bvmode="light"] .tp-default .tp-rail{background:#e1e2ea}
html[data-bvmode="light"] .tp-default .tp-a,html[data-bvmode="light"] .tp-default .tp-b{background:#f4f5f8;box-shadow:inset 0 0 0 1px #6b45d5}

html.bv-reduce *,html.bv-reduce *::before,html.bv-reduce *::after{
  animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
html.bv-reduce .bvstars{display:none}
html.bv-reduce .bgrid{background-image:radial-gradient(circle,var(--grid-dot) .8px,transparent 1px);background-size:22px 22px}

.aled-split{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:8px 26px;align-items:start}
@media(max-width:900px){.aled-split{grid-template-columns:1fr}}
.aled-left{position:sticky;top:0}
@media(max-width:900px){.aled-left{position:static}}
.aled-right .aled-row label{min-width:132px}

#pane-sadakat .rule-form{display:block;margin-top:0;max-width:760px}
#pane-sadakat .rf-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line-soft)}
#pane-sadakat .rf-row:last-child{border-bottom:0}
#pane-sadakat .rf-l{min-width:150px;font-size:12.5px;color:var(--txt-dim)}
#pane-sadakat .dn-tg{margin-bottom:6px}
#pane-sadakat .loy-tophead{display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:18px 0 8px;font-size:11px;letter-spacing:1px;color:var(--txt-mut)}

.bvt-group + .bvt-group{margin-top:26px}
.bvt-ghead{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 12px}
.bvt-ghead h4{margin:0;font-size:13.5px;font-weight:600;letter-spacing:-.15px;color:var(--txt);
  display:flex;align-items:baseline;gap:8px}
.bvt-gn{font-size:11px;font-weight:500;color:var(--txt-mut)}
.bvt-gd{font-size:11.5px;color:var(--txt-mut)}

.bvt-card{--tc:var(--accent);--tbg:var(--ac-soft);--tbd:var(--ac-mid)}
.bvt-chip{--cc:var(--txt-dim);--cbg:transparent;--cbd:var(--line)}
.bvt-chip .dot{display:none}
.bvt-chip.on{--cc:var(--accent);--cbg:var(--ac-soft);--cbd:var(--ac-mid)}
.bvt-chip .cnt{opacity:.7}

#dnv3 .bvh-grid.bvh-g2e{ align-items:stretch; }

.dn-lockcard{ border-color:color-mix(in oklab, var(--dv-3) 34%, var(--line)); }
.dn-lockcard > .bvh-card-h h3{ display:flex; align-items:center; gap:8px; }
.dn-lockcard > .bvh-card-h h3::before{ content:"🚨"; font-size:15px; line-height:1; }

.dn-lockcard .dnv3-slot > .wcard{
  display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px;
}
.dn-lockcard .lock-btn{
  flex:0 0 auto; width:auto; min-width:228px; margin:0;
  padding:11px 20px; border-radius:11px; font-weight:650;
}
.dn-lockcard .lock-cfg{ flex:1 1 auto; margin:0; gap:16px; }
.dn-lockcard .lock-hint{ flex:1 1 100%; margin:0; }

#txCfg{ transition:opacity .18s ease; }
#txCfg.tx-off{ opacity:.5; }

.tx-offnote{ display:none; margin-top:8px; font-size:11px; color:var(--txt-mut); }
#txCfg.tx-off .tx-offnote{ display:block; }

@media (max-width:640px){
  .dn-lockcard .lock-btn{ width:100%; min-width:0; }
  .dn-lockcard .lock-cfg{ flex:1 1 100%; }
}

.gw-modal, .yd-modal{ background:var(--bg); }
.gw-card, .yd-card{ background:var(--bg); }

.gw-right, .yd-left{ background:var(--bg-2); }
.gw-list, .plist, .kw-card, .elenen-panel{ background:var(--bg-2); }
.gw-foot, .yd-foot{ background:var(--bg-2); }
.gw-countdown, .gw-reveal, .yd-reveal, .gw-winner{
  background:color-mix(in oklab, var(--bg) 92%, var(--accent));
}
.bvbar{ background:color-mix(in oklab, var(--bg-2) 88%, transparent); border:1px solid var(--line); }
.bvchip{ color:var(--txt-dim); background:var(--bg-3); border:1px solid var(--line); }

.gw-hint, .gw-rangewrap .rl, .muted-t, .sc-tag, .gw-searchwrap .ic{ color:var(--txt-dim); }
.gw-input::placeholder{ color:var(--txt-mut); }

.gw-title{ background-image:linear-gradient(90deg, var(--accent), var(--txt), var(--accent)); }
.yd-title{ background-image:linear-gradient(90deg, var(--ok, #1FD3B0), var(--txt), var(--ok, #1FD3B0)); }

.gw-winner .nm{ color:var(--txt); }

.home-start, .raid-go, .send-btn, .btn, .btn.ok, .um-whisper button,
.gw-start, .gw-pinbtn.on, .kw-start, .kw-btn.ghost.on, .w-whisper,
.big-btn.win, .win-btn, .eq-chip b,
.bvh-btnp, .an-filter button.on, #anFilter button.on,
.topbar .icon-btn .hdr-badge, .hdr-badge, .announce-tag, .new-msg-btn,
.tab .tab-badge, .btn.danger, .w-convo .wc-unread, .w-msg.me,
.icon-btn.on, .eng-btn, .gw-start.on, .gw-msgbtn, .kw-start.on, .kw-btn.alt,
.w-announce, .add-btn, .big-btn.auto.stopb, .open-btn, .r-close, .mg-x:hover,
.stepper button:hover, .pstep:hover,

.aled-tabs button.on{
  color:var(--on-accent);
}

.btn *, .send-btn *, .bvh-btnp *, .home-start *, .raid-go *{ color:inherit; }

.bvi{ flex:none; display:inline-block; vertical-align:-0.18em; user-select:none;
      width:1.25em; height:1.25em; object-fit:contain; }
svg.sic.bvs{ width:1.05em; height:1.05em; vertical-align:-0.16em; }

.ba .em{ line-height:0; }
.ba .em .bvi{ width:66px; height:66px; }

.toast.event .ic{
  width:38px; height:38px; flex:none; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--accent-3), var(--accent));
}
.toast.event .ic .bvi{ width:26px; height:26px; }

.toast.event .ic:has(.bvs){ background:none; width:auto; height:auto; }
.toast .ic .bvs{ width:22px; height:22px; color:var(--accent); }

.lock-btn .bvs{ width:17px; height:17px; }
.dn-lockcard > .bvh-card-h h3 .bvs{ width:19px; height:19px; color:var(--dv-3); }
.dn-lockcard > .bvh-card-h h3::before{ content:none; }
.rr-chip .bvs{ width:14px; height:14px; }

#livePill{ display:none !important; }

.bvbtn-primary, .bvbtn-primary *{ color:#fff; }

.gw-open-btn{ background-image:linear-gradient(135deg, var(--accent-3), #4C1D95) !important; color:#fff; }
#ydOpen{ background-image:linear-gradient(135deg, #0E7C6B, #1E6FA8) !important; color:#fff; }

.msg span.msg-av{ text-shadow:0 1px 2px rgba(0,0,0,.55); }

.tb-live{
  display:inline-flex; align-items:center; gap:8px; flex:none;
  padding:5px 12px 5px 10px; border-radius:99px;
  border:1px solid color-mix(in oklab, var(--dv-3) 34%, var(--line));
  background:color-mix(in oklab, var(--dv-3) 9%, transparent);
  font-size:12px; font-weight:650; color:var(--txt); white-space:nowrap;
}
.tb-live .tl-dot{
  width:7px; height:7px; border-radius:50%; background:var(--dv-3); flex:none;
  box-shadow:0 0 0 0 color-mix(in oklab, var(--dv-3) 60%, transparent);
  animation:tlPulse 1.8s ease-out infinite;
}
@keyframes tlPulse{
  0%{ box-shadow:0 0 0 0 color-mix(in oklab, var(--dv-3) 55%, transparent); }
  70%{ box-shadow:0 0 0 7px transparent; }
  100%{ box-shadow:0 0 0 0 transparent; }
}
.tb-live .tl-lbl{ letter-spacing:.5px; font-weight:750; font-size:11px; }
.tb-live .tl-time{ font-family:var(--font-mono, ui-monospace); font-variant-numeric:tabular-nums; }
.tb-live .tl-sep{ color:var(--txt-mut); }
.tb-live .tl-eye{ width:13px; height:13px; color:var(--txt-dim); }
.tb-live .tl-view{ color:var(--txt-dim); font-weight:700; font-variant-numeric:tabular-nums; }
.tb-live .tl-viewl{ color:var(--txt-dim); font-weight:600; margin-left:4px; }

.tb-live.off{
  border-color:var(--line); background:var(--bg-2); color:var(--txt-dim);
}
.tb-live.off .tl-dot{ background:var(--txt-mut); animation:none; box-shadow:none; }
.tb-live.off .tl-time,.tb-live.off .tl-sep,.tb-live.off .tl-eye{ display:none; }

.tb-studio{
  display:inline-flex; align-items:center; gap:2px; flex:none; margin-left:auto;
  padding:3px; border-radius:11px; background:var(--bg-2); border:1px solid var(--line);
}
.tb-studio .tbs-btn{
  display:inline-flex; align-items:center; gap:6px;
  background:none; border:0; cursor:pointer; color:var(--txt-dim);
  font:inherit; font-size:12px; font-weight:600; padding:6px 10px; border-radius:8px;
  transition:background .15s, color .15s;
}
.tb-studio .tbs-btn .sic{ width:15px; height:15px; }
.tb-studio .tbs-btn:hover{ background:var(--bg-3); color:var(--txt); }

.tb-studio .tbs-btn.on{
  background:var(--accent); color:var(--on-accent); font-weight:700;
}
@media (max-width:1180px){ .tb-studio .tbs-btn span{ display:none; } .tb-studio .tbs-btn{ padding:7px; } }

.bvtpl-menu{
  position:fixed; z-index:420; width:min(640px, calc(100vw - 24px));
  background:var(--bg-2); border:1px solid var(--line); border-radius:16px;
  box-shadow:0 18px 50px rgba(0,0,0,.28); padding:14px; overflow:hidden;
}
.bvtpl-h{ font-size:12px; font-weight:800; letter-spacing:.6px; text-transform:uppercase;
          color:var(--txt-dim); margin-bottom:11px; }
.bvtpl-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(186px,1fr)); gap:10px; }
.bvtpl-card{
  display:flex; flex-direction:column; gap:7px; text-align:left;
  background:var(--bg); border:1px solid var(--line); border-radius:13px;
  padding:9px; cursor:pointer; font:inherit; color:var(--txt);
  transition:border-color .15s, transform .15s, box-shadow .15s;
}
.bvtpl-card:hover{
  border-color:var(--accent); transform:translateY(-2px);
  box-shadow:0 10px 24px color-mix(in oklab, var(--accent) 22%, transparent);
}

.bvtpl-prev{
  position:relative; display:block; aspect-ratio:16/10; border-radius:8px;
  background:var(--bg-3); overflow:hidden;
}
.bvtpl-prev i{
  position:absolute; border-radius:3px;
  background:color-mix(in oklab, var(--accent) 26%, var(--bg-2));
  border:1px solid color-mix(in oklab, var(--accent) 45%, var(--line));
  transition:background .15s;
}

.bvtpl-card:hover .bvtpl-prev i{
  background:color-mix(in oklab, var(--accent) 40%, var(--bg-2));
}

.bvtpl-prev i b{
  position:absolute; inset:0; display:flex;
  align-items:center; justify-content:center; text-align:center;
  font-size:8px; font-weight:700; line-height:1.15; padding:1px;
  color:var(--on-accent); opacity:0; transition:opacity .15s;
  overflow:hidden;
}
.bvtpl-card:hover .bvtpl-prev i b{ opacity:1; }
.bvtpl-ad{ font-size:13px; font-weight:700; }
.bvtpl-not{ font-size:11px; line-height:1.4; color:var(--txt-dim); }
.bvtpl-f{ margin-top:11px; font-size:11px; color:var(--txt-mut); }

.wb:has(> #pane-toolbox.tool) > .pghead,
.wb:has(> #pane-toolbox.tool) > .pgtabs{ display:none; }

.tb-studio[hidden], .tb-live[hidden]{ display:none !important; }
