body.has-build-picker { overflow:hidden; }
.build-picker { width:min(960px,calc(100vw - 40px)); max-height:calc(100dvh - 48px); padding:0; border:1px solid #665334; border-radius:16px; background:#100f0c; color:#eadfc7; box-shadow:0 28px 110px #0009; overflow:auto; color-scheme:dark; }
.build-picker::backdrop { background:#070807ce; backdrop-filter:blur(5px); }
.build-picker[open] { animation:picker-enter 220ms cubic-bezier(.16,1,.3,1); }
.picker-head { display:flex; align-items:center; gap:16px; padding:24px 28px; border-bottom:1px solid #352f22; background:linear-gradient(115deg,#292215,#15120e 60%); }
.picker-head>img { width:60px; height:60px; object-fit:contain; }
.picker-head h2 { font-size:30px; letter-spacing:-.035em; margin:4px 0 0; }
.picker-head .product-eyebrow { font-size:9px; letter-spacing:.18em; margin:0; color:#c6aa72; }
.picker-close { margin-left:auto; align-self:flex-start; width:36px; height:36px; border:1px solid #51452e; border-radius:50%; background:#211c13; color:#dfd0b2; font-size:24px; cursor:pointer; }
.picker-body { padding:20px 28px 18px; }
.picker-controls { display:flex; align-items:center; gap:16px; padding-bottom:20px; }
.picker-select { display:grid; gap:5px; color:#a79c86; font-size:10px; }
.build-picker select { border:1px solid #51452e; background:#1e1a13; border-radius:6px; color:#ebdcbe; padding:9px 28px 9px 10px; min-width:0; max-width:100%; font:500 12px Inter,sans-serif; }
.picker-patches { display:flex; flex-wrap:wrap; align-items:center; gap:5px 12px; flex:1; font-size:10px; color:#a79c86; }
.picker-patches>span { flex-basis:100%; }
.picker-patch { color:#c3ab78; text-decoration:underline; text-underline-offset:4px; font-size:11px; padding:7px 0; }
.picker-regions { display:flex; gap:3px; padding:4px; background:#1b1812; border:1px solid #342d22; border-radius:7px; }
.picker-regions button { background:none; border:0; color:#b0a68f; padding:9px 11px; border-radius:4px; font-size:11px; cursor:pointer; }
.picker-regions [aria-pressed=true] { background:#d2b47c; color:#19150e; }
.picker-layout { display:grid; grid-template-columns:265px minmax(0,1fr); gap:24px; }
.picker-teams { display:flex; flex-direction:column; gap:8px; }
.picker-all { text-align:left; background:none; border:0; color:#d8c6a1; font-size:12px; padding:9px 4px; cursor:pointer; }
.picker-all[aria-pressed=true]::after { content:' ✓'; color:#d4b372; }
.picker-team { display:grid; grid-template-columns:42px minmax(0,1fr); align-items:center; gap:12px; padding:14px 12px; width:100%; text-align:left; border:1px solid #373125; border-radius:9px; background:#191710; color:#d9ceb7; cursor:pointer; }
.picker-team:hover,.picker-team[aria-pressed=true] { border-color:#b7995f; background:#282115; }
.picker-team>img { width:42px; height:48px; object-fit:contain; flex-shrink:0; }
.picker-team-copy { display:grid; grid-column:2; gap:6px; min-width:0; }
.picker-team-copy strong { font-size:12px; line-height:1.4; }
.picker-team-meta { display:flex; align-items:center; flex-wrap:wrap; gap:4px 6px; font-size:9px; color:#c3ae80; line-height:16px; }
.picker-team-meta>span { display:inline-flex; align-items:center; white-space:nowrap; }
.picker-team-meta>span+span::before { content:'·'; color:#8f8065; margin-right:2px; }
.picker-team-record { font:9px/1.5 'JetBrains Mono',monospace; color:#a49d8c; }
.picker-game-panel { min-width:0; }
.picker-game-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.picker-game-head h3 { margin:0; font-size:13px; }
.picker-game-head select { max-width:190px; font-size:11px; padding:7px 26px 7px 9px; }
.picker-games { display:grid; align-content:start; gap:10px; max-height:380px; overflow-y:auto; scrollbar-gutter:stable; padding:3px 5px 6px 3px; }
.picker-game { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; padding:16px; background:#191710; border:1px solid #3b3425; border-radius:9px; color:inherit; text-decoration:none; transition:border-color 130ms ease,background 130ms ease; }
.picker-game:hover { border-color:#b7995f; background:#241e13; }
.picker-game-identity { display:flex; gap:10px; align-items:center; min-width:0; }
.picker-game-identity img { width:32px; height:36px; object-fit:contain; }
.picker-game-identity>span { display:grid; gap:5px; min-width:0; }
.picker-game-identity strong { font-size:15px; overflow-wrap:anywhere; }
.picker-game-identity small { font-size:10px; line-height:1.4; color:#b0a48d; }
.picker-game-score { display:grid; gap:4px; text-align:right; }
.picker-game-score b { font-size:9px; letter-spacing:.1em; }
.picker-game-score .is-win { color:#95caaa; }.picker-game-score .is-loss { color:#de9f8e; }
.picker-game-score strong { font:600 12px 'JetBrains Mono',monospace; }.picker-game-score small { font-size:8px; color:#9a927f; }
.picker-game-detail { grid-column:1/-1; font-size:10px; line-height:1.5; color:#cbb98f; }
.picker-game-footer { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:10px; border-top:1px solid #332d21; padding-top:10px; font-size:9px; line-height:1.6; color:#a49b86; }
.picker-game-footer b { color:#ddc18b; white-space:nowrap; font-size:10px; }
.picker-source { font-size:9px; line-height:1.6; margin:18px 0 0; color:#9c917b; }.picker-source a { color:#c6ad7b; }
.picker-empty { font-size:12px; line-height:1.8; color:#b3a78d; padding:20px; }
.build-picker :focus-visible { outline:2px solid #d8b66f; outline-offset:3px; }
.pro-hero-night-shift { white-space:nowrap; }
.ns-region-mark,.ns-stage,.picker-placement,.picker-select-caption { display:inline-flex; align-items:center; gap:4px; vertical-align:middle; }
.build-picker img.ns-emoji,.pro-hero-tile img.ns-emoji,#nightShiftLibrary img.ns-emoji { width:1.15em; height:1.15em; min-width:0; object-fit:contain; flex-shrink:0; vertical-align:-.16em; filter:none; margin:0; border:0; border-radius:0; box-shadow:none; }
.build-picker .picker-placement img.ns-emoji { width:16px; height:16px; }
.pro-hero-night-shift .ns-region-mark { margin-left:2px; }
.pro-hero-tile .pro-hero-night-shift img.ns-emoji { width:12px; height:12px; }
.picker-game-head h3 { display:flex; align-items:center; gap:7px; }
.picker-stage-heading { margin:5px 0 0; padding:3px 0 5px; color:#d4b77c; font-size:11px; font-weight:600; }
.picker-stage-heading:not(:first-child) { margin-top:10px; border-top:1px solid #383022; padding-top:15px; }
@keyframes picker-enter { from { opacity:0; transform:translateY(12px) scale(.985); } to { opacity:1; transform:none; } }
@media(max-width:680px) {
 .build-picker { width:calc(100vw - 20px); max-height:calc(100dvh - 24px); border-radius:12px; }
 .picker-head { padding:16px; gap:12px; }.picker-head>img { width:48px; height:48px; }.picker-head h2 { font-size:25px; }
 .picker-body { padding:14px; }.picker-controls { flex-wrap:wrap; gap:12px; padding-bottom:14px; }.picker-patches { order:3; flex-basis:100%; }.picker-regions { margin-left:auto; }.picker-all { scroll-snap-align:start; }
 .picker-controls { column-gap:8px; }.picker-select { flex:1; min-width:0; }.picker-select select { width:100%; font-size:11px; padding-right:18px; }.picker-regions { flex-shrink:0; }.picker-regions button { padding:8px 7px; }
 .picker-layout { display:block; }.picker-teams { display:flex; flex-direction:row; overflow-x:auto; gap:8px; padding:2px 3px 12px; margin-bottom:12px; scroll-snap-type:x proximity; }.picker-all { min-width:62px; font-size:11px; }.picker-team { flex:0 0 230px; grid-template-columns:36px minmax(0,1fr); scroll-snap-align:start; padding:10px; }.picker-team>img { width:36px; height:40px; }
 .picker-games { max-height:40dvh; }.picker-game { padding:12px; gap:10px; }.picker-game-identity strong { font-size:14px; }.picker-game-footer { font-size:8px; }.picker-source { margin-top:10px; }
 body[data-product=true] .product-nav { gap:19px; }
 body[data-product=true] .product-nav a { font-size:11px; }
}
@media(prefers-reduced-motion:reduce) { .build-picker[open] { animation:none; }.picker-game { transition:none; } }
