/* Mobile workbench: continuous game-like lists, with controls sized for touch. */
.party-page { background:var(--bg); color:var(--text) }
.party-field input,.party-field textarea,.party-field select { border-color:var(--control) }
.source-preview { display:flex; flex-wrap:wrap; gap:4px 12px; padding:0 6px 6px; font-size:12px; color:var(--muted) }
.source-preview .source-level { display:inline; margin:0 }
.filter-done { display:none }
.party-heading>div,.party-page .editor-heading h2,.diff-member,.history-item,.member-slot { min-width:0; overflow-wrap:anywhere }
.party-page .editor-heading { display:flex; align-items:center; justify-content:space-between; gap:12px }
.paste-changes { margin:8px 0; overflow-wrap:anywhere }
.paste-changes p { white-space:pre-wrap }
.party-page .party-tabs { flex-wrap:wrap }
.library-actions p { overflow-wrap:anywhere }
.results-toolbar.effects-toolbar .display-settings { display:block }
.results-toolbar.effects-toolbar .display-settings .check-label { display:none }
@media(max-width:900px) {
  html { scroll-padding-top:76px }
  .app-header { position:relative }
  .catalog-heading { top:0; margin-top:0; min-width:0; border-bottom:1px solid var(--line) }
  .catalog-heading>div { min-width:0 }
  .catalog-heading h2 { font-size:16px; line-height:1.4 }
  .catalog-heading p { font-size:12px; line-height:1.45 }
  .catalog-heading button { flex-shrink:0 }
  button,.text-button,.quiet,.primary,.icon-button,summary { min-height:44px; font-size:14px }
  summary { align-content:center; padding-block:10px; line-height:1.5 }
  input:not([type=checkbox]):not([type=radio]),select,textarea,
  .party-field input,.party-field select,.party-field textarea { font-size:16px; min-height:44px; max-width:100%; min-width:0 }
  input[type=checkbox],input[type=radio] { flex-shrink:0 }
  .field-inline { flex-wrap:wrap; white-space:normal; min-width:0; gap:6px }
  .field-inline select { min-width:0; max-width:100% }
  .field-inline input[type=number],#character-level { width:100px }
  .app-header { flex-wrap:wrap; gap:6px 12px; padding:8px 12px }
  .app-header nav { gap:0; min-width:0; width:100%; order:3 }
  .app-header .nav-button { padding:8px 7px; font-size:14px; min-width:0; white-space:normal; flex:1 }
  .app-header>.text-button { padding:6px 0; font-size:12px }
  .app-header .brand { font-size:17px; margin-right:auto }
  .app-header .brand span { font-size:12px }
  .workspace { padding:12px }
  .workspace>main { padding:0 }
  .build-library { border:0; background:transparent }
  .build-library { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; padding:0 0 8px; margin:0 0 8px; align-items:start }
  .build-library .saved-build-label,.build-library .library-mark { display:none }
  .build-library #saved-builds { grid-column:1/4; width:100%; min-width:0; height:auto; min-height:44px }
  .build-library #library-menu { grid-column:4; grid-row:1; margin:0; position:static; text-align:center }
  .build-library #library-menu summary { padding:10px 4px; min-height:44px }
  .build-library>button { font-size:14px; min-height:44px }
  .build-library #save-build { grid-column:1/3; grid-row:2; padding:6px; min-width:0 }
  .build-library #open-build-import { grid-column:3/5; grid-row:2; padding:6px; min-width:0 }
  .build-library .library-status { grid-column:1/-1; margin:0; font-size:12px; line-height:1.4 }
  .build-library #library-menu[open] { grid-column:1/-1; grid-row:3; text-align:left }
  .build-library .library-actions { position:static; width:100%; max-width:none; box-shadow:none; margin:4px 0; text-align:left; box-sizing:border-box }
  .build-library .library-actions button { width:100%; text-align:left }
  .character-slots { padding:4px 10px; margin-bottom:8px; gap:0 }
  #character-settings>summary { min-height:44px; padding:6px 0; font-size:14px; gap:8px }
  #character-summary { min-width:0; overflow-wrap:anywhere }
  .slot-counters { margin:0; padding:2px 0 4px; gap:4px 12px; font-size:12px }
  .slot-rules { padding:0 }
  .slot-rules p { overflow-wrap:anywhere }
  #slot-fixed { display:block; font-size:12px }
  .character-picker { flex-wrap:wrap; gap:8px; align-items:end }
  .character-picker label:first-child { flex:1 1 calc(100% - 70px); min-width:0 }
  .character-picker input { width:100% }
  .character-picker #character-level { width:100px }
  .character-picker button,.character-picker select,.party-page button,.conflict-banner .conflict-heading button { min-height:44px }
  .editor-nav { display:flex; gap:6px; margin:0 0 8px; padding:4px 0; grid-template-columns:1fr auto }
  .editor-heading h1 { font-size:17px; line-height:1.45; overflow-wrap:anywhere }
  .editor-heading>.hint { display:none }
  .editor-view-buttons { display:flex; width:auto; gap:0; flex:1; }
  .editor-nav .editor-view-buttons button { flex:1; font-size:14px; padding:8px 5px; min-width:0; white-space:normal }
  .editor-nav #editor-add { min-height:44px; font-size:14px; padding:6px; margin-left:0 }
  .loadout-name,.list-skill-name,.loadout-group h2 { font-size:14px }
  .fixed-state,.list-kind,.slot-lock { font-size:12px; line-height:1.4 }
  .loadout-row { min-height:48px }
  .loadout-row button,.loadout-permanent { min-height:44px }
  #build-tools { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px; margin:8px 0 }
  .search-row { display:contents }
  .search-box { grid-column:1/-1; width:100%; min-width:0; height:auto; min-height:44px }
  .search-box input { width:100%; height:auto; min-height:44px; font-size:16px }
  .search-box kbd { display:none }
  .kind-toggles { grid-column:1; margin:0; gap:4px; min-width:0; display:flex; align-items:stretch }
  .kind-toggles legend { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
  .kind-toggles label { min-height:44px; padding:4px 6px; font-size:12px; gap:4px; white-space:normal }
  .search-filter-bar { grid-column:2; margin:0; gap:0 }
  #filter-toggle { min-height:44px; padding:8px; font-size:13px; gap:4px }
  #filter-toggle svg { width:16px; height:16px }
  #filter-count { display:none }
  #active-filters { grid-column:1/-1; margin:0; gap:4px }
  #active-filters:empty { display:none }
  #active-filters button { min-height:44px; white-space:normal; text-align:left }
  .filter-topline { flex-wrap:wrap }
  .discovery-topics button,.discovery-option,.discovery-option span { min-height:44px }
  .discovery-topics button { font-size:14px }
  .discovery-option { font-size:14px; align-items:center }
  .discovery-option span { display:flex; align-items:center }
  .filter-done { display:block; width:100%; margin-top:12px }
  .results-toolbar { gap:6px; padding:6px 0; margin-bottom:4px; flex-wrap:wrap }
  .result-total { font-size:12px; gap:4px }
  .result-total strong { font-size:18px }
  .toolbar-actions { gap:6px; flex-wrap:wrap; width:auto; flex:0 1 auto; justify-content:flex-end }
  .toolbar-actions .field-inline { font-size:12px; gap:4px }
  .toolbar-actions #sort-label { font-size:0; gap:0 }
  .toolbar-actions .field-inline select { width:145px; max-width:100%; font-size:16px }
  .display-settings { position:relative }
  .display-settings>summary { padding:8px 6px; font-size:12px }
  .search-settings>summary,.display-settings>summary,.detail-sources>summary,.all-filters>summary { min-height:44px }
  .display-settings>div { width:240px; max-width:calc(100vw - 32px); right:0; z-index:8 }
  .display-settings[open] { flex-basis:100% }
  .display-settings[open]>div { position:static; width:100%; max-width:none; box-shadow:none }
  .display-settings button { width:100%; white-space:normal; text-align:left }
  .results-toolbar.effects-toolbar .display-settings { display:block }
  .results-toolbar.effects-toolbar .display-settings .check-label { display:none }
  .skill-list .list-skill-name { min-height:44px; padding:6px 4px; gap:4px }
  .skill-list .list-kind { font-size:12px; flex-basis:50px }
  .skill-list .list-name { font-size:14px; line-height:1.5; overflow-wrap:anywhere }
  .skill-brief { font-size:12px; line-height:1.5 }
  .skill-list .pick-skill { min-height:44px; padding:6px 4px; font-size:12px }
  .skill-list .source-preview { padding:0 4px 6px; gap:2px 8px }
  .skill-list .check { width:58px }
  .detail-heading { gap:8px; flex-wrap:wrap }
  .detail-heading h2 { font-size:17px; overflow-wrap:anywhere }
  .detail-content { overflow-wrap:anywhere }
  .effect-controls { flex-wrap:wrap; gap:8px }
  .effect-controls>.field-inline { flex:1 1 140px }
  .effect-controls select { width:100% }
  .effect-controls .comparison-help { flex:1 1 100% }
  #open-compare { display:none }
  .selection-heading { gap:8px; flex-wrap:wrap }
  .progress-controls { flex-wrap:wrap }
  .plan-views>.segmented { display:flex; flex-wrap:wrap }
  .plan-views>.segmented button { flex:1; white-space:normal }
  .multiplier-scroll { overflow:visible }
  .multiplier-table { min-width:0; width:100% }
  .multiplier-table thead { display:none }
  .multiplier-table tbody { display:grid; gap:12px }
  .multiplier-table tr { display:grid; grid-template-columns:1fr 1fr; min-width:0; border:1px solid var(--line); padding:8px }
  .multiplier-table tr>th { grid-column:1/-1; text-align:left; font-size:16px }
  .multiplier-table td { display:flex; flex-direction:column; gap:4px; min-width:0; white-space:normal; padding:8px }
  .multiplier-table td::before { content:attr(data-label); font-size:12px; color:var(--muted) }
  .multiplier-table td:last-child { grid-column:1/-1 }
  .multiplier-table input { width:100%; min-width:0 }
  dialog { width:calc(100vw - 16px); max-width:calc(100vw - 16px); max-height:calc(100dvh - 16px); padding:16px; box-sizing:border-box; overscroll-behavior:contain; scroll-padding-block:64px }
  dialog>header { position:sticky; top:-16px; margin-top:-16px; padding-block:12px; background:var(--panel,#fff); z-index:3; gap:8px }
  dialog h2 { font-size:18px; min-width:0; overflow-wrap:anywhere }
  dialog .dialog-actions { position:sticky; bottom:-16px; background:var(--panel,#fff); padding:12px 0; flex-wrap:wrap; z-index:2; border-top:1px solid var(--line) }
  .dialog-actions button { flex:1 1 100px; white-space:normal }
  dialog .build-import-grid { display:block }
  dialog .build-import-grid>section+section { margin-top:16px }
  dialog textarea { width:100% }
  .party-main { padding:12px }
  .party-toolbar { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:6px; flex-wrap:wrap }
  .party-toolbar>label { display:none }
  .party-toolbar>select { width:100%; min-width:0 }
  #party-status { grid-column:1/-1 }
  #party-management { position:static }
  #party-management[open] { grid-column:1/-1; grid-row:2 }
  #party-management .party-menu { position:static; width:100%; max-width:none; box-shadow:none; box-sizing:border-box }
  .party-heading { gap:8px; flex-wrap:wrap }
  .party-heading h1 { font-size:19px; overflow-wrap:anywhere }
  .party-heading>div { flex:1 1 150px }
  .party-page .party-tabs button { flex:1; padding:8px 5px; font-size:13px; white-space:normal }
  .party-page .editor-heading { display:flex; grid-template-columns:none }
  .party-page .editor-heading h2 { font-size:18px }
  .member-slot strong { font-size:14px }
  .member-slot .slot-note,.member-slot small { font-size:12px }
  .member-secondary summary,.party-skill summary,.diff-member summary,.rule-row summary { min-height:44px; font-size:14px }
  .party-menu { max-width:calc(100vw - 24px) }
  .rule-row { gap:6px; min-width:0 }
  .rule-row>details { min-width:0; overflow-wrap:anywhere }
  .rule-row summary { flex-wrap:wrap }
  .history-item strong,.party-page h3,.history-original summary { overflow-wrap:anywhere }
  .member-apply-row { flex-wrap:wrap }
  .selection-bar { padding-bottom:max(8px,env(safe-area-inset-bottom)) }
  #basket-open { white-space:normal; min-width:0 }
}
@media(max-width:360px) {
  .app-header { padding-inline:8px; gap:4px 8px }
  .app-header .brand { font-size:15px }
  .app-header .nav-button { font-size:13px; padding-inline:4px }
  .workspace,.party-main { padding:8px }
  .kind-toggles label { padding:4px; font-size:12px }
  #filter-toggle { padding:6px; font-size:12px }
  #filter-toggle svg,.filter-chevron { display:none }
  .toolbar-actions { width:100%; justify-content:space-between }
  .editor-nav { display:flex; flex-wrap:wrap }
  .editor-heading { flex:1 1 140px }
  .editor-view-buttons { order:3 }
}
@media(max-height:500px) and (max-width:900px) {
  .catalog-heading { position:static }
  dialog { max-height:calc(100dvh - 8px) }
  dialog>header { position:static }
  dialog .dialog-actions { position:static }
}