:root {
  --bg: #f6f7f9;
  --panel: #ffffff;
  --panel-soft: #fafbfc;
  --control: #ffffff;
  --table-head: #edf1f5;
  --table-hover: #fafbfc;
  --sort-hover: #dfe6ee;
  --chip-bg: #f8fafc;
  --chip-border: #e1e7ef;
  --chip-text: #4b5b6f;
  --side-bg: #202733;
  --side-text: #eef2f6;
  --side-line: #3a4454;
  --side-active-bg: #eef2f6;
  --side-active-text: #202733;
  --line: #d8dde6;
  --text: #18202b;
  --muted: #657386;
  --accent: #1f7a5f;
  --danger: #b42318;
  --danger-line: #e4aaa4;
  --warn: #946200;
  --blue: #245f9f;
  --icon-border: #cbd5e1;
}
[data-theme="dark"] {
  --bg: #0f141b;
  --panel: #17202b;
  --panel-soft: #111820;
  --control: #101821;
  --table-head: #202b38;
  --table-hover: #1c2632;
  --sort-hover: #2a3746;
  --chip-bg: #111a24;
  --chip-border: #314052;
  --chip-text: #c2ccda;
  --side-bg: #0b1118;
  --side-text: #e6edf7;
  --side-line: #293545;
  --side-active-bg: #263545;
  --side-active-text: #f4f7fb;
  --line: #2b3949;
  --text: #e8eef7;
  --muted: #9aa9bb;
  --accent: #2aa67f;
  --danger: #ff7b72;
  --danger-line: #7d352f;
  --warn: #f2b84b;
  --blue: #6aa9ff;
  --icon-border: #3d4b5d;
  color-scheme: dark;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font: 14px/1.4 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button, input, textarea, select { font: inherit; }
button { border: 1px solid var(--line); background: var(--control); color: var(--text); border-radius: 6px; padding: 7px 10px; cursor: pointer; }
button.primary { background: var(--accent); color: #fff; border-color: var(--accent); }
button.danger { color: var(--danger); border-color: var(--danger-line); }
button.attention { border-color: var(--warn); box-shadow: 0 0 0 2px color-mix(in srgb, var(--warn) 14%, transparent); }
button:disabled { opacity: .55; cursor: not-allowed; }
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible,
.detail-panel:focus-visible,
.raid-night-detail:focus-visible,
#lootCouncilBoard:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--blue) 72%, #fff);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--blue) 16%, transparent);
}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.icon-btn { width: 34px; height: 34px; min-width: 34px; padding: 6px; display: inline-flex; align-items: center; justify-content: center; line-height: 1; flex: 0 0 auto; }
.icon-btn .btn-icon { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pin-btn.icon-btn { min-width: 34px; vertical-align: middle; }
input, textarea, select { width: 100%; border: 1px solid var(--line); border-radius: 6px; padding: 8px 9px; background: var(--control); color: var(--text); }
textarea { min-height: 180px; resize: vertical; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; }
textarea.compact { min-height: 76px; }
.app { min-height: 100vh; display: grid; grid-template-columns: 240px 1fr; }
.share-mode .app { grid-template-columns: 1fr; }
.share-mode .side, .share-mode .roster-panel { display: none; }
.share-mode .main { max-width: 1180px; width: 100%; margin: 0 auto; }
.share-mode.roster-share-mode .roster-panel { display: block; }
.share-mode.roster-share-mode .roster-layout { grid-template-columns: minmax(0, 1fr); }
.share-mode.roster-share-mode .detail-panel { display: none; }
.share-mode #lootShareCreate,
.share-mode #lootShareExpiry,
.share-mode #lootShareCopy,
.share-mode #lootShareLink { display: none; }
.loot-read-only .loot-admin { display: none; }
.roster-read-only .filters,
.roster-read-only .roster-viewbar,
.roster-read-only .bulkbar,
.roster-read-only #rosterActionCenter,
.roster-read-only #raidShareLink,
.roster-read-only #raidShareStatus,
.roster-read-only .check-cell,
.roster-read-only table th:last-child,
.roster-read-only table td:last-child { display: none; }
.side { background: var(--side-bg); color: var(--side-text); padding: 18px 14px; }
.brand { display: flex; align-items: center; gap: 9px; font-weight: 700; font-size: 18px; margin-bottom: 18px; }
.nav { display: grid; gap: 4px; }
.nav button { width: 100%; min-height: 34px; display: flex; align-items: center; gap: 8px; text-align: left; background: transparent; color: var(--side-text); border-color: transparent; border-radius: 4px; padding: 6px 8px; line-height: 1.2; }
.nav button:hover { border-color: var(--side-line); background: color-mix(in srgb, var(--side-text) 8%, transparent); }
.nav button.active { background: var(--side-active-bg); color: var(--side-active-text); border-color: var(--side-active-bg); font-weight: 700; }
.nav-icon { width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 18px; }
.nav-icon svg, .nav button svg { width: 18px; height: 18px; max-width: 18px; max-height: 18px; display: block; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.nav-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-utility { display: grid; gap: 4px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--side-line); }
.main { padding: 18px; min-width: 0; }
.toolbar { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin-bottom: 16px; }
.toolbar h1 { font-size: 20px; margin: 0; letter-spacing: -.02em; }
.grid { display: grid; gap: 14px; }
.two { grid-template-columns: minmax(0, 1fr) minmax(320px, 420px); align-items: start; }
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 16px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.panel h2 { font-size: 15px; margin: 0 0 12px; letter-spacing: -.01em; }
.job-card { padding: 10px; margin-bottom: 8px; }
.row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 10px; }
.row.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.field { display: grid; gap: 4px; min-width: 0; }
.field label { color: var(--muted); font-size: 12px; font-weight: 700; line-height: 1.2; }
.field.invalid input, .field.invalid select, .field.invalid textarea { border-color: var(--danger-line); box-shadow: 0 0 0 2px color-mix(in srgb, var(--danger) 14%, transparent); }
.field-error { min-height: 15px; color: var(--danger); font-size: 12px; line-height: 1.25; overflow-wrap: anywhere; }
.secret-state { min-height: 17px; font-size: 12px; line-height: 1.2; }
.secret-state.configured { color: var(--accent); font-weight: 600; }
.settings-layout { display: grid; gap: 14px; }
.settings-validation-summary { border: 1px solid var(--danger-line); border-left: 4px solid var(--danger); border-radius: 8px; padding: 10px 12px; background: color-mix(in srgb, var(--danger) 8%, var(--panel)); color: var(--text); }
.settings-validation-summary strong { display: block; margin-bottom: 4px; }
.settings-validation-summary ul { margin: 0; padding-left: 18px; }
.settings-section { display: grid; gap: 10px; transition: border-color .15s ease, box-shadow .15s ease; }
.settings-section.dirty { border-color: color-mix(in srgb, var(--warn) 58%, var(--line)); box-shadow: inset 3px 0 0 var(--warn); }
.settings-section h2 { margin: 0; }
.settings-section .row { margin-bottom: 0; }
.settings-section-head { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.settings-section-title { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; min-width: 0; }
.settings-dirty-badge { border: 1px solid var(--line); border-radius: 999px; padding: 2px 7px; font-size: 11px; line-height: 1.2; font-weight: 700; }
.settings-dirty-badge.dirty { border-color: color-mix(in srgb, var(--warn) 64%, var(--line)); color: var(--warn); background: color-mix(in srgb, var(--warn) 10%, transparent); }
.settings-test-hint { font-size: 12px; line-height: 1.25; }
.settings-test-hint.warn { color: var(--warn); font-weight: 700; }
.settings-toggle { justify-self: start; }
.settings-status { min-height: 20px; }
.alert-suppression-row { display: grid; grid-template-columns: minmax(220px, 1fr) 110px minmax(180px, auto); gap: 10px; align-items: end; }
.alert-delivery-history { max-height: 320px; }
.alert-delivery-row { grid-template-columns: minmax(130px, .45fr) minmax(0, 1fr) auto; }
.alert-delivery-row.alert-delivery-failed { border-color: var(--danger-line); }
.alert-delivery-row.alert-delivery-skipped { border-color: color-mix(in srgb, var(--warn) 55%, var(--line)); }
.control-inline { width: auto; margin-right: 6px; }
.select-inline { width: auto; }
.toolbar-tight { margin-bottom: 8px; }
.gap-bottom-xs { margin-bottom: 8px; }
.gap-bottom-sm { margin-bottom: 10px; }
.gap-top-xs { margin-top: 8px; }
.gap-top-sm { margin-top: 10px; }
.gap-top-md { margin-top: 12px; }
.gap-top-lg { margin-top: 18px; }
.panel-gap-top { margin-top: 14px; }
.panel-gap-bottom { margin-bottom: 14px; }
.source-kind-control { margin: 10px 0; }
.table-scroll { overflow: auto; }
.source-validation-output { white-space: pre-wrap; overflow: auto; max-height: 360px; }
	    .actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
	    .filters { display: grid; grid-template-columns: minmax(180px, 1.2fr) minmax(120px, .7fr) minmax(120px, .7fr) minmax(130px, .7fr) minmax(130px, .7fr) auto; gap: 8px; align-items: center; margin: 8px 0 10px; }
	    .bulkbar { display: flex; justify-content: space-between; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 10px; }
	    .roster-viewbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0 0 10px; }
	    .roster-viewbar select { width: auto; min-width: 150px; }
	    .density-toggle { display: inline-flex; gap: 0; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: var(--control); }
	    .density-toggle button { border: 0; border-radius: 0; min-height: 34px; padding: 6px 10px; background: transparent; color: var(--muted); }
	    .density-toggle button + button { border-left: 1px solid var(--line); }
	    .density-toggle button.active { background: var(--accent); color: #fff; }
	    .column-chooser-wrap { position: relative; }
	    .column-chooser-wrap summary { cursor: pointer; list-style-position: inside; }
	    .column-chooser { display: flex; gap: 6px; flex-wrap: wrap; max-width: min(620px, calc(100vw - 48px)); padding: 8px 0 0; }
	    .roster-layout { display: grid; grid-template-columns: minmax(620px, 1fr) minmax(360px, 440px); gap: 14px; align-items: start; }
	    .roster-panel, .detail-panel { min-width: 0; }
	    .roster-panel { overflow: hidden; }
	    .roster-filter-chips { position: sticky; top: 0; z-index: 5; display: grid; gap: 6px; margin: 0 0 10px; padding: 8px 0; background: var(--panel); border-bottom: 1px solid var(--line); }
	    .filter-chip-row { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; min-width: 0; }
	    .filter-chip-meta { color: var(--muted); font-size: 12px; }
	    .filter-chip { display: inline-flex; gap: 6px; align-items: center; min-height: 30px; border: 1px solid var(--chip-border); border-radius: 999px; padding: 4px 9px; background: var(--chip-bg); color: var(--chip-text); font-size: 12px; font-weight: 700; }
	    .filter-chip strong { min-width: 20px; padding: 1px 6px; border-radius: 999px; background: var(--panel); color: var(--text); text-align: center; }
	    .filter-chip.active { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, var(--chip-bg)); color: var(--text); box-shadow: inset 0 0 0 1px var(--accent); }
	    .clear-chip { background: var(--control); color: var(--muted); }
	    .clear-chip span { font-weight: 900; }
	    .roster-result-count { margin-right: 4px; font-weight: 700; }
	    .roster-table-wrap { position: relative; overflow: auto; max-height: min(430px, 48vh); padding-bottom: 4px; }
	    .roster-table-wrap table { min-width: 960px; border-collapse: separate; border-spacing: 0; }
	    .roster-table-wrap th, .roster-table-wrap td { white-space: normal; }
	    .roster-table-wrap th, .roster-table-wrap td { padding: 7px 8px; }
	    .density-compact .roster-table-wrap table { min-width: 880px; }
	    .density-compact .roster-table-wrap th, .density-compact .roster-table-wrap td { padding: 4px 6px; font-size: 12px; line-height: 1.25; }
	    .density-compact .roster-table-wrap .muted { font-size: 11px; }
	    .density-compact .pin-btn { min-width: 28px; padding: 4px; }
	    .roster-table-wrap th { position: sticky; top: 0; z-index: 2; }
	    .roster-table-wrap th:last-child, .roster-table-wrap td:last-child { min-width: 150px; }
	    .roster-table-wrap td:last-child .actions { gap: 6px; flex-wrap: wrap; }
	    .roster-table-wrap td:last-child button { padding: 5px 8px; }
.detail-panel { position: sticky; top: 18px; max-height: calc(100vh - 36px); overflow-y: auto; }
.raid-night-workspace { display: grid; grid-template-columns: minmax(280px, .65fr) minmax(420px, 1fr) minmax(320px, .75fr); grid-template-areas: "checklist detail loot" "roster detail jobs" "roster detail alerts"; gap: 12px; align-items: start; }
.raid-night-workspace .panel { min-width: 0; }
.raid-night-checklist { grid-area: checklist; }
.raid-night-roster { grid-area: roster; position: sticky; top: 18px; max-height: calc(100vh - 36px); overflow: auto; }
.raid-night-detail { grid-area: detail; max-height: calc(100vh - 36px); overflow: auto; }
.raid-night-loot { grid-area: loot; }
.raid-night-jobs { grid-area: jobs; }
.raid-night-alerts { grid-area: alerts; }
.raid-night-roster-list { display: grid; gap: 6px; }
.raid-night-roster-row { width: 100%; display: grid; grid-template-columns: minmax(120px, .9fr) minmax(120px, .8fr) minmax(140px, 1fr); gap: 8px; align-items: center; text-align: left; border-radius: 7px; min-height: 54px; }
.raid-night-roster-row.selected-row { border-color: var(--blue); box-shadow: inset 4px 0 0 var(--blue); }
.raid-night-roster-row span { min-width: 0; display: grid; gap: 2px; }
.raid-night-roster-row strong, .raid-night-roster-row em { overflow-wrap: anywhere; }
.raid-night-roster-row em { color: var(--muted); font-style: normal; font-size: 12px; }
.raid-night-detail-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.raid-night-detail-meta { margin: 0 0 10px; }
.raid-night-slot-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.raid-night-slot { border: 1px solid var(--line); border-radius: 7px; padding: 7px; background: var(--panel-soft); min-width: 0; display: grid; gap: 3px; }
.raid-night-slot span, .raid-night-slot em { overflow-wrap: anywhere; }
.raid-night-slot em { color: var(--muted); font-style: normal; font-size: 12px; }
.raid-night-loot-table { min-width: 620px; }
.raid-checklist-list { display: grid; gap: 6px; }
.raid-checklist-row { display: grid; grid-template-columns: minmax(130px, 1fr) auto; gap: 8px; align-items: start; border: 1px solid var(--line); border-radius: 7px; padding: 8px; background: var(--panel-soft); }
.raid-checklist-row .checklist-badges { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.raid-analysis-layout { display: grid; grid-template-columns: minmax(360px, 1fr) minmax(360px, .9fr); gap: 14px; align-items: start; }
.raid-analysis-workflow-panel { grid-column: 1 / -1; min-width: 0; }
.raid-analysis-imports,
.raid-analysis-roster-panel,
.raid-analysis-checklist-panel,
.raid-analysis-jobs-panel,
.raid-analysis-publish-panel { min-width: 0; }
.raid-analysis-steps { display: grid; gap: 8px; }
.raid-analysis-step { display: grid; grid-template-columns: 34px minmax(190px, 1fr) minmax(92px, .35fr) auto; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 7px; padding: 9px; background: var(--panel-soft); }
.raid-analysis-step strong,
.raid-analysis-step span { min-width: 0; overflow-wrap: anywhere; }
.raid-analysis-step-index { width: 28px; height: 28px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; background: var(--panel); border: 1px solid var(--line); }
.raid-analysis-step-main { display: grid; gap: 2px; }
.raid-analysis-step-state { justify-self: start; border: 1px solid var(--line); border-radius: 999px; padding: 3px 8px; font-size: 12px; font-weight: 700; background: var(--panel); }
.raid-analysis-step > .actions { justify-content: flex-end; }
.raid-analysis-step.ok { border-color: color-mix(in srgb, var(--accent) 46%, var(--line)); }
.raid-analysis-step.warn { border-color: color-mix(in srgb, var(--warn) 55%, var(--line)); }
.raid-analysis-table { min-width: 860px; }
.raid-analysis-table td { white-space: normal; }
.raid-analysis-table td:last-child { min-width: 150px; }
.raid-analysis-flags { display: flex; gap: 5px; flex-wrap: wrap; }
.raid-analysis-share-grid { display: grid; gap: 8px; }
.raid-analysis-share-row { display: grid; grid-template-columns: minmax(80px, .5fr) minmax(110px, .65fr) auto auto; gap: 8px; align-items: center; }
.raid-analysis-share-row strong { min-width: 0; overflow-wrap: anywhere; }
.admin-tabs { margin: 10px 0 14px; }
[data-admin-section].hidden-section { display: none; }
.mobile-roster-cards { display: none; gap: 8px; }
.mobile-roster-card { border: 1px solid var(--line); border-radius: 7px; padding: 10px; background: var(--panel-soft); display: grid; gap: 8px; }
.mobile-roster-card-head { display: flex; justify-content: space-between; gap: 8px; align-items: start; }
.mobile-roster-card-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.mobile-roster-card-metrics span { border: 1px solid var(--line); border-radius: 6px; padding: 6px; min-width: 0; overflow-wrap: anywhere; }
	    .detail-empty { min-height: 260px; display: grid; place-items: center; text-align: center; }
	    .detail-empty-state { max-width: 320px; margin: auto; }
	    .detail-empty-state h2 { margin-bottom: 6px; }
	    .detail-loading { min-height: 260px; }
	    .empty-state { min-height: 72px; display: grid; align-content: center; gap: 4px; padding: 14px; border: 1px dashed var(--line); border-radius: 8px; background: var(--panel-soft); text-align: center; }
	    .skeleton-list { display: grid; gap: 8px; width: 100%; }
	    .skeleton-row, .skeleton-card, .skeleton-slot { pointer-events: none; }
	    .skeleton-card { min-height: 88px; display: grid; align-content: center; gap: 7px; }
	    .skeleton-slot { min-height: 112px; }
	    .skeleton-line { display: block; height: 10px; width: 100%; max-width: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--chip-border), color-mix(in srgb, var(--chip-border) 35%, var(--panel)), var(--chip-border)); background-size: 220% 100%; animation: skeleton-pulse 1.25s ease-in-out infinite; }
	    .skeleton-gap { display: block; height: 7px; }
	    .skeleton-tiny { width: 24px; }
	    .skeleton-small { width: 64px; }
	    .skeleton-short { width: 38%; }
	    .skeleton-medium { width: 68%; }
	    .skeleton-table-row td { height: 52px; vertical-align: middle; }
	    .empty-table-row td { padding: 12px; }
	    @keyframes skeleton-pulse { 0% { background-position: 120% 0; } 100% { background-position: -120% 0; } }
	    @media (prefers-reduced-motion: reduce) { .skeleton-line { animation: none; } }
	    .source-cell { display: grid; gap: 2px; min-width: 180px; }
	    .source-ref { max-width: 260px; overflow-wrap: anywhere; white-space: normal; }
	    .muted { color: var(--muted); }
