/* Overview is a single reading surface, with profession and adoption views. */
.meta-overview { --mo-ink:var(--color-text); --mo-muted:var(--color-text-secondary); --mo-line:var(--color-border); --mo-accent:var(--color-brand-strong); min-width:0; font-family:var(--font-sans); color:var(--mo-ink); font-size:13px; }
.meta-overview *, .meta-overview *::after, .meta-overview *::before { box-sizing:border-box; }
.meta-overview :is(a,button,summary,input,select):focus-visible { outline:2px solid var(--color-brand-strong); outline-offset:4px; }
.meta-overview :is(h2,h3,strong) { font-family:var(--font-sans); }
.meta-overview :is(a,button) { -webkit-tap-highlight-color:transparent; }
.meta-overview a { color:inherit; text-decoration:none; }
.meta-overview [hidden] { display:none !important; }
.mo-intro { display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:18px; padding:26px 0 23px; }
.mo-eyebrow { display:block; margin:0 0 7px; font-size:10px; line-height:1.3; letter-spacing:.13em; text-transform:uppercase; color:var(--color-brand-strong); }
.mo-intro h2 { margin:0; font-size:27px; line-height:1.25; letter-spacing:-.04em; font-weight:500; }
.mo-intro p { margin:8px 0 0; color:var(--mo-muted); font-size:13px; line-height:1.5; }
.mo-intro-evidence { display:grid; gap:7px; font-size:11px; color:var(--mo-muted); text-align:right; }
.mo-coverage-stat { display:inline-flex; justify-content:flex-end; align-items:center; gap:6px; }
.mo-coverage-stat strong { font-weight:500; color:var(--color-text-secondary); }
.mo-coverage-stat i { display:inline-block; width:36px; height:4px; background:var(--color-border); }
.mo-coverage-stat i::after { content:""; display:block; width:var(--mo-fill); height:100%; background:var(--color-brand-strong); }
.mo-landscape { display:grid; grid-template-columns:minmax(270px,.9fr) minmax(0,1.7fr); border:1px solid var(--color-border); background:var(--color-surface); border-radius:5px; overflow:hidden; }
.mo-lineup { padding:23px 24px 18px; border-right:1px solid var(--color-border); }
.mo-choice-panel { padding:23px 26px 18px; min-width:0; }
.mo-section-head { display:flex; align-items:center; justify-content:space-between; gap:10px; min-width:0; }
.mo-section-head h3 { display:flex; align-items:center; gap:9px; margin:0; font-size:18px; line-height:1.25; font-weight:500; letter-spacing:-.025em; }
.mo-section-head > a { flex:none; color:var(--color-text-secondary); font-size:11px; border-bottom:1px solid transparent; padding:4px 0; }
.mo-section-head > a:hover { color:var(--color-brand-strong); border-color:var(--color-brand-border); }
.mo-section-head > a span { padding-left:4px; }
.mo-lineup-eight { display:grid; gap:1px; text-align:center; font-size:25px; line-height:1; font-weight:500; color:var(--color-brand-strong); }
.mo-lineup-eight > span { font-size:10px; font-weight:400; color:var(--mo-muted); }
.mo-section-note { margin:9px 0 19px; color:var(--mo-muted); font-size:11px; line-height:1.5; }
.mo-roster-ribbon { display:flex; width:100%; height:8px; gap:2px; margin-bottom:14px; opacity:.85; overflow:hidden; border-radius:1px; }
.mo-professions { display:grid; gap:2px; }
.meta-overview .mo-professions button { display:grid; grid-template-columns:120px minmax(25px,1fr) 31px 14px; align-items:center; gap:9px; width:100%; padding:8px 8px; min-height:36px; min-block-size:36px; font-family:var(--font-sans); font-size:12px; font-weight:400; border:1px solid transparent; border-radius:3px; background:transparent; color:var(--color-text-secondary); text-align:left; cursor:pointer; box-shadow:none; }
.meta-overview .mo-professions button[aria-pressed="true"] { border-color:var(--color-border-strong); background:var(--color-brand-soft); color:var(--color-text); }
.meta-overview .mo-professions button:hover { background:var(--color-surface-hover); }
.mo-profession-name { display:flex; align-items:center; gap:8px; min-width:0; }
.mo-profession-icon { width:22px; height:22px; flex:none; object-fit:contain; }
.mo-profession-track { height:4px; background:var(--color-border); }
.mo-profession-track i { display:block; height:100%; background:rgb(var(--mo-profession)); opacity:.8; }
.mo-professions button strong { font-size:12px; text-align:right; font-weight:500; font-variant-numeric:tabular-nums; }
.mo-profession-arrow { color:var(--color-text-subtle); opacity:0; }
.mo-professions button[aria-pressed="true"] .mo-profession-arrow { opacity:1; color:var(--color-brand-strong); }
.mo-choice-ribbon { display:flex; height:11px; gap:2px; border-radius:2px; overflow:hidden; margin:0 0 17px; background:var(--color-border); }
.mo-choice-ribbon > span { flex:0 1 auto; width:var(--mo-segment); background:rgb(var(--mo-profession)); opacity:var(--mo-segment-opacity,1); }
.mo-choice-ribbon > .mo-other-segment { background:var(--color-border-strong); opacity:1; }
.mo-choice-columns,.mo-mover-columns { display:flex; justify-content:space-between; gap:12px; color:var(--color-text-subtle); font-size:10px; line-height:1.5; border-bottom:1px solid var(--mo-line); padding-bottom:10px; }
.mo-choices,.mo-movers,.mo-team-cores { list-style:none; padding:0; margin:0; }
.mo-choices > li { position:relative; border-bottom:1px solid var(--color-border); padding:11px 0 9px; }
.mo-choice-link { display:flex; align-items:center; gap:11px; }
.mo-choice-rank { width:12px; flex:none; font-size:11px; color:var(--color-text-subtle); }
.mo-skill-icon { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; flex:none; padding:2px; border:1px solid var(--color-brand-border); border-radius:3px; background:var(--color-canvas-raised); vertical-align:middle; }
.mo-skill-icon img { width:100%; height:100%; object-fit:cover; border-radius:1px; }
.mo-skill-icon.is-small { width:27px; height:27px; padding:1px; border-color:var(--color-border); border-radius:2px; }
.mo-choice-identity { display:grid; gap:5px; flex:1; min-width:0; }
.mo-choice-identity strong { font-weight:500; font-size:14px; line-height:1.3; color:var(--color-text); }
.mo-link-arrow { opacity:0; font-size:11px; margin-left:3px; color:var(--color-brand-strong); }
.mo-choice-link:is(:hover,:focus-visible) .mo-link-arrow { opacity:1; }
.mo-choice-link:hover .mo-choice-identity strong { color:var(--color-brand-strong); }
.mo-choice-identity small { color:var(--mo-muted); font-size:11px; line-height:1.4; }
.mo-choice-value { display:grid; gap:5px; text-align:right; flex:none; font-variant-numeric:tabular-nums; }
.mo-choice-value > strong { font-size:18px; font-weight:500; color:var(--color-brand-strong); letter-spacing:-.02em; }
.mo-delta { color:var(--color-text-subtle); font-size:11px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.mo-delta.is-up { color:#adc5a5; }
.mo-delta.is-down { color:#c8a399; }
.mo-choice-core { display:flex; align-items:center; gap:5px; padding-left:57px; margin-top:8px; }
.mo-choice-core > span:first-child { color:var(--color-text-subtle); font-size:10px; margin-right:2px; }
.mo-choice-core .mo-skill-icon { width:21px; height:21px; border:0; padding:0; opacity:.8; }
.mo-footnote { margin:14px 0 0; color:var(--color-text-subtle); font-size:11px; line-height:1.6; }
.mo-secondary { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:38px; padding:29px 0 28px; border-bottom:1px solid var(--mo-line); }
.mo-secondary .mo-section-head h3 { font-size:19px; }
.mo-secondary .mo-section-note { margin-bottom:17px; }
.mo-movers > li { padding:11px 0 12px; border-bottom:1px solid var(--color-border); }
.mo-movers > li > a { display:flex; align-items:center; gap:11px; }
.mo-mover-name { display:grid; gap:4px; min-width:0; flex:1; }
.mo-mover-name strong { font-size:12px; line-height:1.35; font-weight:500; }
.mo-mover-name small { color:var(--mo-muted); font-size:10px; }
.mo-mover-value { display:grid; gap:5px; text-align:right; flex:none; font-variant-numeric:tabular-nums; }
.mo-mover-value > span:first-child { font-size:11px; color:var(--color-text-secondary); }
.mo-mover-value i { font-style:normal; color:var(--color-text-subtle); margin:0 4px; }
.mo-mover-value strong { font-size:13px; font-weight:500; color:var(--color-brand-strong); }
.mo-mover-value small { font-size:10px; color:var(--mo-muted); }
.mo-movers a:hover strong { color:var(--color-brand-strong); }
.mo-shift-track { position:relative; height:2px; margin:8px 1px 0 38px; background:var(--color-border); }
.mo-shift-track > span { display:block; position:absolute; height:2px; }
.mo-shift-track :is(i,b) { position:absolute; top:-2px; width:6px; height:6px; border-radius:50%; transform:translateX(-50%); background:var(--color-canvas-raised); border:1px solid var(--color-border-strong); }
.mo-shift-track b { border:0; }
.mo-team-coverage { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:9px 11px; margin-bottom:17px; border:1px solid var(--color-border); border-radius:3px; background:var(--color-canvas-raised); font-size:10px; color:var(--mo-muted); }
.mo-team-coverage .mo-coverage-stat { justify-content:flex-start; }
.mo-team-cores > li { padding:15px 0; border-bottom:1px solid var(--color-border); }
.mo-team-cores a { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.mo-core-main { min-width:0; display:grid; gap:7px; }
.mo-team-icons { display:flex; flex-wrap:wrap; gap:4px; }
.mo-team-icons .mo-skill-icon { width:32px; height:32px; }
.mo-core-main small { color:var(--mo-muted); font-size:10px; line-height:1.5; }
.mo-team-value { display:grid; gap:7px; flex:none; text-align:right; font-variant-numeric:tabular-nums; }
.mo-team-value strong { color:var(--color-brand-strong); font-size:18px; font-weight:500; letter-spacing:-.025em; }
.mo-team-value small { color:var(--mo-muted); font-size:10px; }
.mo-team-value small > span { color:var(--color-brand-strong); padding-left:4px; }
.mo-team-cores a:hover .mo-skill-icon { border-color:var(--color-brand-strong); }
.meta-overview :is(.mo-skill-explorer,.mo-evidence) { margin:0; padding:0; border:0; background:transparent; box-shadow:none; border-radius:0; }
.mo-skill-explorer > summary { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 0; cursor:pointer; list-style:none; }
.mo-skill-explorer > summary::-webkit-details-marker { display:none; }
.mo-skill-explorer > summary strong { display:block; color:var(--color-text); font-size:14px; font-weight:500; }
.mo-skill-explorer > summary small { display:block; margin-top:5px; color:var(--mo-muted); font-size:11px; }
.mo-disclosure-arrow { color:var(--color-brand-strong); font-size:21px; font-weight:300; }
.mo-skill-explorer[open] .mo-disclosure-arrow { transform:rotate(45deg); }
.mo-skill-controls { display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; padding:0 0 17px; }
.mo-skill-controls label { display:grid; gap:7px; color:var(--mo-muted); font-size:11px; }
.meta-overview .mo-skill-controls :is(input,select) { min-height:35px; padding:6px 10px; border:1px solid var(--color-border-strong); border-radius:3px; background:var(--color-canvas-raised); color:var(--mo-ink); font-family:var(--font-sans); font-size:12px; }
.mo-skill-controls a { padding:10px 0; margin-left:auto; color:var(--color-brand-strong); font-size:11px; }
.mo-skill-count { font-size:11px; line-height:1.5; color:var(--mo-muted); margin:0 0 13px; }
.mo-skill-table-scroll { overflow-x:auto; }
.meta-overview .mo-skill-table { width:100%; margin:0; border-collapse:collapse; font-size:12px; font-variant-numeric:tabular-nums; }
.meta-overview .mo-skill-table :is(th,td) { text-align:right; padding:9px 12px; border:0; border-bottom:1px solid var(--color-border); background:transparent; text-transform:none; letter-spacing:0; font-size:12px; font-weight:400; }
.meta-overview .mo-skill-table thead th { color:var(--mo-muted); font-size:11px; background:var(--color-canvas-raised); }
.meta-overview .mo-skill-table :is(th,td):first-child { text-align:left; }
.mo-skill-table tbody th { display:flex; gap:10px; align-items:center; }
.mo-skill-table :is(td,th) small { display:block; margin-top:5px; color:var(--mo-muted); font-size:10px; }
.meta-overview .mo-show-skills { min-height:36px; margin:13px 0; padding:6px 12px; border:1px solid var(--color-border-strong); border-radius:3px; background:var(--color-canvas-raised); color:var(--color-brand-strong); font-size:11px; }
.mo-empty { padding:28px 0; color:var(--mo-muted); font-size:12px; }
.mo-evidence { border-top:1px solid var(--mo-line) !important; padding-top:13px !important; }
.mo-evidence summary { cursor:pointer; color:var(--color-text-subtle); font-size:11px; }
.mo-evidence p { color:var(--mo-muted); font-size:12px; line-height:1.7; max-width:900px; }
.trends-meta-panel .meta-family-refresh-notice { display:flex; align-items:center; flex-wrap:wrap; gap:6px 11px; margin:16px 0 0; padding:10px 13px; border:1px solid var(--color-border); border-radius:4px; background:var(--color-surface); box-shadow:none; color:var(--color-text-secondary); font-size:11px; }
.meta-family-refresh-notice .meta-family-refresh-dot { align-self:center; flex:none; width:5px; height:5px; border-radius:50%; background:var(--color-brand-strong); }
.trends-meta-panel .meta-family-refresh-notice strong { display:inline; font-size:inherit; font-weight:500; color:var(--color-brand-strong); }
.meta-family-refresh-count { color:var(--color-text); font-variant-numeric:tabular-nums; }
.meta-family-refresh-detail { margin-left:auto; font-size:10px; }
@media(max-width:1000px) {
 .mo-landscape { grid-template-columns:minmax(250px,.85fr) minmax(0,1.3fr); }
 .mo-lineup { padding:20px 16px; }
 .mo-choice-panel { padding:20px; }
 .meta-overview .mo-professions button { grid-template-columns:110px minmax(15px,1fr) 29px 12px; gap:7px; padding-inline:5px; }
 .mo-secondary { gap:24px; }
}
@media(max-width:760px) {
 .mo-landscape { grid-template-columns:1fr; }
 .mo-lineup { border-right:0; border-bottom:1px solid var(--color-border); }
 .mo-professions { grid-template-columns:1fr 1fr; gap:4px 8px; }
 .meta-overview .mo-professions button { grid-template-columns:minmax(0,1fr) 30px 12px; }
 .mo-profession-track { display:none; }
 .mo-lineup .mo-footnote { margin-top:12px; }
 .mo-secondary { grid-template-columns:1fr; gap:30px; }
 .mo-intro-evidence { text-align:left; }
 .mo-coverage-stat { justify-content:flex-start; }
}
@media(max-width:500px) {
 .mo-intro { gap:14px; padding:22px 0; }
 .mo-intro h2 { font-size:25px; }
 .mo-intro p { max-width:290px; font-size:12px; }
 .mo-intro-evidence { gap:5px; }
 .mo-lineup,.mo-choice-panel { padding:18px 14px; }
 .mo-section-head h3 { font-size:17px; }
 .mo-profession-name { font-size:11px; gap:5px; }
 .mo-profession-icon { width:20px; height:20px; }
 .meta-overview .mo-professions button { min-height:40px; padding:7px 4px; gap:4px; }
 .mo-choice-rank { display:none; }
 .mo-choice-link { gap:9px; }
 .mo-choice-identity strong { font-size:12px; }
 .mo-choice-identity small { font-size:10px; }
 .mo-choice-value > strong { font-size:17px; }
 .mo-choice-core { padding-left:43px; }
 .mo-choice-columns { font-size:9px; }
 .mo-secondary { padding-top:25px; }
 .mo-secondary .mo-section-head h3 { font-size:18px; }
 .mo-mover-value > span:first-child { font-size:10px; }
 .mo-team-icons .mo-skill-icon { width:29px; height:29px; }
 .mo-team-cores a { gap:8px; }
 .mo-team-value strong { font-size:17px; }
 .mo-skill-controls { gap:12px 10px; }
 .mo-skill-controls label { min-width:0; flex:1 1 40%; }
 .mo-skill-controls label:first-child { flex-basis:100%; }
 .mo-skill-controls :is(input,select) { width:100%; }
 .mo-skill-controls a { margin-left:0; }
 .meta-overview .mo-skill-table :is(th,td) { padding:9px 5px; font-size:11px; }
 .meta-overview .mo-skill-table thead th { font-size:10px; }
 .mo-skill-table tbody th { gap:7px; }
 .meta-family-refresh-detail { margin-left:0; flex-basis:100%; }
}
:root[data-visual-mode="minimal"] .meta-overview { --mo-ink:var(--color-text); --mo-muted:var(--color-text-muted); --mo-line:var(--color-border); }
:root[data-visual-mode="minimal"] .mo-landscape { background:var(--color-canvas); border-radius:0; }
.mo-movement .mo-mover-columns { margin-top:19px; }
.mo-change-track { position:relative; height:7px; margin:9px 0 0 38px; background:linear-gradient(90deg,#302b2633 50%,#2b382533 50%); }
.mo-change-track::after { content:""; position:absolute; left:50%; top:-3px; bottom:-3px; width:1px; background:var(--color-border-strong); }
.mo-change-track > span { position:absolute; top:0; height:7px; border-radius:1px; }
.mo-change-axis { display:flex; justify-content:space-between; margin:12px 0 0 38px; font-size:10px; color:var(--color-text-subtle); }
.mo-movement .mo-mover-value .mo-delta { font-size:15px; font-weight:500; }
.mo-intro { align-items:center; padding-block:23px; }
.mo-choice-core { gap:5px; }
.mo-choice-core > .mo-skill-icon:first-child { color:inherit; margin-right:0; }
.mo-choice-identity small { display:flex; align-items:center; flex-wrap:wrap; gap:5px 12px; }
.mo-choice-core { display:inline-flex; padding:0; margin:0; }
.mo-choice-value > strong { line-height:1.25; }
.mo-choice-value .mo-delta { line-height:1.3; }
.meta-overview .mo-professions button { padding-block:6px; min-height:36px; }
.mo-results { padding:27px 0 20px; border-bottom:1px solid var(--mo-line); }
.mo-result-controls { display:flex; gap:16px; align-items:center; }
.mo-result-controls select { font:11px var(--font-sans); color:var(--color-text-secondary); border:0; border-bottom:1px solid var(--color-border-strong); border-radius:0; padding:6px 20px 6px 0; background-color:var(--color-canvas-raised); }
.mo-result-modes { display:flex; border:1px solid var(--color-border-strong); border-radius:3px; overflow:hidden; }
.meta-overview .mo-result-modes button { min-height:32px; min-block-size:32px; border:0; border-radius:0; padding:6px 12px; font:11px var(--font-sans); color:var(--color-text-secondary); background:transparent; box-shadow:none; cursor:pointer; }
.meta-overview .mo-result-modes button[aria-pressed="true"] { color:var(--color-text-secondary); background:var(--color-brand-soft); }
.mo-result-meta { display:flex; justify-content:space-between; gap:10px; margin:12px 0 0; font-size:10px; color:var(--color-text-subtle); }
.mo-results .gvg-chart { border:0; border-radius:0; background:transparent; margin-block:0; box-shadow:none; }
.mo-result-table { margin-top:8px; padding:0 !important; border:0 !important; background:transparent !important; box-shadow:none !important; }
.mo-result-table summary { color:var(--color-text-subtle); font-size:11px; cursor:pointer; width:fit-content; }
.mo-result-table .mo-skill-table { min-width:600px; }
@media(max-width:600px) {
 .mo-results .mo-section-head { flex-wrap:wrap; gap:15px; }
 .mo-result-controls { width:100%; justify-content:space-between; }
 .meta-overview .mo-result-modes button { min-height:38px; }
 .mo-result-controls select { min-height:38px; }
 .mo-result-meta { font-size:9px; }
}
/* Use the same panel surfaces and density as Player Builds and Team Builds. */
.meta-overview { --mo-ink:var(--color-text); --mo-muted:var(--color-text-secondary); --mo-line:var(--color-border); --mo-accent:var(--color-brand-strong); }
.mo-landscape { background:var(--color-surface); border-color:var(--mo-line); }
.mo-intro { padding-block:19px; }
.mo-intro h2 { font-size:23px; }
.mo-secondary { gap:16px; padding:16px 0; align-items:start; }
.mo-secondary > section { min-width:0; padding:15px 16px 10px; border:1px solid var(--mo-line); border-radius:5px; background:var(--color-surface); }
.mo-secondary .mo-section-head h3 { font-size:16px; }
.mo-secondary .mo-eyebrow { margin-bottom:5px; }
.mo-movement .mo-mover-columns { margin-top:13px; padding-bottom:7px; }
.mo-movers > li { padding:7px 0; }
.mo-movers > li > a { display:grid; grid-template-columns:26px minmax(0,1fr) 110px 66px; gap:9px; min-height:37px; }
.mo-movers > li > a:has(.mo-mover-spark) { grid-template-columns:26px minmax(0,1fr) 110px 66px; }
.mo-movers > li > a:not(:has(.mo-mover-spark)) { grid-template-columns:26px minmax(0,1fr) auto; }
.mo-mover-name { gap:3px; }
.mo-mover-name strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mo-mover-value,.mo-team-value { gap:3px; line-height:1.3; }
.mo-movement .mo-mover-value .mo-delta { font-size:12px; }
.mo-mover-spark { display:block; }
.mo-change-track { display:block; height:5px; margin:0; background:var(--color-border); }
.mo-change-track > span { height:5px; }
.mo-change-track::after { top:-2px; bottom:-2px; }
.mo-change-axis { width:110px; margin:9px 75px 0 auto; font-size:9px; }
.mo-secondary .mo-section-note { margin:8px 0 10px; }
.mo-team-coverage { border:0; background:transparent; padding:0; margin-bottom:10px; font-size:9px; }
.mo-team-cores > li { padding:9px 0; }
.mo-team-cores a { min-height:37px; }
.mo-team-icons .mo-skill-icon { width:28px; height:28px; }
.mo-team-value strong { font-size:16px; line-height:1.3; }
.mo-team-value small { font-size:9px; line-height:1.3; }
.mo-results { margin-top:16px; padding:15px 16px 12px; border:1px solid var(--mo-line); border-radius:5px; background:var(--color-surface); }
.mo-results .mo-section-head h3 { font-size:16px; }
@media(max-width:1000px) and (min-width:761px), (max-width:500px) {
 .mo-movers > li > a:has(.mo-mover-spark) { grid-template-columns:26px minmax(0,1fr) 58px 62px; gap:7px; }
 .mo-change-axis { width:58px; margin-right:69px; font-size:8px; }
 .mo-secondary > section { padding-inline:12px; }
 .mo-team-cores a { gap:7px; }
 .mo-team-icons { gap:3px; }
 .mo-team-icons .mo-skill-icon { width:25px; height:25px; }
}
