:root{color-scheme:dark;--bg:#181a1e;--fg:#eeece5;--muted:#b4b5bb;--line:#3b3e45;--soft:#22252a;--accent:#c7b58a;--accent-fg:#191b1f;--warn-bg:#342d20;--warn-line:#ba9656;--ok-bg:#233d31;--bad-bg:#46272c;--client-bg:#263749;--w:88rem}
body{font-size:15px;font-variant-numeric:tabular-nums}a{text-underline-offset:3px}a:hover{color:#eee0b9}button:hover,.button:hover{background:#e0cca0;color:#181a1e}
:focus-visible{outline:2px solid #e3c88a!important;outline-offset:3px!important}
input,select{background:#191b20;color:var(--fg);font:inherit;border:1px solid #686b73;border-radius:5px;padding:.45rem .6rem;max-width:100%}
[hidden]{display:none!important}.view-switch a{background:var(--soft)}.view-switch{font-size:.8rem}.view-switch .muted{display:none}.bar{gap:1.25rem}.brand{font-size:1.3rem;letter-spacing:-.04em}
main{padding-top:1.15rem}h1{font-size:1.85rem;letter-spacing:-.025em}h2{font-size:1.05rem;font-weight:650}h3{font-size:.94rem;margin:.8rem 0 .3rem}.eyebrow{text-transform:none;letter-spacing:0;font-size:.85rem}.entity-head{padding-bottom:.6rem}.entity-head .tags:has(.tag.dev-detail:only-child){margin:.2rem 0}.entity-head .subtitle{font-size:.95rem}.crumbs{margin-bottom:.45rem}.toc{margin:.65rem 0 1rem}.toc a{text-decoration:none;color:var(--muted)}.toc a:hover{color:var(--fg)}
.modules{display:grid;gap:.85rem;margin:1rem 0}.modules>*{min-width:0}
.module-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;align-items:start}
.module-col{display:flex;flex-direction:column;gap:.85rem;min-width:0}
.module-stack{columns:2 24rem;column-gap:.85rem}.module-stack>.panel{break-inside:avoid;margin:0 0 .85rem}.module-stack>.panel:last-child{margin-bottom:0}
.panel{min-width:0;margin:0;padding:.9rem 1rem;border:1px solid var(--line);border-radius:7px;background:var(--soft);overflow-wrap:anywhere}
.panel h2{font-size:1rem;border:0;border-bottom:1px solid var(--line);padding:0 0 .45rem;margin:0 0 .7rem}.panel h3{font-size:.85rem;font-weight:650;color:var(--muted);margin:.95rem 0 .35rem}.panel h3:first-child{margin-top:0}.panel p{margin:.35rem 0 .6rem}.panel ul.rel{margin:.2rem 0 .4rem}.panel ul.rel li{margin:.3rem 0}.panel ul.rel ul.rel{margin:.2rem 0}.panel .table-wrap{margin:.3rem 0}.panel>details>summary{font-size:1rem}.panel .subtle,.panel small{color:var(--muted)}.panel .facts{grid-template-columns:minmax(6rem,max-content) minmax(0,1fr);font-size:.94rem;gap:.25rem 1rem}.panel .facts dt{font-size:.9em}.panel li{margin:.4rem 0}.panel .cols{columns:auto}
.panel>details>summary{font-weight:650}.panel .ev{font-size:.82rem}.panel .ev>ul{margin-top:.3rem}.panel details .ev{margin:.25rem 0}.stat-lines{list-style:none;padding:0;margin:.4rem 0;font-size:1.06rem}.stat-lines li{padding:.12rem 0;color:#e9eddd}.stat-lines li:first-child{color:var(--fg)}
.quality-0{color:#b6b6b6;--q:#b6b6b6}.quality-1{color:#eeece5;--q:#eeece5}.quality-2{color:#67d66c;--q:#67d66c}.quality-3{color:#69b6ff;--q:#69b6ff}.quality-4{color:#c58bff;--q:#c58bff}.quality-5{color:#ffb35a;--q:#ffb35a}.quality-6{color:#e6cc80;--q:#e6cc80}.quality-7{color:#00ccff;--q:#00ccff}
a[class*=quality-]:any-link{color:var(--q)}a[class*=quality-]:hover{color:var(--q);filter:brightness(1.25)}
summary{cursor:pointer}details>summary{padding:.3rem 0}details[open]>summary{margin-bottom:.5rem}.more-rows,.more-link{margin-top:.6rem}.more-link{display:inline-block;font-weight:600}.more-rows summary{color:var(--accent);font-size:.9rem}.data-details{background:var(--soft);border:1px solid var(--line);margin-top:1.2rem}.tools{margin:1rem 0;background:var(--soft)}.Mixed{background:#373042}.card{background:var(--soft);cursor:pointer}.card:hover{background:#2c2f35;border-color:var(--accent)}.card strong{margin-bottom:.2rem}.card .muted{font-size:.9rem}.table-wrap{font-size:.93rem}th,td{border-width:0 0 1px;padding:.4rem .5rem}.hero{padding:.5rem 0}.state{font-size:.9rem;border-left-width:2px}.spell-description{max-width:70ch;line-height:1.65}.tags:empty{display:none}
.site-search{position:relative;max-width:49rem}.site-search input[type=search]{font-size:.95rem}.site-search button{font-size:.9rem}.search-popover{position:absolute;z-index:30;top:calc(100% + .5rem);left:0;width:100%;display:grid;grid-template-columns:minmax(0,1fr);background:#24272d;border:1px solid #656263;border-radius:7px;box-shadow:0 12px 32px #0008}.search-popover ul{list-style:none;margin:0;padding:.35rem}.search-popover li{border-radius:4px;margin:0;border:1px solid transparent}.search-popover li>a{display:block;padding:.5rem .65rem;color:inherit;text-decoration:none;border-radius:4px;overflow:hidden}.search-popover li>a:focus-visible{outline:2px solid #c7b58a;outline-offset:-2px}.search-popover li[aria-selected=true]{background:#36383d;border-color:#908369}.search-popover li strong{display:block;font-size:.96rem}.suggest-context{display:block;font-size:.83rem;color:var(--muted)}.suggest-type{float:right;font-size:.78rem;color:#e2d1a9;padding-left:.7rem}.all-results{display:block;padding:.6rem 1rem;border-top:1px solid var(--line);font-size:.9rem}.search-preview{position:absolute;left:calc(100% + .6rem);top:0;width:20rem;max-height:65vh;overflow:auto;border:1px solid #656263;border-radius:7px;background:#24272d;padding:1rem;box-shadow:0 12px 32px #0006}
.search-preview h2,.entity-preview h2{font-size:1.1rem;line-height:1.3;border:0;margin:.25rem 0 .5rem}.search-preview p,.entity-preview p{margin:.35rem 0}.search-preview .facts,.entity-preview .facts{font-size:.88rem;grid-template-columns:max-content 1fr}.search-preview .dev-detail,.entity-preview .dev-detail{display:none}.preview-note{font-size:.8rem;color:var(--muted);padding-top:.65rem;border-top:1px solid var(--line)}.entity-preview{position:fixed;z-index:40;width:20rem;max-width:calc(100vw - 1rem);max-height:60vh;overflow:auto;background:#24272d;border:1px solid #77716a;border-radius:7px;padding:1rem;box-shadow:0 10px 28px #0008}.entity-preview .close-preview{float:right;background:transparent;color:var(--fg);border:0;padding:.1rem .45rem;font-size:1.1rem}.entity-preview .preview-body{clear:both}
.advanced-filters{flex-basis:100%;margin:.3rem 0}.advanced-filters>div{display:flex;gap:.8rem;flex-wrap:wrap;padding:.4rem 0}.advanced-filters label{display:grid;gap:.25rem;font-size:.88rem}.filter-form label{align-self:center}.filter-form .filters{flex-basis:100%}.filter-form .filters label{cursor:pointer;border:1px solid var(--line);border-radius:20px;padding:.2rem .55rem}.filter-form input[type=radio]{accent-color:#c7b58a}.filter-form input[type=number]{width:7rem}.tab-buttons{display:flex;gap:.3rem;margin-bottom:.5rem}.tab-buttons button{background:transparent;color:var(--muted);border-color:var(--line);padding:.25rem .6rem}.tab-buttons button[aria-selected=true]{background:#383a3e;color:var(--fg)}
body[data-view=public] .tags>li:has(>.dev-detail:only-child){display:none}
body[data-view=public] .tags:has(>li:only-child>.dev-detail:only-child){display:none}
@media(min-width:75rem){.site-search{max-width:42rem}}
@media(max-width:74.99rem){.search-preview{display:none!important}.bar{gap:.6rem}.view-switch{margin-left:auto}}
@media(max-width:59.99rem){.module-split{grid-template-columns:minmax(0,1fr)}.module-stack{columns:1}}
@media(max-width:47.99rem){.modules,.module-split,.module-col{gap:.65rem}.module-stack>.panel{margin-bottom:.65rem}.panel{padding:.85rem}.bar{padding:.65rem .75rem}.brand{flex:1}.site-search{order:3;flex-basis:100%;max-width:none}.view-switch{margin-left:0}.entity-preview{display:none!important}h1{font-size:1.55rem}.toc ul{gap:.4rem .8rem}.panel .facts{grid-template-columns:minmax(5rem,max-content) minmax(0,1fr)}.facts dt{margin-top:0}.panel .facts dd{margin:0}.site-footer{padding:.8rem}.search-popover li>a{padding:.7rem .6rem;min-height:2.75rem}.ov-row{flex-wrap:wrap}}
.item-overview{font-size:.98rem;max-width:24rem}
.ov-group+.ov-group{margin-top:.7rem;padding-top:.7rem;border-top:1px solid var(--line)}
.panel .ov-line,.panel .ov-row{margin:.15rem 0}
.ov-row{display:flex;justify-content:space-between;gap:.25rem 1.2rem}
.ov-stat{color:#e9eddd}
.ov-effect{color:#9fd68b}
.craft-summary h3{margin:.2rem 0 .4rem}.craft-recipe+.craft-recipe,.more-rows .craft-recipe{margin-top:.8rem;padding-top:.7rem;border-top:1px solid var(--line)}
.craft-recipe h4{margin:.5rem 0 .2rem;font-size:.88rem;color:var(--muted);font-weight:600}
.craft-recipe .materials{list-style:none;padding:0;margin:.2rem 0 .5rem}
.more-rows{position:relative}.more-rows>.more-toggle{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.more-rows>.more-toggle:not(:checked)~.more-body,.more-rows>.more-toggle:not(:checked)~ul .more-item,.more-rows>.more-toggle:not(:checked)~.table-wrap .more-item{display:none}
.more-label{display:inline-block;margin-top:.45rem;color:var(--accent);font-size:.9rem;font-weight:600;cursor:pointer}.more-label:hover{color:#eee0b9;text-decoration:underline}
.more-toggle:focus-visible~.more-label{outline:2px solid #e3c88a;outline-offset:3px;border-radius:3px}
.more-toggle:checked~.more-label .when-closed,.more-toggle:not(:checked)~.more-label .when-open{display:none}
.entity-table{margin:.4rem 0 1rem}.entity-table[aria-busy=true]{opacity:.6}
.et-toolbar{display:flex;flex-wrap:wrap;gap:.5rem .75rem;align-items:end;margin:.4rem 0}.et-toolbar .et-search{flex:1 1 14rem;min-width:10rem}.et-select{display:grid;gap:.2rem;font-size:.82rem;color:var(--muted)}
.et-chips{margin:.2rem 0 .4rem}.et-count{font-size:.86rem;color:var(--muted);margin:.3rem 0}.et-count-badge{color:var(--muted);font-size:.8em;margin-left:.2rem}
.et-sort{color:inherit;text-decoration:none;white-space:nowrap}.et-sort:hover{text-decoration:underline}.et-arrow{color:var(--muted);font-size:.8em}
.entity-table th.num,.entity-table td.num{text-align:right;width:1%;white-space:nowrap}.entity-table th.num .et-sort{display:inline-block}
.entity-table tbody th.et-rowhead{font-weight:inherit;background:transparent;text-align:left}
.et-contained .table-wrap{max-height:min(32rem,70vh);overflow:auto}.et-sticky thead th{position:sticky;top:0;z-index:2;background:var(--soft)}
#instance-loot table{min-width:48rem}#instance-quests table{min-width:64rem}
#instance-loot th,#instance-loot td,#instance-quests th,#instance-quests td{overflow-wrap:normal}
.et-pager{display:flex;flex-wrap:wrap;gap:.3rem;align-items:center;margin:.6rem 0}.et-pager a,.et-pager .et-current{min-width:2rem;text-align:center;padding:.2rem .5rem;border:1px solid var(--line);border-radius:5px;text-decoration:none}
.et-pager .et-current{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.src{display:inline-block;padding:0 .5rem;border:1px solid var(--line);border-radius:99px;font-size:.8rem;margin-right:.2rem;white-space:nowrap}
.src-trainer{border-color:#6a8aa0}.src-vendor{border-color:#8aa06a}.src-drop{border-color:#ba9656}.src-quest{border-color:#a06a8a}.src-item{border-color:#8a8f99}
.group-heading{margin:1.2rem 0 .3rem;font-size:.98rem;color:var(--muted);border:0}.zone-line{margin:.3rem 0}.recipe-link{margin:.2rem 0 .4rem}
.class-swatch{display:inline-block;width:1em;height:1em;border-radius:3px;vertical-align:-.15em;border:1px solid rgba(255,255,255,.35)}
/* Talent trees are one comparison surface: always three equal columns while each tree stays readable (deliberately not auto-fit),
   a swipeable horizontal strip below 48rem. Positions are grid fractions from ClassTalents; the pitch ratios 1.6/1.5 match
   ClassTalents.NodeWidthInCells/NodeHeightInCells so connector endpoints land on node edges. */
.talent-panels { --talent-node: 46px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.talent-panel { min-width: 0; padding: 8px 6px 12px; border: 1px solid var(--line); border-radius: 8px; background: #121820; }
.talent-panel h3 { margin: 0 0 6px; text-align: center; color: var(--fg); font-size: .95rem; }
.talent-canvas { --pitch-x: calc(var(--talent-node) * 1.6); --pitch-y: calc(var(--talent-node) * 1.5); position: relative; margin: 0 auto;
  width: calc(var(--cols) * var(--pitch-x)); height: calc(var(--rows) * var(--pitch-y)); }
.talent-edges { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.talent-edges path { fill: none; stroke: #9c7f45; stroke-width: 3px; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.talent-node { position: absolute; width: var(--talent-node); height: var(--talent-node); transform: translate(-50%, -50%); padding: 0; margin: 0;
  border: 2px solid #8a8f99; border-radius: 6px; background: #1d2633; color: #c9c3b0; cursor: pointer; font: inherit; }
.talent-node:hover { border-color: #f0cc78; background: #243042; color: #f2e6c4; }
.talent-node.talent-passive { border-radius: 50%; }
.talent-node.talent-active { border-color: #b89856; }
.talent-node:focus-visible { outline: 2px solid #f0cc78 !important; outline-offset: 3px !important; }
.talent-node[data-pinned] { border-color: #f0cc78; box-shadow: 0 0 0 2px #f0cc7866; }
.talent-icon { display: grid; place-items: center; width: 100%; height: 100%; font-size: calc(var(--talent-node) * .34); font-weight: 650; letter-spacing: .02em;
  overflow: hidden; white-space: nowrap; pointer-events: none; }
.talent-rank { position: absolute; right: -9px; bottom: -8px; min-width: 24px; padding: 0 3px; border: 1px solid #555a63; border-radius: 4px;
  background: #0b0d10; color: #e8d39d; font-size: 11px; line-height: 15px; font-weight: 600; text-align: center; pointer-events: none; }
.talent-index { margin-top: 10px; }
.talent-index-trees { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 0 1rem; }
.talent-index h4 { margin: .4rem 0 .2rem; font-size: .88rem; color: var(--muted); }
.talent-index ul { margin: 0; padding-left: 1.1rem; font-size: .9rem; }
.talent-index li { margin: .15rem 0; }
@media (max-width: 74.99rem) { .talent-panels { --talent-node: 40px; gap: 8px; } .talent-panel { padding: 6px 2px 10px; } }
@media (max-width: 59.99rem) { .talent-panels { --talent-node: 34px; gap: 6px; } .talent-rank { right: -8px; font-size: 10px; min-width: 21px; line-height: 13px; } }
@media (max-width: 47.99rem) {
  .talent-panels { --talent-node: 40px; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; padding-bottom: 6px; }
  .talent-panel { flex: 0 0 auto; width: calc(4 * 1.6 * var(--talent-node) + 20px); max-width: 88%; scroll-snap-align: start; }
}

/* Game-style tooltip shell (GameTooltip): dark, compact, client text hierarchy. Used in hover previews and talent tooltips. */
.wow-tooltip { max-width: 22rem; padding: 8px 10px; border: 1px solid #5f6672; border-radius: 4px; background: #070b14f2; color: #fff;
  font-size: .86rem; line-height: 1.35; box-shadow: 0 6px 18px #000a; text-align: left; overflow-wrap: break-word; }
.wow-tooltip .wt-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.wow-tooltip .wt-title { margin: 0 0 2px; padding: 0; border: 0; font-size: 1rem; font-weight: 600; line-height: 1.3; color: #fff; }
.wow-tooltip .wt-title[class*=quality-] { color: var(--q); }
.wow-tooltip .wt-title-right { color: #9d9d9d; white-space: nowrap; }
.wow-tooltip p { margin: 1px 0; }
.wow-tooltip .wt-row, .wow-tooltip .ov-row { display: flex; justify-content: space-between; gap: .25rem 1.4rem; }
.wow-tooltip .ov-line.muted, .wow-tooltip .wt-note { color: #9d9d9d; }
.wow-tooltip .ov-stat { color: #fff; }
.wow-tooltip .ov-effect { color: #1eff00; }
.wow-tooltip .wt-desc { margin-top: 4px; color: #ffd100; }
.wow-tooltip .wt-req { color: #d8d8d8; }
.wow-tooltip .wt-choice { margin-top: 6px; font-weight: 600; }
.wow-tooltip .wt-note { margin-top: 4px; font-size: .8rem; }
.wow-tooltip a { color: #8fc0ff; }
/* Inside the shared overlay the aside itself becomes the tooltip frame. */
.entity-preview:has(> .preview-body > .wow-tooltip) { width: auto; max-width: min(22rem, calc(100vw - 1rem)); padding: 8px 10px; border-color: #5f6672; border-radius: 4px; background: #070b14f5; }
.entity-preview > .preview-body > .wow-tooltip { max-width: none; padding: 0; border: 0; background: none; box-shadow: none; }
.entity-preview:has(> .preview-body > .wow-tooltip) .close-preview { position: absolute; top: 2px; right: 2px; float: none; }
.entity-preview .wt-head { padding-right: 1.3rem; }
.entity-preview .preview-source { margin: 6px 0 0; font-size: .8rem; color: var(--muted); }
.entity-preview:has(> .preview-body > .wow-tooltip) .preview-note { margin-top: 6px; padding-top: 5px; }
/* Talent tooltips stay usable on touch screens as a bottom sheet; entity link previews remain desktop-only. */
@media (max-width: 47.99rem) {
  .entity-preview.local-tip { display: block !important; left: 8px !important; right: 8px; top: auto !important; bottom: 8px; max-width: none !important; max-height: 50vh !important; }
  .entity-preview.local-tip[hidden] { display: none !important; }
}
/* Rank disclosure: the whole visible summary is the control (native summary = keyboard Enter/Space). It never wraps, so the column
   cannot shrink it to a sliver under .panel's overflow-wrap:anywhere, and it keeps a 44px touch height. */
.ability-ranks>summary{display:flex;align-items:center;gap:.45rem;box-sizing:border-box;width:100%;min-height:44px;padding:.3rem .5rem;margin:0;list-style:none;white-space:nowrap;cursor:pointer;user-select:none;border:1px solid var(--line);border-radius:5px;background:#1d2024}.ability-ranks>summary::-webkit-details-marker{display:none}.ability-ranks>summary::before{content:'';flex:none;width:0;height:0;border-style:solid;border-width:.3rem 0 .3rem .45rem;border-color:transparent transparent transparent currentColor;transition:transform .12s}.ability-ranks[open]>summary::before{transform:rotate(90deg)}.ability-ranks>summary:hover{border-color:var(--accent);background:#2c2f35}.ability-ranks>summary:focus-visible{outline:3px solid #8dcaff!important;outline-offset:2px!important}.ability-ranks[open]>summary{margin-bottom:.35rem}.ability-ranks ul.rel{margin:.2rem 0 0;padding-left:1.1rem}.ability-ranks li{white-space:nowrap}
.module-header{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap}.module-header h2{margin:0 auto 0 0}.module-header{margin-bottom:1rem}.module-toggle,.module-actions button,.planner-selection button,.planner-transfer button,.planner-tip-controls button{min-height:36px;padding:.35rem .7rem}.module-actions{display:flex;gap:.35rem;flex-wrap:wrap}.module-body[hidden],.planner-transfer[hidden]{display:none}.planner-summary{font-weight:bold}.planner-status{min-height:1.5em;color:#eacb83}.planner-selection{display:flex;align-items:center;gap:.6rem;margin:.75rem 0}.planner-selection span{margin-right:auto}.planner-transfer{margin:1rem 0}.planner-transfer label{display:block}.planner-transfer textarea{display:block;width:100%;box-sizing:border-box;margin:.5rem 0;font-family:monospace}.talent-node[data-state=unavailable]{opacity:.5}.talent-node[data-state=purchased]{border-color:#72b7ef}.talent-node[data-state=maxed]{border-color:#e6bc55;box-shadow:0 0 5px #b88b39}.talent-edges path.edge-purchased{stroke:#e6bc55}.planner-tip-controls{display:flex;gap:.75rem;margin-top:.6rem}.planner-tip-controls button{min-width:44px;min-height:44px}.talent-node:focus-visible,.module-toggle:focus-visible{outline:3px solid #8dcaff;outline-offset:3px}@media(max-width:600px){.module-actions{order:3;width:100%}.planner-selection{flex-wrap:wrap}.module-toggle{min-height:44px}}
.module-header>.planner-transfer{order:4;width:100%}

.module-dashboard{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:.85rem;align-items:start}.module-slot{grid-column:span var(--module-span);min-width:0}.module-slot>.panel{margin:0}@media(max-width:59.99rem){.module-dashboard{grid-template-columns:minmax(0,1fr)}.module-slot{grid-column:1}}
/* Ranked Spell controls wrap within narrow screens; each rank retains a plain GET fallback. */
.spell-family nav { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1rem; }
.spell-family nav a { padding:.35rem .6rem; border:1px solid var(--border,#555); border-radius:.25rem; }
.spell-family nav a[aria-current=true] { color:#ffd100; border-color:#ffd100; }
.spell-rank-comparison table { min-width:50rem; }
.spell-rank-comparison th { white-space:nowrap; }
.spell-rank-comparison td { overflow-wrap:normal; }
.page-actions{margin:.8rem 0 0;display:flex;gap:.5rem;flex-wrap:wrap}.page-action{display:inline-block;min-height:36px;box-sizing:border-box;padding:.4rem .8rem;border:1px solid var(--accent);border-radius:6px;font-weight:600;text-decoration:none}.page-action:hover,.page-action:focus-visible{background:var(--soft)}

/* Identity images are confined to detail/preview headers and talent nodes. */
.context-icon { position: relative; display: inline-grid; place-items: center; flex: 0 0 40px; width: 40px; height: 40px; overflow: hidden; border-radius: 3px; vertical-align: middle; }
.context-icon img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.entity-head h1:has(.context-icon) { display: flex; align-items: center; gap: .6rem; }
.wt-head .context-icon { flex-basis: 28px; width: 28px; height: 28px; }
.talent-icon .context-icon { width: 100%; height: 100%; border-radius: inherit; }
.talent-passive .context-icon { border-radius: 50%; }
.context-icon img.icon-failed { display: none; }

/* Primary navigation: Browse / Tools disclosure menus (details/summary, so no JavaScript is needed) and a direct Map link inside the header bar.
   Panels are absolute overlays: opening one cannot reflow the header. The current section is marked by an underline bar and screen-reader
   text; the current entry by aria-current with an inset bar, never by color alone. Class colors come from ClassPresentation (--class-color). */
.site-header{position:relative}
.primary-nav{flex:none}
.nav-top{display:flex;align-items:center;gap:.15rem;list-style:none;margin:0;padding:0}
.nav-menu{position:relative}
.nav-menu>details>summary,.nav-direct{display:flex;align-items:center;gap:.4rem;min-height:2.5rem;box-sizing:border-box;padding:.35rem .75rem;border-radius:6px;color:var(--fg);font-size:.95rem;font-weight:600;text-decoration:none;white-space:nowrap;cursor:pointer;list-style:none;user-select:none}
.nav-menu>details>summary::-webkit-details-marker{display:none}
.nav-menu>details>summary::after{content:"";border:.28rem solid transparent;border-top-color:currentColor;border-bottom-width:0;margin-top:.1rem}
.nav-menu>details[open]>summary{margin:0}.nav-menu>details[open]>summary::after{transform:rotate(180deg)}
.nav-menu>details>summary:hover,.nav-direct:hover,.nav-menu>details[open]>summary{background:#2c2f35}
.nav-menu>details>summary.is-current,.nav-direct[aria-current]{color:#ecdbaf;box-shadow:inset 0 -2px 0 var(--accent)}
.nav-panel{position:absolute;z-index:45;top:calc(100% + .35rem);left:0;width:min(36rem,calc(100vw - 2rem));max-height:calc(100vh - 7rem);overflow:auto;box-sizing:border-box;padding:.45rem;background:#14171d;border:1px solid var(--line);border-radius:7px;box-shadow:0 12px 32px rgba(0,0,0,.55)}
[data-menu=tools]>.nav-panel{width:min(25rem,calc(100vw - 2rem))}
.nav-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.1rem;list-style:none;margin:0;padding:0}
.nav-links.nav-tools{grid-template-columns:minmax(0,1fr)}
.nav-links>li>a{display:block;padding:.45rem .6rem;border-radius:5px;color:var(--fg);text-decoration:none}
.nav-links>li>a strong{display:block;font-size:.93rem}
.nav-links>li>a small{display:block;margin-top:.05rem;color:var(--muted);font-size:.8rem;line-height:1.35}
.nav-links>li>a:hover,.nav-links>li>a:focus-visible,.class-menu a:hover,.class-menu a:focus-visible{background:#262a32}
.nav-links>li>a[aria-current]{background:#262a32;box-shadow:inset 3px 0 0 var(--accent)}
.class-menu{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.1rem;list-style:none;margin:.1rem 0 .2rem .35rem;padding:0}
.class-menu a{display:flex;align-items:center;gap:.3rem;min-height:2.25rem;padding:.25rem .5rem;border-radius:5px;font-size:.88rem;font-weight:600;color:var(--class-color,var(--fg));text-decoration:none}
.class-menu a[aria-current=page]{background:#262a32;text-decoration:underline;text-underline-offset:3px;box-shadow:inset 3px 0 0 var(--class-color)}
.class-menu-check{display:inline-block;width:1em;text-align:center}
@media(max-width:47.99rem){
.nav-menu{position:static}
.nav-menu>details>summary,.nav-direct{min-height:2.75rem;padding:.35rem .6rem}
.nav-panel,[data-menu=tools]>.nav-panel{left:.5rem;right:.5rem;top:3.35rem;width:auto;max-height:calc(100vh - 5rem)}
.nav-links>li>a,.class-menu a{min-height:2.75rem}
.view-switch{order:4}}
.class-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;list-style:none;margin:1rem 0;padding:0;max-width:34rem}
.class-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;aspect-ratio:1/1;padding:.5rem;text-align:center;background:#14171d;border:1px solid var(--line);border-top:4px solid var(--class-color);border-radius:7px;text-decoration:none;color:var(--fg);transition:border-color .12s,background .12s,transform .12s}
.class-card-name{font-size:1.2rem;font-weight:700;color:var(--class-color);overflow-wrap:anywhere}
.class-card-meta{font-size:.85rem;color:var(--muted)}
.class-card:hover,.class-card:focus-visible{background:#1b1f27;border-color:var(--class-color);transform:translateY(-1px)}
.class-card:active{transform:none}
@media(max-width:23.99rem){.class-card-name{font-size:1rem}}
@media(prefers-reduced-motion:reduce){.class-card{transition:none}.class-card:hover{transform:none}}

/* Quest components use shared node rows, with explicit links for every branch/join. */
.quest-chain { list-style:none; padding:0; margin:.75rem 0; }
.quest-chain-node { padding:.55rem .7rem; border-left:2px solid var(--border,#45505e); border-bottom:1px solid var(--border,#45505e); overflow-wrap:anywhere; }
.quest-chain-node.is-current { border-left:4px solid var(--accent,#d5ab55); background:rgba(213,171,85,.1); }
.quest-chain-name { margin-bottom:.2rem; }
.quest-chain-links { font-size:.875rem; line-height:1.6; }
.quest-chain-group { margin:.15rem 0; }
.quest-chain-warning { margin:.5rem 0; overflow-wrap:anywhere; }


/* Grouped categories: the Browse menu and the homepage render the same groups. Labels are neutral and normal-case; gold is reserved for actions and state. */
.browse-groups{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem 1.5rem}
.browse-group-title{margin:0 0 .35rem;font-size:.8rem;font-weight:600;color:var(--muted)}
.browse-group ul{list-style:none;margin:0;padding:0}
.browse-group a{display:block;padding:.28rem 0;color:var(--fg);text-decoration:none}
.browse-group a:hover,.browse-group a:focus-visible{color:#fff;text-decoration:underline;text-underline-offset:3px}
.browse-group a[aria-current]{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px}
.browse-all{display:inline-block;margin-top:.6rem;font-size:.88rem;color:var(--muted);text-decoration:none}
.browse-all:hover,.browse-all:focus-visible{color:var(--fg);text-decoration:underline}
.browse-all[aria-current]{color:var(--fg);text-decoration:underline;text-decoration-color:var(--accent)}
[data-menu=browse]>.nav-panel{width:min(38rem,calc(100vw - 2rem));padding:.9rem 1rem .7rem}
[data-menu=browse] .browse-group a{padding:.32rem .45rem;margin:0 -.45rem;border-radius:5px}
[data-menu=browse] .browse-group a:hover,[data-menu=browse] .browse-group a:focus-visible{background:#262a32;text-decoration:none}
[data-menu=browse] .browse-all{border-top:1px solid var(--line);display:block;padding-top:.55rem}

/* Public visual system (header, homepage). No ornament without meaning: hierarchy comes from type scale, surface depth, spacing and one hairline per section.
   Type: one display face (a system book serif, no web font) for the wordmark, section titles and tool titles only; the UI sans for everything else.
     wordmark 3.25rem · Atlas 2.5rem · Dungeon 1.75 · Talents 1.6 · section 1.4 · personal 1.3 · tile/continent 1.2 · body 1rem · metadata .9rem.
   Actions: one filled primary on the page (.cta-primary, the Atlas), gold text links with an arrow for every other usable tool (.cta-link), plain inline
     links, and .cta-soon: the same action slot holding a non-interactive "Coming Soon" label (text, never a link, button or focus stop).
   Surfaces: Explore & Plan is cool slate, Build & Progress neutral graphite, Your Adventure a warm dark. Status never changes a card's surface or size,
     only its action slot.
   Layout: a compact masthead, then one tool workspace (Explore & Plan 8 of 12 columns beside Build & Progress 4, sharing rows), Your Adventure, Browse.
   Rhythm: 6-10px inside a group, card interiors by rhythm tier (see Cards), 16-20px between cards, ~28px between sections; one 12-column grid. */
:root{--font-display:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;--ink-2:#d3cfc5;--gap:1.25rem;
  --surface-explore:#1e252c;--surface-explore-2:#1b2127;--edge-explore:#33404b;--surface-build:#222327;--edge-build:#3a3b41;--surface-personal:#221f1b;--edge-personal:#433b2e}

/* Header: typographic wordmark (no mark or icon), quiet labels, the current section as an underline bar. */
.site-header{box-shadow:0 1px 0 #0006}
.brand{font-family:var(--font-display);font-size:1.6rem;font-weight:600;letter-spacing:-.01em;line-height:1;color:var(--fg);padding:.2rem 0}
.brand:hover{color:#f4ecd6}
.bar{gap:1.75rem;min-height:4rem;padding-top:.6rem;padding-bottom:.6rem}
.nav-top{gap:.25rem}
.nav-menu>details>summary,.nav-direct{color:#d6d4cd;font-weight:550}
.nav-menu>details>summary:hover,.nav-direct:hover,.nav-menu>details[open]>summary{color:var(--fg)}
.nav-soon{margin:.45rem .15rem 0;padding:.65rem .45rem .2rem;border-top:1px solid var(--line)}
.nav-soon-title{margin:0 0 .3rem;font-size:.82rem;font-weight:600;color:var(--muted)}
.nav-soon ul{list-style:none;margin:0;padding:0}
.nav-soon li{padding:.3rem 0;color:#b9b8b3;cursor:default}
.nav-soon li strong{display:block;font-size:.9rem;font-weight:600}
.nav-soon li small{display:block;font-size:.8rem;line-height:1.35;color:#9c9da3}

/* Section heads: one hairline, a display-face title with its one-line purpose on the same baseline. */
.section-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem 1rem;margin:0 0 1rem;padding-top:1rem;border-top:1px solid var(--line)}
.section-head h2{margin:0;padding:0;border:0;font-family:var(--font-display);font-size:1.4rem;font-weight:600;line-height:1.2;letter-spacing:-.005em;color:var(--fg)}
.section-head p{margin:0;color:var(--muted);font-size:.95rem}

/* Masthead: identity on the left four columns, the one search (with secondary examples) across the other eight, on one baseline. */
.home-hero{margin:0;padding:1.25rem 0 1.5rem;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:end}
.masthead-id{grid-column:1/span 4}.masthead-search{grid-column:5/-1}
.wordmark{margin:0;font-family:var(--font-display);font-size:3.25rem;font-weight:600;letter-spacing:-.02em;line-height:1}
.home-tagline{margin:.5rem 0 0;color:var(--ink-2);font-size:1rem;line-height:1.45}
.site-search.home-search{max-width:none;gap:0}
.home-search input[type=search]{padding:.85rem 1.1rem;font-size:1.08rem;border-color:#6f727a;border-radius:6px 0 0 6px;background:#121418}
.home-search input[type=search]:focus{border-color:var(--accent)}
.home-search button{padding:.6rem 1.5rem;font-size:1rem;font-weight:600;border:1px solid #6f727a;border-left:0;border-radius:0 6px 6px 0;background:#2a2d33;color:var(--fg)}
.home-search button:hover{background:#34373e;color:var(--fg)}
.search-hints{display:flex;flex-wrap:wrap;gap:.15rem 1rem;margin:.55rem 0 0;font-size:.9rem;color:var(--muted)}
.search-hints a{color:var(--muted);text-decoration:underline dotted;text-underline-offset:3px}
.search-hints a:hover,.search-hints a:focus-visible{color:var(--fg)}

/* Cards (homepage articles carry data-tool). Every card is: title block (title, product name, purpose) · optional content (Atlas geography, class
   picker) · footer row (what it covers on the left, the action slot on the right), and the footer is pinned to the foot. Three rhythms:
     anchor   (Atlas)            padding 1.75rem 1.9rem · title→purpose .7rem · footer 1.1rem above
     standard (Dungeon, Talents) padding 1.4rem 1.6rem  · title→purpose .55rem · footer 1rem above
     compact  (tiles, personal)  padding 1.15rem 1.4rem · title→purpose .45rem · footer .8rem above
   Top and bottom padding are equal within a rhythm. Link actions and the Coming Soon label share one 2.25rem box, so comparable cards put their
   action on the same line whatever its status. */
.tool[data-tool]{position:relative;min-width:0;margin:0;padding:1.4rem 1.6rem;border-radius:6px;display:flex;flex-direction:column;align-items:stretch}
.tool-title{margin:0;font-family:var(--font-display);font-weight:600;line-height:1.12;letter-spacing:-.01em;color:var(--fg)}
.tool-name{margin:.3rem 0 0;font-size:.9rem;color:var(--muted)}
.tool-summary{margin:.55rem 0 0;max-width:34rem;color:var(--ink-2);font-size:1rem;line-height:1.5}
.tool-foot{display:flex;flex-wrap:wrap;align-items:flex-end;align-items:last baseline;justify-content:space-between;gap:.5rem .75rem;margin-top:auto;padding-top:1rem}
.tool-action{flex:none;margin-left:auto}
.tool-facets{display:flex;flex-wrap:wrap;flex:1 1 12rem;min-width:0;gap:.2rem 0;list-style:none;margin:0;padding:0;font-size:.9rem;color:var(--muted)}
.tool-facets li:not(:last-child)::after{content:"·";margin:0 .45rem;color:#6d7078}

.cta-primary{display:inline-flex;align-items:center;gap:.4rem;min-height:2.75rem;box-sizing:border-box;padding:.55rem 1.25rem;border-radius:5px;background:var(--accent);color:var(--accent-fg);font-size:1rem;font-weight:650;text-decoration:none}
.cta-link{display:inline-flex;align-items:center;gap:.4rem;min-height:2.25rem;box-sizing:border-box;color:var(--accent);font-size:1rem;font-weight:650;text-decoration:none}
.cta-link:hover,.cta-link:focus-visible{color:#e6d4a6;text-decoration:underline;text-underline-offset:4px}
.cta-soon{display:inline-flex;align-items:center;min-height:2.25rem;box-sizing:border-box;margin:0;padding:.3rem .95rem;border:1px solid #5a554b;border-radius:99px;color:#d9d0b9;font-size:.9rem;font-weight:600;letter-spacing:.01em;white-space:nowrap;cursor:default;user-select:none}

/* Tool workspace: both families share one grid (rows align across them). Each family section is display:contents so its head and cards are grid items;
   placement is by data-tool. Desktop: Explore & Plan in columns 1-8 (Atlas tall on the left, Dungeon then two tiles stacked on the right),
   Build & Progress in 9-12 (Talents over two rows, Reputation beside the last explore tile). */
.tool-workspace{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1rem var(--gap);align-items:stretch}
.tool-family{display:contents}
.tool-workspace .section-head{margin:0}
.tool-workspace .family-explore>.section-head{grid-column:1/9;grid-row:1}
.tool-workspace .family-build>.section-head{grid-column:9/-1;grid-row:1}
.tool-workspace [data-tool=atlas]{grid-column:1/5;grid-row:2/5}
.tool-workspace [data-tool=dungeon-planner]{grid-column:5/9;grid-row:2}
.tool-workspace [data-tool=quest-planner]{grid-column:5/9;grid-row:3}
.tool-workspace [data-tool=recipe-planner]{grid-column:5/9;grid-row:4}
.tool-workspace [data-tool=talent-planner]{grid-column:9/-1;grid-row:2/4}
.tool-workspace [data-tool=reputation-planner]{grid-column:9/-1;grid-row:4}

.family-explore .tool{background:var(--surface-explore);box-shadow:inset 0 0 0 1px var(--edge-explore)}
.family-explore .tool-tile{background:var(--surface-explore-2)}
.family-build .tool{background:var(--surface-build);box-shadow:inset 0 0 0 1px var(--edge-build)}
.tool-dungeon .tool-title{font-size:1.75rem}

/* Atlas: the anchor. Title and purpose at the top, a short geography line per continent and the primary action at the foot; the open space between
   is the Atlas media area (ProductTools.AtlasArtwork fills the surface under a scrim once real art exists; nothing is drawn there until then).
   The title link covers the surface; the geography links sit above it. */
.family-explore .tool-atlas{isolation:isolate;overflow:hidden;padding:1.75rem 1.9rem;background:linear-gradient(160deg,#243039 0,#1e262d 55%,#1c2025 100%)}
.tool-atlas .tool-title{font-size:2.5rem}
.tool-atlas .tool-summary{margin-top:.7rem;font-size:1.05rem}
.tool-atlas .tool-foot{margin-top:0;padding-top:1.25rem}
.tool-atlas .tool-action{margin-left:0}
.tool-atlas:hover .cta-primary{background:#e0cfa3}
.atlas-art{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.tool-atlas[data-artwork]::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(14,17,22,.94) 0,rgba(14,17,22,.55) 50%,rgba(14,17,22,.3) 100%)}
.tool-cover{color:inherit;text-decoration:none}
.tool-cover::after{content:"";position:absolute;inset:0;z-index:0;border-radius:6px}
.tool-cover:focus-visible{outline:none!important}.tool-cover:focus-visible::after{outline:3px solid #e3c88a;outline-offset:-3px}
.atlas-regions{position:relative;z-index:1;display:grid;gap:.75rem;margin-top:auto;padding-top:1.5rem}
.atlas-region-name{font-family:var(--font-display);font-size:1.2rem;font-weight:600;color:#dccb9f;text-decoration:none}
.atlas-zones{display:flex;flex-wrap:wrap;list-style:none;margin:.15rem 0 0;padding:0;font-size:.95rem}
.atlas-zones li:not(:last-child)::after{content:"·";margin:0 .55rem;color:#6d7880}
.atlas-zones a{color:#e4e1d8;text-decoration:none}
.atlas-regions a:hover,.atlas-regions a:focus-visible{color:#fff;text-decoration:underline;text-underline-offset:3px}

/* Compact tiles (supporting planners) and personal cells. */
.tool[data-tool].tool-tile,.tool[data-tool].tool-personal{padding:1.15rem 1.4rem}
.tool-tile .tool-title{font-size:1.2rem}
.tool-tile .tool-summary,.tool-personal .tool-summary{margin-top:.45rem;font-size:.97rem}
.tool-tile .tool-foot,.tool-personal .tool-foot{padding-top:.8rem}

/* Talents: the class-coloured picker sits directly under the purpose (each class opens its talent trees); the action keeps the footer line. */
.tool-talents .tool-title{font-size:1.6rem}
.class-picks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 1rem;list-style:none;margin:.7rem 0 0;padding:0;width:100%}
.class-picks a{display:flex;align-items:center;gap:.5rem;min-height:2.75rem;font-weight:600;font-size:1rem;color:var(--class-color);text-decoration:none}
.class-picks a::before{content:"";width:3px;height:1.05rem;border-radius:1px;background:var(--class-color);flex:none}
.class-picks a:hover,.class-picks a:focus-visible{text-decoration:underline;text-underline-offset:3px}

/* Your Adventure: one warm personal panel with two compact cells. */
.home-section{margin:1.75rem 0 0}
.personal-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));background:var(--surface-personal);box-shadow:inset 0 0 0 1px var(--edge-personal);border-radius:6px}
.tool-personal+.tool-personal{box-shadow:inset 1px 0 0 var(--edge-personal)}
.tool-personal .tool-title{font-size:1.3rem}

/* Browse: utility navigation, quieter than the tools: the title in the first three columns, a compact block of groups beside it. */
.home-browse{margin:1.75rem 0 1rem;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);border-top:1px solid var(--line)}
.home-browse>.section-head{grid-column:1/span 3;border:0;margin:0;display:block}
.home-browse>.section-head h2{font-size:1.2rem;color:var(--ink-2)}
.home-browse .browse-body{grid-column:4/-1;padding-top:1.1rem}
.home-browse .browse-groups{grid-template-columns:repeat(4,minmax(0,10.5rem));gap:.4rem 2.5rem}
.home-browse .browse-group a{padding:.18rem 0;font-size:.97rem}
.home-browse .browse-group-title{font-size:.86rem}
.home-browse .browse-all{margin-top:.35rem}

/* Below 80rem: Explore & Plan takes the full width (Atlas left half, Dungeon and tiles stacked right), Build & Progress follows as its own row. */
@media(max-width:79.99rem){
.tool-workspace .family-explore>.section-head{grid-column:1/-1;grid-row:1}
.tool-workspace [data-tool=atlas]{grid-column:1/7;grid-row:2/5}
.tool-workspace [data-tool=dungeon-planner]{grid-column:7/-1;grid-row:2}
.tool-workspace [data-tool=quest-planner]{grid-column:7/-1;grid-row:3}
.tool-workspace [data-tool=recipe-planner]{grid-column:7/-1;grid-row:4}
.tool-workspace .family-build>.section-head{grid-column:1/-1;grid-row:5;margin-top:1rem}
.tool-workspace [data-tool=talent-planner]{grid-column:1/-1;grid-row:6}
.tool-workspace [data-tool=reputation-planner]{grid-column:1/-1;grid-row:7}
.tool[data-tool].tool-talents{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);grid-template-rows:1fr auto;column-gap:2rem}
.tool-talents .tool-body{grid-column:1;grid-row:1}.tool-talents .tool-foot{grid-column:1;grid-row:2}.tool-talents .tool-action{margin-left:0}.tool-talents .class-picks{grid-column:2;grid-row:1/3;margin:0;align-self:center}}
/* Tablet: the masthead stacks; Atlas and Dungeon take full rows, the two explore tiles share a row; Talents and Reputation full rows. */
@media(max-width:63.99rem){.home-hero{padding:1.5rem 0 1.5rem;row-gap:1rem}.masthead-id,.masthead-search{grid-column:1/-1}
.tool-workspace [data-tool=atlas]{grid-column:1/-1;grid-row:2}
.tool-workspace [data-tool=dungeon-planner]{grid-column:1/-1;grid-row:3}
.tool-workspace [data-tool=quest-planner]{grid-column:1/7;grid-row:4}
.tool-workspace [data-tool=recipe-planner]{grid-column:7/-1;grid-row:4}
.tool-workspace .family-build>.section-head{grid-row:5}
.atlas-regions{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1.5rem}
.home-browse>.section-head,.home-browse .browse-body{grid-column:1/-1}.home-browse .browse-body{padding-top:.25rem}.home-browse>.section-head{padding-top:1rem;margin-bottom:.75rem}}
/* Phone: one column in reading order (search; Atlas, Dungeon, Quest, Recipe; Talents, Reputation; Your Adventure; Browse). 44px targets. */
@media(max-width:47.99rem){.home-hero{padding:1.25rem 0 1.25rem}.wordmark{font-size:2.6rem}.home-tagline{font-size:.95rem}
.home-search input[type=search]{font-size:1rem;padding:.8rem .85rem}.home-search button{padding:.65rem .95rem}
.tool-workspace{gap:.75rem}.tool-workspace .tool-family>*,.tool-workspace .tool-family>.section-head{grid-column:1/-1;grid-row:auto}.tool-workspace .family-build>.section-head{margin-top:1rem}
.section-head{display:block}.section-head h2{font-size:1.3rem}.section-head p{margin-top:.25rem;font-size:.92rem}
.tool[data-tool]{padding:1.2rem 1.25rem}.family-explore .tool-atlas{padding:1.35rem 1.25rem}.tool-atlas .tool-title{font-size:1.95rem}.tool-dungeon .tool-title{font-size:1.55rem}.tool-talents .tool-title{font-size:1.45rem}
.tool[data-tool].tool-tile,.tool[data-tool].tool-personal{padding:1.05rem 1.2rem}
.atlas-regions{grid-template-columns:minmax(0,1fr);padding-top:1.1rem}.atlas-region-name,.atlas-zones a{display:inline-flex;align-items:center;min-height:2.75rem}
.class-picks a{min-height:2.75rem;display:flex;align-items:center;padding:0}.cta-link,.cta-soon{min-height:2.75rem}
.tool[data-tool].tool-talents{display:flex}.tool-talents .class-picks{margin:.5rem 0 0}.tool-talents .tool-action{margin-left:auto}
.personal-panel{grid-template-columns:minmax(0,1fr)}.tool-personal+.tool-personal{box-shadow:inset 0 1px 0 var(--edge-personal)}
.home-section,.home-browse{margin-top:1.75rem}
.browse-groups,.home-browse .browse-groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem 1.25rem}.browse-group a{min-height:2.75rem;display:flex;align-items:center;padding:0}}
/* Wishlist v1 (browser-local personal state; wishlist.js). Text labels carry every state; color only reinforces them. */
.button-quiet{background:transparent;color:var(--fg);border:1px solid #686b73;padding:.35rem .75rem;min-height:36px}.button-quiet:hover{background:#2f3238;color:var(--fg)}
.button-danger{background:#b4474f;border-color:#b4474f;color:#fff;min-height:36px}.button-danger:hover{background:#cc5a62;color:#fff}
.wishlist-control{margin:.55rem 0 .15rem}.wl-row-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .9rem}
.wl-toggle{min-height:36px;padding:.35rem .85rem;background:transparent;color:var(--fg);border:1px solid #6f727a;font-size:.92rem}
.wl-toggle:hover{background:#2f3238;color:var(--fg)}.wl-toggle.is-on{border-color:var(--accent);color:var(--accent)}.wl-toggle.is-on:hover{color:var(--accent)}
.wl-toggle[disabled],.wl-toggle[aria-disabled=true]{opacity:.7;cursor:progress}.wl-view{font-size:.9rem}
.wl-panel{margin:.5rem 0 0;padding:.7rem .85rem;border:1px solid var(--line);border-radius:7px;background:var(--soft);max-width:38rem}
.wl-edit{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem .75rem;align-items:end}
.wl-field{display:flex;flex-direction:column;gap:.2rem;min-width:0}.wl-field label{font-size:.82rem;color:var(--muted)}
.wl-field-note{grid-column:1/-1}.wl-field textarea{margin:0;font-family:inherit;background:#191b20;color:var(--fg);border:1px solid #686b73;border-radius:5px;padding:.4rem .55rem;resize:vertical}
.wl-edit-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.5rem}.wl-edit-actions button{min-height:36px;padding:.35rem .8rem}
.wl-local-note{margin:.5rem 0 0;font-size:.8rem}.wl-status{margin:.3rem 0 0;font-size:.88rem;color:var(--muted)}.wl-status:empty{display:none}
.wl-unavailable{font-size:.88rem;margin:.4rem 0}
.wl-mark{display:inline-block;font-size:.72rem;padding:0 .4rem;border:1px solid var(--accent);border-radius:99px;color:var(--accent);white-space:nowrap;vertical-align:.08em}
.wishlist-page{margin:1rem 0 1.5rem}.wl-count{margin:.2rem 0 .5rem;font-size:.88rem}
.wl-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.wl-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.2rem 1rem;padding:.6rem .1rem;border-bottom:1px solid var(--line)}
.wl-main{display:flex;flex-direction:column;gap:.1rem;min-width:0;overflow-wrap:anywhere}
.wl-name{font-weight:650;font-size:1rem;text-decoration:none;display:inline-flex;align-items:center;gap:.4rem;align-self:flex-start}.wl-name:hover{text-decoration:underline}
.wl-icon{width:20px;height:20px;border-radius:3px;border:1px solid #000;flex:none}.wl-missing{color:var(--muted)}
.wl-meta,.wl-source{font-size:.86rem;color:var(--muted)}.wl-source a{color:var(--accent)}
.wl-tags{display:flex;flex-wrap:wrap;gap:.3rem;list-style:none;margin:.2rem 0 0;padding:0}.wl-tags .chip{margin:0;font-size:.74rem}
.wl-note{margin:.2rem 0 0;font-size:.9rem;white-space:pre-line}
.wl-actions{display:flex;gap:.4rem;align-items:flex-start}.wl-edit-slot{grid-column:1/-1}.wl-edit-slot:empty{display:none}.wl-edit-slot .wl-edit{margin:.4rem 0 .2rem;padding:.7rem .85rem;border:1px solid var(--line);border-radius:7px;background:var(--soft);max-width:38rem}
.wl-empty{padding:1rem 1.1rem;border:1px solid var(--line);border-radius:7px;background:var(--soft);max-width:38rem}.wl-empty p{margin:.3rem 0}.wl-empty .button{display:inline-block;margin-top:.3rem}.wl-empty:focus{outline:none}
.wl-local{margin-top:2rem;max-width:44rem}.wl-local h2{font-size:.95rem}.wl-local p{font-size:.88rem}
.wl-dialog{max-width:min(28rem,calc(100vw - 2rem));padding:1rem 1.15rem;border:1px solid var(--line);border-radius:8px;background:var(--soft);color:var(--fg)}
.wl-dialog::backdrop{background:rgba(0,0,0,.6)}.wl-dialog h2{border:0;padding:0;margin:0 0 .5rem;font-size:1.05rem}.wl-dialog p{font-size:.92rem}
.wl-dialog-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.5rem;margin-top:.75rem}
@media (max-width:40rem){.wl-item{grid-template-columns:minmax(0,1fr)}.wl-actions{margin-top:.35rem}.wl-edit{grid-template-columns:minmax(0,1fr)}}

/* Item range pairs stay together while groups wrap inside the existing table toolbar. */
.et-filter-group{display:flex;flex-wrap:wrap;gap:.5rem .75rem;border:1px solid var(--line);border-radius:6px;padding:.5rem;min-width:0;max-width:100%;margin:0}
.et-filter-group>legend{font-size:.85rem;color:var(--muted);padding:0 .25rem}
.et-range{display:flex;align-items:center;gap:.35rem;border:0;padding:0;margin:0;min-width:0}
.et-range legend{font-size:.82rem;color:var(--muted);margin-bottom:.2rem}
.et-range input{width:5rem;min-width:0}
.wl-browse-toggle{display:inline-block;background:var(--soft);color:var(--fg);border-color:var(--line);padding:.2rem .5rem;font:inherit;font-size:.75rem;white-space:nowrap;cursor:pointer;margin:.25rem 0}
.wl-browse-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.wl-browse-toggle[aria-pressed=true]{color:var(--accent)}
.wl-browse-toggle[aria-disabled=true]{opacity:.65;cursor:wait}

.wl-browse-toggle:hover{background:var(--line);color:var(--fg)}

.wl-browse-toggle{border-radius:5px;min-height:1.85rem;line-height:1.3;font-size:.8rem;padding:.25rem .55rem;position:relative}
.wl-browse-toggle[aria-pressed=true]{border-color:var(--accent)}
.wl-instance-context{margin:.6rem 0;font-size:.9rem}.wl-instance-context a{display:inline-block;padding:.2rem 0}
.et-filter-notice{color:var(--accent);font-size:.85rem;margin:.4rem 0}
.et-range input::placeholder{color:var(--muted);opacity:1}

/* Provenance status for one factual claim (first consumer: Recipe acquisition). The visible word carries the meaning; colour only reinforces it.
   Forever (teal): supported by evidence from WoW Forever itself. Classic Data (gold): inherited Classic/Vanilla data, not yet confirmed in Forever. */
.provenance{display:inline-block;margin-left:.4rem;padding:.05rem .4rem;border:1px solid;border-radius:3px;font-size:.72rem;font-weight:600;line-height:1.4;letter-spacing:.02em;white-space:nowrap;vertical-align:.06em}
.provenance-forever{color:#86e3d5;border-color:#2f7d72;background:#10302b}
.provenance-classic{color:#f2d27c;border-color:#8a6d22;background:#30270e}