.work-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.work-tags[hidden] { display: none; }
.work-tag { display: inline-flex; align-items: center; min-height: 25px; padding: 3px 11px; border: 1px solid #cfe5f3; border-radius: 99px; background: #f1f8fd; color: #5184a4; font-size: 11px; line-height: 1.5; font-weight: 400; white-space: nowrap; }
.tag-picker { position: relative; min-width: 0; color: #435c6e; font-size: 13px; text-align: left; }
.tag-picker-trigger { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 43px; padding: 11px 14px; border: 1px solid #d6e5ef; border-radius: 7px; background: #f8fbfd; color: #8096a6; }
.tag-picker-trigger::-webkit-details-marker { display: none; }
.tag-picker-value { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.tag-picker-trigger.has-tags { color: #407ea5; background: #eff7fc; }
.tag-picker-trigger:focus-visible { outline: 2px solid #78b5d9; outline-offset: 3px; }
.tag-chevron { flex: 0 0 auto; font-size: 19px; line-height: 15px; transition: transform .18s; }
.tag-picker[open] .tag-chevron { transform: rotate(180deg); }
.tag-picker-panel { margin-top: 8px; background: #fff; border: 1px solid #d7e7f1; border-radius: 10px; padding: 16px; box-shadow: 0 12px 38px #45789812; }
.tag-picker-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 11px; border-bottom: 1px solid #eef3f7; }
.tag-picker-count { color: #7c93a3; font-size: 11px; }
.tag-picker button { font: inherit; cursor: pointer; }
.tag-clear { padding: 5px 0; border: 0; background: none; color: #5389ac; font-size: 11px !important; }
.tag-picker-groups { max-height: 310px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #d1e3ee transparent; padding-right: 5px; }
.tag-picker .tag-group { padding: 0; border: 0; margin: 15px 0 0; min-width: 0; }
.tag-group legend { margin: 0 0 9px; padding: 0; font-size: 11px; font-weight: 500; letter-spacing: .08em; color: #8196a5; }
.tag-options { display: flex; flex-wrap: wrap; gap: 7px; }
.tag-picker .tag-option { position: relative; margin: 0; font-size: 12px; font-weight: 400; cursor: pointer; }
.tag-option input[type="checkbox"] { position: absolute; opacity: 0; width: 1px; height: 1px; padding: 0; margin: 0; }
.tag-option span { display: block; padding: 7px 12px; border: 1px solid #e3edf3; border-radius: 99px; background: #fbfdfe; color: #6b8394; line-height: 1.4; transition: background .15s, border-color .15s; }
.tag-option input:checked + span { background: #e5f3fc; border-color: #a8cfe7; color: #317aab; }
.tag-option input:checked + span::before { content: '✓'; margin-right: 4px; }
.tag-option input:focus-visible + span { outline: 2px solid #6eadd5; outline-offset: 2px; }
.tag-option input:disabled + span { opacity: .45; cursor: not-allowed; }
.tag-picker-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #eef3f7; margin-top: 16px; padding-top: 12px; }
.tag-picker-help { margin: 0; color: #8a9daa; font-size: 11px; line-height: 1.7; }
.tag-apply { flex: 0 0 auto; border: 1px solid #afd1e8; border-radius: 5px; padding: 9px 13px; background: #e9f4fc; color: #377ea9; font-size: 12px !important; }
.tag-field { margin: 18px 0; }
.tag-field-label { display: block; margin: 0 0 9px; color: #62798a; font-size: 12px; }
.tag-field-label small { color: #9aaab6; font-size: 11px; margin-left: 6px; }
.gallery-tag-search { width: min(360px, 100%); }
.gallery-tag-search .tag-picker-panel { position: absolute; z-index: 5; right: 0; width: 430px; max-width: calc(100vw - 40px); }
.gallery-filter-note { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: -12px 0 24px; color: #99aab6; font-size: 11px; line-height: 1.8; }
.gallery-filter-note button { border: 0; background: none; color: #4f8cb6; padding: 4px 0; font-size: 11px; cursor: pointer; }
.lightbox-caption .work-tags { margin: 10px 0 0; }
.lightbox-caption .work-tag { color: #b5d9ed; background: #263b49; border-color: #405c6d; font-size: 11px; }
@media (max-width: 640px) {
  .gallery-tag-search { flex: 1; width: auto; min-width: 0; }
  .gallery-tag-search .tag-picker-panel { position: absolute; left: 0; right: auto; width: calc(100vw - 40px); }
  .tag-picker-panel { padding: 12px; }
  .tag-picker-groups { max-height: 265px; }
  .tag-option span { padding: 8px 11px; }
  .tag-picker-trigger { font-size: 12px; }
  .gallery-filter-note { margin-top: -10px; }
}
@media (prefers-reduced-motion: reduce) { .tag-chevron, .tag-option span { transition: none; } }