/* Twelve art directions based on the games' official websites. See reference-art/README.md. */
:root {
 --forest:#0e161d; --deep:#090f14; --ink:#f4eee4; --muted:#b6bdbe; --gold:#dd6119; --gold-bright:#f18739; --line:#39434a; --panel:#19232a; --button-ink:#fff4e5;
 --scene:url('./themes/valheim.webp'); --heading-font:'Cormorant Unicase',Georgia,serif; --heading-weight:700; --heading-spacing:-.04em; --radius:0px; --button-radius:0px;
}
html[data-theme='tarkov'] { --forest:#131414; --deep:#090b0c; --ink:#dee9e9; --muted:#a8b3b3; --gold:#c2cdcd; --gold-bright:#f0f6f6; --line:#3d4545; --panel:#1c2223; --button-ink:#131414; --scene:url('./themes/tarkov.webp'); --heading-font:'Tektur',sans-serif; }
html[data-theme='rust'] { --forest:#141412; --deep:#0c0d0b; --ink:#e4dad1; --muted:#b9b2a9; --gold:#cd412b; --gold-bright:#e85b40; --line:#493f36; --panel:#25251f; --button-ink:#fff2e9; --scene:url('./themes/rust.webp'); --heading-font:'Oswald',sans-serif; --heading-spacing:-.035em; }
html[data-theme='gta'] { --forest:#111117; --deep:#0b0a12; --ink:#fff9cb; --muted:#c4bbcc; --gold:#ffb0c4; --gold-bright:#ffd1dc; --line:#46364f; --panel:#1b1827; --button-ink:#281a35; --scene:url('./themes/gta.webp'); --heading-font:'Rubik',sans-serif; --heading-weight:800; --heading-spacing:-.065em; --button-radius:99px; }
html[data-theme='grounded'] { color-scheme:light; --forest:#ecebdc; --deep:#dedfcb; --ink:#20281d; --muted:#4d5946; --gold:#346535; --gold-bright:#264f28; --line:#bdc4a8; --panel:#e1e5ce; --button-ink:#fffdee; --scene:url('./themes/grounded.webp'); --heading-font:'Oswald',sans-serif; --heading-spacing:-.025em; }
html[data-theme='minecraft'] { --forest:#171615; --deep:#10100f; --ink:#f5f4ef; --muted:#c3c1bc; --gold:#75b94b; --gold-bright:#a5db7a; --line:#4f5148; --panel:#262423; --button-ink:#101b0b; --scene:url('./themes/minecraft.webp'); --heading-font:'Press Start 2P',monospace; --heading-weight:400; --heading-spacing:-.02em; }
html[data-theme='cyberpunk'] { --forest:#101011; --deep:#050507; --ink:#f4f3db; --muted:#c0c0b1; --gold:#fcee0a; --gold-bright:#fff765; --line:#535137; --panel:#1b1c19; --button-ink:#090b0b; --scene:url('./themes/cyberpunk.webp'); --heading-font:'Tektur',sans-serif; --heading-spacing:-.055em; }
html[data-theme='stalker'] { --forest:#181512; --deep:#120d0a; --ink:#f2e8d9; --muted:#bfb3a1; --gold:#ee991a; --gold-bright:#ffb940; --line:#514638; --panel:#25211b; --button-ink:#1c1409; --scene:url('./themes/stalker.webp'); --heading-font:'Oswald',sans-serif; --heading-spacing:-.035em; }
html[data-theme='pirates'] { --forest:#101d1c; --deep:#091310; --ink:#f3eedb; --muted:#b8c8bd; --gold:#95e0b8; --gold-bright:#bbf5d4; --line:#3b5548; --panel:#1a3028; --button-ink:#11281c; --scene:url('./themes/pirates.webp'); --heading-font:'Oswald',sans-serif; --heading-spacing:-.035em; }
html[data-theme='cs2'] { --forest:#172532; --deep:#101b26; --ink:#f4f4ed; --muted:#b9c7ce; --gold:#ff9b01; --gold-bright:#ffbd48; --line:#405467; --panel:#22394c; --button-ink:#151f28; --scene:url('./themes/cs2.webp'); --heading-font:'Oswald',sans-serif; --heading-spacing:-.035em; }

.topbar { border-color:color-mix(in srgb,var(--ink) 22%,transparent); }
.brand img { filter:grayscale(1) brightness(1.7); }
.topbar nav,.hero-description,.hero-caption,.project-label span { color:var(--ink); }
.hero { min-height:760px; }
.hero-art { background-image:var(--scene); background-color:var(--panel); }
.hero::after { background:linear-gradient(90deg,color-mix(in srgb,var(--forest) 98%,transparent),color-mix(in srgb,var(--forest) 86%,transparent) 29%,transparent 80%),linear-gradient(0deg,var(--forest),transparent 35%); }
.hero h1 { font-family:var(--heading-font); font-weight:var(--heading-weight); letter-spacing:var(--heading-spacing); font-size:clamp(3.6rem,7.1vw,7rem); line-height:1.04; }
.hero h1 em { font-style:normal; font-weight:inherit; letter-spacing:inherit; }
.hero-description { max-width:450px; }
.hero-copy { padding-block:86px 52px; }
.section-intro h2,.community h2,.project h3 { font-family:var(--heading-font); font-weight:var(--heading-weight); letter-spacing:var(--heading-spacing); }
.button,.skip { border-radius:var(--button-radius); }
.button { min-height:51px; }
.button-primary { color:var(--button-ink); }
.button-secondary { background:var(--deep); border-color:var(--line); }
.button-secondary:hover { background:var(--panel); }
.top-link { border-color:currentColor; border-radius:var(--button-radius); }
.project,.community-panel { border-radius:var(--radius); border-color:var(--line); }
.project-valheim { background:linear-gradient(90deg,var(--panel),color-mix(in srgb,var(--panel) 95%,transparent) 30%,color-mix(in srgb,var(--panel) 50%,transparent)),url('./themes/valheim.webp') right center / cover; }
.project-body>p:not(.project-label) { color:var(--ink); }
.community-panel { background:var(--panel); }
.community .actions { min-width:0; max-width:100%; }
.community .button { flex:0 1 auto; max-width:100%; }
.hero-caption { font-size:.65rem; letter-spacing:.15em; }
.hero-caption-line { background:currentColor; }
.eyebrow span { box-shadow:none; }
.footer { padding-bottom:25px; }

/* Valheim: centered northern vista, carved type and ember-red rough buttons. */
html[data-theme='valheim'] .hero { min-height:820px; }
html[data-theme='valheim'] .hero-art { background-position:center 48%; }
html[data-theme='valheim'] .hero::after { background:linear-gradient(0deg,#0e161d 0%,#0e161d55 60%,#0e161d66),radial-gradient(ellipse at center,#0e161d72,transparent 75%); }
html[data-theme='valheim'] .hero-copy { text-align:center; }
html[data-theme='valheim'] .hero .eyebrow,html[data-theme='valheim'] .hero .actions { justify-content:center; }
html[data-theme='valheim'] .hero h1 { font-size:clamp(4.5rem,8.5vw,8rem); text-shadow:0 3px 18px #000b; }
html[data-theme='valheim'] .hero h1 em { color:#f6e4bf; }
html[data-theme='valheim'] .hero-description { margin-inline:auto; text-shadow:0 2px 10px #000; }
html[data-theme='valheim'] .button-primary { background:#ad2817; border-color:#c64024; }
html[data-theme='valheim'] .button-primary:hover { background:#c93d23; }
html[data-theme='valheim'] .button { clip-path:polygon(1% 6%,96% 0,100% 14%,98% 91%,3% 100%,0 84%); padding-inline:25px; }
html[data-theme='valheim'] .worlds { border-top:1px solid #71604c; }

/* Tarkov: steel, smoke, technical labels and clipped corners. */
html[data-theme='tarkov'] .hero-art { background-position:center 38%; }
html[data-theme='tarkov'] .hero::after { background:linear-gradient(90deg,#131414 0%,#131414f7 18%,#131414a6 44%,#13141418 75%),linear-gradient(0deg,#131414,transparent 45%); }
html[data-theme='tarkov'] .hero h1 { text-transform:uppercase; font-size:clamp(3.2rem,6.1vw,6rem); }
html[data-theme='tarkov'] .hero h1 em { color:#a0a8a8; }
html[data-theme='tarkov'] .eyebrow,html[data-theme='tarkov'] .hero-caption,html[data-theme='tarkov'] .project-label { font-family:monospace; }
html[data-theme='tarkov'] .button,html[data-theme='tarkov'] .community-panel { clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px); }
html[data-theme='tarkov'] .project-label { border-bottom:1px solid var(--line); padding-bottom:12px; }

/* Rust: oversized narrow cream type and oxide-red rectangular UI. */
html[data-theme='rust'] .hero-art { background-position:65% center; filter:saturate(.65); }
html[data-theme='rust'] .hero h1 { text-transform:uppercase; font-size:clamp(4rem,8vw,8rem); line-height:.98; }
html[data-theme='rust'] .hero h1 em { color:var(--ink); }
html[data-theme='rust'] .eyebrow { background:var(--gold); color:#fff0e7; width:fit-content; padding:8px 12px; letter-spacing:.2em; }
html[data-theme='rust'] .eyebrow span { background:currentColor; }
html[data-theme='rust'] .button { text-transform:uppercase; letter-spacing:.055em; }
html[data-theme='rust'] .section-intro h2,html[data-theme='rust'] .community h2 { text-transform:uppercase; }
html[data-theme='rust'] .community-panel { border-top:4px solid #cd412b; }

/* GTA VI: midnight purple, full-color poster, cream type and pink pills. */
html[data-theme='gta'] .hero { min-height:800px; }
html[data-theme='gta'] .hero-art { inset:120px 4% 92px 47%; background-size:contain; background-color:transparent; background-position:center; transform:rotate(2deg); box-shadow:0 26px 90px #8c397032; }
html[data-theme='gta'] .hero::after { background:radial-gradient(ellipse at 75% 50%,transparent 15%,#11111735 45%,#111117 95%); }
html[data-theme='gta'] .hero h1 { font-size:clamp(3.2rem,5.7vw,5.6rem); line-height:1.03; }
html[data-theme='gta'] .hero-description { max-width:410px; }
html[data-theme='gta'] .hero h1 em { color:var(--ink); }
html[data-theme='gta'] .hero .actions { max-width:430px; }
html[data-theme='gta'] .hero .eyebrow { color:#ffb0c4; }
html[data-theme='gta'] .community-panel { background:linear-gradient(115deg,#2b1b32,#171623); border:none; }
html[data-theme='gta'] .section-intro h2 { text-transform:uppercase; font-size:clamp(2.5rem,5vw,4rem); }

/* Grounded: a garden scene next to a cream sheet with an uneven edge. */
html[data-theme='grounded'] .brand img { filter:brightness(.45) sepia(1) saturate(2); }
html[data-theme='grounded'] .topbar { background:#ecebdcee; padding-inline:18px; }
html[data-theme='grounded'] .hero { min-height:780px; }
html[data-theme='grounded'] .hero-art { right:42%; background-position:46% center; }
html[data-theme='grounded'] .hero::after { inset:0 0 0 55%; background:#ecebdc; clip-path:polygon(2% 0,100% 0,100% 100%,1% 100%,3% 85%,0 70%,2% 48%,0 30%); }
html[data-theme='grounded'] .hero-copy { width:min(calc(42% - 80px),500px); margin-left:calc(58% + 40px); margin-right:auto; padding:100px 0 55px; }
html[data-theme='grounded'] .hero h1 { font-size:clamp(2.8rem,4.1vw,4.2rem); text-transform:uppercase; line-height:1.12; color:#c64c12; letter-spacing:-.035em; }
html[data-theme='grounded'] .hero h1 em { color:#c64c12; }
html[data-theme='grounded'] .hero-description { font-size:1rem; }
html[data-theme='grounded'] .hero .eyebrow { font-size:.63rem; letter-spacing:.1em; }
html[data-theme='grounded'] .hero .actions { gap:9px; margin-top:22px; }
html[data-theme='grounded'] .button-secondary { background:transparent; }
html[data-theme='grounded'] .hero-caption { padding-top:15px; }
html[data-theme='grounded'] .section-intro h2,html[data-theme='grounded'] .community h2 { text-transform:uppercase; color:#b84713; }
html[data-theme='grounded'] .project { border-bottom:5px solid #346535; }

/* Minecraft: a game panorama, centered pixel headings and dimensional buttons. */
html[data-theme='minecraft'] .hero { min-height:800px; }
html[data-theme='minecraft'] .hero-art { image-rendering:pixelated; background-position:center; }
html[data-theme='minecraft'] .hero::after { background:linear-gradient(0deg,#171615,#17161599 35%,#17161555 70%,#17161599); }
html[data-theme='minecraft'] .hero-copy { text-align:center; }
html[data-theme='minecraft'] .hero .eyebrow,html[data-theme='minecraft'] .hero .actions { justify-content:center; }
html[data-theme='minecraft'] .hero h1 { font-size:clamp(2rem,4.4vw,4rem); line-height:1.45; text-shadow:4px 4px 0 #171615,6px 6px 0 #000; }
html[data-theme='minecraft'] .hero h1 em { color:#fff27a; }
html[data-theme='minecraft'] .hero-description { margin-inline:auto; max-width:510px; }
html[data-theme='minecraft'] .button { border:2px solid #171615; box-shadow:inset 0 3px 0 #ffffff50,inset 0 -5px 0 #0005,0 4px 0 #000; padding-block:14px 17px; }
html[data-theme='minecraft'] .button-primary { background:#52a535; color:#fff; }
html[data-theme='minecraft'] .button-primary:hover { background:#3c8526; }
html[data-theme='minecraft'] .section-intro h2,html[data-theme='minecraft'] .project h3 { font-size:clamp(1.5rem,3vw,2.8rem); line-height:1.4; }
html[data-theme='minecraft'] .community h2 { font-size:clamp(1.05rem,2vw,1.9rem); line-height:1.6; }
html[data-theme='minecraft'] .project,html[data-theme='minecraft'] .community-panel { border-width:3px; box-shadow:6px 6px 0 #080808; }

/* Cyberpunk: electric yellow, black clipped UI and restrained cyan accents. */
html[data-theme='cyberpunk'] .hero { background:#fcee0a; min-height:800px; color:#080a0b; border-bottom:5px solid #00f0ff; }
html[data-theme='cyberpunk'] .hero-art { background-color:#fcee0a; background-position:center; }
html[data-theme='cyberpunk'] .hero::after { background:linear-gradient(90deg,#fcee0a 0%,#fcee0a 27%,#fcee0ae6 39%,transparent 65%); }
html[data-theme='cyberpunk'] .topbar { color:#080a0b; border-color:#080a0b55; }
html[data-theme='cyberpunk'] .topbar nav,html[data-theme='cyberpunk'] .top-link span { color:#080a0b; }
html[data-theme='cyberpunk'] .topbar .brand img { filter:brightness(.12); }
html[data-theme='cyberpunk'] .hero .eyebrow,html[data-theme='cyberpunk'] .hero-description,html[data-theme='cyberpunk'] .hero-caption { color:#101210; }
html[data-theme='cyberpunk'] .hero .eyebrow span { background:#101210; }
html[data-theme='cyberpunk'] .hero h1 { font-size:clamp(3.2rem,6.3vw,6.2rem); text-transform:uppercase; }
html[data-theme='cyberpunk'] .hero h1 em { color:#101210; }
html[data-theme='cyberpunk'] .hero-description { max-width:410px; font-weight:500; }
html[data-theme='cyberpunk'] .hero .actions { max-width:490px; }
html[data-theme='cyberpunk'] .button { clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,13px 100%,0 calc(100% - 13px)); padding-inline:24px; }
html[data-theme='cyberpunk'] .hero .button-primary { background:#080a0b; color:#fcee0a; border-color:#080a0b; }
html[data-theme='cyberpunk'] .hero .button-secondary { background:#fcee0a; color:#080a0b; border:2px solid #080a0b; }
html[data-theme='cyberpunk'] .hero .button:hover { background:#00f0ff; color:#080a0b; }
html[data-theme='cyberpunk'] .project,html[data-theme='cyberpunk'] .community-panel { border-left:3px solid #00f0ff; }
html[data-theme='cyberpunk'] .section-intro h2,html[data-theme='cyberpunk'] .community h2 { text-transform:uppercase; }

/* STALKER 2: warm charcoal, blue anomaly light, orange and worn paper edges. */
html[data-theme='stalker'] .hero-art { background-position:64% center; }
html[data-theme='stalker'] .hero::after { background:linear-gradient(90deg,#120d0aee,#120d0ab0 33%,transparent 75%),linear-gradient(0deg,#181512,transparent 45%); }
html[data-theme='stalker'] .hero h1 { text-transform:uppercase; font-size:clamp(4rem,8vw,8rem); line-height:1; }
html[data-theme='stalker'] .hero h1 em { color:var(--ink); }
html[data-theme='stalker'] .button-primary { clip-path:polygon(2% 0,98% 4%,100% 20%,98% 94%,1% 100%,0 12%); padding-inline:24px; }
html[data-theme='stalker'] .eyebrow span { width:12px; height:12px; border:2px solid var(--gold); background:transparent; border-radius:50%; transform:none; }
html[data-theme='stalker'] .project-label { font-family:monospace; letter-spacing:.2em; }
html[data-theme='stalker'] .community-panel { border-top:4px solid #ee991a; }

/* Sea of Thieves: green seas, mint display type, crimson CTAs and ragged banners. */
html[data-theme='pirates'] .hero-art { background-position:60% center; }
html[data-theme='pirates'] .hero::after { background:linear-gradient(90deg,#091310e6,#091310a6 40%,transparent 80%),linear-gradient(0deg,#101d1c,transparent 50%); }
html[data-theme='pirates'] .hero h1 { text-transform:uppercase; font-size:clamp(4rem,7.7vw,7.5rem); line-height:1; }
html[data-theme='pirates'] .hero .eyebrow { padding:8px 15px; background:#0b1311; width:fit-content; color:#f3eedb; transform:rotate(-2deg); }
html[data-theme='pirates'] .button { clip-path:polygon(1% 3%,99% 0,98% 95%,0 100%); padding-inline:24px; }
html[data-theme='pirates'] .button-primary { background:#a72f29; border-color:#a72f29; color:#fff5e0; }
html[data-theme='pirates'] .button-primary:hover { background:#c73f32; }
html[data-theme='pirates'] .community-panel { border:none; border-top:3px solid #95e0b8; background:#1a3028; }
html[data-theme='pirates'] .section-intro h2,html[data-theme='pirates'] .community h2 { text-transform:uppercase; }

/* CS2: operator cutouts on gray, diagonal orange and condensed slanted type. */
html[data-theme='cs2'] .hero { min-height:800px; background:linear-gradient(108deg,#aeb8c0 0%,#aeb8c0 49%,#ff9b01 49.1%,#ff9b01 100%); color:#151f28; }
html[data-theme='cs2'] .hero-art { inset:85px 48% 0 0; background-color:transparent; background-size:contain; background-position:left bottom; }
html[data-theme='cs2'] .hero::after { background:linear-gradient(0deg,#172532 0,transparent 16%); }
html[data-theme='cs2'] .topbar { color:#151f28; border-color:#151f2840; }
html[data-theme='cs2'] .topbar nav,html[data-theme='cs2'] .top-link span { color:#151f28; }
html[data-theme='cs2'] .topbar .brand img { filter:brightness(.15); }
html[data-theme='cs2'] .hero-copy { width:min(calc(47% - 64px),520px); margin-left:calc(53% + 16px); margin-right:auto; padding-left:0; padding-top:80px; }
html[data-theme='cs2'] .hero h1 { font-size:clamp(3.2rem,5.5vw,5.6rem); text-transform:uppercase; font-style:italic; }
html[data-theme='cs2'] .hero h1 em { color:#151f28; }
html[data-theme='cs2'] .hero .eyebrow,html[data-theme='cs2'] .hero-description { color:#151f28; }
html[data-theme='cs2'] .hero .eyebrow span { background:#151f28; }
html[data-theme='cs2'] .hero-description { max-width:380px; font-weight:500; }
html[data-theme='cs2'] .hero .actions { gap:10px; }
html[data-theme='cs2'] .hero .button-primary { background:#151f28; color:#fff3dc; border-color:#151f28; }
html[data-theme='cs2'] .hero .button-primary:hover { background:#2b3d49; }
html[data-theme='cs2'] .hero .button-secondary { background:transparent; color:#151f28; border-color:#151f28; }
html[data-theme='cs2'] .hero-caption { color:#f4f4ed; }
html[data-theme='cs2'] .project { border:none; border-left:6px solid #ff9b01; }
html[data-theme='cs2'] .community-panel { background:#b5c4cc; color:#172532; border:none; }
html[data-theme='cs2'] .community h2+p { color:#334b59; }
html[data-theme='cs2'] .community .eyebrow { color:#172532; }
html[data-theme='cs2'] .community .button-secondary { color:#172532; background:transparent; border-color:#172532; }
html[data-theme='cs2'] .section-intro h2,html[data-theme='cs2'] .community h2 { text-transform:uppercase; }

/* SnowRunner: an icy panorama, heavy slanted type and high-visibility expedition UI. */
html[data-theme='snowrunner'] {
 --forest:#151a20; --deep:#0c1117; --ink:#f4f7f8; --muted:#b9c8d2;
 --gold:#ffcf20; --gold-bright:#ffe365; --line:#4b5962; --panel:#202c35; --button-ink:#171a1e;
 --scene:url('./themes/snowrunner.webp'); --heading-font:'Russo One',sans-serif; --heading-weight:400; --heading-spacing:-.04em;
}
html[data-theme='snowrunner'] .hero { min-height:800px; }
html[data-theme='snowrunner'] .hero-art { background-position:62% center; }
html[data-theme='snowrunner'] .hero::after { background:linear-gradient(90deg,#0c1117ed 0%,#0c1117b3 28%,#0c111728 70%),linear-gradient(0deg,#151a20,transparent 40%); }
html[data-theme='snowrunner'] .hero h1 { font-size:clamp(3.2rem,5.3vw,5.3rem); text-transform:uppercase; font-style:italic; line-height:1.12; }
html[data-theme='snowrunner'] .hero h1 em { color:#ffcf20; font-style:italic; }
html[data-theme='snowrunner'] .hero-description { max-width:420px; }
html[data-theme='snowrunner'] .button { clip-path:polygon(0 0,100% 0,100% 100%,12px 100%,0 calc(100% - 12px)); padding-inline:24px; }
html[data-theme='snowrunner'] .section-intro h2,html[data-theme='snowrunner'] .community h2 { text-transform:uppercase; font-size:clamp(1.8rem,3.6vw,3.2rem); }
html[data-theme='snowrunner'] .project { border-left:5px solid #ff7b00; }
html[data-theme='snowrunner'] .community-panel { border-top:3px solid #ffcf20; background:repeating-radial-gradient(ellipse at 100% 100%,transparent 0 21px,#58708022 22px 23px,transparent 24px 42px),#202c35; }

/* Conan Exiles: desert ruins, bronze serif display and engraved angular frames. */
html[data-theme='conan'] {
 --forest:#211a13; --deep:#120f0b; --ink:#f4e8d5; --muted:#c7b7a0;
 --gold:#d1a876; --gold-bright:#f0c897; --line:#72583b; --panel:#30261c; --button-ink:#24180d;
 --scene:url('./themes/conan.webp'); --heading-font:'Cormorant Garamond',Georgia,serif; --heading-weight:700; --heading-spacing:-.025em;
}
html[data-theme='conan'] .hero { min-height:840px; }
html[data-theme='conan'] .hero-art { background-position:center; }
html[data-theme='conan'] .hero::after { background:radial-gradient(ellipse at 50% 40%,#21150cd1 0%,#21150c88 45%,#21150c33 80%),linear-gradient(0deg,#211a13,transparent 48%); }
html[data-theme='conan'] .topbar { border-bottom:1px solid #d1a87680; }
html[data-theme='conan'] .hero-copy { text-align:center; }
html[data-theme='conan'] .hero .eyebrow,html[data-theme='conan'] .hero .actions { justify-content:center; }
html[data-theme='conan'] .hero h1 { text-transform:uppercase; font-size:clamp(3.8rem,7.8vw,7.5rem); line-height:.97; text-shadow:0 3px 18px #160e09; }
html[data-theme='conan'] .hero h1 em { color:#e0b987; }
html[data-theme='conan'] .hero-description { margin-inline:auto; max-width:460px; text-shadow:0 2px 8px #160e09; }
html[data-theme='conan'] .hero .eyebrow::after { content:''; width:35px; height:1px; background:#d1a876; }
html[data-theme='conan'] .button { clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,14px 100%,0 50%); padding-inline:28px; }
html[data-theme='conan'] .button-primary { background:linear-gradient(#e0bd8a,#bb8b54); border-color:#e0bd8a; }
html[data-theme='conan'] .button-primary:hover { background:#f0c897; }
html[data-theme='conan'] .community-panel { background:linear-gradient(#211a13ba,#211a13ba),url('./themes/conan-stone.webp') center / cover; border:1px solid #9d7a4c; box-shadow:inset 0 0 0 5px #211a13,inset 0 0 0 6px #72583b; }
html[data-theme='conan'] .section-intro h2,html[data-theme='conan'] .community h2 { text-transform:uppercase; }

@media (max-width:640px) {
 html[data-theme='snowrunner'] .hero h1 { font-size:clamp(1.85rem,7.7vw,3rem); }
 html[data-theme='snowrunner'] .hero-art { background-position:66% center; }
 html[data-theme='snowrunner'] .hero::after { background:linear-gradient(90deg,#0c1117cc,#0c11174d),linear-gradient(0deg,#151a20,transparent 60%); }
 html[data-theme='snowrunner'] .community h2 { font-size:1.65rem; }
 html[data-theme='conan'] .hero { min-height:800px; }
 html[data-theme='conan'] .hero h1 { font-size:clamp(2.45rem,10.2vw,4rem); }
 html[data-theme='conan'] .hero-art { background-position:58% center; }
}

@media (max-width:1050px) and (min-width:641px) {
 html[data-theme='grounded'] .hero-copy { width:calc(50% - 64px); margin-left:calc(50% + 32px); }
 html[data-theme='grounded'] .hero::after { left:49%; }
 html[data-theme='grounded'] .hero-art { right:48%; }
 html[data-theme='grounded'] .hero h1 { font-size:clamp(2.5rem,5.4vw,3rem); }
 html[data-theme='cs2'] .hero-copy { width:calc(48% - 56px); margin-left:calc(52% + 24px); }
 html[data-theme='cs2'] .hero h1 { font-size:clamp(2.8rem,5.5vw,3.7rem); }
}
@media (max-width:640px) {
 .hero { min-height:720px; }
 .hero h1 { font-size:clamp(2.65rem,10.5vw,4.5rem); }
 .hero-copy { padding-block:64px 30px; }
 .hero::after { background:linear-gradient(90deg,color-mix(in srgb,var(--forest) 90%,transparent),color-mix(in srgb,var(--forest) 38%,transparent)),linear-gradient(0deg,var(--forest),transparent 75%); }
 .hero-art { background-position:62% center; }
 .hero-description { max-width:335px; font-size:1rem; }
 .hero-caption { font-size:.58rem; letter-spacing:.08em; }
 .button { font-size:.82rem; }
 .community .actions { width:100%; }
 html[data-theme='valheim'] .hero { min-height:780px; }
 html[data-theme='valheim'] .hero h1 { font-size:clamp(3.25rem,13vw,5rem); }
 html[data-theme='tarkov'] .hero h1 { font-size:clamp(2.5rem,9.7vw,4rem); }
 html[data-theme='tarkov'] .hero-art { background-position:64% center; }
 html[data-theme='rust'] .hero h1,html[data-theme='stalker'] .hero h1,html[data-theme='pirates'] .hero h1 { font-size:clamp(3.2rem,13vw,5rem); }
 html[data-theme='gta'] .hero { min-height:870px; }
 html[data-theme='gta'] .hero-art { inset:90px 18px auto; height:250px; transform:rotate(-2deg); }
 html[data-theme='gta'] .hero-copy { padding-top:320px; padding-bottom:30px; text-align:center; }
 html[data-theme='gta'] .hero h1 { font-size:clamp(2.5rem,10.3vw,3.9rem); }
 html[data-theme='gta'] .hero-description { margin-inline:auto; }
 html[data-theme='gta'] .hero .eyebrow,html[data-theme='gta'] .hero .actions { justify-content:center; }
 html[data-theme='gta'] .hero::after { background:linear-gradient(0deg,#111117 20%,#11111700 75%); }
 html[data-theme='grounded'] .topbar { padding-inline:0; }
 html[data-theme='grounded'] .hero { min-height:930px; }
 html[data-theme='grounded'] .hero-art { inset:65px 0 auto; height:300px; background-position:center; }
 html[data-theme='grounded'] .hero::after { inset:350px 0 0; clip-path:polygon(0 2%,14% 0,28% 2%,50% 0,73% 2%,90% 0,100% 2%,100% 100%,0 100%); }
 html[data-theme='grounded'] .hero-copy { width:calc(100% - 36px); margin-inline:auto; padding:335px 0 20px; }
 html[data-theme='grounded'] .hero h1 { font-size:clamp(3rem,12vw,4rem); }
 html[data-theme='grounded'] .hero-description { max-width:340px; }
 html[data-theme='grounded'] .hero .eyebrow { font-size:.7rem; }
 html[data-theme='minecraft'] .hero { min-height:780px; }
 html[data-theme='minecraft'] .hero h1 { font-size:clamp(1.3rem,6vw,2.2rem); line-height:1.6; }
 html[data-theme='minecraft'] .hero-art { background-position:center; }
 html[data-theme='cyberpunk'] .hero { min-height:930px; }
 html[data-theme='cyberpunk'] .hero-art { inset:65px 0 auto; height:310px; background-position:75% center; }
 html[data-theme='cyberpunk'] .hero::after { background:linear-gradient(0deg,#fcee0a 0%,#fcee0a 60%,transparent 83%); }
 html[data-theme='cyberpunk'] .hero-copy { padding-top:340px; padding-bottom:25px; }
 html[data-theme='cyberpunk'] .hero h1 { font-size:clamp(2.4rem,9.4vw,4rem); }
 html[data-theme='cyberpunk'] .hero .eyebrow { font-size:.68rem; }
 html[data-theme='cs2'] .hero { min-height:1000px; background:linear-gradient(163deg,#aeb8c0 0%,#aeb8c0 40%,#ff9b01 40.1%,#ff9b01 100%); }
 html[data-theme='cs2'] .hero-art { inset:75px 8% auto; height:370px; background-position:center bottom; }
 html[data-theme='cs2'] .hero-copy { width:calc(100% - 36px); margin-inline:auto; padding:420px 0 35px; }
 html[data-theme='cs2'] .hero h1 { font-size:clamp(3rem,12vw,4.5rem); }
 html[data-theme='cs2'] .hero-caption { color:#f4f4ed; }
}