@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Nunito:wght@400;500;600;700;800;900&display=swap');
:root{--bg:#05070d;--panel:#0b0f1b;--panel2:#0d1220;--border:rgba(255,255,255,.08);--text:#f4f6fa;--muted:#8690a3;--green:#24f36a;--purple:#8b46ff;--purple2:#b775ff;--red:#ff4a63;--yellow:#ffd84d;--r:18px}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;color:var(--text);font:15px Nunito,system-ui,sans-serif;background:radial-gradient(circle at 8% 10%,rgba(139,70,255,.13),transparent 30%),radial-gradient(circle at 92% 90%,rgba(36,243,106,.08),transparent 32%),#05070d}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.app{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;padding:20px 16px;border-right:1px solid var(--border);background:rgba(5,7,13,.97);display:flex;flex-direction:column}.brand{text-align:center;padding-bottom:22px}.logo-wrap{width:132px;height:132px;margin:0 auto 15px;position:relative}.logo-wrap:before{content:'';position:absolute;inset:-8px;border-radius:50%;background:conic-gradient(var(--green),var(--purple),var(--green));filter:blur(18px);opacity:.2}.logo{width:100%;height:100%;object-fit:cover;border-radius:50%;position:relative;border:3px solid transparent;background:linear-gradient(#070a12,#070a12) padding-box,linear-gradient(135deg,var(--green),var(--purple)) border-box}.brand h1{font:600 22px Fredoka}.brand p{font:500 12px Fredoka;color:var(--green);margin-top:4px}.nav{display:grid;gap:5px}.nav a{display:flex;align-items:center;gap:12px;padding:12px 13px;border-radius:12px;color:#929caf;font-weight:700}.nav a:hover,.nav a.active{color:#fff;background:linear-gradient(90deg,rgba(139,70,255,.17),rgba(139,70,255,.03));box-shadow:inset 3px 0 var(--purple)}.nav i{width:19px;color:var(--purple2)}.sidebar-bottom{margin-top:auto;display:grid;gap:10px}.mini-box{padding:13px;border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.02);font-size:11px;color:var(--muted)}.mini-box strong{display:block;color:#dfe4ec}.main{padding:0 24px 34px}.topbar{height:80px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.05)}.topbar .title{font:600 21px Fredoka}.top-actions{display:flex;gap:8px}.pill{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid var(--border);border-radius:11px;background:rgba(255,255,255,.02);font-size:11px;font-weight:800}.content{padding-top:18px}.hero{min-height:325px;border:1px solid var(--border);border-radius:22px;background:linear-gradient(120deg,rgba(13,17,30,.97),rgba(8,11,20,.96));display:grid;grid-template-columns:1.1fr .9fr;overflow:hidden;position:relative}.hero:before{content:'';position:absolute;left:8%;right:8%;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--purple),var(--green),transparent)}.hero-copy{padding:36px 34px;display:flex;flex-direction:column;justify-content:center;z-index:2}.eyebrow{font-size:10px;font-weight:900;color:#ff8b9a;border:1px solid rgba(255,74,99,.22);background:rgba(255,74,99,.06);border-radius:999px;padding:6px 10px;width:max-content}.welcome{font:500 26px Fredoka;margin-top:12px}.hero h2{font:600 clamp(52px,5vw,78px)/.94 Fredoka;letter-spacing:-.05em}.hero h2 span{color:var(--green);font-weight:700;text-shadow:0 0 28px rgba(36,243,106,.14)}.hero-desc{font:400 15px/1.6 Fredoka;color:#adb6c5;margin-top:15px}.audience{display:flex;gap:10px;margin-top:18px}.metric{display:flex;align-items:center;gap:11px;padding:10px 14px;border-radius:13px;border:1px solid rgba(36,243,106,.15);background:rgba(36,243,106,.05)}.metric b{font:600 21px Fredoka}.metric small{display:block;color:var(--muted)}.metric i{color:var(--green)}.actions{display:flex;gap:9px;margin-top:18px;flex-wrap:wrap}.btn{border:0;border-radius:11px;min-height:43px;padding:0 15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:900;cursor:pointer}.btn-purple{background:linear-gradient(135deg,#7934ef,#aa59ff);color:white}.btn-green{background:rgba(36,243,106,.08);border:1px solid rgba(36,243,106,.2);color:#aaffbf}.btn-dark{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.12);color:#dbe1ea}.hero-visual{position:relative;background:radial-gradient(circle at 55% 40%,rgba(139,70,255,.3),transparent 33%),radial-gradient(circle at 90% 82%,rgba(36,243,106,.1),transparent 28%),#090d18}.hero-visual:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0b0f1b 0,rgba(11,15,27,.5) 18%,transparent 50%)}.monitor{position:absolute;right:12%;top:62px;width:285px;height:145px;border:5px solid #171c2a;border-radius:12px;background:radial-gradient(circle,rgba(139,80,255,.75),transparent 30%),linear-gradient(135deg,#1b1032,#121a38);box-shadow:0 0 45px rgba(139,70,255,.2)}.desk{position:absolute;left:18%;right:8%;bottom:62px;height:12px;border-radius:7px;background:#20263a}.chair{position:absolute;left:26%;bottom:36px;width:85px;height:155px;border-radius:31px 31px 18px 18px;background:linear-gradient(160deg,#121620,#090c13)}.live-card{position:absolute;right:18px;bottom:18px;width:180px;padding:15px;border:1px solid var(--border);border-radius:14px;background:rgba(7,10,18,.88)}.live-card b{display:block;color:var(--green);font:600 23px Fredoka}.section,.card{border:1px solid var(--border);border-radius:17px;background:linear-gradient(145deg,rgba(11,15,27,.95),rgba(8,11,20,.95))}.section{margin-top:15px}.section-head{padding:14px 16px;display:flex;align-items:center;justify-content:space-between}.section-head h3,.card h3{font:500 18px Fredoka}.clips{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:0 15px 15px}.clip{border:1px solid var(--border);border-radius:13px;overflow:hidden}.thumb{height:120px;background:radial-gradient(circle at 40% 45%,rgba(139,70,255,.5),transparent 40%),#151727;display:grid;place-items:center}.clip:nth-child(2) .thumb{background:radial-gradient(circle at 65% 40%,rgba(36,243,106,.28),transparent 40%),#101a20}.clip:nth-child(3) .thumb{background:radial-gradient(circle,rgba(255,80,180,.3),transparent 44%),#1b1320}.clip:nth-child(4) .thumb{background:radial-gradient(circle,rgba(95,130,255,.35),transparent 44%),#121729}.clip-body{padding:11px}.clip-body b{font:500 12px Fredoka}.clip-body small{display:block;color:var(--muted);margin-top:3px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-top:15px}.card{padding:17px;min-height:230px}.card p{color:#8590a2;font-size:11px;line-height:1.65;margin-top:11px}.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.stat{padding:10px;border:1px solid var(--border);border-radius:10px;text-align:center}.stat b{font:500 15px Fredoka}.stat small{display:block;color:var(--muted)}.list{display:grid;gap:9px;margin-top:13px}.list div{display:flex;gap:8px;color:#8d97a8;font-size:11px}.list i{color:var(--green);width:16px}.bottom-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:11px;margin-top:15px}.support-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}.support-actions div{padding:12px;border:1px solid var(--border);border-radius:10px;text-align:center;font-weight:800;font-size:11px}.page-title{font:600 30px Fredoka}.page-sub{color:var(--muted);margin-top:5px}.panel{margin-top:18px;padding:18px;border:1px solid var(--border);border-radius:17px;background:var(--panel)}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:11px;border-bottom:1px solid var(--border);font-size:12px}th{color:#aeb7c5}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field label{display:block;font-weight:800;margin-bottom:5px}.field input,.field select,.field textarea{width:100%;padding:11px 12px;border-radius:10px;border:1px solid var(--border);background:#070b14;color:#fff}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--border)}.badge{padding:4px 8px;border-radius:999px;background:rgba(139,70,255,.12);color:#d6bdff;font-size:10px;font-weight:900}.notice{padding:12px;border:1px solid rgba(36,243,106,.18);border-radius:12px;background:rgba(36,243,106,.05);color:#baffc9;margin-bottom:12px}.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(520px,100%);padding:30px;border:1px solid var(--border);border-radius:24px;background:rgba(10,14,25,.94);text-align:center}.login-card .logo-wrap{width:120px;height:120px}.login-card h1{font:600 34px Fredoka}.control-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:12px}.queue-item{display:grid;grid-template-columns:52px 1fr auto;gap:10px;align-items:center;padding:10px;border-bottom:1px solid var(--border)}.queue-item img{width:52px;height:36px;object-fit:cover;border-radius:7px}.control-buttons{display:flex;gap:8px;flex-wrap:wrap}.wheel-options{display:grid;gap:8px;margin-top:12px}.obs-body{margin:0;background:transparent!important;overflow:hidden}.obs-root{position:fixed;inset:0;pointer-events:none;font-family:Nunito,sans-serif}.now-playing{position:absolute;left:50px;bottom:50px;min-width:410px;padding:16px 18px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(5,7,13,.78);backdrop-filter:blur(15px);transform:translateY(130%);opacity:0;transition:.45s}.now-playing.show{transform:none;opacity:1}.now-playing .label{font-size:10px;color:#7d8799;font-weight:900}.now-playing .song{font:600 22px Fredoka}.now-playing .next{font-size:11px;color:#8993a5;margin-top:6px}.toast-event{position:absolute;right:50px;bottom:50px;width:390px;padding:16px 18px;border-radius:16px;border:1px solid rgba(139,70,255,.28);background:rgba(9,10,20,.85);box-shadow:0 0 50px rgba(139,70,255,.18);transform:translateX(130%);transition:.45s}.toast-event.show{transform:none}.toast-event b{font:600 18px Fredoka}.fx-layer{position:absolute;inset:0;overflow:hidden}.particle{position:absolute;font-size:32px;animation:fall 3s linear forwards}@keyframes fall{from{transform:translateY(-80px) rotate(0)}to{transform:translateY(115vh) rotate(540deg)}}.hype{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transition:.3s;background:radial-gradient(circle,rgba(139,70,255,.22),transparent 55%)}.hype.show{opacity:1}.hype span{font:700 110px Fredoka;color:#fff;text-shadow:0 0 30px var(--purple),0 0 70px var(--green)}.wheel-overlay{position:absolute;inset:0;display:grid;place-items:center;background:rgba(2,4,9,.45);opacity:0;visibility:hidden;transition:.3s}.wheel-overlay.show{opacity:1;visibility:visible}.wheel-disc{width:520px;height:520px;border-radius:50%;background:conic-gradient(var(--purple) 0 25%,var(--green) 25% 50%,#ff5ab3 50% 75%,#4d7cff 75% 100%);border:8px solid rgba(255,255,255,.85);box-shadow:0 0 70px rgba(139,70,255,.35);display:grid;place-items:center;transition:transform 4s cubic-bezier(.12,.7,.1,1)}.wheel-disc span{padding:14px 18px;background:#090d16;border-radius:999px;font:600 24px Fredoka}@media(max-width:1200px){.clips,.grid4{grid-template-columns:repeat(2,1fr)}.hero{grid-template-columns:1fr}.hero-visual{display:none}.control-grid{grid-template-columns:1fr}}@media(max-width:760px){.app{display:block}.sidebar{height:auto;position:static}.nav,.sidebar-bottom{display:none}.brand{display:flex;gap:10px;align-items:center;text-align:left;padding:0}.logo-wrap{width:58px;height:58px;margin:0}.brand p{display:none}.main{padding:0 12px 25px}.topbar{height:60px}.hero-copy{padding:28px 21px}.hero h2{white-space:normal}.clips,.grid4,.bottom-grid,.form-grid,.support-actions{grid-template-columns:1fr}}

/* BEGIN REAL TWITCH RUNTIME */

/*
 * ============================================================
 * REAL TWITCH DATA
 * ============================================================
 */

.stream-realtime {
    position: relative;

    max-width: 640px;

    margin-top: 13px;

    padding:
        13px
        15px;

    overflow: hidden;

    border:
        1px solid
        rgba(255, 255, 255, 0.075);

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.025),
            rgba(255, 255, 255, 0.012)
        );

    transition:
        border-color 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
}

.stream-realtime::before {
    content: "";

    position: absolute;

    top: 0;
    left: 15%;
    right: 15%;

    height: 1px;

    opacity: 0;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--green),
            transparent
        );

    transition:
        opacity 0.3s ease;
}

.stream-realtime.is-live {
    border-color:
        rgba(36, 243, 106, 0.15);

    background:
        linear-gradient(
            135deg,
            rgba(36, 243, 106, 0.055),
            rgba(139, 70, 255, 0.028)
        );

    box-shadow:
        0 0 28px
        rgba(36, 243, 106, 0.035);
}

.stream-realtime.is-live::before {
    opacity: 1;
}

.stream-realtime-main {
    display: flex;
    align-items: center;

    gap: 12px;
}

.stream-realtime-icon {
    width: 40px;
    height: 40px;

    flex:
        0
        0
        40px;

    display: flex;
    align-items: center;
    justify-content: center;

    border:
        1px solid
        rgba(139, 70, 255, 0.18);

    border-radius: 11px;

    color: var(--purple-light);

    background:
        rgba(139, 70, 255, 0.07);
}

.stream-realtime.is-live
.stream-realtime-icon {
    color: var(--green);

    border-color:
        rgba(36, 243, 106, 0.18);

    background:
        rgba(36, 243, 106, 0.07);

    box-shadow:
        0 0 16px
        rgba(36, 243, 106, 0.05);
}

.stream-realtime-icon svg {
    width: 19px;
    height: 19px;
}

.stream-realtime-content {
    min-width: 0;

    flex: 1;
}

.stream-realtime-label {
    color: #747f92;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: 0.12em;
}

.stream-realtime.is-live
.stream-realtime-label {
    color: var(--green);
}

.stream-realtime-title {
    margin-top: 3px;

    overflow: hidden;

    color: #edf1f6;

    font-family:
        "Fredoka",
        sans-serif;

    font-size: 14px;
    font-weight: 500;

    line-height: 1.3;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.stream-realtime-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 14px;

    margin-top: 6px;
}

.stream-category,
.stream-duration {
    display: inline-flex;
    align-items: center;

    gap: 5px;

    color: #7d889a;

    font-size: 9px;
    font-weight: 700;
}

.stream-category svg,
.stream-duration svg {
    width: 12px;
    height: 12px;

    color: var(--purple-light);
}

.stream-realtime.is-live
.stream-duration svg {
    color: var(--green);
}

.stream-sync {
    display: flex;
    align-items: center;

    gap: 6px;

    margin-top: 9px;
    padding-top: 8px;

    border-top:
        1px solid
        rgba(255, 255, 255, 0.05);

    color: #5f697b;

    font-size: 8px;
    font-weight: 700;
}

.stream-sync-dot {
    width: 5px;
    height: 5px;

    flex:
        0
        0
        5px;

    border-radius: 50%;

    background: var(--green);

    box-shadow:
        0 0 8px
        rgba(36, 243, 106, 0.7);
}

.stream-sync.error
.stream-sync-dot {
    background: #ff4963;

    box-shadow:
        0 0 8px
        rgba(255, 73, 99, 0.7);
}

.stream-sync.error {
    color: #b87581;
}


/*
 * ============================================================
 * LIVE VIEWERS
 * ============================================================
 */

.followers-card {
    position: relative;

    overflow: hidden;
}

.followers-card::after {
    content: "";

    position: absolute;

    width: 70px;
    height: 70px;

    right: -25px;
    top: -25px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(36, 243, 106, 0.13),
            transparent 70%
        );
}

.followers-value {
    position: relative;
    z-index: 2;

    min-width: 36px;
}

.followers-label {
    position: relative;
    z-index: 2;
}


/*
 * ============================================================
 * LIVE/OFFLINE BADGES
 * ============================================================
 */

.offline-top-dot,
.offline-hero-dot {
    width: 7px;
    height: 7px;

    display: inline-block;

    border-radius: 50%;

    background: #6b7485;
}

.top-action.is-live {
    color: #ff9baa;

    border-color:
        rgba(255, 73, 99, 0.16);

    background:
        rgba(255, 73, 99, 0.04);
}

.top-action.is-offline {
    color: #808a9b;
}

.hero-live.is-live {
    color: #ff95a4;
}

.hero-live.is-offline {
    color: #8993a5;

    border-color:
        rgba(255, 255, 255, 0.08);

    background:
        rgba(255, 255, 255, 0.025);
}

.hero-status-value.live {
    color: var(--green);

    text-shadow:
        0 0 18px
        rgba(36, 243, 106, 0.16);
}

.hero-status-value.offline {
    color: #8993a5;

    text-shadow: none;
}


/*
 * ============================================================
 * REAL TWITCH PREVIEW
 * ============================================================
 */

.hero-visual.live-preview {
    background-position: center;
    background-size: cover;

    transition:
        background-image 0.5s ease;
}

.hero-visual.live-preview::after {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 1;

    pointer-events: none;

    background:
        linear-gradient(
            180deg,
            rgba(5, 7, 13, 0.05),
            rgba(5, 7, 13, 0.18)
        );
}

.hero-visual.live-preview
.on-air {
    z-index: 4;

    color: #ff9aaa;

    border-color:
        rgba(255, 73, 99, 0.22);

    background:
        rgba(255, 73, 99, 0.09);

    box-shadow:
        0 0 20px
        rgba(255, 73, 99, 0.12);
}

.hero-visual.live-preview
.hero-status {
    z-index: 5;
}


/*
 * ============================================================
 * API ERROR
 * ============================================================
 */

.stream-realtime.is-error {
    border-color:
        rgba(255, 73, 99, 0.14);
}


/*
 * ============================================================
 * RESPONSIVE
 * ============================================================
 */

@media (max-width: 740px) {

    .stream-realtime {
        max-width: none;
    }

    .stream-realtime-title {
        white-space: normal;
    }

    .stream-realtime-meta {
        align-items: flex-start;
        flex-direction: column;

        gap: 6px;
    }

}

/* END REAL TWITCH RUNTIME */


/*
 * ============================================================
 * REAL TWITCH PORTAL V2
 * ============================================================
 */

.runtime-main-stats {
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;

    gap: 10px;

    margin-top: 19px;
}

.runtime-stat {
    min-width: 155px;

    display: flex;
    align-items: center;

    gap: 10px;

    padding:
        11px
        13px;

    border:
        1px solid
        rgba(255,255,255,0.075);

    border-radius: 13px;

    background:
        rgba(255,255,255,0.018);
}

.runtime-stat-icon {
    width: 35px;
    height: 35px;

    flex:
        0
        0
        35px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 10px;

    color: var(--purple-light);

    background:
        rgba(139,70,255,0.07);
}

.runtime-viewers {
    border-color:
        rgba(36,243,106,0.15);

    background:
        linear-gradient(
            135deg,
            rgba(36,243,106,0.06),
            rgba(36,243,106,0.015)
        );
}

.runtime-viewers
.runtime-stat-icon {
    color: var(--green);

    background:
        rgba(36,243,106,0.08);
}

.runtime-stat-icon svg {
    width: 18px;
    height: 18px;
}

.runtime-stat b {
    display: block;

    color: #ffffff;

    font-family:
        "Fredoka",
        sans-serif;

    font-size: 18px;
    font-weight: 600;

    line-height: 1;
}

.runtime-stat small {
    display: block;

    margin-top: 4px;

    color: #747f92;

    font-size: 9px;
    font-weight: 700;
}

.runtime-stream-info {
    max-width: 665px;

    margin-top: 12px;

    padding:
        12px
        14px;

    border:
        1px solid
        rgba(139,70,255,0.13);

    border-radius: 13px;

    background:
        linear-gradient(
            135deg,
            rgba(139,70,255,0.055),
            rgba(36,243,106,0.018)
        );
}

.runtime-hidden {
    display: none;
}

.runtime-stream-info-label {
    color: var(--green);

    font-size: 8px;
    font-weight: 900;

    letter-spacing: 0.12em;
}

