/* Team Builder screen. Uses tokens from base.css. */
.tb{padding-top:12px}
.tb .muted{color:var(--muted)}
.tb .panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:12px}
.tb-top{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.tb-top h2{margin:0;font-size:22px;letter-spacing:.5px}
.tb-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:12px;align-items:start}
.tb-main{display:flex;flex-direction:column;gap:12px;min-width:0}
.tb button.small{padding:2px 8px;font-size:12px}
.tb textarea,.tb input[type=search],.tb input[type=text]{font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:6px 8px}
.tb input:focus,.tb select:focus,.tb textarea:focus,.tb button:focus-visible{outline:2px solid var(--accent2);outline-offset:1px}
.tb select{background:var(--bg);max-width:100%}

/* sidebar */
.tb-side{position:sticky;top:12px;max-height:calc(100vh - 24px);display:flex;flex-direction:column;gap:10px}
.tb-side-btns{display:flex;gap:6px}
.tb-side-btns button{flex:1;padding:6px 4px}
.tb-list{list-style:none;margin:0;padding:0;overflow-y:auto;display:flex;flex-direction:column;gap:4px}
.tb-sep{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);margin:8px 2px 2px}
.tb-none{color:var(--muted);font-size:12px;padding:4px 2px}
.tb-team{width:100%;display:grid;grid-template-columns:1fr auto;grid-template-areas:"faces faces" "name tag";gap:3px 6px;text-align:left;padding:6px 8px;background:var(--panel2)}
.tb-team .faces{grid-area:faces;display:flex;gap:1px}
.tb-team .tn{grid-area:name;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-team .tag{grid-area:tag;font-size:10px;color:var(--muted);text-transform:uppercase;align-self:center}
.tb-team.sel{border-color:var(--accent);box-shadow:inset 3px 0 0 var(--accent)}
.tb-team.draft .tag{color:var(--accent)}

/* portraits */
.tb-portrait{image-rendering:pixelated;display:block;flex:none}
.tb-portrait.mini{width:24px;height:24px}
.tb .mini.empty{width:24px;height:24px;background:var(--bg);border-radius:4px;opacity:.5}
.tb-portrait.sl{width:48px;height:48px}
.tb-portrait.big{width:96px;height:96px;background:var(--bg);border-radius:var(--radius);border:1px solid var(--line)}
.tb-portrait.pk{width:48px;height:48px}

/* header */
.tb-head-row{display:flex;gap:12px;align-items:flex-end;justify-content:space-between;flex-wrap:wrap}
.tb-namel{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted);flex:1;min-width:200px;max-width:380px}
.tb-namel input{font-size:16px;font-weight:600;color:var(--text)}
.tb-head-btns{display:flex;gap:8px}
.tb-status{margin-top:8px;font-size:13px}
.tb-status .errs{margin:0;padding-left:18px;color:var(--bad)}
.tb-status .ok,.tb .ok{color:var(--good)}
.tb .bad{color:var(--bad)}
.tb-status .note{color:var(--accent);}

