:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;--bg:#111114;--panel:#28272f;--line:#494650;--gold:#ffb93e;--text:#f7f5f4;--muted:#c1bec8}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:82px}
body{margin:0;background:var(--bg);color:var(--text)}
a{color:inherit}
a:focus-visible,summary:focus-visible{outline:3px solid #fff;outline-offset:3px}
img{max-width:100%}
h1,h2,h3,.cta,.header-cta,.game-overlay a{font-family:Impact,"Arial Black",Arial,sans-serif;letter-spacing:.045em}
p{line-height:1.65}
.site-header{height:64px;position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:clamp(12px,2vw,36px);padding:0 18px;background:linear-gradient(110deg,#521114,#891b1c 55%,#511015);border-bottom:2px solid #a52d28;box-shadow:0 4px 18px #0008}
.brand{display:flex;align-items:center;flex:0 0 auto}
.brand img{width:145px;height:auto;display:block}
.header-links{display:flex;align-items:center;gap:20px;margin-left:auto}
.header-links a{text-decoration:none;font-size:14px;font-weight:bold;text-transform:uppercase}
.header-links a:hover,.sidebar a:hover{color:var(--gold)}
.header-phrase{font-size:13px;color:#ffe2bd;white-space:nowrap}
.header-cta,.hero-cta,.article-cta,.mobile-bar a{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 26px;background:linear-gradient(#ffe36a 0%,#ffb11f 42%,#f3870c 100%);border:3px solid #d5d5d5;box-shadow:0 0 0 3px #34282a,0 8px 18px #0009;color:#171216;text-decoration:none;text-align:center;text-transform:uppercase;font-size:20px;clip-path:polygon(9% 0,91% 0,100% 50%,91% 100%,9% 100%,0 50%)}
.header-cta{font-size:17px;min-width:172px;min-height:44px;background:linear-gradient(#696977,#2d2d36);color:#fff;border-color:#a8a8ae;white-space:nowrap}
.shell{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:calc(100vh - 64px)}
.sidebar{position:sticky;top:64px;height:calc(100dvh - 64px);display:flex;flex-direction:column;gap:8px;padding:12px;background:#161619;border-right:1px solid #35343b;overflow:auto}
.sidebar a{display:flex;align-items:center;min-height:45px;padding:8px 12px;background:linear-gradient(105deg,#373640,#292831);text-decoration:none;text-transform:uppercase;color:#d5d2de;font-size:13px;font-weight:bold;border-left:3px solid transparent}
body[data-route="/"] .sidebar a[href="/"],body[data-route="/bonus/"] .sidebar a[href="/bonus/"],body[data-route="/spiele/"] .sidebar a[href="/spiele/"],body[data-route="/sportwetten/"] .sidebar a[href="/sportwetten/"]{border-left-color:var(--gold);color:#ffcf5c;background:#3e3a42}
.sidebar-bottom{margin-top:auto;padding:20px 10px;color:#d3d0dd;font-size:12px;text-align:center;background:#292831}
main{min-width:0}
.hero{height:clamp(390px,28vw,520px);position:relative;display:flex;align-items:center;overflow:hidden;border-bottom:5px solid #383640;background:#211812}
.hero-compact{height:clamp(325px,23vw,410px)}
.hero-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#100b0be8 0%,#170d0dce 27%,#1c11116a 52%,transparent 78%)}
.hero-content{position:relative;z-index:1;width:min(680px,60%);padding:28px clamp(24px,4vw,76px)}
.eyebrow{display:inline-block;margin:0 0 12px;padding:5px 8px;background:#28232a;border:1px solid #6c6061;color:var(--gold);font-weight:900;text-transform:uppercase;font-size:13px;letter-spacing:.08em}
h1{font-size:clamp(36px,3.3vw,68px);line-height:1.05;text-transform:uppercase;text-shadow:3px 4px 0 #000,0 0 16px #000;margin:0 0 16px}
.hero-summary{font-size:clamp(15px,1.2vw,19px);max-width:580px;color:#eee;line-height:1.45;margin:0 0 25px;text-shadow:0 2px 6px #000}
.hero-cta{min-width:250px;min-height:58px}
.hero-note{display:block;margin-top:16px;font-size:12px;color:#e8ddcc;text-shadow:0 2px 5px #000}
.hero-note a{color:#ffd16e}
.category-strip{display:flex;gap:8px;padding:14px 18px;overflow-x:auto;border-top:1px solid #4b454b;border-bottom:1px solid #222;background:#151518;scrollbar-color:#59555e #151518}
.category-strip a{flex:0 0 auto;padding:9px 13px;background:#2c2b34;border:1px solid #49464f;color:#d8d6e0;text-decoration:none;text-transform:uppercase;font-size:12px;font-weight:bold;white-space:nowrap}
.category-strip a:hover{background:#48424c;color:#fff;border-color:#ffb438}
.content-wrap{padding:10px clamp(16px,2vw,34px) 58px}
.game-section{padding:8px 0 28px}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:10px 0 14px}
.section-heading h2,.promo-section h2{font-size:24px;line-height:1.1;text-transform:uppercase;margin:0}
.section-heading>a{color:#ffc15a;font-size:13px;font-weight:bold;text-decoration:none;text-transform:uppercase;white-space:nowrap}
.game-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(8px,1vw,16px)}
.game-card{position:relative;min-width:0;aspect-ratio:2/3;background:#29252b;border:2px solid #e4e0d9;box-shadow:0 3px 8px #000a;overflow:hidden}
.game-card>img{display:block;width:100%;height:100%;object-fit:cover}
.rank{position:absolute;z-index:2;bottom:-13px;left:0;font-family:Impact,"Arial Black",sans-serif;font-size:70px;line-height:1;color:#ffa529;-webkit-text-stroke:2px #101014;text-shadow:2px 2px #000}
.game-overlay{position:absolute;z-index:3;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:12px;background:#09090cda;text-align:center;opacity:0;transition:opacity .18s ease}
.game-card:hover .game-overlay,.game-card:focus-within .game-overlay{opacity:1}
.game-overlay strong{font-size:13px;text-shadow:0 2px #000}
.game-overlay a{display:flex;align-items:center;justify-content:center;min-height:55px;width:100%;padding:8px;background:linear-gradient(#ffdf67,#f49a19);border:2px solid #ffe6a0;color:#1a1112;text-decoration:none;text-transform:uppercase;font-size:12px;line-height:1.25}
.feature-grid{display:grid;grid-template-columns:1fr minmax(250px,38%);align-items:center;gap:28px;padding:30px;margin:20px 0;border:1px solid var(--line);background:linear-gradient(110deg,#30272a,#1c1c22)}
.feature-grid h2{margin:4px 0 14px;font-size:32px;text-transform:uppercase}
.feature-grid p{color:#e6e3e5}
.feature-grid img{width:100%;height:auto;aspect-ratio:403/202;object-fit:cover;border:2px solid #6e5a50}
.feature-grid a,.article a{color:#ffca70}
.article{max-width:1060px;margin:26px auto;padding:clamp(22px,3vw,42px);background:#232229;border:1px solid #47434c}
.article h2{margin:0 0 16px;font-size:clamp(27px,2.2vw,38px);text-transform:uppercase}
.article h3{font-size:21px;margin:28px 0 8px;text-transform:uppercase}
.article p{color:#e5e2e6;margin:0 0 18px}
.article-cta{margin-top:5px}
.faq{margin-top:24px}
.faq details{border-top:1px solid #5c5860;padding:12px 4px}
.faq details:last-child{border-bottom:1px solid #5c5860}
.faq summary{cursor:pointer;font-weight:bold;font-size:17px}
.faq details p{margin:12px 0 4px}
.promo-section{margin:14px 0 32px}
.promo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
.promo-card{background:#2b2932;border:1px solid #6a616a}
.promo-card img{display:block;width:100%;height:auto;aspect-ratio:403/202;object-fit:cover}
.promo-card>div{min-height:100px;padding:12px}
.promo-card span{font-size:11px;color:#ffcd70;text-transform:uppercase;font-weight:bold}
.promo-card h3{font-size:18px;text-transform:uppercase;margin:4px 0 8px}
.promo-card a{font-size:12px;color:#ffc670;text-decoration:none;text-transform:uppercase;font-weight:bold}
.terms-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:20px 0}
.terms-grid>div{background:#34313a;border-left:3px solid #ffb436;padding:14px}
.terms-grid strong,.terms-grid span{display:block}
.terms-grid strong{color:#d7d2da;font-size:13px;text-transform:uppercase;margin-bottom:8px}
.terms-grid span{font-size:18px;font-weight:bold}
.site-footer{padding:34px clamp(16px,2vw,34px);border-top:2px solid #543236;background:#18171b;color:#ccc}
.site-footer strong{display:block;color:#ffc652;font:26px Impact,"Arial Black",sans-serif;letter-spacing:.08em}
.site-footer nav{display:flex;flex-wrap:wrap;gap:15px;margin:14px 0 22px}
.site-footer nav a{font-size:13px;text-decoration:none}
.site-footer small{color:#aaa6af}
.mobile-bar{display:none}
@media(max-width:1100px){.shell{grid-template-columns:188px minmax(0,1fr)}.sidebar a{font-size:11px}.header-phrase{display:none}.game-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.hero-content{width:min(650px,70%)}}
@media(max-width:740px){.site-header{height:58px;padding:0 12px}.brand img{width:116px}.header-links,.sidebar{display:none}.header-cta{min-width:140px;min-height:42px;padding:7px 18px;font-size:14px;margin-left:auto}.shell{display:block}.hero{height:520px;align-items:end}.hero-compact{height:440px}.hero-art{object-position:66% center}.hero::after{background:linear-gradient(0deg,#100b0bf5 0%,#170d0ddc 43%,#170d0d34 100%)}.hero-content{width:100%;padding:24px 18px 34px}.hero h1{font-size:clamp(34px,8vw,50px)}.hero-summary{font-size:15px;max-width:500px}.hero-cta{min-width:230px;min-height:52px;font-size:18px}.content-wrap{padding:12px 14px 90px}.game-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.game-overlay{opacity:1;justify-content:end;background:linear-gradient(transparent 36%,#07070bdc 70%);padding:7px}.game-overlay strong{display:none}.game-overlay a{min-height:42px;font-size:9px;padding:4px}.rank{font-size:44px;bottom:-7px}.promo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-grid{grid-template-columns:1fr}.terms-grid{grid-template-columns:1fr 1fr}.mobile-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;position:fixed;z-index:40;bottom:0;left:0;right:0;padding:8px 12px;background:#221820f5;border-top:2px solid #e9a943;box-shadow:0 -4px 16px #0008}.mobile-bar span{font-size:13px;font-weight:bold}.mobile-bar a{min-height:42px;padding:8px 18px;font-size:15px;white-space:nowrap}}
@media(max-width:740px){.site-footer{padding-bottom:110px}}
@media(max-width:430px){.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.promo-grid{grid-template-columns:1fr}.terms-grid{grid-template-columns:1fr}.hero{height:485px}.hero-compact{height:425px}.hero h1{font-size:34px}.hero-content{padding-bottom:25px}.section-heading h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.game-overlay{transition:none}}