.runtime-stream-title {
    margin-top: 4px;

    overflow: hidden;

    color: #e8ebf1;

    font-family:
        "Fredoka",
        sans-serif;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.35;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.runtime-stream-sync {
    display: flex;
    align-items: center;

    gap: 6px;

    margin-top: 7px;

    color: #667185;

    font-size: 8px;
    font-weight: 700;
}

.runtime-sync-dot {
    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: var(--green);

    box-shadow:
        0 0 8px
        rgba(36,243,106,0.7);
}

.runtime-status-badge {
    display: inline-flex;
    align-items: center;

    gap: 7px;
}

.runtime-status-dot {
    width: 7px;
    height: 7px;

    flex:
        0
        0
        7px;

    border-radius: 50%;

    background: #6c7687;
}

.twitch-runtime-hero.is-live
.runtime-status-dot {
    background: #ff4963;

    box-shadow:
        0 0 11px
        rgba(255,73,99,0.78);
}

.twitch-runtime-hero.is-live
.runtime-status-badge {
    color: #ff96a5;
}

.runtime-hero-preview {
    position: relative;

    background-position: center;
    background-size: cover;

    transition:
        background-image 0.5s ease;
}

.runtime-hero-preview::after {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 1;

    pointer-events: none;

    background:
        radial-gradient(
            circle at 80% 30%,
            rgba(139,70,255,0.09),
            transparent 42%
        );
}

.runtime-live-card {
    position: absolute;

    right: 18px;
    bottom: 18px;

    z-index: 5;

    min-width: 180px;

    padding: 14px;

    border:
        1px solid
        rgba(255,255,255,0.08);

    border-radius: 13px;

    background:
        rgba(5,7,13,0.85);

    backdrop-filter: blur(18px);
}

.runtime-live-card small {
    display: block;

    color: #727d90;

    font-size: 8px;
    font-weight: 800;
}

.runtime-live-card b {
    display: block;

    margin:
        3px
        0;

    font-family:
        "Fredoka",
        sans-serif;

    font-size: 22px;
    font-weight: 600;
}

.runtime-live-card b.live {
    color: var(--green);

    text-shadow:
        0 0 17px
        rgba(36,243,106,0.17);
}

.runtime-live-card b.offline {
    color: #7d8799;
}

.portal-points-total {
    margin-top: 14px;

    padding: 11px;

    border:
        1px solid
        rgba(139,70,255,0.11);

    border-radius: 11px;

    background:
        rgba(139,70,255,0.035);
}

.portal-points-total span {
    display: block;

    color: #707b8e;

    font-size: 9px;
}

.portal-points-total b {
    display: block;

    margin-top: 3px;

    color: #d4bdff;

    font-family:
        "Fredoka",
        sans-serif;

    font-size: 19px;
}

.bot-status-line {
    display: flex;
    align-items: center;

    gap: 7px;

    margin-top: 15px;

    color: #82908e;

    font-size: 9px;
    font-weight: 700;
}

.bot-status-dot {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--green);

    box-shadow:
        0 0 9px
        rgba(36,243,106,0.7);
}

@media (max-width: 740px) {

    .runtime-main-stats {
        flex-direction: column;
    }

    .runtime-stat {
        width: 100%;
    }

    .runtime-stream-title {
        white-space: normal;
    }

}


/* BEGIN BOT FEATURES ADMIN */

.bot-features-page {
    max-width: 1450px;
}

.bot-features-header {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(330px, 430px);

    gap: 18px;

    align-items: stretch;
}

.bot-features-kicker {
    margin-bottom: 7px;

    color: var(--green);

    font-size: 10px;
    font-weight: 900;

    letter-spacing: .13em;
}

.bot-features-header h1 {
    margin: 0;

    font-family:
        "Fredoka",
        sans-serif;

    font-size:
        clamp(
            28px,
            3vw,
            42px
        );

    line-height: 1.05;
}

.bot-features-header p {
    max-width: 720px;

    margin:
        9px
        0
        0;

    color: #8791a3;

    font-size: 13px;

    line-height: 1.6;
}

.bot-master-card {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 18px;

    padding: 20px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .08
        );

    border-radius: 17px;

    background:
        rgba(
            255,
            255,
            255,
            .02
        );

    transition: .25s ease;
}

.bot-master-card.is-on {
    border-color:
        rgba(
            36,
            243,
            106,
            .20
        );

    background:
        linear-gradient(
            135deg,
            rgba(
                36,
                243,
                106,
                .07
            ),
            rgba(
                139,
                70,
                255,
                .035
            )
        );

    box-shadow:
        0 0 32px
        rgba(
            36,
            243,
            106,
            .035
        );
}

.bot-master-card.is-off {
    border-color:
        rgba(
            255,
            73,
            99,
            .18
        );
}

.bot-master-card strong {
    display: block;

    margin-top: 5px;

    color: #f4f6fa;

    font-family:
        "Fredoka",
        sans-serif;

    font-size: 19px;
}

.bot-master-card small {
    display: block;

    margin-top: 4px;

    color: #727d8f;

    font-size: 10px;
}

.bot-master-status {
    display: inline-flex;

    padding:
        5px
        8px;

    border-radius: 999px;

    color: var(--green);

    background:
        rgba(
            36,
            243,
            106,
            .08
        );

    font-size: 8px;
    font-weight: 900;

    letter-spacing: .08em;
}

.bot-master-card.is-off
.bot-master-status {
    color: #ff7f91;

    background:
        rgba(
            255,
            73,
            99,
            .08
        );
}

.bot-save-status {
    display: inline-flex;
    align-items: center;

    gap: 7px;

    margin-top: 15px;

    padding:
        7px
        10px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .07
        );

    border-radius: 999px;

    color: #758093;

    background:
        rgba(
            255,
            255,
            255,
            .015
        );

    font-size: 9px;
    font-weight: 800;
}

.bot-save-dot {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: #778195;
}

.bot-save-status.saving
.bot-save-dot {
    background: #f0b84b;

    box-shadow:
        0 0 8px
        rgba(
            240,
            184,
            75,
            .5
        );
}

.bot-save-status.success
.bot-save-dot {
    background: var(--green);

    box-shadow:
        0 0 8px
        rgba(
            36,
            243,
            106,
            .65
        );
}

.bot-save-status.error {
    color: #ff8fa0;
}

.bot-save-status.error
.bot-save-dot {
    background: #ff4963;
}

.bot-feature-groups {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(
                0,
                1fr
            )
        );

    gap: 15px;

    margin-top: 17px;
}

.bot-feature-group {
    overflow: hidden;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .07
        );

    border-radius: 16px;

    background:
        rgba(
            255,
            255,
            255,
            .015
        );
}

.bot-feature-group-title {
    padding:
        15px
        17px;

    border-bottom:
        1px solid
        rgba(
            255,
            255,
            255,
            .055
        );

    background:
        rgba(
            139,
            70,
            255,
            .025
        );
}

.bot-feature-group-title h2 {
    margin: 0;

    font-family:
        "Fredoka",
        sans-serif;

    font-size: 15px;
}

.bot-feature-list {
    padding: 5px;
}

.bot-feature-row {
    display: grid;

    grid-template-columns:
        42px
        minmax(
            0,
            1fr
        )
        auto;

    gap: 12px;

    align-items: center;

    padding:
        11px
        12px;

    border-radius: 11px;

    transition: .2s ease;
}

.bot-feature-row:hover {
    background:
        rgba(
            255,
            255,
            255,
            .025
        );
}

.bot-feature-row.is-on {
    background:
        linear-gradient(
            90deg,
            rgba(
                36,
                243,
                106,
                .025
            ),
            transparent
        );
}

.bot-feature-icon {
    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border:
        1px solid
        rgba(
            139,
            70,
            255,
            .14
        );

    border-radius: 10px;

    color: #9d79ee;

    background:
        rgba(
            139,
            70,
            255,
            .05
        );
}

.bot-feature-row.is-on
.bot-feature-icon {
    color: var(--green);

    border-color:
        rgba(
            36,
            243,
            106,
            .13
        );

    background:
        rgba(
            36,
            243,
            106,
            .045
        );
}

.bot-feature-icon svg {
    width: 17px;
    height: 17px;
}

.bot-feature-copy {
    min-width: 0;
}

.bot-feature-copy strong {
    display: block;

    color: #e6eaf1;

    font-size: 12px;
}

.bot-feature-copy small {
    display: block;

    margin-top: 4px;

    color: #707b8e;

    font-size: 9px;

    line-height: 1.45;
}

.bot-feature-copy code {
    display: inline-block;

    margin-top: 5px;

    color: #514d69;

    font-size: 7px;

    background: none;
}

.bot-feature-state {
    display: flex;
    align-items: center;

    gap: 9px;
}

.bot-feature-state-text {
    min-width: 24px;

    color: #667083;

    font-size: 8px;
    font-weight: 900;
}

.bot-feature-row.is-on
.bot-feature-state-text {
    color: var(--green);
}

.bot-switch {
    position: relative;

    width: 43px;
    height: 23px;

    display: inline-block;

    flex:
        0
        0 auto;
}

.bot-switch-large {
    width: 54px;
    height: 29px;
}

.bot-switch input {
    width: 0;
    height: 0;

    opacity: 0;
}

.bot-switch-slider {
    position: absolute;

    inset: 0;

    cursor: pointer;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .08
        );

    border-radius: 999px;

    background: #171b25;

    transition: .22s ease;
}

.bot-switch-slider::before {
    content: "";

    position: absolute;

    width: 17px;
    height: 17px;

    left: 2px;
    top: 2px;

    border-radius: 50%;

    background: #737d8f;

    transition: .22s ease;
}

.bot-switch-large
.bot-switch-slider::before {
    width: 21px;
    height: 21px;

    left: 3px;
    top: 3px;
}

.bot-switch input:checked
+ .bot-switch-slider {
    border-color:
        rgba(
            36,
            243,
            106,
            .30
        );

    background:
        rgba(
            36,
            243,
            106,
            .13
        );
}

.bot-switch input:checked
+ .bot-switch-slider::before {
    transform:
        translateX(
            20px
        );

    background: var(--green);

    box-shadow:
        0 0 10px
        rgba(
            36,
            243,
            106,
            .65
        );
}

.bot-switch-large
input:checked
+ .bot-switch-slider::before {
    transform:
        translateX(
            25px
        );
}

.bot-switch input:disabled
+ .bot-switch-slider {
    cursor: wait;

    opacity: .55;
}

.bot-danger-info {
    display: flex;

    gap: 13px;

    margin-top: 15px;

    padding: 15px;

    border:
        1px solid
        rgba(
            240,
            184,
            75,
            .12
        );

    border-radius: 14px;

    color: #b99d68;

    background:
        rgba(
            240,
            184,
            75,
            .025
        );
}

.bot-danger-info svg {
    width: 19px;
    height: 19px;

    flex:
        0
        0 auto;
}

.bot-danger-info strong {
    display: block;

    color: #d9c59d;

    font-size: 11px;
}

.bot-danger-info p {
    max-width: 850px;

    margin:
        5px
        0
        0;

    color: #817662;

    font-size: 9px;

    line-height: 1.55;
}

.bot-master-disabled
.bot-feature-groups {
    opacity: .55;
}

.bot-master-disabled
.bot-feature-group {
    filter:
        saturate(.55);
}

@media (
    max-width: 980px
) {

    .bot-features-header {
        grid-template-columns:
            1fr;
    }

    .bot-feature-groups {
        grid-template-columns:
            1fr;
    }

}

@media (
    max-width: 620px
) {

    .bot-feature-row {
        grid-template-columns:
            36px
            minmax(
                0,
                1fr
            );
    }

    .bot-feature-state {
        grid-column: 2;

        justify-self: start;
    }

}

/* END BOT FEATURES ADMIN */


/* BEGIN PELNOBOCIK CONTROL CENTER FINAL */

.bot-control-page {
    width: 100%;
    max-width: 1500px;
    padding-bottom: 48px;
}

.bot-control-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 18px;
    margin-bottom: 18px;
}

.bot-control-hero-copy,
.bot-master-panel,
.bot-control-category {
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 18px;
    background: rgba(9,13,23,.82);
}

.bot-control-hero-copy {
    padding: 28px 30px;

    background:
        radial-gradient(
            circle at 12% 0%,
            rgba(139,70,255,.13),
            transparent 39%
        ),
        rgba(9,13,23,.82);
}

.bot-control-eyebrow {
    display: flex;
    align-items: center;
    gap: 7px;

    margin-bottom: 10px;

    color: #25f372;

    font-size: 9px;
    font-weight: 900;
    letter-spacing: .14em;
}

.bot-control-eyebrow svg {
    width: 16px;
    height: 16px;
}

.bot-control-hero h1 {
    margin: 0;

    color: #f5f7fb;

    font-family: "Fredoka", sans-serif;
    font-size: clamp(30px,3vw,44px);
    font-weight: 600;
    line-height: 1.05;
}

.bot-control-hero-copy > p {
    max-width: 700px;

    margin: 11px 0 0;

    color: #8995a8;

    font-size: 12px;
    line-height: 1.6;
}

.bot-live-save {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    width: max-content;

    margin-top: 18px;
    padding: 7px 10px;

    border: 1px solid rgba(255,255,255,.07);
    border-radius: 999px;

    color: #758195;
    background: rgba(255,255,255,.018);

    font-size: 9px;
    font-weight: 800;
}

.bot-live-save-dot {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: #25f372;

    box-shadow:
        0 0 9px rgba(37,243,114,.65);
}

.bot-live-save.is-saving
.bot-live-save-dot {
    background: #ffc55c;
}

.bot-live-save.is-error {
    color: #ff8798;
}

.bot-live-save.is-error
.bot-live-save-dot {
    background: #ff4963;
}


.bot-master-panel {
    min-height: 190px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    position: relative;

    overflow: hidden;

    padding: 22px;
}

.bot-master-panel::before {
    content: "";

    position: absolute;

    width: 230px;
    height: 230px;

    right: -100px;
    top: -120px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(37,243,114,.17),
            transparent 68%
        );
}

.bot-master-panel.is-on {
    border-color:
        rgba(37,243,114,.2);
}

.bot-master-panel.is-off {
    border-color:
        rgba(255,73,99,.2);
}

.bot-master-panel-top,
.bot-master-panel-bottom {
    position: relative;
    z-index: 2;
}

.bot-master-panel-top {
    display: flex;
    align-items: center;
    gap: 12px;
}

.bot-master-avatar {
    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 48px;

    border: 1px solid rgba(37,243,114,.17);
    border-radius: 14px;

    color: #25f372;
    background: rgba(37,243,114,.06);
}

.bot-master-avatar svg {
    width: 23px;
    height: 23px;
}

.bot-master-kicker {
    display: block;

    color: #697588;

    font-size: 8px;
    font-weight: 900;
    letter-spacing: .11em;
}

.bot-master-panel-top strong {
    display: block;

    margin-top: 4px;

    color: #f2f5fa;

    font-family: "Fredoka", sans-serif;
    font-size: 19px;
}

.bot-master-panel-bottom {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
}

.bot-master-status {
    display: block;

    color: #25f372;

    font-size: 12px;
    font-weight: 900;
}

.bot-master-panel.is-off
.bot-master-status {
    color: #ff7589;
}

.bot-master-panel-bottom small {
    display: block;

    margin-top: 4px;

    color: #6a7689;

    font-size: 9px;
}


.bot-control-grid {
    display: grid;
    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap: 15px;
}

.bot-control-category {
    overflow: hidden;
}

.bot-category-header {
    display: flex;
    align-items: center;

    gap: 12px;

    padding: 17px 18px;

    border-bottom:
        1px solid rgba(255,255,255,.055);

    background:
        linear-gradient(
            90deg,
            rgba(139,70,255,.055),
            transparent
        );
}

.bot-category-icon {
    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 40px;

    border: 1px solid rgba(139,70,255,.17);
    border-radius: 11px;

    color: #ae83ff;
    background: rgba(139,70,255,.065);
}

.bot-category-icon svg {
    width: 18px;
    height: 18px;
}

.bot-category-header h2 {
    margin: 0;

    color: #edf1f7;

    font-family: "Fredoka", sans-serif;
    font-size: 16px;
    font-weight: 600;
}

.bot-category-header p {
    margin: 3px 0 0;

    color: #697588;

    font-size: 9px;
    line-height: 1.45;
}


.bot-category-options {
    padding: 7px;
}

.bot-option {
    display: grid;

    grid-template-columns:
        38px
        minmax(0,1fr)
        auto;

    gap: 12px;

    align-items: center;

    padding: 12px;

    border: 1px solid transparent;
    border-radius: 12px;

    transition: .18s ease;
}

.bot-option:hover {
    border-color: rgba(255,255,255,.05);
    background: rgba(255,255,255,.018);
}

.bot-option.is-on {
    background:
        linear-gradient(
            90deg,
            rgba(37,243,114,.028),
            transparent 65%
        );
}

.bot-option-icon {
    width: 36px;
    height: 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(255,255,255,.065);
    border-radius: 10px;

    color: #748094;
    background: rgba(255,255,255,.018);
}

.bot-option.is-on
.bot-option-icon {
    color: #25f372;

    border-color: rgba(37,243,114,.14);
    background: rgba(37,243,114,.045);
}

.bot-option-icon svg {
    width: 16px;
    height: 16px;
}

.bot-option-copy {
    min-width: 0;
}

.bot-option-copy strong {
    display: block;

    color: #e3e7ef;

    font-size: 11px;
    font-weight: 800;
}

.bot-option-copy span {
    display: block;

    margin-top: 3px;

    color: #6b778a;

    font-size: 8px;
    line-height: 1.45;
}

.bot-option-control {
    display: flex;
    align-items: center;

    gap: 10px;
}

.bot-option-status {
    min-width: 24px;

    color: #626d80;

    font-size: 8px;
    font-weight: 900;

    text-align: right;
}

.bot-option.is-on
.bot-option-status {
    color: #25f372;
}


/*
 * Przełączniki
 */

.bot-toggle {
    width: 44px;
    height: 24px;

    display: inline-block;

    position: relative;

    flex: 0 0 auto;
}

.bot-toggle-master {
    width: 58px;
    height: 31px;
}

.bot-toggle input {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
}

.bot-toggle-track {
    position: absolute;
    inset: 0;

    cursor: pointer;

    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;

    background: #181d29;

    transition: .2s ease;
}

.bot-toggle-thumb {
    position: absolute;

    width: 18px;
    height: 18px;

    left: 2px;
    top: 2px;

    border-radius: 50%;

    background: #717c8e;

    transition:
        transform .2s ease,
        background .2s ease,
        box-shadow .2s ease;
}

.bot-toggle-master
.bot-toggle-thumb {
    width: 23px;
    height: 23px;

    left: 3px;
    top: 3px;
}

.bot-toggle input:checked
+ .bot-toggle-track {
    border-color: rgba(37,243,114,.3);
    background: rgba(37,243,114,.12);
}

.bot-toggle input:checked
+ .bot-toggle-track
.bot-toggle-thumb {
    transform: translateX(20px);

    background: #25f372;

    box-shadow:
        0 0 12px rgba(37,243,114,.62);
}

.bot-toggle-master
input:checked
+ .bot-toggle-track
.bot-toggle-thumb {
    transform: translateX(27px);
}

.bot-toggle input:disabled
+ .bot-toggle-track {
    opacity: .55;
    cursor: wait;
}


.bot-system-disabled
.bot-control-grid {
    opacity: .48;
    filter: saturate(.45);
}


.bot-control-warning {
    display: flex;
    gap: 12px;

    margin-top: 15px;
    padding: 15px 17px;

    border:
        1px solid rgba(255,193,84,.14);

    border-radius: 14px;

    background: rgba(255,193,84,.025);
}

.bot-control-warning-icon {
    width: 35px;
    height: 35px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 35px;

    border-radius: 10px;

    color: #e9bd68;
    background: rgba(255,193,84,.07);
}

.bot-control-warning-icon svg {
    width: 17px;
    height: 17px;
}

.bot-control-warning strong {
    display: block;

    color: #d7c29c;

    font-size: 10px;
}

.bot-control-warning p {
    max-width: 900px;

    margin: 4px 0 0;

    color: #786f60;

    font-size: 9px;
    line-height: 1.5;
}


/*
 * Funkcje bota w sidebarze
 */

.nav-item[href="/admin/bot-features"] {
    margin-left: 10px;

    width: calc(100% - 10px);
}

.nav-item[href="/admin/bot-features"] svg {
    width: 16px;
    height: 16px;
}


@media (max-width:1050px) {

    .bot-control-hero {
        grid-template-columns: 1fr;
    }

    .bot-control-grid {
        grid-template-columns: 1fr;
    }

}


@media (max-width:620px) {

    .bot-control-hero-copy {
        padding: 22px 18px;
    }

    .bot-option {
        grid-template-columns:
            35px
            minmax(0,1fr);
    }

    .bot-option-control {
        grid-column: 2;
        justify-self: start;
    }

}

/* END PELNOBOCIK CONTROL CENTER FINAL */

