@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=Manrope:wght@400;500;600;700&display=swap');
:root { --bg:#090d0b; --panel:#101612; --panel-soft:#151d17; --text:#edf1e9; --muted:#9ca89d; --line:rgba(226,239,218,.14); --accent:#c9f26d; --accent-dark:#15200d; --shadow:0 26px 90px rgba(0,0,0,.34); --container:1240px; }
[data-theme="light"] { --bg:#edf0e8; --panel:#fff; --panel-soft:#e3e9dd; --text:#172018; --muted:#637064; --line:rgba(23,32,24,.14); --accent:#719b25; --accent-dark:#f1f7df; --shadow:0 26px 90px rgba(41,57,35,.13); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--bg); color:var(--text); font:15px/1.5 'Manrope',sans-serif; } a { color:inherit; text-decoration:none; } button,input { font:inherit; } button { cursor:pointer; }
.cookie-banner { align-items:center; background:var(--panel); border:1px solid var(--line); bottom:20px; box-shadow:var(--shadow); display:flex; gap:24px; justify-content:space-between; left:50%; max-width:var(--container); padding:18px 22px; position:fixed; transform:translateX(-50%); width:calc(100% - 34px); z-index:20; }
.cookie-banner[hidden] { display:none; }
.mechanics-sectors { display:grid; gap:42px; margin-top:58px; }
.mechanic-sector { background:linear-gradient(135deg,rgba(201,242,109,.035),transparent 42%),var(--panel); border:1px solid var(--line); border-radius:4px; box-shadow:0 18px 60px rgba(0,0,0,.18); overflow:hidden; padding:0; position:relative; }
.mechanic-sector::after { background:linear-gradient(90deg,transparent,var(--accent),transparent); content:""; height:1px; left:8%; opacity:.35; position:absolute; right:8%; top:0; }
.mechanic-sector-heading { align-items:center; display:grid; gap:20px; grid-template-columns:74px 50px minmax(0,1fr); padding:34px 36px 28px; position:relative; }
.mechanic-number { color:rgba(201,242,109,.2); font:700 74px/.75 'Barlow Condensed'; letter-spacing:.02em; }
.mechanic-icon { align-items:center; background:rgba(201,242,109,.1); border:1px solid rgba(201,242,109,.3); border-radius:50%; color:var(--accent); display:grid; font-size:22px; height:50px; place-items:center; width:50px; }
.mechanic-heading-copy { min-width:0; }
.mechanic-meta { align-items:center; display:flex; flex-wrap:wrap; gap:8px; margin-bottom:9px; }
.mechanic-category,.mechanic-badge { border:1px solid var(--line); border-radius:999px; color:var(--accent); font-size:9px; font-weight:800; letter-spacing:.12em; padding:5px 9px; text-transform:uppercase; }
.mechanic-badge { background:rgba(201,242,109,.1); }
.mechanic-heading-copy h2 { font-size:clamp(34px,5vw,64px); line-height:.9; text-transform:uppercase; }
.mechanic-heading-copy > p { color:var(--muted); font-size:13px; margin:10px 0 0; max-width:680px; }
.mechanic-highlight-row { border-block:1px solid var(--line); display:flex; flex-wrap:wrap; gap:9px; padding:16px 36px; }
.mechanic-highlight-row span { background:var(--panel-soft); border:1px solid var(--line); border-radius:999px; color:var(--text); font-size:10px; font-weight:800; letter-spacing:.08em; padding:7px 10px; text-transform:uppercase; }
.mechanic-subgrid { display:grid; gap:1px; grid-template-columns:repeat(3,1fr); padding:24px 36px 36px; }
.mechanic-subcard { background:rgba(255,255,255,.018); border:1px solid var(--line); min-height:190px; padding:22px; transition:border-color .2s,transform .2s,background .2s; }
.mechanic-subcard:hover { background:rgba(201,242,109,.045); border-color:rgba(201,242,109,.4); transform:translateY(-3px); }
.subcard-icon { color:var(--accent); font-size:21px; height:28px; }
.mechanic-subcard h3 { font-size:25px; margin:18px 0 9px; text-transform:uppercase; }
.mechanic-subcard p { color:var(--muted); font-size:12px; line-height:1.7; margin:0; }
.mechanic-command-card { display:flex; flex-direction:column; }
.mechanic-command { background:var(--bg); border:1px solid rgba(201,242,109,.35); color:var(--accent); cursor:pointer; font:700 14px/1 'Manrope',sans-serif; letter-spacing:.04em; margin-top:auto; padding:12px 14px; text-align:left; width:max-content; }
.mechanic-command:hover { background:rgba(201,242,109,.12); }
.commands-page { max-width:var(--container); }
.commands-how { align-items:center; background:var(--panel); border:1px solid var(--line); display:flex; gap:14px; margin-top:38px; padding:16px 20px; }
.commands-terminal-dot { background:var(--accent); border-radius:50%; box-shadow:0 0 0 4px rgba(201,242,109,.12); height:8px; width:8px; }
.commands-how small { color:var(--accent); display:block; font-size:9px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }.commands-how strong { display:block; font:600 16px 'monospace'; }.commands-how p { color:var(--muted); font-size:12px; margin:0 0 0 auto; }
.commands-toolbar { align-items:center; display:flex; gap:18px; justify-content:space-between; margin:24px 0 42px; }.command-filters { display:flex; gap:7px; }.command-filter { background:transparent; border:1px solid var(--line); color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.08em; padding:8px 12px; text-transform:uppercase; }.command-filter.is-active,.command-filter:hover { background:var(--accent); border-color:var(--accent); color:var(--accent-dark); }.command-search { align-items:center; border:1px solid var(--line); display:flex; gap:8px; max-width:300px; padding:9px 12px; width:100%; }.command-search input { background:transparent; border:0; color:var(--text); min-width:0; outline:0; width:100%; }.command-group { margin-top:22px; }.command-group-heading { border-bottom:1px solid var(--line); margin-bottom:16px; padding-bottom:12px; }.command-group-heading h2 { font-size:32px; margin-top:7px; text-transform:uppercase; }.commands-grid { display:grid; gap:14px; grid-template-columns:repeat(3,1fr); }.command-card { background:var(--panel); border:1px solid var(--line); min-height:190px; padding:19px; transition:border-color .2s,transform .2s,box-shadow .2s; }.command-card:hover { border-color:rgba(201,242,109,.55); box-shadow:0 14px 35px rgba(0,0,0,.16); transform:translateY(-2px); }.command-card-vip { border-color:rgba(201,242,109,.28); }.command-card-top { align-items:center; display:flex; justify-content:space-between; }.command-icon { color:var(--accent); font-size:20px; }.command-badge { border:1px solid var(--line); border-radius:999px; color:var(--accent); font-size:9px; font-weight:800; letter-spacing:.1em; padding:4px 8px; text-transform:uppercase; }.command-line { align-items:center; display:flex; gap:10px; justify-content:space-between; margin:26px 0 12px; }.command-line code { color:var(--text); font:700 22px 'monospace'; }.copy-command { background:transparent; border:1px solid var(--line); color:var(--muted); font-size:9px; font-weight:800; padding:7px 9px; text-transform:uppercase; }.copy-command:hover,.copy-command.is-copied { background:var(--accent); border-color:var(--accent); color:var(--accent-dark); }.command-card > p { color:var(--muted); font-size:12px; line-height:1.7; margin:0; }.command-related { color:var(--accent); display:inline-block; font-size:10px; font-weight:800; margin-top:16px; text-transform:uppercase; }.command-card[hidden] { display:none; }
@media (max-width:820px) { .commands-how { align-items:flex-start; flex-wrap:wrap; }.commands-how p { flex-basis:100%; margin:4px 0 0; }.commands-toolbar { align-items:stretch; flex-direction:column; }.command-filters { overflow-x:auto; }.command-search { max-width:none; }.commands-grid { grid-template-columns:1fr; }.command-line { margin-top:20px; } }
.rules-hero { padding-bottom:70px; }
.rules-hero h2 { font-size:clamp(30px,4vw,56px); line-height:1; margin:22px 0 14px; max-width:800px; }
.rules-meta { display:flex; gap:28px; margin-top:28px; }
.rules-meta span { border-left:2px solid var(--accent); display:flex; flex-direction:column; gap:3px; padding-left:12px; }
.rules-meta small { color:var(--muted); font-size:10px; text-transform:uppercase; }
.rules-meta strong { font-size:12px; }
.rules-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.rules-workspace { display:grid; gap:40px; grid-template-columns:230px minmax(0,1fr); margin:0 auto 110px; max-width:var(--container); }
.rules-index { align-self:start; position:sticky; top:110px; }
.rules-index > strong { color:var(--accent); font-size:11px; letter-spacing:.12em; }
.rules-index nav { border-left:1px solid var(--line); display:flex; flex-direction:column; margin-top:20px; }
.rules-index nav a { border-left:2px solid transparent; color:var(--muted); font-size:11px; padding:9px 0 9px 14px; }
.rules-index nav a:hover,.rules-index nav a.active { border-color:var(--accent); color:var(--text); }
.rules-index nav span { color:var(--accent); margin-right:8px; }
.rules-search { align-items:center; border:1px solid var(--line); display:flex; gap:7px; margin-top:18px; padding:8px 10px; }
.rules-search input { background:transparent; border:0; color:var(--text); min-width:0; outline:0; width:100%; }
.rules-main { display:grid; gap:22px; }
.rules-gold,.rules-callout,.rule-card,.rules-timeline,.rules-closing { background:var(--panel); border:1px solid var(--line); padding:28px; }
.rules-gold h2,.rules-callout h2,.rules-timeline h2,.rules-closing h2 { font-size:clamp(32px,4vw,56px); line-height:.95; margin:8px 0 22px; text-transform:uppercase; }
.gold-grid { display:grid; gap:1px; grid-template-columns:repeat(5,1fr); }
.gold-grid article { background:var(--panel-soft); border:1px solid var(--line); min-height:170px; padding:17px; }
.gold-grid strong,.rule-number { color:var(--accent); font:600 28px/.9 'Barlow Condensed'; }
.gold-grid h3 { font-size:20px; margin:28px 0 8px; text-transform:uppercase; }
.gold-grid p,.rules-callout p,.rules-closing p,.rule-card p { color:var(--muted); font-size:13px; line-height:1.75; margin:0; }
.rules-callout { border-left:3px solid var(--accent); }
.rules-callout h2 { font-size:clamp(28px,3vw,42px); }
.rule-card { scroll-margin-top:100px; }
.rule-card header { display:grid; gap:20px; grid-template-columns:55px minmax(0,1fr); }
.rule-card-meta { align-items:center; display:flex; flex-wrap:wrap; gap:8px; }
.rule-card-meta > span { color:var(--accent); font-size:10px; font-weight:800; letter-spacing:.12em; }
.severity { border-radius:999px; font-size:9px; font-style:normal; font-weight:800; letter-spacing:.08em; padding:5px 8px; }
.severity-zero { background:rgba(190,70,60,.2); color:#ff9d91; }.severity-competitive { background:rgba(218,150,45,.18); color:#ffc76b; }.severity-neutral { background:var(--panel-soft); color:var(--muted); }
.rule-card h2 { font-size:clamp(28px,3vw,44px); line-height:.95; margin:12px 0 10px; text-transform:uppercase; }
.rule-card details { border-top:1px solid var(--line); margin-top:24px; padding-top:15px; }.rule-card summary { color:var(--accent); cursor:pointer; font-size:11px; font-weight:800; text-transform:uppercase; }.rule-card summary span { float:right; font-size:18px; }
.not-offense-grid { display:grid; gap:8px; grid-template-columns:repeat(3,1fr); }.not-offense-grid span { background:var(--panel-soft); border:1px solid var(--line); color:var(--text); font-size:12px; padding:12px; }
.rules-timeline > div { display:grid; grid-template-columns:repeat(5,1fr); }.rules-timeline article { border-top:2px solid var(--accent); padding:16px 12px 0; }.rules-timeline article strong { color:var(--accent); display:block; font:600 22px 'Barlow Condensed'; }.rules-timeline article span { font-size:12px; }
.rules-closing { background:linear-gradient(135deg,rgba(201,242,109,.1),transparent 65%),var(--panel); text-align:center; }.rules-closing p { margin:0 auto 24px; max-width:700px; }
@media (max-width:820px) { .rules-workspace { display:block; margin:0 17px 80px; } .rules-index { background:var(--panel); border:1px solid var(--line); margin-bottom:18px; padding:16px; position:sticky; top:74px; z-index:4; } .rules-index nav { display:none; }.rules-index:focus-within nav,.rules-index:hover nav { display:flex; max-height:220px; overflow:auto; }.gold-grid,.not-offense-grid { grid-template-columns:1fr; }.rules-timeline > div { display:grid; grid-template-columns:1fr; gap:12px; }.rules-timeline article { border-left:2px solid var(--accent); border-top:0; padding:8px 12px; }.rules-hero { margin:0 17px; padding-inline:0; }.rules-gold,.rules-callout,.rule-card,.rules-timeline,.rules-closing { padding:20px; } }
@media (max-width:820px) { .mechanic-sector-heading { gap:14px; grid-template-columns:45px 40px minmax(0,1fr); padding:25px 18px 22px; } .mechanic-number { font-size:46px; } .mechanic-icon { font-size:18px; height:40px; width:40px; } .mechanic-heading-copy h2 { font-size:34px; } .mechanic-highlight-row { padding:14px 18px; } .mechanic-subgrid { grid-template-columns:1fr; padding:18px; } .mechanic-subcard { min-height:0; } }
.nav-dropdown { position:relative; }
.nav-dropdown-toggle { align-items:center; appearance:none; background:transparent; border:0; color:var(--muted); display:flex; font-size:11px; font-weight:700; gap:5px; letter-spacing:.06em; padding:0; text-transform:uppercase; }
.nav-dropdown-toggle:hover { color:var(--text); }
.nav-dropdown-toggle span { align-items:center; color:var(--accent); display:inline-flex; font-size:14px; line-height:1; transform:translateY(-1px); }
.nav-chevron { border-bottom:2px solid var(--accent); border-right:2px solid var(--accent); display:inline-block; height:6px; margin-left:2px; transform:rotate(45deg) translateY(-2px); transition:transform .2s; width:6px; }
.nav-dropdown.is-open .nav-chevron { transform:rotate(225deg) translate(-1px, -1px); }
.nav-dropdown-menu { background:var(--panel); border:1px solid var(--line); box-shadow:var(--shadow); display:none; min-width:190px; padding:8px; position:absolute; top:100%; left:-10px; z-index:12; }
.nav-dropdown-menu::before { content:""; height:9px; left:0; position:absolute; right:0; top:-9px; }
.nav-dropdown-menu a { display:block; padding:9px 10px; }
.nav-dropdown:hover .nav-dropdown-menu, .nav-dropdown:focus-within .nav-dropdown-menu, .nav-dropdown.is-open .nav-dropdown-menu { display:block; }
.main-nav .nav-language-switcher { display:none; }
.cookie-banner strong { font:600 24px/.95 'Barlow Condensed'; text-transform:uppercase; }
.cookie-banner p { color:var(--muted); font-size:12px; margin:6px 0 0; max-width:700px; }
.cookie-banner p a { color:var(--accent); text-decoration:underline; }
.cookie-actions { display:flex; flex:none; gap:8px; }
.cookie-actions .button { min-height:42px; padding:0 14px; }
@media (max-width:820px) { .cookie-banner { align-items:stretch; flex-direction:column; gap:14px; } .cookie-actions { width:100%; } .cookie-actions .button { flex:1; } }
@media (max-width:820px) { .nav-dropdown { width:100%; } .nav-dropdown-toggle { font-size:13px; } .nav-dropdown-menu { border:0; box-shadow:none; display:none; padding:5px 0 0 15px; position:static; width:100%; } .nav-dropdown.is-open .nav-dropdown-menu { display:block; } }
.site-shell { min-height:100vh; overflow:hidden; background:radial-gradient(circle at 10% 0%,rgba(201,242,109,.07),transparent 35%),var(--bg); }
.topbar { align-items:center; backdrop-filter:blur(12px); background:rgba(9,13,11,.38); border-bottom:1px solid transparent; display:flex; gap:30px; height:82px; margin:auto; padding:0 max(24px,calc((100% - var(--container))/2)); position:sticky; top:0; transition:background .25s,border-color .25s; z-index:10; }
.topbar.scrolled { background:rgba(9,13,11,.92); border-color:var(--line); } [data-theme="light"] .topbar { background:rgba(237,240,232,.72); } [data-theme="light"] .topbar.scrolled { background:rgba(237,240,232,.95); }
.brand { flex-shrink:0; width:190px; } .brand img { display:block; height:52px; max-width:210px; object-fit:contain; transform:scale(1.35); transform-origin:left center; width:auto; } .main-nav { align-items:center; display:flex; flex:1; gap:24px; } .main-nav a,.header-discord { color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; transition:color .2s; } .main-nav a:hover,.main-nav a:focus,.header-discord:hover { color:var(--text); }
.top-actions { align-items:center; display:flex; gap:8px; } .icon-button { align-items:center; background:transparent; border:1px solid var(--line); border-radius:50%; color:var(--text); display:grid; height:34px; place-items:center; width:34px; } .icon-button:hover { border-color:var(--accent); color:var(--accent); } .discord-icon svg { fill:currentColor; height:17px; width:17px; } .language-switcher { border:1px solid var(--line); border-radius:18px; display:flex; margin-left:4px; padding:3px; } .language-option { color:var(--muted); font-size:10px; font-weight:700; padding:5px 8px; border-radius:14px; } .language-option.active { background:var(--accent); color:var(--accent-dark); }
.menu-toggle { background:transparent; border:0; display:none; padding:8px; } .menu-toggle span { background:var(--text); display:block; height:2px; margin:4px; width:22px; }
.hero { align-items:center; display:flex; min-height:clamp(620px,78vh,780px); margin:auto; max-width:1440px; overflow:hidden; padding:0 max(24px,calc((100% - var(--container))/2)); position:relative; } .hero-atmosphere { background:linear-gradient(90deg,rgba(9,13,11,.98) 0%,rgba(9,13,11,.84) 31%,rgba(9,13,11,.36) 68%,rgba(9,13,11,.12) 100%),linear-gradient(0deg,var(--bg),transparent 38%),url('/marca/marca_d_agua.png') center/cover no-repeat; inset:0; opacity:.68; position:absolute; } [data-theme="light"] .hero-atmosphere { opacity:.19; }
.hero-content { max-width:650px; padding:70px 0; position:relative; z-index:1; } .eyebrow { color:var(--accent); font-size:10px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; } .eyebrow span { color:var(--muted); } h1,h2,h3 { font-family:'Barlow Condensed',sans-serif; letter-spacing:0; margin:0; } .hero h1 { font-size:clamp(70px,8vw,116px); line-height:.82; margin:22px 0 25px; text-transform:uppercase; } .hero h1 em { color:var(--accent); font-style:normal; } .hero-copy { color:var(--muted); font-size:16px; line-height:1.8; max-width:500px; } .hero-actions { align-items:center; display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.button { align-items:center; border:1px solid var(--line); display:inline-flex; gap:18px; justify-content:center; min-height:50px; padding:0 20px; text-transform:uppercase; font-size:11px; font-weight:700; letter-spacing:.07em; transition:background .2s,border-color .2s,transform .2s; } .button:hover { border-color:var(--accent); transform:translateY(-2px); } .button:disabled { cursor:not-allowed; opacity:.55; transform:none; } .button-primary { background:var(--accent); border-color:var(--accent); color:var(--accent-dark); } .button-secondary { background:rgba(255,255,255,.03); color:var(--text); } .text-link { color:var(--text); font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; } .text-link span { color:var(--accent); font-size:16px; margin-left:5px; }
.server-address { align-items:center; border-top:1px solid var(--line); display:flex; gap:12px; margin-top:46px; max-width:560px; padding-top:17px; } .server-address > div { display:flex; flex-direction:column; gap:2px; } .server-address small,.status-bar small { color:var(--muted); font-size:10px; } .server-address strong { font-size:12px; } .address-value { border-left:1px solid var(--line); margin-left:auto; padding-left:22px; } .status-dot { background:var(--accent); border-radius:50%; box-shadow:0 0 0 5px rgba(201,242,109,.12); display:inline-block; flex:none; height:8px; width:8px; }
.hero-marker { align-items:center; bottom:70px; display:flex; gap:16px; position:absolute; right:max(24px,calc((100% - var(--container))/2)); z-index:1; } .hero-marker span { color:var(--accent); font:700 52px/.8 'Barlow Condensed'; } .hero-marker small { border-left:1px solid var(--line); color:var(--muted); font-size:10px; line-height:1.6; padding-left:16px; }
.status-bar { border-bottom:1px solid var(--line); border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(4,1fr); margin:auto; max-width:var(--container); } .status-bar > div { border-right:1px solid var(--line); display:flex; flex-direction:column; gap:5px; min-height:104px; padding:22px 24px 20px 0; } .status-bar > div:not(:first-child) { padding-left:24px; } .status-bar > div:last-child { border:0; } .status-bar strong { align-items:center; display:flex; font:600 25px/.95 'Barlow Condensed'; gap:9px; text-transform:uppercase; }
.section { margin:auto; max-width:var(--container); padding:125px 0; } .section-intro { max-width:560px; } .section-intro h2,.section-heading h2,.split-section h2,.wipe-feature h2 { font-size:clamp(48px,6vw,82px); line-height:.9; margin:15px 0 20px; text-transform:uppercase; } .section-intro > p:last-child,.section-heading p,.split-section > div > p:not(.eyebrow),.community-block > p:not(.eyebrow) { color:var(--muted); line-height:1.8; }
.feature-grid { border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(4,1fr); margin-top:65px; } .feature-grid article { border-right:1px solid var(--line); min-height:205px; padding:30px 24px 24px; } .feature-grid article:not(:first-child) { padding-left:24px; } .feature-grid article:last-child { border:0; } .feature-number,.steps-grid span { color:var(--accent); font:600 28px/.9 'Barlow Condensed'; } .feature-grid h3,.steps-grid h3 { font-size:29px; margin:35px 0 10px; text-transform:uppercase; } .feature-grid p,.steps-grid p { color:var(--muted); font-size:13px; line-height:1.7; margin:0; }
.ranking-section { border-top:1px solid var(--line); } .section-heading { align-items:end; display:flex; justify-content:space-between; gap:25px; } .section-heading > div { max-width:640px; } .ranking-empty { align-items:center; background:var(--panel); border:1px solid var(--line); display:flex; gap:22px; margin-top:48px; min-height:145px; padding:25px; } .ranking-empty img { height:42px; object-fit:contain; width:42px; } .ranking-empty strong { font:600 27px/.95 'Barlow Condensed'; text-transform:uppercase; } .ranking-empty p { color:var(--muted); font-size:12px; margin:7px 0 0; } .ranking-empty .button { margin-left:auto; }
.ranking-preview { background:var(--panel); border:1px solid var(--line); margin-top:48px; padding:18px 24px 24px; }
.ranking-preview-head,.ranking-preview-row { display:grid; gap:18px; grid-template-columns:55px 1fr 120px; }
.ranking-preview-head { border-bottom:1px solid var(--line); color:var(--muted); font-size:10px; letter-spacing:.1em; padding:8px 0 14px; text-transform:uppercase; }
.ranking-preview-row { border-bottom:1px solid var(--line); padding:16px 0; }
.ranking-preview-row strong { color:var(--accent); font:600 20px 'Barlow Condensed'; }
.ranking-preview-row b { color:var(--accent); font-family:'Barlow Condensed'; font-size:20px; }
.ranking-preview .button { margin-top:20px; }
.section .ranking-preview { display:block; width:100%; }
.section .ranking-preview-head { align-items:center; display:grid; min-height:34px; }
.section .ranking-preview-row { align-items:center; border-bottom:1px solid var(--line); display:grid; min-height:54px; }
.section .ranking-preview-row span { color:var(--text); font-size:13px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.section .ranking-preview-row strong,.section .ranking-preview-row b { display:block; }
@media (max-width:820px) { .section .ranking-preview-head,.section .ranking-preview-row { grid-template-columns:42px minmax(0,1fr) 80px; } .ranking-preview { padding:16px; } }
.steps-section { border-top:1px solid var(--line); } .steps-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:58px; } .steps-grid article { background:var(--panel); border:1px solid var(--line); min-height:220px; padding:25px; } .steps-grid h3 { margin-top:42px; }
.wipe-feature { align-items:center; background:var(--panel); border-block:1px solid var(--line); display:flex; justify-content:space-between; margin:auto; max-width:1440px; padding:72px max(24px,calc((100% - var(--container))/2)); } .wipe-feature > div:first-child { max-width:570px; } .wipe-feature h2 { margin-bottom:12px; } .wipe-feature p { color:var(--muted); } .wipe-feature p strong { color:var(--text); } .wipe-clock { border-left:1px solid var(--line); min-width:290px; padding-left:45px; } .wipe-clock span { color:var(--accent); display:block; font:600 clamp(38px,5vw,65px)/.9 'Barlow Condensed'; text-transform:uppercase; } .wipe-clock small { color:var(--muted); font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.split-section { display:grid; grid-template-columns:1fr 1fr; margin:auto; max-width:var(--container); padding:125px 0; } .split-section > div { min-height:310px; padding-right:75px; } .split-section > div + div { border-left:1px solid var(--line); padding-left:75px; padding-right:0; } .split-section .text-link,.community-block .button { margin-top:28px; } .community-block { background:linear-gradient(135deg,rgba(201,242,109,.09),transparent 60%),var(--panel); padding:35px!important; }
.footer { align-items:end; border-top:1px solid var(--line); color:var(--muted); display:flex; font-size:11px; justify-content:space-between; margin:auto; max-width:var(--container); padding:35px 0; } .footer-brand { align-items:center; display:flex; gap:12px; } .footer-brand div { display:flex; flex-direction:column; gap:3px; } .footer-brand strong { color:var(--text); font-family:'Barlow Condensed'; font-size:20px; text-transform:uppercase; } .footer-mark { height:30px; object-fit:contain; width:30px; } .footer-links { display:flex; gap:20px; } .footer-links a:hover { color:var(--text); }
.reveal { animation:rise .65s both; } .reveal-delay { animation-delay:.15s; } @keyframes rise { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:none; } } :focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.easter-egg-toast { background:var(--accent); bottom:24px; color:var(--accent-dark); font-size:12px; font-weight:700; left:50%; letter-spacing:.04em; max-width:calc(100% - 34px); opacity:0; padding:14px 18px; pointer-events:none; position:fixed; text-align:center; transform:translate(-50%,12px); transition:opacity .2s,transform .2s; z-index:20; } .easter-egg-toast.is-visible { opacity:1; transform:translate(-50%,0); }
@media (max-width:820px) { .feature-grid article:first-child { padding-left:14px; } }
.feature-grid article:first-child::after { color:var(--accent); content:''; font-size:9px; font-weight:800; letter-spacing:.12em; opacity:0; position:absolute; right:14px; top:14px; transform:translateY(-4px); transition:opacity .2s,transform .2s; } .feature-grid article:first-child:hover::after { content:'RAID DETECTADA'; opacity:.8; transform:none; }
.midnight-mode .terra-world { filter:saturate(.78) brightness(.82); } .midnight-mode .terra-world .hero-atmosphere { opacity:.82; } .midnight-mode .terra-world .hero-sky { background:radial-gradient(ellipse at 72% 28%,rgba(157,174,155,.1),transparent 28%),linear-gradient(180deg,#0d1511 0%,#070a08 76%); }
@media (max-width:820px) { .topbar { gap:12px; height:70px; padding:0 17px; } .brand img { height:40px; max-width:135px; } .menu-toggle { display:block; order:3; } .main-nav { align-items:flex-start; background:var(--panel); border:1px solid var(--line); display:none; flex-direction:column; gap:19px; left:17px; padding:20px; position:absolute; right:17px; top:66px; } .main-nav.is-open { display:flex; } .main-nav a { font-size:13px; } .main-nav .nav-language-switcher { border-top:1px solid var(--line); display:flex; margin-top:5px; padding-top:19px; width:100%; } .header-discord { display:none; } .top-actions { margin-left:auto; } .top-actions .top-language-switcher { display:none; } .icon-button { height:31px; width:31px; } .hero { min-height:660px; padding:0 17px; } .hero-atmosphere { background:linear-gradient(180deg,rgba(9,13,11,.83),rgba(9,13,11,.98) 88%),url('/marca/marca_d_agua.png') 68% center/cover no-repeat; } .hero-content { padding:70px 0 125px; } .hero h1 { font-size:clamp(64px,17vw,82px); } .hero-copy { font-size:14px; } .hero-actions { align-items:stretch; flex-direction:column; } .hero-actions .button { width:100%; } .hero-actions .text-link { margin:6px 0 0 4px; } .server-address { align-items:flex-start; flex-wrap:wrap; margin-top:33px; } .address-value { border-left:0; margin-left:0; padding-left:20px; } .hero-marker { bottom:30px; left:17px; right:auto; } .hero-marker span { font-size:40px; } .status-bar { grid-template-columns:repeat(2,1fr); margin:0 17px; } .status-bar > div,.status-bar > div:not(:first-child) { border-bottom:1px solid var(--line); border-right:1px solid var(--line); min-height:95px; padding:18px 15px; } .status-bar > div:nth-child(2n) { border-right:0; } .status-bar > div:nth-last-child(-n+2) { border-bottom:0; } .status-bar strong { font-size:23px; } .section,.split-section { padding:80px 17px; } .section-intro h2,.section-heading h2,.split-section h2,.wipe-feature h2 { font-size:clamp(48px,14vw,68px); } .feature-grid,.steps-grid { grid-template-columns:repeat(2,1fr); margin-top:42px; } .feature-grid article,.feature-grid article:not(:first-child) { border-bottom:1px solid var(--line); min-height:190px; padding:20px 14px 20px 0; } .feature-grid article:nth-child(2n) { border-right:0; padding-left:14px; } .feature-grid h3,.steps-grid h3 { font-size:25px; margin-top:28px; } .ranking-section .section-heading { align-items:flex-start; flex-direction:column; } .ranking-empty { align-items:flex-start; flex-wrap:wrap; } .ranking-empty .button { margin-left:64px; } .steps-grid article { min-height:205px; padding:18px; } .wipe-feature { align-items:flex-start; flex-direction:column; gap:40px; padding:70px 17px; } .wipe-clock { border-left:0; border-top:1px solid var(--line); padding:25px 0 0; width:100%; } .split-section { display:block; } .split-section > div,.split-section > div + div { min-height:0; padding:0 0 60px; border:0; } .split-section > div + div { padding-bottom:35px; } .footer { align-items:flex-start; flex-direction:column; gap:22px; margin:0 17px; padding:30px 0; } .footer-links { flex-wrap:wrap; gap:12px 18px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms!important; scroll-behavior:auto!important; transition-duration:.01ms!important; } }

.connect-command { align-items:center; background:var(--panel); border:1px solid var(--line); display:flex; gap:28px; justify-content:space-between; margin:52px 0 8px; max-width:900px; padding:26px 28px; }
.connect-command h2 { font-family:'Manrope',sans-serif; font-size:14px; font-weight:600; line-height:1.5; margin:9px 0 14px; }
.connect-command code { background:var(--bg); border:1px solid var(--line); color:var(--accent); display:inline-block; font:600 16px/1.4 'Manrope',sans-serif; letter-spacing:.02em; padding:10px 13px; }
.connect-command .button { flex:none; }
@media (max-width:820px) { .connect-command { align-items:flex-start; flex-direction:column; gap:20px; padding:22px 18px; } .connect-command .button { width:100%; } .connect-command code { font-size:13px; max-width:100%; overflow:auto; } }

.stats-toolbar { align-items:flex-start; flex-wrap:wrap; }
.tabs { display:flex; flex-wrap:wrap; gap:8px; }
.tabs .tab { flex:0 0 auto; }
.stat-metrics { border-bottom:1px solid var(--line); display:flex; gap:8px; margin:0 -27px 4px; overflow-x:auto; padding:12px 27px; }
.stat-metrics > div { background:var(--panel-soft); border:1px solid var(--line); display:flex; flex-direction:column; gap:3px; min-width:125px; padding:9px 12px; }
.stat-metrics span,.stat-metrics small { color:var(--muted); font-size:10px; }
.stat-metrics strong { color:var(--text); font:600 18px/1 'Barlow Condensed'; max-width:190px; overflow:hidden; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }
.pagination { align-items:center; border-top:1px solid var(--line); color:var(--muted); display:flex; font-size:11px; justify-content:space-between; margin-top:10px; padding-top:15px; }
.pagination > div { align-items:center; display:flex; gap:8px; }
.page-button { background:transparent; border:1px solid var(--line); color:var(--muted); cursor:pointer; font-size:10px; padding:7px 9px; }
.page-button:hover:not(:disabled) { border-color:var(--accent); color:var(--accent); }
.page-button:disabled { cursor:not-allowed; opacity:.35; }
@media (max-width:820px) { .stats-toolbar { align-items:stretch; } .stat-metrics { margin-inline:-18px; padding-inline:18px; } .leaderboard-section { padding:18px; } .pagination { align-items:flex-start; flex-direction:column; gap:12px; } }

.stat-metrics { flex-wrap:wrap; overflow:visible; }
.stat-metrics > div { flex:1 1 125px; }

/* Statistics workspace */
.page-heading { margin:0 auto; max-width:var(--container); padding:100px 0 52px; }
.page-heading h1 { font-size:clamp(52px,8vw,96px); line-height:.9; margin:18px 0; text-transform:uppercase; }
.page-heading > p:not(.eyebrow) { color:var(--muted); line-height:1.8; max-width:560px; }
.wipe-card { background:var(--panel); border:1px solid var(--line); display:flex; flex-direction:column; gap:8px; margin-bottom:25px; padding:18px; }
.wipe-card strong { font:600 28px/.95 'Barlow Condensed'; text-transform:uppercase; }
.wipe-card small { color:var(--muted); font-size:11px; }
.stats-layout { display:grid; gap:50px; grid-template-columns:240px minmax(0,1fr); margin:0 auto 110px; max-width:var(--container); }
.stats-sidebar { border-right:1px solid var(--line); padding-right:26px; }
.category-list { display:flex; flex-direction:column; gap:4px; }
.category-link { align-items:center; color:var(--muted); display:flex; font-size:12px; font-weight:700; gap:12px; padding:10px 0; text-transform:uppercase; }
.category-link span { color:var(--accent); font:600 15px 'Barlow Condensed'; }
.category-link.active,.category-link:hover { color:var(--text); }
.stats-toolbar { border-bottom:1px solid var(--line); display:flex; flex-wrap:wrap; gap:14px 20px; padding-bottom:18px; }
.tabs { flex:1 1 320px; }
.stats-toolbar .search-box { flex:0 0 210px; }
.toolbar-actions { align-items:center; display:flex; gap:14px; margin-left:auto; }
.compare-toggle.is-active { background:var(--accent); border-color:var(--accent); color:var(--bg); }
.leaderboard-panel { background:var(--panel); box-shadow:var(--shadow); margin-top:20px; min-height:370px; }
.leaderboard-section { padding:27px; }
.leaderboard-section.is-hidden { display:none; }
.section-title { align-items:flex-end; border-bottom:1px solid var(--line); display:flex; gap:20px; justify-content:space-between; padding-bottom:20px; }
.section-title h2 { font-size:37px; text-transform:uppercase; }
.section-count { color:var(--muted); font-size:11px; }
.table-wrap { overflow-x:auto; }
.table-wrap table { border-collapse:collapse; font-size:12px; min-width:520px; width:100%; }
.table-wrap th { color:var(--muted); font-size:10px; letter-spacing:.1em; padding:15px 10px; text-align:left; text-transform:uppercase; }
.table-wrap td { border-top:1px solid var(--line); padding:16px 10px; }
.table-wrap td:nth-child(2) { color:var(--accent); font:600 18px 'Barlow Condensed'; }
.compare-cell { padding-inline:6px 0; width:34px; }
.compare-cell input { accent-color:var(--accent); cursor:pointer; height:16px; width:16px; }
.leaderboard-panel:not(.compare-mode) .compare-cell { display:none; }
.compare-bar { align-items:center; background:rgba(12,18,14,.97); border:1px solid rgba(201,242,109,.42); bottom:20px; box-shadow:0 18px 45px rgba(0,0,0,.35); color:var(--text); display:flex; font-size:12px; gap:18px; justify-content:space-between; left:50%; padding:14px 20px; position:fixed; transform:translateX(-50%); width:min(94%,520px); z-index:40; }
.compare-bar[hidden] { display:none; }
.compare-bar-actions { display:flex; gap:10px; }
.compare-modal { background:rgba(12,18,14,.97); border:1px solid rgba(201,242,109,.42); box-shadow:0 28px 90px rgba(0,0,0,.65); color:var(--text); max-width:640px; padding:30px; width:calc(100% - 34px); }
.compare-modal::backdrop { background:rgba(3,6,4,.72); backdrop-filter:blur(5px); }
.compare-modal h2 { font-size:32px; margin:14px 0 8px; text-transform:uppercase; }
.compare-intro { color:var(--muted); font-size:12px; margin-bottom:18px; }
.compare-result table { border-collapse:collapse; font-size:12px; width:100%; }
.compare-result th,.compare-result td { border-top:1px solid var(--line); padding:10px; text-align:left; }
.compare-result thead th { color:var(--muted); font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
.compare-result td.is-winner { color:var(--accent); font-weight:700; }
.compare-empty { color:var(--muted); font-size:13px; padding:20px 0; text-align:center; }
.empty-state { align-items:center; color:var(--muted); display:grid; gap:8px; justify-items:center; min-height:240px; place-content:center; text-align:center; }
.empty-state img { opacity:.8; width:42px; }
.empty-state h3 { color:var(--text); font-size:23px; text-transform:uppercase; }
.empty-state p { font-size:12px; }
@media (max-width:820px) { .page-heading { padding:72px 17px 38px; } .page-heading h1 { font-size:clamp(50px,14vw,70px); } .stats-layout { display:block; margin:0 17px 80px; } .stats-sidebar { border-bottom:1px solid var(--line); border-right:0; margin-bottom:25px; padding:0 0 20px; } .category-list { display:grid; grid-template-columns:repeat(2,1fr); } .stats-toolbar { flex-direction:column; } .stats-toolbar .search-box { flex-basis:auto; width:100%; } .toolbar-actions { flex-direction:column; width:100%; } .toolbar-actions .search-box { width:100%; } .leaderboard-section { padding:18px; } .section-title { align-items:flex-start; flex-direction:column; gap:8px; } .table-wrap table { min-width:520px; } }

.content-page { margin:0 auto; max-width:var(--container); min-height:620px; padding:100px 0; }
.content-page h1 { font-size:clamp(52px,8vw,96px); line-height:.9; margin:18px 0; text-transform:uppercase; }
.content-page .lead { color:var(--muted); font-size:18px; line-height:1.8; max-width:620px; }
.content-grid { background:var(--line); display:grid; gap:1px; grid-template-columns:repeat(3,1fr); margin-top:65px; }
.content-grid article { background:var(--bg); min-height:210px; padding:28px; }
.content-grid article > span,.rule-list strong { color:var(--accent); font:600 28px/.9 'Barlow Condensed'; }
.content-grid h2,.rule-list h2 { font-size:29px; margin:28px 0 10px; text-transform:uppercase; }
.content-grid p,.rule-list p { color:var(--muted); font-size:13px; line-height:1.7; }
.rule-list { margin-top:55px; max-width:800px; }
.rule-list article { border-top:1px solid var(--line); display:flex; gap:26px; padding:26px 0; }
.rule-list h2 { margin:0 0 8px; }
.contact-page .button { margin-top:35px; }
.tab { background:transparent; border:1px solid var(--line); color:var(--muted); cursor:pointer; font-size:10px; font-weight:700; padding:8px 11px; white-space:nowrap; }
.tab.active,.tab:hover { background:var(--accent); border-color:var(--accent); color:var(--accent-dark); }
.search-box { align-items:center; border-bottom:1px solid var(--line); color:var(--muted); display:flex; gap:8px; padding:7px 0; }
.search-box input { background:transparent; border:0; color:var(--text); font-size:11px; min-width:0; outline:0; width:100%; }
@media (max-width:820px) { .content-page { min-height:600px; padding:72px 17px 80px; } .content-page h1 { font-size:clamp(50px,14vw,70px); } .content-page .lead { font-size:16px; } .content-grid { grid-template-columns:1fr; margin-top:42px; } .content-grid article { min-height:0; padding:24px 20px; } .rule-list { margin-top:38px; } }

/* Hero art: preserve the watermark proportions instead of cropping it as a cover image. */
.hero-atmosphere { background-image:linear-gradient(90deg,rgba(9,13,11,.99) 0%,rgba(9,13,11,.9) 34%,rgba(9,13,11,.5) 68%,rgba(9,13,11,.2) 100%),linear-gradient(0deg,var(--bg),transparent 38%),url('/marca/marca_d_agua.png'); background-position:center,center,right center; background-repeat:no-repeat; background-size:100% 100%,100% 100%,auto 100%; opacity:.55; }
@media (max-width:820px) { .hero-atmosphere { background-image:linear-gradient(180deg,rgba(9,13,11,.9),rgba(9,13,11,.99) 88%),url('/marca/marca_d_agua.png'); background-position:center,right center; background-size:100% 100%,auto 78%; } }
.hero { max-width:none; width:100%; }
.hero { background:var(--bg); }
.hero-atmosphere { -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 84%,transparent 100%); mask-image:linear-gradient(to bottom,#000 0%,#000 84%,transparent 100%); }
.status-bar { max-width:none; padding-left:max(24px,calc((100% - var(--container))/2)); padding-right:max(24px,calc((100% - var(--container))/2)); }
@media (max-width:820px) { .status-bar { margin:0 17px; padding-left:0; padding-right:0; } }
.brand { width:190px; }
@media (max-width:820px) { .brand { width:150px; } .brand img { height:44px; max-width:160px; transform:scale(1.28); } }

.terra-world { --world-progress:0; --world-warmth:0; background:radial-gradient(circle at 75% 12%,rgba(201,242,109,.06),transparent 25%),linear-gradient(180deg,#080b09 0%,#0b110d 48%,#11100c 78%,#090b09 100%); position:relative; transition:background 1.2s ease; }
.terra-world::before { background-image:linear-gradient(rgba(201,242,109,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(201,242,109,.04) 1px,transparent 1px); background-size:88px 88px; content:""; inset:0; opacity:.16; pointer-events:none; position:absolute; }
.hero { isolation:isolate; max-width:none; }
.hero-scene { inset:0; overflow:hidden; pointer-events:none; position:absolute; z-index:-1; }
.hero-scene::after { background:radial-gradient(ellipse at center,transparent 32%,rgba(0,0,0,.15) 68%,rgba(0,0,0,.65) 100%); content:""; inset:0; position:absolute; z-index:5; }
.hero-sky,.hero-atmosphere,.hero-fog { inset:-3%; position:absolute; transform:translate3d(var(--mouse-shift-x,0px),calc(var(--scroll-shift,0px) + var(--mouse-shift-y,0px)),0); will-change:transform; }
.hero-sky { background:radial-gradient(ellipse at 72% 28%,rgba(157,174,155,.17),transparent 28%),linear-gradient(180deg,#18221d 0%,#0c120e 76%); opacity:.95; }
.hero-atmosphere { background-image:linear-gradient(90deg,rgba(9,13,11,.99) 0%,rgba(9,13,11,.86) 34%,rgba(9,13,11,.42) 70%,rgba(9,13,11,.18) 100%),linear-gradient(0deg,var(--bg),transparent 38%),url('/marca/marca_d_agua.png'); background-position:center,center,right center; background-repeat:no-repeat; background-size:100% 100%,100% 100%,auto 100%; opacity:.7; }
.hero-fog { background:linear-gradient(90deg,transparent,rgba(179,195,177,.1) 22%,rgba(198,210,184,.06) 48%,transparent 76%); filter:blur(14px); mix-blend-mode:screen; opacity:.5; transform:translate3d(-8%,var(--scroll-shift,0),0) scale(1.15); }
.hero-fog-two { background:linear-gradient(90deg,transparent 4%,rgba(115,140,118,.08) 38%,rgba(210,205,170,.08) 68%,transparent 94%); filter:blur(22px); opacity:.35; transform:translate3d(9%,var(--scroll-shift,0),0) scale(1.2); }
.ambient-canvas { height:100%; inset:0; position:absolute; width:100%; z-index:4; }
.cursor-light { background:radial-gradient(circle 420px at var(--mouse-x,50%) var(--mouse-y,40%),rgba(201,242,109,.07),transparent 68%); inset:0; opacity:.8; position:absolute; z-index:6; }
.hero-content { animation:hero-enter .9s .12s both cubic-bezier(.2,.75,.2,1); }
.hero h1,.section-intro h2,.section-heading h2,.steps-section h2,.wipe-feature h2,.split-section h2 { position:relative; }
.hero h1::after,.section-intro h2::after,.section-heading h2::after,.steps-section h2::after,.wipe-feature h2::after,.split-section h2::after { background:var(--accent); content:""; height:2px; left:0; opacity:.75; position:absolute; top:50%; transform:scaleX(0); transform-origin:left; width:100%; }
.is-visible .section-intro h2::after,.is-visible .section-heading h2::after,.is-visible .steps-section h2::after,.is-visible .wipe-feature h2::after,.is-visible .split-section h2::after { animation:title-scan .65s .18s both ease-out; }
.hero h1::after { animation:title-scan .7s .58s both ease-out; }
.chapter-mark { bottom:22px; color:rgba(237,241,233,.42); font-size:9px; font-weight:800; letter-spacing:.2em; position:absolute; right:max(24px,calc((100% - var(--container))/2)); text-transform:uppercase; }
.section,.wipe-feature,.split-section { position:relative; }
.section-number { color:rgba(201,242,109,.045); font:700 clamp(160px,22vw,320px)/.7 'Barlow Condensed'; pointer-events:none; position:absolute; right:-.04em; top:52px; transform:translateY(calc(var(--section-shift,0px))); transition:transform .3s ease; user-select:none; }
.feature-grid article,.steps-grid article,.ranking-preview,.ranking-empty,.community-block { position:relative; transition:background .35s,border-color .35s,box-shadow .35s,transform .35s; }
.feature-grid article::before,.steps-grid article::before,.ranking-preview::before,.ranking-empty::before,.community-block::before { background:linear-gradient(90deg,var(--accent),transparent); content:""; height:1px; left:0; opacity:.5; position:absolute; right:32%; top:0; transform:scaleX(0); transform-origin:left; transition:transform .35s; }
.feature-grid article:hover,.steps-grid article:hover,.ranking-preview:hover,.ranking-empty:hover,.community-block:hover { background:linear-gradient(135deg,rgba(201,242,109,.06),transparent 58%),var(--panel); border-color:rgba(201,242,109,.34); box-shadow:0 18px 45px rgba(0,0,0,.2); transform:translateY(-2px); }
.feature-grid article:hover::before,.steps-grid article:hover::before,.ranking-preview:hover::before,.ranking-empty:hover::before,.community-block:hover::before { transform:scaleX(1); }
.ranking-preview,.ranking-empty,.steps-grid article,.feature-grid article { background-color:rgba(16,22,18,.72); }
.wipe-feature { background:radial-gradient(circle at 65% 50%,rgba(177,77,38,.13),transparent 34%),linear-gradient(90deg,rgba(11,14,11,.96),rgba(48,28,19,.4),rgba(11,14,11,.96)),var(--panel); overflow:hidden; }
.wipe-feature::before { background:linear-gradient(90deg,transparent,rgba(232,153,74,.75),transparent); content:""; height:1px; left:0; opacity:.35; position:absolute; right:0; top:0; transform:translateX(-100%); }
.wipe-feature.is-visible::before { animation:scanner 10s 1s infinite linear; }
.wipe-clock { position:relative; }
.wipe-clock::before { border:1px solid rgba(201,242,109,.16); content:""; inset:-18px -24px -18px -25px; pointer-events:none; position:absolute; }
.wipe-clock span { text-shadow:0 0 24px rgba(201,242,109,.18); }
.status-bar { background:rgba(7,10,8,.5); position:relative; }
.status-bar::after { background:linear-gradient(90deg,transparent,var(--accent),transparent); content:""; height:1px; left:0; opacity:.35; position:absolute; top:0; transform:translateX(-100%); width:25%; }
.status-bar:hover::after { animation:scanner 8s infinite linear; }
@keyframes hero-enter { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:none; } }
@keyframes title-scan { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@keyframes scanner { to { transform:translateX(500%); } }
@media (max-width:820px) { .hero-sky,.hero-atmosphere,.hero-fog { inset:0; } .hero-fog { opacity:.25; } .cursor-light { display:none; } .chapter-mark { bottom:14px; font-size:8px; right:17px; } .section-number { font-size:150px; right:-.08em; top:42px; } .wipe-clock::before { inset:-12px -12px -12px -13px; } }
@media (max-width:600px) { .ambient-canvas { display:none; } }
@media (prefers-reduced-motion:reduce) { .hero-content { animation:none; } .hero-sky,.hero-atmosphere,.hero-fog,.section-number { transform:none!important; transition:none; } .cursor-light,.ambient-canvas { display:none; } .hero h1::after,.section-intro h2::after,.section-heading h2::after,.steps-section h2::after,.wipe-feature h2::after,.split-section h2::after { animation:none; transform:scaleX(1); } }
.terra-world .reveal { animation:none; opacity:0; transform:translateY(18px); transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.2,1); }
.terra-world .reveal.is-visible { opacity:1; transform:none; }
.terra-world .hero.is-visible .hero-content { opacity:1; transform:none; }
.global-status { background:rgba(8,12,9,.82); border-bottom:1px solid rgba(226,239,218,.1); border-top:1px solid rgba(226,239,218,.08); color:var(--muted); position:sticky; top:82px; z-index:8; }
.global-status-inner { align-items:center; display:flex; gap:16px; margin:auto; max-width:var(--container); min-height:35px; padding:0 24px; }
.live-indicator { align-items:center; color:var(--text); display:flex; font-size:9px; font-weight:800; gap:7px; letter-spacing:.12em; text-transform:uppercase; }
.live-indicator .status-dot { animation:live-pulse 2.6s infinite; height:6px; width:6px; }
.status-separator,.status-wipe,.global-status code { font-size:9px; letter-spacing:.08em; text-transform:uppercase; }
.global-status code { color:var(--accent); margin-left:auto; }
.status-copy { background:transparent; border:1px solid rgba(201,242,109,.4); color:var(--accent); font-size:8px; font-weight:800; letter-spacing:.08em; padding:5px 8px; text-transform:uppercase; }
.status-copy:hover { background:var(--accent); color:var(--accent-dark); }
.chapter-rail { align-items:center; display:flex; flex-direction:column; gap:13px; position:fixed; right:22px; top:50%; transform:translateY(-50%); z-index:7; }
.chapter-rail-label { color:var(--muted); font-size:8px; letter-spacing:.14em; margin-bottom:5px; text-transform:uppercase; writing-mode:vertical-rl; }
.chapter-rail a { align-items:center; border:1px solid transparent; color:rgba(237,241,233,.35); display:flex; font:600 11px 'Barlow Condensed'; height:23px; justify-content:center; width:23px; }
.chapter-rail a:hover,.chapter-rail a.is-active { border-color:var(--accent); color:var(--accent); }
.chapter-rail i { background:var(--accent); bottom:0; height:0; left:0; opacity:.7; position:absolute; transform-origin:bottom; transition:height .3s; width:1px; }
.server-modal { background:rgba(12,18,14,.97); border:1px solid rgba(201,242,109,.42); box-shadow:0 28px 90px rgba(0,0,0,.65); color:var(--text); max-width:430px; padding:30px; width:calc(100% - 34px); }
.server-modal::backdrop { background:rgba(3,6,4,.72); backdrop-filter:blur(5px); }
.server-modal h2 { font-size:42px; line-height:.9; margin:16px 0; text-transform:uppercase; }
.server-modal code { background:var(--bg); border:1px solid var(--line); color:var(--accent); display:block; font-size:13px; margin-bottom:22px; padding:13px; }
.server-modal > div { display:flex; flex-wrap:wrap; gap:9px; }
.modal-close { background:transparent; border:1px solid var(--line); color:var(--muted); font-size:22px; height:30px; line-height:1; position:absolute; right:18px; top:18px; width:30px; }
.modal-close:hover { border-color:var(--accent); color:var(--accent); }
.ip-inline { background:transparent; border:0; color:var(--accent); cursor:pointer; font-size:inherit; padding:0; text-align:left; }
.ip-inline:hover { text-decoration:underline; }
.live-tag { color:var(--accent)!important; font-size:9px!important; letter-spacing:.08em; margin-left:5px; }
.ranking-podium { align-items:end; display:grid; gap:10px; grid-template-columns:repeat(3,1fr); margin-top:22px; }
.podium-card { align-items:center; background:linear-gradient(180deg,rgba(255,255,255,.025),transparent),var(--panel-soft); border:1px solid var(--line); display:flex; flex-direction:column; justify-content:flex-end; min-height:150px; padding:17px 10px; text-align:center; transform:translateY(15px); opacity:0; }
.ranking-preview.is-visible .podium-card { animation:podium-rise .55s both cubic-bezier(.22,1,.36,1); }
.ranking-preview.is-visible .podium-1 { animation-delay:.3s; min-height:190px; }
.ranking-preview.is-visible .podium-2 { animation-delay:.1s; }
.ranking-preview.is-visible .podium-3 { animation-delay:.5s; }
.podium-card strong { color:var(--muted); font:600 28px 'Barlow Condensed'; }
.podium-card span { font-weight:700; margin:13px 0 7px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.podium-card b { color:var(--accent); font:600 34px/.9 'Barlow Condensed'; }
.podium-card small { color:var(--muted); font-size:8px; letter-spacing:.12em; margin-top:8px; text-transform:uppercase; }
.podium-1 { background:linear-gradient(180deg,rgba(201,242,109,.1),transparent 55%),var(--panel-soft); border-color:rgba(201,242,109,.55); }
.podium-1 strong { color:var(--accent); font-size:40px; }
.activity-strip { align-items:center; border-block:1px solid var(--line); display:flex; gap:15px; margin-top:20px; padding:14px 0; }
.activity-strip > span:last-child { color:var(--muted); font-size:11px; }
.territory-grid { background-image:linear-gradient(rgba(201,242,109,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(201,242,109,.12) 1px,transparent 1px); background-size:45px 30px; border:1px solid rgba(201,242,109,.16); display:grid; gap:4px; grid-template-columns:repeat(3,1fr); margin-top:35px; max-width:340px; opacity:.65; padding:12px; }
.territory-grid span { color:var(--accent); font-size:8px; grid-column:1/-1; letter-spacing:.15em; text-transform:uppercase; }
.territory-grid b { color:var(--muted); font-size:8px; font-weight:500; padding:7px; }
.wipe-progress { margin-top:25px; max-width:500px; }
.wipe-progress > span { color:var(--muted); display:block; font-size:9px; letter-spacing:.14em; margin-bottom:8px; text-transform:uppercase; }
.wipe-progress i { background:rgba(255,255,255,.1); display:block; height:3px; overflow:hidden; }
.wipe-progress i b { background:var(--accent); display:block; height:100%; transform:scaleX(0); transform-origin:left; transition:transform .8s ease; width:100%; }
.wipe-progress small { color:var(--accent); display:block; font-size:10px; margin-top:7px; }
@keyframes live-pulse { 0%,100% { box-shadow:0 0 0 4px rgba(201,242,109,.1); } 50% { box-shadow:0 0 0 7px rgba(201,242,109,.03); } }
@keyframes podium-rise { from { opacity:0; transform:translateY(15px); } to { opacity:1; transform:none; } }
@media (max-width:820px) { .global-status { top:70px; } .global-status-inner { gap:10px; min-height:34px; padding:0 17px; } .global-status .status-wipe,.global-status code { display:none; } .global-status .status-copy { margin-left:auto; } .chapter-rail { background:rgba(8,12,9,.85); border:1px solid var(--line); bottom:14px; flex-direction:row; gap:2px; left:50%; padding:4px; right:auto; top:auto; transform:translateX(-50%); } .chapter-rail-label,.chapter-rail i { display:none; } .chapter-rail a { height:25px; width:25px; } .server-modal { padding:25px 20px; } .ranking-podium { gap:5px; } .podium-card { min-height:125px; padding-inline:5px; } .ranking-preview.is-visible .podium-1 { min-height:155px; } .activity-strip { align-items:flex-start; flex-direction:column; gap:4px; } }
@media (prefers-reduced-motion:reduce) { .live-indicator .status-dot { animation:none; } .podium-card { opacity:1; transform:none; } .wipe-progress i b { transition:none; } }