.layout-version2,.layout-streamelements{--bg-main:#0d1016;--bg-surface:#11151c;--bg-card:#171d27}.layout-version2 .content-body,.layout-streamelements .content-body{max-width:1520px;padding:30px clamp(18px,3vw,48px)}.studio-rail{width:74px;flex:0 0 74px;height:100vh;height:100dvh;position:sticky;top:0;z-index:83;display:flex;flex-direction:column;align-items:center;background:#10151e;border-inline-end:1px solid #2b3544}.studio-rail button{font:inherit;cursor:pointer}.studio-rail-brand{width:100%;height:76px;display:grid;place-items:center;border:0;border-bottom:1px solid #2b3544;background:transparent}.studio-rail-sections{width:100%;display:flex;align-items:center;flex-direction:column;gap:9px;padding:20px 7px;flex:1;overflow-y:auto}.studio-rail-group{width:60px;min-height:62px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;border:1px solid transparent;border-radius:10px;background:transparent;color:#8998ac}.studio-rail-group span{font-size:9px;font-weight:700;line-height:1.1;max-width:58px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.studio-rail-group:hover,.studio-rail-group.is-open{background:#202b39;color:#fff}.studio-rail-group.is-active{background:#223448;border-color:#42678d;color:#a9dcff}.studio-rail-account{margin:10px auto 16px;width:44px;height:44px;border:1px solid #394457;border-radius:10px;background:#1a2330;color:#d8e1ee;display:grid;place-items:center}.studio-scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:81;border:0;background:#0008;cursor:default}.studio-flyout{position:fixed;z-index:82;inset-block:0;inset-inline-start:74px;width:min(320px,calc(100vw - 74px));display:flex;flex-direction:column;background:#171e29;border-inline-end:1px solid #3a485c;box-shadow:16px 0 40px #0008;color:#f3f7fc}.studio-flyout-head{height:88px;display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid #303d4d}.studio-flyout-head small{font-size:10px;font-weight:800;letter-spacing:.15em;color:#7dbff2}.studio-flyout-head h2{font-size:19px;margin:4px 0 0}.studio-flyout-head button{width:32px;height:32px;border:1px solid #354154;border-radius:7px;background:#222c3a;color:#c9d5e3;cursor:pointer}.studio-flyout-links{display:flex;flex-direction:column;gap:4px;overflow-y:auto;padding:14px}.studio-flyout-links button{min-height:45px;display:flex;align-items:center;gap:13px;text-align:start;border:1px solid transparent;border-radius:8px;background:transparent;color:#b5c2d0;padding:9px 12px;font:inherit;font-size:13px;font-weight:650;cursor:pointer}.studio-flyout-links button:hover,.studio-flyout-links button.is-active{background:#27374a;color:#fff;border-color:#375574}.studio-flyout-links button span:last-child{margin-inline-start:auto;font-size:20px;font-weight:400;color:#8294a8}.studio-flyout-links button.studio-signout{margin-top:12px;border-top:1px solid #384255;color:#f5b8b8}.studio-flyout-foot{margin-top:auto;border-top:1px solid #303d4d;padding:18px 22px;color:#8493a6;font-size:12px}.layout-version2 .studio-top-navbar,.layout-streamelements .studio-top-navbar{min-height:78px;height:auto;padding:13px clamp(18px,3vw,48px);background:#111721!important;border-bottom:1px solid #293545!important;display:flex;align-items:center;justify-content:space-between;gap:18px}.studio-top-context{display:flex;align-items:center;gap:13px;min-width:0}.studio-top-overline{display:block;color:#7da6c9;font-size:10px;font-weight:800;letter-spacing:.14em}.studio-top-context h1{margin:2px 0 0;font-size:21px;font-weight:780;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.studio-top-actions{display:flex;align-items:center;gap:10px}.studio-channel{color:#9eacbf;font-size:12px;border-inline-end:1px solid #344052;padding-inline-end:15px}.studio-top-action{border:1px solid #36465b;background:#1c2938;color:#dbe6f2;border-radius:7px;min-height:36px;padding:7px 14px;font-size:12px;font-weight:700;cursor:pointer}.studio-top-action:hover{background:#2b3e52}.studio-mobile-menu{display:none;width:40px;height:40px;border:1px solid #36465b;border-radius:8px;background:#1c2938;color:#fff;align-items:center;justify-content:center}@media(max-width:760px){.layout-version2 .studio-rail,.layout-streamelements .studio-rail{position:fixed;inset-block:0;inset-inline-start:0;transform:translate(-100%);transition:transform .18s;box-shadow:8px 0 25px #0008}.layout-version2 .studio-rail.mobile-open,.layout-streamelements .studio-rail.mobile-open{transform:translate(0)}.studio-flyout{inset-inline-start:74px}.studio-mobile-menu{display:flex}.studio-channel{display:none}.studio-top-actions{gap:6px}.studio-top-action{padding:7px 9px}.layout-version2 .studio-top-navbar{padding:10px 14px}.layout-version2 .content-body{padding:17px 12px}}@media(max-width:440px){.studio-top-actions .studio-top-action:first-of-type{display:none}.studio-top-context h1{font-size:18px}}@media(max-width:760px){[dir=rtl] .studio-rail{transform:translate(100%)!important}[dir=rtl] .studio-rail.mobile-open{transform:translate(0)!important}}.material-icons{display:none!important}:root{--bg-main: #090a0f;--bg-surface: #0e111a;--bg-card: #121520;--bg-card-hover: #161a28;--bg-input: #0a0c14;--accent-red: #ef4444;--accent-red-hover: #dc2626;--accent-red-dark: #b91c1c;--accent-amber: #f59e0b;--accent-amber-light: #fbbf24;--accent-amber-hover: #d97706;--accent-amber-dark: #b45309;--text-main: #f8fafc;--text-muted: #94a3b8;--text-dim: #8b9bb4;--text-accent: #fbbf24;--border-subtle: rgba(255, 255, 255, .07);--border-focus: rgba(245, 158, 11, .5);--border-strong: rgba(255, 255, 255, .14);--status-online: #10b981;--status-warning: #f59e0b;--status-danger: #ef4444;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-full: 9999px;--transition: all .15s ease}[data-layout-preset=nightbot],.layout-nightbot{--bg-main: #0b0f19;--bg-surface: #0f172a;--bg-card: #131d31;--bg-card-hover: #1e293b;--bg-input: #080c16;--accent-red: #38bdf8;--accent-red-hover: #0284c7;--accent-red-dark: #0369a1;--accent-amber: #38bdf8;--accent-amber-light: #7dd3fc;--accent-amber-hover: #0284c7;--accent-amber-dark: #0369a1;--text-main: #f8fafc;--text-muted: #94a3b8;--text-dim: #8b9bb4;--text-accent: #38bdf8;--border-subtle: rgba(56, 189, 248, .15);--border-focus: rgba(56, 189, 248, .5);--border-strong: rgba(56, 189, 248, .28);--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px}[data-layout-preset=version1],[data-layout-preset=version2],[data-layout-preset=version3],[data-layout-preset=matgoog],[data-layout-preset=streamelements],[data-layout-preset=nightbot],.layout-version1,.layout-version2,.layout-version3,.layout-matgoog,.layout-streamelements,.layout-nightbot{--bg-main: #0b0e14;--bg-surface: #0d111a;--bg-card: #111622;--bg-card-hover: #161c2b;--bg-input: #090c13;--accent-red: #f97316;--accent-red-hover: #ea580c;--accent-red-dark: #c2410c;--accent-amber: #f97316;--accent-amber-light: #fb923c;--accent-amber-hover: #ea580c;--accent-amber-dark: #c2410c;--text-main: #ffffff;--text-muted: #94a3b8;--text-dim: #8b9bb4;--text-accent: #f97316;--border-subtle: rgba(255, 255, 255, .08);--border-focus: rgba(249, 115, 22, .45);--border-strong: rgba(255, 255, 255, .16);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px}.layout-horizontal-top{display:flex;flex-direction:column}.layout-horizontal-top .full-width-content{width:100%;margin:0}*{box-sizing:border-box;margin:0;padding:0;-webkit-font-smoothing:antialiased}body{background-color:var(--bg-main);color:var(--text-main);font-family:var(--font-family);direction:ltr;min-height:100vh;min-height:100dvh;line-height:1.6;overflow-x:hidden;touch-action:manipulation}button,input,select,textarea{font-family:inherit;touch-action:manipulation}.card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:22px;transition:var(--transition);box-shadow:0 1px 3px #0003}.card:hover{border-color:#ffffff24}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 18px;border-radius:var(--radius-md);font-weight:700;font-size:.9rem;cursor:pointer;border:1px solid transparent;transition:var(--transition);text-decoration:none;-webkit-user-select:none;user-select:none;line-height:1;touch-action:manipulation}.btn-primary{background:#f59e0b;color:#08090d;border:1px solid rgba(251,191,36,.5);box-shadow:none}.btn-primary:hover{background:#fbbf24;color:#040507;border-color:#fbbf24;transform:none;box-shadow:0 2px 6px #0000004d}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:#141724;color:#e2e8f0;border:1px solid rgba(255,255,255,.1)}.btn-secondary:hover{background:#1b2030;border-color:#fff3;color:#fff}.btn-outline{background:transparent;color:var(--accent-amber);border:1px solid rgba(245,158,11,.4)}.btn-outline:hover{background:#f59e0b1a;border-color:var(--accent-amber);color:#fbbf24}.btn-danger{background:#ef444424;color:#fca5a5;border:1px solid rgba(239,68,68,.28)}.btn-danger:hover{background:#ef444440;border-color:#ef4444;color:#fff}.btn-lg{height:50px;padding:0 32px;font-size:1.05rem;border-radius:var(--radius-md)}.dashboard-grid-3{display:grid;grid-template-columns:1fr;gap:20px}@media(min-width:1024px){.dashboard-grid-3{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1.2fr)}}.dashboard-split-2{display:grid;grid-template-columns:1fr;gap:20px}@media(min-width:960px){.dashboard-split-2{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}}.dashboard-grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:20px}.badge{display:inline-flex;align-items:center;padding:3px 8px;border-radius:var(--radius-sm);font-size:.74rem;font-weight:800;letter-spacing:.4px;text-transform:uppercase;line-height:1.2}.badge-yellow{background:#f59e0b26;color:#fbbf24;border:1px solid rgba(245,158,11,.35)}.badge-red{background:#ef444424;color:#f87171;border:1px solid rgba(239,68,68,.28)}.badge-green{background:#10b98124;color:#34d399;border:1px solid rgba(16,185,129,.28)}.badge-gray{background:#ffffff12;color:var(--text-muted);border:1px solid var(--border-subtle)}.status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:6px}.status-dot.online{background:var(--status-online);box-shadow:none}.status-dot.offline{background:var(--text-dim)}.status-dot.gold,.status-dot.red{background:var(--accent-red, #ef4444);box-shadow:none}.table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.table-custom{min-width:620px;width:100%;border-collapse:collapse}.form-group{margin-bottom:16px}.form-label{display:block;font-size:.86rem;font-weight:700;color:var(--text-muted);margin-bottom:6px}.form-input,.form-select,.form-textarea{width:100%;background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:10px 14px;color:var(--text-main);font-size:.94rem;transition:var(--transition);outline:none}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:#ef444480;box-shadow:0 0 0 3px #ef444426}.app-container{display:flex;min-height:100vh}.sidebar{width:260px;background:var(--bg-surface);border-right:1px solid var(--border-subtle);display:flex;flex-direction:column;flex-shrink:0;position:sticky;top:0;height:100vh;overflow-y:auto}.main-content{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg-main)}.top-navbar{height:64px;background:var(--bg-surface);border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:static}.content-body{padding:28px;flex:1;max-width:1400px;width:100%;margin:0 auto}.nav-item{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;color:var(--text-muted);text-decoration:none;font-weight:700;font-size:.92rem;border-left:3px solid transparent;cursor:pointer;transition:var(--transition)}.nav-item:hover{color:var(--text-main);background:#ffffff08}.nav-item.active{color:#fff;background:#f59e0b1a;border-left-color:var(--accent-amber)}.layout-version1 .sidebar,.layout-version2 .sidebar,.layout-matgoog .sidebar{background:#0d111a;border-right:1px solid rgba(255,255,255,.05);width:260px}.layout-version1 .top-navbar,.layout-version2 .top-navbar,.layout-matgoog .top-navbar{background:transparent;border-bottom:1px solid rgba(255,255,255,.05)}.layout-version1 .nav-item.active,.layout-version2 .nav-item.active,.layout-matgoog .nav-item.active{background:#f973161f;color:#fff;border-left-color:#f97316}.table-responsive{width:100%;overflow-x:auto}.table-custom{width:100%;border-collapse:collapse;text-align:left}.table-custom th{padding:12px 16px;font-size:.8rem;font-weight:800;color:var(--text-dim);text-transform:uppercase;border-bottom:1px solid var(--border-subtle);background:#0003}.table-custom td{padding:14px 16px;border-bottom:1px solid var(--border-subtle);font-size:.92rem}.table-custom tr:hover td{background:#ffffff05}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:100;padding:16px}.modal-box{background:var(--bg-card);border:1px solid var(--border-strong);border-radius:var(--radius-lg);max-width:580px;width:100%;padding:28px;box-shadow:0 20px 50px #000000b3;position:relative;max-height:90vh;overflow-y:auto}.logo-animated-motion{display:flex;align-items:center;gap:10px}.status-dot.online{background-color:var(--status-online)}.mobile-nav-toggle,.sidebar-close-btn{display:none!important;background:transparent;border:1px solid var(--border-subtle);color:var(--text-main);padding:0;cursor:pointer;border-radius:var(--radius-sm);align-items:center;justify-content:center;min-height:48px;min-width:48px;touch-action:manipulation;transition:var(--transition)}.mobile-nav-toggle:hover,.sidebar-close-btn:hover{background:#ffffff0d;border-color:var(--border-strong)}.sidebar-backdrop{display:none}@media(max-width:900px){.mobile-nav-toggle,.sidebar-close-btn{display:inline-flex!important}.sidebar{position:fixed;top:0;left:0;bottom:0;width:290px;height:100vh;z-index:1000;background:#090b12;border-right:1px solid var(--border-strong);transform:translate(-100%);transition:transform .3s cubic-bezier(.16,1,.3,1);box-shadow:none;overflow-y:auto}.sidebar.mobile-open{transform:translate(0);box-shadow:20px 0 50px #000000e6}.sidebar-backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:999;opacity:0;pointer-events:none;transition:opacity .25s ease}.sidebar-backdrop.mobile-open{opacity:1;pointer-events:auto}.top-navbar{height:60px;padding:0 16px}.content-body{padding:16px 14px}.btn{min-height:44px}.nav-item{padding:14px 20px;font-size:.95rem;min-height:48px}input,select,textarea{font-size:16px!important}.table-responsive{border-radius:var(--radius-md);border:1px solid var(--border-subtle);-webkit-overflow-scrolling:touch}}@media(max-width:640px){.top-navbar{padding:0 12px}.navbar-status-text{display:none}.content-body{padding:12px 10px}.modal-overlay{align-items:flex-end;padding:0}.modal-box{border-radius:20px 20px 0 0;max-height:88vh;width:100%;max-width:100%;border-bottom:none;padding:22px 18px 32px;box-shadow:0 -10px 40px #000c}}.audio-trimmer-wrap{position:relative;width:100%;height:38px;display:flex;align-items:center}.audio-trimmer-track{position:absolute;left:0;right:0;height:8px;border-radius:9999px;background:#ffffff14;border:1px solid rgba(255,255,255,.06)}.audio-trimmer-highlight{position:absolute;height:8px;border-radius:9999px;background:#38bdf8;box-shadow:none}.audio-trimmer-input{position:absolute;left:0;top:0;width:100%;height:38px;background:transparent;pointer-events:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;outline:none}.audio-trimmer-input::-webkit-slider-runnable-track{background:transparent;height:8px}.audio-trimmer-input::-moz-range-track{background:transparent;height:8px}.audio-trimmer-input::-webkit-slider-thumb{pointer-events:auto;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid #38bdf8;box-shadow:0 2px 6px #00000080;cursor:grab;transition:transform .1s ease,box-shadow .1s ease;margin-top:-5px}.sidebar-streamer-card{position:relative;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;margin:12px 14px 16px;background:#ffffff08;border:1px solid var(--border-subtle);border-radius:12px;cursor:pointer;transition:all .15s ease;-webkit-user-select:none;user-select:none}.sidebar-streamer-card:hover{background:#ffffff0f;border-color:#f9731659}.streamer-popup-menu{position:absolute;bottom:calc(100% + 8px);left:0;right:0;background:#0d121f;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:8px;box-shadow:0 16px 40px #000000b3;z-index:1000;display:flex;flex-direction:column;gap:4px;animation:popupFade .15s ease-out}@keyframes popupFade{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.streamer-popup-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 12px;border:none;background:transparent;color:#cbd5e1;font-size:.85rem;font-weight:700;border-radius:8px;cursor:pointer;text-align:left;transition:all .12s ease}.streamer-popup-item:hover{background:#ffffff14;color:#fff}.streamer-popup-item.logout{color:#ef4444}.streamer-popup-item.logout:hover{background:#ef44441f;color:#fca5a5}.audio-trimmer-input.end-thumb::-webkit-slider-thumb{border-color:#34d399;box-shadow:0 2px 6px #00000080}.audio-trimmer-input::-moz-range-thumb{pointer-events:auto;width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid #38bdf8;box-shadow:0 2px 6px #00000080;cursor:grab}.audio-trimmer-input.end-thumb::-moz-range-thumb{border-color:#34d399;box-shadow:0 2px 6px #00000080}.audio-trimmer-input:active::-webkit-slider-thumb{transform:scale(1.2);cursor:grabbing}.audio-trimmer-input:active::-moz-range-thumb{transform:scale(1.2);cursor:grabbing}.app-container.admin-fullscreen{width:100vw;max-width:100%;display:flex;flex-direction:column;min-height:100vh}.admin-main-content{width:100%;flex:1;display:flex;flex-direction:column;background:var(--bg-main)}.admin-content-body{max-width:1600px;width:100%;margin:0 auto;padding:24px 32px}.admin-back-btn{-webkit-user-select:none;user-select:none}@media(max-width:768px){.admin-top-bar{padding:10px 14px!important;height:auto!important;min-height:64px;flex-wrap:wrap;gap:10px}.admin-content-body{padding:16px 12px}}@media(max-width:768px){html,body{overflow-x:hidden!important;width:100%!important;max-width:100%!important}.app-container,.main-content,.content-body{width:100%!important;max-width:100%!important;overflow-x:hidden!important;box-sizing:border-box}.content-body{padding:14px 12px!important}button,select,input[type=button],input[type=submit],.btn,.mobile-nav-toggle{min-height:48px!important;min-width:48px;touch-action:manipulation}input,select,textarea{font-size:16px!important}.app-container{padding-top:env(safe-area-inset-top,0px);padding-bottom:max(16px,env(safe-area-inset-bottom,16px));padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.top-navbar{padding-left:max(14px,env(safe-area-inset-left,14px))!important;padding-right:max(14px,env(safe-area-inset-right,14px))!important}.table-responsive,table{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.modal-dialog,.modal-content,[role=dialog]>div{max-width:min(94vw,440px)!important;margin:12px auto!important;padding:18px 14px!important;box-sizing:border-box}}.hamburger-bars{display:flex;flex-direction:column;justify-content:space-between;width:18px;height:13px;pointer-events:none}.hamburger-bars span{display:block;height:2px;width:100%;background-color:var(--text-main, #ffffff);border-radius:2px;transition:transform .15s ease,opacity .15s ease}@media(max-width:480px){h1{font-size:1.5rem!important}h2{font-size:1.25rem!important}h3{font-size:1.1rem!important}}.layout-version2{background-color:#080b11;color:#f1f5f9}.layout-version2 .sidebar{background:#0a0d14!important;border-right:1px solid #1a2231!important;border-left:1px solid #1a2231!important}.layout-version2 .top-navbar{background:#080b11!important;border-bottom:1px solid #1a2231!important}.layout-version2 .studio-quick-tabs{display:flex;align-items:center;gap:6px;background:#0a0d14;padding:4px;border-radius:8px;border:1px solid #1a2231}@media(max-width:1100px){.layout-version2 .studio-quick-tabs{display:none}}
