/* RLM Pulse - the EWC viewership site's design (header block + band, angled cards, Barlow Condensed), in Rat Labs Media colours.
   Brand: lime #8aea2d, slate #27343f. Night (dark) is the default; Day (light) is optional. */
@font-face{font-family:'Barlow Condensed';font-weight:400;font-style:normal;font-display:swap;src:url(fonts/barlow-condensed-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:500;font-style:normal;font-display:swap;src:url(fonts/barlow-condensed-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:600;font-style:normal;font-display:swap;src:url(fonts/barlow-condensed-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:700;font-style:normal;font-display:swap;src:url(fonts/barlow-condensed-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:800;font-style:normal;font-display:swap;src:url(fonts/barlow-condensed-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:700;font-style:italic;font-display:swap;src:url(fonts/barlow-condensed-latin-700-italic.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:800;font-style:italic;font-display:swap;src:url(fonts/barlow-condensed-latin-800-italic.woff2) format('woff2')}

:root, :root[data-theme="dark"]{
  color-scheme: dark;
  --bg:#161513; --surface:#1e1d1a; --surface-2:#272522; --surface-3:#312f2b; --border:#3a3732;
  --text:#f3efe7; --text-2:#c8c1b4; --muted:#968e81;
  --g1:#4f9a10; --g2:#8aea2d; --g3:#6cc41c; --g4:#c8f892;        /* lime ramp: the header block and highlights */
  --accent:#8aea2d; --accent-text:#a6f05a; --accent-soft:rgba(138,234,45,.13); --on-accent:#27343f;
  --good:#8aea2d; --warn:#e9a44c; --bad:#e0614f;
  --band:#211f1c; --band-text:#f3efe7; --band-muted:#a39b8e;
  --tri:rgba(138,234,45,.08); --zebra:rgba(255,248,235,.035);
  --p-twitch:#9b87d6; --p-yt:#ff0033; --p-kick:#53fc18;
}
:root[data-theme="light"]{
  color-scheme: light;
  --bg:#f1ede5; --surface:#f9f6f0; --surface-2:#ede8de; --surface-3:#e3ddd1; --border:#d8d0c2;
  --text:#24221e; --text-2:#4a463e; --muted:#757064;
  --g1:#4f9a10; --g2:#8aea2d; --g3:#6cc41c; --g4:#c8f892;
  --accent:#3f8f0c; --accent-text:#367a0b; --accent-soft:rgba(63,143,12,.12); --on-accent:#f9f6f0;
  --good:#2f7a1a; --warn:#b86b12; --bad:#c9453a;
  --band:#27343f; --band-text:#f6f3ec; --band-muted:#b4c2cc;
  --tri:rgba(63,143,12,.10); --zebra:rgba(60,40,10,.035);
}
@media (prefers-color-scheme: light){:root:not([data-theme]){
  color-scheme: light;
  --bg:#f1ede5; --surface:#f9f6f0; --surface-2:#ede8de; --surface-3:#e3ddd1; --border:#d8d0c2;
  --text:#24221e; --text-2:#4a463e; --muted:#757064;
  --accent:#3f8f0c; --accent-text:#367a0b; --accent-soft:rgba(63,143,12,.12); --on-accent:#f9f6f0;
  --band:#27343f; --band-text:#f6f3ec; --band-muted:#b4c2cc; --tri:rgba(63,143,12,.10); --zebra:rgba(60,40,10,.035);
}}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:500 17px/1.45 'Barlow Condensed','Arial Narrow',Arial,sans-serif;letter-spacing:.01em;-webkit-font-smoothing:antialiased}
a{color:inherit}
p a,li a,.lk{color:var(--accent-text);text-decoration:underline;text-underline-offset:2px}
button{font:inherit;color:inherit}
.page{max-width:1480px;margin:0 auto;padding:18px 20px 40px;position:relative;overflow-x:clip}
/* the faint pulse line behind the content: RLM Pulse's own motif */
body::before{content:"";position:fixed;left:0;right:0;top:150px;height:300px;background:var(--accent);opacity:.09;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 240' preserveAspectRatio='none'%3E%3Cpath d='M0 170 C 120 168 200 150 300 152 S 470 176 560 160 S 700 120 780 128 L 840 128 L 868 40 L 896 214 L 924 92 L 948 128 L 1010 128 C 1100 130 1180 104 1270 112 S 1450 150 1600 132' fill='none' stroke='black' stroke-width='3'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 240' preserveAspectRatio='none'%3E%3Cpath d='M0 170 C 120 168 200 150 300 152 S 470 176 560 160 S 700 120 780 128 L 840 128 L 868 40 L 896 214 L 924 92 L 948 128 L 1010 128 C 1100 130 1180 104 1270 112 S 1450 150 1600 132' fill='none' stroke='black' stroke-width='3'/%3E%3C/svg%3E") center/100% 100% no-repeat;pointer-events:none;z-index:0}
.page>*{position:relative;z-index:1}

/* ---------- header: lime block with the RLM mark, dark band with the page title and navigation ---------- */
.topbar{position:sticky;top:-102px;z-index:40;margin:-18px -20px 18px;padding:24px 20px 0;background:var(--bg);border-bottom:1px solid var(--border)}
.topbar .tb1{display:flex;align-items:stretch;height:84px}
.gold{background:linear-gradient(120deg,var(--g1) 0%,var(--g2) 32%,var(--g3) 55%,var(--g4) 78%,var(--g3) 100%)}
.tbblock{display:flex;align-items:center;gap:14px;padding:0 26px 0 22px;border-radius:8px 0 0 8px;text-decoration:none;color:#27343f;flex:none}
.tbblock img{height:50px;display:block}
.tbblock .rule{width:2px;height:40px;background:#27343f;opacity:.35}
.tbblock .yr{display:flex;align-items:center;gap:8px;font-weight:800;font-size:38px;line-height:1;letter-spacing:.04em}
.tbblock .yr svg{width:34px;height:26px;display:block}
.tbband{flex:1;min-width:0;background:var(--band);border-radius:0 8px 8px 0;display:flex;align-items:center;gap:26px;padding:0 28px 0 30px}
.tbhead{min-width:0;flex:1}
.tbpage{font-weight:800;font-size:42px;line-height:1;text-transform:uppercase;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  background:linear-gradient(120deg,#6cc41c,#8aea2d 40%,#c8f892 60%,#6cc41c);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.tbsub{font-size:14px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--band-muted);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tbnav{margin-left:auto;display:flex;gap:22px;flex:none;align-items:center}
.tbnav a{padding:6px 0;color:var(--band-muted);font-size:16px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-decoration:none}
.tbnav a:hover{color:var(--band-text)}
.tbnav a.on{color:var(--band-text);box-shadow:inset 0 -3px 0 #8aea2d}
.tbnav a.signin{color:#27343f;background:#8aea2d;padding:6px 14px;border-radius:5px}
.tbnav a.signin:hover{background:#a6f05a;color:#27343f}
.tb2{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:12px 0}
.tb2 .who{font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-2)}
.spacer{flex:1}
.daynight{display:flex;align-items:center;gap:10px;cursor:pointer;background:none;border:0;color:var(--text-2);font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px}
.daynight .sw{width:44px;height:22px;border:1px solid var(--accent);border-radius:11px;position:relative}
.daynight .sw::after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:var(--accent);transition:left .15s}
:root[data-theme="light"] .daynight .sw::after{left:25px}

/* drop-down menu groups */
.tbgrp{position:relative}
.tbgrp>button{background:none;border:0;cursor:pointer;padding:6px 0;color:var(--band-muted);font:inherit;font-size:16px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.tbgrp>button:hover,.tbgrp.open>button{color:var(--band-text)}
.tbgrp.on>button{color:var(--band-text);box-shadow:inset 0 -3px 0 #8aea2d}
.tbgrp>button span{color:var(--band-text)}
.tbmenu{display:none;position:absolute;right:-14px;top:calc(100% + 10px);z-index:200;min-width:210px;background:var(--band);border:1px solid rgba(255,255,255,.08);border-top:2px solid #8aea2d;border-radius:0 0 6px 6px;padding:6px 0;box-shadow:0 14px 40px rgba(0,0,0,.45)}
.tbmenu::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.tbgrp.open .tbmenu{display:flex;flex-direction:column}
.tbmenu a{padding:9px 16px!important;color:var(--band-muted)!important;box-shadow:none!important;font-size:15px!important}
.tbmenu a:hover{background:rgba(255,255,255,.05);color:var(--band-text)!important}
.tbmenu a.on{color:#8aea2d!important}
.navlive{display:inline-block;width:8px;height:8px;border-radius:50%;background:#ff2d3d;margin-right:7px;vertical-align:2px;animation:pulseLive 2.4s ease-in-out infinite}
.tb2 .ctl{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tb2 .me{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.tier{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:2px 8px;border:1px solid var(--muted);color:var(--muted);border-radius:4px}
.tier.pro{border-color:var(--accent);color:var(--accent-text)}.tier.admin{background:#8aea2d;border-color:#8aea2d;color:#27343f}

/* ---------- cards ---------- */
.card{background:var(--surface);border:1px solid var(--border);border-top:2px solid var(--accent);border-radius:6px;padding:18px 22px 20px;margin-bottom:16px;position:relative;min-width:0}
.card h2{font-size:24px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;margin:0 0 10px}
.card h3{font-size:18px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;margin:18px 0 6px;color:var(--accent-text)}
.card p,.card li{color:var(--text-2);font-size:18px;line-height:1.5}
.card p{margin:0 0 10px}
.card ul{margin:0 0 10px;padding-left:22px}
.card li{margin:4px 0}
.card strong,.card b{color:var(--text)}
.hint{font-size:14px;color:var(--muted);letter-spacing:.05em;text-transform:uppercase;font-weight:600}
.section-title{font-size:17px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text);margin:30px 0 12px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:5px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);padding:8px 16px;font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;cursor:pointer}
.btn:hover{border-color:var(--accent)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}

/* ---------- home hero ---------- */
.hero{display:grid;grid-template-columns:1.35fr repeat(3,minmax(0,1fr));margin:6px 0 22px;background:var(--surface);border:1px solid var(--border);border-radius:6px}
.kpi{padding:16px 22px 18px;position:relative;min-width:0}
.kpi+.kpi{border-left:1px solid var(--border)}
.kpi .l{font-size:14px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-2)}
.kpi .v{font-size:44px;font-weight:800;line-height:1.05;margin-top:6px;text-transform:uppercase}
.kpi .h{font-size:14px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-2);margin-top:6px}
.kpi.lead .v{font-size:58px;background:linear-gradient(120deg,var(--g3),var(--g2) 40%,var(--g4) 60%,var(--g3));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
:root[data-theme="light"] .kpi.lead .v{background:linear-gradient(120deg,#2f6f08,#3f8f0c 50%,#2f6f08);-webkit-background-clip:text;background-clip:text}

.feat .ic{width:34px;height:34px;color:var(--accent);margin-bottom:8px}
.plats{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0 14px}
.plat{display:inline-flex;align-items:center;gap:10px;border-radius:5px;background:var(--surface-2);border:1px solid var(--border);padding:8px 14px;font-size:18px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.plat i{width:14px;height:14px;display:inline-block}
.plat .soon{font-size:12px;color:var(--muted);letter-spacing:.1em}
.plat svg{height:20px;width:auto;display:block}
.ytnote{display:flex;gap:14px;align-items:flex-start;background:var(--surface-2);border-left:3px solid var(--p-yt);padding:12px 16px;margin-top:8px}
.ytnote svg{height:26px;width:auto;flex:none;margin-top:2px}
.ytnote p{margin:0;font-size:17px}

/* ---------- legal pages ---------- */
.doc{max-width:980px}
.doc .meta{font-size:15px;color:var(--muted);letter-spacing:.05em;text-transform:uppercase;font-weight:600;margin-bottom:6px}
.toc{columns:2;column-gap:28px;padding-left:20px}
.doc table{width:100%;border-collapse:collapse;margin:8px 0 14px;font-size:16px}
.doc th,.doc td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--border);vertical-align:top;color:var(--text-2)}
.doc th{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--accent)}

/* ---------- footer ---------- */
.foot{margin-top:28px;padding:18px 0 4px;border-top:1px solid var(--border);display:flex;gap:18px;flex-wrap:wrap;align-items:center;font-size:15px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--muted)}
.foot a{color:var(--text-2);text-decoration:none}
.foot a:hover{color:var(--accent-text)}
.foot .badge{display:flex;align-items:center;gap:10px;padding:6px 14px 6px 12px;text-decoration:none;color:#27343f;border-radius:6px}
.foot .badge svg{width:22px;height:16px}
.foot .badge img{height:26px;display:block}
.foot .badge b{display:flex;align-items:center;gap:5px;font-size:18px;font-weight:800;letter-spacing:.04em}

/* ---------- app (signed-in) tables and status ---------- */
table.t{width:100%;border-collapse:collapse;font-size:16px;font-variant-numeric:tabular-nums}
table.t th{text-align:left;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--accent);padding:6px 10px;white-space:nowrap}
table.t td{padding:6px 10px;border-bottom:1px solid var(--border);white-space:nowrap}
table.t tr:nth-child(even) td{background:var(--zebra)}
.n{text-align:right}
.scroll{overflow-x:auto}
/* status dots: red slow blink = live and collecting now; empty ring = connected, nothing live; amber = error; grey = off */
.dot{width:10px;height:10px;border-radius:50%;background:var(--muted);display:inline-block;margin-right:8px;flex:none}
.dot.live{background:#ff2d3d;box-shadow:0 0 0 0 rgba(255,45,61,.55);animation:pulseLive 2.4s ease-in-out infinite}
.dot.idle{background:transparent;border:2px solid var(--muted)}
.dot.err{background:var(--warn)}
.dot.off{background:var(--border)}
@keyframes pulseLive{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(255,45,61,.5)}50%{opacity:.3;box-shadow:0 0 0 5px rgba(255,45,61,0)}}
@media (prefers-reduced-motion:reduce){.dot.live{animation:none}}
.status{font-size:14px;color:var(--text-2);letter-spacing:.06em;text-transform:uppercase;font-weight:600;display:flex;align-items:center;gap:6px}
.kgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin:6px 0 18px}
.kgrid .kpi .v{font-size:40px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.pcard{background:var(--surface-2);border-left:3px solid var(--border);padding:12px 14px}
.pcard.live{border-left-color:#ff2d3d} .pcard.err{border-left-color:var(--warn)} .pcard.idle{border-left-color:var(--muted)}
.pcard b{font-size:19px;letter-spacing:.05em;text-transform:uppercase}
.pcard .s{font-size:15px;color:var(--text-2);margin-top:4px}
.links a{display:inline-block;margin:0 14px 6px 0;color:var(--accent-text);font-weight:700;letter-spacing:.04em}

/* ---------- smaller screens ---------- */
@media (max-width:1100px){.topbar .tb1{height:auto;min-height:84px}.tbband{flex-wrap:wrap;padding:12px 54px 12px 58px;row-gap:8px}.tbhead{flex:1 1 100%}.tbnav{margin-left:0;flex-wrap:wrap;flex:1 1 100%}}
@media (max-width:900px){
  .topbar{position:static}.topbar .tb1{flex-direction:column;height:auto}
  .tbblock{border-radius:8px 8px 0 0;padding:12px 16px}.tbblock img{height:38px}.tbblock .yr{font-size:32px}
  .tbband{border-radius:0 0 8px 8px;padding:12px 16px}.tbpage{font-size:32px;white-space:normal}
  .hero{grid-template-columns:1fr 1fr}.kpi+.kpi{border-left:0}.kpi .v{font-size:34px}.kpi.lead .v{font-size:42px}
  .grid3,.grid2{grid-template-columns:1fr}.toc{columns:1}
}
@media (max-width:520px){.page{padding:12px 16px 30px}.topbar{margin:-12px -16px 14px;padding:12px 16px 0}.hero{grid-template-columns:1fr}.card{padding:16px}.card p,.card li{font-size:17px}}
/* marks with a Day version: one image per theme */
.lg-l{display:none!important}
:root[data-theme="light"] .lg-d{display:none!important}:root[data-theme="light"] .lg-l{display:inline-block!important}
.plat img{width:22px;height:22px;object-fit:contain}
