@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{
  --bg:#07080d;
  --panel:#0d1017;
  --panel-soft:#10141d;
  --line:#1f2430;
  --text:#f5f7fb;
  --muted:#97a0b2;
  --purple:#a960ff;
  --purple-soft:rgba(169,96,255,.34);
  --green:#34e27c;
  --green-soft:rgba(52,226,124,.28);
}
*{box-sizing:border-box}
/* The author stylesheet must not override the native hidden attribute.
   This also keeps the login form, the admin view and other optional panels hidden. */
[hidden]{display:none!important}
html,body{margin:0;background:radial-gradient(circle at top, #12172b 0%, #090b11 24%, #07080d 58%);color:var(--text);font-family:Inter,system-ui,Arial,sans-serif}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.shell{min-height:100vh}
.topbar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:18px;padding:18px 28px;border-bottom:1px solid rgba(255,255,255,.06);position:sticky;top:0;background:rgba(7,8,13,.88);backdrop-filter:blur(12px);z-index:10}
.brand{display:inline-flex;align-items:center;gap:10px;min-width:0;max-width:100%;white-space:nowrap;justify-self:start}
/* Transparent white pixel-art assets from the supplied BADDGES references.
   Fixed box dimensions prevent original-size images from expanding the header. */
.brand .brand-emblem{display:block;flex:none;object-fit:contain;width:35px;height:35px;max-width:35px;max-height:35px}
.brand .brand-wordmark{display:block;flex:none;object-fit:contain;object-position:left center;width:153px;height:28px;max-width:153px;max-height:28px}
.header-nav{display:flex;align-items:center;justify-content:center;gap:10px;justify-self:center;white-space:nowrap}
.nav-link{display:flex;align-items:center;gap:9px;padding:10px 14px;border-radius:999px;border:1px solid #2a2f3d;background:#0f131c;color:#bdc4d4;font-size:13px;font-weight:700;transition:.18s}
.nav-link .nav-icon,.header-tool .nav-icon,.language-control span{display:grid;place-items:center}
.nav-link .nav-icon svg,.header-tool .nav-icon svg,.language-control svg{width:18px;height:18px}
.nav-count{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 8px;background:#161c27;border:1px solid #2a3140;border-radius:999px;font-size:11px;color:#e7eaf2}
.nav-link.active{background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));color:#fff;transform:translateY(-1px)}

.nav-link[data-page="twitch"].active{border-color:var(--purple-soft);box-shadow:0 0 0 1px rgba(169,96,255,.17),0 14px 28px rgba(169,96,255,.12)}
.nav-link[data-page="kick"].active{border-color:var(--green-soft);box-shadow:0 0 0 1px rgba(52,226,124,.14),0 14px 28px rgba(52,226,124,.08)}
.top-actions{display:flex;align-items:center;justify-self:end;gap:10px}
.status-indicator{display:flex;align-items:center;gap:10px;color:#c2c7d3;font-size:12px;margin-right:4px}
.status-light{width:8px;height:8px;border-radius:50%;background:#4cf38d;box-shadow:0 0 10px rgba(76,243,141,.7)}
.status-copy{display:flex;flex-direction:column;line-height:1.2}
.last-sync{font-size:10px;color:#8790a5}
.header-tool{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;border:1px solid #2a2f3d;background:#0f131c;color:#e8eaf0;font-size:12px;font-weight:700}
.header-tool:hover,.language-control:hover{border-color:#434a5c;background:#131928}
.nav-link:hover{background:#131928}
.header-admin{padding-right:16px}
/* Polished custom language menu, no native white dropdown. */
.language-control{position:relative;display:flex;align-items:center;min-width:0}
.language-trigger{display:flex;align-items:center;gap:9px;border:1px solid #303746;background:#111720;color:#eff2f9;border-radius:999px;padding:10px 12px;min-height:42px;font-size:12px;font-weight:700}
.language-trigger:hover,.language-trigger[aria-expanded="true"]{background:#1a2130;border-color:#7c64b5}
.language-trigger .lang-chevron{transition:transform .15s;color:#8a92a5}
.language-trigger[aria-expanded="true"] .lang-chevron{transform:rotate(180deg)}
.language-menu{position:absolute;right:0;top:calc(100% + 9px);z-index:30;width:224px;border:1px solid #34394a;border-radius:14px;background:#151924;box-shadow:0 24px 60px #000b;padding:6px}
.language-menu button{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;border-radius:9px;color:#cbd2e1;padding:10px 8px;text-align:left;font-size:12px}
.language-menu button:hover,.language-menu button.is-selected{background:#29243c;color:#fff}
.language-short{display:inline-grid;place-items:center;width:30px;height:26px;border-radius:7px;background:#232a37;font-size:10px;font-weight:800;color:#c1afee}
.language-check{margin-left:auto;color:#bc8cff;visibility:hidden;font-weight:800}
.language-menu button.is-selected .language-check{visibility:visible}
.language-control #language[hidden]{display:none!important}
.main-content{max-width:1200px;margin:0 auto;padding:52px 28px 70px}
.hero-head{text-align:center;margin:8px auto 34px}
.hero-tag{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #282d39;border-radius:999px;background:#0c1018;color:#bec6d8;font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.hero-tag-dot{width:8px;height:8px;border-radius:50%;background:var(--purple);box-shadow:0 0 0 5px rgba(169,96,255,.14)}
#page-heading{margin:18px 0 10px;font-size:56px;line-height:1.02;letter-spacing:-.04em}
.hero-subtitle{margin:0 auto;max-width:720px;color:var(--muted);font-size:16px;line-height:1.65}
.source-alert{margin:0 auto 28px;max-width:760px;background:#151a21;border:1px solid #2d3340;color:#ced3de;border-radius:14px;padding:14px 16px}
.section{margin-top:10px}
.section-header-stack{text-align:center;justify-content:center}
.section-header h2{margin:0;font-size:43px;line-height:1.08;letter-spacing:-.035em}
.section-description{margin:12px auto 0;max-width:660px;color:var(--muted);font-size:15px;line-height:1.6}
.controls-bar{display:flex;justify-content:center;align-items:center;margin:28px 0 26px}
.segmented{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center}
.segmented button{border:1px solid #2a2f3c;background:transparent;color:#ecf0f9;border-radius:999px;padding:12px 22px;font-size:18px;min-width:120px}
.segmented button.selected{border-color:transparent;font-weight:800}
#cost-tabs[data-scope="twitch"] button.selected{background:linear-gradient(180deg,#aa61ff,#8a48f7);box-shadow:0 14px 34px rgba(138,72,247,.35);color:#fff}
#cost-tabs[data-scope="kick"] button.selected{background:linear-gradient(180deg,#34f080,#18c95f);box-shadow:0 14px 34px rgba(52,226,124,.28);color:#06150d}
#cost-tabs[data-scope="all"] button.selected{background:linear-gradient(90deg,#aa61ff,#34e27c);box-shadow:0 14px 34px rgba(138,72,247,.22),0 14px 34px rgba(52,226,124,.12);color:#fff}
.search-wrap{display:none}
.badge-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px}
.badge-card{background:linear-gradient(180deg,#0d1016,#0b0d12);border:1px solid #272c38;border-radius:18px;padding:14px 14px 16px;min-height:290px;position:relative;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 18px 36px rgba(0,0,0,.22);transition:transform .18s,border-color .18s,box-shadow .18s}
.badge-card:hover{transform:translateY(-3px)}
.badge-card.twitch{border-color:rgba(169,96,255,.45);box-shadow:0 20px 42px rgba(0,0,0,.26),0 0 0 1px rgba(169,96,255,.12) inset}
.badge-card.kick{border-color:rgba(52,226,124,.35);box-shadow:0 20px 42px rgba(0,0,0,.26),0 0 0 1px rgba(52,226,124,.1) inset}
.card-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;gap:8px 10px;margin-bottom:8px}
.card-top-left{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;gap:10px;min-width:0}
.live-badge{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;column-gap:8px;color:#eef2fb;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;min-width:0;padding-left:2px}
.live-badge span:last-child{display:block;min-width:0;line-height:1.08;word-break:break-word}
.live-dot{width:8px;height:8px;border-radius:50%;background:#40ea84;box-shadow:0 0 12px rgba(64,234,132,.9);animation:pulse 1.4s infinite;flex:none;margin-top:3px}
@keyframes pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.42;transform:scale(.8)}100%{opacity:1;transform:scale(1)}}
.live-logo{width:20px;height:20px;border-radius:6px;object-fit:cover}
.platform-badge{padding:7px 10px;border-radius:999px;font-size:11px;font-weight:800;text-transform:uppercase}
.platform-badge.twitch{background:rgba(169,96,255,.14);color:#e6d8ff;border:1px solid rgba(169,96,255,.22)}
.platform-badge.kick{background:rgba(52,226,124,.12);color:#c9f8da;border:1px solid rgba(52,226,124,.18)}
.kick-mark{object-fit:contain;width:22px;height:22px;image-rendering:auto}
.all-mix-icon{filter:drop-shadow(0 0 6px rgba(169,96,255,.12)) drop-shadow(0 0 6px rgba(52,226,124,.10))}

.card-media{display:grid;place-items:center;min-height:98px;margin-top:8px}
.badge-image{width:84px;height:84px;object-fit:contain;border-radius:16px}
.badge-name{margin-top:8px;font-size:28px;line-height:1.12;font-weight:800;letter-spacing:-.03em;text-align:center;min-height:62px;display:grid;place-items:center}
.badge-expire-label{margin-top:14px;color:#37f197;font-size:16px;font-weight:700}
.badge-expire{margin-top:4px;color:#fff;font-size:16px;line-height:1.42;min-height:70px}
.progress-track{margin-top:auto;height:5px;border-radius:999px;background:#242831;overflow:hidden;direction:ltr}
.progress-bar{display:block;height:100%;border-radius:999px;background:#31eb99;transition:width 0.4s linear,background-color 0.4s linear}
.progress-bar.warning{background:#f7b54b}
.progress-bar.danger{background:#fb535d}
.progress-track.no-timeline{background:repeating-linear-gradient(90deg,#242831,#242831 10px,#2a3039 10px,#2a3039 15px)}
.progress-note{color:#70798e;font-size:10px;margin-top:7px;min-height:12px}
.badge-card.upcoming .live-dot{background:#ffcb61;box-shadow:0 0 8px #ffcb6150;animation:none}
.badge-card.upcoming .live-badge{color:#ffd28b}
.badge-card.upcoming .badge-expire-label{color:#f6c76c}
.badge-card.upcoming .progress-bar{background:#ffbc5b}
.upcoming-section{margin-top:72px}
.upcoming-section .section-header h2{font-size:35px}
.section-kicker{display:block;color:#aabbcb;font-size:11px;font-weight:800;letter-spacing:.15em;margin-bottom:12px}
.upcoming-total{display:inline-block;margin-top:10px;color:#acb5c5;font-size:12px}
.upcoming-section .badge-grid{margin-top:24px}
.badge-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.badge-actions a,.badge-actions button{background:#161c26;border:1px solid #2c3442;color:#e7ebf5;border-radius:10px;padding:7px 10px;font-size:11px;font-weight:700}
.action-danger{color:#ffcccc;border-color:#61393b;background:#241516}
.empty{grid-column:1/-1;border:1px dashed #303644;border-radius:18px;min-height:180px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;text-align:center;color:#8c95a7;padding:24px;background:#0b0d12}
.empty-symbol{display:grid;place-items:center;width:36px;height:36px;border:1px solid #464e5e;border-radius:50%;font-size:19px;color:#bcc4d4}
.show-more{display:block;margin:24px auto 0;border:1px solid #2a2f3d;border-radius:999px;background:#0f131c;color:#fff;font-weight:700;font-size:13px;padding:12px 22px}

.controls-bar{flex-wrap:wrap;gap:16px}
.view-tabs button{min-width:110px;font-size:15px;padding:10px 18px}
#view-tabs button.selected{background:#151b26;color:#fff;border-color:#454e63;box-shadow:none}
#view-tabs button[data-view="schedule"].selected{background:linear-gradient(90deg,#aa61ff,#34e27c);border-color:transparent;box-shadow:0 14px 34px rgba(138,72,247,.22),0 14px 34px rgba(52,226,124,.12)}
.timeline-section{margin-top:34px}
.timeline-shell{margin-top:18px}
.timeline-board-wrap{overflow:auto;border:1px solid #262d39;border-radius:20px;background:linear-gradient(180deg,#0e1117,#0a0d12);padding:18px}
.timeline-board{position:relative;min-height:240px}
.timeline-days{display:grid;grid-auto-flow:column;grid-auto-columns:160px;position:sticky;top:0;z-index:2;margin-left:280px}
.timeline-day{height:50px;padding:0 10px;color:#c8d0df;font-size:12px;font-weight:700;text-transform:uppercase;display:flex;align-items:flex-end;border-left:1px solid rgba(255,255,255,.06)}
.timeline-now{position:absolute;top:44px;bottom:0;width:2px;background:#ff4d57;box-shadow:0 0 0 1px rgba(255,77,87,.2),0 0 18px rgba(255,77,87,.45);z-index:1}
.timeline-rows{display:flex;flex-direction:column;gap:12px;margin-top:10px}
.timeline-row{display:grid;grid-template-columns:260px 1fr;gap:20px;align-items:center;background:transparent;border:0;color:#fff;padding:0;text-align:left}
.timeline-label{display:flex;align-items:center;gap:12px;min-width:0}
.timeline-mini{width:38px;height:38px;object-fit:contain;border-radius:10px;background:#111722;border:1px solid #2a3240;flex:none}
.timeline-label-copy{display:flex;flex-direction:column;min-width:0}
.timeline-label-copy strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.timeline-label-copy small{font-size:11px;color:#97a0b2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.timeline-lane{position:relative;display:block;height:42px;border-radius:12px;background:repeating-linear-gradient(90deg,#141923,#141923 159px,#202532 159px,#202532 160px)}
.timeline-lane::after{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.05);border-radius:12px;pointer-events:none}
.timeline-bar{position:absolute;top:6px;height:30px;border-radius:10px;display:flex;align-items:center;padding:0 12px;font-size:12px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:1px solid transparent;box-shadow:0 10px 24px rgba(0,0,0,.25)}
.timeline-bar-name{overflow:hidden;text-overflow:ellipsis}
.timeline-bar.twitch{background:linear-gradient(90deg,#9957f4,#b46dff);border-color:rgba(187,129,255,.35);color:#fff}
.timeline-bar.kick{background:linear-gradient(90deg,#1ecf65,#49ef8c);border-color:rgba(73,239,140,.35);color:#07140c}
.timeline-bar.all{background:linear-gradient(90deg,#9957f4,#49ef8c);border-color:rgba(255,255,255,.18);color:#fff}
.timeline-bar.estimated{background:#6f7687!important;border-style:dashed;color:#fff}
.timeline-row:hover .timeline-bar{transform:translateY(-1px)}
@media (max-width:860px){.timeline-day{grid-auto-columns:120px}.timeline-row{grid-template-columns:1fr;gap:10px}.timeline-days{margin-left:0}.timeline-now{top:94px}.timeline-label-copy strong{font-size:13px}.timeline-lane{height:38px}.timeline-bar{height:28px;top:5px}}
.footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(255,255,255,.06);color:#7d8597;font-size:12px;gap:12px;padding:26px 0 0;margin-top:42px}

.chat-panel,#metrics,#archive-section{display:none!important}
.icon-button{border:0;color:#8e95a5;background:transparent;padding:4px;border-radius:6px;font-size:20px;line-height:1}
.icon-button:hover{color:white;background:#242b36}

.modal-backdrop{position:fixed;inset:0;background:#05060ab8;z-index:20;display:flex;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(3px)}
.modal{width:min(640px,100%);max-height:92vh;overflow:auto;border:1px solid #343a49;border-radius:16px;background:#151922;box-shadow:0 25px 110px rgba(0,0,0,.6);padding:23px}
.modal-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:17px}
.eyebrow{font-size:10px;letter-spacing:.18em;color:#99a2b6;text-transform:uppercase;margin-bottom:6px}
.modal h2{font-size:22px;margin:0}
.modal-intro{color:#9ca4b2;font-size:12px;line-height:1.6;margin:0 0 18px}
.form-label,.form-block>span,.form-row label>span{font-size:10px;color:#bec3d0;font-weight:800;margin-bottom:7px;display:block}
.form-input,.form-block input,.form-row input,.form-block textarea,.form-row select{display:block;width:100%;border:1px solid #343c49;border-radius:8px;padding:10px;background:#0f141d;color:#e6e9f1;font-size:12px;outline:0;min-height:37px}
.form-input:focus,.form-block input:focus,.form-row input:focus,.form-block textarea:focus,.form-row select:focus{border-color:#8872bd}
.primary-button{background:#ad97ef;border:0;color:#191127;font-size:11px;font-weight:800;padding:11px 14px;border-radius:8px}
.primary-button:hover{background:#c3b2fd}.full{width:100%;margin-top:15px}
.form-row{display:grid;grid-template-columns:1fr 1.4fr;gap:12px;margin-bottom:12px}
.form-row label{min-width:0}.form-block{display:block;margin-bottom:12px}.form-block textarea{resize:vertical}
.form-buttons{display:flex;justify-content:flex-end;gap:9px;padding-top:3px}
.admin-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:17px;padding-bottom:15px;border-bottom:1px solid #313745}.admin-actions .quiet-button{padding:8px 10px}
.admin-hint{color:#6f7989;font-size:10px;margin-top:15px;border-top:1px solid #313745;padding-top:13px}.modal-message{font-size:11px;color:#b5e9c7;margin-top:12px;min-height:15px}.modal-message.error{color:#f1a8aa}
#admin-import-section{padding:14px;background:#121721;border:1px solid #303846;border-radius:10px;margin:0 0 14px}
.quiet-button{background:none;border:1px solid #323844;color:#c2c8d7;border-radius:8px;font-size:11px;font-weight:700;padding:9px 12px}
.quiet-button:hover{background:#242935}.small-primary{padding:9px 12px;border:0;border-radius:7px;background:#a891ed;color:#151021;font-size:11px;font-weight:800}.small-primary:hover{background:#c7b7ff}
.translation-language-row{padding:12px 0;border-top:1px solid #2a3140}.translation-language-row strong{display:block;font-size:11px;margin-bottom:10px}.translation-inputs{display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr))}
.source-details{margin-bottom:14px}.source-details summary{cursor:pointer;color:#d6dcec;font-weight:700;font-size:12px;margin-bottom:12px}.source-entry{padding:10px 12px;border-radius:10px;background:#10151d;border:1px solid #2a3140;margin-top:8px;font-size:11px;color:#c4cad7;display:flex;flex-direction:column;gap:5px}.source-good{color:#9ff0b4}.source-bad{color:#ffc1c7}
.toast{position:fixed;z-index:30;bottom:22px;right:22px;max-width:380px;padding:13px 17px;background:#28253b;border:1px solid #5c5178;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.4);color:#f7efff;font-size:12px;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .18s,transform .18s}.toast.show{opacity:1;transform:translateY(0)}

@media (max-width:1480px){
  .topbar{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'brand actions' 'nav nav';row-gap:12px}
  .brand{grid-area:brand}.top-actions{grid-area:actions}.header-nav{grid-area:nav;justify-self:center}
}
@media (max-width:1180px){
  .badge-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .status-indicator{display:none}
}
@media (max-width:860px){
  .topbar{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'brand actions' 'nav nav';padding:16px 18px}
    .header-admin span:not(.nav-icon){display:none}.header-admin{padding-right:10px}
  .main-content{padding:34px 18px 58px}
  #page-heading{font-size:42px}
  .section-header h2{font-size:36px}
  .segmented button{font-size:15px;min-width:104px;padding:11px 16px}
  .badge-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .badge-name{font-size:24px}
}
@media (max-width:560px){
  .brand-words strong{font-size:20px}.brand-words small{font-size:8px}
  .brand-icon{width:36px;height:36px}
  .topbar{gap:10px}
  .header-nav{width:100%;gap:6px;justify-content:center}.nav-link{flex:1;min-width:0;justify-content:center;padding:9px 6px;font-size:11px;gap:5px}.nav-count{min-width:18px;padding:0 4px}.nav-platform-icon{width:16px;height:16px}
  .top-actions{gap:8px}.header-tool{padding:9px 11px}.language-trigger{padding:9px 10px}.language-trigger #language-current{display:none}
  #page-heading{font-size:34px}.hero-subtitle{font-size:14px}
  .section-header h2{font-size:28px}.section-description{font-size:14px}
  .badge-grid{grid-template-columns:1fr}
  .badge-card{min-height:0}.badge-name{font-size:24px;min-height:0}.badge-expire{font-size:15px;min-height:0}
  .footer{display:block;text-align:center}
  .form-row,.translation-inputs{grid-template-columns:1fr}
}

@media(max-width:650px){
  .badge-grid{grid-template-columns:1fr}
}

.nav-kick-logo{width:19px;height:19px;display:block}
@media (prefers-reduced-motion: reduce){.live-dot{animation:none}.progress-bar{transition:none}}

/* Compact image-only Global gallery. No status labels, links or progress. */
.global-mode .controls-bar{margin-bottom:16px}
.global-mode .section-header h2{font-size:38px}
.global-intro{font-size:13px;line-height:1.6;color:var(--muted);text-align:center;margin:0 auto 26px;max-width:640px}
.global-mode .badge-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.global-card{min-width:0;min-height:170px;border:1px solid #2b3040;background:#10121a;border-radius:14px;padding:17px 12px 15px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;transition:transform .15s,border-color .15s}
.global-card:hover{transform:translateY(-2px)}
.global-card.twitch{border-color:rgba(169,96,255,.39)}
.global-card.kick{border-color:rgba(52,226,124,.38)}
.global-card-image{width:82px;height:82px;object-fit:contain}
.global-card-name{margin:0;text-align:center;color:#eff1f7;font-size:13px;font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.gallery-admin-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;margin-top:2px}
.gallery-admin-actions button{font-size:10px;border:1px solid #373c4a;border-radius:7px;color:#dce3f0;background:#1b2230;padding:6px 8px}
.catalog-admin-hint{font-size:11px;line-height:1.5;color:#a5b2cc;margin:0 0 14px;border-left:2px solid #a960ff;padding-left:10px}
@media(max-width:1180px){.global-mode .badge-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:860px){.global-mode .badge-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}}
@media(max-width:560px){.global-mode .badge-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.global-card{min-height:148px;padding:15px 9px}.global-card-image{width:69px;height:69px}.global-card-name{font-size:12px}}

/* v1.8: Clear cost status in mixed platform views. */
.card-top{justify-content:normal;align-items:flex-start;gap:8px}
.card-top-left{flex-wrap:nowrap;min-width:0}
.live-logo,.kick-mark{flex:none;align-self:start;margin-top:1px}
.cost-flag{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;align-self:start;min-height:24px;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:800;letter-spacing:.045em;border:1px solid transparent;white-space:nowrap;max-width:100%}
.cost-flag.free{color:#71f5a6;background:#0f2c20;border-color:#236a46}
.cost-flag.paid{color:#e4cbff;background:#2b193e;border-color:#694397}
.cost-flag.unknown{color:#b8c1d0;background:#1a2029;border-color:#384354;font-size:9px}
/* The time at the bottom uses the exact same phase as the elapsed progress. */
.progress-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;margin-bottom:9px;font-weight:800;font-size:12px;line-height:1.25;color:#31eb99;min-height:16px}
.progress-summary.warning{color:#f7b54b}
.progress-summary.danger{color:#fb535d}
.progress-percentage{font-variant-numeric:tabular-nums;font-size:11px;font-weight:800;opacity:.96}
.progress-track{margin-top:0;flex-shrink:0}
.badge-expire{min-height:52px}
.badge-card.upcoming .progress-track{margin-top:auto}
@media(max-width:560px){.card-top{grid-template-columns:minmax(0,1fr)}.card-top-left{gap:8px}.cost-flag{justify-self:start;padding:4px 6px;font-size:9px}.cost-flag.unknown{font-size:8px}}


/* Navigation icons: the artwork is a small glyph, never a full-size reference image. */
.header-nav .nav-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 20px;
  width:20px;
  height:20px;
  max-width:20px;
  max-height:20px;
  overflow:hidden;
  line-height:0;
}
.header-nav .nav-platform-icon,
.header-nav .nav-icon > img{
  display:block;
  width:20px !important;
  height:20px !important;
  max-width:100%;
  max-height:100%;
  min-width:0;
  min-height:0;
  flex:0 0 auto;
  object-fit:contain;
}
.header-nav .nav-link{min-width:0;transition:color .18s ease,border-color .18s ease,background-color .18s ease,box-shadow .18s ease}
.header-nav .nav-link[data-page="twitch"]:is(:hover,:focus-visible,.active){color:#c991ff;border-color:#a960ff;box-shadow:0 0 0 1px rgba(169,96,255,.18),0 8px 20px rgba(169,96,255,.12)}
.header-nav .nav-link[data-page="kick"]:is(:hover,:focus-visible,.active){color:#57f77f;border-color:#45ec78;box-shadow:0 0 0 1px rgba(52,226,124,.17),0 8px 20px rgba(52,226,124,.1)}
.header-nav .nav-link[data-page="all"]:is(:hover,:focus-visible,.active){color:#f1e9ff;border-color:#a983e4;background:linear-gradient(100deg,rgba(169,96,255,.12),rgba(52,226,124,.1));box-shadow:0 0 0 1px rgba(169,96,255,.14),0 8px 20px rgba(52,226,124,.07)}
.header-nav .nav-link[data-page="twitch"]:is(:hover,:focus-visible,.active) .nav-count{color:#e9d5ff;border-color:rgba(169,96,255,.35)}
.header-nav .nav-link[data-page="kick"]:is(:hover,:focus-visible,.active) .nav-count{color:#aeffc3;border-color:rgba(52,226,124,.35)}
@media(max-width:650px){
  .header-nav .nav-icon{flex-basis:17px;width:17px;height:17px;max-width:17px;max-height:17px}
  .header-nav .nav-platform-icon,.header-nav .nav-icon > img{width:17px!important;height:17px!important}
}

/* Combined platform accent intentionally uses both platform colors. */
.header-nav .nav-link[data-page="all"]:is(:hover,:focus-visible,.active){
  border:1px solid transparent;
  background:linear-gradient(100deg,#191326,#12221d) padding-box,
             linear-gradient(110deg,#a960ff 0%,#9769d9 38%,#34e27c 100%) border-box;
}
.header-nav .nav-link[data-page="all"]:is(:hover,:focus-visible,.active) [data-i18n="allPlatforms"]{
  background:linear-gradient(90deg,#d5aaff,#94f4aa);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

@media (max-width:560px){
  .brand .brand-emblem{width:29px;height:29px;max-width:29px;max-height:29px}
  .brand .brand-wordmark{width:119px;height:22px;max-width:119px;max-height:22px}
  .brand{gap:7px}
}

/* Added/detected timestamp stays secondary to the expiration date and progress. */
.badge-added-date{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 7px;margin:2px 0 12px;color:#8e98aa;font-size:11px;line-height:1.5}
.badge-added-date span{color:#a9b4c7;font-weight:650}
.badge-added-date time{color:#d4dce9;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.badge-card.upcoming .badge-added-date{margin-bottom:15px}
@media(max-width:560px){.badge-added-date{font-size:11px;margin-bottom:12px}}

/* v2.5 — Clickable badge detail view, separate from the administrator studio. */
.badge-card[role="button"],.global-card[role="button"]{cursor:pointer;outline:none}
.badge-card[role="button"]:focus-visible,.global-card[role="button"]:focus-visible{outline:2px solid #be93ff;outline-offset:4px}
.badge-card[role="button"]:hover,.global-card[role="button"]:hover{transform:translateY(-3px);filter:brightness(1.08)}
.badge-card[role="button"] a,.badge-card[role="button"] button,.global-card[role="button"] button{position:relative;z-index:2}
#detail-modal{z-index:28;overflow:auto;align-items:center;justify-content:center;padding:22px}
.badge-detail-modal{position:relative;width:min(760px,100%);max-height:min(90vh,960px);overflow:auto;border:1px solid #33394b;border-radius:21px;background:#11151d;color:#edf0f7;box-shadow:0 32px 100px #000c;outline:none;scrollbar-color:#475065 transparent}
.detail-close{position:absolute;top:16px;right:16px;width:37px;height:37px;display:grid;place-items:center;border-radius:11px;border:1px solid #5055669a;background:#151923e6;color:#f5f7fb;font-size:25px;line-height:1;z-index:2}
.detail-close:is(:hover,:focus-visible){background:#303345;color:#fff}
.detail-hero{position:relative;padding:28px 50px 31px;text-align:center;border-bottom:1px solid #2a303c;background:radial-gradient(ellipse at 50% 5%,#221434 0%,#151720 52%,#11151d 100%)}
.detail-hero.kick{background:radial-gradient(ellipse at 50% 5%,#123221 0%,#141b1b 51%,#11151d 100%)}
.detail-header{display:flex;align-items:center;gap:8px;justify-content:center;margin:0 0 20px}
.detail-platform,.detail-status{font-size:10px;letter-spacing:.08em;font-weight:800;border-radius:999px;padding:6px 11px;border:1px solid #4a415f;color:#e3cbff;background:#2a1c3f}
.detail-hero.kick .detail-platform{border-color:#326e4a;background:#163f27;color:#bdfbcc}
.detail-status{background:#19232a;color:#b8d2dc;border-color:#3b4854}
.detail-status.active{color:#62f9a5;border-color:#28644c;background:#133222}
.detail-status.upcoming{color:#ffd48e;border-color:#685132;background:#392913}
.detail-status.ended{color:#b7c0d0}
.detail-badge-image{display:block;margin:0 auto 14px;width:112px;height:112px;max-width:40vw;object-fit:contain;border-radius:19px;image-rendering:auto;filter:drop-shadow(0 12px 18px #0005)}
.badge-detail-modal h2{font-size:clamp(24px,3vw,34px);font-weight:800;letter-spacing:-.035em;line-height:1.14;margin:0 0 15px;overflow-wrap:anywhere}
.detail-subline{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:10px;color:#c3cada;font-size:12px}
.detail-type{font-weight:800;padding:6px 10px;border-radius:999px;border:1px solid #435062;background:#1b222b}
.detail-type.free{color:#7ff6b3;border-color:#256a45;background:#153424}.detail-type.paid{color:#dec0ff;border-color:#633881;background:#30203b}
.detail-progress{max-width:440px;margin:22px auto 0;text-align:left}
.detail-progress-titles{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px;color:#ccf9da;font-size:12px;font-weight:800}
.detail-progress .progress-track{height:6px}
.detail-body{padding:27px 34px 30px;display:flex;flex-direction:column;gap:20px}
.detail-category-wrap{padding:0 0 18px;border-bottom:1px solid #292f3b}
.detail-mini-heading,.detail-fact>span{display:block;color:#8894aa;font-size:11px;font-weight:650;margin-bottom:6px}
.detail-category{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:750}
.detail-category img{width:55px;height:68px;object-fit:cover;border-radius:9px;border:1px solid #343e50}
.detail-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 24px;padding:0 0 20px;border-bottom:1px solid #292f3b}
.detail-fact{min-width:0}
.detail-fact>strong{font-size:13px;line-height:1.5;font-weight:700;display:block;color:#f1f2f5;white-space:normal;overflow-wrap:anywhere}
.detail-text-section h3{font-size:13px;margin:0 0 9px;color:#eaf0fb}
.detail-text-section p{font-size:13px;line-height:1.75;margin:0;color:#b9c2d0;white-space:pre-wrap;overflow-wrap:anywhere}
.detail-no-data{color:#939bad;font-size:13px;margin:0}
.detail-actions{display:flex;gap:10px;flex-wrap:wrap;border-top:1px solid #292f3b;padding-top:20px}
.detail-actions:empty{display:none}
.detail-action{display:inline-flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid #42465a;padding:12px 16px;font-size:12px;font-weight:800;text-decoration:none}
.detail-action.primary{background:#9b57ed;border-color:#af79f5;color:#fff}.detail-action.primary:hover{background:#b47bfa}
.detail-action.secondary{background:#212636;color:#f4e9ff}.detail-action.secondary:hover{background:#31384d}
.detail-admin-fields{margin-bottom:14px;padding:12px;background:#111722;border:1px solid #303849;border-radius:10px}
.detail-admin-fields summary{cursor:pointer;color:#e7ebf6;font-size:12px;font-weight:800;margin-bottom:8px}
.detail-admin-fields .modal-intro{margin:8px 0 12px}
@media(max-width:590px){
  #detail-modal{padding:10px}
  .badge-detail-modal{max-height:94vh;border-radius:16px}
  .detail-hero{padding:27px 22px 22px}
  .detail-badge-image{width:88px;height:88px}
  .detail-body{padding:23px 19px 24px;gap:18px}
  .detail-facts{grid-template-columns:1fr 1fr;gap:16px}
  .detail-close{top:10px;right:10px;width:34px;height:34px}
  .detail-actions{flex-direction:column}
}

/* v2.6 — compact clickable category and channel-restricted campaign details */
.badge-category-link{display:flex;align-items:center;gap:7px;margin:10px 0 12px;padding:7px 9px;min-height:36px;border:1px solid #293242;border-radius:9px;background:#10141d;color:#b9c5d8;text-decoration:none;font-size:10px;max-width:100%;overflow:hidden}
.badge-category-link:hover,.badge-category-link:focus-visible{border-color:#a36cf3;color:#f6eaff;outline:none}
.badge-card.kick .badge-category-link:hover,.badge-card.kick .badge-category-link:focus-visible{border-color:#39df83;color:#d5ffeb}
.badge-category-link img{width:25px;height:29px;object-fit:cover;border-radius:5px;flex-shrink:0}
.badge-category-link>span:nth-last-child(2){flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.detail-category-link{display:inline-flex;max-width:100%;width:max-content;border:1px solid #32394b;border-radius:11px;padding:8px 12px;text-decoration:none;color:#ecf0fa;transition:border-color .15s,background-color .15s}
.detail-category-link:hover,.detail-category-link:focus-visible{border-color:#a36cf3;background:#1c2031;outline:none}
.detail-channel-list{border:1px solid #343c4b;border-radius:13px;background:#101722;overflow:hidden}
.detail-channel-list summary{cursor:pointer;padding:15px 17px;color:#ecf5ff;font-weight:750;font-size:13px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.detail-channel-list[open] summary{border-bottom:1px solid #303a4b}
.detail-channel-grid{padding:13px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:240px;overflow:auto}
.detail-channel-grid a,.detail-channel-grid>span{min-width:0;overflow-wrap:anywhere;padding:10px 12px;border-radius:9px;border:1px solid #313a4b;color:#c7d5ea;font-size:12px;text-decoration:none;background:#161f2d}
.detail-channel-grid a:hover{border-color:#b27be9;color:#fff}
.detail-translation-notice{font-size:11px;color:#a8a6bf;margin:0}
.detail-check{display:flex!important;align-items:center;gap:10px}
.detail-check input{width:16px;height:16px;accent-color:#9d59e8}
.translation-inputs{grid-template-columns:repeat(2,minmax(0,1fr))}
.translation-inputs textarea{display:block;resize:vertical;min-height:66px;width:100%;background:#0f141d;color:#e6e9f1;border:1px solid #343c49;border-radius:8px;padding:10px;font-size:12px}
@media(max-width:590px){.detail-channel-grid,.translation-inputs{grid-template-columns:1fr}}

/* v2.7 Footer/legal links and social icon bar */
.footer{display:block;text-align:center;margin-top:60px;padding:24px 0 32px}
.footer-main{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;column-gap:18px;row-gap:14px;width:100%}
.footer-copyright{justify-self:start;color:#a4acbd;font-size:12px;font-weight:800;letter-spacing:.08em;white-space:nowrap}
.footer-legal{display:flex;gap:21px;align-items:center;justify-content:center;justify-self:center;flex-wrap:wrap;text-align:center}
.footer-legal a{font-size:12px;color:#a4acbd;text-decoration:none;transition:color .16s}
.footer-legal a:hover,.footer-legal a:focus-visible{color:#f3f5ff;text-decoration:underline;text-underline-offset:4px}
.footer-socials{display:flex;align-items:center;justify-content:center;justify-self:end;gap:8px;flex-wrap:wrap}
.footer-social{display:grid;place-items:center;width:39px;height:39px;border:1px solid #2d3444;border-radius:12px;background:#10151e;color:#e4e7f0;transition:color .15s,border-color .15s,background .15s,transform .15s}
a.footer-social:hover,a.footer-social:focus-visible{transform:translateY(-2px);background:#1b2331;outline:none}
a.social-discord:hover{color:#9aa4ff;border-color:#5865f2}
a.social-x:hover{color:white;border-color:#c6ccd5}
a.social-twitch:hover{color:#c59bff;border-color:#a970ff}
a.social-kick:hover{color:#61fc7c;border-color:#35e56d}
.footer-social.is-unset{opacity:.52;cursor:not-allowed}
.footer-disclaimer{margin:21px 0 0;color:#697489;font-size:11px}
.social-admin-details{border:1px solid #353b4e;background:#111721;border-radius:12px;margin-bottom:16px;padding:14px}
.social-admin-details summary{font-size:13px;font-weight:800;cursor:pointer;color:#f4f0ff}
.social-admin-details p{color:#9ca8bc;font-size:12px;line-height:1.5}
.social-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}
.social-admin-grid label{display:flex;flex-direction:column;gap:7px;color:#aeb7c7;font-weight:700;font-size:11px}
.social-admin-grid input{min-width:0;border:1px solid #353d4e;background:#0d131c;color:#f5f8ff;border-radius:9px;padding:10px;font-size:12px}
.social-admin-status{min-height:13px}
@media(max-width:920px){
 .footer-main{grid-template-columns:1fr;justify-items:center;row-gap:15px}
 .footer-copyright,.footer-legal,.footer-socials{justify-self:center}
 .footer-legal{gap:18px}
 .social-admin-grid{grid-template-columns:1fr}
}

/* v2.8 — category artwork and participant navigation */
.detail-category-wrap .detail-category{width:max-content;max-width:100%}
.detail-category-link{display:flex;align-items:center;gap:13px;min-height:76px;max-width:100%;padding:9px 13px}
.detail-category-link>span:not(.detail-category-placeholder):not(.detail-category-arrow){min-width:0;overflow-wrap:anywhere}
.detail-category-link[href]{cursor:pointer}
.detail-category-link:hover,.detail-category-link:focus-visible{border-color:#b383fb;background:#24283a}
.detail-hero.kick~.detail-body .detail-category-link:hover,.detail-hero.kick~.detail-body .detail-category-link:focus-visible{border-color:#3be687;background:#14251b}
.detail-category-placeholder{display:grid;place-items:center;width:52px;height:58px;flex:0 0 52px;border:1px solid #434c5d;border-radius:9px;color:#b7c5da;background:#1b2431;font-size:25px}
.badge-category-link .category-placeholder{display:grid;place-items:center;width:25px;height:29px;border:1px solid #434c5d;border-radius:5px;flex-shrink:0}
.detail-category-arrow{font-size:16px;color:#bba4e8}
.detail-channel-missing{padding:17px;color:#abb8ca;font-size:12px;line-height:1.6;display:flex;flex-direction:column;align-items:start;gap:12px}
.detail-channel-missing a{display:inline-block;border:1px solid #4a5971;border-radius:9px;background:#1c2534;padding:10px 14px;color:#dcecfb;text-decoration:none;font-weight:700}
.detail-channel-missing a:hover,.detail-channel-missing a:focus-visible{border-color:#8eabde;color:#fff;outline:none}
@media(max-width:590px){.detail-category-link{width:100%;min-height:65px}.detail-category img{width:45px;height:57px}}

/* v2.12: The view switcher must remain visible in both Cards and Schedule. */
.view-switcher{display:flex;align-items:center;justify-content:center;gap:9px;margin:0 auto 28px}
.view-switcher button{border:1px solid #30384a;border-radius:999px;background:#10141d;color:#b4bed0;padding:11px 22px;font-size:13px;font-weight:800;transition:color .15s,border-color .15s,background .15s}
.view-switcher button:hover{border-color:#79849a;color:#fff}
.view-switcher button.selected{border-color:rgba(169,96,255,.6);background:#24203a;color:#fff}
.view-switcher button[data-view='schedule'].selected{border-color:#44ca93;background:linear-gradient(95deg,rgba(169,96,255,.20),rgba(52,226,124,.16));color:#f7faff}
.schedule-top-actions{display:flex;justify-content:flex-start;margin:0 0 25px}
.schedule-back{border:1px solid #374154;background:#131926;border-radius:999px;color:#dfe5f2;padding:10px 16px;font-size:13px;font-weight:700}
.schedule-back:hover{border-color:#aa61ff;color:#fff}
.schedule-toolbar{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:25px 0 16px}
.schedule-toolbar button{min-width:38px;min-height:36px;border:1px solid #353d4d;border-radius:10px;color:#eef2fb;background:#111722;font-size:13px;font-weight:700;padding:7px 14px}
.schedule-toolbar button:hover{background:#222941;border-color:#916acb}
.schedule-range{font-size:12px;color:#b6c2d3;font-weight:700;padding:0 10px}
.timeline-section{margin-top:8px}
.timeline-shell{max-width:100%;min-width:0;margin-top:10px}
.timeline-board-wrap{width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;border-radius:17px;border:1px solid #2b3342;background:#0c1018;padding:12px;scrollbar-width:thin;scrollbar-color:#4b556a #10141d}
.timeline-board{position:relative;min-height:100px}
.timeline-days{display:flex;grid-auto-flow:unset;grid-auto-columns:unset;height:44px;position:relative;top:auto;z-index:0;margin-bottom:8px;align-items:stretch}
.timeline-day{flex:0 0 96px;height:44px;display:flex;align-items:center;justify-content:center;border-left:1px solid #2c3543;border-bottom:1px solid #2c3543;font-size:11px;color:#aeb7c8;padding:0;text-transform:uppercase}
.timeline-now{position:absolute;z-index:3;top:44px;bottom:0;pointer-events:none;width:2px;background:#ff5867;box-shadow:0 0 10px #ff58676e}
.timeline-now-label{position:absolute;top:0;left:5px;transform:translateY(-50%);padding:3px 6px;border-radius:6px;background:#41202b;border:1px solid #a63c4d;color:#ffe8eb;font-size:10px;font-weight:800;white-space:nowrap}
.timeline-rows{display:flex;flex-direction:column;gap:8px;margin-top:0}
.timeline-row{display:grid;grid-template-columns:238px minmax(0,1fr);gap:0;align-items:center;min-height:48px;padding:0;cursor:pointer;color:#fff;background:#0e131b;border:1px solid #1d2733;border-radius:9px;text-align:left}
.timeline-row:hover,.timeline-row:focus-visible{outline:1px solid #65768f;background:#111a26}
.timeline-label{position:sticky;left:0;z-index:4;display:flex;align-items:center;gap:9px;min-width:0;height:46px;padding:5px 10px;border-right:1px solid #253347;background:#141b27;border-radius:8px 0 0 8px}
.timeline-mini{width:31px;height:31px;max-width:31px;max-height:31px;border-radius:7px;object-fit:contain;flex:0 0 31px;background:#090d15}
.timeline-label-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.timeline-label-copy strong{font-size:12px;color:#eef3ff;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.timeline-label-copy small{font-size:10px;color:#8fa1b9;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.timeline-lane{height:46px;display:block;position:relative;border-radius:0 8px 8px 0;background:repeating-linear-gradient(90deg,#111823 0,#111823 95px,#263040 95px,#263040 96px)}
.timeline-bar{position:absolute;top:7px;height:30px;min-width:6px;border-radius:7px;display:flex;align-items:center;padding:0 10px;overflow:hidden;border:0;font-size:11px;font-weight:800;white-space:nowrap;box-shadow:0 5px 17px #0006}
.timeline-bar.twitch{background:#9947ee;color:#fff}
.timeline-bar.kick{background:#31e578;color:#03220f}
.timeline-bar.milestone{width:7px!important;padding:0;background:#8f99b0;border-radius:6px;border:1px solid #e1e6f4}
.timeline-bar-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.timeline-bar-mini{display:block;width:24px;height:24px;flex:0 0 24px;border-radius:6px;object-fit:contain;background:rgba(8,12,18,.32)}
.timeline-bar-copy{display:flex;flex-direction:column;gap:2px;min-width:0;overflow:hidden}
.timeline-bar-meta{font-size:9px;font-weight:700;opacity:.9;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.schedule-empty-period{padding:28px 18px;color:#aebcd0;text-align:center;border:1px dashed #31394a;border-radius:12px;background:#0e121a}
.schedule-outside{text-align:center;color:#828ea2;font-size:12px;margin:15px 0 0}
.timeline-undated{margin-top:32px}
.timeline-undated h3{font-size:16px;font-weight:800;color:#e7ecf5;margin:0 0 14px}
.timeline-undated-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(195px,1fr));gap:12px}
.timeline-undated-card{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid #343c4e;background:#10141d;border-radius:12px;padding:11px 12px;min-width:0;color:#e6ebf6;cursor:pointer;font-size:12px;font-weight:700}
.timeline-undated-card.twitch{border-color:#5f3d81}
.timeline-undated-card.kick{border-color:#216a44}
.timeline-undated-card:hover{background:#192130}
.timeline-undated-card img{display:block;flex:0 0 33px;width:33px;height:33px;object-fit:contain}
.timeline-undated-card span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.timeline-undated-card small{margin-left:auto;color:#8e9ab1;font-size:10px}
@media(max-width:600px){
 .view-switcher{margin-bottom:20px}.view-switcher button{padding:10px 17px}
 .timeline-section .section-header h2{font-size:28px}
 .schedule-toolbar{justify-content:center}.schedule-range{width:100%;text-align:center}
 .timeline-row{grid-template-columns:238px minmax(0,1fr)}
}
@media(max-width:760px){
 .timeline-board-wrap.mobile-schedule{padding:10px}
 .timeline-board-wrap.mobile-schedule .timeline-days{height:40px;margin-bottom:10px}
 .timeline-board-wrap.mobile-schedule .timeline-day{flex-basis:92px;height:40px;font-size:10px}
 .timeline-board-wrap.mobile-schedule .timeline-now{top:40px}
 .timeline-board-wrap.mobile-schedule .timeline-now-label{font-size:9px;left:4px}
 .timeline-row-mobile{display:block;min-height:56px;padding:0;background:transparent;border:0;border-radius:0}
 .timeline-row-mobile:hover,.timeline-row-mobile:focus-visible{background:transparent;border:0;outline:none}
 .timeline-row-mobile .timeline-lane{height:56px;border-radius:10px;background:repeating-linear-gradient(90deg,#111823 0,#111823 91px,#263040 91px,#263040 92px)}
 .timeline-row-mobile .timeline-bar{top:6px;height:44px;min-width:124px;padding:6px 10px;gap:8px;border-radius:10px;box-shadow:0 8px 20px #0007}
 .timeline-row-mobile .timeline-bar.milestone{top:6px;height:44px;min-width:7px;padding:0}
 .timeline-row-mobile .timeline-bar-copy{max-width:100%}
 .timeline-row-mobile .timeline-bar-name{display:block;font-size:11px;font-weight:800}
 .timeline-row-mobile .timeline-bar-meta{display:block;line-height:1.15}
 .timeline-row-mobile.kick .timeline-bar-meta{color:#12311c}
 .timeline-row-mobile.twitch .timeline-bar-meta{color:#f3eaff}
}


/* v2.14 — View and schedule filters follow the selected platform. */
#view-tabs[data-scope="twitch"] button:is(.selected,:hover,:focus-visible){
  color:#fff;border-color:rgba(169,96,255,.66);background:linear-gradient(135deg,#a960ff,#8648e9);box-shadow:0 9px 22px rgba(169,96,255,.18);
}
#view-tabs[data-scope="kick"] button:is(.selected,:hover,:focus-visible){
  color:#071c10;border-color:rgba(52,226,124,.75);background:linear-gradient(135deg,#47f18a,#1cc968);box-shadow:0 9px 22px rgba(52,226,124,.17);
}
#view-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible){
  color:#fff;border-color:rgba(169,96,255,.55);background:linear-gradient(100deg,#9d54eb 0%,#7b7bc8 48%,#30d88a 100%);box-shadow:0 9px 22px rgba(169,96,255,.13),0 7px 18px rgba(52,226,124,.11);
}
/* Preserve the neutral appearance of unselected navigation buttons. */
.view-switcher button:not(.selected):not(:hover):not(:focus-visible){
  background:#10141d;border-color:#30384a;color:#b4bed0;box-shadow:none;
}
.schedule-filter-row{display:flex;justify-content:center;margin:24px auto 8px}
.schedule-filter-tabs{gap:12px;flex-wrap:wrap}
.schedule-filter-tabs button{min-width:105px;padding:11px 19px;font-size:14px;font-weight:750;transition:background .15s,border-color .15s,color .15s}
#schedule-cost-tabs[data-scope="twitch"] button:is(.selected,:hover,:focus-visible){
  color:#fff;border-color:rgba(169,96,255,.70);background:linear-gradient(135deg,#a960ff,#8648e9);box-shadow:0 8px 20px rgba(169,96,255,.16);
}
#schedule-cost-tabs[data-scope="kick"] button:is(.selected,:hover,:focus-visible){
  color:#071c10;border-color:rgba(52,226,124,.75);background:linear-gradient(135deg,#47f18a,#1cc968);box-shadow:0 8px 20px rgba(52,226,124,.15);
}
#schedule-cost-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible){
  color:#fff;border-color:rgba(169,96,255,.55);background:linear-gradient(100deg,#9d54eb,#30d88a);box-shadow:0 8px 20px rgba(169,96,255,.13),0 5px 16px rgba(52,226,124,.1);
}
#schedule-cost-tabs button:not(.selected):not(:hover):not(:focus-visible){
  background:transparent;border-color:#2a2f3c;color:#ecf0f9;box-shadow:none;
}
@media(max-width:600px){
  .schedule-filter-row{margin:20px auto 4px}
  .schedule-filter-tabs{gap:7px}
  .schedule-filter-tabs button{min-width:0;padding:10px 12px;font-size:12px}
}

/* v2.15 — Sort controls are distinct from reward filters and preserve platform colors. */
.schedule-sort-row{display:flex;align-items:center;justify-content:center;margin:14px auto 0;max-width:100%;}
.schedule-sort-control{display:flex;align-items:center;gap:12px;color:#aeb8cb;font-size:12px;font-weight:700;flex-wrap:wrap;justify-content:center}
.schedule-sort-control select{appearance:none;-webkit-appearance:none;border:1px solid #364054;background:#121824;color:#eff4ff;border-radius:12px;min-height:42px;min-width:246px;max-width:100%;padding:9px 36px 9px 14px;cursor:pointer;outline:0;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='9' viewBox='0 0 13 9'%3E%3Cpath d='M1 1l5.5 6L12 1' stroke='%23bdc7db' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center}
.schedule-sort-control select:hover,.schedule-sort-control select:focus-visible{border-color:#aa61ff;background-color:#1a2130}
#timeline-section:has(#schedule-cost-tabs[data-scope="kick"]) .schedule-sort-control select:hover,
#timeline-section:has(#schedule-cost-tabs[data-scope="kick"]) .schedule-sort-control select:focus-visible{border-color:#34e27c}
.schedule-sort-control select option{color:#f3f6ff;background:#151b28}
@media(max-width:500px){.schedule-sort-control{width:100%;gap:8px}.schedule-sort-control select{flex:1 1 100%;width:100%;min-width:0}}


/* v2.17 — Liquid glass buttons with softer shadows. */
:root{
  --glass-dark:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));
  --glass-dark-border:rgba(255,255,255,.12);
  --glass-dark-shadow:0 10px 28px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.12);
}
.nav-link,.header-tool,.language-trigger,.theme-toggle,
.segmented button,.view-switcher button,.schedule-back,.schedule-toolbar button,
.schedule-sort-control select,.show-more,.badge-actions a,.badge-actions button,
.footer-social,.quiet-button,.detail-action,.icon-button,.detail-close{
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  box-shadow:var(--glass-dark-shadow);
}
.nav-link,.header-tool,.language-trigger,.theme-toggle,
.view-switcher button,.schedule-back,.schedule-toolbar button,.show-more{
  background:var(--glass-dark);
  border-color:var(--glass-dark-border);
}
.segmented button,
#schedule-cost-tabs button:not(.selected):not(:hover):not(:focus-visible),
#cost-tabs button:not(.selected):not(:hover):not(:focus-visible){
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));
  border-color:rgba(255,255,255,.12);
  box-shadow:0 10px 24px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.10);
}
.nav-link:hover,.header-tool:hover,.language-control:hover .language-trigger,.theme-toggle:hover,
.view-switcher button:hover,.schedule-back:hover,.schedule-toolbar button:hover,
.segmented button:hover,.show-more:hover,.badge-actions a:hover,.badge-actions button:hover{
  box-shadow:0 12px 30px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.14);
}
.view-switcher button{min-width:86px}
.view-switcher button.selected{box-shadow:0 14px 34px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.16)}
.schedule-back{display:inline-flex;align-items:center;gap:8px}
.schedule-toolbar button{box-shadow:0 9px 22px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.10)}
.schedule-sort-control select{box-shadow:0 10px 26px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.08)}
#cost-tabs[data-scope="twitch"] button.selected,
#schedule-cost-tabs[data-scope="twitch"] button.selected,
#view-tabs[data-scope="twitch"] button[data-view="schedule"].selected,
.view-switcher[data-scope="twitch"] button[data-view='schedule'].selected{
  color:#fff;
  text-shadow:0 1px 0 rgba(0,0,0,.18);
}
#cost-tabs[data-scope="kick"] button.selected,
#schedule-cost-tabs[data-scope="kick"] button.selected,
#view-tabs[data-scope="kick"] button[data-view="schedule"].selected,
.view-switcher[data-scope="kick"] button[data-view='schedule'].selected{
  color:#062113;
}
#cost-tabs[data-scope="all"] button.selected,
#schedule-cost-tabs[data-scope="all"] button.selected,
#view-tabs[data-scope="all"] button[data-view="schedule"].selected,
.view-switcher[data-scope="all"] button[data-view='schedule'].selected{
  color:#fff;
  text-shadow:0 1px 0 rgba(0,0,0,.18);
}


/* v2.20 — platform-colored hover glow for segmented buttons */
.segmented button,
#schedule-cost-tabs button,
#cost-tabs button,
#view-tabs button{
  transition:border-color .22s ease,color .22s ease,box-shadow .24s ease,text-shadow .24s ease,transform .18s ease,background-color .22s ease;
}
#cost-tabs button:not(.selected):is(:hover,:focus-visible),
#schedule-cost-tabs button:not(.selected):is(:hover,:focus-visible),
#view-tabs button:not(.selected):is(:hover,:focus-visible){
  background:transparent;
}
#cost-tabs[data-scope="twitch"] button:not(.selected):is(:hover,:focus-visible),
#schedule-cost-tabs[data-scope="twitch"] button:not(.selected):is(:hover,:focus-visible),
#view-tabs[data-scope="twitch"] button:not(.selected):is(:hover,:focus-visible){
  color:#d9c2ff;
  border-color:rgba(170,97,255,.72);
  text-shadow:0 0 10px rgba(170,97,255,.42);
  box-shadow:0 0 0 1px rgba(170,97,255,.24) inset,0 0 0 1px rgba(170,97,255,.14),0 0 20px rgba(170,97,255,.14);
}
#cost-tabs[data-scope="kick"] button:not(.selected):is(:hover,:focus-visible),
#schedule-cost-tabs[data-scope="kick"] button:not(.selected):is(:hover,:focus-visible),
#view-tabs[data-scope="kick"] button:not(.selected):is(:hover,:focus-visible){
  color:#cbf8da;
  border-color:rgba(52,226,124,.76);
  text-shadow:0 0 10px rgba(52,226,124,.36);
  box-shadow:0 0 0 1px rgba(52,226,124,.24) inset,0 0 0 1px rgba(52,226,124,.12),0 0 20px rgba(52,226,124,.12);
}
#cost-tabs[data-scope="all"] button:not(.selected):is(:hover,:focus-visible),
#schedule-cost-tabs[data-scope="all"] button:not(.selected):is(:hover,:focus-visible),
#view-tabs[data-scope="all"] button:not(.selected):is(:hover,:focus-visible){
  color:#fff;
  border-color:rgba(255,255,255,.22);
  text-shadow:0 0 8px rgba(170,97,255,.26),0 0 8px rgba(52,226,124,.24);
  box-shadow:0 0 0 1px rgba(170,97,255,.16) inset,0 0 0 1px rgba(52,226,124,.16),0 0 18px rgba(170,97,255,.10),0 0 18px rgba(52,226,124,.08);
}


/* v1.3 — single about section, clickable category in facts, shareable card URL */
.detail-fact-category-link{display:inline-flex;align-items:center;gap:7px;max-width:100%;color:#d4a5ff;text-decoration:none;border-bottom:1px solid rgba(169,96,255,.38);padding-bottom:2px;transition:color .16s,border-color .16s}
.detail-fact-category-link:hover,.detail-fact-category-link:focus-visible{color:#f0daff;border-bottom-color:#c084fc;outline-offset:3px}
.detail-hero.kick~.detail-body .detail-fact-category-link{color:#88f4b0;border-bottom-color:rgba(52,226,124,.36)}
.detail-hero.kick~.detail-body .detail-fact-category-link:hover{color:#b9ffd5;border-bottom-color:#46e788}
.detail-category-unavailable{color:var(--muted)}
#copy-badge-link{cursor:pointer}
html[data-theme="light"] .detail-fact-category-link{color:#743cb6;border-bottom-color:#a976da}
html[data-theme="light"] .detail-hero.kick~.detail-body .detail-fact-category-link{color:#087b44;border-bottom-color:#3caf78}


/* v1.8: hide public source status and extra global copy */
.global-intro{display:none!important}
.top-actions .status-indicator[hidden], .top-actions #refresh-public[hidden]{display:none!important}


/* v1.9 — fixed official chat on wide screens only; remove translator UI from public view. */
.shell.has-side-chat .main-content{max-width:1320px;padding-right:392px}
.chat-panel{position:fixed;top:92px;right:24px;width:344px;height:calc(100vh - 120px);padding:0;border:1px solid rgba(255,255,255,.10);border-radius:22px;background:linear-gradient(180deg,rgba(14,18,28,.96),rgba(9,12,20,.98));box-shadow:0 24px 60px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05);overflow:hidden;z-index:8}
.chat-panel .chat-head,.chat-panel #chat-tabs,.chat-panel #chat-settings-button,.chat-panel #chat-settings,.chat-panel #chat-mode-switch,.chat-panel #translated-live,.chat-panel .chat-translator,.chat-panel #chat-collapse,.chat-panel #toggle-chat-mobile{display:none!important}
#chat-frames{height:100%}
#chat-frames .chat-frame-wrap{position:relative;height:100%;display:flex;flex-direction:column;background:transparent}
#chat-frames .chat-frame-top{display:none!important}
#chat-frames iframe{width:100%;height:100%;border:0;background:#0b0e14}
.chat-open-official{position:absolute;right:12px;bottom:12px;padding:8px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(10,14,24,.78);font-size:12px;font-weight:700;color:#f1f5ff;backdrop-filter:blur(12px)}
.chat-open-official:hover{border-color:rgba(255,255,255,.24)}
@media(max-width:1499px){.chat-panel{display:none!important}.shell.has-side-chat .main-content{max-width:1200px;padding-right:28px}}
html[data-theme="light"] .chat-panel{background:linear-gradient(180deg,rgba(250,252,255,.97),rgba(239,244,251,.98));border-color:rgba(116,134,162,.26);box-shadow:0 20px 48px rgba(68,84,115,.18), inset 0 1px 0 rgba(255,255,255,.96)}
html[data-theme="light"] .chat-open-official{background:rgba(255,255,255,.92);border-color:rgba(120,137,163,.35);color:#24354d}


/* v2.0 — official chat: visible only when there is genuine free side space.
   The central cards and schedule stay centered relative to the full viewport. */
.shell.has-side-chat .main-content{
  width:100%;
  max-width:var(--center-content-width,1200px)!important;
  margin-inline:auto!important;
  padding:52px 28px 70px!important;
}
/* Overrides the original .chat-panel{display:none!important} from earlier versions. */
.shell.has-side-chat > #chat-panel:not([hidden]){
  display:block!important;
  position:fixed!important;
  right:24px;top:clamp(85px,10vh,108px);
  width:320px;height:calc(100dvh - clamp(85px,10vh,108px) - 24px);
  min-height:360px;
  overflow:hidden;
  z-index:8;
}
#chat-panel[hidden],.shell:not(.has-side-chat) #chat-panel{display:none!important}
#chat-frames{height:100%;min-height:0}
#chat-frames .chat-frame-wrap.official{height:100%;display:flex;flex-direction:column;min-height:0}
#chat-frames .chat-frame-wrap.official iframe{flex:1 1 auto;min-height:0;width:100%;height:100%;border:0}
#chat-frames .chat-official-head{
  flex:none;display:flex;align-items:center;justify-content:space-between;gap:10px;
  min-height:42px;padding:10px 13px;
  border-bottom:1px solid rgba(255,255,255,.09);
  color:#dae1ed;font-size:12px;font-weight:750;
}
#chat-frames .chat-official-head a{
  color:#aeb9ca;text-decoration:none;font-size:10px;font-weight:700;
  white-space:nowrap;transition:color .16s ease;
}
#chat-frames .chat-official-head a:hover{color:#fff;text-decoration:underline}
html[data-theme="light"] #chat-frames .chat-official-head{color:#283952;border-bottom-color:rgba(40,62,100,.12)}
html[data-theme="light"] #chat-frames .chat-official-head a{color:#486384}
@media(max-width:1615px){
  .shell.has-side-chat > #chat-panel{display:none!important}
  .shell.has-side-chat .main-content{max-width:1200px!important;padding:52px 28px 70px!important}
}


/* v2.0.1 — language picker: keep wrapper transparent, especially in light mode. */
.topbar .language-control,
.topbar .language-control:hover,
.topbar .language-control:focus-within,
html[data-theme="light"] .topbar .language-control,
html[data-theme="light"] .topbar .language-control:hover,
html[data-theme="light"] .topbar .language-control:focus-within {
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  border-radius:0;
}
html[data-theme="light"] .topbar .language-trigger:focus-visible{
  outline:2px solid #8748d2;
  outline-offset:2px;
}
/* Dynamic panel width follows available room. Center content is never pushed aside. */
.shell.has-side-chat > #chat-panel:not([hidden]) {
  width:var(--chat-width,344px)!important;
  top:var(--chat-top,92px)!important;
  height:var(--chat-height,calc(100dvh - 112px))!important;
  min-height:0!important;
  right:var(--chat-right,24px)!important;
  max-width:calc(100vw - 48px)!important;
  border-radius:18px;
}
.shell.has-side-chat .main-content {
  width:100%;
  max-width:var(--center-content-width,1200px)!important;
  margin-inline:auto!important;
  padding:52px 28px 70px!important;
}
@media(max-width:1639px){
  .shell.has-side-chat > #chat-panel{display:none!important}
}


/* v2.0.2 — mixed view: six community cards on the free left flank. */
.shell.has-community > #community-panel:not([hidden]){
 display:block!important;position:fixed;left:clamp(14px,1.3vw,32px);
 top:var(--community-top,98px);width:var(--community-width,310px);
 height:var(--community-height,calc(100dvh - 120px));
 z-index:7;overflow:auto;scrollbar-width:thin;overscroll-behavior:contain;
 background:transparent;border:0;box-shadow:none;
}
#community-panel[hidden],.shell:not(.has-community) #community-panel{display:none!important}
.community-cards{display:flex;flex-direction:column;gap:12px;min-width:0;padding:4px 6px 15px 3px}
.community-card{--community-accent:#a960ff;display:flex;align-items:center;gap:13px;min-height:80px;padding:14px 16px;
 border-radius:17px;border:1px solid color-mix(in srgb,var(--community-accent) 48%,#46516a);
 color:#f4f6ff;background:linear-gradient(140deg,rgba(21,25,38,.94),rgba(12,15,24,.93));
 box-shadow:0 10px 23px rgba(0,0,0,.21),0 0 14px color-mix(in srgb,var(--community-accent) 12%,transparent);
 text-decoration:none;transition:transform .17s,border-color .17s,box-shadow .17s;color:var(--text);
}
.community-card:not(.is-unset):hover{transform:translateY(-2px);border-color:var(--community-accent);box-shadow:0 15px 30px rgba(0,0,0,.24),0 0 26px color-mix(in srgb,var(--community-accent) 26%,transparent)}
.community-card.is-unset{opacity:.63;cursor:default;filter:saturate(.7)}
.community-card-icon{display:grid;place-items:center;flex:none;width:45px;height:45px;border:1px solid color-mix(in srgb,var(--community-accent) 55%,transparent);border-radius:13px;color:var(--community-accent);background:color-mix(in srgb,var(--community-accent) 12%,transparent)}
.community-card-copy{display:flex;flex:1;flex-direction:column;gap:4px;min-width:0;color:var(--text)}
.community-card-copy strong{font-size:15px;font-weight:800;letter-spacing:-.02em}
.community-card-copy>span{color:var(--muted);font-size:11px;line-height:1.3}
.community-card-arrow{font-size:20px;font-weight:600;color:var(--community-accent)}
.community-discord{--community-accent:#8a9cff}.community-x{--community-accent:#b7c5dc}
.community-telegram{--community-accent:#39baff}.community-whatsapp{--community-accent:#3ee58d}
.community-kick{--community-accent:#36ed81}.community-twitch{--community-accent:#b675ff}
.mixed-chat-placeholder{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:13px;padding:28px;text-align:center;color:var(--text)}
.mixed-chat-symbol{display:grid;place-items:center;width:78px;height:65px;border-radius:20px;border:1px solid rgba(164,108,255,.52);color:#c7a5ff;font-weight:900;letter-spacing:.12em;background:linear-gradient(120deg,rgba(143,66,244,.12),rgba(50,224,124,.11))}
.mixed-chat-placeholder strong{font-size:18px;font-weight:800}
.mixed-chat-placeholder p{font-size:13px;line-height:1.6;color:var(--muted);max-width:265px}
.mixed-chat-admin{padding-top:16px;margin-top:14px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:9px}
.mixed-chat-admin>label{color:var(--text);font-weight:700;font-size:12px}
.mixed-chat-admin button{align-self:start}
html[data-theme="light"] .community-card{background:linear-gradient(145deg,#fff,#f5f8fc);border-color:color-mix(in srgb,var(--community-accent) 48%,#aebfd6);box-shadow:0 12px 26px rgba(55,76,112,.12),0 0 10px color-mix(in srgb,var(--community-accent) 10%,transparent);color:#1b2c47}
html[data-theme="light"] .community-card-copy{color:#1b2c47}
html[data-theme="light"] .community-card-copy>span{color:#617086}
html[data-theme="light"] .community-card-icon{background:color-mix(in srgb,var(--community-accent) 12%,white)}
html[data-theme="light"] .community-card:not(.is-unset):hover{box-shadow:0 12px 30px rgba(63,84,119,.16),0 0 22px color-mix(in srgb,var(--community-accent) 23%,transparent)}
html[data-theme="light"] .mixed-chat-symbol{color:#673ca1}
@media(max-width:1639px){.shell.has-community > #community-panel{display:none!important}}
@media(prefers-reduced-motion:reduce){.community-card{transition:none}}

/* The combined widget is intentionally view-only: no message inputs or interactions. */
#chat-frames .chat-frame-wrap.official.mixed iframe{pointer-events:none}


/* v2.0.3 — unified notification sidebar across Kick, Twitch and combined tabs.
   The panel is a fixed flank: it never participates in the center content width. */
.shell.has-community > #community-panel:not([hidden]){
 box-sizing:border-box;left:clamp(14px,1.3vw,32px);top:var(--community-top,98px);
 width:var(--community-width,310px);height:var(--community-height,calc(100dvh - 120px));
 padding:20px 16px 22px;display:flex!important;flex-direction:column;
 background:radial-gradient(circle at 50% 0%,rgba(119,69,184,.15),transparent 42%),linear-gradient(180deg,#0e1421 0%,#0a101c 100%);
 border:1px solid rgba(109,124,157,.36);border-radius:20px;
 box-shadow:0 18px 48px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.035);
 scrollbar-width:thin;scrollbar-color:#414a62 transparent;overflow-y:auto;overflow-x:hidden;
}
.community-panel-header{display:flex;flex:none;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:14px 0 26px;text-align:center}
.community-bell{width:52px;height:52px;display:grid;place-items:center;border-radius:16px;color:#c06dff;
 border:1px solid rgba(174,93,245,.45);background:linear-gradient(160deg,rgba(157,70,229,.16),rgba(80,35,133,.13));
 box-shadow:0 0 0 5px rgba(159,74,227,.045),0 0 25px rgba(165,75,249,.24);}
.community-bell svg{width:27px;height:27px;filter:drop-shadow(0 0 8px rgba(188,96,255,.55))}
.community-panel-header h2{margin:0;font-size:clamp(18px,1.33vw,25px);line-height:1.2;font-weight:850;letter-spacing:-.035em;color:#f5f1ff;text-shadow:0 0 15px rgba(175,94,255,.16)}
.community-heading-underline{display:block;height:3px;width:96px;border-radius:20px;margin-top:4px;
 background:linear-gradient(90deg,transparent,#b25cf7 22%,#cd73ff 75%,transparent);
 box-shadow:0 0 16px rgba(181,88,255,.78)}
.shell.has-community .community-cards{width:100%;min-width:0;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.shell.has-community .community-card{box-sizing:border-box;flex:none;width:100%;min-height:69px;padding:10px 12px;gap:12px;border-radius:15px;
 background:linear-gradient(150deg,color-mix(in srgb,var(--community-accent) 8%,#111723),#0d131e 73%);
 border:1px solid color-mix(in srgb,var(--community-accent) 72%,#374158);
 box-shadow:0 7px 18px rgba(0,0,0,.18),0 0 10px color-mix(in srgb,var(--community-accent) 13%,transparent);opacity:1}
.shell.has-community .community-card-icon{width:48px;height:48px;flex:none;border-radius:14px;border-color:color-mix(in srgb,var(--community-accent) 70%,transparent);
 background:color-mix(in srgb,var(--community-accent) 12%,#0b101a);box-shadow:0 0 13px color-mix(in srgb,var(--community-accent) 14%,transparent)}
.shell.has-community .community-card-icon svg{width:26px;height:26px}
.shell.has-community .community-card-copy strong{font-size:15px;line-height:1.15}
.shell.has-community .community-card-copy>span{font-size:11px;line-height:1.35;overflow-wrap:anywhere}
.shell.has-community .community-card-arrow{font-size:18px;line-height:1;flex:none}
.shell.has-community .community-card.is-unset{opacity:.68;cursor:default}
.shell.has-community .community-card.is-unset .community-card-arrow{opacity:.35}
.shell.has-community .community-card:not(.is-unset):hover{transform:translateY(-2px);
 border-color:var(--community-accent);box-shadow:0 13px 26px rgba(0,0,0,.30),0 0 25px color-mix(in srgb,var(--community-accent) 26%,transparent)}
/* Light mode stays crisp, retaining platform colors without a dark background. */
html[data-theme="light"] .shell.has-community > #community-panel:not([hidden]){background:radial-gradient(circle at 50% 0%,rgba(153,89,231,.08),transparent 40%),linear-gradient(#fff,#f7f9fd);
 border-color:#c2cde0;box-shadow:0 12px 38px rgba(67,88,128,.14),inset 0 1px 0 #fff}
html[data-theme="light"] .community-panel-header h2{color:#263149;text-shadow:none}
html[data-theme="light"] .community-bell{background:#f7ecff;border-color:#b57de3;box-shadow:0 0 18px rgba(175,82,244,.18)}
html[data-theme="light"] .shell.has-community .community-card{background:linear-gradient(140deg,#fff,#f5f8fc);border-color:color-mix(in srgb,var(--community-accent) 65%,#aebfd6);
 box-shadow:0 5px 14px rgba(65,92,132,.11),0 0 7px color-mix(in srgb,var(--community-accent) 12%,transparent)}
html[data-theme="light"] .shell.has-community .community-card-icon{background:color-mix(in srgb,var(--community-accent) 12%,#fff)}
@media(max-width:1639px){.shell.has-community > #community-panel{display:none!important}}
@media(max-height:750px){.community-panel-header{padding:7px 0 15px}.shell.has-community .community-cards{gap:9px}.shell.has-community .community-card{min-height:60px;padding:8px 10px}.shell.has-community .community-card-icon{width:40px;height:40px}}
@media(prefers-reduced-motion:reduce){.shell.has-community .community-card{transition:none!important}}


/* v2.0.4 — collapsible social tray, themed bell and clearer chat frame. */
#community-panel{--notify-primary:#b864ff;--notify-secondary:#34eb7c;}
#community-panel[data-page="twitch"]{--notify-primary:#b56dff;--notify-secondary:#b56dff;}
#community-panel[data-page="kick"]{--notify-primary:#36ec81;--notify-secondary:#36ec81;}
#community-panel[data-page="all"]{--notify-primary:#b56dff;--notify-secondary:#36ec81;}
.community-bell{appearance:none;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease,color .18s ease;
 color:var(--notify-primary);border-color:color-mix(in srgb,var(--notify-primary) 62%,rgba(255,255,255,.14));
 background:linear-gradient(145deg,color-mix(in srgb,var(--notify-primary) 16%,rgba(255,255,255,.02)),color-mix(in srgb,var(--notify-secondary) 10%,rgba(19,24,36,.82)));
 box-shadow:0 0 0 5px color-mix(in srgb,var(--notify-primary) 6%,transparent),0 0 24px color-mix(in srgb,var(--notify-primary) 20%,transparent),0 0 16px color-mix(in srgb,var(--notify-secondary) 14%,transparent);
}
.community-bell:hover,.community-bell:focus-visible{transform:translateY(-1px);outline:none;box-shadow:0 0 0 6px color-mix(in srgb,var(--notify-primary) 7%,transparent),0 0 28px color-mix(in srgb,var(--notify-primary) 27%,transparent),0 0 20px color-mix(in srgb,var(--notify-secondary) 20%,transparent);}
.community-bell svg{filter:drop-shadow(0 0 8px color-mix(in srgb,var(--notify-primary) 60%,transparent));}
.community-heading-underline{background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--notify-primary) 92%,white) 20%,color-mix(in srgb,var(--notify-secondary) 90%,white) 80%,transparent);
 box-shadow:0 0 16px color-mix(in srgb,var(--notify-primary) 38%,transparent),0 0 18px color-mix(in srgb,var(--notify-secondary) 26%,transparent);}
#community-panel.is-collapsed{padding:14px 10px 14px;width:74px!important;overflow:hidden;}
#community-panel.is-collapsed .community-panel-header{padding:0;gap:0;}
#community-panel.is-collapsed .community-panel-header h2,
#community-panel.is-collapsed .community-heading-underline,
#community-panel.is-collapsed .community-cards{display:none!important;}
#community-panel.is-collapsed .community-bell{margin-inline:auto;}
html[data-theme="light"] .community-bell{background:linear-gradient(145deg,color-mix(in srgb,var(--notify-primary) 10%,white),color-mix(in srgb,var(--notify-secondary) 8%,white));
 border-color:color-mix(in srgb,var(--notify-primary) 52%,#b7c7df);box-shadow:0 0 18px color-mix(in srgb,var(--notify-primary) 16%,transparent),0 0 10px color-mix(in srgb,var(--notify-secondary) 10%,transparent);}
#chat-frames .chat-frame-wrap.official{border:1px solid rgba(255,255,255,.08);border-radius:18px;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.04);}
#chat-frames .chat-frame-wrap.official.mixed{background:linear-gradient(180deg,rgba(14,18,28,.98),rgba(8,11,18,.98));}
#chat-frames .chat-frame-wrap.official.mixed iframe{background:#0b0e14;filter:invert(1) hue-rotate(180deg);}
html[data-theme="light"] #chat-frames .chat-frame-wrap.official{border-color:rgba(92,112,146,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.86),0 10px 24px rgba(74,95,130,.08);}
html[data-theme="light"] #chat-frames .chat-frame-wrap.official.mixed{background:linear-gradient(180deg,#ffffff,#f3f6fb);}
html[data-theme="light"] #chat-frames .chat-frame-wrap.official.mixed iframe{background:#ffffff;filter:invert(1) hue-rotate(180deg);}


/* v2.0.5 — notification cards without an enclosing panel; mixed bell genuinely two-tone. */
.shell.has-community > #community-panel:not([hidden]),
html[data-theme="light"] .shell.has-community > #community-panel:not([hidden]){
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  padding:18px 12px 22px!important;
}
/* Keep a small, accessible collapse target and its location even without the outer card. */
.shell.has-community > #community-panel.is-collapsed:not([hidden]){
  width:74px!important;
  padding:14px 10px!important;
}
/* All-platform view: stroke, outline and glow genuinely mix Twitch purple with Kick green. */
#community-panel[data-page="all"] .community-bell svg path{
  stroke:url(#community-bell-stroke);
}
#community-panel[data-page="all"] .community-bell{
  border:1px solid transparent!important;
  background:linear-gradient(135deg,rgba(41,23,61,.97),rgba(13,46,32,.92)) padding-box,
             linear-gradient(115deg,#b965ff 0%,#37e787 100%) border-box!important;
  color:#d9a4ff;
  box-shadow:0 0 0 4px rgba(159,90,241,.045),-5px 0 22px rgba(166,94,251,.20),5px 0 23px rgba(46,229,125,.20)!important;
}
#community-panel[data-page="all"] .community-bell svg{
  filter:drop-shadow(-1px 0 5px rgba(183,110,255,.62)) drop-shadow(1px 0 5px rgba(49,236,128,.62));
}
#community-panel[data-page="all"] .community-bell:is(:hover,:focus-visible){
  box-shadow:0 0 0 5px rgba(159,90,241,.07),-7px 0 27px rgba(166,94,251,.31),7px 0 27px rgba(46,229,125,.31)!important;
}
html[data-theme="light"] #community-panel[data-page="all"] .community-bell{
  background:linear-gradient(135deg,#f7edff,#edfff3) padding-box,
             linear-gradient(115deg,#a84bf8 0%,#13bc62 100%) border-box!important;
  box-shadow:-5px 0 18px rgba(157,77,232,.17),5px 0 18px rgba(18,181,91,.15)!important;
}
html[data-theme="light"] #community-panel[data-page="all"] .community-bell:is(:hover,:focus-visible){
  box-shadow:-6px 0 24px rgba(157,77,232,.25),6px 0 24px rgba(18,181,91,.22)!important;
}
@media(prefers-reduced-motion:reduce){.community-bell{transition:none!important}}


/* v2.0.6 — keep combined chat dark and strengthen light-mode socials */
#chat-frames .chat-frame-wrap.official.mixed{
  background:#090d14;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 10px 24px rgba(0,0,0,.22);
}
#chat-frames .chat-frame-wrap.official.mixed iframe{
  background:#090d14;
  filter:none !important;
}
html[data-theme="light"] #chat-frames .chat-frame-wrap.official.mixed{
  background:#090d14;
  border-color:rgba(67,89,122,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 14px 28px rgba(64,85,120,.12);
}
html[data-theme="light"] #chat-frames .chat-frame-wrap.official.mixed iframe{
  background:#090d14;
  filter:none !important;
}
html[data-theme="light"] .community-bell{
  border-width:2px;
  border-color:color-mix(in srgb,var(--notify-primary) 68%,#aebfd6);
  box-shadow:0 10px 24px rgba(77,98,135,.14),0 0 20px color-mix(in srgb,var(--notify-primary) 16%,transparent),0 0 16px color-mix(in srgb,var(--notify-secondary) 12%,transparent);
}
html[data-theme="light"] .community-bell:hover,
html[data-theme="light"] .community-bell:focus-visible{
  box-shadow:0 14px 30px rgba(77,98,135,.18),0 0 26px color-mix(in srgb,var(--notify-primary) 24%,transparent),0 0 20px color-mix(in srgb,var(--notify-secondary) 20%,transparent);
}
html[data-theme="light"] .shell.has-community .community-card{
  border-width:2px;
  border-color:color-mix(in srgb,var(--community-accent) 72%,#aebfd6);
  box-shadow:0 12px 26px rgba(66,88,123,.13),0 0 14px color-mix(in srgb,var(--community-accent) 10%,transparent);
}
html[data-theme="light"] .shell.has-community .community-card-icon{
  border-width:2px;
  border-color:color-mix(in srgb,var(--community-accent) 64%,#bed0e7);
  box-shadow:0 6px 16px color-mix(in srgb,var(--community-accent) 12%,transparent);
}
html[data-theme="light"] .shell.has-community .community-card:not(.is-unset):hover{
  box-shadow:0 16px 32px rgba(66,88,123,.18),0 0 26px color-mix(in srgb,var(--community-accent) 26%,transparent);
  border-color:color-mix(in srgb,var(--community-accent) 88%,#aebfd6);
}
html[data-theme="light"] .shell.has-community .community-card:not(.is-unset):hover .community-card-icon{
  box-shadow:0 10px 22px color-mix(in srgb,var(--community-accent) 18%,transparent);
}


/* v2.0.7 — native jChat+ colors, transparent iframe and high-contrast social borders.
   The host always paints the chat well dark, regardless of site's light/dark mode.
   A cross-origin jChat document uses a light/normal color scheme. Matching it on
   the iframe prevents the opaque white canvas caused by color-scheme mismatch. */
#chat-frames .chat-frame-wrap.official.mixed,
html[data-theme="light"] #chat-frames .chat-frame-wrap.official.mixed,
html[data-theme="dark"] #chat-frames .chat-frame-wrap.official.mixed {
  background:#0a0e16!important;
  border:1px solid rgba(135,149,179,.35)!important;
  box-shadow:0 14px 30px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.055)!important;
  color-scheme:light;
}
#chat-frames .chat-frame-wrap.official.mixed iframe,
html[data-theme="light"] #chat-frames .chat-frame-wrap.official.mixed iframe,
html[data-theme="dark"] #chat-frames .chat-frame-wrap.official.mixed iframe {
  color-scheme:light!important;
  background:transparent!important;
  filter:none!important;
  -webkit-filter:none!important;
  mix-blend-mode:normal!important;
}
/* Card borders must remain recognizable even before their URL is configured. */
.shell.has-community .community-card,
html[data-theme="light"] .shell.has-community .community-card,
html[data-theme="dark"] .shell.has-community .community-card {
  border-style:solid!important;
  border-width:3px!important;
  border-color:color-mix(in srgb,var(--community-accent) 78%,#8da0bc)!important;
  opacity:1!important;
  filter:none!important;
  box-shadow:0 10px 24px rgba(0,0,0,.15),0 0 13px color-mix(in srgb,var(--community-accent) 17%,transparent)!important;
}
.shell.has-community .community-card-icon,
html[data-theme="light"] .shell.has-community .community-card-icon {
  border-width:2px!important;
  border-color:color-mix(in srgb,var(--community-accent) 70%,#90a6c2)!important;
}
html[data-theme="light"] .shell.has-community .community-card {
  background:linear-gradient(140deg,#ffffff,#f2f5fa)!important;
  box-shadow:0 12px 27px rgba(55,75,113,.18),0 0 16px color-mix(in srgb,var(--community-accent) 19%,transparent)!important;
}
html[data-theme="light"] .shell.has-community .community-card:not(.is-unset):hover,
html[data-theme="light"] .shell.has-community .community-card:not(.is-unset):focus-visible {
  border-color:var(--community-accent)!important;
  box-shadow:0 17px 32px rgba(53,75,113,.20),0 0 29px color-mix(in srgb,var(--community-accent) 33%,transparent)!important;
}
html[data-theme="dark"] .shell.has-community .community-card:not(.is-unset):hover,
html[data-theme="dark"] .shell.has-community .community-card:not(.is-unset):focus-visible {
  border-color:var(--community-accent)!important;
  box-shadow:0 13px 27px rgba(0,0,0,.28),0 0 27px color-mix(in srgb,var(--community-accent) 29%,transparent)!important;
}
html[data-theme="light"] .shell.has-community .community-card-copy strong {color:#23324b;}
html[data-theme="light"] .shell.has-community .community-card-copy > span {color:#5d6b82;}
html[data-theme="dark"] .shell.has-community .community-card-copy > span {color:#9dabbe;}
/* A link not configured still cannot be clicked; only the low-contrast
   treatment is removed. The arrow remains muted to communicate inactivity. */
.shell.has-community .community-card.is-unset .community-card-arrow {opacity:.40;}


/* v2.0.8 — simpler split purple/green outline style for mixed platform filter buttons */
#cost-tabs[data-scope="all"] button.selected,
#schedule-cost-tabs[data-scope="all"] button.selected{
  color:#f7fbff;
  background:
    linear-gradient(var(--surface, rgba(10,14,22,.98)), var(--surface, rgba(10,14,22,.98))) padding-box,
    linear-gradient(90deg, #bf63ff 0%, #9d50ff 42%, #6dffbd 58%, #31ea7b 100%) border-box;
  border:1.6px solid transparent;
  text-shadow:0 0 10px rgba(191,99,255,.28), 0 0 10px rgba(49,234,123,.24);
  box-shadow:0 0 0 1px rgba(191,99,255,.22) inset,0 0 0 1px rgba(49,234,123,.18),0 0 22px rgba(191,99,255,.16),0 0 22px rgba(49,234,123,.12);
}
#cost-tabs[data-scope="all"] button.selected:hover,
#cost-tabs[data-scope="all"] button.selected:focus-visible,
#schedule-cost-tabs[data-scope="all"] button.selected:hover,
#schedule-cost-tabs[data-scope="all"] button.selected:focus-visible{
  background:
    linear-gradient(var(--surface, rgba(10,14,22,.98)), var(--surface, rgba(10,14,22,.98))) padding-box,
    linear-gradient(90deg, #cb6aff 0%, #ab59ff 42%, #7bffc4 58%, #33f080 100%) border-box;
  box-shadow:0 0 0 1px rgba(191,99,255,.28) inset,0 0 0 1px rgba(49,234,123,.22),0 0 26px rgba(191,99,255,.20),0 0 26px rgba(49,234,123,.16);
}
#cost-tabs[data-scope="all"] button:not(.selected):is(:hover,:focus-visible),
#schedule-cost-tabs[data-scope="all"] button:not(.selected):is(:hover,:focus-visible){
  background:transparent;
  border-color:transparent;
  background:
    linear-gradient(var(--surface, rgba(10,14,22,.96)), var(--surface, rgba(10,14,22,.96))) padding-box,
    linear-gradient(90deg, rgba(191,99,255,.88) 0%, rgba(172,84,255,.86) 45%, rgba(98,246,178,.84) 55%, rgba(49,234,123,.88) 100%) border-box;
  border:1.45px solid transparent;
  color:#f7fbff;
  text-shadow:0 0 8px rgba(191,99,255,.22), 0 0 8px rgba(49,234,123,.18);
  box-shadow:0 0 0 1px rgba(191,99,255,.14) inset,0 0 0 1px rgba(49,234,123,.12),0 0 18px rgba(191,99,255,.10),0 0 18px rgba(49,234,123,.08);
}
html[data-theme="light"] #cost-tabs[data-scope="all"] button.selected,
html[data-theme="light"] #schedule-cost-tabs[data-scope="all"] button.selected,
html[data-theme="light"] #cost-tabs[data-scope="all"] button:not(.selected):is(:hover,:focus-visible),
html[data-theme="light"] #schedule-cost-tabs[data-scope="all"] button:not(.selected):is(:hover,:focus-visible){
  background:
    linear-gradient(#ffffff,#ffffff) padding-box,
    linear-gradient(90deg, #bf63ff 0%, #a653ff 44%, #76f3ba 56%, #31ea7b 100%) border-box;
  color:#1a2640;
}


/* v2.0.9 — mixed filter selected state matches hover, with stronger inner border and gradient text */
#cost-tabs[data-scope="all"] button.selected,
#schedule-cost-tabs[data-scope="all"] button.selected{
  background:
    linear-gradient(var(--surface, rgba(10,14,22,.97)), var(--surface, rgba(10,14,22,.97))) padding-box,
    linear-gradient(90deg, #c86bff 0%, #9f56ff 44%, #7cf6c0 56%, #34ef82 100%) border-box,
    linear-gradient(90deg, #e9b5ff 0%, #ffffff 48%, #bdf9df 52%, #86ffd0 100%) text;
  background-clip:padding-box,border-box,text;
  -webkit-background-clip:padding-box,border-box,text;
  border:1.65px solid transparent;
  color:transparent;
  -webkit-text-fill-color:transparent;
  text-shadow:none;
  box-shadow:
    inset 2px 0 0 rgba(200,107,255,.34),
    inset -2px 0 0 rgba(52,239,130,.30),
    inset 0 0 0 1.2px rgba(255,255,255,.04),
    0 0 0 1px rgba(200,107,255,.16),
    0 0 22px rgba(200,107,255,.16),
    0 0 22px rgba(52,239,130,.12);
}
#cost-tabs[data-scope="all"] button.selected:hover,
#cost-tabs[data-scope="all"] button.selected:focus-visible,
#schedule-cost-tabs[data-scope="all"] button.selected:hover,
#schedule-cost-tabs[data-scope="all"] button.selected:focus-visible{
  background:
    linear-gradient(var(--surface, rgba(10,14,22,.97)), var(--surface, rgba(10,14,22,.97))) padding-box,
    linear-gradient(90deg, #d174ff 0%, #ab62ff 44%, #89ffd0 56%, #39f58a 100%) border-box,
    linear-gradient(90deg, #efc4ff 0%, #ffffff 48%, #c8ffe7 52%, #95ffda 100%) text;
  background-clip:padding-box,border-box,text;
  -webkit-background-clip:padding-box,border-box,text;
  box-shadow:
    inset 2.2px 0 0 rgba(200,107,255,.40),
    inset -2.2px 0 0 rgba(52,239,130,.36),
    inset 0 0 0 1.3px rgba(255,255,255,.05),
    0 0 0 1px rgba(200,107,255,.18),
    0 0 26px rgba(200,107,255,.20),
    0 0 26px rgba(52,239,130,.16);
}
#cost-tabs[data-scope="all"] button:not(.selected):is(:hover,:focus-visible),
#schedule-cost-tabs[data-scope="all"] button:not(.selected):is(:hover,:focus-visible){
  background:
    linear-gradient(var(--surface, rgba(10,14,22,.97)), var(--surface, rgba(10,14,22,.97))) padding-box,
    linear-gradient(90deg, #c86bff 0%, #9f56ff 44%, #7cf6c0 56%, #34ef82 100%) border-box,
    linear-gradient(90deg, #e1a5ff 0%, #ffffff 48%, #bdf9df 52%, #7ffdd0 100%) text;
  background-clip:padding-box,border-box,text;
  -webkit-background-clip:padding-box,border-box,text;
  border:1.5px solid transparent;
  color:transparent;
  -webkit-text-fill-color:transparent;
  text-shadow:none;
  box-shadow:inset 1px 0 0 rgba(200,107,255,.24),inset -1px 0 0 rgba(52,239,130,.22),0 0 0 1px rgba(200,107,255,.12),0 0 18px rgba(200,107,255,.10),0 0 18px rgba(52,239,130,.08);
}
html[data-theme="light"] #cost-tabs[data-scope="all"] button.selected,
html[data-theme="light"] #schedule-cost-tabs[data-scope="all"] button.selected,
html[data-theme="light"] #cost-tabs[data-scope="all"] button.selected:hover,
html[data-theme="light"] #schedule-cost-tabs[data-scope="all"] button.selected:hover,
html[data-theme="light"] #cost-tabs[data-scope="all"] button.selected:focus-visible,
html[data-theme="light"] #schedule-cost-tabs[data-scope="all"] button.selected:focus-visible,
html[data-theme="light"] #cost-tabs[data-scope="all"] button:not(.selected):is(:hover,:focus-visible),
html[data-theme="light"] #schedule-cost-tabs[data-scope="all"] button:not(.selected):is(:hover,:focus-visible){
  background:
    linear-gradient(#ffffff,#ffffff) padding-box,
    linear-gradient(90deg, #c86bff 0%, #a85bff 44%, #7cf6c0 56%, #34ef82 100%) border-box,
    linear-gradient(90deg, #aa56ff 0%, #8e4dff 34%, #2fcb81 72%, #25b96e 100%) text;
  background-clip:padding-box,border-box,text;
  -webkit-background-clip:padding-box,border-box,text;
}


/* v2.0.12 — mixed chat never unmounts when changing site tabs or viewport. */
#chat-frames{position:relative;overflow:hidden;isolation:isolate;}
#chat-frames > .chat-frame-wrap.official{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:1;
}
#chat-frames > .chat-frame-wrap.official.chat-view-hidden{
  opacity:0;pointer-events:none;z-index:0;
  /* Still attached, with its original size: the widget keeps its messages. */
}
/* Older styles hide the entire chat panel with display:none. Keep it mounted
   and fully invisible instead, including at responsive breakpoints. */
.shell:not(.has-side-chat) > #chat-panel.chat-keepalive-offscreen,
.shell.has-side-chat > #chat-panel.chat-keepalive-offscreen{
  display:block!important;position:fixed!important;
  top:92px!important;right:24px!important;
  width:344px!important;height:calc(100dvh - 112px)!important;
  opacity:0!important;clip-path:inset(100%)!important;
  pointer-events:none!important;z-index:-1!important;
}


/* v2.0.14 — Full editorial details: natural expansion with viewport-safe scroll. */
#detail-modal{align-items:safe center;overflow-y:auto;overscroll-behavior:contain}
.badge-detail-modal{height:auto;max-height:min(94vh,960px);max-height:min(94dvh,960px);overflow-x:hidden;overflow-y:auto;scrollbar-gutter:stable;overscroll-behavior:contain}
#detail-content,.detail-body,.detail-text-section{min-height:0;height:auto;max-height:none}
.detail-text-section p{display:block;overflow:visible;max-height:none;line-clamp:unset;-webkit-line-clamp:unset;white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal;text-overflow:clip}
@media(max-width:590px){.badge-detail-modal{max-height:calc(100vh - 20px);max-height:calc(100dvh - 20px);scrollbar-gutter:auto}}

/* v2.0.15: date centered above artwork; condition below start. */
.detail-added-top{display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;gap:5px;margin:0 auto 17px;padding:0 42px;color:#aab3c6;font-size:12px;line-height:1.55;text-align:center}
.detail-added-top strong{color:#f2eefb;font-size:12px;font-weight:750;font-variant-numeric:tabular-nums}
.detail-facts{grid-template-areas:"start end" "requirement category"}
.detail-facts:has(.detail-fact--campaign){grid-template-areas:"start end" "requirement category" "campaign campaign"}
.detail-fact--start{grid-area:start}
.detail-fact--end{grid-area:end}
.detail-fact--requirement{grid-area:requirement}
.detail-fact--category{grid-area:category}
.detail-fact--campaign{grid-area:campaign}
.detail-fact--requirement strong{font-size:13px;line-height:1.6}
html[data-theme="light"] .detail-added-top{color:#576176}
html[data-theme="light"] .detail-added-top strong{color:#25324a}
@media(max-width:440px){
 .detail-added-top{padding:0 28px;font-size:11px;margin-bottom:14px}
 .detail-added-top strong{font-size:11px}
 .detail-facts{grid-template-columns:minmax(0,1fr);grid-template-areas:"start" "requirement" "end" "category"}
 .detail-facts:has(.detail-fact--campaign){grid-template-areas:"start" "requirement" "end" "category" "campaign"}
}

/* BADDGES card-only platform emblems; social and navigation icons are unchanged. */
.badge-card .card-top-left .card-platform-mark {
  display:block;
  width:21px;
  height:21px;
  object-fit:contain;
  flex:none;
  align-self:start;
  margin-top:1px;
}


/* v2.0.21 — aligned card header and reserved category/date footer */
/* Keep the activity label, platform B and FREE/PAID on one vertical axis. */
.badge-card .card-top {
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
}
.badge-card .card-top-left {
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
}
.badge-card .card-top .live-badge {
  align-items:center;
}
.badge-card .card-top .live-dot {
  margin-top:0;
  align-self:center;
}
.badge-card .card-top .card-platform-mark,
.badge-card .card-top .cost-flag {
  align-self:center;
  margin-top:0;
}
/* This group is pinned to the bottom regardless of badge-title length. */
.badge-card .badge-card-meta {
  display:flex;
  flex-direction:column;
  flex-shrink:0;
  margin-top:auto;
  gap:7px;
  min-width:0;
}
/* Always reserve space ABOVE the date for an optional category. */
.badge-card .badge-category-slot {
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-height:44px;
  min-width:0;
}
.badge-card .badge-category-slot .badge-category-link {
  width:100%;
  min-width:0;
  margin:0;
}
/* Dates sit at the same baseline across cards, even if some wrap. */
.badge-card .badge-added-date,
.badge-card.upcoming .badge-added-date {
  display:flex;
  flex-wrap:wrap;
  align-content:flex-end;
  align-items:baseline;
  min-height:33px;
  margin:0 0 10px;
}
/* Do not let the progress section absorb extra vertical space on its own. */
.badge-card .progress-summary {
  margin-top:0;
}
@media(max-width:560px){
  .badge-card .card-top {grid-template-columns:minmax(0,1fr) auto;}
  .badge-card .badge-category-slot {min-height:42px;}
}


/* v2.0.22 — expanded list of eligible categories in badge detail modal */
.detail-other-categories{border:1px solid #353e4f;border-radius:13px;margin:12px 0 20px;overflow:hidden;background:rgba(110,123,157,.055)}
.detail-other-categories summary{display:flex;justify-content:space-between;gap:10px;align-items:center;cursor:pointer;padding:13px 16px;font-size:13px;font-weight:730;color:var(--text,#f5f8ff);list-style:none}
.detail-other-categories summary::-webkit-details-marker{display:none}
.detail-category-chevron{font-size:17px;transition:transform .18s ease;color:var(--muted,#a1adc1)}
.detail-other-categories[open] .detail-category-chevron{transform:rotate(180deg)}
.detail-other-category-grid{display:flex;flex-wrap:wrap;gap:10px;padding:13px 15px 16px;border-top:1px solid #30394a}
.detail-other-category-grid .detail-fact-category-link{max-width:100%;min-width:0;box-sizing:border-box}
.detail-other-category-grid .detail-fact-category-name{overflow-wrap:anywhere}
.detail-category-static{cursor:default}
html[data-theme="light"] .detail-other-categories{background:#fafbff;border-color:#d9e0ed}
html[data-theme="light"] .detail-other-categories summary{color:#27364e}
html[data-theme="light"] .detail-other-category-grid{border-color:#d9e0ed}


/* v2.0.23 — platform-branded chat headings and translated Follow buttons.
   The third-party chat iframe is untouched and the mixed one stays mounted. */
#chat-frames .chat-official-head{
 position:relative;display:flex;justify-content:center;align-items:center;
 min-height:47px;padding:8px 10px;gap:8px;
}
#chat-frames .chat-official-head .chat-heading-link{
 display:inline-flex;align-items:center;justify-content:center;gap:7px;
 min-width:0;font-weight:800;font-size:13px;line-height:1.25;
 text-decoration:none;white-space:nowrap;transition:filter .18s ease,opacity .18s ease;
}
#chat-frames .chat-official-head .chat-heading-link:hover,
#chat-frames .chat-official-head .chat-heading-link:focus-visible{
 text-decoration:none;filter:brightness(1.3);
}
#chat-frames .chat-official-head .chat-heading-twitch,
html[data-theme="light"] #chat-frames .chat-official-head .chat-heading-twitch{color:#ba77ff;}
#chat-frames .chat-official-head .chat-heading-kick,
html[data-theme="light"] #chat-frames .chat-official-head .chat-heading-kick{color:#37ee83;}
#chat-frames .chat-heading-icon{display:block;flex:none;width:21px;height:21px;object-fit:contain;}
#chat-frames .chat-official-head .chat-follow-button{
 position:absolute;right:10px;top:50%;transform:translateY(-50%);
 display:inline-flex;align-items:center;justify-content:center;gap:5px;
 padding:7px 9px;border-radius:7px;border:1px solid #4bea1c;
 background:#53f71e;color:#061207;font-size:11px;font-weight:800;
 white-space:nowrap;text-decoration:none;line-height:1.1;
 transition:background-color .18s ease,box-shadow .18s ease;
}
#chat-frames .chat-official-head .chat-follow-button:hover,
#chat-frames .chat-official-head .chat-follow-button:focus-visible{
 color:#061207;background:#69ff36;text-decoration:none;
 box-shadow:0 0 13px rgba(84,255,43,.35);
}
#chat-frames .chat-follow-heart{font-size:17px;line-height:10px;font-weight:800;}
#chat-frames .chat-heading-mixed{
 display:inline-flex;align-items:center;justify-content:center;gap:11px;
 font-size:13px;line-height:1.2;font-weight:800;white-space:nowrap;
}
#chat-frames .chat-mixed-brand{display:inline-flex;align-items:center;gap:5px;}
#chat-frames .chat-mixed-kick{color:#39e97c;}
#chat-frames .chat-mixed-twitch{color:#b779ff;}
#chat-frames .chat-heading-plus{font-size:15px;color:#9da9be;}
html[data-theme="light"] #chat-frames .chat-mixed-kick{color:#159f53;}
html[data-theme="light"] #chat-frames .chat-mixed-twitch{color:#8735cb;}
html[data-theme="light"] #chat-frames .chat-heading-plus{color:#5d6882;}
@media(max-width:350px){
 #chat-frames .chat-official-head .chat-heading-link{font-size:12px;gap:4px;}
 #chat-frames .chat-heading-icon{width:17px;height:17px;}
 #chat-frames .chat-official-head .chat-follow-button{padding:6px 7px;font-size:10px;right:7px;}
}


/* v2.0.26 — separate, accessible Kick and Twitch links in the persistent mixed-chat title. */
#chat-frames .chat-official-head .chat-heading-mixed a.chat-mixed-brand{
  display:inline-flex;align-items:center;gap:5px;
  padding:5px 2px;margin:-5px -2px;
  font-size:13px;line-height:1.2;font-weight:800;
  text-decoration:none;cursor:pointer;
  transition:filter .18s ease,opacity .18s ease;
}
#chat-frames .chat-official-head .chat-heading-mixed a.chat-mixed-kick,
html[data-theme="light"] #chat-frames .chat-official-head .chat-heading-mixed a.chat-mixed-kick{color:#39e97c;}
#chat-frames .chat-official-head .chat-heading-mixed a.chat-mixed-twitch,
html[data-theme="light"] #chat-frames .chat-official-head .chat-heading-mixed a.chat-mixed-twitch{color:#b779ff;}
html[data-theme="light"] #chat-frames .chat-official-head .chat-heading-mixed a.chat-mixed-kick{color:#159f53;}
html[data-theme="light"] #chat-frames .chat-official-head .chat-heading-mixed a.chat-mixed-twitch{color:#8735cb;}
#chat-frames .chat-official-head .chat-heading-mixed a.chat-mixed-brand:hover,
#chat-frames .chat-official-head .chat-heading-mixed a.chat-mixed-brand:focus-visible{
  filter:brightness(1.24);text-decoration:none;
}
#chat-frames .chat-official-head .chat-heading-mixed a.chat-mixed-brand:focus-visible{
  outline:2px solid currentColor;outline-offset:2px;border-radius:4px;
}


/* v2.0.27 — Follow button colors by platform and a fixed vector heart. */
#chat-frames .chat-follow-heart{
 display:block;flex:0 0 16px;width:16px;height:16px;
 min-width:16px;min-height:16px;
 font-size:initial;line-height:normal;overflow:visible;
}
#chat-frames .chat-official-head .chat-follow-button{
 gap:6px;white-space:nowrap;
}
#chat-frames .chat-official-head .chat-follow-button .chat-follow-text{
 display:inline-block;flex:0 0 auto;white-space:nowrap;
}
#chat-frames .chat-frame-wrap.official.twitch .chat-official-head .chat-follow-button,
html[data-theme="light"] #chat-frames .chat-frame-wrap.official.twitch .chat-official-head .chat-follow-button{
 color:#ffffff;background:#9948ec;border-color:#b673ff;
 box-shadow:0 0 0 1px rgba(153,72,236,.08),0 2px 9px rgba(153,72,236,.16);
}
#chat-frames .chat-frame-wrap.official.twitch .chat-official-head .chat-follow-button:hover,
#chat-frames .chat-frame-wrap.official.twitch .chat-official-head .chat-follow-button:focus-visible,
html[data-theme="light"] #chat-frames .chat-frame-wrap.official.twitch .chat-official-head .chat-follow-button:hover,
html[data-theme="light"] #chat-frames .chat-frame-wrap.official.twitch .chat-official-head .chat-follow-button:focus-visible{
 color:#ffffff;background:#af67ff;border-color:#cb94ff;
 box-shadow:0 0 14px rgba(170,92,250,.32);
}


/* v2.0.31 — category region after title; expiry moves above the added-on date.
   Keep the bottom rows aligned even when badge names have different lengths. */
.badge-card > .badge-category-slot{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  flex:0 0 auto;
  min-height:52px;
  margin-top:14px;
  min-width:0;
}
.badge-card > .badge-category-slot .badge-category-link{
  width:100%;
  margin:0;
  min-width:0;
}
.badge-card .badge-card-meta{
  margin-top:auto;
  gap:7px;
  flex-shrink:0;
}
.badge-card .badge-expire-block{
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  flex-shrink:0;
  min-height:61px;
  margin:0 0 1px;
}
.badge-card .badge-expire-block .badge-expire-label{
  margin-top:0;
}
.badge-card .badge-expire-block .badge-expire{
  margin-top:4px;
  min-height:0;
}
@media(max-width:560px){
  .badge-card > .badge-category-slot{min-height:46px;margin-top:12px;}
  .badge-card .badge-expire-block{min-height:58px;}
}


/* v2.0.33 — linked platform heading above status, aligned with FREE/PAID. */
.badge-card .card-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:"platform cost" "status status";
  align-items:center;
  gap:3px 8px;
  margin-bottom:0;
}
.badge-card .card-top > .card-platform-link{
  grid-area:platform;
  display:inline-flex;
  align-items:center;
  gap:5px;
  justify-self:start;
  align-self:center;
  min-width:0;
  max-width:100%;
  padding:2px 4px 2px 0;
  border-radius:6px;
  text-decoration:none;
  color:var(--card-platform-text, #d9c5ff);
  font-weight:800;
  font-size:12px;
  line-height:1.25;
  white-space:nowrap;
  cursor:pointer;
  transition:color .18s ease,text-shadow .2s ease,filter .2s ease;
}
.badge-card.twitch{--card-platform-text:#dcc7ff;--card-platform-hover:#b966ff;--card-platform-glow:rgba(179,88,255,.60)}
.badge-card.kick{--card-platform-text:#c4f6d9;--card-platform-hover:#32ed86;--card-platform-glow:rgba(46,234,132,.52)}
.badge-card .card-top .card-platform-mark{
  display:block;
  width:20px;
  height:20px;
  object-fit:contain;
  flex:0 0 20px;
  margin:0;
}
.badge-card .card-top .card-platform-link:is(:hover,:focus-visible){
  color:var(--card-platform-hover);
  text-shadow:0 0 9px var(--card-platform-glow),0 0 16px var(--card-platform-glow);
}
.badge-card .card-top .card-platform-link:is(:hover,:focus-visible) .card-platform-mark{
  filter:drop-shadow(0 0 5px var(--card-platform-glow));
}
.badge-card .card-top .card-platform-link:focus-visible{
  outline:2px solid var(--card-platform-hover);
  outline-offset:2px;
}
.badge-card .card-top > .cost-flag{
  grid-area:cost;
  justify-self:end;
  align-self:center;
  margin:0;
}
.badge-card .card-top > .live-badge{
  grid-area:status;
  justify-self:start;
  align-items:center;
  min-height:16px;
  margin:0;
  padding-left:2px;
}
.badge-card .card-top > .live-badge .live-dot{align-self:center;margin:0}
/* Bring badge artwork nearer the ACTIVE line, without cropping it. */
.badge-card .card-media{margin-top:1px;min-height:88px}
html[data-theme="light"] .badge-card.twitch{--card-platform-text:#743bb6;--card-platform-hover:#9224e8}
html[data-theme="light"] .badge-card.kick{--card-platform-text:#097942;--card-platform-hover:#09ae59}
/* Preserve the v2.0.32 light-theme black outline even on link hover. */
html[data-theme="light"] .badge-card .card-top .card-platform-link:is(:hover,:focus-visible) .card-platform-mark{
  filter:drop-shadow(1px 0 0 #090b10) drop-shadow(-1px 0 0 #090b10) drop-shadow(0 1px 0 #090b10) drop-shadow(0 -1px 0 #090b10) drop-shadow(0 0 4px var(--card-platform-glow));
}
@media(max-width:560px){
  .badge-card .card-top{grid-template-columns:minmax(0,1fr) auto;}
  .badge-card .card-top > .cost-flag{justify-self:end;}
}
@media(prefers-reduced-motion:reduce){.badge-card .card-top .card-platform-link{transition:none}}

/* v2.0.42 — light mode: keep category text readable on hover. */
html[data-theme="light"] .badge-card .badge-category-slot .badge-category-link{
  background:#f7f9fd;
  border-color:#b9c8d9;
  color:#41526d;
}
html[data-theme="light"] .badge-card.kick .badge-category-slot .badge-category-link{
  border-color:#7fd3a6;
  color:#157848;
}
html[data-theme="light"] .badge-card.twitch .badge-category-slot .badge-category-link{
  border-color:#c9b0ec;
  color:#6d43ab;
}
html[data-theme="light"] .badge-card .badge-category-slot .badge-category-link>span,
html[data-theme="light"] .badge-card .badge-category-slot .badge-category-link small,
html[data-theme="light"] .badge-card .badge-category-slot .badge-category-link .category-placeholder{
  color:inherit;
}
html[data-theme="light"] .badge-card .badge-category-slot .badge-category-link:is(:hover,:focus-visible){
  background:#ffffff;
  color:#263754;
  border-color:#8fa6c8;
  box-shadow:0 0 0 1px rgba(120,139,168,.12),0 6px 18px rgba(148,161,184,.16);
}
html[data-theme="light"] .badge-card.kick .badge-category-slot .badge-category-link:is(:hover,:focus-visible){
  color:#0d7843;
  border-color:#2bc56d;
  box-shadow:0 0 0 1px rgba(43,197,109,.10),0 7px 18px rgba(43,197,109,.14);
}
html[data-theme="light"] .badge-card.twitch .badge-category-slot .badge-category-link:is(:hover,:focus-visible){
  color:#6c31bb;
  border-color:#a36cf3;
  box-shadow:0 0 0 1px rgba(163,108,243,.10),0 7px 18px rgba(163,108,243,.14);
}


/* v2.0.34 — bell: two clear colors, no rectangular glow artifacts.
   All BADDGES tabs keep the recognizable purple/green split. */
#community-panel .community-bell,
#community-panel[data-page="all"] .community-bell,
#community-panel[data-page="kick"] .community-bell,
#community-panel[data-page="twitch"] .community-bell {
  box-sizing:border-box;
  width:52px;
  height:52px;
  border-radius:16px;
  border:3px solid transparent!important;
  background:linear-gradient(#131822,#131822) padding-box,
             linear-gradient(90deg,#b65df5 0%,#b65df5 47%,#2ada84 53%,#2ada84 100%) border-box!important;
  box-shadow:0 2px 8px rgba(154,67,208,.09),0 2px 8px rgba(36,204,114,.08)!important;
  filter:none!important;
  outline-offset:3px;
}
#community-panel .community-bell:is(:hover,:focus-visible),
#community-panel[data-page="all"] .community-bell:is(:hover,:focus-visible){
  box-shadow:0 3px 12px rgba(154,67,208,.15),0 3px 12px rgba(36,204,114,.13)!important;
}
#community-panel .community-bell svg,
#community-panel[data-page="all"] .community-bell svg{
  width:30px!important;
  height:30px!important;
  filter:none!important; /* an SVG filter painted a square-looking aura */
  overflow:visible;
}
#community-panel .community-bell svg path{
  stroke:url(#community-bell-stroke)!important;
  stroke-width:2.3px!important;
}
#community-panel .community-bell svg stop:nth-child(-n+2){stop-color:#c478ff}
#community-panel .community-bell svg stop:nth-child(n+3){stop-color:#4bf099}
html[data-theme="light"] #community-panel .community-bell,
html[data-theme="light"] #community-panel[data-page="all"] .community-bell,
html[data-theme="light"] #community-panel[data-page="kick"] .community-bell,
html[data-theme="light"] #community-panel[data-page="twitch"] .community-bell{
  background:linear-gradient(#fff,#fff) padding-box,
             linear-gradient(90deg,#9635d2 0%,#9635d2 47%,#139e5d 53%,#139e5d 100%) border-box!important;
  border-width:3px!important;
  box-shadow:0 2px 7px rgba(111,45,161,.10),0 2px 7px rgba(13,130,76,.07)!important;
}
html[data-theme="light"] #community-panel .community-bell svg path{stroke-width:2.55px!important}
html[data-theme="light"] #community-panel .community-bell svg stop:nth-child(-n+2){stop-color:#842cbd}
html[data-theme="light"] #community-panel .community-bell svg stop:nth-child(n+3){stop-color:#078c4a}
html[data-theme="light"] #community-panel .community-bell:is(:hover,:focus-visible){
  box-shadow:0 3px 10px rgba(111,45,161,.16),0 3px 10px rgba(13,130,76,.12)!important;
}


/* v2.0.35 — Single-line social names, softer shadows without losing colored outlines. */
.shell.has-community .community-card-copy{justify-content:center;gap:0;}
.shell.has-community .community-card-copy strong{line-height:1.25;}
.shell.has-community .community-card,
html[data-theme="dark"] .shell.has-community .community-card{
  box-shadow:0 7px 18px rgba(0,0,0,.13),0 0 8px color-mix(in srgb,var(--community-accent) 9%,transparent)!important;
}
html[data-theme="light"] .shell.has-community .community-card{
  box-shadow:0 8px 18px rgba(55,75,113,.13),0 0 9px color-mix(in srgb,var(--community-accent) 11%,transparent)!important;
}
html[data-theme="dark"] .shell.has-community .community-card:not(.is-unset):is(:hover,:focus-visible){
  box-shadow:0 11px 22px rgba(0,0,0,.19),0 0 16px color-mix(in srgb,var(--community-accent) 18%,transparent)!important;
}
html[data-theme="light"] .shell.has-community .community-card:not(.is-unset):is(:hover,:focus-visible){
  box-shadow:0 12px 23px rgba(55,75,113,.16),0 0 18px color-mix(in srgb,var(--community-accent) 20%,transparent)!important;
}
.community-heading-underline{box-shadow:0 0 8px rgba(170,86,240,.35);}


/* v2.0.36 — solid bell in every platform tab; no underline beneath the heading.
   Keep the purple/green button outline from v2.0.34 unchanged. */
#community-panel .community-bell,
#community-panel[data-page="all"] .community-bell,
#community-panel[data-page="kick"] .community-bell,
#community-panel[data-page="twitch"] .community-bell {
  color:#ffffff!important;
}
#community-panel .community-bell svg path,
#community-panel[data-page="all"] .community-bell svg path,
#community-panel[data-page="kick"] .community-bell svg path,
#community-panel[data-page="twitch"] .community-bell svg path {
  stroke:currentColor!important;
}
html[data-theme="light"] #community-panel .community-bell,
html[data-theme="light"] #community-panel[data-page="all"] .community-bell,
html[data-theme="light"] #community-panel[data-page="kick"] .community-bell,
html[data-theme="light"] #community-panel[data-page="twitch"] .community-bell {
  color:#111111!important;
}
/* The underline element is removed from the HTML. Reserve no extra gap. */
#community-panel .community-panel-header{gap:8px;padding-bottom:19px;}


/* v2.0.37 — monochrome bell and monochrome border in all tabs.
   Dark theme: white icon + white border. Light theme: black icon + black border. */
#community-panel .community-bell,
#community-panel[data-page="all"] .community-bell,
#community-panel[data-page="kick"] .community-bell,
#community-panel[data-page="twitch"] .community-bell{
  color:#ffffff!important;
  border:2px solid currentColor!important;
  background:transparent!important;
  box-shadow:none!important;
}
#community-panel .community-bell svg,
#community-panel[data-page="all"] .community-bell svg,
#community-panel[data-page="kick"] .community-bell svg,
#community-panel[data-page="twitch"] .community-bell svg{
  filter:none!important;
}
#community-panel .community-bell svg path,
#community-panel[data-page="all"] .community-bell svg path,
#community-panel[data-page="kick"] .community-bell svg path,
#community-panel[data-page="twitch"] .community-bell svg path{
  stroke:currentColor!important;
}
#community-panel .community-bell:is(:hover,:focus-visible),
#community-panel[data-page="all"] .community-bell:is(:hover,:focus-visible),
#community-panel[data-page="kick"] .community-bell:is(:hover,:focus-visible),
#community-panel[data-page="twitch"] .community-bell:is(:hover,:focus-visible){
  color:#ffffff!important;
  border-color:currentColor!important;
  background:transparent!important;
  box-shadow:none!important;
}
html[data-theme="light"] #community-panel .community-bell,
html[data-theme="light"] #community-panel[data-page="all"] .community-bell,
html[data-theme="light"] #community-panel[data-page="kick"] .community-bell,
html[data-theme="light"] #community-panel[data-page="twitch"] .community-bell{
  color:#111111!important;
  border-color:currentColor!important;
  background:transparent!important;
  box-shadow:none!important;
}
html[data-theme="light"] #community-panel .community-bell:is(:hover,:focus-visible),
html[data-theme="light"] #community-panel[data-page="all"] .community-bell:is(:hover,:focus-visible),
html[data-theme="light"] #community-panel[data-page="kick"] .community-bell:is(:hover,:focus-visible),
html[data-theme="light"] #community-panel[data-page="twitch"] .community-bell:is(:hover,:focus-visible){
  color:#111111!important;
  border-color:currentColor!important;
  background:transparent!important;
  box-shadow:none!important;
}


/* BADDGES Schedule — monochrome access symbols, readable on Twitch and Kick bars. */
.timeline-bar .timeline-access-icon{display:block;flex:0 0 18px;width:18px;height:18px;stroke:#fff;fill:none;filter:drop-shadow(0 1px 1px rgba(0,0,0,.62));pointer-events:none}
.timeline-bar.kick .timeline-access-icon{filter:drop-shadow(0 1px 2px rgba(0,28,9,.78))}
.timeline-row-mobile .timeline-bar .timeline-access-icon{width:17px;height:17px;flex-basis:17px}
@media(max-width:760px){
 .timeline-row-mobile .timeline-bar{gap:6px}
 .timeline-row-mobile .timeline-bar-mini{width:22px;height:22px;flex-basis:22px}
}


/* BADDGES 2.0.42 — Timeline only: keep badge image, name and expiry inside the bar.
   Scope every rule to inline schedule rows; never override cards or navigation. */
.timeline-row.timeline-row-inline{
  display:block;
  grid-template-columns:none;
  gap:0;
  min-height:54px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  text-align:left;
}
.timeline-row.timeline-row-inline:hover,
.timeline-row.timeline-row-inline:focus-visible{
  background:transparent;
  outline:none;
}
.timeline-row-inline .timeline-lane-inline{
  display:block;
  position:relative;
  height:54px;
  border-radius:9px;
  background:repeating-linear-gradient(90deg,#111823 0,#111823 95px,#263040 95px,#263040 96px);
}
.timeline-row-inline .timeline-bar{
  top:5px;
  height:44px;
  min-width:126px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:5px 10px;
  border-radius:9px;
  white-space:nowrap;
}
.timeline-row-inline .timeline-bar.milestone{
  min-width:7px;
  width:7px!important;
  padding:0;
}
.timeline-row-inline .timeline-bar-mini{
  display:block;
  flex:0 0 26px;
  width:26px;
  height:26px;
  border-radius:6px;
  object-fit:contain;
}
.timeline-row-inline .timeline-bar-copy{
  min-width:0;
  max-width:100%;
  display:flex;
  flex-direction:column;
  gap:2px;
  overflow:hidden;
}
.timeline-row-inline .timeline-bar-name{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:11px;
  font-weight:800;
}
.timeline-row-inline .timeline-bar-meta{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:10px;
  font-weight:650;
  line-height:1.15;
  opacity:.9;
}
@media (max-width:760px){
  .timeline-board-wrap.mobile-schedule{padding:10px;}
  .timeline-board-wrap.mobile-schedule .timeline-day{flex-basis:92px;}
  .timeline-board-wrap.mobile-schedule .timeline-lane-inline{
    height:56px;
    background:repeating-linear-gradient(90deg,#111823 0,#111823 91px,#263040 91px,#263040 92px);
  }
  .timeline-board-wrap.mobile-schedule .timeline-row-inline .timeline-bar{
    top:6px;
    height:44px;
    min-width:126px;
    font-size:11px;
  }
  .timeline-board-wrap.mobile-schedule .timeline-row-inline .timeline-bar.milestone{min-width:7px;}
  .timeline-board-wrap.mobile-schedule .timeline-row-inline .timeline-bar-meta{font-size:9px;}
}


/* Requirement status when no campaign conditions have been announced. */
.badge-card .badge-requirement-pending{
  color:#e6d6ff;background:rgba(151,79,228,.11);border:1px solid rgba(176,113,245,.28);
  border-radius:8px;padding:6px 8px;font-size:10px;font-weight:800;line-height:1.4;overflow-wrap:anywhere;
}
.badge-card.kick .badge-requirement-pending{color:#adffd3;background:rgba(27,185,107,.11);border-color:rgba(52,226,124,.30)}
.badge-card .badge-requirement-pending span{font-weight:750}
html[data-theme="light"] .badge-card .badge-requirement-pending{color:#623b99;background:#f4ebfe;border-color:#c5a6e7}
html[data-theme="light"] .badge-card.kick .badge-requirement-pending{color:#0b7140;background:#ecfff3;border-color:#8adab0}

/* Universal-category choice (Studio + HUB). No icon, image, or generated link. */
.badge-card .badge-category-link.category-any {
 display:flex;justify-content:center;align-items:center;text-align:center;min-height:36px;
 font-weight:750;font-size:11px;letter-spacing:.015em;
}
.badge-card .badge-category-link.category-any>span {flex:initial;overflow:visible;text-overflow:clip;white-space:normal;}
html[data-theme="light"] .badge-card .badge-category-link.category-any {color:#29394f;}
.category-any-picker {display:flex;align-items:stretch;gap:8px;min-width:0;}
.category-any-picker #badge-category {flex:1 1 auto;min-width:0;}
.category-any-picker button {flex:0 0 auto;padding:8px 14px;border-radius:9px;white-space:nowrap;}
.category-any-picker button[aria-pressed="true"] {color:#e7d1ff;border-color:#9857f0;background:#302047;}
html[data-theme="light"] .category-any-picker button[aria-pressed="true"] {color:#60239e;border-color:#a971ed;background:#eee3fc;}
.category-any-help {display:block;padding-top:4px;line-height:1.35;color:var(--muted,#9eafc2);font-size:11px;}
.category-any-help[hidden] {display:none;}

/* Any category remains text-only, but is an accessible link to Twitch/Kick. */
a.badge-category-link.category-any, a.detail-fact-category-link.category-any{cursor:pointer;text-decoration:none;transition:border-color .15s,background-color .15s,color .15s,box-shadow .15s;}
a.badge-category-link.category-any:is(:hover,:focus-visible){color:#ffffff;border-color:#b48aff;background:#201a34;box-shadow:0 0 0 1px rgba(166,111,255,.15);}
html[data-theme="light"] a.badge-category-link.category-any:is(:hover,:focus-visible){color:#202e45;background:#f5f9ff;border-color:#8c9cb7;}
a.detail-fact-category-link.category-any:is(:hover,:focus-visible){border-color:#b48aff;color:#fff;}
html[data-theme="light"] a.detail-fact-category-link.category-any:is(:hover,:focus-visible){color:#202e45;background:#f5f9ff;}

/* BADDGES v23: Arabic reading direction, preserving the card and header grid. */
html[lang="ar"] .badge-detail-modal,
html[lang="ar"] .badge-detail,
html[lang="ar"] .badge-card,
html[lang="ar"] .language-menu,
html[lang="ar"] .timeline-shell,
html[lang="ar"] .section-description,
html[lang="ar"] .section-header,
html[lang="ar"] .translation-language-row {direction:rtl; text-align:start;}
html[lang="ar"] .badge-card img, html[lang="ar"] .badge-detail img {direction:ltr;}
html[lang="ar"] input,html[lang="ar"] textarea {direction:rtl;text-align:start;}
.language-menu {max-height:min(67vh,560px);overflow-y:auto;overscroll-behavior:contain;}
.language-menu .language-short {min-width:2.3em;}

/* Keep the established site grid aligned in Arabic while allowing RTL badge text. */
html[lang="ar"] .app-shell,html[lang="ar"] .app-container,html[lang="ar"] .site-shell {direction:ltr;}
html[lang="ar"] .language-menu, html[lang="ar"] .badge-detail-modal {direction:rtl;}

/* BADDGES v24 — Unified, responsive FREE / PAID / UNCLASSIFIED labels. */
.cost-flag,
.detail-type {
  box-sizing:border-box;
  display:inline-flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  min-width:0;
  max-width:min(100%,152px);
  min-height:28px;
  padding:5px 11px;
  border-radius:999px;
  border:1.5px solid;
  font-size:11.5px;
  font-weight:850;
  line-height:1.2;
  letter-spacing:.016em;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:normal;
  flex-shrink:1;
  text-wrap:balance;
}
.cost-flag.free,.detail-type.free{color:#80f9b5;background:#102e20;border-color:#279657}
.cost-flag.paid,.detail-type.paid{color:#f3f8ff;background:#092445;border-color:#258dff}
.cost-flag.unknown,.detail-type.unknown{color:#bdc8d8;background:#202936;border-color:#526071}
.cost-flag.cost-label-compact,.detail-type.cost-label-compact{font-size:9.5px;padding-inline:8px;letter-spacing:0}
.cost-flag.cost-label-tiny,.detail-type.cost-label-tiny{font-size:8.5px;padding-inline:6px;letter-spacing:0}
.detail-type{min-height:31px;max-width:min(100%,210px);font-size:12.5px;padding:6px 13px}
.detail-type.cost-label-compact{font-size:10.5px}
.detail-type.cost-label-tiny{font-size:9.5px}
@media(max-width:560px){
 .badge-card .card-top > .cost-flag{max-width:140px}
 .cost-flag{padding:5px 9px;font-size:11px}
 .cost-flag.cost-label-compact{font-size:9px;padding-inline:6px}
 .cost-flag.cost-label-tiny{font-size:8px;padding-inline:5px}
}

/* BADDGES v28 — Upcoming cards: amber countdown only when start date exists. */
.badge-card.upcoming .progress-summary.start-countdown{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;
  gap:6px 10px;color:#ffd06e;margin-top:auto;margin-bottom:9px;
  font-variant-numeric:tabular-nums;
}
.badge-card.upcoming .start-countdown-time{font-size:12px;font-weight:900;white-space:nowrap;color:inherit}
.badge-card.upcoming .progress-track.start-countdown-track,
.detail-progress.upcoming-start-progress .progress-track.start-countdown-track{
  background:#40331e;overflow:hidden;border-radius:999px;
}
.badge-card.upcoming .progress-track.start-countdown-track .progress-bar,
.detail-progress.upcoming-start-progress .progress-track.start-countdown-track .progress-bar{
  background:linear-gradient(90deg,#dd921e,#ffd45b);box-shadow:0 0 9px rgba(255,186,58,.2);
}
.detail-progress.upcoming-start-progress .detail-progress-titles{
  color:#ffd06e;align-items:center;flex-wrap:wrap;
}
.detail-progress.upcoming-start-progress .start-countdown-time{font-variant-numeric:tabular-nums;color:#ffe0a4}

/* BADDGES v29 — keep the amber countdown label attached to its progress bar.
   The summary (not the track) absorbs the flexible gap above, as for Active.
   Undated cards keep their previous neutral bar layout. */
.badge-card.upcoming .progress-summary.start-countdown{
  margin-top:auto;
  margin-bottom:5px;
  flex-shrink:0;
}
.badge-card.upcoming .progress-summary.start-countdown + .progress-track.start-countdown-track{
  margin-top:0 !important;
  flex-shrink:0;
}
