/* Local guides share the Home surface. Ultralight 1.3: use margins for flex spacing. */
.home-nav { display:flex; align-items:center; }
.home-nav .home-site + .home-site { margin-left:20px; }
#home-guides-link svg { margin:0 8px 0 0; }
.home-guides { margin-top:20px; }
.home-guide-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.home-guide-card { display:flex; align-items:center; width:100%; min-height:120px; padding:16px; text-align:left; border:1px solid #494335; background:linear-gradient(115deg,#222016,#141615 65%); cursor:pointer; }
.home-guide-card:hover { border-color:#b4974e; background:linear-gradient(115deg,#2c281b,#1c1e1a 65%); }
.guide-thumbnail { position:relative; display:flex; align-items:center; justify-content:center; flex:0 0 86px; height:86px; margin-right:18px; border:1px solid #655432; background:radial-gradient(ellipse at center,#504025,#201e16 74%); color:#f2ce76; }
.guide-thumbnail svg { width:62px; height:62px; stroke-width:1.2; }
.guide-thumbnail:after { content:"I — V"; position:absolute; bottom:6px; font:8px Georgia,serif; letter-spacing:2px; color:#d0ac66; }
.guide-card-copy { flex:1; min-width:0; }
.guide-kicker { margin:0 0 6px; color:#e1bf6e; font-size:9px; letter-spacing:1.5px; text-transform:uppercase; }
.guide-card-title { display:block; color:#f2eada; font:23px/1.2 Georgia,serif; }
.guide-card-summary { display:block; margin:6px 0 9px; color:#bcc1b6; font-size:11px; line-height:1.5; }
.guide-card-badges { display:flex; flex-wrap:wrap; color:#c1b694; font-size:9px; }
.guide-card-badges span { margin:0 12px 3px 0; }
.guide-card-arrow { margin-left:14px; color:#e5c475; font-size:20px; }
.home-guide-card:only-child { grid-column:1 / -1; }
.home-guide-card:only-child .guide-card-summary { max-width:520px; }
.guide-reader { max-width:1120px; margin:auto; padding:20px 28px 24px; user-select:text; -webkit-user-select:text; color:#e9e9df; }
.guide-reader[hidden], .guide-reader [hidden], .home-page[hidden] { display:none !important; }
.guide-toolbar { display:flex; align-items:center; justify-content:space-between; padding-bottom:16px; border-bottom:1px solid #34352c; }
.guide-toolbar > span { margin-left:12px; font-size:9px; letter-spacing:1.7px; color:#949b8d; }
.guide-back { color:#dfc784; padding:7px 0; cursor:pointer; font-size:11px; }
.guide-back:hover { color:#fff0ac; }
.guide-heading { display:flex; align-items:center; justify-content:space-between; margin:23px 0; }
.guide-heading h1 { margin:0; font:34px/1.2 Georgia,serif; color:#f5eedf; }
.guide-heading p:not(.guide-kicker) { margin:8px 0 0; color:#afb7a8; font-size:12px; line-height:1.6; }
.guide-offline { flex-shrink:0; margin-left:20px; color:#adb99a; font-size:10px; }
.guide-offline:before { content:""; display:inline-block; width:5px; height:5px; margin-right:6px; border-radius:50%; background:#b5cc7d; }
.guide-layout { display:grid; grid-template-columns:244px minmax(0,1fr); gap:24px; align-items:start; }
.guide-filters { padding:18px; background:#181a16; border:1px solid #444533; border-top:2px solid #c5a558; }
.guide-filters label, .guide-filter-label { display:block; margin:0 0 8px; font-size:10px; color:#c0c3b4; }
.guide-filters select { -webkit-appearance:none; appearance:none; width:100%; min-height:37px; padding:8px 28px 8px 10px; font:12px "Segoe UI",sans-serif; color:#f1e9d5; background:#25271f; border:1px solid #666046; border-radius:3px; cursor:pointer; }
.guide-select-wrap { position:relative; }
.guide-select-wrap:after { content:""; position:absolute; right:13px; top:13px; width:6px; height:6px; border-right:1px solid #d8c080; border-bottom:1px solid #d8c080; transform:rotate(45deg); pointer-events:none; }
.guide-filter-label { margin-top:20px; }
.guide-boxes { display:flex; }
.guide-box { flex:1; min-width:0; height:34px; border:1px solid #50513d; background:#22241d; color:#b6bba9; cursor:pointer; font-size:12px; }
.guide-box + .guide-box { margin-left:5px; }
.guide-box:hover { border-color:#c2a565; color:#f2d286; }
.guide-box[aria-pressed="true"] { border-color:#f0d17c; background:#e5c56e; color:#211b0d; font-weight:700; }
.guide-rules { margin-top:18px; padding-top:14px; border-top:1px solid #3d4030; }
.guide-rule { display:flex; justify-content:space-between; font-size:11px; color:#aeb5a0; line-height:1.7; }
.guide-rule + .guide-rule { margin-top:5px; }
.guide-rule strong { margin-left:8px; color:#eee5ca; font-weight:600; }
.guide-distribution { margin-top:18px; padding-top:14px; border-top:1px solid #3d4030; }
.guide-distribution h2 { margin:0 0 2px; font-size:11px; font-weight:600; color:#d5d9c9; }
.guide-distribution > p { margin:0 0 12px; font-size:10px; color:#9aa38c; }
.guide-bar { display:flex; height:5px; margin-bottom:12px; background:#33362a; overflow:hidden; }
.guide-bar span { height:100%; }
.guide-distribution-label { display:flex; align-items:center; margin-top:6px; font-size:10px; color:#b5bda7; }
.guide-swatch { width:6px; height:6px; margin-right:7px; }
.guide-distribution-label strong { margin-left:auto; color:#e6e8db; font-weight:500; }
.guide-color-sets { background:#c3a263; }
.guide-color-weapons { background:#7f9dba; }
.guide-color-shields { background:#9eb695; }
.guide-reading-note { margin:16px 1px 0; font-size:10px; line-height:1.7; color:#aab29e; }
.guide-reading-note strong { color:#d1d8c2; font-weight:500; }
.guide-results { min-width:0; }
.guide-result-heading { margin-bottom:14px; }
.guide-result-heading h2 { margin:0; color:#ede9dc; font-size:16px; font-weight:500; }
.guide-result-heading p { margin:5px 0 0; color:#abb49f; font-size:10px; }
.guide-category { margin-bottom:10px; border:1px solid #3d4233; background:#151814; }
.guide-reader summary { list-style:none; cursor:pointer; }
.guide-reader summary::-webkit-details-marker { display:none; }
.guide-summary-row { display:flex; align-items:center; }
.guide-category > summary .guide-summary-row { padding:14px 16px; }
.guide-category-name { font-size:13px; font-weight:600; color:#e3e6d8; }
.guide-category-count { margin-left:10px; color:#9fa991; font-size:10px; }
.guide-chevron { flex:0 0 6px; width:6px; height:6px; margin-left:14px; border-right:1px solid #bcc3a5; border-bottom:1px solid #bcc3a5; transform:rotate(-45deg); }
.guide-category > summary .guide-chevron { margin-left:auto; }
.guide-reader details[open] > summary .guide-chevron { transform:rotate(45deg); }
.guide-category[open] > summary { border-bottom:1px solid #353c2c; }
.guide-category-body { padding:0 14px 14px; }
.guide-tier-heading { display:flex; align-items:center; justify-content:space-between; margin:15px 0 9px; }
.guide-tier-heading h3 { margin:0 10px 0 0; padding:4px 7px; font-size:9px; font-weight:600; text-transform:uppercase; letter-spacing:.7px; color:#d2b778; background:#302c20; }
.guide-tier-heading.high h3 { color:#c1b1dd; background:#2b2737; }
.guide-tier-heading span { color:#9da88c; font-size:9px; text-align:right; }
.guide-set-list, .guide-table-wrap { border:1px solid #3a4130; border-radius:3px; overflow:hidden; }
.guide-set + .guide-set { border-top:1px solid #333c2b; }
.guide-set > summary .guide-summary-row { min-height:59px; padding:11px 13px; }
.guide-set > summary:hover, .guide-set[open] > summary { background:#20261a; }
.guide-set-name { color:#e2e7d3; font-size:12px; }
.guide-set-meta { margin-top:4px; color:#9ba98a; font-size:9px; }
.guide-set-probability { margin-left:auto; padding-left:12px; text-align:right; flex-shrink:0; }
.guide-set-probability strong { color:#e8d9ae; font-size:13px; font-weight:500; font-variant-numeric:tabular-nums; }
.guide-set-probability small { display:block; margin-top:3px; color:#9ea98c; font-size:9px; }
.guide-table-wrap { overflow-x:auto; }
.guide-set > .guide-table-wrap { border:0; border-top:1px solid #3a4130; border-radius:0; }
.guide-reader table { width:100%; border-collapse:collapse; font-size:11px; }
.guide-reader th { text-align:left; font-weight:500; font-size:9px; color:#a0ac91; background:#1c2217; }
.guide-reader th, .guide-reader td { padding:9px 12px; }
.guide-reader td { color:#d4ddc6; }
.guide-reader tbody tr + tr { border-top:1px solid #2d3626; }
.guide-reader th:last-child, .guide-reader td:last-child { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.guide-piece-type { color:#9fab8e !important; }
.guide-empty, .guide-message { padding:16px; color:#b2bfa1; background:#1d2318; font-size:11px; line-height:1.6; }
.guide-empty { margin-top:12px; }
.guide-source { display:flex; flex-wrap:wrap; justify-content:space-between; margin-top:20px; padding-top:14px; border-top:1px solid #333b2a; color:#929e83; font-size:9px; line-height:1.7; }
.guide-source span { margin-right:14px; }
.home-guide-card:focus, .guide-reader button:focus, .guide-reader select:focus, .guide-reader summary:focus, #home-guides-link:focus { outline:1px solid #eed082; outline-offset:2px; }
#guide-title:focus, #home-guides-title:focus { outline:none; }
@media(max-width:900px) { .guide-reader { padding:18px 20px; } .guide-layout { grid-template-columns:215px minmax(0,1fr); gap:16px; } .guide-filters { padding:14px; } }
@media(max-width:700px) { .home-guide-cards { grid-template-columns:1fr; } .guide-reader { padding:16px; } .guide-layout { grid-template-columns:1fr; } .guide-heading { margin:18px 0; } .guide-heading h1 { font-size:28px; } .guide-offline, .guide-toolbar > span { display:none; } .guide-thumbnail { flex-basis:65px; height:78px; margin-right:12px; } .guide-card-title { font-size:21px; } .guide-card-badges span { margin-right:8px; } .home-nav .home-site + .home-site { margin-left:8px; } .guide-tier-heading span { max-width:65%; line-height:1.5; } }
