@import url("../_base/style.css");
@import url("fonts.css");

:root{--bg:#0b0d12;--panel:#141821;--text:#eef0f4;--accent:#ff3d5a;--radius:0px;--ok:#3ddc84;--err:#ff5c5c;
  --font:'Barlow',system-ui,sans-serif;--font-head:'Barlow Condensed','Arial Narrow',Impact,sans-serif}

/* ARENA: schraeg, laut, Poster-Typografie ------------------------------- */
body.theme-arena{position:relative;overflow-x:hidden}
.theme-arena .wrap,.theme-arena main,.theme-arena header,.theme-arena footer{position:relative}
.theme-arena .wrap{max-width:1200px}

.theme-arena h1,.theme-arena h2,.theme-arena h3{text-transform:uppercase;font-weight:800;letter-spacing:.01em}
.theme-arena main>h1,.theme-arena main .narrow>h1,.theme-arena main article>h1{font-size:3.6rem;line-height:.95;margin:.2em 0 .4em}
.theme-arena h2{border:0;padding:0;margin:3.2rem 0 1.1rem;font-size:2.6rem;display:flex;align-items:center;gap:14px}
.theme-arena h2::before{content:"";width:38px;height:14px;background:var(--accent);transform:skewX(-35deg);flex-shrink:0}
.theme-arena h3{font-size:1.5rem}

.theme-arena .site-header{background:transparent;border:0;position:static}
.theme-arena .bar{padding-top:14px;padding-bottom:14px}
.theme-arena .brand{font-family:var(--font-head);font-size:1.8rem;font-weight:800;letter-spacing:.06em;display:flex;align-items:center;gap:12px}
.theme-arena .brand::before{content:"";width:36px;height:36px;background:var(--accent);clip-path:polygon(0 0,100% 0,100% 66%,66% 100%,0 100%)}
.theme-arena .brand:has(img)::before{display:none}
.theme-arena .site-header nav{gap:6px}
.theme-arena .site-header nav a,.theme-arena .who a{font-family:var(--font-head);font-weight:700;font-size:1.15rem;letter-spacing:.07em;text-transform:uppercase;color:color-mix(in srgb,var(--text) 65%,var(--bg));padding:2px 12px;transform:skewX(-14deg)}
.theme-arena .site-header nav a:hover,.theme-arena .who a:hover{color:#0b0d12;background:var(--accent);text-decoration:none}

.theme-arena .btn,.theme-arena button.btn{font-family:var(--font-head);font-weight:800;font-size:1.2rem;letter-spacing:.07em;text-transform:uppercase;border-radius:0;color:#0b0d12;
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);padding:10px 34px}
.theme-arena .btn.ghost{background:transparent;color:var(--text);clip-path:none;border:2px solid var(--line);transform:skewX(-10deg)}

.theme-arena .card{border-radius:0;border:0}
.theme-arena a.card,.theme-arena .card.player{clip-path:polygon(0 0,100% 0,100% calc(100% - 24px),calc(100% - 24px) 100%,0 100%)}
.theme-arena a.card:hover{background:color-mix(in srgb,var(--panel) 78%,var(--accent));text-decoration:none}
.theme-arena .match,.theme-arena .event{border:0;border-left:4px solid var(--accent);border-radius:0;clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);padding-left:28px}

