/* #SECTION: BUILDS */
/* ═══════ BUILDS ═══════ */

/* Build list — vertical stack matching Teams (.tml-stack) */
.bld-stack{padding:.9rem 1rem 1.5rem;display:flex;flex-direction:column;gap:.75rem}
/* Art header hidden on mobile — shown on desktop */
.bld-art{display:none}
/* Mini stats + move pills hidden on mobile */
.bld-mini-stats{display:none}
.bld-move-pills{display:none}
/* Desktop wrap: column on mobile */
.bd-desktop-wrap{display:flex;flex-direction:column;gap:.85rem}
.bd-left,.bd-right{display:flex;flex-direction:column;gap:.85rem}
.bld-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:1rem;cursor:pointer;transition:border-color .15s;position:relative}
.bld-card:active{border-color:var(--border2);transform:scale(.995)}
.bld-card.fav-card{border-color:color-mix(in srgb,var(--gold) 40%,var(--border))}
/* Card header: sprite + info left, actions right */
.bld-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem}
.bld-head-left{display:flex;align-items:center;gap:.65rem;flex:1;min-width:0}
.bld-head-img{width:52px;height:52px;object-fit:contain;border-radius:12px;background:var(--surface);padding:4px;flex-shrink:0}
.bld-head-text{flex:1;min-width:0}
.bld-name{font-weight:800;font-size:.92rem;line-height:1.15;display:flex;align-items:center;gap:5px}
.bld-name .fav-star{color:var(--gold);font-size:.8rem}
.bld-pkmn{font-size:.68rem;color:var(--muted);font-weight:600;margin-top:2px;display:flex;align-items:center;gap:5px;flex-wrap:wrap}
/* Tags + moves rows */
.bld-tags{display:flex;gap:.3rem;flex-wrap:wrap;margin-top:.55rem}
.btag{padding:2px 8px;border-radius:6px;font-size:.62rem;font-weight:700;white-space:nowrap}
.btag-fmt{background:var(--blue-bg);color:var(--blue)}.btag-arch{background:color-mix(in srgb,var(--ac,var(--red)) 12%,var(--surface));color:var(--ac,var(--red));border:1px solid color-mix(in srgb,var(--ac,var(--red)) 30%,transparent)}
.btag-item{background:var(--gold-bg);color:var(--gold)}.btag-nat{background:var(--green-bg);color:var(--green)}
.btag-abi{background:var(--purple-bg);color:var(--purple)}
.bld-moves{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:.5rem}
.bmove{padding:5px 8px;border-radius:7px;background:var(--surface);font-size:.7rem;font-weight:600;color:var(--text2);text-align:center}
/* Legacy .sec-hdr kept for backward compat */
.sec-hdr{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;flex-wrap:wrap;gap:.5rem}
.sec-hdr h2{font-size:1.05rem;font-weight:700}

