:root {
  color-scheme: dark;
  --rl-bg: #05070d;
  --rl-bg-soft: #090d17;
  --rl-panel: #0e1422;
  --rl-panel-2: #121a2b;
  --rl-text: #f7f9ff;
  --rl-muted: #9aa6bc;
  --rl-line: rgba(158, 180, 224, 0.16);
  --rl-blue: #4d76ff;
  --rl-blue-bright: #78a2ff;
  --rl-cyan: #62d7ff;
  --rl-green: #4ce6a0;
  --rl-radius: 24px;
  --rl-content: min(1220px, calc(100vw - 48px));
  --rl-font: "Montserrat", "Avenir Next", Arial, sans-serif;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 88px; background: var(--rl-bg); }
body { min-width: 280px; margin: 0; overflow-x: clip; background: var(--rl-bg); color: var(--rl-text); font-family: var(--rl-font); line-height: 1.6; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p, dl, dd, figure, ul, ol { margin-top: 0; }
h1, h2, h3 { margin-bottom: 0; font-weight: 500; letter-spacing: -0.045em; line-height: .98; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--rl-cyan); outline-offset: 4px; }

.rl-skip { position: fixed; z-index: 100; top: 12px; left: 12px; padding: 10px 14px; border-radius: 8px; background: white; color: #05070d; transform: translateY(-150%); }
.rl-skip:focus { transform: none; }

html[data-page="rolive"] body::before,
html[data-page="rolive"] body::after {
  content: "";
  position: fixed;
  pointer-events: none;
}
html[data-page="rolive"] body::before {
  inset: 0;
  z-index: 900;
  background: radial-gradient(circle at center, rgba(225, 37, 27, .13), transparent 34%), #000;
  animation: rl-page-loader 1.18s ease forwards;
}
html[data-page="rolive"] body::after {
  z-index: 901;
  left: 50%;
  top: 50%;
  width: clamp(112px, 11vw, 164px);
  aspect-ratio: 1;
  background: url("/assets/rolive-red-logo.png") center / contain no-repeat;
  filter: drop-shadow(0 0 28px rgba(225, 37, 27, .28));
  transform: translate(-50%, -50%);
  animation: rl-page-loader-logo 1.18s ease forwards;
}
@keyframes rl-page-loader {
  0%, 72% { opacity: 1; visibility: visible; }
  100% { opacity: 0; visibility: hidden; }
}
@keyframes rl-page-loader-logo {
  0% { opacity: .72; transform: translate(-50%, -50%) scale(.96); visibility: visible; }
  62% { opacity: 1; transform: translate(-50%, -50%) scale(1); visibility: visible; }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1); visibility: hidden; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-page="rolive"] body::before,
  html[data-page="rolive"] body::after { animation-duration: .7s; }
}