/* Startseite: Poster-Layout */
.ar-hero{padding:24px 0 44px}
.ar-tag{display:inline-block;background:var(--accent);color:#0b0d12;font-family:var(--font-head);font-weight:800;letter-spacing:.16em;text-transform:uppercase;padding:2px 16px;font-size:.95rem;transform:skewX(-14deg)}
.ar-hero h1{margin:14px 0 0;overflow-wrap:anywhere;font-size:clamp(3.4rem,19vw,17rem);line-height:.78;font-weight:800;letter-spacing:-.02em}
.ar-hero h1 .o{color:transparent;-webkit-text-stroke:3px var(--text)}
.ar-hero h1 .a{color:var(--accent)}
.ar-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;margin-top:34px;padding-top:22px;border-top:2px solid var(--line)}
.ar-hero p.lead{margin:0;font-size:1.3rem;color:var(--muted);max-width:30em}
.ar-actions{display:flex;flex-wrap:wrap;gap:16px}
.ar-strip{display:flex;flex-wrap:wrap;align-items:center;gap:8px 36px;background:var(--accent);color:#0b0d12;padding:18px 0;margin-bottom:56px;box-shadow:0 0 0 100vmax var(--accent);clip-path:inset(0 -100vmax);font-family:var(--font-head);text-transform:uppercase}
.ar-strip:hover{color:#0b0d12;text-decoration:none}
.ar-strip .lbl{background:#0b0d12;color:var(--accent);font-weight:800;letter-spacing:.14em;padding:2px 14px;font-size:1rem;transform:skewX(-14deg)}
.ar-strip .teams{flex:1 1 320px;font-weight:800;font-size:clamp(1.7rem,4vw,3rem);line-height:1}
.ar-strip .teams i{font-style:normal;opacity:.55;font-size:.6em;margin:0 6px}
.ar-strip .when{font-weight:700;font-size:1.4rem}
.ar-strip .go{font-weight:800;font-size:1.3rem;letter-spacing:.06em;border-bottom:3px solid #0b0d12}
.ar-strips{border-bottom:2px solid var(--line)}
.ar-tstrip{display:grid;grid-template-columns:130px minmax(0,1fr) auto auto 56px;align-items:center;gap:18px;padding:12px 18px;border-top:2px solid var(--line);color:var(--text);font-family:var(--font-head);text-transform:uppercase;transition:padding .15s,background .15s,color .15s}
.ar-tstrip:hover{background:var(--accent);color:#0b0d12;padding-left:34px;text-decoration:none}
.ar-tstrip .no{font-weight:800;font-size:3.6rem;line-height:1;-webkit-text-fill-color:transparent;-webkit-text-stroke:2px currentColor}
.ar-tstrip .nm{font-weight:800;font-size:clamp(2rem,5vw,3.6rem);line-height:1;overflow-wrap:anywhere}
.ar-tstrip .gm{font-weight:700;font-size:1.2rem;letter-spacing:.06em;opacity:.75}
.ar-tstrip .pl{font-weight:600;font-size:1rem;opacity:.75}
.ar-tstrip .ar{font-size:2.2rem;font-weight:800;text-align:right}
.ar-tstrip img{width:48px;height:48px;object-fit:cover;justify-self:end}
@media(max-width:760px){.ar-tstrip{grid-template-columns:70px minmax(0,1fr) 40px}.ar-tstrip .gm,.ar-tstrip .pl{display:none}.ar-tstrip .no{font-size:2.4rem}}
.ar-cols{display:flex;flex-wrap:wrap;gap:48px}
.ar-cols>div{flex:1 1 440px;min-width:0}
.ar-row{display:flex;align-items:center;gap:16px;background:var(--panel);padding:13px 30px;margin-bottom:8px;border-left:4px solid var(--line);clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%)}
.ar-row.win{border-left-color:var(--ok)}.ar-row.loss{border-left-color:var(--err)}
.ar-row .when{flex:0 0 84px;font-family:var(--font-head);font-weight:700;font-size:1.1rem;line-height:1.15;color:var(--accent)}
.ar-row .when small{display:block;color:var(--muted);font-size:1.1rem}
.ar-row .what{flex:1;min-width:0;font-family:var(--font-head);font-weight:700;font-size:1.35rem;text-transform:uppercase}
.ar-row .meta{font-size:.8rem;color:var(--muted);text-align:right}
.ar-row .score{font-family:var(--font-head);font-weight:800;font-size:1.6rem}
.ar-row.win .score{color:var(--ok)}.ar-row.loss .score{color:var(--err)}
.ar-news{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:20px}
.ar-news .card{padding:0}
.ar-news .cover{aspect-ratio:16/9;background:color-mix(in srgb,var(--panel) 80%,var(--text));background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:12px;font-family:var(--font-head);font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:.9rem;color:var(--accent);clip-path:polygon(0 0,100% 0,100% calc(100% - 22px),0 100%)}
.ar-news .body{padding:18px 22px 26px}
.ar-news h3{margin:2px 0 8px;line-height:1.1}

.theme-arena .site-footer{margin-top:5rem;border-top:6px solid var(--accent);background:var(--panel)}

@media(max-width:760px){.theme-arena .site-header nav{flex-basis:100%;order:3}.theme-arena .site-header nav a{font-size:1rem;padding:2px 8px}}


.theme-arena .partners{background:var(--panel);border:0;margin-bottom:8px}
.theme-arena .partners .pi{border:0;background:var(--bg);font-family:var(--font-head);font-size:1.1rem;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%)}
.theme-arena .partners{padding-left:22px;padding-right:22px}

/* Matches-Seite: Scoreboard ------------------------------------------- */
.mt-page .head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px}
.mt-page .head h1{font-size:3.6rem;line-height:.95;margin:.2em 0 .4em}
.mt-page .rec{display:flex;gap:10px;font-family:var(--font-head);text-transform:uppercase}
.mt-page .rec div{background:var(--panel);padding:8px 22px 8px 18px;clip-path:polygon(0 0,100% 0,calc(100% - 14px) 100%,0 100%);border-left:4px solid var(--line)}
.mt-page .rec b{display:block;font-size:2.4rem;line-height:1;font-weight:800}.mt-page .rec span{font-size:.85rem;letter-spacing:.12em;color:var(--muted)}
.mt-page .rec .w{border-left-color:var(--ok)}.mt-page .rec .w b{color:var(--ok)}.mt-page .rec .l{border-left-color:var(--err)}.mt-page .rec .l b{color:var(--err)}
.mt-page .chips{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0}
.mt-page .chips input{position:absolute;opacity:0;width:0;height:0}
.mt-page .chips label{cursor:pointer;font-family:var(--font-head);font-weight:700;font-size:1.15rem;letter-spacing:.08em;text-transform:uppercase;padding:2px 22px;border:2px solid var(--line);transform:skewX(-14deg);color:var(--muted)}
.mt-page .chips label span{display:inline-block;transform:skewX(14deg)}
.mt-page .chips input:checked+label{background:var(--accent);border-color:var(--accent);color:#0b0d12}
.mt-page .chips input:focus-visible+label{outline:2px solid var(--text);outline-offset:3px}
.mt-page .up{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:16px}
.mt-page .uc{position:relative;background:var(--panel);padding:20px 24px 22px;clip-path:polygon(0 0,100% 0,100% calc(100% - 26px),calc(100% - 26px) 100%,0 100%);overflow:hidden;font-family:var(--font-head);text-transform:uppercase}
.mt-page .uc::after{content:"";position:absolute;right:-30px;top:0;bottom:0;width:90px;background:var(--accent);opacity:.12;transform:skewX(-14deg)}
.mt-page .uc .in{font-weight:800;font-size:3rem;line-height:.9;color:transparent;-webkit-text-stroke:2px var(--accent)}
.mt-page .uc .vs{font-weight:800;font-size:1.7rem;line-height:1.05;margin:12px 0 6px}.mt-page .uc .vs i{font-style:normal;color:var(--accent);margin:0 6px}
.mt-page .uc .mt{font-size:.95rem;letter-spacing:.08em;color:var(--muted)}
.mt-page .uc .live{background:var(--accent);color:#0b0d12;padding:0 10px;font-weight:800;margin-left:8px;display:inline-block;animation:pulse 1.4s infinite}
.mt-page .uc .stream{position:relative;z-index:1;display:inline-block;margin-top:10px;font-weight:800;letter-spacing:.06em;color:var(--text);border-bottom:3px solid var(--accent)}
.mt-page .rg{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(360px,100%),1fr));gap:16px}
.mt-page .sb{background:var(--panel);padding:14px 20px 0;clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%);font-family:var(--font-head);text-transform:uppercase}
.mt-page .sb .tp{display:flex;justify-content:space-between;gap:10px;font-size:.85rem;letter-spacing:.1em;color:var(--muted)}
.mt-page .sb a.ml{display:block;padding:0 0 12px;margin-top:-6px;font-size:.8rem;font-weight:800;letter-spacing:.08em;color:var(--text);text-decoration:none;border-bottom:0}.mt-page .sb a.ml:hover{color:var(--accent)}
.mt-page .sb .mid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:12px 0 16px}
.mt-page .sb .t{font-weight:700;font-size:1.25rem;line-height:1.1;overflow-wrap:anywhere}.mt-page .sb .t:last-child{text-align:right}
.mt-page .sb .s{font-weight:800;font-size:3.6rem;line-height:.9;letter-spacing:-.01em;white-space:nowrap}
.mt-page .sb .s em{font-style:normal;opacity:.35;margin:0 2px}
.mt-page .sb.win .s{color:var(--ok)}.mt-page .sb.loss .s{color:var(--err)}
.mt-page .sb .mbar{height:6px;margin:0 -20px;background:var(--line)}.mt-page .sb.win .mbar{background:var(--ok)}.mt-page .sb.loss .mbar{background:var(--err)}
@media(max-width:560px){.mt-page .head h1{font-size:2.8rem}.mt-page .sb .s{font-size:2.8rem}}

