@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;
    }

}