/* Task scope, bounded filtering and list/detail navigation. No remote assets. */
.app-header nav { flex:1; gap:8px }
.app-header .nav-button { display:inline-flex; align-items:center; justify-content:center; gap:7px; text-decoration:none; font-size:14px }
.app-header .nav-button .ui-icon { width:19px; height:19px }
.app-header .nav-button.active { color:var(--accent); background:var(--tint); border-radius:4px 4px 0 0 }
.catalog-modes { display:flex; gap:8px; margin:0 0 16px; border-bottom:1px solid var(--line) }
.catalog-modes button { border:0; border-bottom:3px solid transparent; border-radius:0; background:transparent; min-height:44px; font-size:14px }
.catalog-modes button[aria-pressed=true] { border-bottom-color:var(--accent); font-weight:700 }
.editor-nav>.editor-heading { display:none }
.workbench.with-catalog { grid-template-columns:minmax(290px,340px) minmax(0,1fr); gap:24px }
.with-catalog .loadout-row { flex-wrap:wrap; padding:4px 8px }
.with-catalog .loadout-name { flex:1 1 130px; min-width:0; font-size:14px }
.with-catalog .loadout-actions { margin-left:auto; flex:0 0 auto }
#selection-target { font-size:13px; min-width:0; overflow-wrap:anywhere; line-height:1.4 }
.selection-bar #basket-open { flex-shrink:0 }
.filter-status { font-size:14px; color:#a32929; margin:0 }
.filter-status:not(:empty) { margin:12px 0 }
#member-party-context { margin:0 0 4px; overflow-wrap:anywhere }
.with-catalog .loadout-row:has(.fixed-state) .loadout-name { flex-basis:auto }
.with-catalog .fixed-state { max-width:75px; font-size:12px }
.with-catalog .loadout-panel { top:74px }
.loadout-end-add { width:100%; min-height:44px; border-style:dashed; font-size:14px; color:var(--accent) }
.catalog-heading { border-bottom:1px solid var(--line); padding-bottom:12px }
.catalog-heading h2 { font-size:18px }
.catalog-heading button { font-size:14px }
.list-name { font-size:16px }
.list-kind { font-size:12px }
.skill-brief { font-size:14px; line-height:1.5 }
body:not(.focused-query) .skill-brief { display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden }
.list-skill-name { gap:10px }
.list-text { gap:3px 12px }
.pick-skill { min-height:44px; font-size:14px }
.result-table.skill-list .skill-row>td { padding-block:7px }
.loadout-empty { padding:20px; border-style:solid; text-align:left }
.loadout-empty h2 { font-size:16px }
.loadout-empty p { margin:8px 0 12px; font-size:14px }
.filter-dialog { padding:0; width:min(760px,calc(100vw - 32px)); max-width:760px; max-height:calc(100dvh - 32px); overflow:auto }
.filter-dialog::backdrop { background:#172c3a66 }
.filter-dialog #build-sidebar { display:block; padding:0 20px }
.filter-topline { position:sticky; top:0; padding:12px 0; z-index:2; background:var(--paper); display:flex; justify-content:space-between; align-items:center; gap:12px; border-bottom:1px solid var(--line) }
.filter-topline h2 { font-size:18px }
.filter-topline button { min-height:44px; font-size:14px }
.filter-instruction { font-size:14px; color:var(--muted); margin:12px 0 }
.filter-dialog #filters { display:grid; grid-template-columns:164px minmax(0,1fr); gap:20px; align-items:start }
.filter-category-list { display:flex; flex-direction:column; border-right:1px solid var(--line); padding-right:12px; gap:3px }
.filter-category-list button { display:flex; align-items:center; gap:5px; width:100%; min-height:44px; padding:8px; border:0; border-left:3px solid transparent; border-radius:0; text-align:left; font-size:14px; background:transparent }
.filter-category-list button>span:first-child { flex:1 }
.filter-category-list small:not(:empty) { color:var(--accent); background:var(--tint); min-width:20px; text-align:center; font-size:13px; border-radius:3px }
.filter-category-list button[aria-selected=true] { border-left-color:var(--accent); background:#edf0f2; font-weight:700 }
.filter-option-panel { min-width:0 }
.filter-option-panel fieldset { border:0; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:7px }
.filter-option-panel legend { font-weight:700; font-size:16px; margin:4px 0 12px; width:100% }
.filter-option-panel .discovery-option { min-height:44px; font-size:14px; padding:7px 10px; gap:8px; border:1px solid var(--line); background:var(--paper); border-radius:4px; margin:0 }
.filter-option-panel .discovery-option:has(input:checked) { border-color:var(--accent); background:var(--tint) }
.filter-option-panel .discovery-option span { min-height:0 }
.filter-dialog .search-settings { margin-top:16px; border-top:1px solid var(--line) }
.filter-dialog .search-settings summary { min-height:44px; font-size:14px; padding:12px 0 }
.filter-footer { display:flex; gap:12px; justify-content:space-between; position:sticky; bottom:0; background:var(--paper); border-top:1px solid var(--line); padding:12px 0; margin-top:16px; z-index:2 }
.filter-footer #filter-done { display:block; width:auto; margin:0; min-height:44px; font-size:14px; margin-left:auto }
.filter-footer #reset { min-height:44px; font-size:14px }
.party-tabs { margin-bottom:18px }
#history-back { min-height:44px; font-size:14px; margin-bottom:8px }
.party-empty button { margin:4px }
@media(min-width:901px) {
  .app-header { padding-block:10px }
  #build-tools { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 12px; align-items:end }
  #build-tools .search-row { display:flex; gap:10px; margin:0 }
  #build-tools .search-box { flex:1; min-width:0 }
  #build-tools .search-filter-bar { margin:0 }
  #build-tools .kind-toggles { display:flex; flex-wrap:nowrap }
  #build-tools .kind-toggles legend { display:none }
  #build-tools .kind-toggles label { font-size:12px; padding:5px 7px; gap:4px; min-height:44px }
  #active-filters { grid-column:1/-1 }
}
@media(max-width:1100px) and (min-width:901px) {
  .workbench.with-catalog { grid-template-columns:280px minmax(0,1fr) }
  .with-catalog #build-tools .search-row { flex-wrap:wrap }
  .with-catalog #build-tools .search-box { flex-basis:100% }
}
@media(max-width:900px) {
  .app-header { gap:4px 8px; padding:6px 12px }
  .app-header nav { width:100%; flex-basis:100%; gap:0; order:3 }
  .app-header .nav-button { padding:8px 5px; font-size:14px; min-height:44px }
  .app-header #about { min-height:36px; font-size:13px }
  .workbench.with-catalog { display:block }
  .catalog-heading { position:static; margin-bottom:10px; padding:0 0 10px }
  .catalog-heading h2 { font-size:16px }
  .catalog-heading p { font-size:13px }
  .catalog-modes { margin-bottom:12px }
  .catalog-modes button { flex:1; padding:8px 4px; font-size:14px }
  .standalone-catalog #main { padding-top:12px }
  .skill-list .list-skill-name { display:grid!important; grid-template-columns:auto minmax(0,1fr) auto; gap:2px 5px }
  .skill-list .list-kind { grid-column:1; grid-row:1; font-size:12px; line-height:1.4; align-self:start; margin-top:3px }
  .skill-list .list-text { display:contents }
  .skill-list .list-name { grid-column:2; grid-row:1; font-size:16px; line-height:1.45; display:block }
  .skill-list .skill-brief { grid-column:1/3; grid-row:2; display:block; font-size:14px; line-height:1.45; margin-top:2px }
  body:not(.focused-query) .skill-list .skill-brief { display:-webkit-box }
  .skill-list .list-chevron { grid-column:3; grid-row:1/3 }
  .result-table.skill-list .skill-row { gap:3px 8px; padding:8px 10px; align-items:center }
  .skill-list .skill-row>.pick-cell { align-self:center }
  .skill-list .pick-skill { min-width:68px; font-size:14px; padding:7px }
  .filter-dialog { width:calc(100vw - 16px); max-height:calc(100dvh - 16px) }
  .filter-dialog #build-sidebar { padding:0 12px }
  .filter-dialog #filters { grid-template-columns:110px minmax(0,1fr); gap:12px }
  .filter-category-list { padding-right:6px; gap:2px }
  .filter-category-list button { padding:8px 4px; font-size:14px; line-height:1.4 }
  .filter-category-list button>span:last-child { display:none }
  .filter-option-panel .discovery-option { width:100%; padding:8px; font-size:14px }
  .filter-option-panel legend { font-size:15px }
  .filter-instruction { margin:10px 0 }
  .filter-footer { gap:6px; padding-bottom:max(12px,env(safe-area-inset-bottom)) }
  .filter-footer #reset { padding:6px }
  .filter-footer #filter-done { padding:8px 12px }
  .member-focused #member-strip,.history-focused #history-list { display:none }
  .member-focused .party-heading,.history-focused .party-heading { display:none }
  .member-focused .party-toolbar,.history-focused .party-toolbar { margin-bottom:8px }
  .member-focused .party-tabs,.history-focused .party-tabs { margin-bottom:12px }
  .party-page .member-editor { scroll-margin-top:12px }
  .party-page #member-close { min-height:44px; font-size:14px; white-space:normal }
}
@media(max-width:360px) {
  .app-header .nav-button { font-size:13px; gap:5px }
  .app-header .nav-button .ui-icon { width:17px; height:17px }
  .filter-dialog #filters { grid-template-columns:98px minmax(0,1fr); gap:8px }
}
@media(max-height:500px) {
  .filter-dialog .filter-topline,.filter-dialog .filter-footer { position:static }
}