/* BEGIN PELNOBOCIK MEGA UPGRADE 20260822 */
.nav-section-label{margin:16px 12px 6px;color:#6f7788;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.mega-head,.viewer-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:18px;padding:24px 26px;border:1px solid rgba(255,255,255,.07);border-radius:18px;background:radial-gradient(circle at 10% 0,rgba(139,70,255,.12),transparent 35%),rgba(255,255,255,.015)}
.mega-head h1,.viewer-hero h1{margin:4px 0 5px;font-family:"Fredoka",sans-serif;font-size:34px;color:#f3f6fb}.mega-head p,.viewer-hero p{margin:0;color:#7f8a9f;font-size:12px}.eyebrow{color:#27f477;font-size:9px;font-weight:900;letter-spacing:.13em}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}.metric-card{padding:16px 18px;border:1px solid rgba(255,255,255,.065);border-radius:14px;background:rgba(255,255,255,.015)}.metric-card span{display:block;color:#6e798c;font-size:9px;text-transform:uppercase;letter-spacing:.08em}.metric-card strong{display:block;margin-top:6px;color:#f1f4f9;font-family:"Fredoka",sans-serif;font-size:22px}.status-chip{display:inline-flex;padding:5px 8px;border-radius:999px;font-size:8px;font-weight:900;letter-spacing:.06em}.status-chip.good{color:#2bf375;background:rgba(43,243,117,.08);border:1px solid rgba(43,243,117,.15)}.status-chip.muted{color:#8a93a4;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06)}.viewer-link{display:flex;flex-direction:column;gap:2px}.viewer-link small,.table-sub{display:block;color:#687286;font-size:9px}.mega-table-wrap{overflow:auto}.mega-table{min-width:850px}.score-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.score-card{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:12px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.015)}.score-card b{color:#a985ff}.score-card span{color:#7f899a;font-size:10px}.message-list{display:flex;flex-direction:column}.message-row{display:flex;justify-content:space-between;gap:18px;padding:11px 2px;border-bottom:1px solid rgba(255,255,255,.05)}.message-row time{color:#5f697b;font-size:8px}.message-row p{margin:3px 0 0;color:#d9dee7;font-size:11px}.message-scores{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.message-scores span{padding:4px 6px;border-radius:6px;background:rgba(255,255,255,.03);color:#7f899a;font-size:8px}.big-status{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:13px;border:1px solid rgba(255,255,255,.07)}.big-status svg{width:25px}.big-status small{display:block;color:#647084;font-size:8px}.big-status strong{font-size:13px}.big-status.online{color:#2bf375;border-color:rgba(43,243,117,.18);background:rgba(43,243,117,.04)}.big-status.offline{color:#ff7187;border-color:rgba(255,113,135,.16)}.health-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.health-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:12px 14px;border-radius:11px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.012)}.health-card strong{color:#e6e9ef}.health-card span{display:block;margin-top:3px;color:#707b8e;font-size:9px}.health-card b{font-size:8px}.health-card small{grid-column:1/-1;color:#525d70;font-size:8px}.health-card.ok b{color:#2bf375}.health-card.warning b{color:#ffc45d}.health-card.error b{color:#ff7187}.bot-settings-panel{margin-top:16px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:14px}.section-title h2{margin:3px 0 0}.settings-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.settings-card{padding:15px;border:1px solid rgba(255,255,255,.06);border-radius:13px;background:rgba(255,255,255,.012)}.settings-card h3{margin:0 0 12px;font-family:"Fredoka",sans-serif;color:#eee}.settings-card label{display:flex;flex-direction:column;gap:5px;margin-bottom:10px;color:#788397;font-size:9px}.settings-card input[type=text],.settings-card input[type=number],.settings-card select,.settings-card textarea{width:100%;box-sizing:border-box;padding:9px 10px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:#0d121d;color:#e5e9f0;font:inherit}.settings-card textarea{min-height:65px;resize:vertical}.settings-card .setting-check{flex-direction:row;align-items:center;color:#bbc2cf}.warning-note{display:flex;gap:8px;padding:10px;border-radius:9px;color:#c5aa76;background:rgba(255,193,84,.04);font-size:9px}.warning-note svg{width:16px}.settings-actions{grid-column:1/-1;display:flex;justify-content:flex-end}
@media(max-width:1100px){.metric-grid{grid-template-columns:repeat(2,1fr)}.score-grid{grid-template-columns:repeat(2,1fr)}.settings-grid{grid-template-columns:1fr}.health-grid{grid-template-columns:1fr}}
@media(max-width:650px){.mega-head,.viewer-hero{align-items:flex-start;flex-direction:column}.metric-grid{grid-template-columns:1fr 1fr}.score-grid{grid-template-columns:1fr}}
/* END PELNOBOCIK MEGA UPGRADE 20260822 */

/* BEGIN PORTAL READABLE TYPOGRAPHY */

html,
body {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 16px;
    line-height: 1.55;
}

body {
    letter-spacing: 0;
}

.main,
.content {
    font-size: 16px;
}

p,
li,
td,
th,
label,
input,
select,
textarea,
button,
a {
    font-size: 15px;
}

small {
    font-size: 13px !important;
    line-height: 1.5;
}

h1 {
    font-size: clamp(30px, 3vw, 42px);
    line-height: 1.18;
}

h2 {
    font-size: 23px;
    line-height: 1.25;
}

h3 {
    font-size: 19px;
    line-height: 1.3;
}

.topbar .title {
    font-size: 18px;
}

.nav-item {
    font-size: 15px !important;
    line-height: 1.35;
}

.nav-item span {
    font-size: 15px !important;
}

.pill {
    font-size: 13px !important;
}

.card,
.panel,
.widget {
    font-size: 15px;
}


/* PelnoBocik Control Center */

.bot-control-eyebrow {
    font-size: 12px !important;
}

.bot-control-hero-copy > p {
    font-size: 15px !important;
    line-height: 1.6;
}

.bot-live-save {
    font-size: 13px !important;
}

.bot-master-kicker {
    font-size: 11px !important;
}

.bot-master-panel-top strong {
    font-size: 21px !important;
}

.bot-master-status {
    font-size: 15px !important;
}

.bot-master-panel-bottom small {
    font-size: 13px !important;
}

.bot-category-header h2 {
    font-size: 20px !important;
}

.bot-category-header p {
    font-size: 13px !important;
    line-height: 1.5;
}

.bot-option-copy strong {
    font-size: 15px !important;
    line-height: 1.35;
}

.bot-option-copy span {
    font-size: 13px !important;
    line-height: 1.5;
}

.bot-option-status {
    font-size: 12px !important;
}

.bot-control-warning strong {
    font-size: 14px !important;
}

.bot-control-warning p {
    font-size: 13px !important;
}


/* Live audience */

.live-viewers-page,
.followers-page,
.subscribers-page,
.candidates-page,
.analytics-page {
    font-size: 15px;
}

.live-viewers-page table,
.followers-page table,
.subscribers-page table,
.candidates-page table,
.analytics-page table {
    font-size: 14px;
}

.live-viewers-page th,
.followers-page th,
.subscribers-page th,
.candidates-page th,
.analytics-page th {
    font-size: 13px;
    font-weight: 700;
}

.live-viewers-page td,
.followers-page td,
.subscribers-page td,
.candidates-page td,
.analytics-page td {
    font-size: 14px;
}

.stat-value,
.metric-value,
.kpi-value {
    font-size: 26px;
    font-weight: 700;
}

.stat-label,
.metric-label,
.kpi-label {
    font-size: 13px;
}


/* Formularze */

input,
select,
textarea {
    min-height: 42px;
    padding: 9px 12px;
}

button,
.btn {
    min-height: 40px;
    font-size: 14px !important;
}


/* Telefony */

@media (max-width: 700px) {

    html,
    body {
        font-size: 15px;
    }

    p,
    li,
    td,
    th,
    label,
    input,
    select,
    textarea,
    button,
    a {
        font-size: 14px;
    }

    .nav-item,
    .nav-item span {
        font-size: 14px !important;
    }
}

/* END PORTAL READABLE TYPOGRAPHY */


@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root{
    --v7-bg:#050811;
    --v7-bg-soft:#080c16;
    --v7-sidebar:#060913;
    --v7-panel:#0b101c;
    --v7-panel-2:#0d1321;
    --v7-panel-3:#101725;
    --v7-line:rgba(148,163,184,.14);
    --v7-line-strong:rgba(148,163,184,.22);
    --v7-text:#f6f7fb;
    --v7-muted:#8e9aae;
    --v7-muted-2:#68758a;
    --v7-purple:#9a58ff;
    --v7-purple-2:#7137dc;
    --v7-green:#27ef78;
    --v7-green-soft:rgba(39,239,120,.12);
    --v7-red:#ff5577;
    --v7-cyan:#4dc9ff;
    --v7-yellow:#f7c84b;
    --v7-radius:15px;
    --v7-radius-lg:19px;
    --v7-shadow:0 18px 55px rgba(0,0,0,.24);
}

*{box-sizing:border-box}
html{background:var(--v7-bg);font-size:14px}
body{
    min-height:100vh;
    margin:0;
    color:var(--v7-text);
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    font-size:14px;
    line-height:1.48;
    background:
        radial-gradient(circle at 0 0,rgba(116,49,204,.12),transparent 28rem),
        radial-gradient(circle at 100% 100%,rgba(39,239,120,.055),transparent 32rem),
        var(--v7-bg);
}
body,p,li,td,th,label,input,select,textarea,button,a{
    font-family:inherit;
    font-size:14px;
}
a{text-decoration:none}
button,input,select,textarea{font:inherit}
::selection{background:rgba(154,88,255,.32);color:#fff}

.app{
    display:grid;
    grid-template-columns:234px minmax(0,1fr);
    min-height:100vh;
}
.main{
    min-width:0;
    padding:0 28px 42px;
}
.content{
    width:100%;
    max-width:1680px;
    margin:0 auto;
    padding-top:28px;
}

/* SIDEBAR */
.sidebar{
    position:sticky;
    top:0;
    z-index:30;
    height:100vh;
    padding:18px 12px 16px;
    overflow-y:auto;
    overflow-x:hidden;
    scrollbar-gutter:stable;
    border-right:1px solid rgba(148,163,184,.12);
    background:
        radial-gradient(circle at 20% 8%,rgba(154,88,255,.11),transparent 18rem),
        linear-gradient(180deg,rgba(6,9,19,.985),rgba(5,8,16,.99));
}
.sidebar::-webkit-scrollbar{width:7px}
.sidebar::-webkit-scrollbar-thumb{background:rgba(148,163,184,.15);border-radius:99px}
.brand{
    display:grid;
    justify-items:center;
    gap:10px;
    padding:0 6px 24px;
    text-align:center;
}
.logo-wrap{
    position:relative;
    width:104px;
    height:104px;
    margin:0;
}
.logo-wrap:before{
    content:"";
    position:absolute;
    inset:-8px;
    border-radius:50%;
    background:conic-gradient(var(--v7-green),var(--v7-purple),var(--v7-green));
    opacity:.2;
    filter:blur(18px);
}
.logo{
    position:relative;
    width:100%;
    height:100%;
    border-radius:50%;
    object-fit:cover;
    border:3px solid transparent;
    background:
        linear-gradient(#090d17,#090d17) padding-box,
        linear-gradient(135deg,var(--v7-green),var(--v7-purple)) border-box;
    box-shadow:0 10px 30px rgba(0,0,0,.28);
}
.brand h1{
    margin:0;
    color:#fff;
    font-size:18px;
    font-weight:750;
    letter-spacing:-.025em;
}
.brand p{
    margin:3px 0 0;
    color:var(--v7-green);
    font-size:10px;
    font-weight:700;
}
.nav{
    display:flex;
    flex-direction:column;
    gap:3px;
}
.nav-section-label{
    margin:18px 10px 6px;
    color:#697589;
    font-size:9px;
    font-weight:800;
    letter-spacing:.14em;
    text-transform:uppercase;
}
.nav-section-label:first-child{margin-top:0}
.nav a{
    position:relative;
    display:flex;
    align-items:center;
    gap:11px;
    min-height:38px;
    padding:9px 11px;
    border:1px solid transparent;
    border-radius:10px;
    color:#9aa6b8;
    font-size:12.5px!important;
    font-weight:620;
    transition:.16s ease;
}
.nav a svg{
    width:18px;
    height:18px;
    flex:0 0 18px;
    color:#99a7bc;
    stroke-width:1.9;
}
.nav a:hover{
    color:#eef2f8;
    background:rgba(255,255,255,.035);
    border-color:rgba(255,255,255,.035);
}
.nav a.active{
    color:#fff;
    background:linear-gradient(90deg,rgba(133,63,233,.28),rgba(118,54,215,.10));
    border-color:rgba(154,88,255,.19);
    box-shadow:
        inset 2px 0 0 #9a58ff,
        0 8px 24px rgba(59,24,108,.13);
}
.nav a.active svg{color:#efe6ff}
.sidebar-footer{
    margin-top:22px;
    padding:0 8px 2px;
}
.sidebar-status{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:30px;
    border:1px solid rgba(39,239,120,.12);
    border-radius:999px;
    color:#68f69e;
    background:rgba(39,239,120,.045);
    font-size:10px;
    font-weight:750;
}
.sidebar-status i{
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--v7-green);
    box-shadow:0 0 10px rgba(39,239,120,.8);
}

/* TOPBAR */
.topbar{
    height:66px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    border-bottom:1px solid rgba(148,163,184,.10);
}
.topbar .title{
    display:inline-flex;
    align-items:center;
    gap:9px;
    color:#f4f6fa;
    font-size:13px;
    font-weight:750;
    letter-spacing:-.015em;
}
.topbar .title:after{
    content:"";
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--v7-green);
    box-shadow:0 0 10px rgba(39,239,120,.72);
}
.top-actions{
    display:flex;
    align-items:center;
    gap:9px;
}
.pill{
    min-height:38px;
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid var(--v7-line);
    border-radius:11px;
    background:rgba(10,15,25,.82);
    color:#f1f4f8;
    font-size:11px;
    font-weight:750;
    box-shadow:0 8px 25px rgba(0,0,0,.10);
}
.pill svg{width:16px;height:16px;color:var(--v7-green)}
.account-menu{position:relative}
.account-menu-button{
    min-height:42px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:5px 10px 5px 6px;
    border:1px solid var(--v7-line);
    border-radius:12px;
    background:rgba(9,14,24,.86);
    color:#fff;
    cursor:pointer;
    transition:.16s ease;
}
.account-menu-button:hover{
    border-color:rgba(154,88,255,.28);
    background:#0d1320;
}
.account-avatar{
    width:31px;
    height:31px;
    display:grid;
    place-items:center;
    overflow:hidden;
    border-radius:9px;
    background:#121a29;
}
.account-avatar img{width:100%;height:100%;object-fit:cover}
.account-avatar svg{width:16px;height:16px}
.account-copy{min-width:112px;text-align:left}
.account-copy strong,
.account-copy small{
    display:block;
    max-width:150px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.account-copy strong{font-size:11.5px;font-weight:750}
.account-copy small{margin-top:1px;color:#8490a3;font-size:9.5px}
.account-menu-button>svg{width:14px;height:14px;color:#728096}
.account-menu-panel{
    position:absolute;
    right:0;
    top:calc(100% + 9px);
    z-index:300;
    width:235px;
    padding:7px;
    border:1px solid var(--v7-line-strong);
    border-radius:14px;
    background:rgba(10,15,25,.985);
    box-shadow:0 25px 70px rgba(0,0,0,.5);
    backdrop-filter:blur(18px);
}
.account-menu-panel a{
    display:flex;
    align-items:center;
    gap:10px;
    padding:9px 10px;
    border-radius:9px;
    color:#c6cfdd;
    font-size:12px;
}
.account-menu-panel a:hover{background:rgba(154,88,255,.12);color:#fff}
.account-menu-panel svg{width:16px;height:16px}
.account-menu-separator{height:1px;margin:5px;background:rgba(255,255,255,.07)}
.account-menu-logout{color:#ff7891!important}

/* TYPOGRAPHY + HEADERS */
h1,h2,h3,p{margin-top:0}
h1,.page-title,.mega-head h1{
    margin-bottom:0;
    color:#f7f8fb;
    font-size:24px!important;
    line-height:1.14;
    font-weight:760;
    letter-spacing:-.035em;
}
h2{font-size:17px!important;line-height:1.24;font-weight:720;letter-spacing:-.02em}
h3{font-size:14px!important;line-height:1.3;font-weight:700}
.page-sub,
.muted-note,
.table-sub,
.section-title p,
.mega-head p{
    color:var(--v7-muted);
    font-size:11.5px!important;
    line-height:1.6;
}
.eyebrow{
    display:inline-flex;
    align-items:center;
    min-height:22px;
    width:max-content;
    margin-bottom:7px;
    padding:0 8px;
    border:1px solid rgba(154,88,255,.22);
    border-radius:999px;
    color:#b784ff!important;
    background:rgba(154,88,255,.06);
    font-size:8.5px!important;
    font-weight:800;
    letter-spacing:.12em;
}
.mega-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:18px;
    margin-bottom:20px;
}
.section-title{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    margin-bottom:16px;
}
.section-title h1,.section-title h2{margin:0}
.section-title p{max-width:760px;margin:6px 0 0}

/* PANEL SYSTEM */
.panel,
.section,
.card,
.metric-card,
.viewer-v4-stats article,
.viewer-v4-score,
.candidate-v4-summary article,
.settings-v4-grid label,
.bot-feature-row,
.health-card,
.candidate-card{
    border:1px solid var(--v7-line);
    background:
        linear-gradient(145deg,rgba(15,21,35,.96),rgba(8,13,23,.96));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.012);
}
.panel{
    margin-top:18px;
    padding:18px;
    border-radius:var(--v7-radius-lg);
}
.panel:hover{border-color:rgba(148,163,184,.18)}
.metric-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:0 0 18px;
}
.metric-card{
    min-height:82px;
    padding:15px 16px;
    border-radius:14px;
}
.metric-card span{
    display:block;
    color:#8c99ad;
    font-size:10px!important;
}
.metric-card strong{
    display:block;
    margin-top:5px;
    color:#fff;
    font-size:20px!important;
    line-height:1.1;
    font-weight:760;
}
.metric-card small{display:block;margin-top:5px;color:#69768a;font-size:10px!important}

/* BUTTONS */
.btn{
    min-height:38px;
    padding:0 13px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    border-radius:10px;
    border:1px solid transparent;
    font-size:11.5px;
    font-weight:700;
    cursor:pointer;
    transition:.16s ease;
}
.btn svg{width:15px;height:15px}
.btn:hover{transform:translateY(-1px)}
.btn-purple{
    color:#fff;
    border-color:rgba(187,136,255,.22);
    background:linear-gradient(135deg,#7f3fe0,#a55cff);
    box-shadow:0 8px 22px rgba(101,49,180,.18);
}
.btn-green{
    color:#90f7b5;
    border-color:rgba(39,239,120,.2);
    background:rgba(39,239,120,.07);
}
.btn-dark{
    color:#d6ddea;
    border-color:var(--v7-line);
    background:#0c121f;
}
.btn-dark:hover{border-color:rgba(154,88,255,.25);background:#101725}

/* FORMS */
input[type=text],
input[type=search],
input[type=number],
input[type=email],
input[type=password],
select,
textarea{
    width:100%;
    min-height:40px;
    padding:9px 11px;
    border:1px solid var(--v7-line);
    border-radius:10px;
    outline:0;
    color:#eef2f7;
    background:#080d17;
    transition:.16s ease;
}
textarea{min-height:94px;resize:vertical}
input:focus,select:focus,textarea:focus{
    border-color:rgba(154,88,255,.48);
    box-shadow:0 0 0 3px rgba(154,88,255,.08);
}
::placeholder{color:#566276}
.field label,
.admin-data-page form label{
    display:grid;
    gap:6px;
    color:#bdc6d4;
    font-size:11.5px;
    font-weight:650;
}

/* TABLES */
.table-scroll{overflow:auto;border-radius:13px}
.portal-table,.mega-table,table{width:100%;border-collapse:collapse}
.portal-table th,
.portal-table td,
.mega-table th,
.mega-table td{
    padding:11px 10px;
    border-bottom:1px solid rgba(148,163,184,.09);
    text-align:left;
    vertical-align:middle;
}
.portal-table th,.mega-table th{
    color:#7f8da2;
    font-size:9.5px!important;
    font-weight:750;
    letter-spacing:.055em;
    text-transform:uppercase;
    white-space:nowrap;
}
.portal-table td,.mega-table td{
    color:#d9e0e9;
    font-size:11.5px!important;
}
.portal-table tbody tr:hover,.mega-table tbody tr:hover{
    background:rgba(154,88,255,.035);
}
.portal-table tbody tr:last-child td,.mega-table tbody tr:last-child td{border-bottom:0}
.table-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding-top:14px;
    color:#7c899d;
    font-size:10.5px;
}
.pagination{display:flex;flex-wrap:wrap;gap:6px}
.pagination button,.pagination a{
    min-width:31px;
    height:31px;
    display:grid;
    place-items:center;
    border:1px solid var(--v7-line);
    border-radius:8px;
    background:#0b111d;
    color:#aeb8c7;
    font-size:10px;
}
.pagination .active{border-color:rgba(154,88,255,.4);background:rgba(154,88,255,.14);color:#fff}

/* SEARCH */
.viewer-search{margin:0 0 15px}
.viewer-search-row,.data-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}
.viewer-search-box,.data-search{
    position:relative;
    min-height:40px;
    display:flex;
    align-items:center;
    gap:8px;
    width:min(520px,100%);
    padding:0 10px;
    border:1px solid var(--v7-line);
    border-radius:11px;
    background:#080d17;
}
.viewer-search-box>svg,.data-search svg{width:15px;height:15px;color:#667389}
.viewer-search-input,.data-search input{
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    min-height:38px!important;
    padding:0!important;
}
.viewer-search-clear{
    border:0;
    background:transparent;
    color:#718096;
    cursor:pointer;
}
.viewer-search-meta,.table-live-note{color:#677489;font-size:9.5px!important}

/* LIVE CHIPS */
.live-refresh-pill{
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:7px 10px;
    border:1px solid rgba(39,239,120,.13);
    border-radius:999px;
    background:rgba(39,239,120,.045);
    color:#8d99ac;
    font-size:9.5px!important;
    font-weight:700;
}
.live-refresh-pill>span:first-child{
    width:6px;height:6px;border-radius:50%;
    background:var(--v7-green);
    box-shadow:0 0 9px rgba(39,239,120,.8);
}

/* VIEWER 360 */
.viewer-v4{
    display:grid;
    gap:18px;
}
.viewer-page-head{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:18px;
}
.viewer-page-icon{
    width:43px;
    height:43px;
    display:grid;
    place-items:center;
    border:1px solid var(--v7-line);
    border-radius:12px;
    color:#dbe3ee;
    background:#0b111d;
}
.viewer-page-icon svg{width:22px;height:22px}
.viewer-page-head h1{font-size:22px!important}
.viewer-page-head p{margin:3px 0 0;color:#8290a4;font-size:11px}
.viewer-v4-hero{
    position:relative;
    overflow:hidden;
    margin:0;
    min-height:126px;
    padding:20px 22px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    border-radius:18px;
}
.viewer-v4-hero:before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        radial-gradient(circle at 15% 0,rgba(154,88,255,.10),transparent 25rem),
        radial-gradient(circle at 100% 100%,rgba(39,239,120,.045),transparent 20rem);
}
.viewer-v4-identity,.viewer-v4-quick{position:relative}
.viewer-v4-identity{
    min-width:0;
    display:flex;
    align-items:center;
    gap:18px;
}
.viewer-v4-avatar{
    position:relative;
    width:86px;
    height:86px;
    flex:0 0 86px;
    display:grid;
    place-items:center;
    overflow:hidden;
    border:1px solid rgba(154,88,255,.24);
    border-radius:50%;
    background:radial-gradient(circle,rgba(154,88,255,.11),rgba(10,15,25,.95));
}
.viewer-v4-avatar:after{
    content:"";
    position:absolute;
    left:7px;
    top:8px;
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--v7-green);
    box-shadow:0 0 10px rgba(39,239,120,.8);
}
.viewer-v4-avatar img{width:100%;height:100%;object-fit:cover}
.viewer-v4-avatar svg{width:32px;height:32px;color:#cbd4e0}
.viewer-v4-title-row{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.viewer-v4-title-row h1{font-size:23px!important}
.viewer-login{margin-top:2px;color:#8390a4;font-size:11.5px}
.viewer-online{
    display:inline-flex;
    align-items:center;
    gap:5px;
    color:#67f69d;
    font-size:9.5px;
    font-weight:650;
}
.viewer-online i{
    width:6px;height:6px;border-radius:50%;background:var(--v7-green);
    box-shadow:0 0 8px rgba(39,239,120,.8);
}
.viewer-role-badges{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:10px;
}
.role-pill,.status-chip,.system-badge,.badge{
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:5px 8px;
    border:1px solid var(--v7-line);
    border-radius:8px;
    background:#0c121f;
    color:#cbd3df;
    font-size:9.5px!important;
    font-weight:650;
}
.role-pill svg{width:14px;height:14px}
.role-pill.is-good{color:#8bf5af;border-color:rgba(39,239,120,.18);background:rgba(39,239,120,.05)}
.role-pill.is-purple{color:#c4a2ff;border-color:rgba(154,88,255,.21);background:rgba(154,88,255,.06)}
.viewer-v4-quick{
    display:grid;
    grid-template-columns:repeat(2,minmax(115px,1fr));
    gap:10px;
}
.viewer-v4-quick div{
    min-width:120px;
    padding:12px 14px;
    border:1px solid var(--v7-line);
    border-radius:13px;
    background:rgba(10,15,25,.70);
}
.viewer-v4-quick span{display:block;color:#7f8da1;font-size:9px}
.viewer-v4-quick strong{display:block;margin-top:4px;font-size:17px}
.viewer-v4-quick small{display:block;margin-top:3px;color:#6e7b90;font-size:8.5px}
.viewer-v4-stats{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
}
.viewer-v4-stats article{
    min-height:78px;
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    align-items:center;
    gap:11px;
    padding:13px 14px;
    border-radius:14px;
}
.viewer-stat-icon{
    width:38px;height:38px;
    display:grid;place-items:center;
    border-radius:11px;
    background:rgba(77,201,255,.07);
    color:var(--v7-cyan);
}
.viewer-stat-icon.purple{background:rgba(154,88,255,.08);color:#b67cff}
.viewer-stat-icon.green{background:rgba(39,239,120,.07);color:var(--v7-green)}
.viewer-stat-icon.yellow{background:rgba(247,200,75,.07);color:var(--v7-yellow)}
.viewer-stat-icon svg{width:19px;height:19px}
.viewer-stat-copy span{display:block;color:#8390a4;font-size:9.5px!important}
.viewer-stat-copy strong{display:block;margin-top:3px;color:#f4f6f9;font-size:16px!important}
.viewer-stat-copy small{display:block;margin-top:3px;color:#667388;font-size:8.8px!important;line-height:1.3}
#viewer-v4-tabs{
    margin-top:0;
}
#viewer-v4-tabs>.ui-tabs-nav{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin:0 0 10px!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
}
#viewer-v4-tabs>.ui-tabs-nav li{
    margin:0!important;
    border:1px solid var(--v7-line)!important;
    border-radius:10px!important;
    background:#0b111d!important;
}
#viewer-v4-tabs>.ui-tabs-nav li.ui-tabs-active{
    border-color:rgba(154,88,255,.42)!important;
    background:linear-gradient(135deg,rgba(126,61,219,.75),rgba(154,88,255,.55))!important;
    box-shadow:0 8px 18px rgba(81,35,148,.16);
}
#viewer-v4-tabs>.ui-tabs-nav .ui-tabs-anchor{
    padding:8px 12px!important;
    color:#c7d0dd!important;
    font-size:10.5px!important;
}
#viewer-v4-tabs>.ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor{color:#fff!important}
#viewer-v4-tabs>.ui-tabs-panel{padding:0!important}
#v4-summary>.panel:first-child{
    position:relative;
    overflow:hidden;
    margin-top:0;
    border-color:rgba(83,207,147,.16);
}
#v4-summary>.panel:first-child:before{
    content:"";
    position:absolute;
    inset:auto 0 0 auto;
    width:260px;
    height:180px;
    pointer-events:none;
    background:radial-gradient(circle,rgba(39,239,120,.08),transparent 66%);
}
.confidence-pill{color:#b8c2d0;font-size:10.5px}
.viewer-v4-score-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
}
.viewer-v4-score{
    position:relative;
    padding:12px;
    border-radius:12px;
}
.viewer-score-main{
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    gap:10px;
    align-items:start;
}
.viewer-score-icon{
    width:34px;height:34px;
    display:grid;place-items:center;
    border-radius:10px;
    background:rgba(39,239,120,.07);
    color:var(--v7-green);
}
.viewer-v4-score.negative .viewer-score-icon{
    background:rgba(255,85,119,.07);
    color:var(--v7-red);
}
.viewer-score-icon svg{width:18px;height:18px}
.viewer-score-body{min-width:0}
.viewer-v4-score header{
    display:flex;
    justify-content:space-between;
    gap:10px;
    align-items:center;
}
.viewer-v4-score header span{font-size:10.5px;font-weight:670;color:#dfe5ed}
.viewer-v4-score header strong{color:var(--v7-green);font-size:13.5px}
.viewer-v4-score.negative header strong{color:var(--v7-red)}
.score-track{
    height:5px;
    margin-top:7px;
    overflow:hidden;
    border-radius:99px;
    background:#1a2332;
}
.score-track i{display:block;height:100%;border-radius:99px;background:var(--v7-green)}
.viewer-v4-score.negative .score-track i{background:var(--v7-red)}
.viewer-v4-score small{
    display:block;
    margin-top:7px;
    color:#6f7c91;
    font-size:8.8px!important;
    line-height:1.4;
}
.viewer-v4-columns{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:12px;
}
.viewer-v4-columns>.panel{margin-top:0}
.viewer-v4-columns h2{
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}
.viewer-v4-columns h2 svg{width:16px;height:16px;color:#a86bff}
.viewer-v4-list{margin:0}
.viewer-v4-list div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:8px 0;
    border-bottom:1px solid rgba(148,163,184,.09);
}
.viewer-v4-list div:last-child{border-bottom:0}
.viewer-v4-list dt{color:#8190a5;font-size:10.5px}
.viewer-v4-list dd{margin:0;color:#e9edf3;font-size:10.5px;text-align:right}
.viewer-v4-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin:10px 0;
}
.viewer-v4-toolbar span{color:#7e8b9f;font-size:10px}
.candidate-v4-summary{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    margin-bottom:12px;
}
.candidate-v4-summary article{padding:14px;border-radius:13px}
.candidate-v4-summary span{display:block;color:#8290a4;font-size:9.5px}
.candidate-v4-summary strong{display:block;margin-top:4px;font-size:18px}
.candidate-v4-breakdown{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.candidate-v4-breakdown div{
    display:flex;
    justify-content:space-between;
    padding:9px 10px;
    border:1px solid var(--v7-line);
    border-radius:9px;
    background:#0a101b;
    font-size:10.5px;
}
.viewer-note-form{display:grid;gap:10px}
.viewer-note{padding:12px 0;border-bottom:1px solid var(--v7-line)}
.viewer-note>div{display:flex;justify-content:space-between;gap:12px}
.viewer-note time{color:#758196;font-size:9.5px}

/* ANALYTICS */
.analytics-periods,.candidate-periods{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin:12px 0 16px;
}
.analytics-periods button,.candidate-period{
    min-height:33px;
    padding:0 10px;
    border:1px solid var(--v7-line);
    border-radius:9px;
    background:#0b111d;
    color:#8d99ac;
    font-size:9.5px;
    font-weight:700;
    cursor:pointer;
}
.analytics-periods button.active,.candidate-period.active{
    color:#fff;
    border-color:rgba(154,88,255,.36);
    background:rgba(154,88,255,.14);
}
.analytics-chart-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}
.analytics-chart-grid .panel{min-height:300px;margin-top:0}
.analytics-chart-grid canvas{height:220px!important;max-height:220px!important}

/* ADMIN + BOT */
.admin-data-page{max-width:none}
.admin-data-grid{
    display:grid;
    grid-template-columns:minmax(300px,420px) 1fr;
    gap:14px;
}
.admin-data-grid>.panel{margin-top:0}
.admin-data-actions{display:flex;align-items:center;gap:7px}
.language-weight-list{display:grid;gap:0;margin-top:10px}
.language-weight-list div{
    display:flex;justify-content:space-between;gap:16px;
    padding:9px 0;
    border-bottom:1px solid var(--v7-line);
}
.language-weight-list div:last-child{border-bottom:0}
.language-weight-list span{color:#8c99ac;font-size:10.5px}
.language-weight-list strong{color:var(--v7-green);font-size:10.5px}
.bot-admin-page{max-width:none}
.bot-admin-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-bottom:16px;
}
.bot-master-control{
    min-width:290px;
    display:flex;
    align-items:center;
    gap:14px;
    padding:13px 15px;
    border:1px solid var(--v7-line);
    border-radius:14px;
    background:#0b111d;
}
.bot-master-control>div{display:flex;flex-direction:column;gap:2px;flex:1}
.bot-master-control strong{font-size:12px}
.bot-master-control span{color:#79869a;font-size:10px}
.bot-master-control.is-on{border-color:rgba(39,239,120,.16)}
.bot-master-control.is-on #bot-master-label{color:var(--v7-green)}
.bot-save-state{margin:0 0 14px;color:#748196;font-size:10px}
.bot-feature-tabs>.ui-tabs-nav{
    display:flex;flex-wrap:wrap;gap:7px;
    margin:0 0 12px!important;padding:0!important;border:0!important;background:transparent!important;
}
.bot-feature-tabs>.ui-tabs-nav li{
    border:1px solid var(--v7-line)!important;
    border-radius:9px!important;
    background:#0b111d!important;
}
.bot-feature-tabs>.ui-tabs-nav .ui-tabs-anchor{
    padding:8px 11px!important;color:#9ba7b8!important;font-size:10px!important;
}
.bot-feature-tabs>.ui-tabs-nav li.ui-tabs-active{
    border-color:rgba(154,88,255,.35)!important;
    background:rgba(154,88,255,.12)!important;
}
.bot-feature-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}
.bot-feature-row{
    min-height:76px;
    display:grid;
    grid-template-columns:40px minmax(0,1fr) auto;
    gap:11px;
    align-items:center;
    padding:12px;
    border-radius:13px;
}
.bot-feature-row.is-on{border-color:rgba(39,239,120,.10)}
.bot-feature-icon{
    width:38px;height:38px;display:grid;place-items:center;
    border-radius:10px;background:rgba(154,88,255,.07);color:#ad7bff;
}
.bot-feature-row.is-on .bot-feature-icon{background:rgba(39,239,120,.06);color:var(--v7-green)}
.bot-feature-icon svg{width:18px;height:18px}
.bot-feature-text strong{display:block;color:#e8edf4;font-size:11.5px}
.bot-feature-text span{display:block;margin-top:3px;color:#768397;font-size:9.5px;line-height:1.45}
.bot-feature-state{font-size:9.5px;color:#6d798d}
.bot-feature-row.is-on .bot-feature-state{color:var(--v7-green)}
.settings-ui-grid,.settings-v4-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}
.settings-ui-grid label,.settings-v4-grid label{
    padding:12px;
    border:1px solid var(--v7-line);
    border-radius:12px;
    background:#0a101b;
}
.settings-ui-grid label>span,.settings-v4-grid label>span{font-size:11px}
.settings-ui-grid label>small,.settings-v4-grid label>small{color:#758196;font-size:9.5px!important}
.settings-wide{grid-column:1/-1}
.settings-thresholds{grid-template-columns:repeat(4,minmax(0,1fr))}
.bot-settings-actions,.settings-v4-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}

/* SWITCHES */
.portal-switch{
    position:relative;
    display:inline-flex;
    width:43px;
    height:23px;
    flex:0 0 43px;
}
.portal-switch input{position:absolute;opacity:0;pointer-events:none}
.portal-switch-track{
    position:absolute;inset:0;
    border:1px solid var(--v7-line-strong);
    border-radius:999px;
    background:#161e2b;
    cursor:pointer;
    transition:.18s;
}
.portal-switch-thumb{
    position:absolute;
    left:2px;top:2px;
    width:17px;height:17px;
    border-radius:50%;
    background:#69768a;
    transition:.18s;
}
.portal-switch input:checked+.portal-switch-track{
    border-color:rgba(39,239,120,.28);
    background:rgba(39,239,120,.12);
}
.portal-switch input:checked+.portal-switch-track .portal-switch-thumb{
    transform:translateX(19px);
    background:var(--v7-green);
    box-shadow:0 0 10px rgba(39,239,120,.5);
}
.portal-switch-large{width:54px;height:29px;flex-basis:54px}
.portal-switch-large .portal-switch-thumb{width:23px;height:23px}
.portal-switch-large input:checked+.portal-switch-track .portal-switch-thumb{transform:translateX(25px)}

/* HEALTH */
.health-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.health-card{
    display:grid;
    grid-template-columns:1fr auto;
    gap:6px 14px;
    padding:12px;
    border-radius:12px;
}
.health-card div strong{display:block;font-size:11px}
.health-card div span{display:block;margin-top:3px;color:#758196;font-size:9.5px}
.health-card b{font-size:9px}
.health-card small{grid-column:1/-1;color:#657286;font-size:8.5px}
.health-card.ok,.health-card.online{border-color:rgba(39,239,120,.13)}
.health-card.error,.health-card.offline{border-color:rgba(255,85,119,.15)}

/* CANDIDATES */
.candidate-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.candidate-list{display:flex;flex-direction:column;gap:8px}
.candidate-card{
    position:relative;
    display:grid;
    grid-template-columns:66px minmax(0,1fr);
    gap:12px;
    padding:12px;
    border-radius:12px;
}
.candidate-card.recommended{border-color:rgba(39,239,120,.13)}
.candidate-rank-score{
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    border-right:1px solid var(--v7-line);
}
.candidate-rank-score strong{color:var(--v7-green);font-size:20px}
.candidate-rank-score small{color:#5e6b7f;font-size:7.5px;text-transform:uppercase}
.candidate-main>strong{display:block;font-size:11px}
.candidate-main>small{display:block;margin-top:2px;color:#677489;font-size:8.5px}
.candidate-bars{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px;margin-top:8px}
.candidate-bars span{display:flex;justify-content:space-between;gap:8px;color:#6f7c90;font-size:8px}
.candidate-bars b{color:#bac3d0}
.candidate-recommend{position:absolute;right:9px;top:8px;color:var(--v7-green);font-size:7px}

/* MESSENGER */
.messenger-shell{
    display:grid;
    grid-template-columns:310px 1fr;
    min-height:650px;
    padding:0;
    overflow:hidden;
}
.messenger-contacts{
    padding:15px;
    overflow:auto;
    border-right:1px solid var(--v7-line);
}
.messenger-heading h1{margin:0}
.messenger-search{
    display:flex;align-items:center;gap:8px;
    margin:12px 0;padding:0 10px;
    border:1px solid var(--v7-line);border-radius:10px;background:#080d17;
}
.messenger-search input{border:0!important;background:transparent!important;box-shadow:none!important}
.messenger-contact{display:flex;gap:10px;padding:9px;border-radius:10px;cursor:pointer}
.messenger-contact:hover,.messenger-contact.active{background:rgba(154,88,255,.08)}
.messenger-contact img,.messenger-contact .avatar-fallback{
    width:38px;height:38px;border-radius:10px;object-fit:cover;background:#111827;display:grid;place-items:center
}
.messenger-contact strong{font-size:10.5px}
.messenger-contact small{display:block;margin-top:2px;color:#758196;font-size:8.5px}
.messenger-chat{min-width:0;display:flex;flex-direction:column}
.messenger-empty{margin:auto;text-align:center;color:#778499}
#messenger-active{display:flex;flex-direction:column;height:650px}
#messenger-chat-header{padding:13px 15px;border-bottom:1px solid var(--v7-line);font-weight:700}
#messenger-messages{flex:1;overflow:auto;padding:15px;display:flex;flex-direction:column;gap:8px}
.message-bubble{max-width:75%;padding:9px 11px;border-radius:12px;background:#101725}
.message-bubble.mine{align-self:flex-end;background:rgba(154,88,255,.15)}
.message-bubble time{display:block;margin-top:4px;color:#6c788c;font-size:8px}
#messenger-form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--v7-line)}
#messenger-form textarea{flex:1;min-height:42px}

/* HOME */
.hero{
    position:relative;
    min-height:300px;
    display:grid;
    grid-template-columns:1.05fr .95fr;
    overflow:hidden;
    border:1px solid var(--v7-line);
    border-radius:20px;
    background:linear-gradient(145deg,#0c1220,#080d17);
}
.hero-copy{padding:34px 32px}
.hero .welcome{font-size:18px}
.hero h2{font-size:50px!important;line-height:.98}
.hero-desc{color:#9aa6b8;font-size:12px;line-height:1.65}
.runtime-main-stats{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}
.runtime-stat{
    min-width:145px;
    display:flex;align-items:center;gap:10px;
    padding:10px 12px;
    border:1px solid var(--v7-line);
    border-radius:12px;
    background:rgba(255,255,255,.018);
}
.runtime-stat-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:rgba(39,239,120,.06);color:var(--v7-green)}
.runtime-stat-icon svg{width:17px;height:17px}
.runtime-stat b{font-size:15px}
.runtime-stat small{display:block;color:#758196;font-size:8.5px}
.grid4{gap:12px}
.card{padding:16px;border-radius:15px}

/* JQUERY UI */
.ui-widget,
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button{
    font-family:Inter,system-ui,sans-serif!important;
    font-size:11px!important;
}
.ui-widget-content{border-color:var(--v7-line)!important;background:transparent!important;color:#dce3ed!important}
.ui-widget-header{border:0!important;background:transparent!important;color:#fff!important}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button{
    border:1px solid var(--v7-line)!important;
    background:#0b111d!important;
    color:#bcc6d4!important;
}
.ui-state-hover,.ui-button:hover{
    border-color:rgba(154,88,255,.28)!important;
    background:rgba(154,88,255,.09)!important;
    color:#fff!important;
}
.ui-selectmenu-button.ui-button{
    width:100%!important;
    min-height:39px;
    padding:8px 10px!important;
    border-radius:9px!important;
}
.ui-selectmenu-menu .ui-menu{
    border:1px solid var(--v7-line-strong)!important;
    border-radius:10px!important;
    background:#0b111d!important;
    color:#fff!important;
    box-shadow:var(--v7-shadow);
}
.ui-menu .ui-menu-item-wrapper{padding:8px 9px!important}
.ui-menu .ui-menu-item-wrapper.ui-state-active{
    border-color:transparent!important;
    background:rgba(154,88,255,.13)!important;
    color:#fff!important;
}
.ui-autocomplete{
    z-index:5000!important;
    max-height:380px;
    overflow:auto;
    padding:6px!important;
    border:1px solid var(--v7-line-strong)!important;
    border-radius:11px!important;
    background:#0a0f19!important;
    box-shadow:var(--v7-shadow)!important;
}
.ui-dialog{
    border:1px solid rgba(154,88,255,.25)!important;
    border-radius:15px!important;
    background:#0b111d!important;
    color:#eef2f7!important;
    box-shadow:0 30px 80px rgba(0,0,0,.6)!important;
}
.ui-dialog .ui-dialog-titlebar{
    border:0!important;
    border-radius:15px 15px 0 0!important;
    background:#111827!important;
    color:#fff!important;
}

/* NOTICES */
.notice,.flash,.empty-state{
    padding:12px 14px;
    border:1px solid rgba(39,239,120,.14);
    border-radius:12px;
    background:rgba(39,239,120,.045);
    color:#bdf9d0;
    font-size:10.5px;
}
.empty-state{
    border-style:dashed;
    border-color:var(--v7-line-strong);
    background:#0a101b;
    color:#8f9bae;
}
.subscriber-auth-box{
    display:flex;align-items:center;gap:13px;
    margin-bottom:14px;padding:14px 15px;
    border:1px solid var(--v7-line);border-radius:13px;background:#0b111d;
}
.subscriber-auth-box span{flex:1;color:#7e8a9d;font-size:10px}

/* RESPONSIVE */
@media(max-width:1180px){
    .app{grid-template-columns:210px minmax(0,1fr)}
    .main{padding-inline:20px}
    .viewer-v4-stats,.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .viewer-v4-score-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .analytics-chart-grid{grid-template-columns:1fr}
    .settings-thresholds{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
    .app{grid-template-columns:1fr}
    .sidebar{
        position:relative;
        height:auto;
        border-right:0;
        border-bottom:1px solid var(--v7-line);
    }
    .brand{grid-template-columns:auto 1fr;text-align:left;justify-items:start;align-items:center}
    .logo-wrap{width:66px;height:66px}
    .nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
    .nav-section-label{grid-column:1/-1}
    .main{padding-inline:16px}
    .viewer-v4-hero{align-items:flex-start;flex-direction:column}
    .viewer-v4-quick{width:100%}
    .viewer-v4-columns,.admin-data-grid,.candidate-columns{grid-template-columns:1fr}
    .bot-feature-list,.settings-ui-grid,.settings-v4-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
    .content{padding-top:18px}
    .topbar .title{font-size:12px}
    .account-copy{display:none}
    .viewer-v4-stats,.metric-grid,.viewer-v4-score-grid,.candidate-v4-summary{grid-template-columns:1fr}
    .viewer-v4-identity{align-items:flex-start}
    .viewer-v4-avatar{width:68px;height:68px;flex-basis:68px}
    .viewer-page-head{align-items:flex-start}
    .viewer-v4-columns,.candidate-v4-breakdown{grid-template-columns:1fr}
    .viewer-search-row,.data-toolbar,.mega-head,.section-title{align-items:stretch;flex-direction:column}
    .messenger-shell{grid-template-columns:1fr}
    .messenger-contacts{border-right:0;border-bottom:1px solid var(--v7-line)}
    .nav{grid-template-columns:1fr}
}


:root{
    --v7-bg:#050812;
    --v7-bg-soft:#080d18;
    --v7-sidebar:#070a14;
    --v7-panel:#0c1220;
    --v7-panel-2:#0f1625;
    --v7-panel-3:#111927;
    --v7-line:rgba(155,166,185,.16);
    --v7-line-strong:rgba(160,171,190,.24);
    --v7-text:#f5f7fb;
    --v7-muted:#929eb1;
    --v7-muted-2:#6e7a8e;
    --v7-purple:#9b5cff;
    --v7-purple-2:#6f37d2;
    --v7-green:#28ef78;
    --v7-red:#ff5b7b;
    --v7-cyan:#45c9ff;
    --v7-yellow:#f3bf43;
    --v7-radius:15px;
    --v7-radius-lg:18px;
}

html{font-size:15px}
body,p,li,td,th,label,input,select,textarea,button,a{font-size:15px}

.app{
    grid-template-columns:250px minmax(0,1fr);
}

.main{
    padding:0 30px 46px;
}

.content{
    max-width:1510px;
    padding-top:30px;
}

.sidebar{
    padding:20px 14px 18px;
    background:
        radial-gradient(circle at 18% 7%,rgba(154,88,255,.15),transparent 20rem),
        linear-gradient(180deg,rgba(7,10,20,.99),rgba(5,8,16,.995));
}

.brand{
    gap:12px;
    padding-bottom:28px;
}

.logo-wrap{
    width:110px;
    height:110px;
}

.brand h1{
    font-size:19px;
    font-weight:780;
}

.brand p{
    margin-top:4px;
    font-size:10.5px;
}

.nav{
    gap:4px;
}

.nav-section-label{
    margin:20px 11px 7px;
    font-size:9.5px;
    letter-spacing:.16em;
}

.nav a{
    min-height:42px;
    gap:12px;
    padding:10px 12px;
    border-radius:11px;
    font-size:13.5px!important;
    font-weight:610;
}

.nav a svg{
    width:19px;
    height:19px;
    flex-basis:19px;
}

.nav a.active{
    background:
        linear-gradient(90deg,rgba(143,66,238,.30),rgba(119,55,214,.09));
    border-color:rgba(154,88,255,.24);
    box-shadow:
        inset 2px 0 0 #a45fff,
        0 10px 28px rgba(65,26,116,.16);
}

.sidebar-footer{
    margin-top:26px;
}

.sidebar-status{
    min-height:34px;
    font-size:10.5px;
    background:
        linear-gradient(90deg,rgba(39,239,120,.055),rgba(154,88,255,.035));
}

.topbar{
    height:70px;
}

.topbar .title{
    font-size:13.5px;
}

.pill{
    min-height:40px;
    padding:0 14px;
    border-radius:12px;
    font-size:11.5px;
}

.account-menu-button{
    min-height:46px;
    gap:10px;
    padding:6px 11px 6px 7px;
    border-radius:13px;
}

.account-avatar{
    width:33px;
    height:33px;
    border-radius:10px;
}

.account-copy strong{
    font-size:12px;
}

.account-copy small{
    font-size:10px;
}

h1,.page-title,.mega-head h1{
    font-size:28px!important;
    letter-spacing:-.035em;
}

h2{
    font-size:19px!important;
}

h3{
    font-size:15px!important;
}

.page-sub,
.muted-note,
.table-sub,
.section-title p,
.mega-head p{
    font-size:12.5px!important;
    line-height:1.62;
}

.eyebrow{
    min-height:23px;
    margin-bottom:8px;
    padding:0 9px;
    font-size:9px!important;
}

.mega-head{
    margin-bottom:22px;
}

.section-title{
    gap:20px;
    margin-bottom:18px;
}

.panel{
    margin-top:20px;
    padding:20px;
    border-radius:18px;
    background:
        linear-gradient(145deg,rgba(16,22,37,.97),rgba(9,14,25,.97));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.018),
        0 12px 34px rgba(0,0,0,.09);
}

.metric-grid{
    gap:14px;
    margin-bottom:20px;
}

.metric-card{
    min-height:94px;
    padding:17px 18px;
    border-radius:15px;
}

.metric-card span{
    font-size:11px!important;
}

.metric-card strong{
    margin-top:6px;
    font-size:22px!important;
}

.metric-card small{
    margin-top:5px;
    font-size:10.5px!important;
}

.btn{
    min-height:40px;
    padding:0 14px;
    border-radius:10px;
    font-size:12px;
}

input[type=text],
input[type=search],
input[type=number],
input[type=email],
input[type=password],
select,
textarea{
    min-height:43px;
    padding:10px 12px;
    border-radius:11px;
}

.portal-table th,
.portal-table td,
.mega-table th,
.mega-table td{
    padding:13px 11px;
}

.portal-table th,.mega-table th{
    font-size:10px!important;
}

.portal-table td,.mega-table td{
    font-size:12px!important;
}

.viewer-search{
    margin-bottom:17px;
}

.viewer-search-box,.data-search{
    min-height:43px;
    padding:0 11px;
    border-radius:12px;
}

.viewer-search-input,.data-search input{
    min-height:41px!important;
}

.live-refresh-pill{
    padding:8px 11px;
    font-size:10px!important;
}

.viewer-page-head{
    gap:13px;
    margin-bottom:20px;
}

.viewer-page-icon{
    width:48px;
    height:48px;
    border-radius:13px;
}

.viewer-page-icon svg{
    width:24px;
    height:24px;
}

.viewer-page-head h1{
    font-size:26px!important;
}

.viewer-page-head p{
    margin-top:4px;
    font-size:12px;
}

.viewer-v4{
    gap:20px;
}

.viewer-v4-hero{
    min-height:136px;
    padding:22px 23px;
    gap:28px;
    border-color:rgba(154,88,255,.24);
    background:
        radial-gradient(circle at 10% 0,rgba(139,67,227,.15),transparent 28rem),
        radial-gradient(circle at 100% 100%,rgba(39,239,120,.055),transparent 24rem),
        linear-gradient(145deg,#0d1321,#090e19);
}

.viewer-v4-identity{
    gap:20px;
}

.viewer-v4-avatar{
    width:90px;
    height:90px;
    flex-basis:90px;
    border-color:rgba(155,91,255,.36);
    box-shadow:
        inset 0 0 28px rgba(154,88,255,.05),
        0 12px 28px rgba(0,0,0,.15);
}

.viewer-v4-avatar svg{
    width:34px;
    height:34px;
}

.viewer-v4-title-row{
    gap:11px;
}

.viewer-v4-title-row h1{
    font-size:25px!important;
}

.viewer-login{
    margin-top:3px;
    font-size:12.5px;
}

.viewer-online{
    font-size:10.5px;
}

.viewer-role-badges{
    gap:7px;
    margin-top:11px;
}

.role-pill,.status-chip,.system-badge,.badge{
    padding:6px 9px;
    border-radius:9px;
    font-size:10.5px!important;
}

.viewer-v4-quick{
    grid-template-columns:repeat(2,minmax(128px,1fr));
    gap:11px;
}

.viewer-v4-quick div{
    min-width:132px;
    padding:14px 15px;
    border-radius:14px;
    background:
        linear-gradient(145deg,rgba(17,23,38,.90),rgba(9,14,24,.88));
}

.viewer-v4-quick span{
    font-size:10px;
}

.viewer-v4-quick strong{
    margin-top:5px;
    font-size:19px;
}

.viewer-v4-quick small{
    margin-top:4px;
    font-size:9.5px;
}

.viewer-v4-stats{
    gap:13px;
}

.viewer-v4-stats article{
    min-height:88px;
    grid-template-columns:42px minmax(0,1fr);
    gap:12px;
    padding:15px 16px;
    border-radius:15px;
}

.viewer-stat-icon{
    width:42px;
    height:42px;
    border-radius:12px;
}

.viewer-stat-icon svg{
    width:21px;
    height:21px;
}

.viewer-stat-copy span{
    font-size:10.5px!important;
}

.viewer-stat-copy strong{
    margin-top:4px;
    font-size:17.5px!important;
}

.viewer-stat-copy small{
    margin-top:4px;
    font-size:9.5px!important;
}

#viewer-v4-tabs>.ui-tabs-nav{
    gap:8px;
    margin-bottom:12px!important;
}

#viewer-v4-tabs>.ui-tabs-nav li{
    border-radius:11px!important;
}

#viewer-v4-tabs>.ui-tabs-nav .ui-tabs-anchor{
    padding:9px 14px!important;
    font-size:11px!important;
}

#v4-summary>.panel:first-child{
    border-color:rgba(55,201,130,.22);
    background:
        radial-gradient(circle at 100% 100%,rgba(39,239,120,.085),transparent 26rem),
        radial-gradient(circle at 0 0,rgba(154,88,255,.08),transparent 24rem),
        linear-gradient(145deg,#0e1422,#091019);
}

.confidence-pill{
    font-size:11.5px;
}

.viewer-v4-score-grid{
    gap:12px;
}

.viewer-v4-score{
    padding:14px;
    border-radius:13px;
}

.viewer-score-main{
    grid-template-columns:38px minmax(0,1fr);
    gap:11px;
}

.viewer-score-icon{
    width:38px;
    height:38px;
    border-radius:11px;
}

.viewer-score-icon svg{
    width:20px;
    height:20px;
}

.viewer-v4-score header span{
    font-size:11.5px;
}

.viewer-v4-score header strong{
    font-size:15px;
}

.score-track{
    height:6px;
    margin-top:8px;
}

.viewer-v4-score small{
    margin-top:8px;
    font-size:9.8px!important;
}

.viewer-v4-columns{
    gap:14px;
    margin-top:14px;
}

.viewer-v4-columns>.panel{
    padding:20px;
}

.viewer-v4-list div{
    padding:9px 0;
}

.viewer-v4-list dt,
.viewer-v4-list dd{
    font-size:11.5px;
}

.live-audience-table{
    width:100%;
    min-width:980px;
}

.live-viewer-name{
    display:flex!important;
    align-items:center!important;
    gap:11px!important;
    min-width:220px;
    color:inherit;
}

.live-viewer-name>span:last-child{
    display:flex!important;
    min-width:0;
    flex-direction:column!important;
}

.live-viewer-name strong{
    display:block;
    max-width:260px;
    overflow:hidden;
    text-overflow:ellipsis;
    color:#f0f3f8;
    font-size:12.5px!important;
    line-height:1.2;
    white-space:nowrap;
}

.live-viewer-name small{
    display:block;
    max-width:260px;
    margin-top:3px;
    overflow:hidden;
    text-overflow:ellipsis;
    color:#78859a;
    font-size:10px!important;
    line-height:1.15;
    white-space:nowrap;
}

.live-avatar{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    max-width:38px!important;
    min-height:38px!important;
    max-height:38px!important;
    flex:0 0 38px!important;
    display:block!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.09)!important;
    border-radius:11px!important;
    object-fit:cover!important;
    object-position:center!important;
    background:#101725!important;
}

img.live-avatar{
    width:38px!important;
    height:38px!important;
    aspect-ratio:1/1!important;
}

.live-avatar-placeholder{
    display:grid!important;
    place-items:center!important;
    color:#c09bff!important;
    background:
        linear-gradient(145deg,rgba(154,88,255,.12),rgba(77,201,255,.04))!important;
    font-size:13px!important;
    font-weight:760!important;
}

.live-audience-table tbody tr{
    min-height:60px;
}

.live-audience-table tbody td{
    height:60px;
}

.status-chip{
    white-space:nowrap;
}

.status-chip.good{
    color:#42f68a;
    border-color:rgba(39,239,120,.20);
    background:rgba(39,239,120,.065);
}

.status-chip.purple{
    color:#c19cff;
    border-color:rgba(154,88,255,.22);
    background:rgba(154,88,255,.07);
}

.status-chip.warning{
    color:#f2c66c;
    border-color:rgba(242,198,108,.18);
    background:rgba(242,198,108,.055);
}

.status-chip.muted{
    color:#778499;
    background:#0b111d;
}

.portal-autocomplete-row{
    display:flex;
    align-items:center;
    gap:11px;
    padding:9px 10px;
    border-radius:10px;
}

.portal-autocomplete-row img,
.portal-autocomplete-avatar{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    max-width:38px!important;
    border-radius:11px!important;
    object-fit:cover!important;
    overflow:hidden;
    background:#101725;
}

.portal-autocomplete-copy strong{
    font-size:12px!important;
}

.portal-autocomplete-copy small{
    margin-top:2px;
    color:#78859a;
    font-size:10px!important;
}

.candidate-columns{
    gap:16px;
}

.candidate-panel{
    padding:20px;
}

.candidate-list{
    gap:10px;
}

.candidate-card{
    min-height:88px;
    grid-template-columns:72px minmax(0,1fr);
    gap:13px;
    padding:14px;
    border-radius:14px;
}

.candidate-person{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}

.candidate-avatar{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    max-width:40px!important;
    flex:0 0 40px!important;
    display:block!important;
    overflow:hidden!important;
    border-radius:11px!important;
    object-fit:cover!important;
    background:#111827!important;
}

.candidate-avatar-placeholder{
    display:grid!important;
    place-items:center!important;
    color:#bd97ff!important;
    font-size:13px!important;
    font-weight:760!important;
}

.candidate-person strong{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#edf1f6;
    font-size:12px;
}

.candidate-person small{
    display:block;
    margin-top:2px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#718096;
    font-size:9.5px;
}

.analytics-periods,.candidate-periods{
    gap:8px;
    margin:13px 0 18px;
}

.analytics-periods button,.candidate-period{
    min-height:36px;
    padding:0 12px;
    border-radius:10px;
    font-size:10.5px;
}

.analytics-chart-grid{
    gap:14px;
}

.analytics-chart-grid .panel{
    min-height:330px;
    padding:20px;
}

.analytics-chart-grid canvas{
    height:240px!important;
    max-height:240px!important;
}

.bot-admin-top{
    gap:20px;
    margin-bottom:18px;
}

.bot-master-control{
    min-width:320px;
    padding:15px 17px;
    border-radius:15px;
}

.bot-master-control strong{
    font-size:13px;
}

.bot-master-control span{
    font-size:10.5px;
}

.bot-feature-list{
    gap:12px;
}

.bot-feature-row{
    min-height:86px;
    grid-template-columns:44px minmax(0,1fr) auto;
    gap:13px;
    padding:14px;
    border-radius:14px;
}

.bot-feature-icon{
    width:42px;
    height:42px;
    border-radius:12px;
}

.bot-feature-icon svg{
    width:20px;
    height:20px;
}

.bot-feature-text strong{
    font-size:12.5px;
}

.bot-feature-text span{
    margin-top:4px;
    font-size:10.5px;
}

.bot-feature-state{
    font-size:10px;
}

.health-grid{
    gap:12px;
}

.health-card{
    padding:14px;
    border-radius:13px;
}

.health-card div strong{
    font-size:12px;
}

.health-card div span{
    font-size:10.5px;
}

.health-card small{
    font-size:9px;
}

.admin-data-grid{
    gap:16px;
}

.settings-ui-grid,.settings-v4-grid{
    gap:12px;
}

.settings-ui-grid label,.settings-v4-grid label{
    padding:14px;
    border-radius:13px;
}

.messenger-shell{
    grid-template-columns:330px 1fr;
    min-height:690px;
    border-radius:18px;
}

.messenger-contacts{
    padding:17px;
}

.messenger-contact{
    gap:11px;
    padding:10px;
    border-radius:11px;
}

.messenger-contact img,.messenger-contact .avatar-fallback{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    flex:0 0 42px!important;
    border-radius:11px!important;
    object-fit:cover!important;
    overflow:hidden!important;
}

.messenger-contact strong{
    font-size:11.5px;
}

.messenger-contact small{
    font-size:9.5px;
}

#messenger-active{
    height:690px;
}

#messenger-chat-header{
    padding:15px 17px;
}

#messenger-messages{
    padding:17px;
    gap:10px;
}

.message-bubble{
    padding:10px 12px;
    border-radius:13px;
}

.hero{
    min-height:340px;
    border-radius:20px;
}

.hero-copy{
    padding:38px 36px;
}

.hero .welcome{
    font-size:19px;
}

.hero h2{
    font-size:52px!important;
}

.hero-desc{
    font-size:12.5px;
}

.runtime-main-stats{
    gap:10px;
    margin-top:20px;
}

.runtime-stat{
    min-width:155px;
    padding:11px 13px;
    border-radius:13px;
}

.runtime-stat-icon{
    width:38px;
    height:38px;
    border-radius:11px;
}

.ui-widget,
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button{
    font-size:12px!important;
}

.ui-selectmenu-button.ui-button{
    min-height:42px;
    padding:9px 11px!important;
    border-radius:10px!important;
}

.ui-menu .ui-menu-item-wrapper{
    padding:9px 10px!important;
}

.ui-autocomplete{
    padding:7px!important;
    border-radius:12px!important;
}

.ui-dialog{
    border-radius:16px!important;
}

.notice,.flash,.empty-state{
    padding:13px 15px;
    border-radius:13px;
    font-size:11.5px;
}

@media(max-width:1280px){
    .app{grid-template-columns:225px minmax(0,1fr)}
    .main{padding-inline:22px}
    .nav a{font-size:12.5px!important}
    .brand h1{font-size:17px}
    .logo-wrap{width:94px;height:94px}
}

@media(max-width:900px){
    .app{grid-template-columns:1fr}
    .main{padding-inline:16px}
}

@media(max-width:650px){
    .viewer-v4-hero{padding:18px}
    .viewer-v4-title-row h1{font-size:22px!important}
    .viewer-v4-avatar{width:72px;height:72px;flex-basis:72px}
}


/* ============================================================
   HOME V7.2 — VIEWER FIRST / WOW
   ============================================================ */

.home-v72{
    display:grid;
    gap:18px;
}

.home-v72-hero{
    position:relative;
    min-height:430px;
    display:grid;
    grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr);
    overflow:hidden;
    border:1px solid rgba(154,88,255,.23);
    border-radius:22px;
    background:
        radial-gradient(circle at 8% 0,rgba(154,88,255,.18),transparent 30rem),
        radial-gradient(circle at 94% 100%,rgba(39,239,120,.07),transparent 26rem),
        linear-gradient(145deg,#0d1322,#080d18);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.02),
        0 24px 58px rgba(0,0,0,.19);
}

.home-v72-hero:after{
    content:"";
    position:absolute;
    left:-160px;
    bottom:-230px;
    width:500px;
    height:500px;
    pointer-events:none;
    border-radius:50%;
    background:rgba(128,60,218,.13);
    filter:blur(90px);
}

.home-v72-copy{
    position:relative;
    z-index:2;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:42px 42px 40px;
}

.home-v72-live-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    width:max-content;
    min-height:28px;
    margin-bottom:18px;
    padding:0 11px;
    border:1px solid rgba(39,239,120,.19);
    border-radius:999px;
    color:#86f7ae;
    background:rgba(39,239,120,.055);
    font-size:9px!important;
    font-weight:820;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.home-v72-live-badge.offline{
    border-color:rgba(154,88,255,.22);
    color:#c6a1ff;
    background:rgba(154,88,255,.055);
}

.home-v72-live-badge i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--v7-green);
    box-shadow:0 0 12px rgba(39,239,120,.9);
}

.home-v72-live-badge.offline i{
    background:var(--v7-purple);
    box-shadow:0 0 12px rgba(154,88,255,.8);
}

.home-v72-kicker{
    margin:0 0 7px;
    color:#c0c8d5;
    font-size:15px;
    font-weight:670;
}

.home-v72-copy h1{
    max-width:760px;
    margin:0;
    color:#fff;
    font-size:50px!important;
    line-height:.99;
    font-weight:830;
    letter-spacing:-.055em;
}

.home-v72-copy h1 span{
    color:var(--v7-green);
    text-shadow:0 0 26px rgba(39,239,120,.18);
}

.home-v72-lead{
    max-width:680px;
    margin:18px 0 0;
    color:#9ba7b9;
    font-size:13px!important;
    line-height:1.72;
}

.home-v72-lead strong{
    color:#eef2f8;
}

.home-v72-stats{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:24px;
}

.home-v72-stat{
    min-width:143px;
    display:flex;
    align-items:center;
    gap:11px;
    padding:11px 13px;
    border:1px solid rgba(148,163,184,.13);
    border-radius:13px;
    background:rgba(7,12,21,.55);
    backdrop-filter:blur(12px);
}

.home-v72-stat-icon{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    flex:0 0 38px;
    border-radius:11px;
    color:#68d7ff;
    background:rgba(77,201,255,.075);
}

.home-v72-stat:nth-child(2) .home-v72-stat-icon{
    color:var(--v7-green);
    background:rgba(39,239,120,.065);
}

.home-v72-stat:nth-child(3) .home-v72-stat-icon{
    color:#c097ff;
    background:rgba(154,88,255,.075);
}

.home-v72-stat-icon svg{
    width:19px;
    height:19px;
}

.home-v72-stat b{
    display:block;
    color:#f7f8fb;
    font-size:15px;
    line-height:1.12;
}

.home-v72-stat small{
    display:block;
    margin-top:3px;
    color:#748196;
    font-size:9px!important;
}

.home-v72-current{
    margin-top:15px;
    padding:13px 14px;
    border:1px solid rgba(39,239,120,.13);
    border-radius:13px;
    background:rgba(39,239,120,.035);
}

.home-v72-current.runtime-hidden{
    display:none;
}

.home-v72-current-label{
    margin-bottom:4px;
    color:var(--v7-green);
    font-size:8.5px;
    font-weight:820;
    letter-spacing:.11em;
    text-transform:uppercase;
}

.home-v72-current-title{
    color:#f3f5f9;
    font-size:12px;
    font-weight:720;
    line-height:1.45;
}

.home-v72-current-sub{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:5px;
    color:#758297;
    font-size:9px;
}

.home-v72-actions{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:24px;
}

.home-v72-actions .btn{
    min-height:43px;
    padding-inline:16px;
}

.home-v72-discord{
    color:#e1e5ff;
    border-color:rgba(111,126,255,.25);
    background:linear-gradient(135deg,rgba(88,101,242,.28),rgba(88,101,242,.13));
}

.home-v72-discord:hover{
    border-color:rgba(111,126,255,.42);
    background:linear-gradient(135deg,rgba(88,101,242,.38),rgba(88,101,242,.18));
}

.home-v72-preview{
    position:relative;
    min-height:430px;
    overflow:hidden;
    background-position:center;
    background-size:cover;
}

.home-v72-preview:before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg,#0b1020 0%,rgba(11,16,32,.48) 23%,rgba(6,9,16,.05) 62%),
        linear-gradient(0deg,rgba(4,7,13,.8),transparent 43%);
}

.home-v72-preview.empty{
    background:
        radial-gradient(circle at 58% 42%,rgba(154,88,255,.15),transparent 14rem),
        linear-gradient(135deg,#101827,#090e18);
}

.home-v72-preview.empty:after{
    content:"";
    position:absolute;
    inset:20%;
    border:1px solid rgba(154,88,255,.09);
    border-radius:50%;
    box-shadow:
        0 0 0 45px rgba(154,88,255,.018),
        0 0 0 90px rgba(39,239,120,.012);
}

.home-v72-stream-card{
    position:absolute;
    right:20px;
    bottom:20px;
    z-index:2;
    width:215px;
    padding:16px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:15px;
    background:rgba(8,13,22,.89);
    box-shadow:0 18px 45px rgba(0,0,0,.3);
    backdrop-filter:blur(16px);
}

.home-v72-stream-card span{
    display:block;
    color:#8390a4;
    font-size:9px!important;
    font-weight:760;
    letter-spacing:.09em;
    text-transform:uppercase;
}

.home-v72-stream-card strong{
    display:block;
    margin-top:4px;
    color:var(--v7-green);
    font-size:21px;
    line-height:1;
    font-weight:830;
}

.home-v72-stream-card strong.offline{
    color:#bb8aff;
}

.home-v72-stream-card small{
    display:block;
    margin-top:7px;
    color:#aab4c4;
    font-size:10px!important;
    line-height:1.45;
}

.home-v72-section{
    display:grid;
    gap:13px;
}

.home-v72-section-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;
    padding:0 2px;
}

.home-v72-section-head h2{
    margin:0;
    font-size:20px!important;
}

.home-v72-section-head p{
    max-width:680px;
    margin:4px 0 0;
    color:#7e8ba0;
    font-size:11px!important;
    line-height:1.55;
}

.home-v72-socials{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:13px;
}

.home-v72-social{
    position:relative;
    min-height:134px;
    display:flex;
    align-items:center;
    gap:15px;
    overflow:hidden;
    padding:18px;
    border:1px solid var(--v7-line);
    border-radius:17px;
    color:#fff;
    background:linear-gradient(145deg,rgba(16,22,37,.98),rgba(8,13,23,.98));
    transition:.18s ease;
}

.home-v72-social:after{
    content:"";
    position:absolute;
    right:-35px;
    bottom:-52px;
    width:150px;
    height:150px;
    border-radius:50%;
    opacity:.09;
}

.home-v72-social.discord:after{background:#5865f2}
.home-v72-social.youtube:after{background:#ff0033}
.home-v72-social.tiktok:after{background:#23f0e6}

.home-v72-social:hover{
    transform:translateY(-2px);
    border-color:rgba(154,88,255,.28);
    box-shadow:0 17px 42px rgba(0,0,0,.14);
}

.home-v72-social-icon{
    width:51px;
    height:51px;
    flex:0 0 51px;
    display:grid;
    place-items:center;
    border-radius:14px;
}

.home-v72-social.discord .home-v72-social-icon{
    color:#aeb5ff;
    background:rgba(88,101,242,.14);
}

.home-v72-social.youtube .home-v72-social-icon{
    color:#ff7189;
    background:rgba(255,0,51,.1);
}

.home-v72-social.tiktok .home-v72-social-icon{
    color:#71f7ef;
    background:rgba(35,240,230,.08);
}

.home-v72-social-icon svg{
    width:25px;
    height:25px;
}

.home-v72-social-copy{
    min-width:0;
    flex:1;
}

.home-v72-social-copy strong{
    display:block;
    font-size:14px;
}

.home-v72-social-copy span{
    display:block;
    margin-top:4px;
    color:#8794a8;
    font-size:10.5px;
    line-height:1.48;
}

.home-v72-social-arrow{
    width:31px;
    height:31px;
    display:grid;
    place-items:center;
    flex:0 0 31px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:9px;
    color:#8290a4;
    background:rgba(255,255,255,.02);
}

.home-v72-social-arrow svg{
    width:15px;
    height:15px;
}

.home-v72-viewer-grid{
    display:grid;
    grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
    gap:13px;
}

.home-v72-card{
    margin:0;
}

.home-v72-profile-card{
    min-height:248px;
    background:
        radial-gradient(circle at 0 0,rgba(154,88,255,.12),transparent 23rem),
        linear-gradient(145deg,#0f1524,#090e19);
}

.home-v72-card-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
}

.home-v72-card-title{
    display:flex;
    align-items:center;
    gap:12px;
}

.home-v72-card-icon{
    width:43px;
    height:43px;
    display:grid;
    place-items:center;
    flex:0 0 43px;
    border-radius:12px;
    color:#c29cff;
    background:rgba(154,88,255,.08);
}

.home-v72-card-icon.green{
    color:#62f398;
    background:rgba(39,239,120,.065);
}

.home-v72-card-icon svg{
    width:21px;
    height:21px;
}

.home-v72-card-title h3{
    margin:0;
    font-size:15px!important;
}

.home-v72-card-title p{
    margin:3px 0 0;
    color:#7f8ca0;
    font-size:10px!important;
}

.home-v72-profile-stats{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
    margin-top:17px;
}

.home-v72-profile-stat{
    min-height:78px;
    padding:12px;
    border:1px solid rgba(148,163,184,.11);
    border-radius:12px;
    background:rgba(7,12,21,.45);
}

.home-v72-profile-stat span{
    display:block;
    color:#748196;
    font-size:9px!important;
}

.home-v72-profile-stat strong{
    display:block;
    margin-top:5px;
    color:#f1f4f8;
    font-size:16px;
    line-height:1.1;
}

.home-v72-profile-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:13px;
    margin-top:15px;
    padding-top:14px;
    border-top:1px solid rgba(148,163,184,.09);
}

.home-v72-profile-bottom p{
    margin:0;
    color:#8290a4;
    font-size:10px!important;
    line-height:1.5;
}

.home-v72-login-card{
    min-height:248px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
    background:
        radial-gradient(circle at 0 0,rgba(39,239,120,.08),transparent 20rem),
        linear-gradient(145deg,#0e1522,#090e18);
}

.home-v72-login-card h3{
    margin:13px 0 0;
    font-size:20px!important;
}

.home-v72-login-card p{
    max-width:620px;
    margin:9px 0 17px;
    color:#8390a4;
    font-size:11px!important;
    line-height:1.6;
}

.home-v72-how{
    display:grid;
    gap:9px;
    margin-top:15px;
}

.home-v72-how-row{
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    gap:11px;
    align-items:center;
    padding:10px;
    border:1px solid rgba(148,163,184,.09);
    border-radius:11px;
    background:rgba(7,12,21,.32);
}

.home-v72-how-number{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:11px;
    color:#c39dff;
    background:rgba(154,88,255,.075);
    font-size:12px;
    font-weight:800;
}

.home-v72-how-row strong{
    display:block;
    color:#e9edf3;
    font-size:11px;
}

.home-v72-how-row span{
    display:block;
    margin-top:3px;
    color:#758297;
    font-size:9.5px;
    line-height:1.45;
}

.home-v72-bottom{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    gap:13px;
}

.home-v72-community{
    min-height:210px;
    background:
        radial-gradient(circle at 100% 0,rgba(39,239,120,.07),transparent 20rem),
        linear-gradient(145deg,#0e1421,#090f19);
}

.home-v72-community-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.home-v72-community-item{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px;
    border:1px solid rgba(148,163,184,.09);
    border-radius:11px;
    background:rgba(7,12,21,.3);
}

.home-v72-community-item svg{
    width:17px;
    height:17px;
    color:var(--v7-green);
}

.home-v72-community-item span{
    color:#a8b2c1;
    font-size:10px;
}

.home-v72-rules{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.home-v72-rule{
    display:flex;
    align-items:center;
    gap:9px;
    padding:10px 11px;
    border:1px solid rgba(148,163,184,.09);
    border-radius:11px;
    background:rgba(7,12,21,.3);
    color:#a9b3c2;
    font-size:10px;
}

.home-v72-rule svg{
    width:16px;
    height:16px;
    flex:0 0 16px;
    color:#7f8da1;
}

.home-v72-rule.good svg{
    color:var(--v7-green);
}

@media(max-width:1200px){
    .home-v72-hero{
        grid-template-columns:1fr;
    }

    .home-v72-preview{
        min-height:330px;
    }

    .home-v72-viewer-grid,
    .home-v72-bottom{
        grid-template-columns:1fr;
    }
}

@media(max-width:900px){
    .home-v72-socials{
        grid-template-columns:1fr;
    }

    .home-v72-profile-stats{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:640px){
    .home-v72-copy{
        padding:28px 22px;
    }

    .home-v72-copy h1{
        font-size:38px!important;
    }

    .home-v72-preview{
        min-height:260px;
    }

    .home-v72-stream-card{
        right:14px;
        bottom:14px;
        width:190px;
    }

    .home-v72-section-head{
        align-items:flex-start;
        flex-direction:column;
    }

    .home-v72-profile-stats,
    .home-v72-community-grid,
    .home-v72-rules{
        grid-template-columns:1fr;
    }

    .home-v72-profile-bottom{
        align-items:flex-start;
        flex-direction:column;
    }
}

/* PORTAL V7.3 */
body,.main,.content,button,input,select,textarea,table,.ui-widget{
 font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important
}
h1,h2,h3,h4,h5,h6,.page-title,.mega-head h1,.viewer-page-head h1,.section-title h1,.section-title h2,
.bot-admin-top h1,.bot-parameters h2,.metric-card strong,.viewer-v4-quick strong,.viewer-stat-copy strong,
.candidate-score strong,.home-v72-copy h1,.big-status strong,.health-card strong,.health-card b{
 font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important
}
.brand h1,.brand p{font-family:Fredoka,Inter,system-ui,sans-serif!important}

/* jeden styl nagłówków działów - jak Funkcje bota */
.mega-head{
 align-items:center!important;margin:0 0 24px!important;padding:8px 0 4px!important;
 border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important
}
.mega-head h1{
 margin:4px 0 0!important;font-size:27px!important;line-height:1.13!important;font-weight:780!important;
 letter-spacing:-.035em!important;color:#f5f7fb!important
}
.mega-head p{max-width:820px;margin-top:7px!important;color:#8d99ac!important;font-size:12px!important;line-height:1.58!important}
.metric-card strong{font-size:21px!important;font-weight:760!important;letter-spacing:-.025em}

/* autocomplete: Nick @login */
.portal-autocomplete-copy{
 min-width:0;display:flex!important;flex-direction:row!important;align-items:baseline!important;gap:6px!important
}
.portal-autocomplete-copy strong,.portal-autocomplete-copy small{display:block!important;margin:0!important;white-space:nowrap}
.portal-autocomplete-copy strong{max-width:210px;overflow:hidden;text-overflow:ellipsis}
.portal-autocomplete-copy small{color:#728096!important}

/* kandydaci */
.candidate-list{gap:10px!important}
.candidate-card{
 min-height:78px!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;
 align-items:center!important;gap:18px!important;padding:13px 15px!important
}
.candidate-person{
 min-width:0!important;display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;
 align-items:center!important;gap:11px!important
}
.candidate-person>span:last-child{min-width:0!important}
.candidate-person strong,.candidate-person small{
 max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important
}
.candidate-score{
 min-width:104px;display:flex!important;flex-direction:column!important;align-items:flex-end!important;
 justify-content:center!important;text-align:right!important;border-left:1px solid rgba(148,163,184,.10);padding-left:15px
}
.candidate-score strong{color:var(--v7-green)!important;font-size:18px!important;font-weight:780!important;line-height:1!important}
.candidate-score small{margin-top:5px!important;color:#718096!important;font-size:8.5px!important;text-transform:uppercase;letter-spacing:.07em}

/* funkcje bota */
.bot-admin-top{align-items:center!important;margin-bottom:20px!important;padding:8px 0 4px}
.bot-admin-top h1{margin:4px 0 0;font-size:27px!important;font-weight:780!important;letter-spacing:-.035em}
.bot-feature-tabs>.ui-tabs-nav{gap:8px!important;margin-bottom:18px!important}
.bot-feature-tabs>.ui-tabs-nav .ui-tabs-anchor{padding:9px 13px!important;font-size:10.5px!important}
.bot-feature-list{gap:12px!important}
.bot-feature-row{
 min-height:88px!important;border-radius:14px!important;
 background:radial-gradient(circle at 0 0,rgba(154,88,255,.045),transparent 14rem),
 linear-gradient(145deg,rgba(14,21,34,.96),rgba(8,14,23,.96))!important
}
.bot-feature-row.is-on{border-color:rgba(39,239,120,.13)!important}

/* status */
.health-card{min-height:84px}
.health-card>div strong{font-size:12px!important;font-weight:720!important}
.health-card>div span{font-size:10.5px!important}
.health-card>b{
 align-self:start;padding:4px 7px;border-radius:7px;background:rgba(255,255,255,.025);
 font-size:8.5px!important;letter-spacing:.07em
}

/* reguły */
.rule-state{display:inline-flex;align-items:center;gap:6px;margin-left:7px;color:#728096;font-size:9px!important}
.rule-state.active{color:#5df393}.rule-state.disabled{color:#8893a5}
.rule-note{max-width:310px;color:#768397!important;font-size:9.5px!important;line-height:1.45}

/* public */
.public-shell{
 min-height:100vh;display:grid;place-items:center;padding:28px;
 background:radial-gradient(circle at 8% 15%,rgba(154,88,255,.17),transparent 31rem),
 radial-gradient(circle at 92% 84%,rgba(39,239,120,.08),transparent 32rem),#050811
}
.public-card{
 width:min(520px,100%);padding:30px;border:1px solid rgba(148,163,184,.16);border-radius:20px;
 background:radial-gradient(circle at 50% 0,rgba(154,88,255,.08),transparent 18rem),
 linear-gradient(145deg,#0d1422,#090e19);box-shadow:0 28px 80px rgba(0,0,0,.34);text-align:center
}
.public-logo{
 width:104px;height:104px;margin:0 auto 18px;object-fit:cover;border:3px solid transparent;border-radius:50%;
 background:linear-gradient(#090e18,#090e18) padding-box,linear-gradient(135deg,var(--v7-green),var(--v7-purple)) border-box
}
.public-card h1{margin:0;font-size:27px!important;font-weight:790;letter-spacing:-.035em}
.public-card h1 span{color:var(--v7-green)}
.public-card p{margin:10px 0 0;color:#8996aa;font-size:11.5px!important;line-height:1.62}
.public-card .actions{justify-content:center;margin-top:20px}.public-card .notice{margin:18px 0 0}
.public-socials{display:flex;justify-content:center;flex-wrap:wrap;gap:7px;margin-top:18px}
.public-socials a{padding:7px 9px;border:1px solid var(--v7-line);border-radius:9px;color:#98a5b7;font-size:9.5px!important}

/* profil zalogowanego widza */
.self-profile{display:grid;gap:16px}
.self-profile-hero{
 min-height:170px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px;
 border:1px solid rgba(154,88,255,.23);border-radius:19px;
 background:radial-gradient(circle at 0 0,rgba(154,88,255,.15),transparent 27rem),
 radial-gradient(circle at 100% 100%,rgba(39,239,120,.06),transparent 23rem),linear-gradient(145deg,#0e1422,#090f19)
}
.self-profile-identity{min-width:0;display:flex;align-items:center;gap:18px}
.self-profile-avatar{width:88px;height:88px;flex:0 0 88px;object-fit:cover;border:2px solid rgba(154,88,255,.35);border-radius:50%;background:#101725}
.self-profile-copy h1{margin:0;font-size:25px!important}.self-profile-login{margin-top:3px;color:#8290a4;font-size:11.5px}
.self-profile-badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.self-profile-rank{min-width:255px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.self-profile-rank article{padding:13px;border:1px solid var(--v7-line);border-radius:13px;background:rgba(7,12,21,.52)}
.self-profile-rank span{display:block;color:#7c899d;font-size:9px!important}.self-profile-rank strong{display:block;margin-top:5px;font-size:18px}
.self-profile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.self-profile-stat{
 min-height:86px;display:grid;grid-template-columns:39px minmax(0,1fr);align-items:center;gap:11px;padding:13px;
 border:1px solid var(--v7-line);border-radius:14px;background:linear-gradient(145deg,#0e1421,#090f19)
}
.self-profile-stat-icon{width:39px;height:39px;display:grid;place-items:center;border-radius:11px;color:#74d9ff;background:rgba(77,201,255,.07)}
.self-profile-stat:nth-child(2n) .self-profile-stat-icon{color:#c299ff;background:rgba(154,88,255,.07)}
.self-profile-stat:nth-child(3n) .self-profile-stat-icon{color:#61f397;background:rgba(39,239,120,.06)}
.self-profile-stat-icon svg{width:19px;height:19px}
.self-profile-stat span{display:block;color:#7c899d;font-size:9px!important}
.self-profile-stat strong{display:block;margin-top:4px;color:#f4f6f9;font-size:16px}
.self-profile-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.self-profile-positive-scores{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:14px}
.self-score{padding:12px;border:1px solid var(--v7-line);border-radius:12px;background:#0a101b}
.self-score header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.self-score header span{color:#cbd3df;font-size:10.5px}.self-score header strong{color:var(--v7-green);font-size:14px}
.self-recent{display:grid;gap:0;margin-top:8px}
.self-recent-row{display:grid;grid-template-columns:115px minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1px solid rgba(148,163,184,.08)}
.self-recent-row:last-child{border-bottom:0}.self-recent-row time{color:#68758a;font-size:9px}.self-recent-row p{margin:0;color:#d1d8e3;font-size:10.5px!important;line-height:1.45}
@media(max-width:1100px){.self-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.self-profile-columns{grid-template-columns:1fr}}
@media(max-width:700px){.self-profile-hero{align-items:flex-start;flex-direction:column}.self-profile-rank{width:100%}.self-profile-grid,.self-profile-positive-scores{grid-template-columns:1fr}}


/* ============================================================
   PELNOMOCNIK.TV — PORTAL DESIGN SYSTEM V8
   ============================================================ */
:root{
 --ui-bg:#050811;--ui-panel:#0c1220;--ui-line:rgba(155,166,185,.16);
 --ui-text:#f5f7fb;--ui-muted:#929eb1;--ui-purple:#9b5cff;
 --ui-green:#28ef78;--ui-red:#ff5b7b;--ui-cyan:#45c9ff;
 --ui-yellow:#f3bf43;--ui-radius:15px;--ui-radius-lg:18px
}
body,button,input,select,textarea,table,.ui-widget{
 font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important
}
h1,h2,h3,h4,h5,h6,.page-title,.mega-head h1,.viewer-page-head h1,
.section-title h1,.section-title h2,.metric-card strong,.viewer-stat-copy strong,
.candidate-score strong,.health-card strong{
 font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important
}
.brand h1,.brand p{font-family:Fredoka,Inter,system-ui,sans-serif!important}
.app{grid-template-columns:250px minmax(0,1fr)}
.main{padding:0 30px 48px}.content{max-width:1510px;padding-top:30px}
.sidebar{padding:20px 14px 18px;background:radial-gradient(circle at 18% 7%,rgba(154,88,255,.15),transparent 20rem),linear-gradient(180deg,rgba(7,10,20,.99),rgba(5,8,16,.995))}
.sidebar-footer{display:none!important}.topbar{height:70px}
.page-header,.mega-head,.bot-admin-top{
 display:flex;align-items:center;justify-content:space-between;gap:24px;
 margin:0 0 24px!important;padding:8px 0 4px!important;border:0!important;
 border-radius:0!important;background:transparent!important;box-shadow:none!important
}
.page-header__copy{min-width:0}
.page-header__eyebrow,.eyebrow{
 display:inline-flex;align-items:center;min-height:23px;margin:0 0 5px!important;
 padding:0 9px;border:1px solid rgba(154,88,255,.22);border-radius:999px;
 color:#be92ff;background:rgba(154,88,255,.06);font-size:8.5px!important;
 font-weight:820;letter-spacing:.11em;text-transform:uppercase
}
.page-header__title,.mega-head h1,.bot-admin-top h1{
 margin:4px 0 0!important;color:var(--ui-text)!important;font-size:27px!important;
 line-height:1.13!important;font-weight:780!important;letter-spacing:-.035em!important
}
.page-header__description,.mega-head p{
 max-width:820px;margin:7px 0 0!important;color:var(--ui-muted)!important;
 font-size:12px!important;line-height:1.58
}
.page-header__actions{display:flex;align-items:center;gap:10px}
.ui-panel,.panel{
 margin-top:0;padding:20px;border:1px solid var(--ui-line);border-radius:18px;
 background:radial-gradient(circle at 0 0,rgba(154,88,255,.035),transparent 22rem),
 linear-gradient(145deg,rgba(16,22,37,.97),rgba(9,14,25,.97));
 box-shadow:inset 0 1px 0 rgba(255,255,255,.018),0 18px 48px rgba(0,0,0,.16)
}
.ui-panel__header,.section-title{
 display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:17px
}
.ui-panel__header h2,.section-title h2{margin:0;font-size:19px!important;font-weight:760;letter-spacing:-.025em}
.ui-panel__header p,.section-title p{margin:4px 0 0;color:var(--ui-muted);font-size:10.5px!important;line-height:1.5}
.metric-grid{gap:12px}
.metric-card{min-height:92px;padding:16px 17px;border:1px solid var(--ui-line);border-radius:14px;background:linear-gradient(145deg,#0e1421,#090f19)}
.metric-card span{color:#8490a4;font-size:10px!important}
.metric-card strong{display:block;margin-top:5px;color:#f4f6f9;font-size:20px!important;font-weight:760!important;letter-spacing:-.025em}
.viewer-statuses,.chip-stack{display:inline-flex!important;align-items:center;flex-wrap:wrap;gap:6px!important}
.viewer-badge,.status-chip{
 display:inline-flex;align-items:center;min-height:25px;padding:0 8px;border:1px solid var(--ui-line);
 border-radius:8px;color:#9aa7b9;background:#0b111d;font-size:9px!important;font-weight:720;white-space:nowrap
}
.viewer-badge--follow,.status-chip.good{color:#49f18c;border-color:rgba(39,239,120,.2);background:rgba(39,239,120,.065)}
.viewer-badge--sub,.viewer-badge--vip,.status-chip.purple{color:#c29dff;border-color:rgba(154,88,255,.22);background:rgba(154,88,255,.07)}
.viewer-badge--mod,.status-chip.warning{color:#f4cb70;border-color:rgba(244,203,112,.2);background:rgba(244,203,112,.06)}
.table-scroll{width:100%;overflow:auto}
.viewer-table,.portal-table,.mega-table{width:100%;border-collapse:collapse}
.viewer-table th,.viewer-table td,.portal-table th,.portal-table td,.mega-table th,.mega-table td{
 padding:13px 11px!important;border-bottom:1px solid rgba(148,163,184,.09);vertical-align:middle
}
.viewer-table th,.portal-table th,.mega-table th{
 color:#8090a7;font-size:9px!important;font-weight:760;letter-spacing:.065em;text-transform:uppercase;white-space:nowrap
}
.viewer-table td,.portal-table td,.mega-table td{color:#dce2eb;font-size:11px!important}
.viewer-table th[data-sort],.portal-table th[data-sort],.mega-table th[data-sort]{cursor:pointer;user-select:none}
.sort-label{display:inline-flex;align-items:center;gap:7px}
.sort-arrows{display:inline-grid;grid-template-rows:6px 6px;align-items:center;color:#536077;font-size:7px;line-height:6px}
th.sort-asc .sort-arrows .up,th.sort-desc .sort-arrows .down{color:var(--ui-purple)}
th.sort-asc .sort-arrows .down,th.sort-desc .sort-arrows .up{opacity:.28}
.live-viewer-name{display:flex!important;align-items:center!important;gap:10px!important;min-width:215px}
.live-viewer-name>span:last-child{display:flex!important;min-width:0;flex-direction:column!important}
.live-viewer-name strong{display:block;max-width:260px;overflow:hidden;text-overflow:ellipsis;color:#f0f3f8;font-size:11.5px!important;line-height:1.2;white-space:nowrap}
.live-viewer-name small{display:block;max-width:260px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;color:#758297;font-size:9px!important;white-space:nowrap}
.live-avatar,.candidate-avatar{
 width:38px!important;height:38px!important;min-width:38px!important;max-width:38px!important;
 min-height:38px!important;max-height:38px!important;flex:0 0 38px!important;object-fit:cover!important;
 overflow:hidden!important;border:1px solid rgba(255,255,255,.09)!important;border-radius:11px!important;background:#101725!important
}
.live-avatar-placeholder,.candidate-avatar-placeholder{
 display:grid!important;place-items:center!important;color:#bf9bff!important;
 background:linear-gradient(145deg,rgba(154,88,255,.12),rgba(77,201,255,.04))!important;font-size:12px!important;font-weight:760!important
}
.table-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px;color:#77849a;font-size:9.5px}
.pagination{display:flex;gap:6px}.pagination .btn.active{color:#fff;border-color:rgba(154,88,255,.35);background:rgba(154,88,255,.14)}
.portal-autocomplete-row{display:flex;align-items:center;gap:10px;padding:8px 9px;border-radius:10px}
.portal-autocomplete-row img,.portal-autocomplete-avatar{
 width:36px!important;height:36px!important;min-width:36px!important;max-width:36px!important;border-radius:10px!important;object-fit:cover!important
}
.portal-autocomplete-copy{min-width:0;display:flex!important;flex-direction:row!important;align-items:baseline!important;gap:7px!important}
.portal-autocomplete-copy strong,.portal-autocomplete-copy small{display:block!important;margin:0!important;white-space:nowrap}
.portal-autocomplete-copy strong{max-width:220px;overflow:hidden;text-overflow:ellipsis;font-size:11px!important}
.portal-autocomplete-copy small{color:#758297!important;font-size:9px!important}
.candidate-list{gap:9px!important}
.candidate-card{min-height:76px!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;gap:16px!important;padding:12px 14px!important;border-radius:13px!important}
.candidate-person{min-width:0!important;display:grid!important;grid-template-columns:40px minmax(0,1fr)!important;align-items:center!important;gap:10px!important}
.candidate-person strong,.candidate-person small{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
.candidate-score{min-width:92px;display:flex!important;flex-direction:column!important;align-items:flex-end!important;border-left:1px solid rgba(148,163,184,.1);padding-left:14px;text-align:right!important}
.candidate-score strong{color:var(--ui-green)!important;font-size:17px!important;font-weight:780!important}
.candidate-score small{margin-top:4px!important;color:#718096!important;font-size:8px!important;text-transform:uppercase;letter-spacing:.06em}
.score-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.score-card{padding:13px;border:1px solid var(--ui-line);border-radius:12px;background:#0a101b}
.score-card header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.score-card header span{color:#cbd3df;font-size:10.5px}.score-card header strong{font-size:14px}
.score-card.positive header strong{color:var(--ui-green)}.score-card.negative header strong{color:var(--ui-red)}
.score-track{height:6px;margin-top:8px;border-radius:999px;background:#1a2434;overflow:hidden}
.score-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#31e783,#56f3a0)}
.score-card.negative .score-track i{background:linear-gradient(90deg,#ff5274,#ff7890)}
.score-card small{display:block;margin-top:7px;color:#748197;font-size:8.8px!important;line-height:1.42}
.feature-title-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.help-icon{width:20px;height:20px;display:inline-grid;place-items:center;padding:0;border:1px solid rgba(154,88,255,.22);border-radius:50%;color:#b790f5;background:rgba(154,88,255,.055);cursor:help}
.help-icon svg{width:12px;height:12px}
.ui-tooltip{max-width:430px!important;padding:12px 13px!important;border:1px solid rgba(154,88,255,.24)!important;border-radius:11px!important;color:#dce2eb!important;background:#0b111d!important;box-shadow:0 18px 42px rgba(0,0,0,.35)!important;font-size:10.5px!important;line-height:1.55!important}
.bot-feature-row{min-height:86px!important;grid-template-columns:42px minmax(0,1fr) auto!important;gap:13px!important;padding:13px!important;border-radius:13px!important;background:linear-gradient(145deg,rgba(14,21,34,.96),rgba(8,14,23,.96))!important}
.bot-feature-row.is-on{border-color:rgba(39,239,120,.13)!important}.bot-feature-text>span{display:block;margin-top:4px;color:#78869b;font-size:9.5px!important;line-height:1.48}
.health-card{min-height:82px}.health-card b{font-family:Inter,system-ui,sans-serif!important}
.public-shell{min-height:100vh;display:grid;place-items:center;padding:28px;background:radial-gradient(circle at 7% 14%,rgba(154,88,255,.17),transparent 32rem),radial-gradient(circle at 93% 86%,rgba(39,239,120,.08),transparent 31rem),#050811}
.public-card{width:min(540px,100%);padding:30px;border:1px solid var(--ui-line);border-radius:20px;background:linear-gradient(145deg,#0d1422,#090e19);box-shadow:0 28px 80px rgba(0,0,0,.34);text-align:center}
.public-logo{width:106px;height:106px;margin:0 auto 18px;object-fit:cover;border:3px solid transparent;border-radius:50%;background:linear-gradient(#090e18,#090e18) padding-box,linear-gradient(135deg,var(--ui-green),var(--ui-purple)) border-box}
.public-card h1{margin:0;font-size:27px!important;font-weight:790;letter-spacing:-.035em}.public-card h1 span{color:var(--ui-green)}
.public-card p{margin:10px auto 0;max-width:450px;color:#8c99ad;font-size:11.5px!important;line-height:1.62}.public-card .actions{justify-content:center;margin-top:20px}
.public-socials{display:flex;justify-content:center;flex-wrap:wrap;gap:7px;margin-top:18px}.public-socials a{padding:7px 10px;border:1px solid var(--ui-line);border-radius:9px;color:#99a5b7;font-size:9.5px!important}
.dev-entry{display:inline-block;margin-top:18px;color:#58657a;font-size:9px!important;text-decoration:none}.dev-entry:hover{color:#a88af4}
.home-v72-stream-card{width:230px!important;min-width:230px}.home-v72-stream-card small{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.4!important}
.home-v72-login-card p{max-width:none!important}.notification-toggle.is-enabled{color:#6ff4a0;border-color:rgba(39,239,120,.24);background:rgba(39,239,120,.07)}
.self-profile{display:grid;gap:15px}
.self-profile-hero{min-height:168px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:23px;border:1px solid rgba(154,88,255,.23);border-radius:18px;background:radial-gradient(circle at 0 0,rgba(154,88,255,.15),transparent 27rem),radial-gradient(circle at 100% 100%,rgba(39,239,120,.06),transparent 23rem),linear-gradient(145deg,#0e1422,#090f19)}
.self-profile-identity{min-width:0;display:flex;align-items:center;gap:17px}.self-profile-avatar{width:86px;height:86px;flex:0 0 86px;object-fit:cover;border:2px solid rgba(154,88,255,.35);border-radius:50%;background:#101725}
.self-profile-copy h1{margin:0;font-size:24px!important}.self-profile-login{margin-top:3px;color:#8290a4;font-size:11px}.self-profile-badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.self-profile-rank{min-width:255px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.self-profile-rank article{padding:13px;border:1px solid var(--ui-line);border-radius:13px;background:rgba(7,12,21,.52)}
.self-profile-rank span{display:block;color:#7c899d;font-size:9px!important}.self-profile-rank strong{display:block;margin-top:5px;font-size:18px}
.self-profile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.self-profile-stat{min-height:84px;display:grid;grid-template-columns:38px minmax(0,1fr);align-items:center;gap:10px;padding:12px;border:1px solid var(--ui-line);border-radius:13px;background:linear-gradient(145deg,#0e1421,#090f19)}
.self-profile-stat-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;color:#74d9ff;background:rgba(77,201,255,.07)}.self-profile-stat span{display:block;color:#7c899d;font-size:9px!important}.self-profile-stat strong{display:block;margin-top:4px;color:#f4f6f9;font-size:15px}
.self-profile-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.self-recent-row{display:grid;grid-template-columns:112px minmax(0,1fr);gap:11px;padding:9px 0;border-bottom:1px solid rgba(148,163,184,.08)}
.self-recent-row time{color:#68758a;font-size:8.7px}.self-recent-row p{margin:0;color:#d1d8e3;font-size:10.3px!important;line-height:1.45}
.song-request-list{display:grid;gap:7px;margin-top:12px}.song-request-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 11px;border:1px solid rgba(148,163,184,.09);border-radius:10px;background:#0a101b}
.song-request-row strong{display:block;font-size:10.5px}.song-request-row small{display:block;margin-top:3px;color:#738096;font-size:8.5px}.song-request-row>span{color:#9aa7b9;font-size:8.5px;text-transform:uppercase}
@media(max-width:1280px){.app{grid-template-columns:225px minmax(0,1fr)}.main{padding-inline:22px}}
@media(max-width:1100px){.score-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.self-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.self-profile-columns{grid-template-columns:1fr}}
@media(max-width:900px){.app{grid-template-columns:1fr}.main{padding-inline:16px}}
@media(max-width:700px){.page-header,.mega-head,.bot-admin-top{align-items:flex-start;flex-direction:column}.score-grid,.self-profile-grid{grid-template-columns:1fr}.self-profile-hero{align-items:flex-start;flex-direction:column}.self-profile-rank{width:100%}}


/* ============================================================
   PELNOMOCNIK.TV — V8.1 POLISH
   ============================================================ */

/* Brand = kanał, nie techniczne konto bota */
.brand h1{
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
    font-size:17px!important;
    font-weight:800!important;
    letter-spacing:-.035em!important;
}
.brand p{
    margin-top:5px!important;
    color:#63ed92!important;
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
    font-size:9.5px!important;
    font-weight:650!important;
    line-height:1.35!important;
    letter-spacing:.005em!important;
}

/* Prawdziwy, prosty znak zapytania */
.help-icon{
    width:19px!important;
    height:19px!important;
    min-width:19px!important;
    min-height:19px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
    border:1px solid rgba(167,109,255,.34)!important;
    border-radius:50%!important;
    color:#c7a0ff!important;
    background:rgba(154,88,255,.07)!important;
    font-family:Inter,system-ui,sans-serif!important;
    font-size:11px!important;
    line-height:1!important;
    font-weight:800!important;
    cursor:help!important;
}
.help-icon:hover{
    color:#fff!important;
    border-color:rgba(167,109,255,.62)!important;
    background:rgba(154,88,255,.17)!important;
}

/* Parametry działania mają własny wyraźny blok i oddech */
.bot-parameters{
    margin-top:34px!important;
}
.bot-parameters>.section-title{
    margin-bottom:20px!important;
}
#bot-settings-accordion{
    margin-top:6px!important;
}
.settings-section-help{
    margin:2px 0 14px!important;
    padding:11px 13px!important;
    border:1px solid rgba(94,118,153,.13)!important;
    border-radius:10px!important;
    color:#8d9ab0!important;
    background:rgba(7,12,21,.42)!important;
    font-size:10px!important;
    line-height:1.55!important;
}
.settings-ui-grid label>small{
    display:block!important;
    margin-top:5px!important;
    color:#718097!important;
    font-size:8.7px!important;
    line-height:1.45!important;
}

/* Formularz dodawania reguły */
.analysis-rule-submit{
    display:flex!important;
    justify-content:center!important;
    width:100%!important;
    margin-top:24px!important;
    padding-top:4px!important;
}
.analysis-rule-submit .btn{
    min-width:150px!important;
}

/* Pięć kart w analityce */
.analytics-live-metrics{
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
}
.analytics-subscriber-card small{
    display:block;
    margin-top:6px;
    color:#718097;
    font-size:8.3px!important;
    line-height:1.35;
}

@media(max-width:1250px){
    .analytics-live-metrics{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
    }
}
@media(max-width:800px){
    .analytics-live-metrics{
        grid-template-columns:1fr!important;
    }
}


/* ============================================================
   PELNOMOCNIK.TV — V8.2 ADMIN & SYNC
   ============================================================ */

/* ----- naprawiony accordion parametrów ----- */
.bot-parameters{
    margin-top:38px!important;
}
#bot-settings-accordion .ui-accordion-header{
    margin-top:6px!important;
}
#bot-settings-accordion .ui-accordion-content{
    padding:16px 18px 18px!important;
    overflow:visible!important;
}
.bot-settings-group{
    display:block!important;
}
.settings-section-help{
    margin:0 0 15px!important;
}
.settings-ui-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
}
.settings-field-card{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    min-width:0!important;
    min-height:132px!important;
    padding:14px!important;
    border:1px solid rgba(148,163,184,.12)!important;
    border-radius:13px!important;
    background:rgba(7,12,21,.48)!important;
}
.settings-field-card.settings-wide{
    grid-column:1/-1!important;
}
.settings-field-card>span{
    display:block!important;
    margin:0 0 4px!important;
    color:#eef2f7!important;
    font-size:10.5px!important;
    font-weight:720!important;
}
.settings-field-card>small{
    display:block!important;
    min-height:28px!important;
    margin:0 0 12px!important;
    color:#74839a!important;
    font-size:8.8px!important;
    line-height:1.45!important;
}
.settings-field-card input[type=text],
.settings-field-card textarea{
    width:100%!important;
}
.settings-number-row{
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    margin-top:auto!important;
}
.settings-number-row em{
    color:#8390a4!important;
    font-size:9px!important;
    font-style:normal!important;
}
.settings-thresholds{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.settings-thresholds .settings-field-card{
    min-height:144px!important;
}

/* ----- global settings ----- */
.settings-divider{
    height:1px;
    margin:26px 0;
    background:rgba(148,163,184,.1);
}
.settings-switch-list{
    display:grid;
    gap:10px;
    margin-top:14px;
}
.settings-switch-row,
.settings-message-field{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:14px 15px;
    border:1px solid rgba(148,163,184,.12);
    border-radius:13px;
    background:rgba(7,12,21,.45);
}
.settings-switch-row>div{
    min-width:0;
}
.settings-switch-row strong,
.settings-message-field>span{
    display:block;
    color:#eef2f7;
    font-size:10.5px;
}
.settings-switch-row span,
.settings-message-field small{
    display:block;
    margin-top:4px;
    color:#75839a;
    font-size:8.8px;
    line-height:1.45;
}
.settings-message-field{
    align-items:stretch;
    flex-direction:column;
}
.settings-message-field input{
    width:100%;
}

/* ----- viewer chat ----- */
.viewer-chat-day{
    margin:18px 0 8px;
    color:#8c98aa;
    font-size:9px;
    font-weight:760;
    letter-spacing:.07em;
    text-transform:uppercase;
}
.viewer-chat-message{
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    gap:13px;
    padding:11px 12px;
    border-bottom:1px solid rgba(148,163,184,.08);
}
.viewer-chat-message time{
    padding-top:2px;
    color:#68768b;
    font-size:9px;
}
.viewer-chat-message-content p{
    margin:0;
    color:#dce2eb;
    font-size:10.5px!important;
    line-height:1.5;
}
.viewer-chat-signals{
    display:flex;
    flex-wrap:wrap;
    gap:5px;
    margin-top:8px;
}
.viewer-chat-chip{
    display:inline-flex;
    min-height:21px;
    align-items:center;
    padding:0 7px;
    border:1px solid rgba(148,163,184,.13);
    border-radius:999px;
    color:#91a0b4;
    background:#0b111c;
    font-size:8px;
    font-weight:700;
}
.viewer-chat-chip.good{
    color:#61ed99;
    border-color:rgba(39,239,120,.2);
}
.viewer-chat-chip.warn{
    color:#edc974;
    border-color:rgba(237,201,116,.2);
}
.viewer-chat-chip.bad{
    color:#ff7e98;
    border-color:rgba(255,91,123,.2);
}
.viewer-chat-chip.purple{
    color:#c19dff;
    border-color:rgba(154,88,255,.2);
}

/* ----- viewer moderation ----- */
.viewer-moderation-card,
.viewer-punishment-card{
    margin-bottom:10px;
    padding:14px 15px;
    border:1px solid rgba(148,163,184,.12);
    border-radius:13px;
    background:linear-gradient(145deg,#0d1421,#090f19);
}
.viewer-moderation-head{
    display:flex;
    justify-content:space-between;
    gap:16px;
}
.viewer-moderation-head>div{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
}
.viewer-moderation-head strong{
    font-size:11px;
}
.viewer-moderation-head span,
.viewer-moderation-head time{
    color:#78869b;
    font-size:8.7px;
}
.viewer-moderation-card blockquote{
    margin:12px 0;
    padding:10px 12px;
    border-left:2px solid rgba(154,88,255,.45);
    color:#cfd7e3;
    background:rgba(154,88,255,.045);
    font-size:10px;
}
.viewer-moderation-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px 16px;
    color:#8190a5;
    font-size:8.7px;
}
.viewer-moderation-subtitle{
    margin:22px 0 9px;
    color:#aab5c4;
    font-size:10px;
    font-weight:750;
}
.viewer-punishment-card{
    display:grid;
    grid-template-columns:120px minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
}
.viewer-punishment-card strong{
    color:#ff8aa0;
    font-size:10px;
}
.viewer-punishment-card span{
    color:#a4afbf;
    font-size:9px;
}
.viewer-punishment-card time{
    color:#68768b;
    font-size:8.5px;
}

/* ----- viewer notes ----- */
.viewer-note-form{
    display:grid!important;
    gap:9px!important;
}
.viewer-note-form textarea{
    min-height:110px;
}
.viewer-note-form-actions{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:12px;
}
.viewer-note-form-actions>span{
    margin-right:auto;
    color:#68768b;
    font-size:8.5px;
}
.viewer-note-list{
    display:grid;
    gap:10px;
    margin-top:18px;
}
.viewer-admin-note{
    padding:14px 15px;
    border:1px solid rgba(148,163,184,.12);
    border-radius:13px;
    background:linear-gradient(145deg,#0e1421,#090f19);
}
.viewer-admin-note-head{
    display:flex;
    justify-content:space-between;
    gap:14px;
    align-items:center;
}
.viewer-admin-note-author{
    display:flex;
    align-items:center;
    gap:9px;
}
.viewer-admin-note-author img,
.viewer-admin-note-avatar{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border-radius:10px;
    object-fit:cover;
    background:rgba(154,88,255,.11);
    color:#c3a1ff;
    font-size:10px;
    font-weight:760;
}
.viewer-admin-note-author strong{
    display:block;
    font-size:10px;
}
.viewer-admin-note-author small,
.viewer-admin-note-head time{
    display:block;
    margin-top:2px;
    color:#6e7c91;
    font-size:8.3px;
}
.viewer-admin-note>p{
    margin:12px 0 0;
    color:#d5dce6;
    font-size:10px!important;
    line-height:1.55;
}
.viewer-admin-note-actions{
    display:flex;
    justify-content:flex-end;
    margin-top:11px;
}

/* ----- admin users ----- */
.role-guide{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-bottom:15px;
}
.role-guide article{
    min-height:78px;
    padding:12px;
    border:1px solid rgba(148,163,184,.11);
    border-radius:12px;
    background:rgba(9,15,25,.72);
}
.role-guide p{
    margin:7px 0 0;
    color:#748298;
    font-size:8.6px!important;
    line-height:1.45;
}
.role-badge{
    display:inline-flex;
    align-items:center;
    min-height:24px;
    padding:0 8px;
    border:1px solid rgba(154,88,255,.22);
    border-radius:8px;
    color:#c29eff;
    background:rgba(154,88,255,.07);
    font-size:8.5px;
    font-weight:760;
}
.role-owner{
    color:#f1c867;
    border-color:rgba(241,200,103,.2);
    background:rgba(241,200,103,.06);
}
.role-viewer{
    color:#9aa7b8;
    border-color:rgba(148,163,184,.15);
    background:rgba(148,163,184,.04);
}
.admin-user-person{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:190px;
}
.admin-user-avatar{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    max-width:40px!important;
    object-fit:cover!important;
    border-radius:11px!important;
    background:#111928!important;
}
.admin-user-avatar.fallback{
    display:grid;
    place-items:center;
    color:#c19bff;
    font-size:12px;
    font-weight:760;
}
.admin-user-person strong{
    display:block;
    font-size:10.5px;
}
.admin-user-person small,
.role-row-help{
    display:block;
    margin-top:3px;
    max-width:260px;
    color:#718096;
    font-size:8.3px!important;
    line-height:1.35;
}
.role-edit{
    display:flex;
    align-items:center;
    gap:7px;
}
.role-protected{
    color:#d8b862;
    font-size:8.7px;
}

/* ----- unified event log ----- */
.event-log-toolbar{
    margin-bottom:15px;
}
.event-log-list{
    display:grid;
    gap:8px;
}
.event-log-card{
    padding:13px 14px;
    border:1px solid rgba(148,163,184,.11);
    border-radius:12px;
    background:linear-gradient(145deg,#0e1421,#090f19);
}
.event-log-head{
    display:grid;
    grid-template-columns:115px minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
}
.event-log-head strong{
    font-size:10.5px;
}
.event-log-head time{
    color:#6c798d;
    font-size:8.5px;
}
.event-source{
    display:inline-flex;
    width:max-content;
    min-height:22px;
    align-items:center;
    padding:0 7px;
    border-radius:7px;
    color:#9da9ba;
    background:#111928;
    font-size:7.8px;
    font-weight:800;
    letter-spacing:.04em;
}
.event-source-audit{color:#c2a1ff;background:rgba(154,88,255,.08)}
.event-source-bot{color:#68ee9d;background:rgba(39,239,120,.06)}
.event-source-moderation{color:#ff8198;background:rgba(255,91,123,.06)}
.event-source-live{color:#63d6ff;background:rgba(69,201,255,.06)}
.event-source-twitch{color:#c49fff;background:rgba(154,88,255,.07)}
.event-log-people{
    margin-top:8px;
    color:#738196;
    font-size:8.5px;
}
.event-log-message{
    margin-top:9px;
    padding:9px 10px;
    border-radius:9px;
    color:#d4dbe5;
    background:#080e18;
    font-size:9.5px;
    line-height:1.45;
}
.event-log-details{
    display:flex;
    flex-wrap:wrap;
    gap:6px 14px;
    margin-top:9px;
    color:#77859a;
    font-size:8.4px;
}

@media(max-width:1100px){
    .settings-thresholds{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .role-guide{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media(max-width:720px){
    .settings-ui-grid,
    .settings-thresholds{
        grid-template-columns:1fr!important;
    }
    .role-guide{
        grid-template-columns:1fr;
    }
    .event-log-head{
        grid-template-columns:1fr;
    }
    .viewer-punishment-card{
        grid-template-columns:1fr;
    }
}


/* ============================================================
   PELNOMOCNIK.TV — V8.3 MODERATION RULES
   ============================================================ */

/* Poprawione przełączniki w ustawieniach globalnych */
.settings-switch-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 64px!important;
    align-items:center!important;
    gap:20px!important;
    padding-right:18px!important;
}
.settings-switch-row>.portal-switch{
    justify-self:center!important;
    align-self:center!important;
    margin:0!important;
}
.settings-switch-row .portal-switch{
    width:44px!important;
    min-width:44px!important;
    height:24px!important;
}
.settings-switch-row .portal-switch-track{
    width:44px!important;
    height:24px!important;
}
.settings-switch-row .portal-switch-thumb{
    width:18px!important;
    height:18px!important;
    top:3px!important;
    left:3px!important;
}
.settings-switch-row .portal-switch input:checked
    +.portal-switch-track
    .portal-switch-thumb{
    transform:translateX(20px)!important;
}

/* Nowy system kar */
.moderation-rules-explainer strong{
    color:#d2b5ff;
}
.moderation-warning-threshold-card{
    display:grid;
    grid-template-columns:minmax(0,1fr) 170px;
    align-items:center;
    gap:18px;
    margin-bottom:16px;
    padding:15px;
    border:1px solid rgba(154,88,255,.18);
    border-radius:13px;
    background:linear-gradient(
        145deg,
        rgba(154,88,255,.06),
        rgba(8,14,23,.6)
    );
}
.moderation-warning-threshold-card strong{
    display:block;
    color:#f0f3f8;
    font-size:10.5px;
}
.moderation-warning-threshold-card span{
    display:block;
    margin-top:5px;
    color:#77859a;
    font-size:8.8px;
    line-height:1.45;
}
.moderation-rules-editor{
    padding-top:16px;
    border-top:1px solid rgba(148,163,184,.1);
}
.moderation-rules-head h4{
    margin:5px 0 0;
    color:#f0f3f8;
    font-size:16px;
}
.moderation-rules-head p{
    max-width:860px;
    margin:6px 0 0;
    color:#77859a;
    font-size:9px!important;
    line-height:1.5;
}
.moderation-rule-add{
    display:grid;
    grid-template-columns:
        150px
        140px
        150px
        180px
        130px
        140px;
    gap:10px;
    margin-top:15px;
    padding:14px;
    border:1px solid rgba(148,163,184,.11);
    border-radius:13px;
    background:#090f19;
}
.moderation-rule-add label{
    min-width:0;
}
.moderation-rule-add label>span{
    display:block;
    min-height:22px;
    margin-bottom:5px;
    color:#8f9bae;
    font-size:8.3px;
}
.moderation-rule-add input{
    width:100%;
}
.moderation-rule-note{
    grid-column:1/5;
}
.moderation-rule-add-button{
    grid-column:5/7;
    align-self:end;
    justify-content:center;
    min-height:42px;
}
.moderation-duration-field[style*="display: none"]{
    display:none!important;
}
.moderation-rule-list{
    display:grid;
    gap:8px;
    margin-top:14px;
}
.moderation-rule-card{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:14px;
    padding:12px 13px;
    border:1px solid rgba(148,163,184,.11);
    border-radius:12px;
    background:linear-gradient(145deg,#0e1421,#090f19);
}
.moderation-rule-sequence{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
}
.moderation-rule-sequence>strong{
    display:grid;
    width:32px;
    height:32px;
    place-items:center;
    border-radius:9px;
    color:#c8a6ff;
    background:rgba(154,88,255,.1);
    font-size:14px;
}
.moderation-rule-sequence>span{
    color:#a0acbd;
    font-size:9.5px;
}
.moderation-rule-sequence>svg{
    width:14px;
    color:#536177;
}
.moderation-rule-action{
    display:inline-flex;
    min-height:26px;
    align-items:center;
    padding:0 9px;
    border-radius:8px;
    font-size:9px;
}
.moderation-rule-action.purple{
    color:#c8a6ff;
    background:rgba(154,88,255,.08);
}
.moderation-rule-action.warn{
    color:#f0ca70;
    background:rgba(240,202,112,.07);
}
.moderation-rule-action.danger{
    color:#ff8199;
    background:rgba(255,91,123,.07);
}
.moderation-rule-meta{
    display:flex;
    flex-wrap:wrap;
    gap:5px 14px;
    margin-top:6px;
    color:#718096;
    font-size:8.3px;
}
.moderation-rule-actions{
    display:flex;
    align-items:center;
    gap:9px;
}
.moderation-rule-switch{
    margin-right:4px!important;
}

@media(max-width:1400px){
    .moderation-rule-add{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
    .moderation-rule-note{
        grid-column:1/3;
    }
    .moderation-rule-add-button{
        grid-column:3;
    }
}
@media(max-width:850px){
    .moderation-warning-threshold-card{
        grid-template-columns:1fr;
    }
    .moderation-rule-add{
        grid-template-columns:1fr;
    }
    .moderation-rule-note,
    .moderation-rule-add-button{
        grid-column:1;
    }
    .moderation-rule-card{
        grid-template-columns:1fr;
    }
}


/* ============================================================
   PELNOMOCNIK.TV — V8.3.1 UI POLISH
   ============================================================ */

/* Switch fix: poprzednia reguła obejmowała również track i thumb */
.settings-switch-row>div>span{
    display:block!important;
    margin-top:4px!important;
    color:#75839a!important;
    font-size:8.8px!important;
    line-height:1.45!important;
}
.settings-switch-row .portal-switch,
.settings-switch-row .portal-switch-track,
.settings-switch-row .portal-switch-thumb{
    margin:0!important;
}
.settings-switch-row{
    grid-template-columns:minmax(0,1fr) 72px!important;
    min-height:68px!important;
    padding:13px 16px!important;
}
.settings-switch-row>.portal-switch{
    display:block!important;
    position:relative!important;
    width:44px!important;
    height:24px!important;
    justify-self:center!important;
    align-self:center!important;
}
.settings-switch-row>.portal-switch>.portal-switch-track{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    width:44px!important;
    height:24px!important;
    padding:0!important;
}
.settings-switch-row>.portal-switch>.portal-switch-track>.portal-switch-thumb{
    position:absolute!important;
    top:2px!important;
    left:2px!important;
    display:block!important;
    width:18px!important;
    height:18px!important;
    padding:0!important;
}

/* Prostszy system kar */
.moderation-simple-intro{
    margin-bottom:12px;
    padding:13px 14px;
    border:1px solid rgba(148,163,184,.11);
    border-radius:12px;
    background:rgba(8,14,23,.45);
}
.moderation-simple-intro strong{
    display:block;
    color:#eff3f8;
    font-size:10.5px;
}
.moderation-simple-intro span{
    display:block;
    margin-top:4px;
    color:#7d8a9f;
    font-size:9px;
    line-height:1.5;
}
.moderation-sensitivity-card{
    display:grid;
    grid-template-columns:minmax(0,1fr) 160px;
    align-items:center;
    gap:18px;
    margin-bottom:20px;
    padding:14px;
    border:1px solid rgba(154,88,255,.18);
    border-radius:13px;
    background:linear-gradient(145deg,rgba(154,88,255,.055),rgba(8,14,23,.54));
}
.moderation-sensitivity-card strong{
    display:block;
    color:#f0f3f8;
    font-size:10.5px;
}
.moderation-sensitivity-card span{
    display:block;
    margin-top:4px;
    color:#7a879b;
    font-size:8.8px;
    line-height:1.45;
}
.moderation-rule-add-v831{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:10px!important;
    padding:14px!important;
}
.moderation-control-card{
    display:flex!important;
    flex-direction:column!important;
    min-width:0!important;
    padding:12px!important;
    border:1px solid rgba(148,163,184,.1)!important;
    border-radius:11px!important;
    background:#0b111c!important;
}
.moderation-control-card>span{
    display:block!important;
    margin-bottom:7px!important;
    color:#9aa7b8!important;
    font-size:8.7px!important;
    font-weight:700!important;
}
.moderation-control-card>small{
    display:block!important;
    margin-top:7px!important;
    color:#657389!important;
    font-size:7.9px!important;
}
.moderation-inline-fields{
    display:grid!important;
    grid-template-columns:90px minmax(0,1fr)!important;
    gap:8px!important;
    align-items:center!important;
}
.moderation-timeout-card{
    transition:.18s;
}
.moderation-timeout-card.is-disabled{
    opacity:.45;
}
.moderation-timeout-card.is-disabled:after{
    content:'Wybierz „Timeout”, aby ustawić czas kary.';
    display:block;
    margin-top:7px;
    color:#69768a;
    font-size:7.8px;
}
.moderation-timeout-card.is-disabled>small{
    display:none!important;
}
.moderation-rule-note{
    grid-column:1/3!important;
}
.moderation-rule-add-button{
    grid-column:3!important;
    min-height:45px!important;
    align-self:end!important;
    justify-content:center!important;
}
.moderation-rule-card{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:18px!important;
    padding:13px 14px!important;
}
.moderation-rule-main{
    min-width:0;
}
.moderation-rule-sequence{
    gap:7px!important;
}
.moderation-rule-sequence>strong{
    width:30px!important;
    height:30px!important;
}
.moderation-rule-meta{
    margin-top:7px!important;
}
.moderation-rule-actions{
    min-width:120px;
    justify-content:flex-end;
}
.moderation-rule-switch{
    display:inline-block!important;
    width:43px!important;
    height:23px!important;
    flex:0 0 43px!important;
}

@media(max-width:1000px){
    .moderation-rule-add-v831{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .moderation-rule-note,
    .moderation-rule-add-button{
        grid-column:auto!important;
    }
}
@media(max-width:700px){
    .moderation-rule-add-v831{
        grid-template-columns:1fr!important;
    }
    .moderation-sensitivity-card{
        grid-template-columns:1fr!important;
    }
}