/* Titelbild (Design -> Titelbild): ueber die volle Breite hinter dem Titel, zum Text hin abgedunkelt */
.ar-hero.has-img{position:relative;isolation:isolate;padding:64px 0 48px;clip-path:inset(0 -100vmax -2px)}
.ar-hero.has-img::before{content:"";position:absolute;top:0;bottom:-2px;left:50%;width:100vw;margin-left:-50vw;z-index:-1;background:linear-gradient(90deg,var(--bg) 0%,color-mix(in srgb,var(--bg) 78%,transparent) 45%,color-mix(in srgb,var(--bg) 35%,transparent) 100%),linear-gradient(0deg,var(--bg) 0,var(--bg) 3px,transparent 45%),var(--hero-img) center/cover no-repeat}
.ar-hero.has-img h1 .o{-webkit-text-stroke-color:var(--text)}
@media(max-width:760px){.ar-hero.has-img{padding:36px 0 32px}}

/* Wartungsseite */
.wt-arena{position:relative;min-height:100vh;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(24px,4vw,56px) clamp(20px,5vw,72px) 0;overflow:hidden}
.wt-arena h1{margin:2.2vw 0 0;font-size:clamp(3.6rem,17vw,12rem);line-height:.82;font-weight:800;letter-spacing:-.02em;text-transform:uppercase}
.wt-arena h1 .o{color:transparent;-webkit-text-stroke:3px var(--text)}
.wt-arena h1 .a{color:var(--accent)}
.wt-arena .lead{max-width:30em;color:var(--muted);font-size:clamp(1.05rem,2vw,1.35rem);margin:clamp(16px,3vw,36px) 0 0;border-top:2px solid var(--line);padding-top:clamp(14px,2vw,24px)}
.wt-strip{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;background:var(--accent);color:#0b0d12;padding:18px clamp(20px,5vw,72px);margin:clamp(24px,4vw,48px) calc(-1 * clamp(20px,5vw,72px)) 0;font-family:var(--font-head);font-weight:800;text-transform:uppercase;font-size:clamp(1.2rem,2.6vw,1.8rem);letter-spacing:.04em}
.wt-strip .soc{color:#0b0d12}
.wt-arena .wt-login{position:absolute;right:16px;top:12px;color:var(--text)}

/* Team-Seite */
.theme-arena .tm-hero{position:relative;margin:0 0 24px;overflow:hidden;background:var(--panel)}
.theme-arena .tm-heroimg{display:block;width:100%;height:auto;aspect-ratio:16/9;max-height:620px;object-fit:cover;object-position:50% 25%}
.theme-arena .tm-herotx{padding:clamp(20px,4vw,44px)}
.theme-arena .tm-hero.has-photo .tm-herotx{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(0deg,rgba(11,13,18,.96) 12%,rgba(11,13,18,0))}
.theme-arena .tm-hero:not(.has-photo){background:none;margin-bottom:8px}
.theme-arena .tm-hero:not(.has-photo) .tm-herotx{padding:8px 0 0}
.theme-arena .tm-hero h1{margin:14px 0 0;font-size:clamp(3rem,13vw,8rem);line-height:.84;font-weight:800;letter-spacing:-.02em;text-transform:uppercase}
.theme-arena .tm-hero h1 .o{color:transparent;-webkit-text-stroke:3px var(--text)}
.theme-arena .tm-hero h1 .a{color:var(--accent)}
.theme-arena .tm-card{border:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%)}
.theme-arena .tm-card::after{border:0;background:var(--accent);opacity:0;transition:opacity .15s;clip-path:polygon(evenodd,0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 0,2px 2px,calc(100% - 2px) 2px,calc(100% - 2px) calc(100% - 18.83px),calc(100% - 18.83px) calc(100% - 2px),2px calc(100% - 2px),2px 2px,0 0)}
.theme-arena .tm-card:hover::after{opacity:1}
/* Karte etwas heller als die Seite, damit sie auch bei gleich eingestellten Farben sichtbar bleibt */
.theme-arena .tm-card{background:color-mix(in srgb,var(--text) 7%,var(--panel));transition:background-color .16s}
.theme-arena .tm-card:hover{background:color-mix(in srgb,var(--text) 11%,var(--panel))}
.theme-arena .tm-pic{background:color-mix(in srgb,var(--text) 13%,var(--panel))}
.theme-arena .tm-bd strong{color:var(--accent);font-size:1.6rem;text-transform:uppercase}
.theme-arena .tm-results{border:0;background:none;border-radius:0}
.theme-arena .tm-res{margin-bottom:8px;padding:12px 28px;background:var(--panel);border:0;border-left:4px solid var(--ok);clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%)}
.theme-arena .tm-res.loss{border-left-color:var(--err)}
.theme-arena .tm-res .tm-d{color:var(--accent);font-family:var(--font-head);font-weight:700;font-size:1.15rem}
.theme-arena .tm-res .tm-s{background:none;color:var(--text);font-family:var(--font-head);font-weight:800;font-size:1.6rem}
.theme-arena .tm-next{border:0;border-radius:0;background:var(--accent);color:#0b0d12;font-family:var(--font-head);font-weight:800;font-size:1.5rem;text-transform:uppercase}
.theme-arena .tm-strip{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-top:40px;padding:18px 28px;background:var(--accent);color:#0b0d12;font-family:var(--font-head);font-weight:800;font-size:1.6rem;text-transform:uppercase}
.theme-arena .tm-strip .btn{background:#0b0d12;color:#fff}

/* Spielerprofil */
.theme-arena .pf-hero { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: clamp(20px, 4vw, 48px); align-items: end; margin: 0 0 8px; }
.theme-arena .pf-hero .pf-pic { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 28px), calc(100% - 28px) 100%, 0 100%); }
.theme-arena .pf-name { margin: 14px 0; font-size: clamp(3rem, 10vw, 7.5rem); line-height: .84; font-weight: 800; letter-spacing: -.02em; text-transform: uppercase; color: transparent; -webkit-text-stroke: 3px var(--text); }
.theme-arena .pf-real { font-family: var(--font-head); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.theme-arena .pf-bio { color: var(--muted); }
@media (max-width: 640px) { .theme-arena .pf-hero { grid-template-columns: 1fr; } .theme-arena .pf-hero .pf-pic { max-width: 240px; } .theme-arena .pf-name { -webkit-text-stroke-width: 2px; } }
.theme-arena .pk-card{border:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%)}
.theme-arena .pk-sec h2{display:flex;align-items:center;gap:12px}
.theme-arena .pk-sec h2::before{content:"";display:block;width:34px;height:11px;background:var(--accent);transform:skewX(-28deg);flex:none}

/* Footer "Poster" (themes/arena/partials/footer.php) */
.theme-arena .ar-foot{margin-top:5rem;border-top:6px solid var(--accent);background:var(--panel);padding:34px 0 22px;color:var(--muted)}
.theme-arena .ar-foot .wrap{display:block}
.theme-arena .ar-foot-name{margin:0;font:800 clamp(2.8rem,11vw,7.5rem)/.88 var(--font-head);text-transform:uppercase;letter-spacing:-.02em;overflow-wrap:anywhere}
.theme-arena .ar-foot-name .o{color:transparent;-webkit-text-stroke:2px color-mix(in srgb,var(--text) 38%,transparent)}
.theme-arena .ar-foot-name .a{color:var(--accent)}
.theme-arena .ar-foot-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:24px 28px;margin-top:28px}
.theme-arena .ar-foot-col{display:flex;flex-direction:column;gap:8px;min-width:0}
.theme-arena .ar-foot-col h2{margin:0 0 6px;font-size:1.05rem;letter-spacing:.08em;color:var(--text)}
.theme-arena .ar-foot-col>a{font-family:var(--font-head);font-weight:600;font-size:1.1rem;letter-spacing:.03em;color:var(--muted);text-decoration:none}
.theme-arena .ar-foot-col>a:hover{color:var(--text)}
.theme-arena .ar-foot-col .social{display:flex;flex-wrap:wrap;gap:10px}
.theme-arena .ar-foot-col .social .soc{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;background:color-mix(in srgb,var(--text) 10%,var(--panel));color:var(--text);clip-path:polygon(0 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%)}
.theme-arena .ar-foot-col .social .soc:hover{background:var(--accent);color:var(--on-accent,#14110d)}
.theme-arena .ar-foot-base{display:flex;flex-wrap:wrap;gap:8px 22px;justify-content:space-between;align-items:center;margin-top:30px;padding-top:16px;border-top:1px solid color-mix(in srgb,var(--text) 14%,transparent);font-size:.9rem}
.theme-arena .ar-foot-base nav{display:flex;flex-wrap:wrap;gap:6px 18px}
.theme-arena .ar-foot-base a{color:var(--muted)}.theme-arena .ar-foot-base a:hover{color:var(--text)}
.theme-arena .who{display:flex;align-items:center;gap:6px}.theme-arena .who-soc{display:inline-flex;align-items:center;gap:2px}.theme-arena .who .soc{display:inline-flex;padding:7px;line-height:0}