/* Native counter components, shared by the fitted studio preview and OBS. */
html,body{width:100%;height:100%}
.counter-wrap[data-counter-style]{box-sizing:border-box;width:100%;height:100%;padding:12px;display:flex;align-items:center;justify-content:center;overflow:hidden;font-family:var(--counter-font);color:var(--counter-text)}
.counter-wrap[data-counter-style] *{box-sizing:border-box}
.counter-wrap[data-counter-style] .counter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--counter-gap);width:100%;flex:0 0 auto;transform-origin:center}
.counter-wrap[data-layout="vertical"] .counter-grid,.counter-wrap[data-metrics="viewers"] .counter-grid,.counter-wrap[data-metrics="likes"] .counter-grid{grid-template-columns:minmax(0,1fr)}
.counter-wrap[data-metrics="viewers"] .likes,.counter-wrap[data-metrics="likes"] .viewers{display:none!important}
.counter-wrap[data-order="likes"] .viewers{order:2}.counter-wrap[data-order="likes"] .likes{order:1}
.counter-wrap[data-counter-style] .overlay-card{min-width:0;min-height:0;margin:0;position:relative;border:1px solid #ffffff20;border-radius:var(--counter-radius);padding:var(--counter-padding);background:rgba(var(--counter-surface-rgb),var(--counter-opacity));box-shadow:inset 0 1px #ffffff06;backdrop-filter:none;overflow:hidden}
.counter-wrap[data-counter-style] .overlay-card:before,.counter-wrap[data-counter-style] .overlay-card:after{content:none}
.counter-wrap[data-counter-style] .overlay-topline{min-width:0;display:flex;align-items:center;justify-content:flex-start;gap:7px}
.counter-wrap[data-counter-style] .counter-label{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--counter-label-size);font-weight:650;line-height:1.3;letter-spacing:.08em;color:var(--counter-label)}
.counter-wrap[data-counter-style] .counter-live-dot{width:5px;height:5px;flex:0 0 5px;background:var(--metric-accent);border-radius:50%;opacity:.4}
.counter-wrap[data-live="true"] .counter-live-dot{opacity:1;box-shadow:0 0 8px var(--metric-accent)}
.counter-wrap[data-counter-style] .overlay-value-row{display:flex;align-items:center;min-width:0;gap:16px;margin:14px 0 12px}
.counter-wrap[data-counter-style] .overlay-big-icon{width:var(--counter-icon-size);height:var(--counter-icon-size);flex:0 0 auto;border:1px solid #ffffff1c;border-radius:calc(var(--counter-radius) * .55);background:#ffffff05;box-shadow:inset 0 1px #ffffff08;color:var(--metric-accent);transition:none}
.counter-wrap[data-counter-style] .overlay-big-icon svg{display:block;width:65%;height:65%;color:var(--metric-accent);stroke:currentColor}
.counter-wrap[data-counter-style] .overlay-big-icon.like svg{fill:currentColor;stroke:none}
.counter-wrap[data-counter-style] .counter-number{display:block;flex:1;min-width:0;margin:0;color:var(--counter-text);font-size:var(--counter-font-size);font-weight:var(--counter-weight);line-height:1.1;letter-spacing:-.055em;white-space:nowrap;font-variant-numeric:tabular-nums;text-shadow:none;transform-origin:left center}
.counter-wrap[data-counter-style] .counter-subtitle{display:block;min-width:0;margin:0;color:var(--counter-label);font-size:12px;line-height:1.4;font-weight:450;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.75}
.counter-wrap[data-show-icons="false"] .overlay-big-icon,.counter-wrap[data-show-labels="false"] .overlay-topline,.counter-wrap[data-show-subtitles="false"] .counter-subtitle,.counter-wrap[data-show-live-dot="false"] .counter-live-dot{display:none!important}
.counter-wrap[data-counter-style="studio"] .overlay-card{border-top:3px solid var(--metric-accent)}
.counter-wrap[data-counter-style="glass"] .overlay-card{background:linear-gradient(140deg,#ffffff09,transparent 70%),rgba(var(--counter-surface-rgb),var(--counter-opacity));border:1px solid #ffffff30;box-shadow:inset 0 1px #ffffff10,0 9px 24px #0002;backdrop-filter:blur(12px)}
.counter-wrap[data-counter-style="glass"] .overlay-big-icon{border-color:var(--metric-accent);background:#ffffff06}
.counter-wrap[data-counter-style="split"] .overlay-card{display:grid;grid-template-columns:var(--counter-icon-size) minmax(0,1fr);gap:8px 18px}
.counter-wrap[data-counter-style="split"] .overlay-value-row{display:contents}
.counter-wrap[data-counter-style="split"] .overlay-big-icon{grid-row:1/4;grid-column:1;align-self:stretch;height:100%;min-height:var(--counter-icon-size);background:#ffffff04;border:0;border-right:2px solid var(--metric-accent);border-radius:0;padding-right:12px}
.counter-wrap[data-counter-style="split"] :is(.overlay-topline,.counter-number,.counter-subtitle){grid-column:2}
.counter-wrap[data-counter-style="split"][data-show-icons="false"] .overlay-card{grid-template-columns:minmax(0,1fr)}
.counter-wrap[data-counter-style="split"][data-show-icons="false"] :is(.overlay-topline,.counter-number,.counter-subtitle){grid-column:1}
.counter-wrap[data-counter-style="neon"] .overlay-card{border-color:var(--metric-accent);box-shadow:inset 0 -3px var(--metric-accent),inset 0 0 24px #ffffff04}
.counter-wrap[data-counter-style="neon"] .overlay-big-icon{border-color:var(--metric-accent);border-radius:50%;background:transparent}
.counter-wrap[data-counter-style="minimal"] .overlay-card{border:0;background:transparent;box-shadow:none;backdrop-filter:none}
.counter-wrap[data-counter-style="minimal"] .overlay-big-icon{border:0;background:transparent;box-shadow:none}
.counter-wrap[data-counter-style="minimal"] .counter-number{text-shadow:0 2px 4px #0005}
.counter-wrap[data-counter-style="compact"] .overlay-card{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:5px 14px;align-items:center}
.counter-wrap[data-counter-style="compact"] .overlay-topline{grid-column:1;grid-row:1;align-self:end}
.counter-wrap[data-counter-style="compact"] .counter-subtitle{grid-column:1;grid-row:2;font-size:10px;align-self:start}
.counter-wrap[data-counter-style="compact"] .overlay-value-row{grid-column:2;grid-row:1/3;margin:0;gap:10px}
.counter-wrap[data-counter-style="compact"] .overlay-big-icon{border:0;background:transparent;box-shadow:none}
.counter-wrap[data-counter-style="scoreboard"] .counter-grid{padding:5px;border:1px solid #ffffff24;border-top:3px solid var(--counter-label);border-radius:var(--counter-radius);background:rgba(var(--counter-surface-rgb),var(--counter-opacity))}
.counter-wrap[data-counter-style="scoreboard"] .overlay-card{border:0;background:transparent;box-shadow:none;border-radius:0}
.counter-wrap[data-counter-style="scoreboard"] .overlay-big-icon{background:transparent;border:0;box-shadow:none}
.counter-wrap[data-counter-style="scoreboard"][data-metrics="both"][data-layout="horizontal"][data-order="viewers"] .likes,.counter-wrap[data-counter-style="scoreboard"][data-metrics="both"][data-layout="horizontal"][data-order="likes"] .viewers{border-left:1px solid #ffffff20}
.counter-wrap[data-counter-style="scoreboard"][data-metrics="both"][data-layout="vertical"][data-order="viewers"] .likes,.counter-wrap[data-counter-style="scoreboard"][data-metrics="both"][data-layout="vertical"][data-order="likes"] .viewers{border-top:1px solid #ffffff20}
.counter-wrap[data-counter-style="outline"] .overlay-card{border:2px solid var(--metric-accent);background:transparent;box-shadow:none}
.counter-wrap[data-counter-style="outline"] .overlay-big-icon{border:0;background:transparent;box-shadow:none}
.counter-wrap[data-animation="pulse"] .overlay-card.is-changing{animation:counterPulse var(--counter-speed) ease both}
.counter-wrap[data-animation="slide"] .counter-number.is-changing{animation:counterSlide var(--counter-speed) cubic-bezier(.2,.8,.2,1) both}
.counter-wrap[data-animation="flip"] .counter-number.is-changing{animation:counterFlip var(--counter-speed) ease both}
.counter-wrap[data-animation="fade"] .counter-number.is-changing{animation:counterFade var(--counter-speed) ease both}
@keyframes counterPulse{0%{filter:brightness(1)}35%{filter:brightness(1.3)}100%{filter:brightness(1)}}
@keyframes counterSlide{from{opacity:.2;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes counterFlip{from{opacity:.2;transform:perspective(300px) rotateX(45deg)}to{opacity:1;transform:none}}
@keyframes counterFade{from{opacity:.2}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.counter-wrap[data-counter-style] :is(.is-changing,.counter-live-dot){animation:none!important}}

/* Full platform rows remain legible in both the studio and OBS. */
.counter-platform-values{display:grid;gap:0;margin-top:14px;border-top:1px solid #ffffff18;font:600 16px/1.4 var(--counter-font);letter-spacing:0;min-width:0}.counter-platform-values[hidden]{display:none}.counter-platform-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;padding:9px 0;border-bottom:1px solid #ffffff0a}.counter-platform-row:last-child{border-bottom:0;padding-bottom:0}.counter-platform-brand{display:flex;align-items:center;gap:9px;min-width:0;color:var(--platform-color)}.counter-platform-brand svg{width:19px;height:19px;fill:currentColor;flex:none}.counter-platform-brand>span{white-space:nowrap}.counter-platform-count{text-align:right;display:flex;gap:9px;align-items:center;min-width:0;color:var(--counter-text);font-variant-numeric:tabular-nums}.counter-platform-count b{font-size:19px;font-weight:var(--counter-weight);white-space:nowrap}.counter-platform-count small{font-size:10px;font-weight:500;color:var(--counter-label);line-height:1.4}.counter-platform-row[data-state=unsupported] .counter-platform-count b{color:var(--counter-label)}.counter-platform-row[data-platform=youtube]{--platform-color:#ff536d}.counter-platform-row[data-platform=kick]{--platform-color:#53fc18}.counter-platform-row[data-platform=tiktok]{--platform-color:#25f4ee}