/* slots */
.tb-slots{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.tb-slot{display:flex;flex-direction:column;gap:5px;align-items:stretch;text-align:left;padding:8px;min-height:150px;background:var(--panel);border-radius:var(--radius);overflow:hidden}
.tb-slot:hover:not(:disabled){background:var(--panel2)}
.tb-slot.sel{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset;background:var(--panel2)}
.tb-slot.warn:not(.sel){border-color:#8a4a4a}
.tb-slot.empty{align-items:center;justify-content:center;color:var(--muted);border-style:dashed}
.tb-slot .plus{font-size:30px;line-height:1;color:var(--line)}
.sl-top{display:flex;gap:6px;align-items:center;min-width:0}
.sl-id{display:flex;flex-direction:column;gap:3px;min-width:0}
.sl-id b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb .types{display:flex;gap:3px;flex-wrap:wrap}
.tb .types .type{font-size:10px;padding:0 5px}
.sl-item{font-size:11px;color:var(--accent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sl-moves{display:flex;flex-direction:column;gap:1px;font-size:11px}
.sl-mv{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:5px}
.sl-mv .dot{width:7px;height:7px;border-radius:50%;flex:none}
.sl-nomv{color:var(--bad);font-size:11px}

/* io */
.tb-io textarea{width:100%;min-height:150px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;resize:vertical}
.io-head{margin-bottom:6px}
.io-btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.io-msg{margin-top:6px;font-size:12px}
.warns{margin:4px 0 0;padding-left:18px;color:var(--accent)}

/* member panel */
.tb-fs{border:0;margin:0;padding:0;min-width:0}
.tb-fs:disabled{opacity:.9}
.mem-top{display:flex;gap:14px;align-items:center;margin-bottom:12px}
.mem-id h3{margin:0 0 4px;font-size:20px}
.mem-id .meta{margin:6px 0;color:var(--muted)}
.mem-id .meta b{color:var(--text)}
.mrange{color:var(--accent2);font-weight:600}
.mem-btns{display:flex;gap:6px;flex-wrap:wrap}
.mem-grid{display:grid;grid-template-columns:minmax(260px,1fr) minmax(0,1.6fr);gap:18px}
.fld{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted);margin-bottom:2px}
.fld select{font-size:14px;color:var(--text)}
.desc{margin:3px 0 12px;color:var(--muted);font-size:12px;min-height:16px;line-height:1.35}
.evhead,.evrow{display:grid;grid-template-columns:44px 34px minmax(80px,1fr) 52px 46px minmax(90px,1.1fr) 40px;gap:8px;align-items:center}
.evhead{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}
.evhead .evh{grid-column:3 / span 2}
.evhead .finh{grid-column:6 / span 2}
.evrow{padding:3px 0;border-top:1px solid #2c3750}
.evrow .lbl{font-weight:600}
.evrow .base{color:var(--muted);text-align:right;font-size:12px}
.nat{font-style:normal;font-size:9px;margin-left:3px}
.nat.plus{color:var(--good)}.nat.minus{color:var(--bad)}
.evrow input[type=range]{width:100%;accent-color:var(--accent);min-width:0}
.evrow input[type=number]{width:100%;padding:2px 4px;text-align:right;background:var(--bg)}
.evrow .bar{height:10px;background:var(--bg);border-radius:5px;overflow:hidden;border:1px solid #2c3750}
.evrow .bar i{display:block;height:100%;width:0;border-radius:5px}
.evrow .fin{text-align:right;font-variant-numeric:tabular-nums}
.evfoot{display:flex;justify-content:space-between;align-items:center;margin-top:8px;color:var(--muted)}
.evfoot b{color:var(--accent);font-size:15px}
.evfoot b.zero{color:var(--good)}

/* moves */
.mem-moves{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.mv-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:8px}
.mv-head h4{margin:0;font-size:15px}
.mv-head h4 span{color:var(--muted);font-weight:400}
.tbchips{display:flex;gap:6px;flex-wrap:wrap}
.tbchip{padding:3px 10px;border-radius:14px;font-size:12px;font-weight:700;color:#fff;border:1px solid #0004;text-shadow:0 1px 1px #0006}
.tbchip .x{opacity:.8;margin-left:4px}
.tbchip:hover:not(:disabled){filter:brightness(1.15);border-color:#fff8}
.tbchip:disabled{opacity:1;cursor:default}
.tbchip.emptychip{background:var(--bg);border:1px dashed var(--line);color:var(--muted);font-weight:400;text-shadow:none}
.mv-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.mv-filters input[type=search]{flex:1;min-width:180px;max-width:340px}
.mv-wrap{max-height:440px;overflow:auto;border:1px solid var(--line);border-radius:8px;background:var(--bg)}
.mv-table{width:100%;border-collapse:collapse;font-size:13px;min-width:760px}
.mv-table th{position:sticky;top:0;background:var(--panel2);text-align:left;padding:0;z-index:1;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);border-bottom:1px solid var(--line)}
.mv-table th:nth-child(8){padding:5px 8px}
.mv-table .th{background:none;border:0;border-radius:0;width:100%;text-align:left;padding:5px 8px;color:inherit;font:inherit;text-transform:inherit;letter-spacing:inherit}
.mv-table td{padding:4px 8px;border-top:1px solid #222c3f;vertical-align:middle}
.mv-table tr.tbmv{cursor:pointer}
.mv-table tr.tbmv:hover{background:#222d42}
.mv-table tr.tbmv.sel{background:#3a3a24;box-shadow:inset 3px 0 0 var(--accent)}
.mv-table tr.tbmv.full{opacity:.55}
.mv-table tr.tbmv.off{opacity:.35;cursor:not-allowed;filter:grayscale(1)}
.mv-table td.n{font-weight:600;white-space:nowrap}
.mv-table td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.mv-table td.num small{color:var(--muted);font-size:10px}
.mv-table td.rng{white-space:nowrap;color:var(--accent2);font-size:12px}
.mv-table td.eff{color:var(--muted);font-size:12px;min-width:240px}
.mv-table .pad{padding:16px;text-align:center}
.tbcat{font-size:12px;font-weight:700}
.tbcat-Physical{color:#f08030}.tbcat-Special{color:#7a9cf4}.tbcat-Status{color:#a8a8a8}

/* picker */
.pk-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.pk-head h3{margin:0;font-size:17px}
.pk-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.pk-filters .tb-search{flex:1;min-width:200px;max-width:440px}
.pk-filters input[type=search]{width:100%}
.pk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px;align-items:start}
.pk-card{display:flex;gap:8px;align-items:center;text-align:left;padding:6px;background:var(--panel2);min-width:0}
.pk-card:disabled{opacity:.4}
.pk-card.cur{border-color:var(--accent)}
.pk-info{display:flex;flex-direction:column;gap:3px;min-width:0}
.pk-info b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pk-info small{color:var(--muted)}

/* responsive */
@media (max-width:1100px){
  .tb-slots{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mem-grid{grid-template-columns:1fr}
}
@media (max-width:860px){
  .tb-layout{grid-template-columns:minmax(0,1fr)}
  .tb-side{position:static;max-height:none}
  .tb-list{flex-direction:row;overflow-x:auto;overflow-y:hidden;padding-bottom:4px}
  .tb-list li{flex:none;width:200px}
  .tb-sep{align-self:center;width:auto!important}
  .tb-list .tb-sep,.tb-list .tb-none{width:auto}
}
@media (max-width:560px){
  .tb-slots{grid-template-columns:repeat(2,minmax(0,1fr))}
  .evhead{display:none}
  .evrow{grid-template-columns:44px 1fr 52px 46px;grid-template-areas:"l r n i" "l b b f"}
  .evrow .base{display:none}
  .evrow .lbl{grid-area:l}
  .evrow input[type=range]{grid-area:r}
  .evrow .evn{grid-area:n}
  .evrow .ivn{grid-area:i}
  .evrow .bar{grid-area:b}
  .evrow .fin{grid-area:f}
  .mem-top{flex-direction:column;align-items:flex-start}
}

/* Box (saved sets) */
.tb .warn{color:var(--accent)}
.boxsavemsg{font-size:12px;align-self:center}
.box-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.box-head h3{margin:0;font-size:17px}
.box-head h3 .muted{font-size:13px;font-weight:400}
.box-btns{display:flex;gap:6px;flex-wrap:wrap}
.box-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.box-filters .tb-search{flex:0 1 340px;min-width:180px}
.box-filters input[type=search]{width:100%}
.box-msg{font-size:12px}
.box-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:8px;max-height:380px;overflow-y:auto;padding-right:2px}
.box-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:start;padding:8px;background:var(--panel2);border:1px solid var(--line);border-radius:8px}
.bc-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.bc-name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bc-rn{width:100%;padding:2px 6px}
.bc-item{font-size:11px;color:var(--accent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bc-moves{display:flex;flex-direction:column;gap:1px;font-size:11px}
.bc-moves span{display:flex;align-items:center;gap:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bc-moves .dot{width:7px;height:7px;border-radius:50%;flex:none}
.bc-btns{display:flex;flex-direction:column;gap:4px}
.bc-btns button{white-space:nowrap}
.box-list .pad{grid-column:1/-1;padding:12px 4px}
.mem-btns{align-items:center}
@media (max-width:560px){
  .box-list{grid-template-columns:1fr}
  .box-card{grid-template-columns:auto minmax(0,1fr)}
  .bc-btns{grid-column:1/-1;flex-direction:row}
}

/* search: autocomplete + reason chips */
.tb-search{position:relative}
.tb-sugg{position:absolute;left:0;right:0;top:calc(100% + 3px);z-index:30;background:var(--panel);border:1px solid var(--accent2);border-radius:8px;box-shadow:0 8px 22px #000a;max-height:300px;overflow-y:auto;min-width:260px;padding:3px}
.tb-sugg[hidden]{display:none}
.tb-sugg .sg{display:flex;align-items:center;gap:8px;width:100%;text-align:left;border:0;border-radius:5px;background:transparent;padding:4px 7px}
.tb-sugg .sg:hover,.tb-sugg .sg.on{background:var(--panel2)}
.tb-sugg .sg-kind{flex:none;width:62px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.tb-sugg .sg-move{color:var(--accent2)}.tb-sugg .sg-ability{color:#c79bf0}.tb-sugg .sg-type{color:var(--accent)}.tb-sugg .sg-species{color:var(--good)}
.tb-sugg .sg-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-sugg .sg small{color:var(--muted);flex:none}
.tb-sugg .sg-mini{font-size:9px;padding:0 5px}
.pk-count{font-size:12px;margin:-2px 0 8px;min-height:15px}
.why{display:flex;flex-wrap:wrap;gap:3px;margin-top:2px}
.why-chip{font-size:10px;line-height:1.35;padding:0 6px;border-radius:9px;background:#33405a;color:var(--text);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.why-type{background:#6b5a1d;color:#ffe9a6}
.why-ability{background:#4d3a6e;color:#e6d2ff}
.why-move{background:#1f4a6e;color:#bfe3ff}
.why-item{background:#3d5a37;color:#d3f0c9}
.why-name{background:#33405a;color:var(--muted)}
.bc-main .why{margin-top:3px}

/* move table additions */
.mv-table td.num small.far{display:block;font-size:9px;line-height:1.1;color:var(--accent);white-space:nowrap}
.mv-table td.rng{cursor:help}
.tb-diagram{position:fixed;z-index:60;width:152px;padding:8px;background:var(--panel);border:1px solid var(--accent2);border-radius:10px;box-shadow:0 10px 26px #000b;pointer-events:none;font-size:11px;color:var(--text)}
.tb-diagram[hidden]{display:none}
.tb-diagram .dg-title{margin-bottom:5px;line-height:1.25}
.tb-diagram .dg-title b{color:var(--accent)}
.tb-dg{display:block;margin:0 auto;background:var(--bg);border-radius:6px}
.tb-dg .dg-e{fill:#2a3448;stroke:#3a4864;stroke-width:.6}
.tb-dg .dg-r{fill:#5fb3f955;stroke:#5fb3f988;stroke-width:.6}
.tb-dg .dg-u{fill:#f2c14e}
.tb-dg .dg-ar{fill:#1b1b1b}
.tb-dg .dg-h{fill:#ef5b5b}
.tb-dg .dg-wall{stroke:#ff6ec8;stroke-width:2.6;stroke-linecap:round}
.tb-dg .dg-wall-glow{stroke:#ff6ec8;stroke-width:7;stroke-linecap:round;opacity:.3}
.tb-dg .dg-wall-alt{stroke:#ff6ec8;stroke-width:1.3;stroke-linecap:round;stroke-dasharray:2.5 2;opacity:.55}
.tb-dg .dg-w-reflect{stroke:#ff9632}.tb-dg .dg-w-lightscreen{stroke:#ff6ec8}.tb-dg .dg-w-auroraveil{stroke:#5ae1e1}
.tb-dg .dg-h3{opacity:1}.tb-dg .dg-h4{opacity:.75}.tb-dg .dg-h5{opacity:.55}
.tb-diagram .dg-note{margin-top:5px;color:var(--muted);line-height:1.3}
.tb-diagram .dg-far{margin-top:4px;color:var(--accent);line-height:1.3}
.tb-diagram .dg-leg{margin-top:5px;display:flex;flex-wrap:wrap;align-items:center;gap:3px 5px;color:var(--muted);font-size:10px}
.tb-diagram .dg-leg i{display:inline-block;width:8px;height:8px;border-radius:2px}
.dg-lu{background:#f2c14e;border-radius:50%!important}.dg-lh{background:#ef5b5b}.dg-lr{background:#5fb3f988;border-radius:50%!important}
.dg-lw{background:linear-gradient(90deg,#ff9632,#ff6ec8,#5ae1e1);height:3px!important;width:14px!important;border-radius:2px!important;vertical-align:middle}

/* nickname (optional, as in the games / Showdown) */
.tb-nick { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; margin: 2px 0 6px; font-size: 12px; color: var(--muted); }
.tb-nick input { width: 12.5em; font: inherit; font-size: 14px; color: var(--text); background: var(--panel2, #1d2436); border: 1px solid var(--line, #33405a); border-radius: 6px; padding: 3px 7px; }
.tb-nick input:disabled { opacity: .6; }
.tb-nick small { font-size: 11px; }
.tb-slot .sl-sp { display: block; font-size: 11px; color: var(--muted); font-weight: 400; margin-top: -2px; }