:root {
  --blue: #202326;
  --blue-2: #34383b;
  --line: #e4e6e8;
  --muted: #666e75;
}

body { background: #fff; color: #202326; }
button { border-color: #d6d9dc; color: #202326; }
button:hover { border-color: #8d949a; background: #f5f6f7; }
.primary:hover { background: #414548; border-color: #414548; }
.outline { border-color: #aeb4b9; }
.sidebar { background: #fff; color: #202326; border-right: 1px solid var(--line); }
.brandmark b { color: #202326; letter-spacing: 0; }
.brandmark span, .side-footer, .side-footer button { color: #6b737a; letter-spacing: 0; }
.nav-item { color: #626b72; }
.nav-item:hover { color: #202326; background: #f2f3f4; }
.nav-item.active { color: #202326; background: #ebedee; box-shadow: none; font-weight: 600; }
.online-dot { background: #607a65; }
.filter-panel { box-shadow: none; border-radius: 6px; }
.type-check:has(input:checked) { border-color: #9ca3a8; background: #f3f4f5; color: #202326 !important; }
.type-check input, .select-box input, .export-options input { accent-color: #202326; }
.notice { background: #f5f6f7; color: #616970; }
.material-card { border-color: var(--line); border-radius: 6px; box-shadow: none; align-self: start; }
.material-grid { align-items: start; }

.taxonomy-filter-panel { border-top: 1px solid var(--line); padding-top: 13px; }
.taxonomy-filter-head, .taxonomy-row { display: flex; align-items: flex-start; gap: 16px; }
.taxonomy-filter-head { align-items: center; padding-bottom: 7px; }
.taxonomy-filter-head strong { width: 62px; flex: none; font-size: 12px; }
.taxonomy-row { border-top: 1px solid #f0f1f2; padding: 9px 0; }
.taxonomy-group-name { width: 100px; flex: none; color: #4d555b; font-size: 12px; line-height: 28px; overflow-wrap: anywhere; }
.taxonomy-choices { display: flex; gap: 7px; flex-wrap: wrap; min-width: 0; }
.taxonomy-choice { position: relative; display: inline-flex; align-items: center; min-height: 28px; margin: 0; padding: 4px 10px; border: 1px solid #d9dddf; border-radius: 4px; color: #4d555b; background: #fff; font-size: 12px; cursor: pointer; }
.taxonomy-choice:hover { border-color: #8c949a; }
.taxonomy-choice.selected { color: #fff; background: #202326; border-color: #202326; }
.taxonomy-choice.historical { background: #687077; border-color: #687077; }
.taxonomy-choice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.taxonomy-choice:focus-within { outline: 2px solid #5a7c9c; outline-offset: 2px; }
.taxonomy-empty, .taxonomy-empty-group { margin: 0; color: #747c82; font-size: 12px; line-height: 28px; }
.taxonomy-empty { padding-left: 78px; }

.card-media { height: auto; min-height: 0; overflow: visible; }
.card-media .media-preview { display: block; height: auto; min-height: 0; overflow: hidden; }
.card-media .media-preview img { display: block; width: 100%; height: auto; object-fit: contain; }
.card-media:has(video) { aspect-ratio: 9 / 16; }
.card-media:has(video) .media-preview { width: 100%; height: 100%; }
.card-media video { width: 100%; height: 100%; object-fit: contain; }
.card-media:has(.media-placeholder) { min-height: 205px; }
.card-media .media-placeholder { min-height: 205px; }
.detail-preview { min-height: 0; max-height: none; }
.detail-preview img { display: block; width: 100%; height: auto; max-height: 70vh; object-fit: contain; }
.detail-preview video { max-height: 70vh; object-fit: contain; }
.compare-preview { width: 210px; height: auto; min-height: 0; }
.compare-table td:has(.compare-preview) { min-width: 230px; }
.compare-table td .compare-preview img { display: block; width: 100%; height: auto; object-fit: contain; }
.compare-table td .compare-preview video { width: 100%; height: auto; max-height: 360px; object-fit: contain; }
dialog:has(.compare-table) { width: min(1220px, 94vw); }