.error { color: var(--danger); font-weight: 600; }
.ok { color: var(--accent); font-weight: 600; }
.warn { color: var(--warn); font-weight: 600; }
.summary-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin-bottom: 14px; }
.summary-tile { border: 1px solid var(--line); border-radius: 8px; padding: 11px; background: var(--panel-soft); min-height: 88px; }
.summary-tile strong { display: block; margin-bottom: 5px; }
.share-panel { border: 1px solid var(--line); border-radius: 8px; padding: 12px; background: var(--panel-soft); margin: 0 0 14px; display: grid; gap: 8px; }
.compact-link { margin: 8px 0 10px; font-size: 12px; }
.schedule-list { display: grid; gap: 10px; }
.schedule-row { border: 1px solid var(--line); border-radius: 8px; padding: 11px; background: var(--panel-soft); display: grid; gap: 10px; }
.schedule-head { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; flex-wrap: wrap; }
.schedule-row textarea { min-height: 86px; }
.job-template-form { display: grid; grid-template-columns: minmax(160px, 1fr) minmax(150px, .75fr) minmax(150px, .75fr) auto; gap: 10px; align-items: end; margin-bottom: 12px; }
.job-template-form > .actions, .job-template-json-field { grid-column: 1 / -1; }
.job-template-capture-actions { justify-content: flex-end; }
.job-template-row { grid-template-columns: minmax(190px, .85fr) minmax(0, 1fr) auto; }
.user-management-form { display: grid; grid-template-columns: minmax(140px, 1fr) minmax(150px, 1fr) minmax(140px, .8fr) auto; gap: 10px; align-items: end; margin-bottom: 12px; }
.user-management-form > .actions { grid-column: 1 / -1; }
.user-active-toggle { min-height: 38px; align-self: end; }
.user-management-list { display: grid; gap: 8px; }
.user-management-row { display: grid; grid-template-columns: minmax(170px, 1.2fr) minmax(82px, .45fr) minmax(126px, .7fr) auto; gap: 10px; align-items: center; border-top: 1px solid var(--line); padding-top: 8px; }
.user-management-row:first-child { border-top: 0; padding-top: 0; }
.upgrade-presets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 8px; }
.upgrade-flow { align-items: start; }
.upgrade-stepper { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin: 0 0 14px; }
.upgrade-step { border: 1px solid var(--line); border-radius: 8px; padding: 8px; background: var(--panel); display: grid; gap: 2px; min-height: 58px; }
.upgrade-step strong { width: 22px; height: 22px; display: inline-grid; place-items: center; border-radius: 999px; background: var(--chip-bg); color: var(--chip-text); font-size: 12px; }
.upgrade-step span { color: var(--muted); font-size: 12px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.upgrade-step.active { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--panel)); }
.upgrade-step.active strong { background: var(--accent); color: #fff; }
.step-kicker { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: 0; text-transform: uppercase; margin: 0 0 4px; }
.upgrade-preset-btn { min-height: 64px; display: grid; gap: 3px; align-content: center; text-align: left; }
.upgrade-preset-btn strong { font-size: 13px; }
.upgrade-preset-btn span { color: var(--muted); font-size: 12px; line-height: 1.25; overflow-wrap: anywhere; }
.upgrade-preset-btn.active { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, var(--control)); }
.upgrade-preset-summary { min-height: 18px; margin: 0 0 10px; font-size: 12px; line-height: 1.35; }
.upgrade-advanced { border-top: 1px solid var(--line); margin-top: 8px; padding-top: 8px; }
.upgrade-advanced summary { cursor: pointer; color: var(--muted); font-size: 12px; font-weight: 700; margin-bottom: 0; text-transform: uppercase; }
.upgrade-advanced[open] summary { margin-bottom: 10px; }
.upgrade-control-groups { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .85fr); gap: 12px; align-items: start; }
.upgrade-control-group { border-top: 1px solid var(--line); padding-top: 10px; display: grid; gap: 10px; min-width: 0; }
.upgrade-control-group:first-child { border-top: 0; padding-top: 0; }
.upgrade-control-group h3 { margin: 0; font-size: 13px; line-height: 1.25; }
.upgrade-control-group .row, .upgrade-control-group .actions { margin-bottom: 0; }
.upgrade-control-group textarea { min-height: 74px; }
.upgrade-control-group[aria-labelledby="upgradeSourcePoolHeading"] { grid-row: span 2; }
.source-curator-grid { grid-template-columns: minmax(260px, .9fr) minmax(360px, 1.3fr); }
.source-curator-files { max-height: 560px; }
.source-curator-slot { grid-template-columns: minmax(120px, .35fr) minmax(0, 1fr); }
.source-curator-review-heading { font-size: 14px; margin: 12px 0 6px; }
.source-curator-proposal-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 8px 0 12px; }
.source-curator-proposal-fact { border: 1px solid var(--line); border-radius: 7px; padding: 8px; background: var(--panel-soft); min-width: 0; display: grid; gap: 3px; }
.source-curator-proposal-fact span { color: var(--muted); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.source-curator-proposal-fact strong { overflow-wrap: anywhere; }
.source-curator-proposal-ops { display: grid; gap: 8px; }
.source-curator-operation-row { grid-template-columns: minmax(108px, .55fr) minmax(0, 1fr) minmax(98px, .45fr); align-items: start; }
.source-curator-slot-order { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 10px; }
.source-curator-order-list { list-style: none; padding: 0; margin: 7px 0 0; display: grid; gap: 5px; }
.source-curator-order-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 7px; align-items: center; border: 1px solid var(--line); border-radius: 7px; padding: 6px 7px; background: var(--panel-soft); }
.source-curator-order-list strong { min-width: 0; overflow-wrap: anywhere; }
.source-curator-order-list em { color: var(--muted); font-style: normal; font-size: 12px; white-space: nowrap; }
.source-curator-order-list .is-proposed { border-color: color-mix(in srgb, var(--accent) 50%, var(--line)); background: color-mix(in srgb, var(--accent) 8%, var(--panel-soft)); }
.source-curator-order-list .is-anchor { border-color: color-mix(in srgb, var(--warn) 50%, var(--line)); }
.source-curator-raw { margin-top: 10px; }
.job-head { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; flex-wrap: wrap; }
.job-error { margin-top: 8px; }
.job-error summary { cursor: pointer; }
.job-drawer { position: fixed; right: 18px; bottom: 18px; z-index: 18; width: min(420px, calc(100vw - 36px)); max-height: min(560px, calc(100vh - 36px)); overflow: auto; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); box-shadow: 0 16px 46px rgba(0,0,0,.28); padding: 10px; }
.job-drawer-head { display: flex; justify-content: space-between; gap: 10px; align-items: center; margin-bottom: 8px; }
.job-drawer-head > span { display: flex; gap: 8px; align-items: baseline; min-width: 0; flex-wrap: wrap; }
.job-drawer-close { flex: 0 0 auto; }
.job-drawer-list { display: grid; gap: 8px; }
.job-drawer-row { display: grid; gap: 7px; border: 1px solid var(--line); border-radius: 7px; padding: 8px; background: var(--panel-soft); }
.job-drawer-failed { border-color: color-mix(in srgb, var(--danger) 55%, var(--line)); }
.job-drawer-running, .job-drawer-queued { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); }
.job-drawer-title, .job-drawer-actions { display: flex; justify-content: space-between; gap: 8px; align-items: center; flex-wrap: wrap; }
.job-drawer-title strong { min-width: 0; overflow-wrap: anywhere; }
.job-drawer-actions { justify-content: flex-end; }
.job-drawer-detail summary { cursor: pointer; color: var(--muted); font-size: 12px; font-weight: 700; }
.job-drawer .progress-wrap { margin: 0; }
.toasts { position: fixed; right: 18px; top: 18px; z-index: 20; display: grid; gap: 8px; max-width: min(360px, calc(100vw - 36px)); }
.toast { border: 1px solid var(--line); border-left: 4px solid var(--accent); border-radius: 8px; padding: 10px 12px; background: var(--panel); box-shadow: 0 10px 30px rgba(0,0,0,.14); }
.toast.error { border-left-color: var(--danger); color: var(--text); font-weight: 400; }
.toast.warn { border-left-color: var(--warn); color: var(--text); font-weight: 400; }
table { width: 100%; border-collapse: collapse; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
th, td { padding: 8px 9px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; white-space: nowrap; }
th { background: var(--table-head); color: var(--muted); font-size: 12px; text-transform: uppercase; }
th.sortable { padding: 0; }
.sort-head { width: 100%; display: inline-flex; align-items: center; justify-content: space-between; gap: 6px; padding: 8px 9px; border: 0; border-radius: 0; background: transparent; color: inherit; font-size: inherit; font-weight: 700; text-align: left; text-transform: inherit; }
.sort-head:hover, .sort-head.active { background: var(--sort-hover); }
.sort-indicator { min-width: 8px; text-align: center; }
.check-cell { width: 34px; text-align: center; }
.check-cell input { width: auto; }
.pin-btn { min-width: 34px; padding: 6px; font-size: 12px; }
.pin-btn.active { border-color: var(--accent); color: var(--accent); font-weight: 700; }
.column-hidden { display: none !important; }
.mobile-roster-metrics { display: none; }
.mobile-roster-details { display: none; }
tr.pinned-row td { background: color-mix(in srgb, var(--accent) 7%, var(--panel)); }
tr.selected-row td { background: color-mix(in srgb, var(--blue) 12%, var(--panel)); border-top-color: color-mix(in srgb, var(--blue) 35%, var(--line)); border-bottom-color: color-mix(in srgb, var(--blue) 35%, var(--line)); }
tr.selected-row td:first-child { box-shadow: inset 4px 0 0 var(--blue); }
tr.selected-row td:nth-child(2) strong { color: var(--blue); }
.roster-table-wrap th:last-child { right: 0; z-index: 4; background: var(--table-head); box-shadow: -1px 0 0 var(--line); }
.roster-table-wrap td:last-child { position: sticky; right: 0; z-index: 2; background: var(--panel); box-shadow: -1px 0 0 var(--line); }
tr.pinned-row td:last-child { background: color-mix(in srgb, var(--accent) 7%, var(--panel)); }
tr.selected-row td:last-child { background: color-mix(in srgb, var(--blue) 12%, var(--panel)); }
td.wrap { white-space: normal; min-width: 180px; }
tr:hover td { background: var(--table-hover); }
tr:hover td:last-child { background: var(--table-hover); }
.pill { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 999px; padding: 2px 7px; font-size: 12px; background: var(--control); }
.slot-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; }
.slot { position: relative; border: 1px solid var(--line); border-radius: 8px; padding: 11px; background: var(--panel); min-height: 166px; display: flex; flex-direction: column; gap: 10px; }
.slot.empty { background: var(--panel-soft); }
.slot-head { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
.slot-title { font-weight: 700; color: var(--muted); }
.slot-body { display: flex; gap: 10px; align-items: center; min-width: 0; }
.item-icon { width: 46px; height: 46px; border: 2px solid var(--icon-border); border-radius: 7px; background: #111827; object-fit: cover; flex: 0 0 auto; }
.slot-name { font-size: 15px; font-weight: 700; overflow-wrap: anywhere; text-decoration: none; }
.slot-name:hover { text-decoration: underline; }
.slot.empty .slot-name { color: var(--muted); font-weight: 600; }
.quality-text-legendary { color: #ff8000; }
.quality-text-epic { color: #a335ee; }
.quality-text-rare { color: #0070dd; }
.quality-text-uncommon { color: #1eff00; }
.quality-text-common { color: var(--text); }
.quality-text-poor { color: #9d9d9d; }
.quality-text-unknown { color: var(--text); }
.quality-border-legendary { border-color: #ff8000; }
.quality-border-epic { border-color: #a335ee; }
.quality-border-rare { border-color: #0070dd; }
.quality-border-uncommon { border-color: #1eff00; }
.quality-border-common { border-color: #ffffff; }
.quality-border-poor { border-color: #9d9d9d; }
.quality-border-unknown { border-color: var(--icon-border); }
.bis-pill.quality-border-common { border-color: var(--line); }
.slot-meta { display: flex; gap: 6px; flex-wrap: wrap; min-height: 24px; }
.meta-chip { display: inline-flex; align-items: center; border: 1px solid var(--chip-border); border-radius: 999px; padding: 2px 7px; background: var(--chip-bg); color: var(--chip-text); font-size: 12px; }
.meta-chip.warn { border-color: color-mix(in srgb, var(--warn) 55%, var(--chip-border)); color: var(--warn); }
.socket-list { display: flex; gap: 5px; flex-wrap: wrap; min-height: 24px; }
.mini-ref { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; color: var(--text); text-decoration: none; border: 1px solid var(--chip-border); border-radius: 6px; padding: 2px 5px; background: var(--chip-bg); font-size: 12px; }
.mini-ref:hover { border-color: var(--accent); }
.mini-icon { width: 20px; height: 20px; border: 1px solid var(--icon-border); border-radius: 4px; object-fit: cover; background: #111827; flex: 0 0 auto; }
.slot-actions { margin-top: auto; display: flex; gap: 8px; justify-content: flex-end; }
.slot-form { display: none; grid-template-columns: 78px 1fr 78px; gap: 6px; align-items: center; border-top: 1px solid var(--line); padding-top: 10px; }
.slot.editing .slot-form { display: grid; }
.slot.editing .slot-actions { display: none; }
.slot-form .wide { grid-column: 1 / -1; }
.gem-suggestions { margin: 0 0 12px; border: 1px solid var(--line); border-radius: 8px; padding: 10px; background: var(--panel-soft); }
.snapshot-history summary { cursor: pointer; list-style-position: inside; }
.snapshot-summary { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.snapshot-history-body { margin-top: 10px; }
.suggestion-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; border-top: 1px solid var(--line); padding-top: 8px; margin-top: 8px; }
.suggestion-row:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.suggestion-main { min-width: 0; display: grid; gap: 4px; }
.wishlist-section { border: 1px solid var(--line); border-radius: 8px; padding: 12px; background: var(--panel-soft); margin: 0 0 14px; display: grid; gap: 10px; }
.wishlist-add-row { display: grid; grid-template-columns: minmax(96px, .7fr) minmax(120px, 1fr) 88px minmax(132px, .8fr); gap: 10px; margin-bottom: 10px; }
.wishlist-list { display: grid; gap: 8px; }
.wishlist-row { display: grid; grid-template-columns: minmax(180px, 1.35fr) minmax(96px, .65fr) 78px minmax(132px, .75fr) minmax(120px, 1fr) auto; gap: 8px; align-items: start; border: 1px solid var(--line); border-radius: 8px; padding: 9px; background: var(--panel); }
.wishlist-main { min-width: 0; display: grid; gap: 3px; }
.wishlist-suggestion { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; color: var(--warn); font-size: 12px; }
.wishlist-suggestion button { padding: 4px 7px; min-height: 28px; }
.delta { font-weight: 700; color: var(--accent); white-space: nowrap; }
.delta.negative { color: var(--danger); }
.preview-list { display: grid; gap: 8px; margin-top: 10px; max-height: 420px; overflow: auto; }
.preview-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: center; border: 1px solid var(--line); border-radius: 7px; padding: 8px; background: var(--panel-soft); }
.preview-row input { width: auto; }
.preview-row-conflict { grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr); }
.preview-row-snapshot { grid-template-columns: minmax(80px, .4fr) minmax(0, 1fr) minmax(0, 1fr); }
.source-kind-grid { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.source-kind-grid input { width: auto; margin-right: 6px; }
.upgrade-planner { border: 1px solid var(--line); border-radius: 8px; background: var(--panel-soft); padding: 12px; margin: 0 0 14px; }
.upgrade-planner-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 10px; }
.upgrade-planner-head h2 { margin: 0 0 4px; font-size: 16px; }
.upgrade-shopping-list { border: 1px solid var(--line); border-radius: 8px; background: var(--panel-soft); padding: 12px; margin: 0 0 14px; }
.upgrade-shopping-groups { display: grid; gap: 12px; }
.upgrade-shopping-group { display: grid; gap: 8px; border-top: 1px solid var(--line); padding-top: 10px; }
.upgrade-shopping-group:first-child { border-top: 0; padding-top: 0; }
.upgrade-shopping-group-head { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; flex-wrap: wrap; }
.upgrade-shopping-items { display: grid; gap: 7px; }
.upgrade-shopping-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: start; border-top: 1px solid color-mix(in srgb, var(--line) 75%, transparent); padding-top: 7px; }
.upgrade-shopping-item:first-child { border-top: 0; padding-top: 0; }
.upgrade-shopping-item-side { display: grid; justify-items: end; gap: 5px; }
.result-badge.wishlist { border-color: color-mix(in srgb, var(--accent) 35%, var(--chip-border)); color: var(--chip-text); }
.upgrade-partial { border-top: 1px solid var(--line); margin-top: 12px; padding-top: 12px; display: grid; gap: 4px; }
.upgrade-matrix-wrap { overflow: auto; max-height: min(520px, 62vh); border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.upgrade-matrix { min-width: 920px; border: 0; border-radius: 0; }
.upgrade-matrix th { position: sticky; top: 0; z-index: 2; }
.upgrade-matrix th:first-child, .upgrade-matrix td:first-child { position: sticky; left: 0; z-index: 1; background: var(--panel); min-width: 110px; }
.upgrade-matrix th:first-child { z-index: 3; background: var(--table-head); }
.upgrade-matrix td:nth-child(2) { min-width: 230px; white-space: normal; }
.upgrade-matrix td:nth-child(3) { min-width: 105px; }
.upgrade-cell { min-width: 118px; white-space: normal; }
.upgrade-cell.good strong { color: var(--accent); }
.upgrade-cell.bad strong { color: var(--danger); }
.upgrade-cell.noisy { background: color-mix(in srgb, var(--warn) 9%, var(--panel)); }
.upgrade-cell.empty, .upgrade-cell.muted-cell { background: var(--panel-soft); }
.segmented-tabs { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.segmented-tabs button.active { border-color: var(--blue); color: var(--text); background: var(--panel-soft); box-shadow: inset 0 0 0 1px var(--blue); }
.upgrade-result-filters { display: grid; gap: 8px; margin: 0 0 12px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel-soft); position: sticky; top: 0; z-index: 4; }
.upgrade-result-tabs { margin: 0 0 12px; }
.upgrade-filter-toggles { gap: 6px; }
.upgrade-filter-toggle { min-height: 30px; padding: 5px 9px; border-radius: 999px; color: var(--muted); font-size: 12px; font-weight: 700; }
.upgrade-filter-toggle.active { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, var(--control)); color: var(--text); box-shadow: inset 0 0 0 1px var(--accent); }
.upgrade-filter-selects { display: grid; grid-template-columns: repeat(3, minmax(150px, 1fr)); gap: 8px; }
.upgrade-filter-select span { color: var(--muted); font-size: 12px; font-weight: 700; }
.upgrade-filter-summary { display: flex; gap: 8px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.upgrade-filter-summary button { min-height: 30px; padding: 5px 9px; }
.result-legend, .result-badges { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin: 0 0 10px; }
.result-badges { margin: 0 0 4px; }
.result-badge { display: inline-flex; align-items: center; border: 1px solid var(--chip-border); border-radius: 999px; padding: 2px 7px; background: var(--chip-bg); color: var(--chip-text); font-size: 11px; font-weight: 700; }
.result-badge.high { border-color: color-mix(in srgb, var(--accent) 45%, var(--chip-border)); color: var(--accent); }
.result-badge.cached { border-color: color-mix(in srgb, var(--blue) 45%, var(--chip-border)); color: var(--blue); }
.result-badge.noisy { border-color: color-mix(in srgb, var(--warn) 45%, var(--chip-border)); color: var(--warn); }
.result-badge.failed { border-color: color-mix(in srgb, var(--danger) 45%, var(--chip-border)); color: var(--danger); }
.upgrade-result-row.result-high td:first-child { box-shadow: inset 3px 0 0 var(--accent); }
.upgrade-result-row.result-cached td:first-child { box-shadow: inset 3px 0 0 var(--blue); }
.upgrade-result-row.result-noisy td:first-child { box-shadow: inset 3px 0 0 var(--warn); }
.upgrade-result-row.result-failed td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
.result-badge.data { border-color: color-mix(in srgb, var(--accent) 45%, var(--chip-border)); color: var(--accent); }
.result-badge.settings { border-color: color-mix(in srgb, var(--blue) 45%, var(--chip-border)); color: var(--blue); }
.metadata-badges { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 4px; }
.character-metadata-form { border: 1px solid var(--line); border-radius: 8px; padding: 10px; margin: 0 0 12px; background: var(--panel-soft); }
.character-metadata-form .metadata-badges { margin-top: 0; }
.source-kind { font-weight: 700; }
.upgrade-snapshot-compare { border: 1px solid var(--line); border-radius: 8px; background: var(--panel-soft); padding: 12px; display: grid; gap: 10px; }
.upgrade-snapshot-row { grid-template-columns: minmax(0, 1.2fr) minmax(90px, .35fr) minmax(90px, .35fr) auto; }
.hash-chip { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 11px; }
.progress-wrap { display: grid; gap: 8px; }
.progress-line { display: block; width: 100%; height: 10px; border: 1px solid var(--line); border-radius: 999px; overflow: hidden; background: var(--panel-soft); appearance: none; }
.progress-line::-webkit-progress-bar { background: var(--panel-soft); }
.progress-line::-webkit-progress-value { background: var(--accent); transition: width .2s ease; }
.progress-line::-moz-progress-bar { background: var(--accent); }
.progress-meta { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.pager { display: flex; justify-content: flex-end; align-items: center; gap: 8px; flex-wrap: wrap; margin: 10px 0; }
.pager button { min-width: 58px; padding: 5px 8px; }
.fight-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: center; border: 1px solid var(--line); border-radius: 7px; padding: 8px; background: var(--panel-soft); margin-top: 6px; }
.fight-row input { width: auto; }
.report-block { border: 1px solid var(--line); border-radius: 8px; padding: 10px; background: var(--panel); }
.report-head { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; margin-bottom: 6px; }
.login { min-height: 100vh; display: grid; place-items: center; padding: 18px; }
.login .panel { width: min(420px, 100%); }
.hidden { display: none !important; }
/* ---- Nav grouping ---- */
.nav { display: grid; gap: 10px; }
.nav-group { display: grid; gap: 3px; }
.nav-group + .nav-group { padding-top: 8px; border-top: 1px solid var(--side-line); }
.nav-group-label { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: color-mix(in srgb, var(--side-text) 55%, transparent); padding: 2px 8px; }
/* ---- Disclosures (progressive disclosure) ---- */
.disclosure > summary, .toolbar-more > summary { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; list-style: none; width: auto; min-height: 34px; padding: 6px 12px; border: 1px solid var(--line); border-radius: 7px; background: var(--control); color: var(--muted); font-size: 13px; font-weight: 700; }
.disclosure > summary::-webkit-details-marker, .toolbar-more > summary::-webkit-details-marker { display: none; }
.disclosure > summary::after, .toolbar-more > summary::after { content: ""; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; opacity: .6; }
.disclosure[open] > summary, .toolbar-more[open] > summary { color: var(--text); border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); }
.disclosure { margin: 8px 0; }
.disclosure[open] > summary { margin-bottom: 10px; }
.disclosure:not([open]) > :not(summary), .toolbar-more:not([open]) > :not(summary) { display: none !important; }
.disclosure-filters[open] > summary { color: var(--accent); }
/* ---- Toolbar overflow ---- */
.toolbar-more { display: inline-flex; }
.toolbar-more-menu { display: grid; gap: 6px; padding-top: 6px; }
/* ---- Overview search + filters rework ---- */
.roster-search-row { display: grid; grid-template-columns: minmax(180px, 1fr); gap: 8px; align-items: center; margin: 4px 0 8px; }
.roster-search-row #rosterSearch { width: 100%; }
.roster-search-row .roster-filter-chips { position: static; border: 0; background: transparent; padding: 0; margin: 0; }
.filters-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; align-items: center; }
.filters-grid .pill { justify-self: start; }
.disclosure-views .roster-viewbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0; }
/* keep read-only shares clean */
.roster-read-only .disclosure-filters, .roster-read-only .disclosure-views, .roster-read-only .toolbar-more { display: none; }
/* ---- Disclosure menu (toolbar share/switch) ---- */
.disclosure-share { display: inline-flex; }
.disclosure-menu { display: grid; gap: 6px; padding-top: 6px; }
/* ---- Bulk bar polish ---- */
.bulkbar { display: flex; justify-content: space-between; gap: 10px; align-items: center; flex-wrap: wrap; margin: 6px 0 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel-soft); }
.bulkbar .actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.bulkbar button:disabled, .bulkbar select:disabled { opacity: .4; }
.bulkbar button:disabled:not(.danger) { border-style: dashed; }
.bulkbar .danger { margin-left: auto; }
/* ---- Loot council: emphasize sim delta ---- */
.hint { margin: 2px 0 10px; color: var(--muted); font-size: 13px; }
.loot-council-table .delta { font-weight: 700; color: var(--accent); }
.loot-council-table .delta.negative { color: var(--danger); }
/* ---- Item lookup bar (cross-view entry to loot council) ---- */
.item-lookup-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0 0 14px; padding: 8px 10px; border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line)); border-radius: 9px; background: color-mix(in srgb, var(--accent) 6%, var(--panel)); }
.item-lookup-bar.compact { margin: 0 0 8px; padding: 6px 8px; }
.item-lookup-bar .item-lookup-label { font-size: 12px; font-weight: 800; letter-spacing: .03em; color: var(--accent); text-transform: uppercase; white-space: nowrap; }
.item-lookup-bar input { flex: 1 1 220px; min-width: 160px; }
.item-lookup-bar button { flex: 0 0 auto; }
.roster-read-only .item-lookup-bar { display: none; }
@media (max-width: 900px) {
  :root:not([data-theme="dark"]) {
    --side-bg: var(--panel);
    --side-text: var(--text);
    --side-line: var(--line);
    --side-active-bg: color-mix(in srgb, var(--accent) 12%, var(--panel));
    --side-active-text: var(--accent);
  }
  .app { grid-template-columns: 1fr; padding-bottom: 78px; }
  .side { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; padding: 6px 8px calc(6px + env(safe-area-inset-bottom)); border-top: 1px solid var(--side-line); box-shadow: 0 -8px 24px rgba(0,0,0,.18); }
  .brand { display: none; }
  .main { padding: 12px 12px 88px; }
  .toolbar { align-items: flex-start; }
  .toolbar .actions { width: 100%; }
  .nav { display: flex; gap: 5px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: thin; }
  .nav-group { display: contents; }
  .nav-group-label { display: none; }
  .nav-group + .nav-group { border: 0; padding: 0; }
  .nav-group + .nav-group::before { content: ""; width: 1px; align-self: stretch; background: var(--side-line); margin: 4px 2px; }
  .disclosure > summary, .toolbar-more > summary { width: 100%; justify-content: space-between; }
  .nav button { width: auto; min-width: 0; min-height: 36px; flex: 0 0 auto; flex-direction: row; justify-content: center; gap: 5px; padding: 5px 8px; border-radius: 6px; font-size: 11px; line-height: 1.15; text-align: center; }
  .nav button.active { box-shadow: inset 0 0 0 1px var(--side-active-bg); }
  .nav-icon { width: 16px; height: 16px; flex-basis: 16px; }
  .nav-icon svg, .nav button svg { width: 16px; height: 16px; max-width: 16px; max-height: 16px; }
  .nav-label { max-width: none; }
  .nav-utility { display: flex; gap: 5px; margin-top: 0; padding-top: 0; padding-left: 5px; border-top: 0; border-left: 1px solid var(--side-line); }
  .two, .row, .row.three, .filters, .roster-layout, .raid-analysis-layout, .alert-suppression-row, .alert-delivery-row { grid-template-columns: 1fr; }
  .raid-analysis-workflow-panel { grid-column: auto; }
  .raid-analysis-step { grid-template-columns: 34px 1fr; align-items: stretch; }
  .raid-analysis-step-state,
  .raid-analysis-step > .actions { grid-column: 2; justify-self: stretch; }
  .raid-analysis-table { min-width: 720px; }
  .raid-analysis-share-row { grid-template-columns: 1fr; align-items: stretch; }
  .raid-night-workspace { grid-template-columns: 1fr; grid-template-areas: "checklist" "roster" "detail" "loot" "jobs" "alerts"; }
  .raid-night-roster { position: static; max-height: none; }
  .raid-night-detail { max-height: none; }
  .raid-night-roster-row { grid-template-columns: 1fr; }
  .raid-night-detail-summary, .raid-night-slot-list { grid-template-columns: 1fr; }
  .upgrade-presets { grid-template-columns: 1fr; }
  .upgrade-control-groups { grid-template-columns: 1fr; }
  .upgrade-control-group[aria-labelledby="upgradeSourcePoolHeading"] { grid-row: auto; }
  .upgrade-filter-selects { grid-template-columns: 1fr; }
  .upgrade-shopping-item { grid-template-columns: 1fr; }
  .upgrade-shopping-item-side { justify-items: start; }
  .source-curator-proposal-summary, .source-curator-slot-order, .source-curator-operation-row { grid-template-columns: 1fr; }
  .source-curator-order-list li { grid-template-columns: 38px minmax(0, 1fr); }
  .source-curator-order-list em { grid-column: 2; white-space: normal; }
  .user-management-form, .user-management-row, .job-template-form, .job-template-row { grid-template-columns: 1fr; }
  .upgrade-stepper { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bulkbar { align-items: stretch; }
  .bulkbar > .actions { width: 100%; }
  .bulkbar select, .bulkbar button { width: 100%; }
  .roster-viewbar { align-items: stretch; }
  .roster-viewbar select, .roster-viewbar button, .roster-viewbar details { width: 100%; }
  .job-drawer { left: 12px; right: 12px; bottom: 86px; width: auto; max-height: min(420px, calc(100vh - 116px)); }
  .density-toggle { width: 100%; }
  .density-toggle button { flex: 1 1 0; width: auto; }
  .roster-filter-chips { top: 0; margin-left: -2px; margin-right: -2px; padding: 8px 2px; }
  .filter-chip { flex: 1 1 130px; justify-content: space-between; }
  .column-chooser { max-width: none; }
  .pager { justify-content: flex-start; }
  .pager button { flex: 1 1 68px; }
  .detail-panel { position: static; max-height: none; }
  .roster-table-wrap { max-height: min(400px, 44vh); overflow: auto; padding-bottom: 4px; }
  .roster-table-wrap table { min-width: 0; border: 0; background: transparent; }
  .roster-table-wrap thead { display: none; }
  .roster-table-wrap tbody { display: grid; gap: 8px; }
  .roster-table-wrap tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; border: 1px solid var(--line); border-radius: 8px; padding: 10px; background: var(--panel); }
  .roster-table-wrap tr.selected-row { border-color: var(--blue); box-shadow: inset 4px 0 0 var(--blue); }
  .roster-table-wrap td { display: grid; grid-template-columns: 86px minmax(0, 1fr); gap: 8px; align-items: start; border: 0; padding: 2px 0; background: transparent !important; box-shadow: none !important; }
  .roster-table-wrap td::before { color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: 0; text-transform: uppercase; }
  .roster-table-wrap td:nth-child(1) { grid-column: 2; grid-row: 1; display: block; justify-self: end; }
  .roster-table-wrap td:nth-child(1)::before, .roster-table-wrap td:nth-child(2)::before, .roster-table-wrap td:nth-child(12)::before { display: none; }
  .roster-table-wrap td:nth-child(2) { grid-column: 1; grid-row: 1; display: block; }
  .mobile-roster-metrics { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 7px; }
  .mobile-roster-metrics span { border: 1px solid var(--chip-border); border-radius: 999px; padding: 2px 6px; background: var(--chip-bg); color: var(--chip-text); font-size: 11px; }
  .mobile-roster-details { display: block; margin-top: 8px; }
  .mobile-roster-details summary { cursor: pointer; color: var(--muted); font-size: 12px; font-weight: 700; }
  .mobile-roster-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-top: 6px; }
  .mobile-roster-detail { border: 1px solid var(--chip-border); border-radius: 6px; padding: 6px; background: var(--panel-soft); overflow-wrap: anywhere; min-width: 0; }
  .mobile-roster-detail strong { display: block; color: var(--muted); font-size: 10px; text-transform: uppercase; margin-bottom: 2px; }
  .roster-table-wrap td:nth-child(3)::before { content: "Class"; }
  .roster-table-wrap td:nth-child(4)::before { content: "Spec"; }
  .roster-table-wrap td:nth-child(5)::before { content: "Gear"; }
  .roster-table-wrap td:nth-child(6)::before { content: "Refresh"; }
  .roster-table-wrap td:nth-child(7)::before { content: "iLvl"; }
  .roster-table-wrap td:nth-child(8)::before { content: "GS"; }
  .roster-table-wrap td:nth-child(9)::before { content: "BiS"; }
  .roster-table-wrap td:nth-child(10)::before { content: "Score"; }
  .roster-table-wrap td:nth-child(11)::before { content: "Sim"; }
  .roster-table-wrap td:nth-child(n+3) { grid-column: 1 / -1; }
  .roster-table-wrap td:nth-child(7), .roster-table-wrap td:nth-child(8), .roster-table-wrap td:nth-child(10) { display: none; }
  .roster-table-wrap td:nth-child(12) { position: static; grid-column: 1 / -1; min-width: 0; margin-top: 4px; }
  .roster-table-wrap td:nth-child(12) .actions { justify-content: flex-start; }
  .roster-table-wrap td:nth-child(12) button { min-height: 40px; flex: 1 1 120px; }
  .roster-table-wrap td:nth-child(12) .icon-btn { width: auto; }
  .wishlist-row, .wishlist-add-row { grid-template-columns: 1fr; }
  .source-cell { min-width: 0; }
  .source-ref { max-width: none; }
  th, td { white-space: normal; }
}
@media (max-width: 360px) {
  .roster-table-wrap { display: none; }
  .mobile-roster-cards { display: grid; }
}
@media (min-width: 901px) and (max-width: 1180px) {
  .roster-layout { grid-template-columns: 1fr; }
  .detail-panel { position: static; max-height: none; }
}