.game-navigation{display:flex;gap:8px;max-width:1120px;margin:16px auto 0;padding:0 18px}.game-navigation button{min-height:46px;min-width:110px}.game-navigation [aria-current=page]{background:var(--olive);color:#142017;font-weight:700}#champions-guide{max-width:1120px;margin:18px auto;padding:0 18px}.champion-guide{font-size:16px;line-height:1.6;padding-bottom:32px}.champion-guide h2{font-size:clamp(28px,4vw,42px);line-height:1.15;margin:10px 0}.champion-guide h3{font-size:20px;line-height:1.3;margin:8px 0}.champion-guide p{margin:10px 0;color:#c4d2d2}.guide-title{margin:24px 0 18px}.guide-roster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.guide-champion{text-align:left;padding:0;overflow:hidden;display:flex;flex-direction:column;background:linear-gradient(155deg,#263c46,#14232c)}.guide-portrait{height:245px;background:radial-gradient(ellipse at 50% 90%,#425348,transparent 70%);width:100%;overflow:hidden}.guide-portrait img{width:100%;height:100%;object-fit:contain;padding:12px}.guide-champion>span{padding:6px 18px}.guide-champion strong{display:block;font-size:24px}.guide-champion small{display:block;font-size:14px;color:#c4d2d2}.guide-open{color:var(--olive);font-size:14px}.guide-champion .guide-open{padding-bottom:16px}.guide-back{min-height:46px;background:transparent}.guide-hero{display:grid;grid-template-columns:260px minmax(0,1fr);gap:28px;align-items:center;margin:20px 0}.guide-hero .guide-portrait{height:320px}.guide-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:20px 0}.guide-stats>div{padding:10px;border:1px solid var(--line);border-radius:10px;background:#13232b;text-align:center}.guide-stats strong,.guide-stats span,.guide-stats small{display:block}.guide-stats strong{font-size:27px;color:var(--olive)}.guide-stats span{font-weight:700}.guide-stats small{font-size:12px;color:#c4d2d2}.guide-passive,.guide-rules,.guide-actions{padding:20px;background:var(--panel);border:1px solid var(--line);border-radius:12px;margin:16px 0}.guide-passive{border-left:4px solid var(--olive)}.guide-actions summary{cursor:pointer;font-weight:700;min-height:44px}.guide-actions article{padding:12px 0;border-top:1px solid var(--line)}.guide-skills{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.guide-skills button{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;text-align:left;padding:18px;min-height:115px}.guide-skills strong{display:block;font-size:18px}.guide-skills small{display:block;color:#c4d2d2;font-size:14px}.guide-skill-icon{font-size:27px}.guide-cost{display:inline-block;white-space:nowrap;padding:5px 9px;background:#344431;color:#dce7bc;border-radius:8px;font-weight:700}.guide-skills .guide-open{grid-column:2/4}.guide-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.guide-facts>div{padding:16px;background:var(--panel);border:1px solid var(--line);border-radius:10px}.guide-facts dt{color:#a4b9bc;font-size:14px}.guide-facts dd{margin:4px 0;font-weight:600}.guide-detail{max-width:1000px;margin:auto}.guide-rules p+p{border-top:1px solid var(--line);padding-top:12px}.guide-shots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.guide-shots figure{margin:0;background:#14232c;border:1px solid var(--line);border-radius:10px;overflow:hidden}.guide-shots img{display:block;width:100%;height:auto}.guide-shots figcaption{padding:12px;font-weight:700}.guide-example-caption{padding:12px;border-left:3px solid var(--olive)}.prep-skill{background:#0e1b23;padding:14px;border-radius:8px;gap:10px;align-items:center;display:grid!important;grid-template-columns:auto minmax(0,1fr) auto}.prep-skill span{min-width:0}.prep-skill strong,.prep-skill small{display:block}.prep-skill small{font-size:13px;color:#c4d2d2}.prep-skill button{grid-column:2/4;justify-self:start;background:transparent;font-size:14px}.guide-prep-link{margin:12px 0}body.browsing-champions #rotate{display:none}body.browsing-champions .app-display-tools{display:none}@media(max-width:700px){.guide-roster{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.guide-portrait{height:190px}.guide-champion>span{padding-left:12px;padding-right:12px}.guide-champion strong{font-size:21px}.guide-champion small{font-size:13px}.guide-hero{grid-template-columns:1fr;gap:0}.guide-hero .guide-portrait{height:240px}.guide-skills,.guide-shots{grid-template-columns:1fr}.guide-stats{gap:5px}.guide-stats>div{padding:8px 3px}.guide-facts{grid-template-columns:1fr}.guide-title{margin-top:18px}.champion-guide{font-size:16px}.guide-skills button{min-height:110px}.prep-skill{grid-template-columns:auto minmax(0,1fr)}.prep-skill .guide-cost{grid-column:2}.prep-skill button{grid-column:2}}@media(prefers-reduced-motion:no-preference){.guide-champion:hover img{transform:translateY(-3px);transition:transform .15s}}.champion-guide button:focus-visible,.game-navigation button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}

.skills .prep-skill label{display:block;background:none;padding:0;margin:0;min-height:0}.prep-skill label{cursor:pointer}
body.browsing-champions>header,body.browsing-champions>.game-navigation,body.browsing-champions>#social,body.browsing-champions>footer{display:none}body.browsing-champions{max-width:none;margin:0;padding:0}body.browsing-champions #champions-guide{max-width:1120px;margin:0 auto;padding:24px 18px}.guide-header{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid #bf994f;background:#071d30eb;padding:10px 16px;border-radius:10px}.guide-header h2{margin:0;color:#f0d08a;font-size:24px;letter-spacing:2px;text-transform:uppercase}.guide-header button{min-height:44px;border:1px solid #b79750;border-radius:7px;background:linear-gradient(130deg,#17485e,#081d31);color:#fff0d3;padding:10px 16px}.guide-header button:focus-visible{outline:3px solid #7be3ff;outline-offset:3px}@media(max-width:700px){body.browsing-champions #champions-guide{padding:14px 12px}.guide-header{padding:8px;gap:8px}.guide-header h2{font-size:20px}.guide-header button{padding:8px 10px}}

/* Keep navigation outside the reading area at every viewport size. */
.responsive-tabs{display:flex;gap:8px;margin:8px 0;flex-shrink:0}.responsive-tabs button{flex:1;min-height:40px;padding:7px 12px}.responsive-tabs [aria-pressed=true]{background:var(--olive);color:#142017;font-weight:700}
body.browsing-champions #champions-guide{height:100dvh;display:flex;flex-direction:column;padding:10px max(10px,env(safe-area-inset-right));overflow:hidden}.guide-header{flex-shrink:0}.champion-guide{min-height:0;overflow:auto;overscroll-behavior:contain;margin-top:8px;padding-bottom:12px}.champion-guide>.guide-back{display:none}.guide-title{margin:10px 0}.guide-roster{gap:10px}.guide-portrait{height:clamp(90px,23dvh,220px)}.guide-champion strong{font-size:20px}.guide-champion>span{padding:4px 12px}.guide-champion .guide-open{padding-bottom:8px}.guide-hero{grid-template-columns:minmax(100px,22%) minmax(0,1fr);gap:16px;margin:8px 0}.guide-hero .guide-portrait{height:clamp(120px,30dvh,260px)}.guide-stats{margin:8px 0}.guide-passive,.guide-rules,.guide-actions{padding:12px;margin:10px 0}.guide-skills button{min-height:80px;padding:10px;gap:8px}.guide-facts{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.guide-facts>div{padding:10px}.guide-shots img{max-height:45dvh;object-fit:contain}.guide-shots figcaption{padding:6px}.champion-guide .responsive-tabs{position:sticky;top:0;z-index:2;background:#10212b;padding:4px 0}
@media(max-height:500px) and (orientation:landscape){.champion-guide{font-size:14px;line-height:1.4}.guide-header{padding:4px 8px}.guide-header h2{font-size:19px}.guide-header button{min-height:36px;padding:6px 12px}.guide-title>h2{font-size:24px}.guide-title>p{margin:4px 0}.guide-roster{grid-template-columns:repeat(3,minmax(0,1fr))}.guide-portrait{height:76px}.guide-champion{display:grid;grid-template-columns:76px minmax(0,1fr);align-items:center}.guide-champion .guide-open{display:none}.guide-champion small{font-size:11px}.guide-hero .guide-portrait{height:140px}.guide-stats strong{font-size:22px}.guide-stats small{font-size:10px}.guide-skills{grid-template-columns:repeat(3,minmax(0,1fr))}.guide-skills button{grid-template-columns:24px minmax(0,1fr) auto;min-height:85px}.guide-skills strong{font-size:14px}.guide-skills small,.guide-open{font-size:12px}.guide-cost{padding:4px 6px;font-size:13px}.guide-shots{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-facts dt{font-size:12px}.guide-detail>.guide-title{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.guide-detail>.guide-title .eyebrow{display:none}}
@media(max-width:550px){.guide-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-hero{grid-template-columns:90px minmax(0,1fr);gap:10px}.guide-hero h2{font-size:25px}.guide-stats small{display:none}.guide-stats strong{font-size:22px}.guide-hero .guide-portrait{height:150px}}

body.browsing-champions{background:linear-gradient(#041423d9,#041423ee),url('../assets/lobby-stadium-v1.webp') center/cover fixed}.guide-champion,.guide-skills button,.guide-stats>div,.guide-passive,.guide-rules,.guide-actions,.guide-facts>div,.guide-shots figure{background:linear-gradient(135deg,#143e50f2,#071e30f5);border-color:#a88c50;box-shadow:inset 0 1px #d6bc6a24,0 3px 12px #0003}.champion-guide h2,.champion-guide h3,.guide-champion strong,.guide-skills strong{color:#f2d995}.champion-guide .responsive-tabs{background:#081f30f5}.champion-guide .responsive-tabs button{background:linear-gradient(135deg,#17475c,#081e32);border-color:#a88c50;color:#f6ecd6}.champion-guide .responsive-tabs [aria-pressed=true]{background:linear-gradient(135deg,#23788a,#103d53);border-color:#edcc7c;color:#fff1ce}.guide-open,.champion-guide .eyebrow,.guide-stats strong{color:#dfc17a}.guide-cost{background:#122f40;border:1px solid #a88c5070;color:#f3d58e}.guide-passive{border-left-color:#dfc17a}.guide-example-caption{border-left-color:#dfc17a}.guide-champion:hover,.guide-skills button:hover{border-color:#f5d58b}

/* More room for the artwork without enlarging the cards or covering text. */
.guide-champion .guide-portrait img{padding:2px}.guide-hero .guide-portrait img{padding:0}.guide-hero .guide-portrait{height:clamp(140px,34dvh,290px)}
@media(max-height:500px) and (orientation:landscape){.guide-champion{grid-template-columns:92px minmax(0,1fr)}.guide-champion .guide-portrait{height:84px}.guide-hero .guide-portrait{height:160px}.guide-champion>span{padding-left:8px;padding-right:8px}}
.mastery-editor{padding:16px;background:#092739;border:1px solid #a68f58;border-radius:12px}.mastery-budget,.mastery-stats{display:block;margin:12px 0;color:#f2d595}.mastery-rows{display:grid;gap:10px}.mastery-row{display:flex;align-items:center;gap:12px;background:#061d2d;padding:10px;border-radius:8px}.mastery-row>div{flex:1}.mastery-row small{display:block;line-height:1.4;color:#bfd2db}.mastery-row button{min-width:44px;min-height:44px}.mastery-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}.mastery-status{color:#f2d595;min-height:1.4em}.mastery-editor p{line-height:1.5}.mastery-practice-screen{padding:12px;max-width:820px;margin:auto}.mastery-practice-screen h2{color:#f2d595}