/* Draft Room and Team Builder share the Dragon Bowl Z workshop shell. */
.dragon-workshop #db22-root > .workshop-nav {
 display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px;
 padding:10px max(16px,calc((100vw - 1370px)/2)); border-bottom:2px solid var(--brand-red);
}
.workshop-nav nav,.workshop-buttons { display:flex; flex-wrap:wrap; gap:8px; align-items:center }
.dragon-workshop #db22-root > .workshop-nav nav a {
 display:inline-flex; align-items:center; min-height:44px; padding:0 12px;
 font:700 14px var(--brand-sans); text-decoration:none; color:var(--brand-cream); border:1px solid transparent;
}
.dragon-workshop #db22-root > .workshop-nav nav a[aria-current] { border-color:var(--brand-cyan); color:var(--brand-cyan); background:#15354a }
.dragon-workshop #db22-root > .workshop-nav nav .nav-play { background:var(--brand-red); color:#fff }
.workshop { max-width:1370px; margin:auto; padding:clamp(12px,3vw,32px); color:var(--brand-cream) }
.workshop :is(h1,h2,p) { margin:0 }
.workshop h1 { font-size:clamp(28px,4vw,50px); line-height:1.05; margin-block:6px 10px }
.workshop h2 { margin:4px 0 8px }
.workshop p { line-height:1.45 }
.workshop-hero,.workshop-footer {
 display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:18px;
 padding:clamp(14px,2.5vw,24px); border:1px solid var(--brand-line); background:var(--brand-panel);
}
.workshop-hero { border-top:3px solid var(--brand-gold); background:linear-gradient(110deg,#222240,var(--brand-panel) 70%) }
.workshop-kicker,.workshop-fit { color:var(--brand-cyan); font-weight:800; font-size:.8rem; letter-spacing:.035em }
.workshop-setup { display:flex; flex-wrap:wrap; gap:10px; align-items:end }
.workshop-setup label,.roster-filters label { font-size:.75rem; color:var(--brand-muted) }
.workshop :is(button,input,select,.file-button) { min-height:44px }
.workshop :focus-visible,.workshop-nav a:focus-visible { outline:3px solid var(--brand-cyan); outline-offset:2px }
.workshop button:disabled { opacity:.55; cursor:default }
.workshop .file-button:focus-within { outline:3px solid var(--brand-cyan) }
.workshop-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr); gap:16px; margin-block:16px; align-items:start }
.workshop-builder .workshop-grid { grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) }
.workshop-panel,.workshop-tools { padding:clamp(12px,2vw,20px); border:1px solid var(--brand-line); background:var(--brand-panel); min-width:0 }
.draft-timeline { display:grid; grid-template-columns:repeat(24,minmax(0,1fr)); gap:3px; margin-top:14px }
.draft-timeline span { text-align:center; padding-block:5px; font-size:clamp(9px,1.2vw,13px); background:var(--brand-raised); color:var(--brand-muted) }
.draft-timeline .done { background:#174e49; color:#d8fbe8 }
.draft-timeline .current { background:var(--brand-gold); color:var(--brand-ink); font-weight:900 }
.workshop .candidate-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:12px 0 }
.workshop .candidate-card { display:grid; grid-template-rows:auto 1fr auto auto; gap:6px; min-width:0; padding:6px; overflow-wrap:anywhere; text-align:center }
.workshop .candidate-card[aria-pressed=true] { border-color:var(--brand-cyan); box-shadow:inset 0 0 0 1px var(--brand-cyan) }
.workshop .candidate-card .db-portrait { width:100%; aspect-ratio:1; height:auto }
.workshop .field-jump { display:inline-flex; align-items:center; min-height:44px; color:var(--brand-cyan); font-weight:800 }
.workshop .inspector { margin-top:10px }
.workshop .inspector :is(pre,table),.workshop-tools :is(pre,table) { max-width:100%; overflow:auto; display:block }
.workshop .draft-controls { margin-top:10px }
.workshop .draft-field-panel { margin:0; min-width:0; padding:8px; overflow:visible }
.workshop .draft-field { min-height:540px; height:clamp(540px,54vw,735px); aspect-ratio:auto; min-width:0 }
.workshop .field-slot {
 width:11.4%; min-width:0; padding:3px 0; display:flex; flex-direction:column; align-items:center;
 border-color:#647d6880; background:#15263bb0; font-size:clamp(9px,1.35vw,13px);
}
.workshop .field-slot[disabled] { opacity:1 }
.workshop .field-slot.target { border-color:var(--brand-cyan); box-shadow:inset 0 0 0 1px var(--brand-cyan) }
.workshop .field-slot.filled img { height:clamp(32px,calc(var(--standing-height,80px) * .62),69px); width:100%; object-fit:contain; image-rendering:auto }
.workshop .field-slot.filled span { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.82em }
.workshop .field-slot small { font-size:.78em; white-space:nowrap }
.workshop .special-draft .field-slot { width:auto; min-width:62px }
.workshop .field-heading { flex-wrap:wrap }
.workshop .field-tip { margin-top:8px }
.workshop .assignment-action { position:static; display:flex; justify-content:space-between; align-items:center; margin:8px 0 12px }
.assignment-action div { display:grid; gap:4px }
.roster-filters { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center }
.roster-filters label:not(.available-filter) { display:grid; gap:4px }
.roster-filters input[type=search] { width:100%; min-width:0 }
.roster-filters .available-filter { display:flex; align-items:center; gap:7px; min-height:44px }
.workshop .roster-filters input[type=checkbox] { width:18px; min-height:0 }
.workshop .fighters { grid-template-columns:repeat(2,minmax(0,1fr)); max-height:440px; overflow:auto; padding:4px; scrollbar-gutter:stable }
.workshop .fighter { min-width:0; overflow-wrap:anywhere; min-height:62px }
.workshop .fighter > .db-portrait.illustrated { flex:none; width:100%; height:160px }
.workshop .db-portrait.illustrated img { object-position:center bottom }
.workshop .db-portrait.portrait-only img { object-position:center }
.workshop-footer progress { display:block; width:min(100%,220px); margin:4px 0; accent-color:var(--brand-gold) }
.workshop-footer p { font-size:.9rem }
.workshop-tools { margin-block:12px }
.workshop-tools .workshop-buttons { margin-block:10px }
.workshop-tools summary { cursor:pointer; min-height:30px }
@media(max-width:820px) {
 .workshop-grid,.workshop-builder .workshop-grid { grid-template-columns:minmax(0,1fr) }
 .draft-timeline { grid-template-columns:repeat(12,minmax(0,1fr)) }
 .workshop .candidate-card .db-portrait { max-height:115px }
 .workshop .fighter > .db-portrait.illustrated { height:clamp(92px,26vw,140px) }
 .workshop .field-slot.filled img { height:clamp(28px,calc(var(--standing-height,80px) * .45),47px) }
 .workshop-builder .field-tip a { color:var(--brand-cyan); display:inline-flex; align-items:center; min-height:44px }
}
@media(min-width:821px) { .builder-roster-jump { display:none } }
@media(max-width:420px) {
 .workshop .field-slot { width:11.8% }
 .workshop .field-slot small { font-size:8px }
 .workshop .draft-field-panel { padding:4px }
 .workshop .fighter { gap:5px; padding:6px; font-size:12px }
}

/* Keep the selected fighter and the next action close to the mobile task. */
.draft-placement, .builder-return { display: none; }
.utility-grid { grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); }
.utility-fighters .fighters { margin-top: 12px; }
#scouting-details label { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.season-run { margin-block: 14px; }
.season-results { margin-bottom: 14px; }
.season-table-wrap { overflow-x: auto; }
.season-results table { width: 100%; }
.workshop-utility :is(pre,.unit-row,table) { max-width: 100%; }
.workshop-utility pre { overflow: auto; }
@media(max-width:820px) {
 .utility-grid { grid-template-columns: minmax(0,1fr); }
 .draft-placement { position: sticky; z-index: 4; top: env(safe-area-inset-top,0px); display: grid; gap: 2px; padding: 9px 12px; margin-bottom: 4px; background: #132540; border: 1px solid #47637d; }
 .draft-placement span { font-size: .8rem; color: var(--brand-cyan); }
 .builder-return { display: inline-flex; min-height: 44px; align-items: center; color: var(--brand-cyan); }
 .workshop-utility .utility-fighters .fighters { max-height: 350px; }
}