:root { color-scheme: dark; --bg:#101110; --surface:#202220; --panel:#292c29; --accent:#60df4d; --text:#eeeff3; --muted:#b5b8bd; --line:#3a403a; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:16px/1.65 Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
a:focus-visible, summary:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
img { display:block; max-width:100%; object-fit:cover; }
.header { position:sticky; top:0; z-index:30; display:flex; align-items:center; gap:36px; padding:18px max(24px,calc((100vw - 1460px)/2)); background:var(--surface); border-bottom:1px solid var(--line); }
.brand { flex-shrink:0; display:block; }
.brand img { width:136px; height:46px; object-fit:contain; }
.desktop-nav { display:flex; gap:25px; font-size:14px; font-weight:700; }
.desktop-nav a[aria-current] { color:var(--accent); }
.account { display:flex; gap:10px; margin-left:auto; }
.cta, .secondary { display:inline-flex; justify-content:center; align-items:center; gap:12px; padding:12px 22px; min-height:44px; border-radius:9px; font-weight:700; line-height:1.4; }
.cta { background:var(--accent); color:#0a1c0a; }
.secondary { background:var(--panel); color:var(--text); }
.cta:hover { filter:brightness(1.12); }
.secondary:hover { background:#404540; }
.mobile-menu { display:none; }
main { max-width:1460px; margin:auto; padding:28px 24px 140px; }
.hero { position:relative; isolation:isolate; overflow:hidden; border-radius:22px; min-height:420px; background:var(--surface); }
.hero > img { position:absolute; right:0; top:0; width:52%; height:100%; z-index:-2; }
.hero::after { content:''; position:absolute; inset:0; background:linear-gradient(110deg,var(--surface) 0%,var(--surface) 44%,transparent 68%); z-index:-1; }
.hero-copy { width:56%; padding:55px 46px; }
.eyebrow { display:inline-block; padding:4px 13px; background:#ffffff0c; border-radius:7px; font-size:13px; font-weight:700; color:var(--accent); }
.hero-title { font-size:clamp(34px,4.1vw,62px); font-weight:800; letter-spacing:-2px; line-height:1.08; margin:22px 0 12px; }
.hero-lead { font-size:20px; line-height:1.5; margin:0 0 25px; color:#d9ded8; }
.hero small { display:block; margin-top:20px; font-size:11px; color:var(--muted); max-width:400px; }
.categories { display:flex; gap:8px; overflow:auto; padding:20px 0 8px; scrollbar-width:thin; }
.categories a { white-space:nowrap; padding:10px 22px; background:var(--panel); border-radius:9px; font-size:14px; font-weight:700; }
.categories a:first-child { background:#ecedf1; color:#111; }
.games-section { margin-top:28px; }
.section-bar { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-bottom:18px; }
.section-bar p { margin:0; font-size:25px; font-weight:800; letter-spacing:-.5px; }
.section-bar a { background:var(--panel); padding:10px 17px; border-radius:8px; font-size:13px; white-space:nowrap; }
.game-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:16px; }
.game { min-width:0; background:var(--surface); border-radius:16px; overflow:hidden; transition:transform .2s; }
.game:hover { transform:translateY(-5px); }
.game img { width:100%; height:auto; aspect-ratio:205/271; }
.game span { display:block; text-align:center; padding:10px 4px; font-size:12px; font-weight:700; }
.rewards { position:relative; isolation:isolate; overflow:hidden; min-height:255px; border-radius:20px; background:var(--surface); margin:34px 0; }
.rewards > img { position:absolute; right:0; top:0; width:44%; height:100%; z-index:-2; }
.rewards::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,var(--surface) 44%,transparent 83%); z-index:-1; }
.rewards > div { padding:36px; max-width:65%; }
.rewards p { font-size:30px; font-weight:800; line-height:1.2; margin:14px 0 22px; }
.offers { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin:28px 0; }
.offer { border-radius:16px; background:var(--surface); overflow:hidden; }
.offer img { width:100%; height:200px; object-position:top; }
.offer div { padding:22px; }
.offer strong { display:block; font-size:23px; margin:8px 0; }
.offer p { color:var(--muted); font-size:14px; }
.access-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:28px 0; }
.access-steps > div { padding:25px; background:var(--surface); border-radius:15px; }
.access-steps span { display:inline-grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--accent); color:#102011; font-weight:800; }
.access-steps strong { display:block; font-size:20px; margin-top:16px; }
.access-steps p { color:var(--muted); font-size:14px; }
.publication-date { max-width:1080px; margin:35px auto 10px; text-align:right; }
.publication-date time { display:inline-block; font-size:12px; color:var(--muted); padding:5px 10px; border:1px solid var(--line); border-radius:6px; }
article { max-width:1080px; margin:auto; padding:40px 45px; background:var(--surface); border-radius:18px; overflow-wrap:anywhere; }
article h1, article h2, article h3, article h4 { line-height:1.22; letter-spacing:-.7px; }
article h1 { font-size:37px; margin:0 0 24px; }
article h2 { font-size:27px; margin:36px 0 15px; }
article h3 { font-size:21px; }
article h4 { font-size:18px; }
article p, article li { color:#c8ccc7; }
article a { color:var(--accent); text-decoration:underline; text-underline-offset:4px; }
article li { margin:8px 0; }
article table { width:100%; border-collapse:collapse; table-layout:fixed; margin:25px 0; font-size:14px; }
article th, article td { border:1px solid var(--line); padding:14px; text-align:left; }
article th { background:var(--panel); }
article figure { margin:30px 0; padding:10px; border:1px solid var(--line); background:#0002; border-radius:14px; }
article figure img { width:100%; height:auto; border-radius:8px; }
article figure figcaption { padding:12px 5px 3px; font-size:12px; color:var(--muted); }
article figure[data-portrait] { max-width:430px; margin-inline:auto; }
article details { border:1px solid var(--line); border-radius:10px; margin:12px 0; padding:18px; }
article summary { cursor:pointer; font-weight:700; }
article details p { margin-bottom:0; }
article > aside { display:grid; grid-template-columns:80px minmax(0,1fr); gap:20px; align-items:center; margin-top:35px; padding:24px; border:1px solid var(--line); border-radius:14px; background:var(--panel); }
article > aside img { width:80px; height:80px; border-radius:50%; }
article > aside p { margin:0 0 8px; font-size:14px; }
article > aside strong { color:var(--text); font-size:21px; }
article > aside small { color:var(--accent); font-size:12px; }
footer { margin-top:55px; padding-top:32px; border-top:1px solid var(--line); }
.footer-top { display:flex; align-items:center; justify-content:space-between; }
.age { border:1px solid var(--muted); border-radius:50%; padding:10px; font-size:13px; }
footer nav { display:flex; flex-wrap:wrap; gap:16px 26px; padding:28px 0; font-size:14px; color:var(--muted); }
.footer-disclaimer { max-width:1100px; font-size:12px; line-height:1.8; color:var(--muted); margin:0 0 24px; }
.footer-bottom { border-top:1px solid var(--line); padding-top:20px; font-size:12px; color:var(--muted); display:flex; justify-content:space-between; gap:15px; flex-wrap:wrap; overflow-wrap:anywhere; }
.catfish { display:flex; align-items:center; gap:20px; position:fixed; bottom:15px; left:50%; width:calc(100% - 30px); max-width:760px; transform:translate(-50%,160%); transition:transform .25s; background:#252e24; border:1px solid var(--accent); border-radius:15px; padding:14px 22px; z-index:25; box-shadow:0 10px 40px #0009; }
.catfish.visible { transform:translate(-50%,0); }
.catfish img { width:100px; height:36px; object-fit:contain; }
.catfish div { flex:1; }
.catfish strong { display:block; font-size:17px; }
.catfish small { display:block; font-size:11px; color:var(--muted); }
@media(max-width:1000px) { .desktop-nav{gap:15px}.header{gap:20px}.hero-copy{padding:40px 30px}.hero-title{font-size:44px}.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.offers{gap:12px}.offer div{padding:16px} }
@media(max-width:700px) { .header{padding:10px 15px;gap:13px;flex-wrap:wrap}.brand img{width:116px;height:38px}.header>.brand{margin-right:auto}.desktop-nav{display:none}.account{margin-left:0;gap:7px}.account a{padding:10px 13px;min-height:39px;font-size:12px}.mobile-menu{display:block;order:-1}.mobile-menu summary{cursor:pointer;list-style:none;font-size:24px;line-height:1;padding:5px}.mobile-menu summary::-webkit-details-marker{display:none}.mobile-menu nav{position:absolute;top:100%;left:10px;right:10px;background:var(--surface);padding:18px;border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 20px #0009;display:grid;gap:7px}.mobile-menu nav a{padding:10px;font-size:14px}main{padding:18px 14px 115px}.hero{min-height:500px;border-radius:16px}.hero>img{width:100%;height:100%;object-position:center}.hero::after{background:linear-gradient(0deg,#111f 0%,#111e 28%,#1115 70%,#1111)}.hero-copy{width:100%;padding:240px 22px 28px}.hero-title{font-size:38px;letter-spacing:-1px;margin:16px 0 10px}.hero-lead{font-size:17px;margin-bottom:20px}.hero small{font-size:10px}.categories a{padding:9px 16px;font-size:12px}.games-section{margin-top:24px}.section-bar p{font-size:22px}.game-grid{gap:10px}.game{border-radius:10px}.game span{font-size:10px;padding:8px 3px}.rewards{min-height:260px}.rewards>img{width:100%;opacity:.5}.rewards::after{background:linear-gradient(90deg,#111f,#1117)}.rewards>div{max-width:100%;padding:28px}.rewards p{font-size:28px}.offers{grid-template-columns:1fr}.offer{display:grid;grid-template-columns:35% minmax(0,1fr)}.offer img{height:100%;min-height:230px}.offer strong{font-size:21px}.offer .cta{font-size:13px;padding:10px 15px}.access-steps{grid-template-columns:1fr;gap:10px}.access-steps>div{padding:20px}.access-steps strong{display:inline;margin-left:12px}.access-steps p{margin-bottom:0}article{padding:25px 18px;border-radius:13px}article h1{font-size:29px}article h2{font-size:24px}article table{font-size:12px}article th,article td{padding:8px}article ul,article ol{padding-left:20px}article > aside{padding:16px;grid-template-columns:60px minmax(0,1fr);gap:14px}article > aside img{width:60px;height:60px}article > aside strong{font-size:19px}article > aside p{font-size:13px}.catfish{padding:12px 14px;gap:12px;bottom:9px;border-radius:11px}.catfish img{display:none}.catfish strong{font-size:14px}.catfish small{font-size:10px}.catfish .cta{font-size:12px;padding:10px 14px}.footer-bottom{font-size:11px} }
@media(max-width:360px) { .header{gap:7px}.brand img{width:95px}.account a{padding:9px 10px}.hero-title{font-size:33px}.catfish .cta{padding:9px 11px} }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after{transition:none!important;scroll-behavior:auto!important} }

body{--bg:#211e18;--surface:#302c22;--panel:#423c2d;--line:#655b3d;--accent:#d7e772}.hero{border-radius:35px 5px}.hero-title{font-family:Georgia,serif;letter-spacing:-1px}.cta{border-radius:6px}.game{border:1px solid #6a6142;border-radius:15px}.rewards{border-radius:5px 35px}.section-bar p,article h1,article h2{font-family:Georgia,serif}article{border:1px solid var(--line);border-radius:8px}.catfish{background:#3a3824}@media(min-width:1000px){.game-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.game img{aspect-ratio:1.25;object-position:top}.hero-copy{padding:65px 48px}.offers{grid-template-columns:1fr 1fr}.offer:first-child{grid-column:1/-1;display:grid;grid-template-columns:35% 1fr}.offer:first-child img{height:100%;max-height:320px}}
@media(max-width:600px) { article table { display:block; overflow-x:auto; table-layout:auto; scrollbar-width:thin; } article th,article td { min-width:135px; padding:10px; } article table p { margin:0; } }
