/* RafaRGL – Lounge-CI (Espresso). Gilt für alle Seiten, überschreibt die alten Stile. */
@font-face{font-family:Lil;src:url(/stream/lil.woff2) format("woff2");font-display:swap}
@font-face{font-family:Nu;src:url(/stream/nu8.woff2) format("woff2");font-weight:800;font-display:swap}
:root{
 --bg:#1a1411;--card:rgba(20,15,12,.88);--card2:#241b15;--line:#3a2d23;--iron:#33281f;
 --gelb:#e0a526;--gold:#e0a526;--lilah:#d9a35a;--txt:#efe3c8;--bone:#efe3c8;--mut:#c4b496;--ink:#120d0a;
 --red:#b3261e;--horde:#b3261e;--twitch:#e0a526;--yt:#e0a526;--dc:#e0a526;--tt:#e0a526;--ig:#e0a526;--kofi:#e0a526;
 --cut:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));
}
html{background:var(--bg)}
body{color:var(--txt);font:17px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:transparent!important;position:relative}
body::before{content:"";position:fixed;inset:0;z-index:-2;background:url(/assets/bg.webp) center top/cover no-repeat;opacity:1;filter:sepia(.2) saturate(.85)}
body.gilde-bg::before{background-image:url(/assets/bg_gilde.webp)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
 background:linear-gradient(180deg,rgba(26,20,17,.12) 0%,rgba(26,20,17,.42) 30%,rgba(26,20,17,.72) 60%,rgba(26,20,17,.85) 100%),
 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.13'/%3E%3C/svg%3E")}
a{color:var(--gold)}
h1,h2,h3,.h,.lil,.sub,.btn b,.pill,.cta,.btn{font-family:Lil,"Arial Black",sans-serif!important;font-weight:400}
h1{color:var(--bone)!important;text-shadow:none!important;letter-spacing:.5px}
h2,h2.sec{color:var(--bone)!important;text-shadow:none!important;display:inline-block;position:relative;padding-bottom:6px}
h2::after,h2.sec::after{content:"";position:absolute;left:0;bottom:0;width:64px;height:3px;background:var(--gold)}
h3{color:var(--bone)}
b,strong{color:var(--bone)}
/* Flächen: kantig, eiserner Rand, keine Glows */
.card,.quiz,.now,.gilde,.contact,.btn,.day,.val,.step,.role,.pick,.opt,.count div,.res .pick,.tile,.cls,.race{
 border-radius:0!important;box-shadow:none!important;clip-path:var(--cut)}
.card,.gilde,.contact,.val,.role{background:var(--card)!important;border:1px solid var(--iron)!important}
.quiz,.now{background:var(--card)!important;border:0!important;border-left:10px solid var(--gold)!important;padding:22px 24px!important}
.now{border-left-color:var(--red)!important}
.gilde{border-left:10px solid var(--red)!important;border-style:solid!important}
.btn{background:var(--card)!important;border:1px solid var(--iron)!important;border-left:6px solid var(--iron)!important}
.btn:hover,.btn:focus-visible{border-left-color:var(--gold)!important;background:var(--card2)!important;transform:none!important}
.btn.main{border-left-color:var(--gold)!important}
.ic{border-radius:0!important;background:var(--ink)!important;color:var(--bone)!important}
.btn:hover .ic{color:var(--gold)!important}
.day{background:var(--card)!important;border-left:6px solid var(--c,var(--gold))!important}
.day .d,.step .d{color:var(--gold)!important}
.kick,.qn{color:var(--gold)!important;letter-spacing:2px}
.pill,.badge{border-radius:0!important;background:var(--gold)!important;color:var(--ink)!important;transform:rotate(-2deg)}
.cta,.btn.y{border-radius:0!important;background:var(--gold)!important;color:var(--ink)!important;box-shadow:4px 5px 0 rgba(0,0,0,.45)!important;
 clip-path:polygon(1% 6%,6% 0,30% 4%,55% 0,80% 5%,99% 0,100% 92%,94% 100%,70% 95%,45% 100%,20% 96%,0 100%)}
.cta.ghost,.btn.g{background:transparent!important;color:var(--bone)!important;border:2px solid var(--iron)!important;box-shadow:none!important;clip-path:none;border-radius:0!important}
.chip{border-radius:0!important;background:var(--iron)!important;color:var(--bone)!important}
.chip.new{background:var(--gold)!important;color:var(--ink)!important}
.opt{background:var(--ink)!important;border:1px solid var(--iron)!important;color:var(--bone)!important}
.opt:hover,.opt:focus-visible{border-color:var(--gold)!important}
.prog{border-radius:0!important;background:var(--ink)!important}.prog i{background:var(--gold)!important}
.hero img,.now img,.gilde img,.logo{filter:none!important}
.count b{color:var(--gold)!important}
.top a{color:var(--mut)}.top a:hover{color:var(--gold)}
/* Klebeband-Titel */
.tape{display:inline-block;background:var(--gold);color:var(--ink);font-family:Lil,"Arial Black",sans-serif;padding:.14em .5em .06em;transform:rotate(-3deg);
 box-shadow:4px 6px 0 rgba(0,0,0,.45);clip-path:polygon(1% 6%,6% 0,30% 4%,55% 0,80% 5%,99% 0,100% 92%,94% 100%,70% 95%,45% 100%,20% 96%,0 100%)}
.tape.red{background:var(--red);color:var(--bone)}
.live{color:var(--red)}
footer,footer a{color:var(--mut)!important}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.btn small,.btn span small{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif!important;color:var(--mut)!important}
/* Navigationsleiste */
.nav-top{position:sticky;top:0;z-index:50;background:rgba(18,13,10,.94);border-bottom:1px solid var(--iron);backdrop-filter:blur(6px)}
.nav-top .in{max-width:900px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:0 16px;height:56px}
.nav-top .brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--bone);font-family:Lil,"Arial Black",sans-serif;font-size:20px;white-space:nowrap;flex:none}
.nav-top .brand img{width:34px;height:34px;border-radius:50%}
.nav-top ul{list-style:none;margin:0 0 0 auto;padding:0;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.nav-top ul::-webkit-scrollbar{display:none}
.nav-top a.l{display:block;padding:17px 10px 15px;color:var(--mut);text-decoration:none;font-weight:700;font-size:15px;white-space:nowrap;border-bottom:3px solid transparent}
.nav-top a.l:hover,.nav-top a.l:focus-visible{color:var(--bone);border-bottom-color:var(--iron);outline:none}
.nav-top a.l[aria-current="page"]{color:var(--bone);border-bottom-color:var(--gold)}
.nav-top a.l.live{color:var(--ink);background:var(--gold);border:0;margin:11px 0 11px 6px;padding:6px 12px;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
@media (max-width:640px){.nav-top .in{height:auto;flex-wrap:wrap;gap:0;padding:6px 12px 0}.nav-top .brand{height:40px}.nav-top ul{margin:0;width:100%}.nav-top a.l{padding:10px 9px 9px;font-size:14px}.nav-top a.l.live{margin:5px 0 5px 4px}}
html{scroll-padding-top:70px;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Streamer der Gilde */
.streamers{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:14px 0 6px}
.st{display:flex;gap:14px;align-items:center;text-decoration:none;color:var(--bone);background:var(--card);border:1px solid var(--iron);border-left:6px solid var(--gold);padding:14px 16px;clip-path:var(--cut)}
.st:hover,.st:focus-visible{background:var(--card2);outline:none}
.st img{width:56px;height:56px;border-radius:50%;flex:none}
.st b{display:block;font-family:Lil,"Arial Black",sans-serif;font-weight:400;font-size:21px;line-height:1.1}
.st small{display:block;color:var(--mut);font-size:14.5px;line-height:1.35;margin-top:2px}
.st em{display:inline-block;font-style:normal;font-size:12px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold);margin-top:6px}
.st.join{border-left-color:var(--iron);border-style:dashed;border-left-style:solid}
.st .plus{width:56px;height:56px;flex:none;display:grid;place-items:center;font-family:Lil,"Arial Black",sans-serif;font-size:34px;color:var(--ink);background:var(--gold);clip-path:var(--cut)}