/* A smaller first screen and clear, consistent destinations. */
:root{--hub-bg:#0b0c15;--hub-panel:#171626;--hub-line:#39334b;--hub-text:#f8f4fc;--hub-soft:#c6bfd2;--hub-accent:#d7a3ff}
body{background:radial-gradient(circle at 75% -10%,#29183a,transparent 36%),var(--hub-bg);color:var(--hub-text)}
main{max-width:1700px;margin-inline:auto}
#dashboard .welcomeBar{margin-bottom:12px;border-radius:14px}
#dashboard .commandHero{min-height:265px;border-radius:18px;border-color:#775188;box-shadow:0 22px 52px #04030ba8;overflow:hidden}
#dashboard .commandHeroContent{max-width:720px;padding:30px clamp(22px,3.2vw,48px)}
#dashboard .commandHero h1{font-size:clamp(43px,5vw,70px);letter-spacing:.012em;max-width:630px}
#dashboard .commandHero p{font-size:clamp(15px,1.4vw,18px);line-height:1.55;max-width:540px;color:#eee1f1}
#dashboard .commandHero .heroActions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
#dashboard .commandHero .heroActions button{min-height:44px;border-radius:9px}
#dashboard .heroArtLabel{display:none}
.todayGuide{margin:16px 0 21px;padding:22px;border:1px solid #65517a;border-radius:17px;background:linear-gradient(125deg,#20162d,#141521 66%);box-shadow:inset 0 1px #ffffff15,0 16px 32px #0005}
.todayHeading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:16px}
.todayHeading span,.hubHeading span{color:#d6a8e9;font-size:11px;font-weight:800;letter-spacing:.15em}
.todayHeading h2,.hubHeading h2{margin:3px 0 4px;font:900 clamp(28px,3vw,38px)/1.05 'Barlow Condensed',Impact,sans-serif;letter-spacing:.02em;color:#fff}
.todayHeading p,.hubHeading p{margin:0;color:var(--hub-soft);font-size:14px;line-height:1.45}
.todayHeading>strong{flex:none;padding:8px 12px;border:1px solid #80629d;border-radius:999px;color:#f1d8ff;background:#422752;font-size:13px}
.todaySteps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.todayStep{display:flex;align-items:center;gap:13px;min-width:0;min-height:92px;padding:14px;border:1px solid #49405c;border-radius:12px;text-align:left;color:#f8f2fc;background:linear-gradient(135deg,#262036,#171723);transition:transform .2s,border-color .2s,background .2s}
.todayStep:hover,.todayStep:focus-visible{transform:translateY(-3px);border-color:#c077e8;background:#342246}
.todayStep.isDone{border-color:#537669;background:linear-gradient(135deg,#20362c,#151e22)}
.todayStepMark{display:grid;place-items:center;flex:none;width:42px;height:42px;border:1px solid #ae74ce;border-radius:12px;background:#5d2b73;color:#f6dfff;font:900 24px 'Barlow Condensed',sans-serif}
.todayStep.isDone .todayStepMark{border-color:#6ccdb0;color:#c6ffeb;background:#205040}
.todayStep>span:nth-child(2){display:flex;flex:1;flex-direction:column;min-width:0;gap:3px}
.todayStep strong{font:800 20px/1.1 'Barlow Condensed',sans-serif}.todayStep small{font-size:12px;line-height:1.3;color:#d5c9de}
.todayStep b{flex:none;font-size:12px;color:#f0c6ff;white-space:nowrap}.todayStep.isDone b{color:#baf8db}
.hubDeploy{margin:19px 0 18px}.hubHeading{margin-bottom:14px}
.hubDeploy .deployGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.hubDeploy .deployCard{min-width:0;min-height:162px;padding:18px;border:1px solid #544265;border-radius:15px;background:radial-gradient(circle at top left,#57307955,transparent 63%),linear-gradient(145deg,#1d192b,#11111d);box-shadow:inset 0 1px #ffffff15,0 10px 24px #0004;transition:transform .2s,border-color .2s,box-shadow .2s}
.hubDeploy .deployCard:hover,.hubDeploy .deployCard:focus-visible{transform:translateY(-4px);border-color:#ba82da;box-shadow:0 15px 30px #0009,0 0 25px #9c50d322}
.hubDeploy .deployCard .deployIcon{width:42px;height:42px}.hubDeploy .deployCard .deployIcon .kkicon{width:29px;height:29px}
.hubDeploy .deployCopy{display:flex;flex-direction:column;gap:5px}.hubDeploy .deployCopy small{font-size:11px;letter-spacing:.12em;color:#c394d9}.hubDeploy .deployCopy strong{font-size:clamp(20px,2vw,28px);line-height:1.05}.hubDeploy .deployCopy em{font-size:12px;color:#d3c6d8;line-height:1.4;font-style:normal}
.hubDeploy .deployArrow{font-size:20px}
.moreDashboard{margin:22px 0 30px;border-color:#59466c;border-radius:15px;background:#151321;box-shadow:0 14px 30px #0005}
.moreDashboard>summary{min-height:78px;align-content:center;padding:19px 22px}
.moreDashboard>summary:before{width:33px;height:33px;border-radius:10px;font-size:23px}
.moreDashboard>summary span{color:#d1c5d9;font-weight:400}
.moreDashboardContent{padding:0 18px 22px}.moreDashboardContent>*{margin:16px 0!important}
.moreDashboardContent>.stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
.moreDashboardContent>.clanDashboard{margin-block:16px!important}
#dashboard>.stats,#dashboard>.clanDashboard{display:none}
/* Compact desktop navigation and a menu that people can search. */
.top .nav button{display:none}
.top .nav button[data-page="dashboard"],.top .nav button[data-page="wars"],.top .nav button[data-page="challenges"],.top .nav button[data-page="loot"],.top .nav button[data-page="profile"]{display:flex;align-items:center;justify-content:center;flex-direction:column;min-width:92px}
.top .nav{justify-content:flex-end;gap:3px}
.top .nav button{border-radius:10px 10px 0 0}
.menuSearch{padding:0 6px 12px}.menuSearch label{display:block;padding:0 7px 7px;color:#e1c3ec;font-size:12px;font-weight:800}.menuSearch input{display:block;width:100%;height:40px;padding:0 11px;border:1px solid #6a527b;border-radius:9px;background:#191625;color:#fff;font:14px Inter,Arial,sans-serif}.menuSearch input::placeholder{color:#aaa0b9}.menuSearch input:focus-visible{outline:2px solid #d6a2f3;outline-offset:2px}.menuSearchEmpty{margin:8px;color:#dac7de;font-size:13px}
#sidemenu .sideGroup[hidden],#sidemenu .sidebtn[hidden],.pageGuide[hidden]{display:none!important}
#sidemenu .sideGroup{border-color:#ffffff1c}.sideGroup summary.sideheading{font-size:12px;letter-spacing:.08em;color:#d3b7de}
#sidemenu .sideGroupItems .sidebtn{border-radius:9px;color:#d1c8dc}
#sidemenu .sideGroupItems .sidebtn.active{color:#fff}
.pageGuide{display:flex;flex-wrap:wrap;align-items:center;gap:7px 10px;margin:3px 0 16px;padding:12px 16px;border:1px solid #51425f;border-radius:12px;background:#1a1826;font-size:13px}
.pageGuide>button{padding:5px 7px;border:0;background:transparent;color:#e2adfa;text-decoration:underline;text-underline-offset:3px;font-weight:800}
.pageGuide>strong{color:#fff}.pageGuide>span{color:#897796}.pageGuide>small{flex-basis:100%;margin-left:51px;color:#cfc4d5;font-size:12px}
@media(max-width:1250px){.todaySteps{grid-template-columns:1fr}.todayStep{min-height:66px}.hubDeploy .deployGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.moreDashboardContent>.stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.top .nav{display:none!important}.menuSearch{padding-top:10px}.hubDeploy .deployGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.moreDashboardContent>.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.pageGuide{margin-top:4px}.mobileDock{background:#13121ff5;border-top:1px solid #765388}.mobileDock button{min-width:0;color:#ded3e4}.mobileDock button.active{color:#f0baff}}
@media(max-width:620px){#dashboard .commandHero{min-height:0;background:linear-gradient(90deg,#090714ef,#10091bc7),url('/dashboard-art.png') 66% center/cover no-repeat}#dashboard .commandHeroContent{padding:27px 18px 30px}#dashboard .commandHero h1{font-size:clamp(42px,10vw,59px);line-height:1}#dashboard .commandHero p{font-size:14px}#dashboard .commandHero .heroActions{gap:9px}#dashboard .commandHero .heroActions button{min-height:43px;font-size:13px}.todayGuide{padding:17px 14px;margin-top:12px}.todayHeading{gap:8px}.todayHeading>strong{font-size:11px;padding:7px}.todayHeading h2{font-size:29px}.todayStep{padding:11px 12px}.todayStepMark{width:38px;height:38px}.todayStep small{font-size:11px}.hubDeploy .deployGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.hubDeploy .deployCard{min-height:150px;padding:13px}.hubDeploy .deployCopy strong{font-size:20px}.hubDeploy .deployCopy em{font-size:11px}.hubDeploy .deployArrow{font-size:15px}.moreDashboard>summary{min-height:68px;padding:14px;font-size:16px}.moreDashboard>summary span{width:100%;padding-left:42px;font-size:12px}.moreDashboardContent{padding:0 10px 14px}.moreDashboardContent>.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.pageGuide{padding:10px 12px;margin:0 0 12px}.pageGuide>small{margin-left:0}.mobileDock button{font-size:11px}}
@media(max-width:390px){.hubDeploy .deployGrid{grid-template-columns:1fr 1fr}.hubDeploy .deployCard{min-height:145px}.hubDeploy .deployCopy strong{font-size:18px}.todayStep b{font-size:11px}}
@media(prefers-reduced-motion:reduce){.todayStep,.hubDeploy .deployCard{transition:none}.todayStep:hover,.hubDeploy .deployCard:hover{transform:none}}
.loginSteps{margin:14px 0 17px;padding:16px 18px 16px 36px;border:1px solid #58426a;border-radius:12px;background:#1e182c;color:#e9ddec;line-height:1.7}.loginSteps li::marker{color:#d69cf1;font-weight:900}.loginHelp{margin:8px 0 15px;border:1px solid #574268;border-radius:9px;padding:9px 12px;color:#e4cafa;background:#211a2b}.loginHelp summary{cursor:pointer;font-weight:800}.loginHelp p{margin:8px 0 2px;font-size:13px;line-height:1.5;color:#e8deec}

.clanSwitcher{display:flex;gap:8px;margin:12px 0 16px;flex-wrap:wrap}.clanSwitcher button{flex:1;min-width:145px;max-width:260px;display:flex;flex-direction:column;gap:2px;align-items:flex-start;min-height:54px;padding:9px 14px;border:1px solid #66516f;border-radius:11px;background:#1c1829;color:#e8deeb;font:700 15px Inter,Arial,sans-serif;cursor:pointer}.clanSwitcher button small{font-size:12px;color:#c6accf}.clanSwitcher button.active{border-color:#d492f7;background:#392046;color:#fff;box-shadow:0 0 16px #b654db44}.clanSwitcher button:focus-visible{outline:2px solid #e1a4ff;outline-offset:2px}@media(max-width:500px){.clanSwitcher button{min-width:0;max-width:none}}
/* Neuigkeiten */
.top .nav button[data-page="news"]{display:flex;align-items:center;justify-content:center;flex-direction:column;min-width:108px}
[data-page="news"].hasNews{position:relative}
[data-page="news"].hasNews::after{content:"";position:absolute;right:8px;top:7px;width:9px;height:9px;border:2px solid #15101f;border-radius:50%;background:#f5c450;box-shadow:0 0 13px #ffca59}
#sidemenu [data-page="news"].hasNews::after{right:12px;top:50%;transform:translateY(-50%)}
.newsTeaser{margin:12px 0 20px}
.newsTeaserButton{display:flex;align-items:center;gap:15px;width:100%;padding:15px 18px;text-align:left;border:1px solid #8c568f;border-radius:14px;background:linear-gradient(105deg,#3b1e4f,#191428 72%);color:#fff;cursor:pointer;box-shadow:0 12px 25px #05030b60}
.newsTeaserButton:hover,.newsTeaserButton:focus-visible{border-color:#e2a4ff;background:linear-gradient(105deg,#522563,#231530)}
.newsTeaserIcon{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:12px;background:#7b349c;color:#fff}
.newsTeaserIcon svg{width:27px;height:27px}.newsTeaserButton>span:nth-child(2){display:grid;gap:3px;min-width:0}.newsTeaserButton small{font-size:11px;letter-spacing:.12em;color:#e8b6ff;font-weight:800}.newsTeaserButton strong{font:900 23px 'Barlow Condensed',Impact,sans-serif}.newsTeaserButton em{font-size:13px;font-style:normal;color:#ddd2e6;line-height:1.4}.newsTeaserButton>b{margin-left:auto;white-space:nowrap;color:#efc7ff;font-size:13px}
.newsHero{padding:25px 28px;border:1px solid #8c559c;border-radius:17px;background:radial-gradient(circle at 90% 0%,#5c25777a,transparent 45%),linear-gradient(135deg,#2a183e,#10101c)}.newsHero>span{font-size:12px;font-weight:900;color:#dca6f8;letter-spacing:.15em}.newsHero h1{margin:7px 0;font:900 clamp(40px,7vw,68px)/1 'Barlow Condensed',Impact,sans-serif;color:#fff}.newsHero p{margin:0;font-size:16px;color:#e1d8e8}.newsTimeline{display:grid;gap:12px;margin:18px 0 40px}.newsEntry{padding:20px 24px;border:1px solid #493b56;border-radius:14px;background:#191626}.newsEntry:first-child{border-color:#a362bf;background:linear-gradient(130deg,#281a39,#1b1729)}.newsEntryMeta{display:flex;gap:8px;flex-wrap:wrap;align-items:center;color:#d0c1d7;font-size:13px}.newsEntryMeta span,.newsEntryMeta b{padding:3px 7px;border-radius:5px;background:#50315e;color:#f0d2ff;font-size:11px;letter-spacing:.06em}.newsEntryMeta b{background:#665024;color:#ffe6a9}.newsEntry h2{margin:11px 0 6px;font:900 28px 'Barlow Condensed',Impact,sans-serif;color:#fff}.newsEntry p{margin:0 0 15px;line-height:1.6;font-size:15px;color:#e1d8e8}.newsEntry button{min-height:38px}
@media(max-width:900px){.top .nav button[data-page="news"]{display:none}.newsTeaserButton{align-items:flex-start;gap:11px}.newsTeaserButton>b{display:none}.newsTeaserButton strong{font-size:21px}.newsTeaserIcon{width:39px;height:39px}.newsTeaserButton em{font-size:12px}.newsHero{padding:20px}.newsEntry{padding:16px}}