/* Build detail — stacked layout (.bd-*) */
.bd-stack{padding:.9rem .9rem 1.5rem;display:flex;flex-direction:column;gap:.85rem}
/* Hero art — shared sizing for builds + pokédex detail */
.bd-hero{text-align:center;padding:1.2rem 1rem .8rem;border-radius:16px;position:relative;overflow:hidden;min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.bd-hero-dex{position:absolute;top:-6px;right:-6px;font-size:5rem;font-weight:900;opacity:.07;pointer-events:none;line-height:1;font-family:monospace;z-index:0}
.bd-hero img{width:140px;height:140px;object-fit:contain;filter:drop-shadow(0 6px 16px rgba(0,0,0,.3));position:relative;z-index:2}
.bd-hero-types{margin-top:.5rem;display:flex;gap:5px;justify-content:center;position:relative;z-index:2}
.bd-hero-types .type-pill{font-size:.7rem;padding:3px 12px}
.bd-hero.shiny-holo{border:none}
.bd-hero.shiny-holo::before{content:'';position:absolute;inset:-3px;border-radius:18px;background:linear-gradient(135deg,#ff6b6b,#feca57,#48dbfb,#ff9ff3,#54a0ff,#5f27cd,#ff6b6b);background-size:300% 300%;animation:holoShift 4s ease infinite;z-index:0;opacity:.7}
.bd-shiny-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:20px;background:var(--purple-bg);color:var(--purple);font-size:.68rem;font-weight:700;margin-top:.35rem;position:relative;z-index:2}
/* Summary strip */
.bd-summary{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;font-size:.72rem;padding-left:.2rem}
/* Config grid */
.bd-config{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;font-size:.82rem}
.bd-config-label{color:var(--muted);font-weight:600;font-size:.72rem}
.bd-config-val{font-weight:700;font-size:.82rem}
/* Moves — Drop E: type-matched gradients, name only */
.bd-moves{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bd-move{position:relative;min-height:48px;border-radius:10px;padding:10px 12px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:800;font-size:.82rem;letter-spacing:-0.01em;overflow:hidden}
.bd-move-typed{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35);box-shadow:0 1px 0 rgba(255,255,255,.08) inset, 0 2px 8px rgba(0,0,0,.18)}
.bd-move-typed .bd-move-name{position:relative;z-index:1}
.bd-move-empty{background:var(--surface);color:var(--muted);font-weight:600;border:1px dashed var(--border)}
.bd-move-plain{background:var(--surface);color:var(--text2);font-weight:700}
/* Strategy (collapsible) */
.bd-strategy summary{font-size:.85rem;font-weight:800;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}
.bd-strategy summary::after{content:'▸';color:var(--muted);font-size:.8rem;transition:transform .2s}
.bd-strategy[open] summary::after{transform:rotate(90deg)}
.bd-strat-label{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem}
.bd-strat-text{font-size:.8rem;color:var(--text2);line-height:1.5}
/* SP progress bar (detail view) */
.bd-sp-bar-wrap{display:flex;align-items:center;gap:.5rem;margin-top:6px}
.bd-sp-label{font-size:.65rem;color:var(--muted);font-weight:600;flex-shrink:0}
.bd-sp-track{flex:1;height:5px;background:var(--surface2);border-radius:3px;overflow:hidden}
.bd-sp-fill{height:100%;border-radius:3px;background:var(--blue)}
.bd-sp-val{font-size:.72rem;font-weight:800;color:var(--blue);font-variant-numeric:tabular-nums;flex-shrink:0}

/* Subsection: Build editor */
.editor{padding:1rem 2rem 2rem}
.ed-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
/* Desktop 2-column layout: stat calc left (sticky), build details right */
.ed-desktop-layout{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}
.ed-left-col,.ed-right-col{display:flex;flex-direction:column;gap:1rem}
.ed-left-col>.ed-card,.ed-right-col>.ed-card,.ed-right-col>details{margin-top:0!important}
.ed-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:1.1rem}
.ed-card h3{font-size:.9rem;font-weight:700;margin-bottom:.8rem}
.ed-label{display:block;font-size:.68rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:.3rem;margin-top:.6rem}
.ed-input,.ed-select,.ed-textarea{width:100%;padding:.5rem .7rem;border-radius:8px;border:1px solid var(--border);background:var(--input-bg);color:var(--text);font-family:inherit;font-size:.83rem}
.ed-input:focus,.ed-select:focus,.ed-textarea:focus{outline:none;border-color:var(--red)}
.ed-select{cursor:pointer}.ed-textarea{resize:vertical;min-height:50px}
.ed-row{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
/* Subsection: SP sliders */
.sp-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}
.sp-name{width:52px;font-size:.72rem;font-weight:600;color:var(--muted)}
.sp-slider{flex:1;-webkit-appearance:none;appearance:none;height:6px;border-radius:3px;background:var(--surface2);outline:none}
.sp-slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--text);cursor:pointer;border:2px solid var(--bg2)}
.sp-pm{width:26px;height:26px;border-radius:6px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-family:inherit}
.sp-pm:hover{border-color:var(--red);color:var(--red)}
.sp-val{width:36px;text-align:center;font-weight:700;font-size:.8rem;padding:2px;border-radius:5px;border:1px solid var(--border);background:var(--input-bg);color:var(--text);font-family:inherit}
.sp-remain{text-align:right;font-size:1.3rem;font-weight:900;color:var(--green)}
.sp-over{color:var(--red)!important}
/* Subsection: Pokémon picker grid */
.pk-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.5rem;max-height:400px;overflow-y:auto;margin-top:.4rem;padding:.3rem}
.pk-pick{display:flex;flex-direction:column;align-items:center;padding:.4rem;border-radius:10px;border:1.5px solid var(--border);background:var(--surface);cursor:pointer;transition:all .15s}
.pk-pick:hover{border-color:var(--red)}.pk-pick.selected{border-color:var(--green);background:var(--green-bg)}
.pk-pick img{width:48px;height:48px;object-fit:contain}
.pk-pick span{font-size:.58rem;font-weight:600;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;margin-top:2px}

 
