/* Compact hero picker; names provide the accessible image labels. */
.hero-tile{display:flex;flex-direction:column;padding:0;overflow:hidden;text-align:center;background:#ffffff;border-radius:12px;border:1px solid var(--line);width:100%;min-width:0;transition:border-color .15s,background .15s}.hero-tile:hover{border-color:var(--gold);background:#fff2f7}.hero-tile.active{border-color:var(--orange);box-shadow:0 0 0 2px #ff0a7833}.portrait{position:relative;display:flex;height:88px;min-height:0;background:linear-gradient(135deg,#f8e2ec,#fffaf6);align-items:center;justify-content:center;overflow:hidden;width:100%}.portrait-mark{font-size:2rem;font-weight:900;color:#746c72}.hero-thumbnail{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#f8e2ec}.hero-tile-body{display:grid;gap:4px;padding:9px 5px;width:100%;box-sizing:border-box}.hero-name{font-size:.85rem;font-weight:800;line-height:1.2;overflow-wrap:anywhere}.hero-role{font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.availability{font-size:.6rem;color:var(--gold);line-height:1.2}@media(max-width:560px){.portrait{height:72px}.hero-name{font-size:.78rem}}
.notice{border-left:3px solid var(--orange);padding:12px 14px;background:#fff2f7;color:#161316;font-size:.85rem;line-height:1.6;border-radius:0 10px 10px 0;margin:16px 0}.power{display:flex;flex-direction:column;gap:12px;padding:18px;background:var(--panel2);border:1px solid #ded5d9;border-radius:14px;min-width:0}.power.selected{background:#ffe6f0;border-color:var(--orange)}.power-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:32px}.power-icon{margin-left:auto;object-fit:contain}.tag{font-size:.7rem;color:var(--blue);font-weight:800}.tag.epic{color:var(--purple)}.tag.legendary{color:var(--gold)}.tag.common{color:var(--green)}.selection-label{font-size:.65rem;color:var(--muted)}.power-title{margin:0}.power-description{font-size:.85rem;margin:0;line-height:1.65;overflow-wrap:anywhere}.power-evidence{font-size:.75rem;color:var(--muted);margin-top:auto}.power-evidence summary{cursor:pointer;min-height:30px}.power-evidence p{margin-top:10px;margin-bottom:10px}.power>button{width:100%}.slot{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line);background:#ffffff;padding:12px;border-radius:12px;font-size:.85rem}.slot span{overflow-wrap:anywhere}.slot button{flex-shrink:0}.hero-card{padding:8px 0}.hero-title{display:flex;justify-content:space-between;gap:12px;align-items:center}.hero-main{display:flex;align-items:center;gap:12px}.role-pill,.ability-chip,.tag-chip{display:inline-block;font-size:.75rem;border:1px solid var(--line);border-radius:999px;padding:6px 10px}.chip-wrap,.ability-wrap{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.bar-row{display:grid;grid-template-columns:90px minmax(0,1fr) 32px;align-items:center;gap:10px}.bar{height:8px;background:#eee5e9;border-radius:20px;overflow:hidden}.bar span{display:block;height:100%;background:var(--orange)}.syn{padding:12px;border:1px dashed #ded5d9;border-radius:12px;font-size:.8rem;line-height:1.5}.synergy-list{display:grid;gap:10px}.metric-card{font-size:.8rem;line-height:1.6}.metric-card .k{font-weight:750;margin-bottom:6px}.empty{padding:24px 0;color:var(--muted)}#file{display:block;width:100%;font-size:.8rem}#buildName{width:100%;margin-bottom:12px}.workshop-title:focus{outline-offset:5px}.starting-note{padding:24px;border:1px dashed var(--line);border-radius:16px}.starting-note p{margin-bottom:0}

.field-label{display:block;font-size:.8rem;color:var(--muted);margin:16px 0 8px}.blueprint-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.blueprint-card{padding:18px;background:var(--panel2);border:1px solid var(--line);border-radius:14px}.blueprint-card.active{border-color:var(--orange)}.blueprint-card h3{margin-top:12px}.blueprint-card p{font-size:.85rem}.blueprint-summary{margin-top:24px}.path-note{font-size:.8rem;color:var(--gold);margin-top:20px}.target-path{padding:0;list-style:none;display:grid;gap:12px}.target-step{position:relative;border:1px solid var(--line);border-radius:12px;padding:16px;display:grid;gap:10px;background:#ffffff}.target-step.achieved{border-left:4px solid var(--green)}.target-step p{margin:0}.step-number{background:#ffe6f0;border-radius:50%;width:26px;height:26px;display:grid;place-items:center;font-size:.8rem;color:var(--orange)}.target-name{font-weight:750;color:var(--gold)}.condition{font-size:.75rem;color:var(--blue);line-height:1.5}.path-alternative,.fallback-row{border-top:1px solid var(--line);padding:12px 0}.path-alternative p{margin:10px 0}.fit-score{font-size:2.8rem;color:var(--orange);font-weight:850}.dimension-list{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0}.interaction{font-size:.8rem;padding:12px;border-left:3px solid var(--blue);background:#ffffff}.interaction.conflict{border-color:var(--danger)}#buildAnalysis h3{margin-top:20px;font-size:1rem}#archetype,#evidenceMode{width:100%}@media(max-width:560px){.blueprint-grid{grid-template-columns:minmax(0,1fr)}}

.saved-section{margin:0 0 24px;border:1px solid var(--line);border-radius:14px;padding:16px}.saved-section summary{cursor:pointer;min-height:32px}.saved-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:10px;margin-top:12px}.saved-build{display:grid;gap:8px;text-align:left}.blueprint-card button{width:100%}.target-step details summary{padding:6px 0}.portrait-mark{user-select:none}#buildAnalysis{overflow-wrap:anywhere}.power-evidence{overflow-wrap:anywhere}
.progression-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0}.progression-step{padding:14px;background:var(--panel2);border:1px solid var(--line);border-radius:12px}.progression-step strong{color:var(--gold)}.progression-step p{margin-bottom:0}.progression-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:20px 0}.progression-controls label{display:grid;gap:8px;font-size:.8rem;color:var(--muted)}.progression-controls input,.progression-controls select{width:100%;min-width:0}.progression-controls .progression-check{grid-column:1/-1;display:flex;align-items:center}.progression-check input{width:20px;height:20px}.progression-results{padding:18px;background:#ffffff;border-left:3px solid var(--orange);border-radius:10px;margin:18px 0}.progression-results strong{color:var(--gold)}#progression h3{margin-top:24px}#progression input:disabled{opacity:.65}@media(max-width:560px){.progression-flow,.progression-controls{grid-template-columns:minmax(0,1fr)}}

/* Talent trees: links show editorial priorities, never mechanical requirements. */
.tree-navigation{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:22px 0}.tree-tab{padding:12px 4px;display:grid;justify-items:center;gap:6px;background:#ffffff;border-radius:10px}.tree-tab strong{font-size:.7rem}.tree-tab .mini-note{font-size:.6rem}.tree-tab-icon{font-size:1.6rem;color:var(--tree-accent,var(--gold))}.tree-tab.active{border-color:var(--tree-accent,var(--gold));box-shadow:inset 0 -3px var(--tree-accent,var(--gold))}.path-big-dps{--tree-accent:#cc005a}.path-tanky{--tree-accent:#28649b}.path-spooky{--tree-accent:#7840a5}.path-support{--tree-accent:#287342}.tree-heading{margin:24px 0}.tree-heading h3{color:var(--gold);letter-spacing:.1em}.talent-tree{position:relative;padding:22px 18px;background:radial-gradient(ellipse at top,#fff2f7,#fffaf6 65%);border:1px solid #ded5d9;border-radius:16px;isolation:isolate}.talent-tree::before{content:'';position:absolute;top:75px;bottom:75px;left:50%;width:2px;background:linear-gradient(var(--tree-accent,var(--gold)),#ded5d9);z-index:-1}.tree-root{display:grid;justify-items:center;gap:12px;margin-bottom:28px;text-align:center}.tree-root-icon{display:grid;place-items:center;width:64px;height:64px;border:2px solid var(--tree-accent,var(--gold));border-radius:50%;color:var(--tree-accent,var(--gold));font-size:2rem;background:#ffffff;box-shadow:0 0 24px #ff0a7810}.talent-tier{position:relative;margin-top:28px}.tree-tier-label{position:relative;width:fit-content;margin:0 auto 18px;background:#ffffff;border:1px solid #ded5d9;border-radius:20px;padding:7px 12px;font-size:.7rem;color:var(--muted);text-align:center}.tree-branches{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.tree-branches::before{content:'';position:absolute;top:29px;left:25%;right:25%;height:2px;background:var(--tree-accent,var(--gold));z-index:-1}.skill-node{--rarity-color:var(--green);min-width:0;text-align:center;border-radius:10px;padding:12px 8px;background:#ffffff;border:1px solid #ded5d9}.skill-node.rarity-epic{--rarity-color:var(--purple)}.skill-node.rarity-legendary{--rarity-color:var(--gold)}.skill-node.rarity-unknown{--rarity-color:var(--muted)}.skill-node.allocated{border-color:var(--rarity-color);background:#fff2f7;box-shadow:0 0 14px #ff0a780a}.skill-button{display:flex;flex-direction:column;align-items:center;gap:10px;padding:0;background:transparent;border:0;width:100%;min-height:110px}.skill-button:hover{background:transparent}.skill-icon{display:grid;place-items:center;width:52px;height:52px;border:2px solid var(--rarity-color);border-radius:6px;background:linear-gradient(135deg,#fff2f7,#ffffff);font-size:1.7rem;color:var(--rarity-color);box-shadow:inset 0 0 0 3px #ded5d966,0 3px 6px #16131626}.allocated .skill-icon{box-shadow:0 0 16px color-mix(in srgb,var(--rarity-color) 25%,transparent)}.skill-icon img{object-fit:contain;width:38px;height:38px}.skill-name{font-size:.78rem;font-weight:750;line-height:1.3;overflow-wrap:anywhere}.skill-rank{font-size:.65rem;color:var(--muted)}.allocated .skill-rank{color:var(--green)}.skill-rarity{font-size:.65rem;color:var(--rarity-color)}.skill-details{font-size:.7rem;line-height:1.5;text-align:left;margin-top:10px;overflow-wrap:anywhere}.skill-details summary{cursor:pointer;min-height:30px;text-align:center;color:var(--muted)}.skill-details p{margin-top:10px}.explore-skill-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:12px}.tree-tier{margin:22px 0 12px;color:var(--gold);font-size:.85rem}.general-tree{border-top:1px solid var(--line);margin-top:24px;padding-top:16px}.general-tree>summary{cursor:pointer;min-height:40px;font-weight:700}@media(max-width:560px){.tree-navigation{gap:4px}.tree-tab strong{font-size:.6rem}.tree-tab .mini-note{display:none}.talent-tree{padding:18px 10px}.tree-branches{gap:10px}.skill-node{padding:10px 5px}.explore-skill-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.match-summary{font-size:1.05rem;color:var(--gold);font-weight:700;margin-bottom:14px}.match-time{display:flex;align-items:center;gap:14px;font-size:.8rem}.match-time input{flex:1;accent-color:var(--orange)}.match-checkpoints{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.match-checkpoints span{font-size:.7rem;background:#ffffff;padding:8px;border-radius:8px}.match-paths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0}.match-path{padding:14px;border:1px solid var(--line);border-left:3px solid var(--tree-accent);border-radius:10px;background:#ffffff}.match-path>strong{font-size:.8rem;color:var(--tree-accent)}.match-scores{display:grid;gap:4px;margin:10px 0;font-size:.78rem}.match-path p{margin-bottom:8px}.match-path button{width:100%;font-size:.75rem;padding:8px}.match-assumptions,.compact-details,.tree-disclosure,.fit-details{margin-top:16px}.match-assumptions summary,.compact-details summary,.tree-disclosure>summary,.fit-details>summary,.panel>details>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--muted);font-size:.8rem}.match-assumptions label{display:grid;grid-template-columns:minmax(0,1fr) 85px;align-items:center;gap:12px;font-size:.8rem;margin:12px 0}.match-assumptions input{width:100%}.tree-scroll{max-height:420px;overflow:auto;overscroll-behavior:contain;padding:4px 8px 12px 0}.tree-disclosure .talent-tree{max-height:480px;overflow:auto;overscroll-behavior:contain}.sidebar .fit-score{font-size:2.2rem}.sidebar>.compact-details{border-bottom:1px solid var(--line);padding-bottom:12px}.site-header .brand-row{margin-bottom:22px}.site-header h1{font-size:clamp(2rem,4vw,3.2rem)}

#buildExplorer{margin-bottom:24px;scroll-margin-top:20px}#buildExplorer .talent-tree{max-width:780px;margin-inline:auto}

.compact-path{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:12px 0 0}.compact-path h3{font-size:.85rem;margin:0}.compact-path>button{margin-left:auto;padding:8px 14px;font-size:.8rem}.mini-cascade{display:flex;align-items:flex-start;gap:16px;list-style:none;padding:0;margin:0;flex-wrap:wrap;min-width:0}.mini-choice{position:relative;border:1px solid var(--line);border-radius:7px;padding:7px 10px;font-size:.72rem;background:#ffffff;max-width:200px;overflow-wrap:anywhere}.mini-choice:nth-child(3n+2){margin-top:6px}.mini-choice:nth-child(3n){margin-top:12px}.mini-choice+.mini-choice::before{content:'?';position:absolute;left:-13px;top:5px;color:var(--orange)}.mini-choice.picked{border-color:#287342;color:var(--green)}.compact-build-header{padding:14px 18px}.compact-build-header .section-heading{align-items:center}.compact-build-header .workshop-title{font-size:1rem;margin:0}.compact-build-header #startCustom{padding:7px 12px;font-size:.75rem}.compact-build-header .hero-card{padding:10px 0 0}.compact-build-header .compact-details{margin-top:6px}.compact-build-header .compact-details>summary{min-height:28px;font-size:.7rem}.compact-build-tools{display:grid;grid-template-columns:minmax(0,1fr) minmax(160px,.45fr);gap:16px;padding:16px}.compact-build-tools>section:first-child{grid-column:1}.compact-build-tools h2{font-size:1rem;margin-bottom:10px}.compact-build-tools #buildName{max-width:320px}.compact-build-tools .actions{margin:8px 0}.compact-build-tools .actions button{padding:8px 10px;font-size:.75rem}.compact-build-tools>.compact-details{grid-column:1;margin:0;padding:0;border:0}.compact-build-tools #buildAnalysis{grid-column:2;grid-row:1/3;border-left:1px solid var(--line);padding-left:16px;margin:0}.compact-build-tools .fit-score{font-size:1.6rem}.compact-build-tools .fit-details{margin-top:4px}.workshop{grid-template-columns:minmax(0,1fr)}@media(max-width:560px){.compact-path{gap:10px}.compact-path .mini-cascade{order:3;flex-basis:100%}.compact-build-tools{grid-template-columns:minmax(0,1fr)}.compact-build-tools #buildAnalysis{grid-column:1;grid-row:auto;border-left:0;border-top:1px solid var(--line);padding:12px 0 0}}

.chaos-area{margin-bottom:24px}.chaos-area #buildExplorer{margin-bottom:12px}.chaos-area .compact-build-header{border:0;border-top:1px solid var(--line);border-radius:0;padding:12px 0 0;background:transparent}

.chaos-title-row{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:10px}.chaos-title-row>h2{margin:0}.chaos-title-row #buildAnalysis{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.chaos-title-row #buildAnalysis h2{font-size:.78rem;margin:0;color:var(--muted)}.chaos-title-row .fit-score{font-size:1.7rem;line-height:1}.chaos-title-row .fit-details{margin:0;font-size:.7rem;max-width:360px}.chaos-title-row .fit-details>summary{min-height:32px;font-size:.7rem}.chaos-title-row .fit-details[open]{flex-basis:100%}.chaos-title-row #buildAnalysis>p{max-width:300px;margin:0;font-size:.7rem}.chaos-area .tree-navigation{gap:8px;margin:12px 0}.chaos-area .tree-tab{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 8px;min-height:48px}.chaos-area .tree-tab-icon{font-size:1.15rem}.chaos-area .tree-tab .mini-note{display:none}.compact-build-tools{grid-template-columns:minmax(0,1fr)}.compact-build-tools>section:first-child,.compact-build-tools>.compact-details{grid-column:1}.mini-choice+.mini-choice::before{content:'\203a'}@media(max-width:560px){.chaos-title-row{align-items:flex-start;flex-wrap:wrap;gap:8px}.chaos-area .tree-tab{flex-direction:column;gap:4px;padding:6px 4px}.chaos-title-row #buildAnalysis{gap:10px}}

.compact-path .mini-cascade { flex:1; min-width:0; flex-wrap:nowrap; overflow-x:auto; padding-bottom:12px; }
.compact-path .mini-choice { flex-shrink:0; }
.mini-choice.legendary-choice { border-color:#956000; color:#956000; }
.mini-choice.optional-legendary { margin-left:40px; border:1px dashed #956000; color:#956000; }
.optional-legendary-branch { margin-left:40px; border-left:1px dashed #956000; padding:16px; }

/* Primary task: compact branching cards, with future targets distinct from owned powers. */
.chaos-area #progression { background:transparent; border:0; padding:12px 0; margin:0; }
#progression h2 { font-size:1rem; margin:0 0 8px; }
.path-title { margin:16px 0 6px; color:var(--gold); }
.planning-status { font-size:.8rem; color:var(--muted); }
.recommended-cascade { padding:8px 0 14px; }
.progression-path { display:flex; gap:18px; overflow-x:auto; padding:12px 4px 18px; scroll-snap-type:x proximity; }
.path-stage { position:relative; flex:0 0 240px; min-width:0; scroll-snap-align:start; border-top:2px solid var(--tree-accent); padding-top:10px; }
.path-stage.future-stage { border-top-style:dashed; background:#ff0a7803; }
.path-stage.future-stage>.tree-tier-label { color:var(--muted); }
.path-stage .tree-tier-label { margin:0 0 12px; }
.path-stage .skill-button { min-height:90px; }
.branch-label { display:block; font-size:.7rem; color:var(--gold); margin-bottom:8px; }
.synergy-reason { font-size:.75rem; line-height:1.6; color:var(--green); }
.rng-branch { border-left:1px dashed var(--tree-accent); padding-left:10px; }
.rng-branch>summary { min-height:44px; display:flex; align-items:center; cursor:pointer; font-size:.75rem; color:var(--muted); }
.path-stage.optional-legendary-branch { margin-left:30px; border-top-style:dashed; }
.adventure-insights { border-left:2px solid var(--gold); padding-left:14px; margin:14px 0; }
.recommended-cascade .rarity-epic { border-color:var(--purple); }
.recommended-cascade .rarity-legendary { border-color:var(--gold); color:var(--gold); }
@media(max-width:560px) { .progression-path { gap:12px; } .path-stage { flex-basis:220px; } .chaos-area .tree-tab strong { font-size:.58rem; } }

.game-icon { display:inline-flex; flex-shrink:0; align-items:center; justify-content:center; vertical-align:middle; border:1px solid var(--muted); border-radius:6px; background:#161316; padding:3px; }
.game-icon img { display:block; object-fit:contain; max-width:100%; }
.game-icon.rarity-common,.rarity-mark.rarity-common { border-color:var(--green); }
.game-icon.rarity-epic,.rarity-mark.rarity-epic { border-color:var(--purple); }
.game-icon.rarity-legendary,.rarity-mark.rarity-legendary { border-color:var(--gold); }
.icon-label,.path-title,#currentHero { display:inline-flex; align-items:center; gap:8px; }
.icon-label { text-align:left; min-width:0; }
.icon-label>span { overflow-wrap:anywhere; }
.rarity-mark { font-size:.6rem; font-weight:800; padding:2px 4px; border:1px solid var(--muted); border-radius:4px; flex-shrink:0; }
.power-top>.game-icon { margin-left:auto; }
.synergy-reason>.game-icon { margin-right:6px; }
.adventure-insights .icon-label { margin:4px 8px 4px 0; }
.path-title>.game-icon img { object-fit:cover; }
.saved-build { grid-template-columns:auto 1fr; align-items:center; }
.saved-build>.game-icon { grid-row:1/3; }
.saved-build>.subtle { grid-column:2; }
@media(max-width:560px) { .game-icon { padding:2px; } .icon-label { gap:6px; } }

.chaos-title-row #buildAnalysis { align-items:flex-start; gap:18px; }
.fit-card { border-left:3px solid var(--gold); padding-left:12px; min-width:150px; }
.fit-card.my-build-fit { border-color:var(--blue); }
.fit-card .fit-score { margin:6px 0; }
.fit-card.my-build-fit .fit-score { color:var(--blue); }
.fit-card .fit-details { max-width:300px; }
.fit-card .fit-details[open] { font-size:.75rem; }
@media(max-width:560px) { .fit-card { min-width:120px; } }

/* Reserve planner geometry; interactions scroll only within the existing planner. */
#buildExplorer { height:850px; overflow:auto; overscroll-behavior:contain; overflow-anchor:none; }
.chaos-title-row { min-height:105px; align-items:flex-start; }
.chaos-title-row .fit-details[open] { position:absolute; z-index:20; max-height:300px; overflow:auto; background:var(--panel2); padding:12px; border:1px solid var(--line); border-radius:10px; }
.progression-path { height:460px; overflow:auto; align-items:flex-start; overflow-anchor:none; }
.path-stage { height:420px; overflow:auto; }
.path-stage .synergy-reason { height:66px; overflow:auto; }
.skill-node { min-height:155px; }
.blueprint-controls { display:flex; align-items:center; gap:10px; flex-wrap:wrap; min-height:48px; }
.blueprint-controls strong { color:var(--gold); margin-right:auto; }
.slot-editor { display:grid; gap:5px; font-size:.75rem; margin:10px 0; }
.slot-editor select { width:100%; min-width:0; }
.customization-impact { font-size:.78rem; color:var(--blue); }
.power-detail-panel { position:fixed; z-index:50; right:20px; bottom:20px; width:min(360px,calc(100vw - 40px)); max-height:60vh; overflow:auto; background:var(--panel2); border:1px solid var(--gold); border-radius:14px; padding:20px; box-shadow:0 10px 40px #16131626; }
.detail-close { display:block; margin-left:auto; margin-bottom:12px; }
.power-info { font-size:.7rem; padding:6px 10px; margin-top:8px; }
#progression { min-height:245px; }
#heroCard { min-height:48px; max-height:80px; overflow:auto; }
#slots { max-height:250px; overflow:auto; }
@media(max-width:560px) { #buildExplorer { height:900px; } .chaos-title-row { min-height:150px; } .power-detail-panel { right:10px; bottom:10px; width:calc(100vw - 20px); box-sizing:border-box; } .blueprint-controls button { font-size:.7rem; padding:8px; } }

body { overflow-anchor:none; }
.cards { max-height:650px; overflow:auto; }

.recommended-cascade { height:60px; box-sizing:border-box; flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden; }
.recommended-cascade .mini-choice { flex-shrink:0; }
.chaos-area .compact-build-header { height:150px; box-sizing:border-box; overflow:auto; }

.compact-fit-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.compact-fit-row h3 { margin:0; font-size:.95rem; }
.compact-fit-row .fit-score { font-size:1.6rem; }
#perfectBlueprintFit { height:90px; overflow:auto; }
#myBuildFit { height:115px; overflow:auto; }
#powerSelection { height:440px; overflow:hidden; margin-bottom:12px; }
.selection-tools { display:flex; gap:8px; height:44px; }
.selection-tools input { min-width:0; flex:1; }
.selection-tools button { font-size:.75rem; padding:6px 10px; }
.power-table-scroll { height:345px; overflow:auto; overscroll-behavior:contain; }
.power-selection-table { width:100%; border-collapse:collapse; font-size:.75rem; }
.power-selection-table th { position:sticky; top:0; background:var(--panel2); z-index:2; text-align:left; }
.power-selection-table td,.power-selection-table th { padding:7px 8px; border-bottom:1px solid var(--line); }
.power-selection-table input { width:18px; height:18px; accent-color:var(--gold); }
.power-selection-table .icon-label { gap:6px; }
.row-status { font-size:.65rem; width:110px; color:var(--gold); }
.player-selected { background:#28649b0d; }
.temporarily-inactive { opacity:.65; background:#746c7208; }
.selection-capacity,.compact-score-explanation { font-size:.75rem; margin:6px 0; }
.optional-pathway>summary { cursor:pointer; min-height:40px; }
.optional-pathway #buildExplorer { height:600px; }
.chaos-title-row { min-height:40px; }
#progression { min-height:245px; }
@media(max-width:560px) { .selection-tools { flex-wrap:wrap; height:88px; } .selection-tools input { flex-basis:100%; } #powerSelection { height:484px; } .effect-cell { display:none; } .power-selection-table th:nth-child(3) { display:none; } .power-selection-table td { padding:7px 4px; } .row-status { width:80px; } }

#powerSelection>.mini-note { height:34px; overflow:auto; margin:8px 0; }

/* Reference sketch: compact picker, two build rows, and aligned summaries. */
.site-header { padding-top:20px; padding-bottom:8px; }
.site-header .brand-row { margin-bottom:12px; }
.site-header h1 { font-size:clamp(1.8rem,3vw,2.6rem); margin:8px 0; }
.site-header .intro { font-size:.9rem; margin:8px 0; }
.hero-explorer { margin-bottom:16px; }
.hero-explorer h2 { font-size:1.1rem; margin:4px 0; }
.roster-notes { font-size:.7rem; color:var(--muted); }
.roster-notes summary { cursor:pointer; padding:4px 0; }
.explorer-toolbar { margin:10px 0; gap:8px; }
.explorer-toolbar label span { margin-bottom:4px; font-size:.7rem; }
.hero-gallery { grid-template-columns:repeat(10,minmax(0,1fr)); gap:6px; }
.hero-gallery .portrait { height:48px; }
.hero-gallery .hero-tile-body { padding:6px 3px; gap:3px; }
.hero-gallery .hero-name { font-size:.68rem; }
.hero-gallery .hero-role,.hero-gallery .availability { font-size:.52rem; }
.chaos-area { display:grid; grid-template-columns:minmax(0,1fr) 220px; grid-template-areas:'heading heading' 'paths paths' 'ideal idealSummary' 'pace idealSummary' 'mine mySummary' 'talents mySummary' 'tree tree' 'settings settings'; column-gap:20px; row-gap:10px; }
.chaos-area[hidden] { display:none; }
.chaos-title-row { grid-area:heading; min-height:0; margin:0; }
.chaos-title-row>h2 { font-size:1.15rem; }
#pathNavigation { grid-area:paths; }
#perfectBlueprintFit { grid-area:ideal; height:170px; border-left:3px solid var(--orange); padding-left:14px; }
#progression { grid-area:pace; min-height:0; height:240px; overflow:auto; border-left:3px solid var(--orange); padding:4px 0 4px 14px; }
#myBuildFit { grid-area:mine; height:160px; border-left:3px solid var(--blue); padding-left:14px; }
#myBuildFit .fit-score { color:var(--blue); }
#powerSelection { grid-area:talents; }
.optional-pathway { grid-area:tree; }
.chaos-area>.compact-build-header { grid-area:settings; }
#idealHeroSummary { grid-area:idealSummary; }
#myHeroSummary { grid-area:mySummary; }
.condensed-summary { border:1px solid var(--line); border-top:3px solid var(--orange); border-radius:10px; padding:14px; overflow:auto; font-size:.8rem; height:240px; box-sizing:border-box; margin-top:8px; }
.condensed-summary.player-summary { border-top-color:var(--blue); height:310px; }
.summary-hero { display:flex; align-items:center; gap:8px; margin:0 0 10px; font-size:.95rem; }
.summary-label { color:var(--gold); font-weight:700; margin:6px 0; }
.player-summary .summary-label { color:var(--blue); }
.summary-power-list { padding-left:16px; font-size:.72rem; line-height:1.7; }
.numbered-picks { display:flex; gap:7px; padding:0; margin:10px 0 0; list-style:none; overflow-x:auto; height:66px; }
.numbered-pick { flex:0 0 48px; }
.pick-button { display:grid; justify-items:center; gap:3px; padding:4px; width:48px; height:58px; border-color:var(--orange); background:#ffffff; }
.player-picks .pick-button { border-color:var(--blue); }
.pick-number { font-size:.6rem; line-height:1; color:var(--gold); }
.player-picks .pick-number { color:var(--blue); }
.empty-pick { color:var(--muted); font-size:1.1rem; }
.inactive-pick { opacity:.4; }
.compact-fit-row .fit-score { font-size:1.45rem; }
@media(max-width:850px) { .hero-gallery { grid-template-columns:repeat(5,minmax(0,1fr)); } .chaos-area { grid-template-columns:minmax(0,1fr) 180px; column-gap:12px; } .numbered-picks { gap:5px; } }
@media(max-width:600px) { .chaos-area { grid-template-columns:minmax(0,1fr); grid-template-areas:'heading' 'paths' 'ideal' 'pace' 'mine' 'talents' 'idealSummary' 'mySummary' 'tree' 'settings'; } .condensed-summary,.condensed-summary.player-summary { height:155px; margin:0; } .hero-gallery .portrait { height:44px; } .hero-gallery .hero-name { font-size:.64rem; } .compact-fit-row h3 { font-size:.8rem; } }

[hidden] { display:none !important; }
.chaos-area #progression { height:175px; }

.chaos-area #progression { height:140px; overflow:hidden; }
.level-ticks { display:flex; justify-content:space-between; margin-left:55px; font-size:.7rem; color:var(--muted); }
.power-selection-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.talent-choice { border:1px solid var(--line); border-radius:8px; padding:9px; min-width:0; height:195px; box-sizing:border-box; overflow:hidden; }
.talent-choice-heading { display:flex; gap:6px; align-items:center; font-size:.7rem; }
.talent-choice-heading input { flex-shrink:0; width:16px; height:16px; accent-color:var(--gold); }
.talent-choice-heading .icon-label { gap:4px; font-size:.7rem; }
.talent-effect { font-size:.7rem; line-height:1.4; height:57px; overflow:hidden; margin:8px 0; }
.talent-metadata { font-size:.6rem; color:var(--muted); height:34px; overflow:auto; margin:4px 0; }
@media(max-width:1000px) { .power-selection-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:560px) { .power-selection-grid { grid-template-columns:minmax(0,1fr); } .talent-choice { height:170px; } }

#perfectBlueprintFit { height:390px; }
.ideal-power-info { width:100%; border-collapse:collapse; font-size:.68rem; margin-top:8px; }
.ideal-power-info caption { text-align:left; color:var(--muted); font-size:.65rem; padding-bottom:5px; }
.ideal-power-info td { padding:5px 6px; border-bottom:1px solid var(--line); vertical-align:top; }
.ideal-power-info .ideal-power-name { font-weight:700; min-width:95px; }
.ideal-power-info .rarity-common { color:var(--green); }
.ideal-power-info .rarity-epic { color:var(--purple); }
.ideal-power-info .rarity-legendary { color:var(--gold); }
.condensed-summary.ideal-summary { height:280px; }
.chaos-area.adventure-mode { grid-template-areas:'heading heading' 'paths paths' 'pace pace' 'mine mySummary' 'talents mySummary' 'tree tree' 'settings settings'; }
@media(max-width:600px) { .chaos-area.adventure-mode { grid-template-areas:'heading' 'paths' 'pace' 'mine' 'talents' 'mySummary' 'tree' 'settings'; } .ideal-power-info { font-size:.62rem; } .ideal-power-info td { padding:4px; } }

.chaos-area { grid-template-areas:'heading heading' 'paths paths' 'ideal idealSummary' 'mine mySummary' 'talents mySummary' 'tree tree' 'settings settings'; }
.chaos-area.adventure-mode { grid-template-areas:'heading heading' 'paths paths' 'mine mySummary' 'talents mySummary' 'tree tree' 'settings settings'; }
@media(max-width:600px) { .chaos-area { grid-template-areas:'heading' 'paths' 'ideal' 'mine' 'talents' 'idealSummary' 'mySummary' 'tree' 'settings'; } .chaos-area.adventure-mode { grid-template-areas:'heading' 'paths' 'mine' 'talents' 'mySummary' 'tree' 'settings'; } }

/* Inline build identities and full-width information tables. */
.chaos-area,.chaos-area.adventure-mode { grid-template-columns:minmax(0,1fr); grid-template-areas:'heading' 'paths' 'ideal' 'mine' 'talents' 'tree' 'settings'; }
.chaos-area.adventure-mode { grid-template-areas:'heading' 'paths' 'mine' 'talents' 'tree' 'settings'; }
#perfectBlueprintFit,#myBuildFit { display:grid; grid-template-columns:240px minmax(0,1fr); grid-template-rows:34px 30px 24px 88px minmax(0,1fr); column-gap:18px; height:400px; box-sizing:border-box; overflow:auto; align-content:start; }
#myBuildFit { height:365px; }
#perfectBlueprintFit>.compact-fit-row,#myBuildFit>.compact-fit-row { grid-column:1/-1; grid-row:1; }
#perfectBlueprintFit>.mini-note,#myBuildFit>.selection-capacity { grid-column:1/-1; grid-row:2; margin:0; overflow:auto; }
#perfectBlueprintFit>.compact-score-explanation,#myBuildFit>.compact-score-explanation { grid-column:1/-1; grid-row:3; margin:0; }
.compact-score-explanation[open] { position:relative; z-index:5; background:var(--panel2); padding:8px; max-height:180px; overflow:auto; }
#perfectBlueprintFit>.numbered-picks,#myBuildFit>.numbered-picks { grid-column:2; grid-row:4; align-self:center; margin:0; }
#perfectBlueprintFit>.ideal-power-info,#myBuildFit>.ideal-power-info { grid-column:1/-1; grid-row:5; align-self:start; table-layout:fixed; }
.ideal-power-info td:first-child { width:22px; }
.ideal-power-info td:nth-child(2) { width:155px; }
.ideal-power-info td:nth-child(3) { width:80px; }
.ideal-power-info td:last-child { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#idealHeroSummary,#myHeroSummary { grid-column:1; grid-row:4; height:78px; margin:0; padding:8px; overflow:hidden; }
.condensed-summary .summary-hero { margin:0 0 6px; }
.condensed-summary .summary-label { font-size:.7rem; margin:0; }
.condensed-summary>p:not(.summary-label),.condensed-summary>.summary-power-list { display:none; }
.empty-build-row td { color:var(--muted); padding-top:16px; }
@media(max-width:600px) {
 #perfectBlueprintFit,#myBuildFit { grid-template-columns:150px minmax(0,1fr); column-gap:10px; }
 .ideal-power-info td:nth-child(2) { width:105px; }
 .ideal-power-info td:nth-child(3) { width:55px; }
 .summary-hero { font-size:.8rem; }
}

/* Dense three-column talent picker: seven rows in the existing viewport. */
.power-selection-grid { gap:3px 8px; }
.talent-choice { position:relative; height:46px; padding:3px 6px; border-radius:4px; display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-rows:22px 15px; gap:1px 6px; }
.talent-choice-heading { grid-column:1; grid-row:1; min-width:0; gap:5px; }
.talent-choice-heading .icon-label { font-size:.65rem; white-space:nowrap; overflow:hidden; }
.talent-choice-heading .icon-label>span { overflow:hidden; text-overflow:ellipsis; overflow-wrap:normal; }
.talent-choice-heading .game-icon { width:20px !important; height:20px !important; padding:1px; box-sizing:border-box; }
.talent-choice-heading .game-icon img { width:16px !important; height:16px !important; }
.talent-effect { grid-column:1; grid-row:2; height:auto; margin:0; font-size:.62rem; line-height:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.talent-metadata { display:none; }
.talent-choice .power-info { grid-column:2; grid-row:1/3; align-self:center; margin:0; padding:4px 5px; min-height:28px; font-size:.6rem; }
.talent-choice.player-selected { border-color:var(--blue); }
@media(max-width:1000px) { .talent-choice { height:46px; } }
@media(max-width:560px) { .talent-choice { height:54px; grid-template-rows:27px 17px; } .talent-choice-heading input { width:22px; height:22px; } .talent-choice .power-info { min-height:40px; } }