/* WRM 2.0 Stage 3.230 — Full Story editorial guide.
   Canonical reusable pieces: core/game-icons.css (skill + tooltip),
   modules/lane-tabs.css, core/dropdowns.css, core/components.css (toolbar),
   core/layout.css (patch pill). Only page geometry and rating live here. */
.wrm2-guide-header{--canvas:var(--wrm2-canvas);--panel:var(--wrm2-panel);--panel-soft:var(--wrm2-canvas2);--line:var(--wrm2-line);--line-strong:var(--wrm2-line-strong);--ink:var(--wrm2-text);--muted:var(--wrm2-muted);--mint:var(--wrm2-mint);--font-display:var(--wrm2-display);--font-ui:var(--wrm2-font);--shadow:0 10px 32px #0009;min-width:0}
.champ-profile-hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;min-height:236px;overflow:hidden;border:1px solid var(--line-strong);background:var(--panel);margin-bottom:10px}
.champ-profile-art{position:absolute;inset:0;background-position:50% 23%;background-size:cover;filter:saturate(.82) brightness(.46)}
.champ-profile-shade{position:absolute;inset:0;background:linear-gradient(90deg,#070a0cf0 0%,#070a0c8c 43%,#070a0c00 72%,#070a0cbd 100%)}
.champ-profile-main{position:relative;z-index:2;display:flex;min-width:0;align-items:center;padding:20px 26px;gap:20px}
.champ-profile-copy{min-width:0}
.champ-profile-copy h1{margin:8px 0 7px;font:900 clamp(22px,3vw,38px)/1.15 var(--wrm2-display);letter-spacing:-.03em}
.champ-profile-copy h1>span:not(.wrm2-role-icons){color:var(--wrm2-mint)}
.champ-profile-copy p{margin:0;color:#c4ced1;font-size:13px}
.champ-profile-copy .champ-profile-title{font-size:13px;font-weight:900}
.champ-profile-copy .champ-profile-seo-summary{max-width:760px;margin-top:8px;color:var(--muted);font-size:12px;line-height:1.65}.champ-profile-seo-summary strong{color:var(--wrm2-text)}.champ-profile-seo-summary a{color:var(--wrm2-mint)}
/* Original GGLYTICS kicker typography for the lane; shared nav pill only for patch. */
.champ-profile-kicker{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 5px;color:var(--wrm2-mint);font:900 13px/1.4 var(--wrm2-font);letter-spacing:.17em;text-transform:uppercase}
.champ-profile-kicker .wrm2-nav-pill{display:inline-flex;align-items:center;min-height:21px;padding:3px 7px;font:900 9px/1.2 var(--wrm2-font);letter-spacing:.07em;background:#0b1c17}
.champ-profile-portrait-wrap{display:flex;flex:0 0 142px;width:142px;min-width:0;flex-direction:column;gap:5px}
.champ-profile-portrait{position:relative;width:100%;aspect-ratio:1;flex:none;border:1px solid var(--wrm2-mint);background:var(--canvas);box-shadow:var(--shadow);overflow:hidden;box-sizing:border-box}
.champ-profile-portrait>.champ-profile-avatar{display:block;width:100%;height:100%;object-fit:cover}
/* Preview extends the existing portrait and Coming Soon badge; no separate hero skin. */
.champ-profile-hero--upcoming .champ-profile-avatar{filter:grayscale(1)}
.champ-profile-portrait-actions{position:absolute;inset:0;pointer-events:none}
.wrm2-guide-portrait-buttons{display:flex;align-items:flex-end;gap:5px;padding:5px;width:100%;box-sizing:border-box;flex-direction:column}
.wrm2-guide-portrait-buttons a{display:inline-grid;place-items:center;flex:none;min-width:24px;height:24px;padding:3px;background:#070a0ddc;border:1px solid #ffffff35;box-sizing:border-box;pointer-events:auto;cursor:pointer}
.wrm2-guide-portrait-buttons a:hover,.wrm2-guide-portrait-buttons a:focus-visible{border-color:var(--wrm2-mint);outline:1px solid var(--wrm2-mint)}
.wrm2-guide-portrait-action,.wrm2-guide-portrait-action img{display:block;width:17px;height:17px}
.wrm2-guide-portrait-action--edit{color:var(--wrm2-mint)}
/* Guide-only DLE rating: compact, fixed rows inside portrait width.
   Icons and count / bar / percentages and views never intersect. */
.wrm2-guide-native{display:none;flex-wrap:wrap;align-items:center;gap:12px;margin:8px 0}
.champ-profile-social{min-width:0}
.champ-profile-social .frate2.frate-site{position:relative;width:100%;height:56px;margin:0;color:var(--wrm2-text);font:800 10px/1.2 var(--wrm2-font);font-variant-numeric:tabular-nums}
.champ-profile-social .frate2 .hidden{display:none}
.champ-profile-social .frate2 .frate-users{position:absolute;left:24px;right:24px;top:0;height:21px;display:flex;justify-content:center;align-items:center;gap:4px;text-align:center;white-space:nowrap;color:var(--wrm2-text);font-size:10px}
.champ-profile-social .frate2 .frate-users img{display:block;flex:none;opacity:.85}
.champ-profile-social .frate2 .frate-up,.champ-profile-social .frate2 .frate-down{position:absolute;top:0;display:grid;place-items:center;width:24px;height:21px;padding:2px;border:0;background:transparent;cursor:pointer}
.champ-profile-social .frate2 .frate-up img,.champ-profile-social .frate2 .frate-down img{display:block;max-width:100%;height:17px;object-fit:contain}
.champ-profile-social .frate2 .frate-up{left:0}.champ-profile-social .frate2 .frate-down{right:0}
.champ-profile-social .frate2 .frate-up:hover{background:#1cfb8c25}.champ-profile-social .frate2 .frate-down:hover{background:color-mix(in srgb,var(--wrm2-red) 15%,transparent)}
.champ-profile-social .frate2 .frate-up:focus-visible,.champ-profile-social .frate2 .frate-down:focus-visible{outline:1px solid var(--wrm2-mint);outline-offset:-1px}
.champ-profile-social .frate2 .frate-bar2{position:absolute;left:0;right:0;top:25px;height:8px;overflow:hidden;background:var(--wrm2-red)}
.champ-profile-social .frate2 .frate-bar2:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to right,transparent 0 8px,var(--wrm2-canvas) 8px 9px)}
.champ-profile-social .frate2 .frate-fill{position:absolute;top:0;bottom:0;left:0;width:0;background:var(--wrm2-mint);transition:width .2s ease}
.champ-profile-social .frate2 .likes,.champ-profile-social .frate2 .dislikes{position:absolute;top:38px;line-height:14px;color:var(--wrm2-text);font-size:10px;white-space:nowrap}
.champ-profile-social .frate2 .likes{left:0}.champ-profile-social .frate2 .dislikes{right:0}
.wrm2-guide-views{display:flex;align-items:center;justify-content:center;gap:4px;width:100%;color:var(--wrm2-muted);font:800 10px/1.4 var(--wrm2-font);white-space:nowrap}
.wrm2-guide-views img{display:block;flex:none;width:13px;height:13px;opacity:.85}
.champ-profile-social .frate2 [data-wrm2-guide-views-slot]{position:absolute;left:24px;right:24px;top:37px;min-width:0}
.champ-ability-strip{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:15px;justify-content:flex-start}
.champ-ability-strip .wrm2-cb-skill{flex:0 0 42px;width:42px;height:42px;max-width:none}
.champ-profile-stats{position:relative;z-index:2;display:grid;grid-template-columns:repeat(2,112px);align-content:center;align-self:stretch;border-left:1px solid rgb(255 255 255/.08);background:rgb(7 10 12/.55);padding:20px}
.champ-metric{display:grid;align-content:end;min-height:72px;padding:10px 12px;border:0;border-bottom:1px solid var(--line);border-right:1px solid var(--line);gap:5px;justify-content:center;text-align:center;position:relative;min-width:0;background:transparent;color:var(--wrm2-text);font:inherit;cursor:pointer;transition:background-color .16s,border-color .16s}
.champ-metric:nth-child(2n){border-right:0}.champ-metric:nth-last-child(-n+2){border-bottom:0}
.champ-metric b{font:900 18px var(--font-display)}
.champ-metric small{color:var(--muted);font:900 9px var(--font-ui);letter-spacing:.07em;text-transform:uppercase;text-align:center}
.champ-metric.tier b{color:var(--mint);display:flex;align-items:center;min-height:35px}.champ-metric.tier img{display:block;width:35px;height:35px;object-fit:contain}
/* Full Story uses the shared tooltip surface; only positioning, mini-graph and
   the metrics grid's interactive state are page-owned. No second tooltip skin. */
.champ-metric:hover,.champ-metric:focus-visible,.champ-metric[aria-expanded="true"]{background:rgb(28 251 140 / .085);box-shadow:inset 0 0 0 1px rgb(28 251 140 / .24);outline:0}
.champ-metric small{display:flex;align-items:center;justify-content:center;gap:4px;white-space:nowrap}
.champ-metric-direction{display:inline-flex;align-items:center;font:900 10px/1 var(--wrm2-font);min-width:0}
.champ-metric-direction.is-up{color:var(--wrm2-mint)}
.champ-metric-direction.is-down{color:var(--wrm2-red)}
.champ-metric-direction.is-stable{color:var(--wrm2-muted)}
/* Pinned interactive metric dialog, not a pointer-blocking hover tooltip. */
.wrm2-guide-metric-tooltip{position:fixed;z-index:10020;width:min(430px,calc(100vw - 20px));max-height:min(620px,calc(100dvh - 20px));overflow:auto;overscroll-behavior:contain;box-sizing:border-box;pointer-events:auto;padding:15px;border-color:var(--wrm2-line);background:linear-gradient(145deg,#111b1ef7,#090e11fa 78%);box-shadow:0 12px 34px #000a;scrollbar-width:thin;scrollbar-color:var(--wrm2-mint) var(--wrm2-panel2)}
.wrm2-guide-metric-tooltip[hidden]{display:none}
.wrm2-guide-metric-tooltip__head{display:flex;align-items:center;gap:10px;margin-bottom:8px;min-height:28px}
.wrm2-guide-metric-tooltip__head strong{font:900 14px/1.15 var(--wrm2-display);color:var(--wrm2-text)}
.wrm2-guide-metric-tooltip__head img{width:28px;height:28px;object-fit:contain}
.wrm2-guide-metric-tooltip__close,.champ-rune-switch-tips-close{margin-left:auto;display:grid;place-items:center;flex:none;width:26px;height:26px;padding:0;border:1px solid var(--wrm2-line-strong);background:var(--wrm2-canvas2);color:var(--wrm2-text);font:900 17px/1 var(--wrm2-font);cursor:pointer}
.wrm2-guide-metric-tooltip__close:hover,.wrm2-guide-metric-tooltip__close:focus-visible,.champ-rune-switch-tips-close:hover,.champ-rune-switch-tips-close:focus-visible{color:var(--wrm2-mint);border-color:var(--wrm2-mint)}
.wrm2-guide-metric-tooltip__delta{font:900 11px/1.2 var(--wrm2-font)}
.wrm2-guide-metric-tooltip__delta.is-up{color:var(--wrm2-mint)}
.wrm2-guide-metric-tooltip__delta.is-down{color:var(--wrm2-red)}
.wrm2-guide-metric-tooltip__delta.is-stable{color:var(--wrm2-muted)}
.wrm2-guide-metric-tooltip__caption{margin:0 0 8px;color:var(--wrm2-muted);font:800 10px/1.4 var(--wrm2-font)}
.wrm2-guide-metric-tooltip__graph{position:relative;min-width:0;padding-bottom:36px}
.wrm2-guide-metric-tooltip__chart{display:block;width:100%;height:auto;aspect-ratio:360/204;min-height:165px;touch-action:pan-y;cursor:crosshair;outline:0}
.wrm2-guide-metric-tooltip__chart:focus-visible{outline:0}
.wrm2-guide-metric-tooltip__chart:focus-visible .guide-chart-cursor{stroke:var(--wrm2-mint);opacity:1}
.wrm2-guide-metric-tooltip__chart .guide-chart-grid{stroke:var(--wrm2-line);stroke-width:.7;stroke-dasharray:2 5}
.wrm2-guide-metric-tooltip__chart .guide-chart-line{fill:none;stroke:var(--guide-metric-color,var(--wrm2-mint));stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.wrm2-guide-metric-tooltip__chart .guide-chart-line.is-tier{stroke:#39d9ff;stroke-width:1.45}
.wrm2-guide-metric-tooltip__chart .guide-chart-dot{fill:var(--guide-metric-color,var(--wrm2-mint));stroke:var(--wrm2-canvas);stroke-width:1}
.wrm2-guide-metric-tooltip__chart .guide-chart-tier-icon{cursor:crosshair;opacity:1}
.wrm2-guide-metric-tooltip__chart .guide-chart-cursor{stroke:var(--wrm2-muted);stroke-width:1;stroke-dasharray:3 5;opacity:.8;pointer-events:none}
.wrm2-guide-metric-tooltip__chart .guide-chart-selected{fill:var(--guide-metric-color,var(--wrm2-mint));stroke:var(--wrm2-canvas);stroke-width:1.5;pointer-events:none}
.wrm2-guide-metric-tooltip__chart .guide-chart-tick{fill:var(--wrm2-muted);font:800 10px var(--wrm2-font)}
.wrm2-guide-metric-tooltip__readout[hidden]{display:none}
.wrm2-guide-metric-tooltip__readout{position:absolute;z-index:2;top:0;left:50%;transform:translateX(-50%);width:max-content;max-width:215px;min-width:142px}
.wrm2-guide-metric-tooltip__point-name{min-width:0;white-space:nowrap;font-size:11px}
.wrm2-guide-metric-tooltip__point-value{margin-left:auto;color:var(--guide-metric-color,var(--wrm2-mint));font-weight:900}
.wrm2-guide-metric-tooltip__foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:9px;color:var(--wrm2-muted);font:800 10px/1.4 var(--wrm2-font)}

.wrm2-guide-metric-tooltip__note{margin:8px 0 0;color:var(--wrm2-muted);font:800 10px/1.5 var(--wrm2-font)}
.wrm2-guide-metric-tooltip__badges{display:grid;gap:12px;margin:12px 0 0}
.wrm2-guide-metric-tooltip__badge-head{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.wrm2-guide-metric-tooltip__badge-group{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.wrm2-guide-metric-tooltip__badge-label{display:inline-flex;align-items:center;gap:7px}
.wrm2-guide-metric-tooltip__badge-title{color:var(--wrm2-muted);font:900 11px var(--wrm2-font)}
.wrm2-guide-metric-tooltip__badge-help-wrap{display:inline-flex;position:relative;flex:none}
.wrm2-guide-metric-tooltip__badge-help{display:inline-grid;place-items:center;width:17px;height:17px;padding:0;border:1px solid var(--wrm2-line-strong);border-radius:50%;background:var(--wrm2-canvas2);color:var(--wrm2-muted);font:900 10px var(--wrm2-font);cursor:help}
.wrm2-guide-metric-tooltip__badge-help:is(:hover,:focus-visible,[aria-expanded="true"]){color:var(--wrm2-mint);border-color:var(--wrm2-mint);outline:0}
.wrm2-guide-metric-tooltip__badge-help-popover{display:none;position:absolute;top:calc(100% + 7px);left:0;z-index:5;width:min(204px,calc(100vw - 95px));padding:8px 10px;background:#0b1418;box-shadow:0 8px 20px #000b;pointer-events:none;white-space:normal;font:500 10px/1.55 var(--wrm2-font)}
.wrm2-guide-metric-tooltip__badge-group:last-child .wrm2-guide-metric-tooltip__badge-help-popover{top:auto;bottom:calc(100% + 7px)}
.wrm2-guide-metric-tooltip__badge-help:is(:hover,:focus-visible,[aria-expanded="true"]) + .wrm2-guide-metric-tooltip__badge-help-popover{display:block}
@media(max-width:480px){.wrm2-guide-metric-tooltip{padding:11px}.wrm2-guide-metric-tooltip__readout{min-width:130px}.wrm2-guide-metric-tooltip__chart{min-height:150px}}

.champ-scope-bar.wrm2-meta-toolbar{display:flex;justify-content:space-between;gap:8px;margin-bottom:10px;padding:7px;min-width:0}
.champ-scope-bar .wrm2-meta-lanes{flex:none}
/* Unlike generic Meta controls: enabled lanes are mint, only the selected
   lane gets the underline, and unavailable lanes are clearly neutral gray. */
.champ-scope-bar .wrm2-meta-lanes button:not(:disabled) img{opacity:1}
.champ-scope-bar .wrm2-meta-lanes button:not(:disabled):not(.is-active){background:var(--wrm2-canvas2);border-bottom-color:transparent}
.champ-scope-bar .wrm2-meta-lanes button:not(:disabled):not(.is-active):hover{background:#0a2419}
.champ-scope-bar .wrm2-meta-lanes button:disabled{cursor:not-allowed;background:var(--wrm2-canvas2);border-bottom-color:transparent;color:var(--wrm2-muted)}
.champ-scope-bar .wrm2-meta-lanes button:disabled img{filter:brightness(0) invert(55%);opacity:1}

.champ-scope-bar .wrm2-meta-select{flex:0 0 155px;min-width:140px}
.champ-scope-meta{display:flex;flex:1;min-width:0;justify-content:flex-end;align-items:center;gap:12px}
.champ-scope-meta .wrm2-nav-pill{display:inline-flex;align-items:center;box-sizing:border-box;white-space:nowrap;font-weight:900;min-height:21px;padding:3px 7px}
.champ-scope-meta .wrm2-meta-snapshot-status{flex:0 1 auto;margin-left:0;white-space:normal;text-align:right;color:var(--wrm2-muted);font-size:12px}
/* GGLYTICS champion tab bar. The shared tab-scroll component handles mobile overflow. */
.wrm2-guide-section-controls{margin:0px 0 10px}
.tab-bar{display:flex;overflow-x:auto;overflow-y:hidden;min-width:0;border:1px solid var(--wrm2-line);background:var(--wrm2-panel);margin-bottom:0;scrollbar-width:thin}
.tab-bar button{flex:0 0 auto;height:40px;padding:0 16px;border:0;border-right:1px solid var(--wrm2-line);background:transparent;color:var(--wrm2-muted);cursor:pointer;font:900 11px/1.2 var(--wrm2-font);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.tab-bar button.active{background:rgb(28 251 140 / .055);box-shadow:inset 0 -2px var(--wrm2-mint);color:var(--wrm2-mint)}
.tab-bar button:focus-visible{outline:2px solid var(--wrm2-mint);outline-offset:-3px}
.tab-bar button:disabled{color:var(--wrm2-subtle);opacity:.45;cursor:not-allowed}
.wrm2-editorial-guide .wrm2-guide-panel{display:flex;flex-direction:column;gap:10px;min-height:160px;min-width:0}
.wrm2-editorial-guide .wrm2-guide-panel[hidden]{display:none}
.wrm2-guide-seo{margin:12px 0}
.wrm2-guide-seo p{margin:0}
@media(max-width:1180px){
 .champ-profile-hero{grid-template-columns:1fr}
 .champ-profile-stats{grid-template-columns:repeat(6,minmax(0,1fr));border-left:0;border-top:1px solid var(--line);padding:0}
 .champ-metric,.champ-metric:nth-child(2n),.champ-metric:nth-last-child(-n+2){min-height:64px;border-right:1px solid var(--line);border-bottom:0}
 .champ-metric:last-child{border-right:0}
 .champ-scope-bar.wrm2-meta-toolbar{flex-wrap:wrap}
 .champ-scope-meta{justify-content:flex-end}
}
@media(max-width:760px){
 .champ-profile-main{align-items:flex-start;padding:16px}
 .champ-profile-copy h1{font-size:24px}
 .champ-profile-copy p{font-size:11px}
 .champ-profile-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
 .champ-metric:nth-child(3){border-right:0}
 .champ-metric:nth-child(-n+3){border-bottom:1px solid var(--line)}
 .champ-scope-bar .wrm2-meta-lanes{flex:1 1 100%;width:100%}
 .champ-scope-bar .wrm2-meta-select{flex:0 0 150px}
 .champ-scope-meta{flex:1 1 220px}
}
@media(max-width:480px){
 .champ-profile-main{gap:12px;padding:12px}
 .champ-profile-portrait-wrap{width:100px;flex-basis:100px}
 .champ-profile-copy h1{font-size:21px;line-height:1.07}
 .champ-profile-kicker{font-size:11px;gap:5px}
 .champ-profile-social .frate2 .likes,.champ-profile-social .frate2 .dislikes{font-size:9px}
 .champ-profile-social .frate2 .wrm2-guide-views{font-size:9px;gap:2px}
 .champ-profile-social .frate2 .wrm2-guide-views img{width:11px;height:11px}
 .champ-profile-copy .champ-profile-seo-summary{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
 .champ-ability-strip{gap:5px;margin-top:10px}
 .champ-ability-strip .wrm2-cb-skill{width:34px;height:34px;flex-basis:34px}
 .champ-metric{min-width:0;padding:8px}
 .champ-metric b{font-size:16px}
 .champ-metric small{font-size:8px}
 .champ-scope-bar .wrm2-meta-select{flex:1 1 100%;max-width:none}
 .champ-scope-meta{flex:1 1 100%;justify-content:space-between;gap:7px}
 .champ-scope-meta .wrm2-meta-snapshot-status{font-size:9px}
}

/* Full Story champion video: NEW's gradient/preview concept in WRM 2.0 skin. */
.wrm2-guide-video{overflow:hidden;margin:10px 0 0;border:1px solid var(--wrm2-line-strong);background:var(--wrm2-panel)}
.wrm2-guide-video__hero{position:relative;display:grid;place-items:center;min-height:320px;padding:35px 24px;isolation:isolate;background:var(--wrm2-canvas2);text-align:center}
.wrm2-guide-video__hero::before{position:absolute;z-index:-1;inset:0;content:"";background:linear-gradient(180deg,rgb(7 12 16/.64) 0%,rgb(9 18 21/.85) 58%,var(--wrm2-panel) 100%),linear-gradient(115deg,rgb(28 251 140/.12),transparent 65%)}
.wrm2-guide-video__poster{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.9)}
.wrm2-guide-video__content{display:grid;justify-items:center;gap:12px;min-width:0;max-width:850px}
.wrm2-guide-video__content h2{margin:0;color:var(--wrm2-text);font:900 clamp(22px,3vw,38px)/1.15 var(--wrm2-display);text-transform:uppercase}
.wrm2-guide-video__play{display:grid;place-items:center;width:76px;height:56px;margin:0 0 10px;border:1px solid var(--wrm2-mint);background:rgb(5 20 13/.82);color:var(--wrm2-mint)!important;font-size:25px!important;box-shadow:0 0 0 10px rgb(28 251 140/.09);transition:transform .16s,background .16s,color .16s}
.wrm2-guide-video__play:hover,.wrm2-guide-video__play:focus-visible{transform:scale(1.06);background:var(--wrm2-mint);color:var(--wrm2-canvas)!important;outline:2px solid var(--wrm2-mint);outline-offset:5px}
.wrm2-guide-video__watch{margin:0;font:900 11px/1.4 var(--wrm2-font);letter-spacing:.15em;color:var(--wrm2-mint)}
.wrm2-guide-video__text{padding:24px clamp(18px,4vw,42px);max-width:1100px;margin:auto}
.wrm2-guide-video__text>:first-child{margin-top:0}
.wrm2-guide-video__text>:last-child{margin-bottom:0}
@media(max-width:620px){.wrm2-guide-video__hero{min-height:270px;padding:25px 16px}.wrm2-guide-video__play{width:64px;height:44px}}

/* Champion guide inline ability/combo/rune tokens: shared WRM 2.0 palette. */
.wrm2-guide-token{color:var(--wrm2-guide-token-color)}
.wrm2-guide-token--skill{display:inline-flex;align-items:center;gap:4px;vertical-align:bottom;white-space:nowrap}
.wrm2-guide-token.wrm2-guide-token--skill>img{display:block;flex:none;width:24px;height:24px;max-width:none;object-fit:contain;vertical-align:middle;border:1px solid var(--wrm2-line)}
.wrm2-guide-token[data-wrm2-guide-token-tone="purple"],.wrm2-guide-token[data-wrm2-guide-token-tone="pink"]{--wrm2-guide-token-color:var(--wrm2-purple)}
.wrm2-guide-token[data-wrm2-guide-token-tone="yellow"],.wrm2-guide-token[data-wrm2-guide-token-tone="gold"],.wrm2-guide-token[data-wrm2-guide-token-tone="orange"]{--wrm2-guide-token-color:var(--wrm2-yellow)}
.wrm2-guide-token[data-wrm2-guide-token-tone="green"],.wrm2-guide-token[data-wrm2-guide-token-tone="aqua"]{--wrm2-guide-token-color:var(--wrm2-mint)}
.wrm2-guide-token[data-wrm2-guide-token-tone="cyan"],.wrm2-guide-token[data-wrm2-guide-token-tone="blue"]{--wrm2-guide-token-color:var(--wrm2-cyan)}
.wrm2-guide-token[data-wrm2-guide-token-tone="red"],.wrm2-guide-token[data-wrm2-guide-token-tone="coral"],.wrm2-guide-token[data-wrm2-guide-token-tone="scarlet"]{--wrm2-guide-token-color:var(--wrm2-red)}
.wrm2-guide-token[data-wrm2-guide-token-tone="cream"]{--wrm2-guide-token-color:var(--wrm2-text)}

/* Legacy editorial fields share the existing game-icon, button, panel and kicker system. */
.wrm2-legacy{display:grid;gap:10px;min-width:0}
.wrm2-legacy-switch{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.wrm2-legacy-switch[hidden],.wrm2-legacy-build[hidden],.wrm2-legacy-editorial[hidden],.wrm2-legacy [hidden]{display:none}
.wrm2-legacy-build{display:grid;gap:16px;min-width:0;container-type:inline-size}
.wrm2-legacy-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:10px;min-width:0}
.wrm2-legacy-card{min-width:0;padding:16px;border:1px solid var(--wrm2-line-strong);background:var(--wrm2-panel)}
/* Legacy rune track keeps the lane/tree copy and rail, but rune frames reuse core game-icons.css. */
:is(.wrm2-legacy-runes,.wrm2-legacy-key-items){min-width:0;align-self:start;padding:0;overflow:visible}
.wrm2-legacy-grid .champ-build-panel-head{display:flex;flex-direction:column;align-items:stretch;gap:9px;padding:16px;border-bottom:1px solid var(--wrm2-line-strong);font:900 clamp(18px, 1.8vw, 24px)/1.15 var(--wrm2-display);letter-spacing:.07em;color:var(--wrm2-text)}
.wrm2-legacy-grid .champ-build-panel-head>h3{min-width:0;margin:0;font:inherit;letter-spacing:inherit;overflow-wrap:break-word;text-transform:uppercase}
/* Inline rune explanation: one 4-line preview with an unboxed reveal control. */
.wrm2-legacy-grid .champ-rune-intro{display:grid;min-width:0;gap:4px}
.wrm2-legacy-grid .champ-rune-intro .wrm2-dna-description{position:relative;max-width:none;margin:0;color:var(--wrm2-muted);font:12px/1.45 var(--wrm2-font);letter-spacing:normal}
.wrm2-rune-intro-piece{--wrm2-game-tone:var(--wrm2-text)}
.wrm2-legacy-grid .wrm2-rune-intro-piece b{color:var(--wrm2-game-tone);font-weight:900}
.wrm2-legacy-grid .champ-rune-intro img.wrm2-game-emoji{width:17px;height:17px;border-radius:50%}
.wrm2-legacy-grid .champ-rune-intro.is-collapsible .wrm2-dna-description{overflow:hidden;transition:max-height .34s cubic-bezier(.2,.8,.2,1)}
.wrm2-legacy-grid .champ-rune-intro.is-collapsible:not(.is-expanded) .wrm2-dna-description{-webkit-mask-image:linear-gradient(#000 65%,transparent);mask-image:linear-gradient(#000 65%,transparent)}
.wrm2-legacy-grid .champ-rune-intro-toggle{display:inline-flex;align-items:center;justify-self:end;gap:6px;padding:3px 0;border:0;background:transparent;color:var(--wrm2-muted);font:900 10px/1.3 var(--wrm2-font);letter-spacing:.08em;cursor:pointer}
.wrm2-legacy-grid .champ-rune-intro-toggle:hover,.wrm2-legacy-grid .champ-rune-intro-toggle:focus-visible{color:var(--wrm2-mint)}
.wrm2-legacy-grid .champ-rune-intro-toggle:focus-visible{outline:2px solid var(--wrm2-mint);outline-offset:3px}
.wrm2-legacy-grid .champ-rune-intro-toggle svg{width:16px;height:16px;transition:transform .3s ease}
.wrm2-legacy-grid .champ-rune-intro.is-expanded .champ-rune-intro-toggle svg{transform:rotate(180deg)}
@media(prefers-reduced-motion:reduce){.wrm2-legacy-grid .champ-rune-intro.is-collapsible .wrm2-dna-description,.wrm2-legacy-grid .champ-rune-intro-toggle svg{transition:none}}

.wrm2-legacy-grid .champ-build-panel-body{padding:16px;min-width:0}
.wrm2-legacy-runes .champ-full-runes{display:grid;grid-template-columns:1fr;gap:10px;min-width:0}
.wrm2-legacy-runes .champ-rune-column{display:grid;align-content:start;gap:9px;min-width:0}
.wrm2-legacy-runes .champ-rune-game-tree{--tree-accent:var(--wrm2-game-orange);display:grid;gap:9px;min-width:0;padding-bottom:7px;border-bottom:1px solid var(--wrm2-line)}
.wrm2-legacy-runes .champ-rune-game-tree:last-child{border-bottom:0}
.wrm2-legacy-runes .champ-rune-game-tree.sorcery{--tree-accent:var(--wrm2-game-blue)}
.wrm2-legacy-runes .champ-rune-game-tree.resolve{--tree-accent:var(--wrm2-game-green)}
.wrm2-legacy-runes .champ-rune-game-tree.domination{--tree-accent:var(--wrm2-game-red)}
.wrm2-legacy-runes .champ-rune-game-head{position:relative;isolation:isolate;display:grid;grid-template-columns:90px minmax(0,1fr);align-items:center;justify-items:center;gap:10px;min-width:0}
.wrm2-legacy-runes .champ-rune-game-head-icon{display:grid;place-items:center;color:var(--tree-accent);justify-content:center;background:var(--wrm2-canvas2);width:45px;height:45px;border-radius:50%;border:3px solid var(--tree-accent)}
.wrm2-legacy-runes .champ-rune-game-head-icon::before{content:"";display:block;width:30px;height:30px;background:currentColor;-webkit-mask:var(--wrm2-rune-tree-mask) center/contain no-repeat;mask:var(--wrm2-rune-tree-mask) center/contain no-repeat}
.wrm2-legacy-runes .champ-rune-game-head-copy{display:grid;justify-self:stretch;gap:2px;min-width:0}
.wrm2-legacy-runes .champ-rune-game-head-copy small{color:color-mix(in srgb,var(--tree-accent) 72%,var(--wrm2-muted) 28%);font:900 11px var(--wrm2-font);letter-spacing:.11em;text-transform:uppercase}
.wrm2-legacy-runes .champ-rune-game-head-copy strong{color:var(--wrm2-text);font:900 15px var(--wrm2-font);letter-spacing:.02em;text-transform:uppercase}
.wrm2-legacy-runes .champ-rune-game-head-copy p{margin:0;color:var(--wrm2-muted);font-size:9px;line-height:1.42}
.wrm2-legacy-runes .champ-rune-game-track{display:grid;gap:7px}
.wrm2-legacy-runes .champ-rune-game-entry{position:relative;display:grid;grid-template-columns:90px minmax(0,1fr);align-items:center;min-width:0;gap:10px}
.wrm2-legacy-runes .champ-rune-game-entry.is-keystone{padding-bottom:7px;border-bottom:1px solid var(--wrm2-line)}
.wrm2-legacy-runes .champ-rune-game-rail{position:absolute;left:43px;top:-12px;bottom:-12px;width:5px;background:color-mix(in srgb,var(--tree-accent) 30%,transparent)}
.wrm2-legacy-runes .champ-rune-game-head .champ-rune-game-rail{top:22px;z-index:-1}
.wrm2-legacy-runes .champ-rune-game-entry:last-child .champ-rune-game-rail{bottom:42px}
.wrm2-legacy-runes .champ-rune-game-node.wrm2-game-icon--rune{--wrm2-game-size:var(--wrm2-rune-secondary-size);position:relative;z-index:var(--wrm2-rune-active-z,1);display:grid;width:calc(var(--wrm2-game-size) + var(--wrm2-rune-frame-padding));height:calc(var(--wrm2-game-size) + var(--wrm2-rune-frame-padding));place-items:center;justify-self:center;padding:0;border:0;background:transparent;cursor:pointer;overflow:visible}
.wrm2-legacy-runes .champ-rune-game-node.is-keystone{--wrm2-game-size:var(--wrm2-rune-keystone-size)}
.wrm2-legacy-runes .champ-rune-game-node .wrm2-game-icon__frame{box-sizing:content-box;width:var(--wrm2-game-size);height:var(--wrm2-game-size);flex-basis:var(--wrm2-game-size)}
.wrm2-legacy-runes .champ-rune-game-node:not(.is-keystone) .wrm2-game-icon__frame{box-sizing:border-box;height:auto;aspect-ratio:1;flex:0 0 auto}

.wrm2-legacy-runes .champ-rune-game-node:focus-visible{outline:2px solid var(--wrm2-mint);outline-offset:2px}
.wrm2-legacy-runes .champ-rune-game-copy{display:grid;align-content:center;min-width:0;gap:2px}
.wrm2-legacy-runes .champ-rune-game-copy strong{display:block;overflow:hidden;color:var(--wrm2-text);font:900 13px var(--wrm2-font);letter-spacing:.02em;text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase}
.wrm2-legacy-runes .champ-rune-game-copy small{display:block;color:var(--wrm2-game-tone,var(--tree-accent,var(--wrm2-muted)));font:900 12px/1.42 var(--wrm2-font)}
/* Rune replacements are a horizontal ribbon, portaled outside the guide grid.
   All animations are transforms: the actual rune tree never reflows. */
.wrm2-legacy-runes .champ-rune-game-entry:has([data-wrm2-rune-switch]) .champ-rune-game-copy{padding-right:36px}
.wrm2-legacy-runes .champ-rune-switch-toggle{position:absolute;z-index:2;right:0;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid var(--wrm2-line-strong);border-radius:50%;background:var(--wrm2-canvas2);color:var(--wrm2-muted);cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.wrm2-legacy-runes .champ-rune-switch-icon{display:block;width:13px;height:13px;background:currentColor;-webkit-mask:url(/templates/WRM-2/assets/ui/fa-exchange-alt.svg) center/contain no-repeat;mask:url(/templates/WRM-2/assets/ui/fa-exchange-alt.svg) center/contain no-repeat;transition:transform .33s cubic-bezier(.2,.8,.2,1)}
.wrm2-legacy-runes .champ-rune-switch-toggle:is(:hover,:focus-visible,[aria-expanded="true"]){border-color:var(--wrm2-muted);background:var(--wrm2-panel);color:var(--wrm2-text)}
.wrm2-legacy-runes .champ-rune-switch-toggle:is(:hover,:focus-visible,[aria-expanded="true"]) .champ-rune-switch-icon{transform:rotate(180deg)}
.wrm2-legacy-runes .champ-rune-switch-toggle:focus-visible{outline:2px solid var(--wrm2-muted);outline-offset:3px}
.champ-rune-switch-tray{position:fixed;z-index:10010;box-sizing:border-box;display:flex;align-items:center;width:max-content;min-height:60px;max-width:calc(100vw - 20px);padding:0 8px 0 70px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;border:1px solid var(--wrm2-line-strong);border-radius:36px;background:linear-gradient(145deg,#111b1ef7,#090e11fa 78%);box-shadow:0 10px 28px #000c;animation:wrm2-rune-slide .22s cubic-bezier(.2,.8,.2,1) both;scrollbar-width:thin;scrollbar-color:var(--wrm2-mint) var(--wrm2-panel2)}
.champ-rune-switch-tray[data-placement="below"]{padding:2px 9px;border-radius:20px;max-height:min(50dvh,320px);overflow:auto}
.champ-rune-switch-tray[hidden],.champ-rune-switch-tips[hidden]{display:none!important}
.champ-rune-switch-options{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;min-width:0}
.champ-rune-switch-tray[data-placement="below"] .champ-rune-switch-options{flex-wrap:wrap;justify-content:center}
.champ-rune-switch-option{flex:0 0 54px;display:grid;place-items:center;width:54px;height:54px;min-width:0;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer;transition:transform .16s ease,background .16s ease}
.champ-rune-switch-option:is(:hover,:focus-visible,[aria-pressed="true"]){transform:translateY(-2px)}
.champ-rune-switch-option:has(.champ-rune-switch-option-copy){flex:1 1 auto;grid-template-columns:54px minmax(0,1fr);gap:6px;width:100%;border-radius:28px;text-align:left}
.champ-rune-switch-option-copy{display:grid;justify-self:stretch;align-content:center;min-width:0;gap:2px}
.champ-rune-switch-option-copy strong{display:-webkit-box;overflow:hidden;color:var(--wrm2-text);font:900 11px/1.2 var(--wrm2-font);letter-spacing:.02em;text-transform:uppercase;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.champ-rune-switch-option-copy small{display:-webkit-box;overflow:hidden;color:var(--wrm2-muted);font:11px/1.3 var(--wrm2-font);-webkit-line-clamp:2;-webkit-box-orient:vertical}
.champ-rune-switch-option:focus-visible{outline:2px solid var(--wrm2-muted);outline-offset:2px}
.champ-rune-switch-option .wrm2-game-icon{pointer-events:none;--wrm2-game-size:46px;--wrm2-game-slot:54px;flex:0 0 54px;width:54px;display:grid;place-items:center}
.champ-rune-switch-option .wrm2-game-icon__frame{width:46px;height:46px;flex:0 0 46px}
.champ-rune-switch-tips{position:fixed;z-index:10011;box-sizing:border-box;width:min(440px,calc(100vw - 20px));max-height:min(58dvh,380px);padding:14px 16px;overflow:auto;border:1px solid var(--wrm2-line-strong);background:linear-gradient(145deg,#111b1ef7,#090e11fa 78%);color:var(--wrm2-muted);box-shadow:0 16px 44px #000d;scrollbar-width:thin;scrollbar-color:var(--wrm2-mint) var(--wrm2-panel2);animation:wrm2-rune-tips-reveal .2s ease-out both}
/* The three pinned guide panels share the site's branded scrollbar. */
:is(.wrm2-guide-metric-tooltip,.champ-rune-switch-tray,.champ-rune-switch-tips)::-webkit-scrollbar{width:7px;height:7px}
:is(.wrm2-guide-metric-tooltip,.champ-rune-switch-tray,.champ-rune-switch-tips)::-webkit-scrollbar-track{background:var(--wrm2-panel2)}
:is(.wrm2-guide-metric-tooltip,.champ-rune-switch-tray,.champ-rune-switch-tips)::-webkit-scrollbar-thumb{background:var(--wrm2-mint);border-radius:0}
:is(.wrm2-guide-metric-tooltip,.champ-rune-switch-tray,.champ-rune-switch-tips)::-webkit-scrollbar-thumb:hover{background:#75ffb7}
.champ-rune-switch-tips-header{display:flex;align-items:center;gap:9px;margin:0 30px 10px 0;color:var(--wrm2-rune-tip-tone,var(--wrm2-text));font:900 12px/1.3 var(--wrm2-font);text-transform:uppercase}
.champ-rune-switch-tips-header img{width:30px;height:30px;border:1px solid currentColor;border-radius:50%;object-fit:cover}
.champ-rune-switch-tips-close{position:absolute;right:11px;top:10px;margin-left:0}
.champ-rune-switch-tip-effect{display:block;margin-bottom:8px;color:var(--wrm2-text);font:900 11px/1.4 var(--wrm2-font)}
.champ-rune-switch-tip-body{display:block;font:12px/1.6 var(--wrm2-font);overflow-wrap:anywhere}
@keyframes wrm2-rune-slide{from{opacity:0;transform:translateX(-28px) scaleX(.75);transform-origin:left center}to{opacity:1;transform:translateX(0) scaleX(1);transform-origin:left center}}
@keyframes wrm2-rune-tips-reveal{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:620px){.wrm2-legacy-runes .champ-rune-game-entry:has([data-wrm2-rune-switch]) .champ-rune-game-copy{padding-right:34px}.wrm2-legacy-runes .champ-rune-switch-toggle{width:30px;height:30px}.champ-rune-switch-tray{padding:0 8px 0 70px}.champ-rune-switch-tray[data-placement="below"]{max-width:calc(100vw - 20px)}}
@media(prefers-reduced-motion:reduce){.champ-rune-switch-tray,.champ-rune-switch-tips{animation:none}.wrm2-legacy-runes .champ-rune-switch-icon,.champ-rune-switch-option{transition:none}}
.wrm2-legacy-runes .champ-rune-game-copy p{display:-webkit-box;margin:0;overflow:hidden;color:var(--wrm2-muted);font-size:12px;line-height:1.42;-webkit-line-clamp:3;-webkit-box-orient:vertical}
/* Build columns react to their actual space, including when a banner narrows the content. */
@container (max-width:1120px){.wrm2-legacy-grid{grid-template-columns:minmax(0,1fr)}}
.wrm2-legacy-card > h3{margin:0 0 12px;font:900 12px/1.3 var(--wrm2-font);letter-spacing:.06em;color:var(--wrm2-text)}
/* KEY ITEMS: layout only. Icon, frame, connector and badge geometry belongs
   exclusively to core/game-icons.css, as on the homepage. */
.wrm2-legacy-key-items .champ-build-panel-body{display:grid;gap:18px;min-width:0}
.wrm2-legacy-key-items .wrm2-legacy-item-steps{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:8px;width:100%;min-width:0;overflow:visible}
.wrm2-legacy-key-items .wrm2-legacy-item-stage{display:grid;align-content:start;gap:8px;flex:0 0 auto;min-width:0;max-width:100%;box-sizing:border-box;border:1px solid transparent;justify-items:safe center}
.wrm2-legacy-key-items .champ-build-panel-body > .wrm2-legacy-item-stage{width:100%;box-sizing:border-box;overflow:visible}
.wrm2-legacy-key-items .wrm2-legacy-item-stage h4{margin:0;color:var(--wrm2-text);font:900 12px/1.3 var(--wrm2-font);letter-spacing:.07em;text-align:center;text-transform:uppercase;white-space:nowrap}
/* Example Build item alternatives: same game-icon + native tooltip,
   separate swap control. The item list keeps NEW's wrapping layout. */
.wrm2-legacy-key-items .wrm2-legacy-item-slot{position:relative;display:inline-flex;flex:0 0 auto;min-width:0;justify-content:center;align-items:flex-start;align-self:stretch;padding-bottom:24px}
.wrm2-legacy-key-items .champ-rune-switch-toggle{position:absolute;z-index:2;left:50%;bottom:1px;transform:translateX(-50%);display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid var(--wrm2-line-strong);border-radius:50%;background:var(--wrm2-canvas2);color:var(--wrm2-muted);cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.wrm2-legacy-key-items .champ-rune-switch-icon{display:block;width:13px;height:13px;background:currentColor;-webkit-mask:url(/templates/WRM-2/assets/ui/fa-exchange-alt.svg) center/contain no-repeat;mask:url(/templates/WRM-2/assets/ui/fa-exchange-alt.svg) center/contain no-repeat;transition:transform .33s cubic-bezier(.2,.8,.2,1)}
.wrm2-legacy-key-items .champ-rune-switch-toggle:is(:hover,:focus-visible,[aria-expanded="true"]){border-color:var(--wrm2-muted);background:var(--wrm2-panel);color:var(--wrm2-text)}
.wrm2-legacy-key-items .champ-rune-switch-toggle:is(:hover,:focus-visible,[aria-expanded="true"]) .champ-rune-switch-icon{transform:rotate(180deg)}
.wrm2-legacy-key-items .champ-rune-switch-toggle:focus-visible{outline:2px solid var(--wrm2-muted);outline-offset:3px}

.wrm2-legacy-item-choices[hidden]{display:none}
.wrm2-legacy-item-choices{position:fixed;z-index:9980;box-sizing:border-box;width:min(550px,calc(100vw - 20px));max-width:calc(100vw - 20px);max-height:min(70vh,650px);padding:12px;border:1px solid var(--wrm2-line-strong);background:linear-gradient(145deg,#111b1ef7,#090e11fa 78%);box-shadow:0 16px 40px rgb(0 0 0 / 45%);color:var(--wrm2-text);overflow-y:auto;overscroll-behavior:contain}
.wrm2-legacy-item-choices-head{display:flex;align-items:center;justify-content:space-between;padding-right:36px;gap:14px;font:900 12px/1.4 var(--wrm2-font);letter-spacing:.08em}
.wrm2-legacy-item-choices>p{margin:5px 0 10px;color:var(--wrm2-muted);font:11px/1.4 var(--wrm2-font);letter-spacing:normal}
.wrm2-legacy-item-choices-layout{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr);gap:12px;min-width:0}
.wrm2-legacy-item-choices-grid{display:flex;flex-direction:column;align-items:stretch;gap:5px;min-width:0;max-height:min(52vh,440px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--wrm2-mint) var(--wrm2-panel2)}
.wrm2-legacy-item-option{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;gap:10px;padding:6px;border:1px solid var(--wrm2-line);background:var(--wrm2-panel2);color:var(--wrm2-text);font:12px/1.35 var(--wrm2-font);text-align:left;cursor:pointer}
.wrm2-legacy-item-option:is(:hover,:focus-visible,[aria-pressed="true"]){background:var(--wrm2-panel);outline-offset:2px;border:1px dashed var(--wrm2-mint)}
.wrm2-legacy-item-option .wrm2-game-icon{margin:0;flex:0 0 52px;width:52px;cursor:inherit}
.wrm2-legacy-item-option .wrm2-game-icon__frame{width:52px;height:52px;flex:0 0 52px}
.wrm2-legacy-item-option .wrm2-game-join{z-index:1;flex:0 0 30px;margin:0 -10px;align-self:center;width:30px;height:30px}
.wrm2-legacy-item-choices-tips{min-width:0;min-height:150px;padding:10px;border:1px solid var(--wrm2-line);background:linear-gradient(145deg,#111b1ef7,#090e11fa 78%);color:var(--wrm2-muted);font:12px/1.55 var(--wrm2-font);overflow-wrap:anywhere}
.wrm2-legacy-item-tip-heading{display:flex;align-items:center;gap:9px;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid var(--wrm2-line);color:var(--wrm2-text);font:900 12px/1.4 var(--wrm2-font)}
.wrm2-legacy-item-tip-heading img{width:30px;height:30px;object-fit:contain}
.wrm2-legacy-item-tip-text{display:block;min-width:0;overflow-wrap:anywhere}
.wrm2-legacy-item-tip-text img{max-width:100%;height:auto}
.wrm2-legacy-item-backdrop{position:fixed;z-index:9979;inset:0;background:rgb(0 0 0 / 60%)}
@media(max-width:620px){.wrm2-legacy-item-choices{position:fixed;left:0!important;right:0!important;top:auto!important;bottom:0!important;width:100%;max-width:100%;max-height:min(78dvh,680px);overflow-y:auto;padding:18px 16px calc(16px + env(safe-area-inset-bottom));border-left:0;border-right:0;border-bottom:0}.wrm2-legacy-item-choices-layout{grid-template-columns:1fr}.wrm2-legacy-item-choices-grid{max-height:min(30dvh,245px)}.wrm2-legacy-item-choices-tips{min-height:95px}}
@media(prefers-reduced-motion:no-preference){.wrm2-legacy-item-choices:not([hidden]){animation:wrm2-item-panel-in .17s ease-out}}
@keyframes wrm2-item-panel-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
/* GGLYTICS ability matrix: original grid/guides/cells adapted to 15 Wild Rift
   levels and WRM design tokens. This replaces the legacy skill-order pills. */
.wrm2-legacy-card.wrm2-legacy-skill-matrix{min-width:0;align-self:start;padding:0}
.wrm2-legacy-skill-matrix .champ-skill-matrix{display:grid;min-width:0;width:100%}
.wrm2-legacy-grid .wrm2-legacy-skill-matrix .champ-skill-matrix-head{flex-direction:row;justify-content:space-between}
.wrm2-legacy-skill-matrix .champ-skill-matrix-head>small{display:flex;align-items:center;color:var(--wrm2-muted);font-size:11px;line-height:1.35;gap:5px}
.wrm2-legacy-skill-matrix .champ-max-order{display:inline-flex;align-items:center;gap:6px}
.wrm2-legacy-skill-matrix .champ-max-order i{color:var(--wrm2-muted);font-style:normal}
.wrm2-legacy-skill-matrix .champ-max-order b{font:900 11px var(--wrm2-font)}
.wrm2-legacy-skill-matrix .skill-key-q{color:var(--wrm2-yellow)}
.wrm2-legacy-skill-matrix .skill-key-w{color:var(--wrm2-cyan)}
.wrm2-legacy-skill-matrix .skill-key-e{color:var(--wrm2-mint)}
.wrm2-legacy-skill-matrix .champ-skill-matrix-scroll{min-width:0;max-width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--wrm2-mint) var(--wrm2-panel2)}
.wrm2-legacy-skill-matrix .champ-skill-matrix-scroll::-webkit-scrollbar{height:7px}
.wrm2-legacy-skill-matrix .champ-skill-matrix-scroll::-webkit-scrollbar-thumb{background:var(--wrm2-mint)}
.wrm2-legacy-skill-matrix .champ-skill-matrix-scroll::-webkit-scrollbar-track{background:var(--wrm2-panel2)}
.wrm2-legacy-skill-matrix .champ-skill-grid{position:relative;min-width:410px;padding:10px 12px 12px}
.wrm2-legacy-skill-matrix .champ-skill-guides{position:absolute;z-index:0;inset:10px 12px 12px;display:grid;grid-template-columns:34px repeat(15,minmax(0,1fr));pointer-events:none}
.wrm2-legacy-skill-matrix .champ-skill-guides>span{position:relative}
.wrm2-legacy-skill-matrix .champ-skill-guides>span::after{content:"";position:absolute;left:50%;top:17px;width:1px;height:var(--skill-guide-height);background:color-mix(in srgb,var(--wrm2-text) 5%,transparent)}
.wrm2-legacy-skill-matrix .champ-skill-level-head,.wrm2-legacy-skill-matrix .champ-skill-row{position:relative;z-index:1;display:grid;grid-template-columns:34px repeat(15,minmax(0,1fr));align-items:start;column-gap:0;width:100%}
.wrm2-legacy-skill-matrix .champ-skill-level-head{min-height:36px}
.wrm2-legacy-skill-matrix .champ-skill-level-head small{display:grid;min-height:36px;justify-items:center;padding-top:2px;color:var(--wrm2-muted);font-size:10px;text-align:center}
.wrm2-legacy-skill-matrix .champ-skill-passive,.wrm2-legacy-skill-matrix .champ-skill-icon{position:relative;display:block;width:30px;height:30px;justify-self:start;padding:0;border:1px solid var(--wrm2-line-strong);background:var(--wrm2-canvas);cursor:help;overflow:hidden;box-sizing:border-box}
.wrm2-legacy-skill-matrix .champ-skill-passive img,.wrm2-legacy-skill-matrix .champ-skill-icon img{display:block;width:100%;height:100%;object-fit:cover}
.wrm2-legacy-skill-matrix .champ-skill-row{min-height:36px}
.wrm2-legacy-skill-matrix .champ-skill-row>span{display:grid;height:36px;place-items:center}
.wrm2-legacy-skill-matrix .champ-skill-row>span.active{position:relative;z-index:2;align-self:center;width:22px;height:22px;justify-self:center;border:1px solid currentColor;border-radius:2px;background:var(--wrm2-canvas)}
.wrm2-legacy-skill-matrix .champ-skill-row>span.active b{position:relative;z-index:1;color:var(--wrm2-matrix-skill-color)}
.wrm2-legacy-skill-matrix .champ-skill-row>span b{font:900 10px var(--wrm2-font)}
.wrm2-legacy-skill-matrix .champ-skill-row.skill-q{--wrm2-matrix-skill-color:var(--wrm2-yellow);color:var(--wrm2-yellow)}
.wrm2-legacy-skill-matrix .champ-skill-row.skill-w{--wrm2-matrix-skill-color:var(--wrm2-cyan);color:var(--wrm2-cyan)}
.wrm2-legacy-skill-matrix .champ-skill-row.skill-e{--wrm2-matrix-skill-color:var(--wrm2-mint);color:var(--wrm2-mint)}
.wrm2-legacy-skill-matrix .champ-skill-row.skill-r{--wrm2-matrix-skill-color:var(--wrm2-game-red);color:var(--wrm2-game-red)}
.wrm2-legacy-skill-matrix .champ-skill-row.skill-q .champ-skill-icon{box-shadow:inset 0 -2px var(--wrm2-yellow)}
.wrm2-legacy-skill-matrix .champ-skill-row.skill-w .champ-skill-icon{box-shadow:inset 0 -2px var(--wrm2-cyan)}
.wrm2-legacy-skill-matrix .champ-skill-row.skill-e .champ-skill-icon{box-shadow:inset 0 -2px var(--wrm2-mint)}
.wrm2-legacy-skill-matrix .champ-skill-row.skill-r .champ-skill-icon{box-shadow:inset 0 -2px var(--wrm2-game-red)}
@media(max-width:620px){.wrm2-legacy-skill-matrix .champ-skill-grid{width:410px}}
/* One responsive editorial grid and one header for all four legacy guide tabs. */
.wrm2-legacy-editorial{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;min-width:0}
.wrm2-legacy-editorial>.wrm2-legacy-card--wide,.wrm2-legacy-editorial>.feature-gate{grid-column:1/-1}
.wrm2-legacy-section-head{margin:0}
.wrm2-legacy-section-head h2{display:flex;align-items:center;gap:10px}
/* Reuse the BUILD header layout for its variant switch and the
   Community Builds directory action, without introducing a second layout. */
.wrm2-legacy-section-head:is([data-wrm2-legacy-section-head="build"],[data-wrm2-legacy-section-head="community-builds"]){display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;column-gap:24px;row-gap:12px}
.wrm2-legacy-section-head:is([data-wrm2-legacy-section-head="build"],[data-wrm2-legacy-section-head="community-builds"])>div:first-child{flex:1 1 440px;min-width:0}
.wrm2-legacy-section-head:is([data-wrm2-legacy-section-head="build"],[data-wrm2-legacy-section-head="community-builds"])>.wrm2-legacy-switch{flex:0 1 auto;min-width:0;max-width:100%;margin-left:auto;justify-content:flex-end}
.wrm2-legacy-lane{display:block;flex:0 0 28px;width:28px;height:28px;object-fit:contain;background-color:var(--wrm2-mint);-webkit-mask:var(--wrm2-legacy-lane-mask) center/contain no-repeat;mask:var(--wrm2-legacy-lane-mask) center/contain no-repeat}
.wrm2-legacy-card .wrm2-dna-card-head{margin:0 0 12px}
.wrm2-legacy-card .wrm2-dna-card-head h3{margin-bottom:0;text-transform:uppercase}
.wrm2-legacy-card .wrm2-dna-card-head .wrm2-dna-count{align-self:center}
.wrm2-legacy-difficulty{flex:0 0 auto;display:inline-flex;align-items:center;min-height:24px;padding:4px 9px;font:900 10px/1.1 var(--wrm2-font);letter-spacing:.05em;text-transform:uppercase;background:#0b1c17;border:1px solid var(--wrm2-mint);color:var(--wrm2-mint)}
.wrm2-legacy-difficulty[data-wrm2-difficulty="average"]{border:1px solid var(--wrm2-yellow);color:var(--wrm2-yellow)}
.wrm2-legacy-difficulty[data-wrm2-difficulty="weak"]{border:1px solid var(--wrm2-red);color:var(--wrm2-red)}
@media(max-width:1024px){.wrm2-legacy-editorial{grid-template-columns:minmax(0,1fr)}}
@media(max-width:620px){.wrm2-legacy-card{padding:12px}.wrm2-legacy-card .wrm2-dna-card-head{align-items:flex-start}.wrm2-legacy-section-head h2{align-items:flex-start}.wrm2-legacy-section-head:is([data-wrm2-legacy-section-head="build"],[data-wrm2-legacy-section-head="community-builds"])>div:first-child{flex-basis:100%}.wrm2-legacy-section-head:is([data-wrm2-legacy-section-head="build"],[data-wrm2-legacy-section-head="community-builds"])>.wrm2-legacy-switch{margin-left:0;justify-content:flex-start}}
/* NEW Jungle Path data, using the existing Champion DNA headers, editorial cards and PRO gate. */
.wrm2-legacy-card h3[data-wrm2-editorial-tone="positive"]{color:var(--wrm2-mint)}
.wrm2-legacy-card h3[data-wrm2-editorial-tone="negative"]{color:var(--wrm2-red)}
.wrm2-jungle{display:flex;flex-direction:column;gap:10px;min-width:0}
.wrm2-jungle-route-layout{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:20px;align-items:start;min-width:0}
.wrm2-jungle-map{position:relative;width:100%;aspect-ratio:1190/739;overflow:hidden;background:var(--wrm2-panel);border:1px solid var(--wrm2-line);isolation:isolate;container-type:inline-size}
.wrm2-jungle-map-image{display:block;width:100%;height:100%;object-fit:fill}
.wrm2-jungle-path-lines{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
.wrm2-jungle-path-lines polyline{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.wrm2-jungle-path-outline{stroke:#03150ed9;stroke-width:5}
.wrm2-jungle-path-dashes{stroke:var(--wrm2-mint);stroke-width:2.4;stroke-dasharray:4 8}
.wrm2-jungle-marker{position:absolute;z-index:2;appearance:none;left:var(--wrm2-jungle-x);top:var(--wrm2-jungle-y);display:grid;place-items:center;width:clamp(28px,5.8cqw,50px);height:clamp(28px,5.8cqw,50px);padding:0;transform:translate(-50%,-50%);border:2px solid var(--wrm2-text);border-radius:50%;background:var(--wrm2-canvas);box-shadow:0 1px 8px #000a;box-sizing:border-box;cursor:pointer}
.wrm2-jungle-marker[data-wrm2-jungle-tone="blue"]{border-color:var(--wrm2-cyan)}
.wrm2-jungle-marker[data-wrm2-jungle-tone="red"]{border-color:var(--wrm2-red)}
.wrm2-jungle-marker[data-wrm2-jungle-tone="river"]{border-color:var(--wrm2-mint)}
.wrm2-jungle-marker>img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.wrm2-jungle-marker:is(:hover,:focus-visible,[aria-expanded="true"]){outline:2px solid var(--wrm2-mint);outline-offset:2px;z-index:3}
.wrm2-jungle-marker-fallback{color:var(--wrm2-text);font-size:15px;font-weight:900}
.wrm2-jungle-step{position:absolute;top:-4px;right:-6px;display:grid;place-items:center;min-width:clamp(13px,2.4cqw,19px);height:clamp(13px,2.4cqw,19px);padding:0 2px;border:1px solid var(--wrm2-line);border-radius:50%;background:var(--wrm2-canvas);color:var(--wrm2-mint);font:900 clamp(8px,1.3cqw,10px)/1 var(--wrm2-font);box-sizing:border-box}
.wrm2-jungle-marker--gank{border-radius:0;border-color:var(--wrm2-canvas);cursor:default}
.wrm2-jungle-marker--gank>img{border-radius:0;object-fit:contain}
.wrm2-jungle-gank-label{position:absolute;top:calc(100% + 2px);left:50%;transform:translateX(-50%);color:var(--wrm2-text);font:900 clamp(7px,1.3cqw,10px)/1 var(--wrm2-font);white-space:nowrap;text-shadow:0 2px 3px #000}
.wrm2-jungle-gank-swap{position:absolute;right:-6px;top:-5px;display:grid;place-items:center;width:clamp(13px,2.4cqw,19px);height:clamp(13px,2.4cqw,19px);border-radius:50%;background:var(--wrm2-canvas);color:var(--wrm2-mint);font:900 clamp(9px,1.9cqw,14px)/1 var(--wrm2-font)}
/* Single shared popover, moved outside the clipped map. Presentation inherits the site tooltip UI kit. */
.wrm2-jungle-tooltip-picture{display:block;width:100%;height:auto;max-height:180px;object-fit:cover;border:1px solid var(--wrm2-line);margin:0 0 12px}
.wrm2-jungle-description{min-width:0;overflow-wrap:anywhere}
.wrm2-jungle-description> :first-child{margin-top:0}
.wrm2-jungle .feature-gate{min-width:0}
@media(max-width:1024px){.wrm2-jungle-route-layout{grid-template-columns:minmax(0,1fr);gap:15px}}


/* PATCH CHANGES reuses the native DLE champion xfield and shared status icons.
 * Only the accordion layout is new; all four status colors come from champion-library.css. */
.wrm2-patch-history{display:grid;gap:10px;min-width:0}
.wrm2-patch-entry{min-width:0;border:1px dashed color-mix(in srgb,currentColor 55%,var(--wrm2-line-strong));border-left:3px solid currentColor;background:linear-gradient(90deg,color-mix(in srgb,currentColor 9%,transparent),transparent 78%),var(--wrm2-panel)}
.wrm2-patch-entry-summary{display:flex;align-items:center;gap:12px;min-width:0;min-height:62px;padding:11px 16px;cursor:pointer;list-style:none}
.wrm2-patch-entry-summary::-webkit-details-marker{display:none}
.wrm2-patch-entry-summary:focus-visible{outline:2px solid var(--wrm2-mint);outline-offset:2px}
.wrm2-patch-entry-summary::after{content:'+';margin-left:auto;align-self:center;font:900 22px/1 var(--wrm2-font)}
.wrm2-patch-entry[open] .wrm2-patch-entry-summary{border-bottom:1px solid currentColor}
.wrm2-patch-entry[open] .wrm2-patch-entry-summary::after{content:'−'}
.wrm2-patch-entry-label{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;min-width:0;flex:1}
.wrm2-patch-entry-heading{display:grid;grid-template-columns:60px minmax(0,1fr);align-items:baseline;column-gap:12px;row-gap:3px;min-width:0}
.wrm2-patch-entry-label strong{letter-spacing:.05em;font:900 13px/1.85 var(--wrm2-font)}
.wrm2-patch-entry-meta{min-width:0;color:var(--wrm2-muted);overflow-wrap:anywhere;font:900 13px/1.85 var(--wrm2-font)}
.wrm2-patch-entry-content{padding:12px 16px 16px;color:var(--wrm2-muted);overflow-wrap:anywhere;font:13px/1.85 var(--wrm2-font)}
.wrm2-patch-entry-content b,.wrm2-patch-entry-content strong{color:var(--wrm2-text)}
.wrm2-patch-entry-content :is(p,ul,ol){margin:0 0 10px}
@media(max-width:540px){.wrm2-patch-entry-summary{padding:11px 12px;gap:9px}.wrm2-patch-entry-content{padding:10px 12px 14px}}