/* 2.1: strong fantasy identity, short play path, readable decisions. */
.ux-21 .home-welcome{grid-template-columns:1.25fr .75fr;gap:24px;margin-bottom:22px}.ux-21 .home-welcome h1{font-size:clamp(34px,4.2vw,56px)}.ux-21 .home-welcome p{font-size:15px;line-height:1.7;max-width:640px}.ux-21 .home-welcome .world-map-teaser{min-height:165px}.ux-21 .version-note{margin-bottom:22px;padding:15px 20px}.ux-21 .selection-heading h2{font-size:30px}.ux-21 .selection-heading p{font-size:14px}.ux-21 .home-redesign .home-mode-options>button{min-height:128px}.ux-21 .home-redesign .home-mode-options>button strong{font-size:21px}.ux-21 .home-redesign .home-mode-options>button small{font-size:12px;line-height:1.6}.ux-21 .play-categories button{padding:16px}.ux-21 .selected-mode-explanation{padding:17px 20px;margin:15px 0 20px}.ux-21 #homeObjective,.ux-21 .arena-caption{display:none}.ux-21 #selectedModeHint{font-size:16px;color:#f0dbab}.ux-mode-brief{display:grid;grid-template-columns:.85fr .85fr 1.3fr;gap:16px;margin-top:17px}.ux-mode-brief small{font-size:10px;letter-spacing:.1em;color:#a1bcae;display:block;margin-bottom:6px}.ux-mode-brief strong{font-size:14px;line-height:1.5;font-weight:600;color:#dbe8d8}.ux-21 .selected-mode-explanation>.text-link{display:block;font-size:11px;margin-top:15px}
.ux-selected-hero{display:grid;grid-template-columns:70px minmax(190px,1fr) auto;column-gap:17px;align-items:center;padding:16px 20px;background:#102b2b;border:1px solid #abbe8d55;border-radius:12px}.ux-selected-hero>img{grid-row:span 2;width:70px;height:90px;object-fit:contain;filter:drop-shadow(0 4px 8px #0009)}.ux-selected-hero label{display:block;font-size:10px;letter-spacing:.07em;color:#baac7c;margin-bottom:7px}.ux-selected-hero select{font:700 20px Georgia,serif;width:100%;max-width:340px;padding:8px 10px;color:#f7e5bc;background:#213e37;border:1px solid #6d977e;border-radius:5px}.ux-selected-hero small{display:block;font-size:11px;color:#aac7b5;line-height:1.6;margin-top:6px}.ux-selected-hero>.text-link{grid-column:3;font-size:10px}.ux-selected-hero>.button{font-size:10px;padding:12px 17px}.ux-21 .home-launch{margin-top:17px;padding-top:0;border-top:0}.ux-21 .home-launch .home-kicker{font-size:9px}.ux-21 .home-launch .launch-card{padding:19px 18px}.ux-21 .home-launch .launch-card h3{font-size:25px;line-height:1.2}.ux-21 .home-launch .launch-card p{font-size:13px;line-height:1.65;min-height:64px}.ux-21 .home-launch .launch-card .button{width:100%;font-size:11px;padding:14px 12px;min-height:47px}.ux-21 .home-launch .launch-card small{font-size:10px;line-height:1.6}.ux-hero-catalog{margin-top:24px;border-top:1px solid #a0b88b44;padding-top:12px}.ux-hero-catalog>summary{font-size:15px;color:#dfdbb2;cursor:pointer;padding:10px}.ux-hero-catalog[open]>summary{margin-bottom:15px}.ux-hero-catalog .selection-heading{display:none}.ux-21 .home-redesign .home-destinations{margin-top:26px}.ux-21 .home-destination strong{font-size:24px}.ux-21 .home-destination>span>span,.ux-21 .home-destination p{font-size:13px;line-height:1.6}
.ux-21 .topbar>nav{justify-content:flex-start;gap:9px}.ux-21 .topbar .nav-link{font-size:12px;min-height:42px;padding:10px 15px}.ux-nav-menu{position:relative}.ux-nav-menu>summary{list-style:none;cursor:pointer;font-size:12px;font-weight:650;color:#c1d1bc;border:1px solid #8ba67a44;border-radius:7px;padding:12px 16px;background:#23403755}.ux-nav-menu>summary:after{content:'⌄';margin-left:14px;color:#e5c783}.ux-nav-menu[open]>summary,.ux-nav-menu.has-current>summary{color:#ffe5aa;border-color:#e1bc78aa;background:#594e2f66}.ux-nav-panel{position:absolute;z-index:40;top:calc(100% + 8px);left:0;width:288px;padding:8px;border:1px solid #a19b6f99;border-radius:10px;background:#112e2df8;box-shadow:0 16px 45px #001512b3}.ux-21 .ux-nav-panel .nav-link{display:flex;align-items:flex-start;flex-direction:column;gap:5px;width:100%;text-align:left;border-radius:6px;padding:12px}.ux-nav-panel small{font-size:11px;font-weight:400;color:#95b5a8;white-space:normal}.ux-nav-menu:last-child .ux-nav-panel{left:auto;right:0}.ux-nav-menu summary:focus-visible,.ux-hero-catalog summary:focus-visible{outline:2px solid #f3d18c;outline-offset:4px}.ux-connection{display:flex;align-items:center;justify-content:center;gap:20px;margin:14px auto;width:92%;padding:13px;background:#523e2ddd;color:#ffe0b7;border:1px solid #c68a65;border-radius:8px;font-size:13px}.ux-connection[hidden]{display:none}.ux-connection button{font-size:10px}
.ux-entry-hero{display:flex;align-items:center;gap:16px;margin:12px 0;padding:12px;background:#1c3b34;border:1px solid #b5bc7d44;border-radius:8px}.ux-entry-hero img{width:54px;height:67px;object-fit:contain}.ux-entry-hero strong{display:block;font-size:22px;color:#f5ddb0}.ux-entry-hero small{font-size:12px;color:#b1c6b3}.ux-entry-heroes{margin:10px 0 18px}.ux-entry-heroes summary{font-size:13px;color:#d4d7b2;cursor:pointer;padding:8px 0}.ux-21 #entryBuild{font-size:12px;line-height:1.5}.ux-inline-feedback:empty,.ux-entry-status:empty{display:none}.ux-inline-feedback.error{padding:12px 15px;background:#51352f;color:#ffccba;border:1px solid #c9806e;border-radius:7px;font-size:14px;line-height:1.6}.ux-entry-status{color:#c8dfbc;font-size:13px;text-align:center}.ux-21 #entrySubmit[aria-busy=true]{opacity:.7}.ux-21 input[aria-invalid=true]{border-color:#faad88}
.ux-lobby-next{display:grid;grid-template-columns:1fr 1fr;gap:8px 25px;padding:20px 24px;margin:0 0 22px;background:linear-gradient(110deg,#2b493c,#162f35);border:1px solid #9daa6b77;border-radius:11px}.ux-lobby-next>span{font-size:10px;letter-spacing:.1em;color:#e8c686}.ux-lobby-next>strong{grid-row:span 2;grid-column:2;font:25px/1.3 Georgia;color:#e8e8c8;align-self:center;text-align:right}.ux-lobby-next>p{font-size:14px;line-height:1.6;color:#c9d9bf;margin:0}.ux-lobby-next[data-ready=true]{border-color:#a7d88c;background:linear-gradient(110deg,#355b3c,#193f38)}.ux-code-actions{margin-top:12px}.ux-code-actions button{width:100%;font-size:10px}.ux-21 .slot-state{font-size:10px}.friend-context-actions{margin-top:12px}.friend-context-actions .button{font-size:11px}.friend-context-actions small{font-size:12px;color:#bed0b5}
.ux-guide{width:min(900px,calc(100vw - 28px));max-width:none;max-height:calc(100dvh - 28px);padding:0;background:#112c2e;color:#e0e9da;border:1px solid #ad9d6e;border-radius:15px;box-shadow:0 25px 90px #000a}.ux-guide::backdrop{background:#06191cce;backdrop-filter:blur(7px)}.ux-guide>header{position:relative;padding:28px 32px 20px;background:radial-gradient(ellipse at 20% 0,#3c5d49,transparent 75%);border-bottom:1px solid #8e9c6844}.ux-guide h2{font:34px/1.15 Georgia;margin:9px 0;color:#f3dda9}.ux-guide>header p{font-size:14px;color:#b5c9b6}.ux-guide .close-dialog{top:18px;right:20px;color:#edd4a6}.ux-guide>nav{display:flex;gap:7px;padding:18px 28px;flex-wrap:wrap}.ux-guide-tab{border:1px solid #78936b55;background:#1f3c32;color:#cad9bb;font-size:12px;padding:10px 14px;border-radius:6px;cursor:pointer}.ux-guide-tab[aria-pressed=true]{border-color:#dfbd72;background:#544e30;color:#ffe2a4}.ux-guide-content{display:grid;grid-template-columns:1fr 1fr;gap:13px;padding:0 28px 28px}.ux-guide-card{border:1px solid #78967344;background:#1c3734;border-radius:9px;padding:20px}.ux-guide-card h3{font:22px/1.3 Georgia;color:#f0d9ac;margin:0 0 10px}.ux-guide-card p{font-size:14px;line-height:1.8;color:#c0d2bc;margin:8px 0}.ux-guide-card .button{font-size:10px;padding:12px}.ux-guide-live{padding:12px 28px;margin:0;background:#543b2e;color:#ffd0b1;font-size:13px}
.ux-practice-journey{position:absolute;z-index:8;top:145px;left:22px;width:255px;padding:18px;background:#112d2eeb;border:1px solid #9fb77788;border-radius:11px;pointer-events:auto}.ux-practice-journey>small{font-size:9px;letter-spacing:.09em;color:#e7c98f}.ux-practice-journey h3{font:21px/1.3 Georgia;color:#e5e6c2;margin:10px 0}.ux-practice-journey ol{list-style:none;padding:0;margin:0;display:grid;gap:13px}.ux-practice-journey li{display:flex;gap:10px;align-items:flex-start;color:#d8e3cf;font-size:13px;line-height:1.4}.ux-practice-journey li>b{background:#355245;flex:0 0 24px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:11px;color:#e1c990}.ux-practice-journey li.done>b{color:#122f28;background:#9bd0a1}.ux-practice-journey li.done>span{color:#96c6a0}.ux-practice-journey li small{display:block;color:#9ab5a6;font-size:11px;margin-top:5px;line-height:1.5}.ux-practice-journey>p{font-size:11px;line-height:1.6;color:#a6c1a6;margin-bottom:0}.ux-practice-journey .button{font-size:9px;line-height:1.5;padding:11px;margin-top:14px;width:100%}.ux-21[data-game-mode=training] .practice-tools{top:auto;bottom:155px;left:auto;right:20px;width:210px}.ux-21[data-game-mode=training] .target-card{top:145px}
.ux-housing-draft{margin:0 24px 12px;border:1px solid #d5b87966;background:#4d4930;color:#ffe3aa;padding:12px 15px;border-radius:8px;font-size:13px;display:flex;align-items:center;gap:15px}.ux-housing-guard{position:sticky;bottom:0;z-index:5;background:#203c34f8;border-top:2px solid #e3be7a;padding:20px 26px;box-shadow:0 -8px 30px #061e2588}.ux-housing-guard h3{font:23px Georgia;color:#f4db9f;margin:0 0 9px}.ux-housing-guard p{font-size:13px;line-height:1.6;color:#c1d1b8}.ux-housing-guard>div{display:flex;gap:9px;flex-wrap:wrap}.ux-housing-guard button{font-size:11px;padding:11px 15px}
@media(max-width:1000px){.ux-21 .topbar>nav{gap:6px}.ux-21 .topbar .nav-link,.ux-nav-menu>summary{font-size:11px;padding:10px}.ux-21 .home-welcome h1{font-size:39px}.ux-21 .home-launch{grid-template-columns:1fr}.ux-21 .home-launch .launch-card p{min-height:0}.ux-selected-hero{grid-template-columns:60px minmax(0,1fr) auto}.ux-selected-hero>img{width:60px}.ux-selected-hero select{font-size:18px}.ux-21 .version-note{gap:12px}.ux-mode-brief{grid-template-columns:1fr 1fr}.ux-mode-brief>div:last-child{grid-column:span 2}}
@media(max-width:700px){.ux-21 .topbar>nav{display:flex;flex-wrap:wrap;justify-content:center}.ux-nav-menu{position:static}.ux-nav-panel{position:absolute;left:0!important;right:0!important;top:100%;width:100%}.ux-21 .home-welcome{grid-template-columns:1fr}.ux-21 .home-welcome .world-map-teaser{display:none}.ux-selected-hero{grid-template-columns:50px 1fr;gap:10px;padding:14px}.ux-selected-hero>img{width:50px;height:80px}.ux-selected-hero>.button,.ux-selected-hero>.text-link{grid-column:span 2;width:100%}.ux-selected-hero>img{grid-row:1}.ux-selected-hero select{font-size:17px}.ux-selected-hero small{font-size:10px}.ux-guide>header{padding:23px 20px}.ux-guide h2{font-size:28px}.ux-guide>nav{padding:15px}.ux-guide-content{grid-template-columns:1fr;padding:0 15px 20px}.ux-guide-card{padding:17px}.ux-lobby-next{grid-template-columns:1fr;padding:17px}.ux-lobby-next>strong{grid-column:1;grid-row:2;text-align:left;font-size:22px}.ux-practice-journey{width:185px;left:10px;padding:12px;top:145px}.ux-practice-journey h3{font-size:17px}.ux-practice-journey li{font-size:11px}.ux-21[data-game-mode=training] .practice-tools{width:160px;right:10px;padding:11px}.ux-practice-journey>p{display:none}.ux-21 .play-categories strong{font-size:13px}}

body[data-auth-loading]::before{content:'FANTASYARENA · DEIN KONTO WIRD GELADEN …';position:fixed;inset:0;z-index:200;display:grid;place-items:center;background:#0c292e;color:#e9d3a1;font:600 13px system-ui;letter-spacing:.09em}body[data-auth-loading] #authGate{visibility:hidden}.auth-entrance-link{display:block;font-size:12px;color:#b9d3bf;margin:0 0 22px}.screen-auth .auth-world{background:linear-gradient(90deg,#0b2d30c9,#0b2d3055),url('/assets/entrance/weltenpark-gate-v1.png') 58% 50%/cover}.screen-auth .auth-characters{opacity:.9}.ux-21 .auth-panel{border-color:#b6ab7877}

.ux-housing-draft[hidden],.ux-practice-journey[hidden]{display:none!important}

.ux-21 .home-welcome{margin-bottom:15px;grid-template-columns:1.6fr .7fr;gap:25px}.ux-21 .home-welcome h1{font-size:36px;line-height:1.05;margin:12px 0}.ux-21 .home-welcome p{font-size:13px;line-height:1.6}.ux-21 .home-welcome .world-map-teaser{min-height:135px}.ux-21 .home-welcome .world-map-teaser strong{font-size:25px}.ux-21 .version-note{font-size:12px;padding:12px 17px;margin-bottom:18px}.ux-play-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(310px,1fr);gap:24px;align-items:start}.ux-play-main .play-categories{gap:7px;margin-bottom:16px}.ux-play-main .play-categories button{grid-template-columns:1fr;padding:15px 12px;text-align:center}.ux-play-main .play-categories button>span{font-size:22px;grid-row:auto}.ux-play-main .play-categories strong{font-size:15px}.ux-play-main .play-categories small{font-size:10px;line-height:1.5}.ux-21 .ux-play-main .home-mode-options{grid-template-columns:1fr 1fr}.ux-21[data-play-category=coop] .ux-play-main .home-mode-options,.ux-21[data-play-category=training] .ux-play-main .home-mode-options{grid-template-columns:1fr}.ux-21 .ux-play-main .home-mode-options>button{min-height:125px;padding:17px}.ux-21 .ux-play-main .home-mode-options>button strong{font-size:23px}.ux-21 .ux-play-main .home-mode-options>button small{font-size:12px}.ux-play-aside{position:sticky;top:18px}.ux-play-aside .ux-selected-hero{grid-template-columns:55px minmax(0,1fr);padding:13px;gap:8px 12px}.ux-play-aside .ux-selected-hero>img{grid-row:1;width:55px;height:76px}.ux-play-aside .ux-selected-hero select{font-size:18px;width:100%;padding:7px}.ux-play-aside .ux-selected-hero label{font-size:8px}.ux-play-aside .ux-selected-hero small{font-size:10px}.ux-play-aside .ux-selected-hero>.button{grid-column:span 2;font-size:10px;padding:9px}.ux-play-aside .ux-selected-hero>.text-link{grid-column:span 2;text-align:center}.ux-21 .ux-play-aside .home-launch{grid-template-columns:1fr;gap:10px;margin-top:12px}.ux-21 .ux-play-aside .home-launch .launch-card{padding:15px}.ux-21 .ux-play-aside .home-launch .launch-card h3{font-size:23px;margin:7px 0}.ux-21 .ux-play-aside .home-launch .launch-card p{font-size:12px;line-height:1.6;min-height:0;margin:8px 0 12px}.ux-21 .ux-play-aside .home-launch .launch-card .button{padding:12px 9px;font-size:10px}.ux-play-aside .launch-card .home-kicker{display:none}.ux-play-aside .launch-card>small{display:none}.ux-play-main .ux-mode-brief{grid-template-columns:1fr 1fr}.ux-play-main .ux-mode-brief>div:last-child{grid-column:span 2}.ux-21 .auth-requirements{font-size:11px;line-height:1.7;color:#abc6b6}
@media(max-width:900px){.ux-play-layout{grid-template-columns:1fr}.ux-play-aside{position:static}.ux-21 .home-welcome{grid-template-columns:1fr}.ux-21 .home-welcome .world-map-teaser{display:none}.ux-21 .ux-play-aside .home-launch{grid-template-columns:1fr}.ux-play-main .play-categories small{display:none}.ux-play-main .play-categories button>span{display:none}.ux-21 .home-welcome h1{font-size:32px}.ux-play-aside .ux-selected-hero{grid-template-columns:55px minmax(0,1fr)}}

.ux-21 .home-welcome{padding:0;margin-bottom:18px;align-items:center}.ux-21 .home-welcome h1{font-size:31px;margin:10px 0;line-height:1.15}.ux-21 .home-welcome .home-kicker{display:none}.ux-21 .home-welcome .world-map-teaser{min-height:120px;max-height:135px;padding:15px 18px}.ux-21 .home-welcome .world-map-teaser strong{font-size:22px}.ux-21 .home-welcome .world-map-teaser>span>span{display:none}.ux-21 .home-welcome .world-map-teaser b{font-size:9px}.ux-21 .version-note{margin-top:22px}.ux-21 .home.home-redesign{padding-top:22px}

.ux-hero-actions{grid-column:1/-1;display:flex;align-items:center;gap:10px}.ux-21 .ux-hero-actions>.button{flex:1;font-size:9px;padding:10px 8px;min-height:35px}.ux-hero-actions .text-link{font-size:9px;line-height:1.4;padding:7px 0;max-width:100px}.ux-play-aside .ux-selected-hero{padding-bottom:11px}

/* All nine entry portraits must stay in their own cell, independent of hero classes. */
.entry-champions .entry-pick{min-width:0;min-height:78px;gap:10px;padding:10px 12px;text-align:left;overflow:hidden}
.entry-champions .entry-pick>span{display:block;position:relative;flex:0 0 42px;width:42px;height:54px;overflow:hidden;font-size:0}
.entry-champions .entry-pick img,.entry-champions .entry-pick img.saphyra-portrait{display:block;position:static;width:42px;height:54px;object-fit:contain;object-position:50% 50%;transform:none;max-width:100%}
.entry-champions .entry-pick:disabled{opacity:.5}