.rl-header { position: relative; z-index: 10; width: var(--rl-content); min-height: 82px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 18px; border-bottom: 1px solid var(--rl-line); }
.rl-brand { justify-self: start; display: inline-flex; align-items: center; gap: 12px; text-decoration: none; font-weight: 600; letter-spacing: -.03em; }
.rl-brand img { width: 42px; height: 30px; object-fit: contain; }
.rl-header__status { display: inline-flex; align-items: center; gap: 8px; color: #c4cee0; font-size: .72rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.rl-header__status span, .rl-live-pill span, .rl-kicker span { width: 7px; height: 7px; border-radius: 50%; background: var(--rl-green); box-shadow: 0 0 12px rgba(76,230,160,.65); }
.rl-header .rl-button { justify-self: end; }
.rl-header-links { display: flex; align-items: center; justify-content: center; gap: clamp(18px, 3vw, 42px); }
.rl-header-links a { color: #a5a8b0; font-size: .72rem; font-weight: 500; letter-spacing: .06em; text-decoration: none; text-transform: uppercase; transition: color .2s ease; }
.rl-header-links a:hover { color: white; }
.rl-brand-logo { position: relative; width: 42px; height: 42px; overflow: hidden; border-radius: 11px; background: #e1251b; }
.rl-brand-logo img { position: absolute; width: 176px; max-width: none; height: auto; left: -61px; top: -8px; }

.rl-button { min-height: 48px; padding: 0 22px; border: 1px solid rgba(124,157,255,.8); border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #6689ff, #3c62e8); box-shadow: 0 12px 30px rgba(48,87,222,.25); color: white; font-size: .78rem; font-weight: 600; letter-spacing: .035em; text-decoration: none; transition: transform .25s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease; }
.rl-button:hover { transform: translateY(-2px); box-shadow: 0 16px 38px rgba(48,87,222,.38); }
.rl-button--ghost { border-color: var(--rl-line); background: rgba(255,255,255,.035); box-shadow: none; }
.rl-button--ghost:hover { border-color: rgba(120,162,255,.65); background: rgba(77,118,255,.1); }
.rl-button--small { min-height: 38px; padding-inline: 17px; font-size: .7rem; }

.rl-hero { position: relative; width: var(--rl-content); min-height: calc(100vh - 82px); min-height: calc(100svh - 82px); margin: 0 auto; padding: clamp(64px, 8vw, 118px) 0; display: grid; grid-template-columns: minmax(0, .92fr) minmax(420px, .88fr); align-items: center; gap: clamp(44px, 7vw, 100px); }
.rl-hero__glow { position: absolute; z-index: -1; width: 700px; height: 600px; right: -22%; top: 4%; border-radius: 50%; background: radial-gradient(circle, rgba(44,83,220,.22), transparent 67%); filter: blur(20px); pointer-events: none; }
.rl-kicker { margin-bottom: 22px; display: flex; align-items: center; gap: 10px; color: #8fa8dd; font-size: .7rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.rl-kicker span { background: var(--rl-blue-bright); }
.rl-hero h1 { max-width: 770px; font-size: clamp(3.45rem, 6.4vw, 6.6rem); font-weight: 400; }
.rl-hero h1 em { color: var(--rl-blue-bright); font-style: normal; }
.rl-lead { max-width: 650px; margin: 30px 0 34px; color: #aeb8ca; font-size: clamp(1.02rem, 1.45vw, 1.22rem); }
.rl-actions { display: flex; flex-wrap: wrap; gap: 12px; }

.rl-discord { min-width: 0; overflow: hidden; border: 1px solid rgba(126,151,205,.24); border-radius: 26px; background: #0a0d15; box-shadow: 0 35px 80px rgba(0,0,0,.48), 0 0 60px rgba(58,97,237,.13); transform: perspective(1200px) rotateY(-3deg) rotateX(1deg); }
.rl-discord__top { min-height: 78px; padding: 17px 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--rl-line); background: #111622; }
.rl-discord__top > div { display: grid; gap: 2px; }
.rl-discord__server { font-size: .9rem; font-weight: 600; }
.rl-discord__top small { color: #78849a; }
.rl-live-pill { width: max-content; padding: 6px 10px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid rgba(76,230,160,.2); border-radius: 999px; background: rgba(76,230,160,.075); color: #8ef1bd; font-size: .62rem; font-weight: 600; text-transform: uppercase; }
.rl-live-pill span { width: 6px; height: 6px; }
.rl-discord__body { min-height: 400px; display: grid; grid-template-columns: 72px 1fr; }
.rl-discord__rail { padding: 16px 13px; display: flex; flex-direction: column; align-items: center; gap: 11px; background: #090b11; }
.rl-discord__rail span { width: 43px; height: 43px; border-radius: 15px; display: grid; place-items: center; background: #171c28; color: #aeb9cc; font-size: .65rem; font-weight: 600; }
.rl-discord__rail span:first-child { border-radius: 13px; background: var(--rl-blue); color: white; }
.rl-channels { position: relative; padding: 21px 17px 90px; background: #0d111b; }
.rl-channels > p { margin: 15px 8px 8px; color: #667187; font-size: .6rem; font-weight: 600; letter-spacing: .08em; }
.rl-channels > p:first-child { margin-top: 0; }
.rl-channel { min-height: 44px; padding: 0 12px; border-radius: 8px; display: flex; align-items: center; color: #aeb7c7; font-size: .84rem; }
.rl-channel:hover { background: #171d2a; color: white; }
.rl-channel__icon { width: 22px; color: #68758c; }
.rl-channel strong { color: #e8edfa; font-weight: 500; font-variant-numeric: tabular-nums; }
.rl-bot-card { position: absolute; left: 17px; right: 17px; bottom: 15px; min-height: 62px; padding: 10px 13px; border: 1px solid var(--rl-line); border-radius: 12px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 11px; background: #141a27; }
.rl-bot-mark { width: 36px; height: 36px; border-radius: 12px; display: grid; place-items: center; background: linear-gradient(135deg, #7396ff, #3c5ede); font-weight: 600; }
.rl-bot-card div { display: grid; }.rl-bot-card strong { font-size: .78rem; }.rl-bot-card small { color: #768197; font-size: .61rem; }
.rl-online { width: 8px; height: 8px; border-radius: 50%; background: var(--rl-green); }

.rl-value-strip { width: var(--rl-content); margin: 0 auto; padding: 26px 0; border-top: 1px solid var(--rl-line); border-bottom: 1px solid var(--rl-line); display: grid; grid-template-columns: repeat(4, 1fr); }
.rl-value-strip article { min-width: 0; padding: 4px 24px; display: grid; grid-template-columns: auto 1fr; gap: 13px; border-right: 1px solid var(--rl-line); }
.rl-value-strip article:first-child { padding-left: 0; }.rl-value-strip article:last-child { padding-right: 0; border: 0; }
.rl-mini-icon { width: 32px; height: 32px; border: 1px solid rgba(120,162,255,.28); border-radius: 10px; display: grid; place-items: center; background: rgba(77,118,255,.08); color: var(--rl-blue-bright); font-size: .82rem; }
.rl-value-strip h2 { margin: 1px 0 5px; font-size: .76rem; letter-spacing: 0; }.rl-value-strip p { margin: 0; color: #7f8a9e; font-size: .68rem; line-height: 1.45; }

.rl-section { width: var(--rl-content); margin: 0 auto; padding: clamp(90px, 10vw, 150px) 0; }
.rl-intro { max-width: 960px; margin-inline: auto; text-align: center; }
.rl-intro .rl-kicker, .rl-section-heading .rl-kicker { justify-content: center; }
.rl-intro h2, .rl-section-heading h2 { font-size: clamp(2.6rem, 5vw, 5.25rem); }
.rl-intro > p:last-child, .rl-section-heading > p:last-child { max-width: 740px; margin: 28px auto 0; color: var(--rl-muted); font-size: 1.05rem; }
.rl-split { display: grid; grid-template-columns: minmax(0,.85fr) minmax(430px,1fr); gap: clamp(56px, 9vw, 130px); align-items: center; }
.rl-split--reverse { grid-template-columns: minmax(430px,1fr) minmax(0,.85fr); }
.rl-section-copy h2, .rl-feature-panel h2, .rl-infrastructure h2, .rl-dashboard h2 { font-size: clamp(2.35rem, 4.2vw, 4.6rem); }
.rl-section-copy > p:not(.rl-kicker), .rl-feature-panel > p, .rl-infrastructure > div > p:not(.rl-kicker), .rl-dashboard__copy > p:not(.rl-kicker) { margin: 26px 0 0; color: var(--rl-muted); }
.rl-checks { margin: 28px 0 0; padding: 0; list-style: none; display: grid; gap: 11px; color: #c9d1e1; font-size: .85rem; }
.rl-checks li { display: flex; gap: 10px; align-items: center; }.rl-checks li::before { content: "✓"; width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: rgba(76,230,160,.11); color: var(--rl-green); font-size: .65rem; }

.rl-counter-stack { padding: 16px; border: 1px solid var(--rl-line); border-radius: var(--rl-radius); display: grid; gap: 8px; background: linear-gradient(145deg, rgba(19,28,47,.93), rgba(9,13,23,.96)); box-shadow: 0 24px 70px rgba(0,0,0,.3); }
.rl-counter-stack > div { min-height: 72px; padding: 0 20px; border: 1px solid rgba(255,255,255,.055); border-radius: 15px; display: grid; grid-template-columns: 30px 1fr auto 60px; align-items: center; gap: 12px; background: rgba(255,255,255,.026); }
.rl-counter-stack > div > span { color: #7e94c8; }.rl-counter-stack p { margin: 0; color: #aab5c8; }.rl-counter-stack strong { font-size: 1.28rem; font-variant-numeric: tabular-nums; }.rl-counter-stack small { color: var(--rl-green); text-align: right; font-size: .59rem; text-transform: uppercase; }

.rl-showcase { padding-top: 105px; }
.rl-section-heading { max-width: 990px; margin: 0 auto 58px; text-align: center; }
.rl-product-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 20px; }
.rl-game-card, .rl-community-card, .rl-feature-panel, .rl-security, .rl-infrastructure, .rl-dashboard, .rl-status-grid { border: 1px solid var(--rl-line); border-radius: var(--rl-radius); background: linear-gradient(145deg, rgba(17,25,42,.92), rgba(8,12,21,.94)); }
.rl-game-card, .rl-community-card { min-width: 0; padding: 20px; }
.rl-game-card__art { min-height: 230px; padding: 26px; border-radius: 17px; display: flex; flex-direction: column; justify-content: flex-end; background: radial-gradient(circle at 70% 25%, rgba(101,151,255,.55), transparent 25%), linear-gradient(140deg, #1c2b5f, #415fca 52%, #111a38); overflow: hidden; }
.rl-game-card__art span { font-size: clamp(3rem,8vw,6rem); font-weight: 600; letter-spacing: -.08em; opacity: .86; }.rl-game-card__art small { color: #d4ddf5; }
.rl-game-card__head { padding: 22px 4px 16px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }.rl-game-card small, .rl-community-card > small { color: #7e8aa1; font-size: .65rem; text-transform: uppercase; letter-spacing: .1em; }.rl-game-card h3, .rl-community-card h3 { margin-top: 5px; font-size: 1.5rem; }
.rl-game-card dl { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--rl-line); }.rl-game-card dl div { padding: 18px 10px 4px; border-right: 1px solid var(--rl-line); }.rl-game-card dl div:last-child { border: 0; }.rl-game-card dt { color: #7e8aa0; font-size: .62rem; text-transform: uppercase; }.rl-game-card dd { margin: 6px 0 0; font-size: 1.1rem; font-weight: 600; }
.rl-community-card { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.rl-community-mark { width: 96px; height: 96px; margin-bottom: 24px; border: 1px solid rgba(120,162,255,.3); border-radius: 25px; display: grid; place-items: center; background: rgba(77,118,255,.11); }.rl-community-mark img { width: 66px; height: 44px; object-fit: contain; }
.rl-community-total { width: 100%; margin-top: 38px; padding: 24px 0; border-top: 1px solid var(--rl-line); display: flex; align-items: baseline; justify-content: space-between; }.rl-community-total span { color: var(--rl-muted); }.rl-community-total strong { font-size: 2.4rem; }
.rl-growth { width: 100%; padding: 17px; border-radius: 14px; display: flex; justify-content: space-between; gap: 20px; background: rgba(77,118,255,.08); color: #9cabc4; font-size: .72rem; }.rl-growth strong { color: #a9c1ff; }

.rl-total-card { padding: 32px; border: 1px solid rgba(116,147,214,.25); border-radius: var(--rl-radius); background: linear-gradient(155deg, #15213e, #0b101d 65%); box-shadow: 0 30px 80px rgba(0,0,0,.34); }.rl-total-card > small { color: #91a0bb; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }.rl-total-card > strong { margin: 10px 0 28px; display: block; font-size: clamp(3.5rem,7vw,6rem); font-weight: 500; letter-spacing: -.07em; font-variant-numeric: tabular-nums; }.rl-total-row { min-height: 45px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--rl-line); color: #95a0b4; font-size: .82rem; }.rl-total-row b { color: #dce3f1; font-weight: 500; font-variant-numeric: tabular-nums; }.rl-total-row--final { margin-top: 8px; padding-top: 12px; color: white; }.rl-total-row--final b { color: var(--rl-green); }

.rl-duo, .rl-platform-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.rl-feature-panel { min-width: 0; padding: clamp(25px,4vw,48px); }
.rl-feature-panel h2 { font-size: clamp(2rem,3.4vw,3.5rem); }
.rl-embed { position: relative; margin-top: 36px; padding: 24px 24px 22px 28px; border-radius: 8px; background: #181b20; box-shadow: 0 18px 45px rgba(0,0,0,.28); }.rl-embed__accent { position: absolute; inset: 0 auto 0 0; width: 4px; border-radius: 8px 0 0 8px; background: var(--rl-blue); }.rl-embed > small { color: #9ba6ba; font-size: .61rem; }.rl-embed h3 { margin-top: 7px; font-size: 1rem; letter-spacing: 0; }.rl-embed dl { margin: 20px 0 0; display: grid; grid-template-columns: repeat(2,1fr); gap: 17px; }.rl-embed dt { color: #8792a5; font-size: .66rem; }.rl-embed dd { font-size: .86rem; font-weight: 600; }
.rl-steps { margin: 34px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }.rl-steps li { min-height: 65px; padding: 10px 14px; border: 1px solid var(--rl-line); border-radius: 13px; display: grid; grid-template-columns: 34px 1fr; align-items: center; gap: 12px; background: rgba(255,255,255,.025); }.rl-steps li > span { width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; background: rgba(77,118,255,.13); color: var(--rl-blue-bright); font-size: .69rem; }.rl-steps div { display: grid; gap: 2px; }.rl-steps small { color: #758197; font-size: .61rem; }.rl-steps strong, .rl-steps code { color: #d9e0ee; font-family: inherit; font-size: .76rem; font-weight: 500; }

.rl-security { padding: clamp(28px,5vw,58px); display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: clamp(38px,7vw,90px); }
.rl-security-points { margin-top: 27px; display: flex; flex-wrap: wrap; gap: 8px; }.rl-security-points span, .rl-server-list span { padding: 7px 10px; border: 1px solid var(--rl-line); border-radius: 999px; color: #aeb9cc; font-size: .65rem; }
.rl-verify-flow { min-width: 0; display: flex; align-items: center; justify-content: center; gap: 10px; }.rl-verify-flow > div { min-width: 105px; min-height: 112px; padding: 14px 10px; border: 1px solid var(--rl-line); border-radius: 15px; display: grid; place-items: center; align-content: center; gap: 10px; background: rgba(255,255,255,.025); text-align: center; }.rl-verify-flow > div span { width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; background: rgba(77,118,255,.13); color: var(--rl-blue-bright); font-size: .7rem; }.rl-verify-flow strong { font-size: .65rem; letter-spacing: 0; }.rl-verify-flow i { color: #536078; font-style: normal; }.rl-verify-flow .is-verified span { background: rgba(76,230,160,.11); color: var(--rl-green); }
.rl-server-list { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 8px; }
.rl-feature-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }.rl-feature-heading > div { min-width: 0; }.rl-beta-label { flex: 0 0 auto; padding: 7px 10px; border: 1px solid rgba(120,162,255,.25); border-radius: 999px; background: rgba(77,118,255,.08); color: #a8beff; font-size: .57rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.rl-chart { margin-top: 33px; padding: 18px; border: 1px solid var(--rl-line); border-radius: 15px; background: #0a0f1b; }.rl-chart__label { color: #7f8ca2; font-size: .62rem; }.rl-chart svg { width: 100%; margin-top: 13px; overflow: visible; }.rl-chart__grid { fill: none; stroke: rgba(255,255,255,.065); }.rl-chart__area { fill: url("#none"); fill: rgba(77,118,255,.08); }.rl-chart__line { fill: none; stroke: #79a2ff; stroke-width: 4; stroke-linecap: round; filter: drop-shadow(0 0 8px rgba(102,145,255,.55)); }

.rl-infrastructure { min-height: 720px; padding: clamp(64px,8vw,110px); display: grid; grid-template-columns: .78fr 1.22fr; align-items: center; gap: clamp(46px,8vw,110px); }
.rl-infra-map { position: relative; min-height: 320px; display: grid; grid-template-columns: repeat(3,1fr); align-content: end; gap: 12px; }.rl-infra-map::before, .rl-infra-map::after { content: ""; position: absolute; left: 50%; width: 1px; background: linear-gradient(var(--rl-blue), rgba(77,118,255,.08)); }.rl-infra-map::before { top: 62px; height: 90px; }.rl-infra-map::after { top: 151px; left: 17%; right: 17%; width: auto; height: 1px; background: linear-gradient(90deg, transparent, var(--rl-blue), transparent); }
.rl-node { position: relative; z-index: 1; min-height: 62px; padding: 12px; border: 1px solid var(--rl-line); border-radius: 14px; display: grid; place-items: center; background: #111827; color: #9ca8bd; font-size: .68rem; }.rl-node--source, .rl-node--core { position: absolute; left: 50%; transform: translateX(-50%); }.rl-node--source { top: 0; }.rl-node--core { top: 112px; min-width: 128px; border-color: rgba(120,162,255,.42); background: linear-gradient(145deg,#3459d0,#1e347e); color: white; font-weight: 600; box-shadow: 0 0 35px rgba(77,118,255,.22); }

.rl-audience-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }.rl-audience-grid article { min-height: 230px; padding: 28px; border: 1px solid var(--rl-line); border-radius: 19px; background: rgba(255,255,255,.022); transition: transform .25s ease, border-color .25s ease, background .25s ease; }.rl-audience-grid article:hover { transform: translateY(-4px); border-color: rgba(120,162,255,.34); background: rgba(77,118,255,.055); }.rl-audience-grid article > span { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: rgba(77,118,255,.1); color: var(--rl-blue-bright); font-size: .72rem; }.rl-audience-grid h3 { margin-top: 54px; font-size: 1.35rem; }.rl-audience-grid p { margin: 13px 0 0; color: var(--rl-muted); font-size: .82rem; }

.rl-dashboard { padding: clamp(28px,5vw,60px); display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(45px,8vw,100px); align-items: center; overflow: hidden; }.rl-dashboard__copy .rl-beta-label { display: inline-flex; margin-bottom: 24px; }.rl-dashboard__preview { min-height: 360px; border: 1px solid rgba(126,151,205,.22); border-radius: 20px; display: grid; grid-template-columns: 110px 1fr; background: #0a0e17; filter: blur(.15px); opacity: .78; transform: perspective(900px) rotateY(-4deg); }.rl-dashboard__preview aside { padding: 21px 15px; border-right: 1px solid var(--rl-line); display: grid; align-content: start; gap: 18px; }.rl-dashboard__preview aside b { color: #90a9ff; }.rl-dashboard__preview aside span { height: 8px; border-radius: 4px; background: #222a39; }.rl-dashboard__preview > div { padding: 20px; }.rl-dashboard__bar { width: 38%; height: 13px; border-radius: 7px; background: #303a50; }.rl-dashboard__preview section { margin-top: 30px; display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }.rl-dashboard__preview section span { height: 72px; border: 1px solid var(--rl-line); border-radius: 12px; background: linear-gradient(145deg,#17233d,#101726); }.rl-dashboard__graph { height: 170px; margin-top: 12px; border: 1px solid var(--rl-line); border-radius: 12px; background: linear-gradient(170deg,transparent 45%,rgba(77,118,255,.18) 46%,transparent 48%), #101522; }

.rl-status .rl-section-heading { margin-bottom: 45px; }.rl-status-grid { overflow: hidden; display: grid; grid-template-columns: repeat(2,1fr); }.rl-status-grid div { min-height: 64px; padding: 0 22px; border-right: 1px solid var(--rl-line); border-bottom: 1px solid var(--rl-line); display: flex; align-items: center; justify-content: space-between; gap: 20px; }.rl-status-grid div:nth-child(even) { border-right: 0; }.rl-status-grid div:nth-last-child(-n+2) { border-bottom: 0; }.rl-status-grid span { color: #a4aec0; font-size: .76rem; }.rl-status-grid strong { color: #93a0b5; font-size: .61rem; letter-spacing: .07em; text-transform: uppercase; }.rl-status-grid .is-ready { color: var(--rl-green); }.rl-status-grid .is-testing { color: #a8beff; }

.rl-cta { width: var(--rl-content); margin: 30px auto 100px; padding: clamp(42px,7vw,82px); border: 1px solid rgba(120,162,255,.25); border-radius: 30px; display: flex; align-items: flex-end; justify-content: space-between; gap: 50px; background: radial-gradient(circle at 85% 5%, rgba(77,118,255,.22), transparent 38%), linear-gradient(145deg,#121b30,#080c15); }.rl-cta > div:first-child { max-width: 750px; }.rl-cta h2 { font-size: clamp(2.5rem,5vw,5.2rem); }.rl-cta p:not(.rl-kicker) { margin: 26px 0 0; color: var(--rl-muted); }
.rl-footer { width: var(--rl-content); min-height: 120px; margin: 0 auto; border-top: 1px solid var(--rl-line); display: flex; align-items: center; gap: 14px; color: #7e899d; font-size: .72rem; }.rl-footer strong { color: white; font-size: .9rem; }.rl-footer small { margin-left: auto; }

.rl-reveal { opacity: 0; transform: translateY(20px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.rl-reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 980px) {
  :root { --rl-content: min(100% - 36px, 760px); }
  .rl-hero { min-height: auto; grid-template-columns: 1fr; padding-block: 75px 90px; }
  .rl-hero__copy { max-width: 720px; }
  .rl-discord { width: min(100%, 650px); transform: none; }
  .rl-value-strip { grid-template-columns: repeat(2,1fr); }
  .rl-value-strip article { padding: 17px 20px; border-bottom: 1px solid var(--rl-line); }
  .rl-value-strip article:nth-child(2) { border-right: 0; }.rl-value-strip article:nth-child(3) { padding-left: 20px; border-bottom: 0; }.rl-value-strip article:last-child { padding: 17px 20px; }
  .rl-split, .rl-split--reverse, .rl-security, .rl-infrastructure, .rl-dashboard { grid-template-columns: 1fr; }
  .rl-split--reverse .rl-total-card { order: 2; }
  .rl-product-grid { grid-template-columns: 1fr; }
  .rl-community-card { min-height: 430px; }
  .rl-verify-flow { flex-wrap: wrap; }.rl-verify-flow i { transform: rotate(90deg); }
  .rl-cta { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 700px) {
  :root { --rl-content: calc(100% - 28px); --rl-radius: 20px; }
  .rl-header { min-height: 72px; grid-template-columns: 1fr auto; }
  .rl-header__status { display: none; }
  .rl-brand img { width: 36px; height: 25px; }
  .rl-button--small { min-height: 36px; padding-inline: 13px; }
  .rl-hero { padding-top: 58px; gap: 48px; }
  .rl-hero h1 { font-size: clamp(3rem,14vw,4.6rem); }
  .rl-lead { font-size: .98rem; }
  .rl-actions .rl-button { flex: 1 1 160px; }
  .rl-discord__body { grid-template-columns: 54px 1fr; min-height: 360px; }
  .rl-discord__rail { padding-inline: 7px; }.rl-discord__rail span { width: 38px; height: 38px; }
  .rl-channels { padding-inline: 10px; }.rl-bot-card { left: 10px; right: 10px; }
  .rl-value-strip { grid-template-columns: 1fr; }
  .rl-value-strip article, .rl-value-strip article:first-child, .rl-value-strip article:nth-child(3), .rl-value-strip article:last-child { padding: 17px 0; border-right: 0; border-bottom: 1px solid var(--rl-line); }
  .rl-value-strip article:last-child { border-bottom: 0; }
  .rl-section { padding-block: 80px; }
  .rl-intro h2, .rl-section-heading h2 { font-size: clamp(2.45rem,12vw,3.8rem); }
  .rl-split { grid-template-columns: 1fr; gap: 45px; }
  .rl-counter-stack > div { grid-template-columns: 25px 1fr auto; padding-inline: 13px; }.rl-counter-stack small { display: none; }
  .rl-game-card dl { grid-template-columns: repeat(2,1fr); }.rl-game-card dl div:nth-child(2) { border-right: 0; }.rl-game-card dl div:nth-child(-n+2) { border-bottom: 1px solid var(--rl-line); }
  .rl-growth { flex-direction: column; gap: 4px; }
  .rl-duo, .rl-platform-grid, .rl-audience-grid { grid-template-columns: 1fr; }
  .rl-feature-panel { padding: 24px 20px; }
  .rl-feature-heading { flex-direction: column-reverse; }
  .rl-security { padding: 28px 20px; }
  .rl-verify-flow { display: grid; grid-template-columns: 1fr; }.rl-verify-flow > div { width: 100%; min-height: 88px; grid-template-columns: 42px 1fr; text-align: left; }.rl-verify-flow i { transform: rotate(90deg); text-align: center; }
  .rl-infrastructure { min-height: 620px; padding: 56px 20px; }.rl-infra-map { min-height: 300px; }
  .rl-dashboard { padding: 30px 20px; overflow: hidden; }.rl-dashboard__preview { min-height: 300px; grid-template-columns: 72px 1fr; transform: none; }.rl-dashboard__preview aside { padding-inline: 10px; }
  .rl-status-grid { grid-template-columns: 1fr; }.rl-status-grid div, .rl-status-grid div:nth-child(even), .rl-status-grid div:nth-last-child(-n+2) { border-right: 0; border-bottom: 1px solid var(--rl-line); }.rl-status-grid div:last-child { border-bottom: 0; }
  .rl-cta { margin-bottom: 70px; padding: 34px 22px; }
  .rl-footer { min-height: 140px; align-items: flex-start; justify-content: center; flex-direction: column; gap: 3px; }.rl-footer small { margin: 10px 0 0; }
}

@media (max-width: 390px) {
  .rl-header .rl-button { padding-inline: 11px; }
  .rl-brand { gap: 8px; }
  .rl-discord__top { padding-inline: 14px; }
  .rl-discord__rail { display: none; }
  .rl-discord__body { grid-template-columns: 1fr; }
  .rl-total-card { padding: 24px 20px; }
  .rl-embed dl { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .rl-reveal { opacity: 1; transform: none; }
}

/* Solid RoLive red identity */
:root { --rl-blue: #e1251b; --rl-blue-bright: #e1251b; --rl-cyan: #e1251b; }
.rl-brand-logo, .rl-product-logo, .rl-discord__rail span:first-child, .rl-bot-mark, .rl-node--core, .rl-cta { background: #e1251b; }
.rl-game-card__art { background: #a91c15; }
.rl-total-card { background: #21100f; }
.rl-button { border-color: #e1251b; background: #e1251b; }
.rl-button:hover { background: #f0352a; }
.rl-cta { border-color: #e1251b; }
.rl-trust-line, .rl-fine-print { margin: 20px 0 0; color: var(--rl-muted); font-size: .72rem; }
.rl-purpose-grid, .rl-command-grid, .rl-comparison-grid { margin-top: 42px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; text-align: left; }
.rl-purpose-grid article, .rl-command-grid article, .rl-comparison-grid article { padding: 26px; border: 1px solid var(--rl-line); border-radius: var(--radius); background: var(--panel); color: white; }
.rl-purpose-grid h3, .rl-comparison-grid h3 { font-size: 1.3rem; }
.rl-purpose-grid p, .rl-command-grid p { margin: 14px 0 0; color: var(--muted); font-size: .8rem; }
.rl-command-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.rl-command-grid code { display: block; color: white; font-family: inherit; font-size: 1.05rem; }
.rl-command-grid strong { margin-top: 9px; display: block; color: #e1251b; font-size: .65rem; text-transform: uppercase; }
.rl-comparison-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rl-comparison-grid .rl-checks { margin-top: 24px; }
.rl-audience-grid--four { grid-template-columns: repeat(4, 1fr); }
.rl-privacy { max-width: 900px; text-align: center; }
.rl-privacy .rl-kicker { justify-content: center; }
.rl-privacy > p:last-child { margin: 28px auto 0; color: var(--muted); }
.rl-faq-list { max-width: 980px; margin: 0 auto; border-top: 1px solid var(--rl-line); }
.rl-faq-list details { border-bottom: 1px solid var(--rl-line); }
.rl-faq-list summary { padding: 24px 4px; cursor: pointer; font-size: 1rem; }
.rl-faq-list p { padding: 0 4px 24px; margin: 0; color: var(--muted); }
.rl-footer { min-height: 180px; justify-content: space-between; }
.rl-footer-brand { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.rl-footer-brand > span:last-child { display: grid; gap: 3px; }
.rl-footer-brand small { margin: 0; color: var(--muted); font-size: .62rem; text-transform: uppercase; letter-spacing: .06em; }
.rl-footer nav { display: flex; gap: 26px; }
.rl-footer nav a { color: var(--muted); font-size: .7rem; text-decoration: none; text-transform: uppercase; letter-spacing: .06em; }
.rl-footer nav a:hover { color: white; }
.rl-footer > small { margin: 0; }

@media (max-width: 980px) {
  .rl-command-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rl-audience-grid--four { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 700px) {
  .rl-purpose-grid, .rl-command-grid, .rl-comparison-grid, .rl-audience-grid--four { grid-template-columns: 1fr; }
  .rl-footer { align-items: flex-start; }
  .rl-footer nav { margin-block: 20px; flex-wrap: wrap; }
}

/* Final Final solid brand treatment overrides all earlier component styling. */
.rl-brand-logo, .rl-product-logo, .rl-discord__rail span:first-child, .rl-bot-mark, .rl-node--core, .rl-cta { background: #e1251b; }
.rl-game-card__art { background: #a91c15; }
.rl-total-card { background: #21100f; }
.rl-button { border-color: #e1251b; background: #e1251b; }
.rl-button:hover { background: #f0352a; }
.rl-cta { border-color: #e1251b; background: #e1251b; }

/* Final cascade corrections. */
.rl-hero h1 { max-width: 100%; font-size: clamp(2.6rem, 3.4vw, 4.3rem); white-space: nowrap; }
.rl-hero h1 > span,
.rl-hero h1 > em { display: block; }
.rl-discord__rail .rl-server-icon,
.rl-discord__rail .rl-server-icon:first-child { overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.rl-discord__rail .rl-server-icon img,
.rl-discord__rail .rl-server-icon:first-child img { position: static; inset: auto; display: block; width: 100%; height: 100%; max-width: 100%; object-fit: contain; transform: none; }
.rl-server-icon--enemy img { width: 88% !important; height: 88% !important; margin: auto; }
.rl-brand-logo { border: 0; border-radius: 0; background: transparent !important; box-shadow: none; }
.rl-brand-logo img { position: static; display: block; width: 100%; height: 100%; max-width: 100%; object-fit: contain; transform: none; }
@media (max-width: 1120px) { .rl-hero h1 { font-size: clamp(2.7rem, 7vw, 4.6rem); white-space: normal; } }

.rl-header .rl-brand-logo { width: 52px; height: 52px; }
.rl-header .rl-brand { gap: 14px; font-size: 1.15rem; }
.rl-bot-mark,
.rl-community-mark { overflow: hidden; border: 0; background: transparent; box-shadow: none; }
.rl-bot-mark img,
.rl-community-mark img { position: static; inset: auto; width: 100%; height: 100%; max-width: 100%; object-fit: cover; transform: none; }
.rl-game-card__art--image { padding: 0; background: #15171c; }
.rl-game-card__art--image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rl-server-example { margin: 44px 0 0; overflow: hidden; border: 1px solid #2a2d35; border-radius: 16px; background: #191b22; }
.rl-server-example img { display: block; width: 100%; height: auto; }
.rl-server-example figcaption { padding: 11px 14px; color: var(--rl-muted); font-size: .75rem; }

/* Definitive hero and rail rules; keep after legacy declarations. */
.rl-hero h1 {
  max-width: 100%;
  font-size: clamp(2.6rem, 3.4vw, 4.3rem);
  white-space: nowrap;
}

.rl-discord__rail .rl-server-icon,
.rl-discord__rail .rl-server-icon:first-child {
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.rl-discord__rail .rl-server-icon img,
.rl-discord__rail .rl-server-icon:first-child img {
  position: static;
  inset: auto;
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
  transform: none;
}

.rl-server-icon--enemy img { width: 88% !important; height: 88% !important; margin: auto; }

@media (max-width: 1120px) {
  .rl-hero h1 { font-size: clamp(2.7rem, 7vw, 4.6rem); white-space: normal; }
}

/* Final RoLive identity: the supplied transparent mark, never a coloured tile. */
.rl-brand-logo,
.rl-product-logo,
.rl-server-icon,
.rl-discord__rail span.rl-server-icon,
.rl-discord__rail span:first-child,
.rl-bot-mark,
.rl-community-mark {
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.rl-brand-logo img,
.rl-product-logo img,
.rl-server-icon img,
.rl-discord__rail .rl-server-icon img,
.rl-bot-mark img,
.rl-community-mark img {
  position: static;
  inset: auto;
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
  transform: none;
}

.rl-brand-logo { width: 38px; height: 38px; }
.rl-product-logo { width: 58px; height: 58px; }
.rl-server-icon { width: 38px; height: 38px; }
.rl-bot-mark { width: 32px; height: 32px; }

.rl-header-actions { justify-self: end; display: flex; align-items: center; gap: 10px; }
.rl-header-actions .rl-button--ghost { border-color: rgba(255,255,255,.22); background: transparent; color: #fff; box-shadow: none; }
.rl-header-actions .rl-button--ghost:hover { border-color: rgba(255,255,255,.42); background: rgba(255,255,255,.05); box-shadow: none; }
.rl-hero .rl-actions .rl-button--ghost { border-color: #fff; background: #fff; color: #0a0a0a; box-shadow: none; }
.rl-hero .rl-actions .rl-button--ghost:hover { border-color: #ececec; background: #ececec; color: #0a0a0a; box-shadow: none; }

.rl-hero h1 { font-size: clamp(2.45rem, 4.2vw, 4.9rem); white-space: nowrap; }
.rl-showcase,
.rl-platform-grid,
.rl-status { background: #000; color: #fff; }

.rl-dashboard-page { min-height: calc(100vh - 178px); display: grid; place-items: center; padding: clamp(42px, 8vw, 110px) 20px; background: radial-gradient(circle at 50% 45%, rgba(225,37,27,.13), transparent 43%), #050000; }
.rl-dashboard-card { width: min(880px, 100%); padding: clamp(36px, 7vw, 82px); text-align: center; border: 1px solid rgba(225,37,27,.38); border-radius: 28px; background: linear-gradient(145deg, #171012, #0d090b 72%); box-shadow: 0 28px 90px rgba(225,37,27,.16), inset 0 1px 0 rgba(255,255,255,.035); }
.rl-dashboard-card h1 { margin: 24px 0 10px; font-size: clamp(2.7rem, 6vw, 5.6rem); line-height: .98; }
.rl-dashboard-card h1 em { color: #e1251b; font-style: normal; }
.rl-dashboard-card h2 { margin: 18px 0; font-size: clamp(1.3rem, 2.3vw, 2rem); font-weight: 500; }
.rl-dashboard-card p { max-width: 680px; margin: 14px auto; color: var(--rl-muted); }
.rl-dashboard-card .rl-beta-label { border-color: rgba(225,37,27,.46); background: rgba(225,37,27,.12); color: #ff766f; }
.rl-dashboard-features { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.rl-dashboard-features span { padding: 7px 11px; border: 1px solid rgba(225,37,27,.22); border-radius: 999px; background: rgba(225,37,27,.07); color: #d8b5b3; font-size: .72rem; }
.rl-dashboard-card button { width: min(480px,100%); margin: 34px auto 18px; padding: 18px 24px; border: 1px solid rgba(225,37,27,.46); border-radius: 12px; background: rgba(225,37,27,.15); color: #ef7e78; font: inherit; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; cursor: not-allowed; opacity: .8; }
.rl-dashboard-card small { display: block; color: var(--rl-muted); }
.rl-header-links a[aria-current="page"] { color: #e1251b; }

.rl-legal { min-height: 100vh; padding: clamp(34px, 6vw, 80px) 22px 100px; background: #f4f3ef; color: #101114; }
.rl-legal > a { display: block; width: min(980px,100%); margin: 0 auto 44px; color: #b5231b; font-weight: 600; }
.rl-legal > header,
.rl-legal > nav,
.rl-legal > article { width: min(820px,100%); margin-inline: auto; }
.rl-legal > header { padding-bottom: 38px; border-bottom: 1px solid #d4d2cb; }
.rl-legal > header aside { margin-top: 30px; padding: 20px 22px; border-left: 4px solid #e1251b; border-radius: 0 12px 12px 0; background: #e9e7e1; }
.rl-legal > header aside strong { display: block; margin-bottom: 5px; color: #16171a; }
.rl-legal > header aside p { margin: 0; color: #555861; }
.rl-legal h1 { margin: 12px 0 18px; font-size: clamp(3rem,7vw,6rem); line-height: .95; letter-spacing: -.055em; }
.rl-legal > header p { color: #555861; }
.rl-legal__date { display: inline-flex; padding: 7px 12px; border: 1px solid #d5d1c8; border-radius: 999px; background: #fff; color: #34363b !important; font-size: .84rem; font-weight: 600; }
.rl-legal__intro { max-width: 680px; margin-top: 24px; color: #27292e !important; font-size: clamp(1.1rem,2vw,1.35rem); line-height: 1.55; }
.rl-legal > nav { position: sticky; top: 16px; z-index: 2; display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 24px; padding: 15px 18px; border: 1px solid #d4d2cb; border-radius: 12px; background: rgba(244,243,239,.94); backdrop-filter: blur(12px); }
.rl-legal > nav a { color: #3d4149; font-size: .88rem; font-weight: 600; }
.rl-legal article { padding-top: 26px; }
.rl-legal section { padding: 18px 0; }
.rl-legal section + section { border-top: 1px solid #dcdbd5; }
.rl-legal h2 { margin: 30px 0 12px; font-size: clamp(1.45rem,3vw,2.2rem); line-height: 1.18; }
.rl-legal p,
.rl-legal li { color: #454850; line-height: 1.8; }
.rl-legal mark { padding: 2px 5px; border-radius: 4px; background: #ffe3df; color: #8c1e17; }
.rl-legal__checklist { margin-top: 38px; padding: 24px 28px; border: 1px solid #d7d3cb; border-radius: 16px; background: #fff; }
.rl-legal__checklist h2 { margin-top: 0; }

.error-page { min-height: 100vh; display: grid; grid-template-rows: auto 1fr auto; background: #050505; color: #fff; }
.error-page__main { display: grid; place-items: center; padding: 70px 22px; text-align: center; }
.error-page__main section { width: min(720px,100%); }
.error-page__code { color: #e1251b; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.error-page__main h1 { margin: 18px 0; font-size: clamp(3.5rem,9vw,7.5rem); line-height: .9; letter-spacing: -.06em; }
.error-page__main p { margin: 0 auto 30px; color: #a4a6ad; font-size: 1.12rem; }

@media (max-width: 820px) {
  .rl-header-actions .rl-button--ghost { display: none; }
  .rl-hero h1 { white-space: normal; }
  .rl-legal > nav { position: static; }
}

@media (max-width: 520px) {
  .rl-header-actions .rl-button { padding: 10px 13px; font-size: .7rem; }
  .rl-brand > span:last-child { font-size: .92rem; }
  .rl-dashboard-card { border-radius: 20px; }
}

/* Final logo and hero sizing */
.rl-brand-logo,
.rl-product-logo,
.rl-discord__rail span.rl-server-icon,
.rl-bot-mark,
.rl-community-mark {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.rl-brand-logo img,
.rl-product-logo img,
.rl-bot-mark img,
.rl-server-icon img,
.rl-community-mark img {
  position: static;
  inset: auto;
  width: 72%;
  height: 72%;
  max-width: 72%;
  object-fit: contain;
  transform: none;
}

.rl-server-icon--rolive img { width: 82%; height: 82%; max-width: 82%; }
.rl-hero h1 { max-width: 100%; font-size: clamp(2.65rem, 3.55vw, 4.45rem); white-space: nowrap; }

@media (max-width: 1120px) { .rl-hero h1 { white-space: normal; } }

/* The supplied RoLive mark is transparent and must not receive a tile background. */
.rl-brand-logo,
.rl-product-logo,
.rl-discord__rail span.rl-server-icon,
.rl-bot-mark,
.rl-community-mark {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.rl-brand-logo img,
.rl-product-logo img,
.rl-bot-mark img,
.rl-server-icon img,
.rl-community-mark img {
  position: static;
  width: 64%;
  height: 64%;
  max-width: 64%;
  object-fit: contain;
}

.rl-server-icon,
.rl-bot-mark,
.rl-community-mark { overflow: hidden; place-items: center; }
.rl-server-icon--rolive img { width: 78%; height: 78%; max-width: 78%; }
.rl-hero { min-height: min(760px, calc(100svh - 82px)); padding-block: clamp(46px, 6vw, 84px); grid-template-columns: minmax(0, .95fr) minmax(440px, 1.05fr); gap: clamp(48px, 7vw, 110px); }
.rl-hero h1 { white-space: nowrap; max-width: none; font-size: clamp(3.25rem, 5.1vw, 6rem); }
.rl-lead { max-width: 610px; margin-block: 28px; }
.rl-trust-line { margin-top: 18px; }
.rl-discord__body { min-height: 360px; }

@media (max-width: 1120px) { .rl-hero h1 { white-space: normal; } }
@media (max-width: 980px) { .rl-hero { min-height: auto; grid-template-columns: 1fr; } }

/* Keep white as an occasional editorial break instead of the dominant canvas. */
.rl-showcase,
.rl-platform-grid,
.rl-status {
  background: var(--ink);
  color: var(--white);
}

.rl-showcase .rl-section-heading > p:last-child,
.rl-platform-grid .rl-section-heading > p:last-child {
  color: var(--muted);
}

.rl-showcase .rl-kicker,
.rl-platform-grid .rl-kicker {
  color: #e1251b;
}

/* Exact supplied transparent RoLive mark. */
.rl-brand-logo img,
.rl-product-logo img,
.rl-bot-mark img,
.rl-server-icon img,
.rl-server-icon--rolive img,
.rl-community-mark img {
  position: static;
  width: 82%;
  height: 82%;
  max-width: 82%;
  object-fit: contain;
}

.rl-server-icon,
.rl-server-icon--rolive,
.rl-bot-mark,
.rl-community-mark {
  overflow: hidden;
  place-items: center;
}

/* Enemy Studios visual system */
:root {
  --rl-bg: var(--ink);
  --rl-bg-soft: var(--ink-soft);
  --rl-panel: var(--panel);
  --rl-panel-2: var(--panel-raised);
  --rl-text: var(--white);
  --rl-muted: var(--muted);
  --rl-line: var(--line);
  --rl-blue: #e53220;
  --rl-blue-bright: #e1251b;
  --rl-cyan: #e1251b;
  --rl-content: var(--content);
  --rl-font: var(--body);
  --rl-radius: var(--radius-lg);
}

.rl-product-lockup {
  margin-bottom: 34px;
  display: flex;
  align-items: center;
  gap: 17px;
}

.rl-product-logo {
  width: 68px;
  height: 68px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: #e1251b;
  box-shadow: 0 14px 32px rgba(225, 37, 27, .22);
}

.rl-product-logo img {
  position: absolute;
  width: 284px;
  max-width: none;
  height: auto;
  left: -98px;
  top: -13px;
}

.rl-product-logo { position: relative; overflow: hidden; }

.rl-product-lockup > span:last-child {
  display: grid;
  gap: 3px;
}

.rl-product-lockup strong {
  font-size: 1.35rem;
  font-weight: 500;
  letter-spacing: -.035em;
}

.rl-product-lockup small {
  color: var(--muted);
  font-size: .7rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.rl-site-nav {
  position: relative;
  background: var(--ink);
}

.rl-site-nav .site-nav__inner {
  border-bottom: 1px solid var(--line);
}

.rl-hero {
  min-height: min(860px, calc(100svh - 92px));
  padding-block: clamp(72px, 8vw, 128px);
}

.rl-hero__glow {
  display: none;
}

.rl-hero h1,
.rl-intro h2,
.rl-section-heading h2,
.rl-section-copy h2,
.rl-feature-panel h2,
.rl-infrastructure h2,
.rl-dashboard h2,
.rl-cta h2 {
  font-weight: 400;
  letter-spacing: -0.055em;
}

.rl-hero h1 {
  font-size: clamp(3.5rem, 6.2vw, 6.9rem);
}

.rl-hero h1 em {
  color: #e1251b;
}

.rl-button {
  border-color: #e53220;
  border-radius: var(--radius-sm);
  background: #e53220;
  box-shadow: none;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.rl-button:hover {
  background: #e1251b;
  box-shadow: 0 12px 30px rgba(225, 37, 27, .24);
}

.rl-button--ghost {
  border-color: var(--line);
  background: transparent;
}

.rl-discord,
.rl-counter-stack,
.rl-total-card,
.rl-game-card,
.rl-community-card,
.rl-feature-panel,
.rl-security,
.rl-infrastructure,
.rl-dashboard,
.rl-status-grid {
  background: var(--panel);
  box-shadow: none;
}

.rl-discord {
  border-radius: var(--radius-lg);
  transform: none;
}

.rl-server-icon { position: relative; overflow: hidden; }
.rl-server-icon > img { width: 31px; height: 31px; object-fit: contain; }
.rl-server-icon--rolive > img { position: absolute; width: 176px; max-width: none; height: auto; left: -66px; top: -8px; }
.rl-bot-mark { position: relative; overflow: hidden; }
.rl-bot-mark img { position: absolute; width: 150px; max-width: none; height: auto; left: -52px; top: -7px; }

.rl-discord__rail span:first-child,
.rl-bot-mark {
  background: #e1251b;
}

.rl-game-card__art {
  background: radial-gradient(circle at 70% 25%, rgba(255, 119, 76, .58), transparent 26%), linear-gradient(140deg, #5d1712, #d93222 52%, #2b0a08);
}

.rl-total-card {
  border-color: rgba(225, 37, 27, .28);
  background: linear-gradient(155deg, #491712, #170908 68%);
}

.rl-node--core {
  border-color: rgba(255, 105, 71, .45);
  background: #e1251b;
  box-shadow: 0 0 35px rgba(225, 37, 27, .22);
}

.rl-chart__area {
  fill: rgba(225, 37, 27, .09);
}

.rl-chart__line {
  stroke: #e1251b;
  filter: drop-shadow(0 0 8px rgba(225, 37, 27, .5));
}

.rl-dashboard__graph {
  background: linear-gradient(170deg, transparent 45%, rgba(225, 37, 27, .2) 46%, transparent 48%), #101522;
}

.rl-value-strip {
  width: 100%;
  padding: 30px max(32px, calc((100vw - 1580px) / 2));
}

.rl-intro,
.rl-showcase,
.rl-platform-grid,
.rl-audience,
.rl-status {
  width: 100%;
  max-width: none;
  padding-inline: max(32px, calc((100vw - 1580px) / 2));
  background: var(--paper);
  color: var(--ink);
}

.rl-intro > p:last-child,
.rl-showcase .rl-section-heading > p:last-child,
.rl-audience .rl-section-heading > p:last-child,
.rl-status .rl-section-heading > p:last-child {
  color: var(--muted-dark);
}

.rl-showcase .rl-kicker,
.rl-platform-grid .rl-kicker,
.rl-audience .rl-kicker,
.rl-status .rl-kicker {
  color: #b62119;
}

.rl-product-grid,
.rl-platform-grid,
.rl-audience-grid,
.rl-status-grid {
  width: 100%;
}

.rl-platform-grid .rl-feature-panel,
.rl-showcase .rl-game-card,
.rl-showcase .rl-community-card,
.rl-status-grid {
  color: var(--white);
}

.rl-audience-grid article {
  border-color: var(--line-dark);
  background: transparent;
}

.rl-audience-grid article:hover {
  border-color: #e53220;
  background: rgba(225, 37, 27, .06);
}

.rl-audience-grid p {
  color: var(--muted-dark);
}

.rl-cta {
  border-color: #d92a1d;
  background: #e1251b;
}

.rl-cta .rl-kicker,
.rl-cta p:not(.rl-kicker) {
  color: rgba(255, 255, 255, .78);
}

.rl-cta .rl-button {
  border-color: var(--white);
  background: var(--white);
  color: var(--ink);
}

.rl-cta .rl-button--ghost {
  background: transparent;
  color: var(--white);
}

@media (max-width: 980px) {
  .rl-hero { min-height: auto; }
}

@media (max-width: 700px) {
  .rl-intro,
  .rl-showcase,
  .rl-platform-grid,
  .rl-audience,
  .rl-status {
    padding-inline: 14px;
  }

  .rl-value-strip {
    padding-inline: 14px;
  }

  .rl-header { grid-template-columns: 1fr auto; }
  .rl-header-links { display: none; }
}

/* Solid red wins over legacy accent declarations. */
.rl-brand-logo, .rl-product-logo, .rl-discord__rail span:first-child, .rl-bot-mark, .rl-node--core, .rl-cta { background: #e1251b; }
.rl-game-card__art { background: #a91c15; }
.rl-total-card { background: #21100f; }
.rl-button { border-color: #e1251b; background: #e1251b; }
.rl-button:hover { background: #f0352a; }
.rl-cta { border-color: #e1251b; background: #e1251b; }

/* Final shared page polish. */
.rl-footer { width: min(1560px, calc(100% - 40px)); min-height: 230px; margin: 36px auto 20px; padding: 42px 48px; border: 1px solid var(--rl-line); border-radius: 24px; background: #101114; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 34px; }
.rl-footer-brand { align-self: center; }
.rl-footer-brand .rl-brand-logo { width: 52px; height: 52px; background: transparent; }
.rl-footer nav { justify-self: end; flex-wrap: wrap; justify-content: flex-end; }
.rl-footer > small { grid-column: 1 / -1; padding-top: 22px; border-top: 1px solid var(--rl-line); }

.rl-help,
.rl-team { background: #f4f3ef; color: #0d0e11; }
.rl-help-hero,
.rl-team-hero { padding: clamp(80px,10vw,150px) max(24px,calc((100vw - 1320px)/2)); text-align: center; }
.rl-help-hero h1,
.rl-team-hero h1 { margin: 16px auto 24px; font-size: clamp(3.6rem,8vw,7.6rem); line-height: .92; letter-spacing: -.065em; font-weight: 400; }
.rl-team-hero > p:last-child { max-width: 850px; margin: auto; color: #555860; font-size: 1.15rem; line-height: 1.7; }
.rl-help-search { display: block; width: min(760px,100%); margin: 44px auto 0; text-align: left; }
.rl-help-search span { display: block; margin-bottom: 10px; font-size: .78rem; font-weight: 600; }
.rl-help-search input { width: 100%; padding: 20px 22px; border: 1px solid #d1d0cb; border-radius: 14px; background: #fff; color: #111; font: inherit; font-size: 1rem; outline: none; }
.rl-help-search input:focus { border-color: #e1251b; box-shadow: 0 0 0 4px rgba(225,37,27,.12); }
.rl-help-section,
.rl-team-section,
.rl-team-safety { padding: clamp(70px,8vw,120px) max(24px,calc((100vw - 1320px)/2)); }
.rl-help-section { background: #050505; color: #fff; }
.rl-help-section:nth-of-type(3) { background: #f4f3ef; color: #111; }
.rl-help-section .rl-section-heading { text-align: left; }
.rl-help-grid { margin-top: 44px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.rl-help-grid article { padding: 26px; border: 1px solid #292c33; border-radius: 16px; background: #111318; }
.rl-help-grid h3 { margin: 0 0 12px; font-size: 1.05rem; }
.rl-help-grid p { margin: 0; color: #9ca2af; line-height: 1.6; }
.rl-help-tag { display: inline-flex; margin: 0 6px 4px 0; padding: 4px 7px; border-radius: 999px; background: rgba(225,37,27,.13); color: #ef6a62; font-size: .67rem; font-weight: 600; text-transform: uppercase; }
.rl-help-empty { margin: 30px 0; color: #9ca2af; }
.rl-guide-list { margin-top: 40px; display: grid; gap: 12px; }
.rl-guide-list details { border: 1px solid #d5d3cc; border-radius: 14px; background: #fff; }
.rl-guide-list summary { padding: 22px 24px; cursor: pointer; font-weight: 600; }
.rl-guide-list summary span { float: right; color: #a02a23; font-size: .72rem; text-transform: uppercase; }
.rl-guide-list ol { margin: 0; padding: 0 48px 26px 62px; color: #555860; line-height: 1.8; }
.rl-help-support { padding: clamp(80px,9vw,130px) 24px; background: #e1251b; color: #fff; text-align: center; }
.rl-help-support h2 { margin: 10px 0 18px; font-size: clamp(2.8rem,6vw,5.5rem); font-weight: 400; }
.rl-help-support p { margin: 0 auto 30px; }
.rl-help-support .rl-button { border-color: #fff; background: #fff; color: #111; }
.rl-help-support div { margin-top: 28px; display: flex; justify-content: center; gap: 24px; }
.rl-help-support div a { color: #fff; }
.rl-founder-card { padding: clamp(32px,6vw,70px); border-radius: 26px; background: #101114; color: #fff; display: grid; grid-template-columns: 180px 1fr; gap: 50px; align-items: center; }
.rl-team-avatar { width: 180px; aspect-ratio: 1; padding: 38px; border-radius: 24px; background: #e1251b; }
.rl-team-avatar img { width: 100%; height: 100%; object-fit: contain; }
.rl-founder-card h2,
.rl-contributors h2 { margin: 12px 0 20px; font-size: clamp(2.4rem,5vw,4.8rem); font-weight: 400; letter-spacing: -.05em; }
.rl-founder-card p { color: #a6aab3; line-height: 1.7; }
.rl-team-links { display: flex; gap: 18px; margin-top: 24px; }
.rl-team-links a { color: #ff7770; }
.rl-contributors { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; }
.rl-contributors > p { color: #555860; line-height: 1.8; }
.rl-role-grid { grid-column: 1/-1; display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.rl-role-grid span { padding: 22px; border: 1px solid #d1d0cb; border-radius: 14px; background: #fff; }
.rl-team-safety { background: #050505; color: #fff; text-align: center; }
.rl-team-safety strong { font-size: 1.4rem; }
.rl-team-safety p { max-width: 760px; margin: 14px auto 0; color: #a6aab3; line-height: 1.7; }
@media (max-width: 850px) { .rl-footer { grid-template-columns: 1fr; padding: 32px 24px; }.rl-footer nav { justify-self: start; justify-content: flex-start; }.rl-help-grid { grid-template-columns: 1fr 1fr; }.rl-founder-card,.rl-contributors { grid-template-columns: 1fr; }.rl-role-grid { grid-template-columns: 1fr 1fr; }.rl-team-avatar { width: 120px; }.rl-contributors { gap: 20px; } }
@media (max-width: 560px) { .rl-help-grid,.rl-role-grid { grid-template-columns: 1fr; }.rl-guide-list summary span { float: none; display: block; margin-top: 7px; }.rl-help-support div,.rl-team-links { flex-direction: column; } }

/* Team directory inspired by the compact, verifiable profile-card layout. */
.rl-team-directory { padding: clamp(28px,5vw,72px) max(24px,calc((100vw - 1320px)/2)) clamp(70px,8vw,120px); background: radial-gradient(circle at 12% 0,rgba(225,37,27,.13),transparent 38%),#09090b; color:#fff; }
.rl-team-guidance { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border:1px solid #343139; border-radius:28px; background:#19171e; overflow:hidden; }
.rl-team-guidance > div { padding:clamp(28px,4vw,54px); }
.rl-team-guidance > div + div { border-left:1px solid #343139; }
.rl-team-guidance h2 { margin:0 0 18px; font-size:1.35rem; }
.rl-team-guidance p { max-width:580px; margin:0; color:#b7b1bd; line-height:1.75; }
.rl-team-guidance a { display:inline-block; margin-top:14px; color:#ff7770; }
.rl-team-card-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin-top:38px; }
.rl-team-profile { min-height:330px; padding:38px; border:1px solid #343139; border-radius:26px; background:#19171e; display:flex; flex-direction:column; }
.rl-team-profile__head { display:flex; align-items:center; gap:24px; }
.rl-team-profile__avatar { width:96px; height:96px; flex:0 0 auto; overflow:hidden; border-radius:24px; background:#e1251b; }
.rl-team-profile__avatar img { width:100%; height:100%; object-fit:cover; }
.rl-team-profile__avatar--enemy { padding:20px; }
.rl-team-profile__avatar--enemy img { object-fit:contain; }
.rl-team-profile__avatar--person { border-radius:50%; background:#222; }
.rl-team-profile__avatar--person img { width:100%; height:100%; object-fit:cover; }
.rl-team-profile h2 { margin:0 0 8px; font-size:1.65rem; }
.rl-team-profile h2 span { display:inline-flex; align-items:center; margin-left:8px; padding:5px 9px; border:1px solid rgba(225,37,27,.35); border-radius:7px; background:rgba(225,37,27,.12); color:#ff8a83; font-size:.65rem; font-weight:700; line-height:1; letter-spacing:.08em; vertical-align:middle; }
.rl-team-profile__head p { margin:0; color:#ff8a83; }
.rl-team-profile__detail { margin-top:auto; padding-top:28px; border-top:1px solid #37343b; display:grid; gap:10px; }
.rl-team-profile__detail small { color:#aaa4af; }
.rl-team-profile__detail strong,.rl-team-profile__detail a { color:#fff; font-size:1rem; }
.rl-discord-id { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.rl-discord-id strong { overflow-wrap:anywhere; color:#c9d1ff; font-weight:500; }
.rl-discord-id button { width:42px; height:42px; flex:0 0 auto; border:1px solid #49434f; border-radius:11px; background:#24212a; color:#ffb0cd; font-size:1.25rem; cursor:pointer; }
.rl-discord-id button:hover { border-color:#e1251b; color:#fff; }
@media (max-width:760px) { .rl-team-guidance,.rl-team-card-grid { grid-template-columns:1fr; }.rl-team-guidance > div + div { border-left:0; border-top:1px solid #343139; }.rl-team-profile { min-height:290px; padding:26px; }.rl-team-profile__avatar { width:74px; height:74px; border-radius:19px; } }

/* Final bot-mark correction: show the complete supplied logo without legacy cropping. */
.rl-bot-mark img { position:static; width:100%; height:100%; max-width:100%; object-fit:contain; inset:auto; }

.rl-legal-links { width:var(--rl-content); margin:-52px auto 100px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.rl-legal-links > a { min-height:150px; padding:28px; border:1px solid var(--rl-line); border-radius:22px; background:#101114; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:20px; color:#fff; text-decoration:none; transition:transform .2s ease,border-color .2s ease; }
.rl-legal-links > a:hover { transform:translateY(-3px); border-color:#e1251b; }
.rl-legal-icon { width:58px; height:58px; border-radius:16px; background:#e1251b; display:grid; place-items:center; font-size:1.65rem; font-weight:600; }
.rl-legal-links a > span:nth-child(2) { display:grid; gap:5px; }
.rl-legal-links small { color:#e96a62; font-size:.65rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.rl-legal-links strong { font-size:1.15rem; }
.rl-legal-links em { color:#9298a5; font-size:.78rem; font-style:normal; line-height:1.5; }
.rl-cta .rl-button--final { min-width:min(390px,100%); min-height:86px; padding:0 42px; border-color:#fff; border-radius:999px; background:#fff; box-shadow:0 18px 42px rgba(65,0,0,.22); color:#b51f2d; font-size:1.25rem; text-transform:none; }
.rl-cta .rl-button--final span { margin-left:18px; transition:transform .2s ease; }
.rl-cta .rl-button--final:hover { background:#fff; box-shadow:0 22px 48px rgba(65,0,0,.3); }
.rl-cta .rl-button--final:hover span { transform:translateX(5px); }
.rl-legal-links b { color:#e96a62; font-size:1.35rem; }
@media (max-width:720px) { .rl-legal-links { grid-template-columns:1fr; margin-top:-32px; }.rl-legal-links > a { min-height:130px; padding:22px; } }
