/* Stats explorer (Night shift): category tabs, an inventory-style icon grid and a details panel. */
.ex [hidden]{display:none!important}
.ex-tabs{display:flex;gap:6px;overflow-x:auto;margin-bottom:-1px;position:relative;z-index:1;scrollbar-width:thin}
.ex-tab{display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:12px 12px 0 0;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--mu);font:700 13px var(--text);white-space:nowrap;flex:none}
.ex-tab:hover{color:var(--tx);background:var(--panel)}
.ex-tab[aria-selected=true]{background:#1a1c20;color:var(--tx);border-color:var(--g-line);border-bottom-color:#1a1c20}
.ex-chest{padding:22px;border-radius:0 var(--r) var(--r) var(--r);background:#1a1c20;border:1px solid var(--g-line);display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:24px;align-items:start}
.ex-chest.flat{grid-template-columns:minmax(0,1fr)}
.ex-main{min-width:0}
.ex-tools{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.ex-field{display:flex;align-items:center;gap:12px;flex:1 1 220px;min-width:0;padding:10px 14px;border-radius:var(--r-s);border:1px solid var(--line2);background:var(--panel)}
.ex-field input,.ex-field select{flex:1;width:100%;min-width:0;background:none;border:0;color:var(--tx);font:600 15px var(--text);outline:0}
.ex-field select{cursor:pointer}
.ex-field select option{background:#131417}
.ex-field:focus-within{border-color:var(--g)}
.ex-sum{margin-bottom:14px;color:var(--mu);font-size:14px}
.ex-sum b{font:800 22px/1 var(--display);color:var(--tx)}
.ex-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px}
.ex-slot{position:relative;aspect-ratio:1;border-radius:6px;background:#2a2d33;border:2px solid;border-color:#15171a #4a4f58 #4a4f58 #15171a;display:grid;place-items:center;padding:0}
.ex-slot:hover,.ex-slot:focus-visible{background:#3a3f48}
.ex-slot[aria-pressed=true]{border-color:var(--g);box-shadow:0 0 0 2px rgba(77,220,50,.35)}
.ex-n{position:absolute;right:4px;bottom:2px;font:800 12px var(--display);color:#fff;text-shadow:1px 1px 0 #000,-1px 1px 0 #000,1px -1px 0 #000,-1px -1px 0 #000}
.ex-ico{width:var(--px);height:var(--px);flex:none;object-fit:contain;display:inline-block}
.ex-ico.none{display:inline-grid;place-items:center;border-radius:8px;background:repeating-conic-gradient(rgba(255,255,255,.07) 0 25%,rgba(255,255,255,.03) 0 50%) 0 0/12px 12px;border:1px dashed var(--line2)}
.ex-ico.none::after{content:'missing texture';max-width:84%;text-align:center;font:700 max(7px,calc(var(--px)*.13))/1.15 var(--mono);letter-spacing:.02em;text-transform:uppercase;color:var(--mu)}
.ex-list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:6px}
.ex-list li{display:flex;justify-content:space-between;gap:14px;padding:10px 14px;border-radius:10px;background:var(--panel);font-size:14px}
.ex-list b{font:700 14px var(--display);color:var(--g);white-space:nowrap}
.ex-sentinel{height:1px}
.ex-panel{position:sticky;top:16px;padding:18px;border-radius:var(--r-s);background:#14161a;border:1px solid var(--line)}
.ex-stage{display:grid;place-items:center;min-height:220px;border-radius:var(--r-s);background:radial-gradient(closest-side,rgba(77,220,50,.16),transparent 80%)}
.ex-panel h3{font-size:22px;margin-top:14px;overflow-wrap:anywhere}
.ex-sub{margin-top:2px;display:flex;gap:8px;flex-wrap:wrap}
.ex-id{opacity:.6;text-transform:none;letter-spacing:0;overflow-wrap:anywhere}
.ex-nums{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0}
.ex-nums div{min-width:0;padding:10px;border-radius:var(--r-s);background:var(--panel);border:1px solid var(--line)}
.ex-nums dt{font:600 10px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mu);overflow-wrap:anywhere}
.ex-nums dd{font:800 20px/1.2 var(--display);white-space:nowrap}
.ex-nums dd.long{font-size:16px}
.ex-panel h4{margin-top:4px}
.ex-who{margin:6px 0 14px}
.ex-donut{display:block;width:170px;height:170px;margin:8px auto 10px}
.ex-donut-n{font:800 22px var(--display);fill:var(--tx)}
.ex-donut-s{font:600 9px var(--mono);letter-spacing:.1em;text-transform:uppercase;fill:var(--mu)}
.ex-legend{list-style:none;padding:0;display:grid;gap:4px}
.ex-legend li{display:grid;grid-template-columns:24px 12px minmax(0,1fr) auto 44px;align-items:center;gap:8px;padding:5px 8px;border-radius:8px;font-size:13px}
.ex-legend .rk{font:600 11px var(--mono);color:var(--mu);text-align:right}
.ex-legend li:hover{background:var(--panel)}
.ex-legend i{width:10px;height:10px;border-radius:3px}
.ex-legend a,.ex-legend span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ex-legend a:hover{color:var(--g);text-decoration:underline}
.ex-legend em{display:none}
.ex-legend b{font:700 12px var(--display);text-align:right}
.ex-others-toggle{text-align:left;font:inherit;color:var(--tx);cursor:pointer;padding:0;display:flex;align-items:center;gap:6px;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}
.ex-others-toggle::after{content:'▸';font-size:11px;color:var(--mu)}
.ex-others-toggle[aria-expanded=true]::after{content:'▾'}
.ex-others-toggle:hover{color:var(--g)}
.ex-legend .ex-others-wrap{display:block;padding:0}
.ex-others{list-style:none;padding:2px 0 6px;max-height:260px;overflow-y:auto;display:grid;gap:2px;margin-left:12px;border-left:2px solid var(--line)}
.ex-others li{grid-template-columns:24px minmax(0,1fr) auto 44px;padding:4px 8px}
.ex-legend small{font:600 11px var(--mono);color:var(--mu);text-align:right}
.ex-also{list-style:none;padding:0;display:grid;gap:6px;margin-top:8px}
.ex-also li{display:flex;justify-content:space-between;gap:12px;padding:8px 12px;border-radius:10px;background:var(--panel);font-size:14px}
.ex-also b{font-family:var(--display);color:var(--g)}
.ex-tip{position:fixed;z-index:20;pointer-events:none;padding:8px 12px;border-radius:6px;background:rgba(16,0,16,.94);border:2px solid #2a0a5e;box-shadow:inset 0 0 0 1px #5a2ca0;font:600 14px var(--text);max-width:260px;display:none}
.ex-tip b{display:block}
.ex-tip span{display:block;color:var(--mu);margin-top:4px}
.ex-tip i{display:block;font:600 11px var(--mono);color:#7b7be8;margin-top:2px;font-style:normal;overflow-wrap:anywhere}
@media(max-width:1000px){.ex-chest{grid-template-columns:minmax(0,1fr)}.ex-panel{position:static}}
@media(max-width:700px){
  /* a row that scrolls sideways hides most categories, so on a phone the tabs wrap into a grid */
  .ex-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;overflow:visible;margin-bottom:8px}
  .ex-tab{justify-content:center;padding:12px 6px;border-radius:var(--r-s);white-space:normal;text-align:center;font-size:12px;line-height:1.2;min-height:48px}
  .ex-tab[aria-selected=true]{border-color:var(--g);border-bottom-color:var(--g);background:var(--g-dim)}
  .ex-chest{border-radius:var(--r);border-color:var(--line2)}
}
@media(max-width:560px){.ex-chest{padding:14px}.ex-slots{grid-template-columns:repeat(auto-fill,minmax(56px,1fr))}}