/* Shares the Chat studio controls, with a native counter preview. */
.theme-page.page-counter .shell{width:min(1240px,calc(100% - 64px))}
.theme-page.page-counter .hero{padding:22px 0 40px;max-width:850px}
.theme-page.page-counter .hero h1{margin:16px auto;font-size:clamp(42px,5vw,66px)}
.theme-page.page-counter .hero>p{max-width:620px;margin:0 auto;font-size:14px}
.theme-page.page-counter .hero .search-box{margin-top:24px;width:min(760px,100%)}
.theme-page.page-counter .hero .counter-refresh-hint{margin:10px auto 0;font-size:9px;color:#777}
.counter-studio .url-row{display:flex;gap:8px;width:100%}
.counter-studio .url-row input{flex:1;min-width:0;height:42px;padding:0 12px;border:1px solid #ffffff16;border-radius:9px;background:#0b0b0b;color:#ccc;font-size:10px}
.counter-studio .url-row button{flex:0 0 auto;min-height:42px;padding:0 13px;border:1px solid #ffffff16;border-radius:9px;background:#ffffff04;color:#eee;font-size:10px;cursor:pointer}
.counter-studio .export-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.counter-studio :is(.primary-btn,.secondary-btn){display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 14px;border-radius:9px;text-decoration:none;font-size:10px;cursor:pointer}
.counter-studio .primary-btn{border:0;color:white}
.counter-mini{height:75px;display:grid;grid-template-columns:1fr 1fr;gap:6px;align-items:center;padding:8px;background:repeating-conic-gradient(#101010 0% 25%,#141414 0% 50%) 50%/12px 12px;border:1px solid #ffffff0b;border-radius:7px}
.counter-mini-card{position:relative;border:1px solid #ffffff1c;background:#202020;border-radius:6px;padding:8px;min-width:0;display:grid;grid-template-columns:13px minmax(0,1fr);gap:3px 5px;border-top:2px solid var(--tone-ff002b,#ff002b)}
.counter-mini-card:after{content:'';display:block;width:75%;height:2px;background:#575757;grid-column:1/-1;margin-top:3px}
.counter-mini-card i{height:12px;width:12px;grid-row:1/3;border:1px solid var(--tone-ff002b,#ff002b);border-radius:4px;align-self:center;background:var(--tone-ff002b16,#ff002b16)}
.counter-mini-card b{height:3px;width:68%;background:#777;border-radius:2px;display:block}
.counter-mini-card em{height:9px;background:#ddd;display:block;width:82%;border-radius:1px}
.counter-mini[data-mini="glass"] .counter-mini-card{background:linear-gradient(135deg,#ffffff12,#222);border:1px solid #ffffff35}
.counter-mini[data-mini="split"] .counter-mini-card{border-top:1px solid #ffffff1c}.counter-mini[data-mini="split"] .counter-mini-card i{height:25px;border-radius:0;border:0;border-right:2px solid var(--tone-ff002b,#ff002b);background:transparent}
.counter-mini[data-mini="neon"] .counter-mini-card{border:1px solid var(--tone-ff002b80,#ff002b80)}.counter-mini[data-mini="neon"] .counter-mini-card i{border-radius:50%}
.counter-mini[data-mini="minimal"] .counter-mini-card{background:transparent;border:0;padding:5px}.counter-mini[data-mini="minimal"] .counter-mini-card i{background:transparent;border:0}
.counter-mini[data-mini="compact"] .counter-mini-card{grid-template-columns:1fr 1fr;padding:8px 5px;border:1px solid #ffffff1c}.counter-mini[data-mini="compact"] .counter-mini-card i,.counter-mini[data-mini="compact"] .counter-mini-card:after{display:none}.counter-mini[data-mini="compact"] .counter-mini-card b{height:4px;align-self:center}.counter-mini[data-mini="compact"] .counter-mini-card em{width:90%;height:10px}
.counter-mini[data-mini="scoreboard"]{border:1px solid #ffffff40;background:#1d1d1d;gap:0}.counter-mini[data-mini="scoreboard"] .counter-mini-card{border:0;background:transparent;border-radius:0}.counter-mini[data-mini="scoreboard"] .counter-mini-card+.counter-mini-card{border-left:1px solid #ffffff20}
.counter-mini[data-mini="outline"] .counter-mini-card{background:transparent;border:1px solid var(--tone-ff002b90,#ff002b90)}.counter-mini[data-mini="outline"] .counter-mini-card i{background:transparent;border:0}
.counter-preview-stage{height:310px;transition:height .2s}
.counter-preview-stage.portrait{height:500px}
.counter-studio .designer-preview .preview-top>div{display:block}
.counter-studio .color-grid .color-control:last-child{grid-column:1/-1}
.counter-canvas-presets{display:flex;gap:8px;flex-wrap:wrap}.counter-canvas-presets button{flex:1;min-height:34px;padding:7px 8px;font-size:9px;color:#ccc;border:1px solid #ffffff17;border-radius:7px;background:#0b0b0b;cursor:pointer}.counter-canvas-presets button:hover{border-color:var(--tone-ff002b70,#ff002b70);color:#fff}
.counter-stream-info{display:flex;align-items:center;gap:10px;border-top:1px solid #ffffff12;padding-top:16px;margin-top:18px}.counter-stream-info[hidden]{display:none}.counter-stream-info>div{flex:1;min-width:0}.counter-stream-info strong{display:block;color:#ddd;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.counter-stream-info>div>span{display:block;color:#777;font-size:9px;margin-top:4px}.counter-stream-info .live-badge{flex:0 0 auto;font-size:8px;padding:6px;box-shadow:none}
.counter-analytics{margin-top:26px;border:1px solid #ffffff14;border-radius:18px;padding:0 20px;background:#111111aa}.counter-analytics[hidden]{display:none}.counter-analytics>summary{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:22px 0;cursor:pointer;list-style:none;color:#bbb;font-size:12px}.counter-analytics>summary::-webkit-details-marker{display:none}.counter-analytics>summary>span{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.counter-analytics>summary b{font-size:9px;letter-spacing:.1em;color:var(--tone-ff4d68,#ff4d68)}.counter-analytics>summary i{font-style:normal;font-size:18px;color:#888}.counter-analytics[open]>summary i{transform:rotate(45deg)}.counter-analytics .dashboard{margin:0;padding-bottom:20px}
.counter-modal-stage{height:210px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:repeating-conic-gradient(#0e0e0e 0% 25%,#121212 0% 50%) 50%/24px 24px;border:1px solid #ffffff14;border-radius:12px;margin:18px 0}.counter-modal-stage.portrait{height:320px}
.theme-page.page-counter .obs-modal{max-height:calc(100dvh - 32px);overflow:auto}
.theme-page.page-counter .counter-modal-stage .chat-preview-fit iframe{color-scheme:normal}
@media(max-width:1000px){.theme-page.page-counter .shell{width:calc(100% - 48px)}.counter-mini{padding:6px;gap:4px}.counter-mini-card{padding:6px;gap:3px}.counter-preview-stage{height:280px}}
@media(max-width:760px){.theme-page.page-counter .hero{padding:18px 0 32px}.counter-preview-stage{height:235px}.counter-preview-stage.portrait{height:440px}.theme-page.page-counter .toast{bottom:76px}}
@media(max-width:560px){.theme-page.page-counter .shell{width:calc(100% - 32px)}.theme-page.page-counter .hero h1{font-size:42px}.theme-page.page-counter .hero>p{font-size:12px;line-height:1.7}.theme-page.page-counter .hero .search-box{margin-top:20px}.counter-mini{height:70px;padding:5px;gap:4px}.counter-mini-card{padding:5px;grid-template-columns:9px minmax(0,1fr);gap:3px}.counter-mini-card i{width:9px;height:9px}.counter-mini-card em{height:8px}.counter-preview-stage{height:225px}.counter-preview-stage.portrait{height:430px}.counter-analytics{padding:0 12px}.counter-analytics>summary{padding:17px 0}.theme-page.page-counter .obs-modal{padding:22px 16px}.counter-modal-stage{height:170px}}
@media(max-width:360px){.theme-page.page-counter .shell{width:calc(100% - 24px)}.counter-mini{height:62px;padding:4px}.counter-mini-card{padding:4px;grid-template-columns:7px minmax(0,1fr)}.counter-mini-card i{width:7px;height:7px}.counter-preview-stage{height:200px}.counter-preview-stage.portrait{height:390px}}
@media(prefers-reduced-motion:reduce){.counter-preview-stage{transition:none}}