.team-builds-workspace { --tb-ink:var(--color-text); --tb-muted:var(--color-text-secondary); --tb-line:var(--color-border); --tb-accent:var(--color-brand-strong); display:grid; gap:.8rem; min-width:0; color:var(--tb-ink); }
.team-builds-workspace [hidden] { display:none !important; }
.team-builds-workspace :is(button,select,summary):focus-visible { outline:2px solid var(--tb-accent); outline-offset:3px; }
.tb-muted { color:var(--tb-muted); }
.tb-coverage { display:flex; align-items:baseline; flex-wrap:wrap; gap:.4rem 1rem; color:var(--tb-muted); font-size:.7rem; }
.tb-coverage strong { color:var(--tb-ink); font-weight:500; }
.tb-coverage details { position:relative; }
.tb-coverage summary { color:var(--color-text-secondary); cursor:pointer; }
.tb-coverage details[open] { flex-basis:100%; order:2; padding:.6rem .8rem; border:1px solid var(--tb-line); border-radius:4px; background:var(--color-canvas-raised); }
.tb-coverage dl { display:flex; flex-wrap:wrap; gap:.75rem 1.5rem; margin:.7rem 0; }
.tb-coverage dl > div { display:flex; gap:.6rem; }
.tb-coverage dd { margin:0; color:var(--tb-ink); }
.tb-coverage p { margin:.35rem 0 0; font-size:.65rem; }
.tb-preview-note { margin-left:auto; color:var(--color-text-secondary); font-size:.64rem; }
.tb-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.6rem; }
.tb-metric-tabs { display:flex; gap:.3rem; }
.tb-metric-tabs button { min-height:34px; padding:.45rem .8rem; border:1px solid transparent; border-radius:4px; background:transparent; color:var(--tb-muted); font:inherit; font-size:.77rem; cursor:pointer; }
.tb-metric-tabs button[aria-pressed="true"] { background:var(--color-brand-soft); border-color:var(--color-brand-border); color:var(--color-brand-strong); }
.tb-field { display:flex; align-items:center; gap:.5rem; font-size:.69rem; color:var(--tb-muted); }
.tb-field select { min-height:32px; padding:.3rem .6rem; border:1px solid var(--color-border-strong); border-radius:3px; background:var(--color-canvas-raised); color:var(--tb-ink); font:inherit; font-size:.73rem; }
.tb-chart-panel,.tb-ledger { overflow:hidden; min-width:0; border:1px solid var(--tb-line); border-radius:5px; background:var(--color-surface); }
.tb-panel-heading { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.6rem; padding:.75rem 1rem; }
.tb-panel-heading :is(h2,h3) { margin:0; color:var(--tb-ink); font-size:.95rem; font-weight:600; letter-spacing:-.015em; }
.tb-panel-heading > div > span { display:block; margin-top:.25rem; color:var(--tb-muted); font-size:.69rem; }
.tb-panel-heading h3 span { margin-left:.35rem; color:var(--tb-muted); font-size:.7rem; font-weight:400; }
.tb-chart-slot { container-name:team-build-output; container-type:inline-size; }
.team-builds-workspace .gvg-chart { min-block-size:0; min-height:0; background:transparent; background-image:none; box-shadow:none; border:0; border-radius:0; margin:0; }
.team-builds-workspace .tb-chart-slot > .gvg-chart { height:var(--tb-chart-height-desktop); min-height:var(--tb-chart-height-desktop); }
@container team-build-output (max-width:640px) { .team-builds-workspace .tb-chart-slot > .gvg-chart { height:var(--tb-chart-height-mobile); min-height:var(--tb-chart-height-mobile); } }
.tb-chart-footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.4rem .8rem; padding:.4rem 1rem .8rem; color:var(--tb-muted); font-size:.62rem; }
.tb-table-scroll,.tb-history-scroll { overflow-x:auto; scrollbar-width:thin; overscroll-behavior-x:contain; }
.tb-table,.tb-history-table { width:100%; border-collapse:collapse; font-size:.73rem; font-variant-numeric:tabular-nums; }
.tb-table > thead th,.tb-history-table > thead th { padding:.5rem .65rem; border-block:1px solid var(--tb-line); color:var(--tb-muted); background:var(--color-canvas-raised); text-align:right; font-size:.63rem; font-weight:400; white-space:nowrap; }
.tb-table > thead th:nth-child(-n+2),.tb-history-table > thead th:first-child { text-align:left; }
.tb-archetype-row > :is(td,th) { padding:.45rem .65rem; height:59px; border-bottom:1px solid var(--color-border); text-align:right; white-space:nowrap; }
.tb-archetype-row > th { width:168px; min-width:155px; padding:0; text-align:left; }
.tb-archetype-row > td:nth-child(2) { text-align:left; }
.tb-archetype-row:is(:hover,.is-selected) { background:var(--color-surface-hover); }
.tb-build-button { display:flex; align-items:center; gap:.55rem; width:100%; min-height:59px; padding:.5rem .65rem; border:0; background:transparent; color:inherit; font:inherit; cursor:pointer; text-align:left; }
.tb-chevron { width:5px; height:5px; flex:none; margin-left:auto; border-right:1px solid var(--tb-muted); border-bottom:1px solid var(--tb-muted); transform:rotate(-45deg); }
[aria-expanded="true"] > .tb-chevron { transform:rotate(45deg); }
.tb-core-icons { display:inline-flex; align-items:center; gap:3px; vertical-align:middle; }
.tb-core-icon { position:relative; display:grid; place-items:center; flex:none; width:28px; height:28px; border:1px solid var(--color-brand-border); border-radius:2px; background:var(--color-canvas-raised); color:var(--color-brand-strong); font-size:.7rem; }
.tb-core-icon img { display:block; width:100%; height:100%; object-fit:cover; border-radius:1px; }
.tb-core-icon b { position:absolute; right:-3px; bottom:-4px; min-width:15px; padding:0 1px; border:1px solid var(--color-brand-border); border-radius:2px; background:var(--color-canvas-raised); color:var(--color-text); font-size:.57rem; line-height:1.25; text-align:center; }
.tb-sample-note { display:block; margin-top:.2rem; color:var(--tb-muted); font-size:.57rem; line-height:1.3; font-weight:400; }
.tb-output { color:var(--color-brand-strong); }
.tb-guild-control { display:inline-block; }
.tb-guild-count { padding:.15rem .2rem; border:0; border-bottom:1px dotted #a2ae94; background:transparent; color:inherit; font:inherit; line-height:1.25; cursor:pointer; }
.tb-guild-popover { position:fixed; inset:auto; margin:0; z-index:100; width:310px; max-width:calc(100vw - 24px); max-height:min(360px,calc(100dvh - 24px)); overflow:auto; padding:.6rem .75rem; border:1px solid var(--color-border-strong); border-radius:5px; background:var(--color-surface); color:var(--color-text); box-shadow:0 7px 24px #0008; font-size:.7rem; white-space:normal; text-align:left; }
.tb-guild-popover > header { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.35rem; }
.tb-guild-popover > header strong { font-size:.72rem; font-weight:500; }
.tb-guild-popover > header button { width:25px; height:25px; padding:0; border:0; border-radius:3px; background:transparent; color:var(--color-text-secondary); font-size:1.15rem; cursor:pointer; }
.tb-guild-popover ul { display:grid; gap:.35rem; margin:0; padding:0; list-style:none; }
.tb-guild-popover li { display:grid; grid-template-columns:24px minmax(0,1fr) auto; align-items:center; gap:.5rem; min-height:32px; }
.tb-guild-name { line-height:1.35; overflow-wrap:anywhere; }
.tb-guild-name strong { color:var(--color-brand-strong); font-weight:500; }
.tb-guild-cape { display:flex; justify-content:center; }
.tb-guild-cape .guild-cape { width:21px; height:28px; }
.tb-guild-popover li > small,.tb-guild-incomplete { color:var(--color-text-secondary); font-size:.61rem; }
.tb-guild-incomplete { display:block; margin-top:.5rem; }
.tb-damage-cell { width:150px; min-width:125px; }
.tb-damage-composition { display:block; min-width:115px; padding:.5rem 0; }
.tb-damage-track { display:flex; height:7px; overflow:hidden; border-radius:2px; background:var(--color-border); }
.tb-damage-track > span { flex:none; height:100%; }
.tb-damage-tone-armor { background:#c49b59; }
.tb-damage-tone-ignoring { background:#72adba; }
.tb-damage-tone-degen { background:#b998ca; }
.tb-damage-tone-unknown { background:repeating-linear-gradient(135deg,#73806c 0 3px,#485242 3px 6px); }
.tb-damage-legend { display:flex; flex-wrap:wrap; gap:.4rem .85rem; padding:0 1rem .65rem; color:var(--tb-muted); font-size:.62rem; }
.tb-damage-legend > span { display:inline-flex; align-items:center; gap:.35rem; }
.tb-damage-legend i { width:13px; height:5px; border-radius:1px; }
.tb-change { color:var(--tb-muted); }
.tb-change.is-rising { color:#b4c493; }
.tb-detail-row > td { padding:0; text-align:left; border-bottom:1px solid var(--tb-line); }
.tb-detail { padding:.9rem 1rem 1rem; background:var(--color-canvas-raised); white-space:normal; }
.tb-detail-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.4rem; margin-bottom:.6rem; }
.tb-detail-heading h4 { margin:0; font-size:.73rem; font-weight:500; }
.tb-detail-heading > span { color:var(--tb-muted); font-size:.62rem; }
.tb-characteristic-skills { display:inline-flex; align-items:center; gap:2px; margin-left:auto; padding-left:.3rem; }
.tb-characteristic-skills > span { display:grid; place-items:center; width:22px; height:22px; border:1px solid var(--color-border); border-radius:2px; overflow:hidden; color:var(--tb-muted); font-size:.6rem; }
.tb-characteristic-skills img { width:100%; height:100%; object-fit:cover; }
.tb-history-table :is(td,tbody th) { padding:.5rem .6rem; border-bottom:1px solid var(--color-border); text-align:right; white-space:nowrap; }
.tb-parent-history > summary { width:max-content; color:var(--color-text-secondary); font-size:.64rem; cursor:pointer; }
.tb-history-table { font-size:.65rem; }
.tb-history-table tbody th { text-align:left; font-weight:400; }
.tb-parent-history { margin-top:.9rem; }
.tb-parent-history > summary { margin-bottom:.6rem; }
.tb-parent-history .tb-history-scroll { max-width:650px; }
.tb-core-cards { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem .8rem; }
.tb-core-card { display:inline-flex; align-items:center; gap:.3rem; }
.tb-core-card .tb-characteristic-skills { margin-left:0; padding-left:.1rem; }
.tb-contribution { color:var(--tb-muted); font-size:.61rem; white-space:nowrap; }
.tb-backline { margin-top:.85rem; }
.tb-backline-positions { display:grid; gap:.5rem; }
.tb-backline-position { display:flex; align-items:center; gap:.7rem; }
.tb-position-label { width:1rem; flex:none; color:var(--tb-muted); font-size:.68rem; text-align:center; }
.tb-position-remainder { cursor:help; text-decoration:underline dotted; text-underline-offset:.25em; color:var(--tb-muted); font-size:.62rem; white-space:nowrap; }
.tb-backline-list { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; }
.tb-backline-choice { display:inline-flex; align-items:center; gap:.4rem; }
.tb-backline-choice small { color:var(--tb-muted); font-size:.64rem; }
.tb-backline > .tb-muted,.tb-common-flex > .tb-muted { font-size:.67rem; }
.tb-common-flex { margin-top:.85rem; }
.tb-flex-table { width:100%; border-collapse:collapse; font-size:.68rem; font-variant-numeric:tabular-nums; }
.tb-flex-table :is(th,td) { padding:.45rem .6rem; border-bottom:1px solid var(--color-border); text-align:right; white-space:nowrap; }
.tb-flex-table thead th { color:var(--tb-muted); background:var(--color-canvas-raised); font-size:.63rem; font-weight:400; }
.tb-flex-table th:first-child { width:110px; text-align:left; }
.tb-flex-table .tb-core-icon { width:24px; height:24px; }
.tb-backline-table { min-width:590px; }
.tb-backline-table .tb-archetype-row > th { width:340px; min-width:320px; }
.tb-backline-table .tb-archetype-row > td:nth-child(2),.tb-backline-table > thead th:nth-child(2) { text-align:right; }
.tb-backline-table .tb-core-cards { flex-wrap:nowrap; gap:.6rem; }
.tb-backline-table .tb-core-card { gap:.1rem; }
.tb-backline-table .tb-core-icon { width:23px; height:23px; }
.tb-backline-table .tb-characteristic-skills { gap:1px; padding-left:0; }
.tb-backline-table .tb-characteristic-skills > span { width:18px; height:18px; }
.tb-output-legend { display:flex; flex-wrap:wrap; gap:.4rem 1rem; padding:0 1rem .55rem; color:var(--tb-muted); font-size:.64rem; }
.tb-output-legend > span { display:inline-flex; align-items:center; gap:.35rem; }
.tb-output-legend i { width:13px; height:5px; border-radius:1px; }
.tb-small-button { margin-top:.6rem; padding:.35rem .65rem; border:1px solid var(--color-border-strong); border-radius:3px; background:var(--color-canvas-raised); color:var(--color-text-secondary); font:inherit; font-size:.65rem; cursor:pointer; }
.team-builds-workspace button:is(:hover,:focus-visible):not(:disabled) { background:var(--color-surface-hover); color:var(--tb-ink); }
.tb-empty { padding:2rem 1rem; color:var(--tb-muted); font-size:.75rem; text-align:left; }
@media (max-width:900px) { .tb-table { min-width:790px; } .tb-backline-table { min-width:590px; } .tb-preview-note { margin-left:0; } }
@media (max-width:600px) { .tb-panel-heading { padding:.7rem .75rem; } .tb-panel-heading h2 { font-size:.85rem; } .tb-chart-footer { padding-inline:.75rem; } .tb-coverage { gap:.4rem .75rem; } .tb-metric-tabs button { padding:.4rem .7rem; } .tb-detail { padding:.8rem; } }