/* Contact sheet and its people picker are confined to the studio Review view. */
.cs-review {
  --cs-ink: #18262e;
  --cs-paper: #f6f5f1;
  --cs-line: #b8c0c1;
  --cs-selected: #65dea1;
  --cs-solo: #174768;
  --cs-group: #513264;
  --cs-strong: #137b4d;
  --cs-usable: #9d6607;
  --cs-check: #ac4757;
  color: var(--cs-ink);
  min-width: 0;
}
.cs-review * { min-width: 0; }
.cs-title, .cs-picker-tools, .cs-pages, .cs-contributor-caption, .cs-gallery, .cs-sheet-heading, .cs-pose-line, .cs-file {
  display: flex; align-items: center; gap: 9px;
}
.cs-title, .cs-contributor-caption, .cs-gallery, .cs-sheet-heading, .cs-pose-line { justify-content: space-between; }
.cs-title { margin-bottom: 12px; }
.cs-title h1 { margin: 0; font: 700 clamp(24px,2.8vw,35px)/1 Georgia,serif; letter-spacing: -.04em; }
.cs-picker { border-top: 2px solid var(--cs-ink); padding: 10px 0 12px; }
.cs-picker-tools { flex-wrap: wrap; }
.cs-picker h2 { margin: 0 6px 0 0; font-size: 16px; }
.cs-picker-tools #review-filter { width: auto; max-width: 160px; }
.cs-picker-tools #review-search { border: 0; border-radius: 0; background: transparent; min-height: 34px; padding: 0; }
.cs-search { display: flex; align-items: center; gap: 5px; color: #3e515d; background: white; border: 1px solid var(--cs-line); border-radius: 5px; padding: 0 7px; width: min(100%, 210px); }
.cs-search .icon { width: 14px; height: 14px; }
.cs-search input { width: 100%; height: 34px; padding: 0; border: 0; color: var(--cs-ink); background: transparent; font-size: 12px; }
.cs-review select, .cs-page, .cs-bulk summary { color: var(--cs-ink); background: #fff; border: 1px solid var(--cs-line); border-radius: 4px; padding: 5px 8px; min-height: 34px; font-size: 12px; }
.cs-pages { margin-left: auto; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cs-page { font-size: 16px; min-width: 34px; font-weight: 750; }
.cs-bulk { position: relative; z-index: 2; }
.cs-bulk summary { cursor: pointer; padding-top: 7px; }
.cs-bulk > button { position: absolute; right: 0; top: calc(100% + 3px); width: 175px; background: #fff; border: 1px solid #9da8af; border-radius: 5px; box-shadow: 0 4px 12px #20304028; color: #203544; font-size: 12px; font-weight: 700; }
.cs-people-list { display: flex; gap: 5px; margin-top: 8px; overflow-x: auto; scroll-snap-type: x proximity; }
.cs-people-list .cs-person { flex: 1 0 116px; max-width: 166px; }
.cs-person { display: flex; align-items: center; gap: 6px; min-width: 108px; padding: 4px 6px 4px 4px; background: white; color: #253540; border: 1px solid var(--cs-line); border-radius: 5px; text-align: left; scroll-snap-align: start; }
.cs-person[aria-current] { background: #183a35; color: white; border-color: #183a35; box-shadow: inset 0 -3px #7ee4ab; }
.cs-person img, .cs-person-placeholder { display: grid; place-items: center; width: 29px; height: 38px; object-fit: cover; object-position: 50% 30%; flex-shrink: 0; border-radius: 2px; background: #ccd6d5; }
.cs-person strong, .cs-person small { display: block; font-size: 11px; line-height: 1.25; overflow-wrap: anywhere; }
.cs-person small { font-size: 10px; margin-top: 2px; }
.cs-empty { margin: 7px 0; color: #45565e; font-size: 13px; }
.cs-hero { display: grid; grid-template-columns: clamp(98px,9vw,140px) 1fr auto; align-items: center; gap: 12px 19px; border-radius: 9px; padding: 15px 18px; background: #242931; color: white; box-shadow: 0 4px 12px #1e293522; }
.cs-key { display: grid; place-items: center; height: clamp(116px,10vw,154px); overflow: hidden; background: #354552; border: 1px solid #94a5aa; border-radius: 5px; }
.cs-key img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 28%; }
.cs-key > .icon { width: 34px; height: 34px; color: #b5c2ca; }
.cs-identity p { margin: 0; font-size: 11px; font-weight: 750; color: #aee2d0; letter-spacing: .13em; text-transform: uppercase; }
.cs-identity h2 { margin: 5px 0; color: #fff; font: 700 clamp(22px,2.8vw,43px)/1.08 Georgia,serif; letter-spacing: -.045em; overflow-wrap: anywhere; }
.cs-identity > small { color: #d2ddd9; font-weight: 650; }
.cs-counts { margin: 7px 0; font-size: 13px; line-height: 1.3; }
.cs-review-state { display: flex; gap: 9px; align-items: center; flex-wrap: wrap; font-size: 12px; }
.cs-person-actions { display: flex; align-items: center; gap: 8px; }
.cs-person-actions .button.success { background: #8ce6b2; color: #123723; }
.cs-person-actions .review-more summary { color: #eff4f4; border: 1px solid #a1b0b7; font-weight: 650; }
.cs-contributors { grid-column: 1 / -1; border-top: 1px solid #5c6770; padding-top: 7px; }
.cs-contributor-caption { color: #f1f5f1; font-size: 12px; margin-bottom: 6px; flex-wrap: wrap; }
.cs-contributor-caption span { color: #d8e4e4; font-size: 11px; }
.cs-contribution-row { display: grid; grid-template-columns: 94px 1fr; align-items: center; gap: 6px; padding: 3px 0; }
.cs-contribution-row h3 { margin: 0; font-size: 11px; }
.cs-contribution-row h3 span { display: inline-block; font-size: 10px; padding: 1px 4px; border-radius: 3px; background: #4b5762; }
.cs-thumbs { display: flex; gap: 4px; flex-wrap: wrap; align-items: flex-start; }
.cs-thumb { flex: none; position: relative; width: 43px; height: 51px; border: 2px solid #a3adb4; border-radius: 4px; overflow: hidden; background: #46525b; }
.cs-thumb.picked { border: 3px solid var(--cs-selected); }
.cs-thumb-photo { width: 100%; height: 100%; min-height: 0; display: block; padding: 0; background: #c9d1d3; color: #1c3541; }
.cs-thumb-photo img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center 35%; }
.cs-thumb .cs-mark { position: absolute; top: 0; left: 0; padding: 0 2px; line-height: 1.3; font-size: 10px; background: #1a2733ea; color: white; }
.cs-thumb.picked .cs-mark { color: #a9f6c9; }
.cs-score { position: absolute; z-index: 1; bottom: 0; right: 0; border-radius: 2px 0 0; padding: 1px 4px; min-height: 17px; font: 750 11px/1.1 ui-monospace,Consolas,monospace; background: #122331f5; color: white; text-decoration: underline dotted; text-underline-offset: 2px; }
.cs-score:focus-visible, .cs-thumb-photo:focus-visible, .cs-lead-photo:focus-visible { outline-offset: -3px; }
.cs-file-pending { display: grid; height: 100%; align-content: center; justify-items: center; gap: 4px; font-size: 11px; color: #354b5b; background: #e4e8e8; }
.cs-thumb .cs-file-pending > span:not(.icon) { display: none; }
.cs-gallery { padding: 9px 0; gap: 10px; border-bottom: 1px solid var(--cs-line); }
.cs-gallery strong { font-size: 13px; margin-right: 5px; }
.cs-gallery small { display: block; color: #43535c; margin: 2px 0 0; font-size: 11px; }
.cs-gallery .actions { flex: 0 0 auto; gap: 5px; }
.cs-review .review-settings { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 8px 0; border: 0; border-bottom: 1px solid var(--cs-line); border-radius: 0; margin: 0; background: transparent; }
.cs-review .review-settings-intro { margin: 0 auto 0 0; }
.cs-review .review-settings-intro .settings-symbol { display: none; }
.cs-review .review-settings-intro strong { color: #26343a; }
.cs-review .review-settings-intro span { color: #40535a; }
.cs-review .selection-setting { display: flex; align-items: center; gap: 6px; }
.cs-review .selection-setting > span { margin: 0; }
.cs-review .settings-save { color: #195c40; flex-basis: auto; }
.cs-review .settings-save.error { color: #982c40; }
.cs-sheet-heading { flex-wrap: wrap; margin: 15px 0 9px; }
.cs-sheet-heading h2 { margin: 0; font: 700 clamp(22px,2vw,32px)/1.1 Georgia,serif; letter-spacing: -.04em; }
.cs-quality-legend { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; color: #34424a; font-size: 11px; }
.cs-quality-legend b { padding: 2px 4px; border-radius: 3px; }
.cs-quality-legend .strong { color: #07512d; background: #daf3e3; }
.cs-quality-legend .usable { color: #684209; background: #f9eabb; }
.cs-quality-legend .check { color: #772d3d; background: #f6dbe1; }
.cs-sheet { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%,202px),1fr)); gap: 9px; align-items: start; padding: 8px; background: #273039; border: 1px solid #26303b; border-radius: 8px; }
.cs-pose { background: #fff; border-radius: 5px; overflow: hidden; border: 1px solid #adc1ca; }
.cs-pose.group { border-color: #c0add2; }
.cs-pose > header { background: var(--cs-solo); color: #fff; border-top: 3px solid #69b9ee; padding: 6px 8px; }
.cs-pose.group > header { background: var(--cs-group); border-top-color: #c49ae3; }
.cs-pose-line span { font-size: 10px; letter-spacing: .1em; font-weight: 750; text-transform: uppercase; }
.cs-pose-line small, .cs-group-label { font-size: 10px; color: #f0f3f5; }
.cs-pose h3 { color: white; font-size: 15px; line-height: 1.15; margin: 3px 0 0; }
.cs-group-label { display: block; margin-top: 3px; overflow-wrap: anywhere; }
.cs-leads { display: flex; gap: 1px; background: #d4d9d9; }
.cs-unpicked { padding: 14px 8px; color: #3b4951; font-size: 12px; }
.cs-lead { position: relative; flex: 1 1 0; display: grid; grid-template-rows: auto minmax(24px,auto); background: #fff; }
.cs-lead .cs-score { bottom: auto; top: 5px; right: 4px; min-height: 23px; padding: 3px 5px; border-radius: 3px; }
.cs-lead-photo { position: relative; display: block; width: 100%; padding: 0; height: clamp(146px,14vw,205px); background: #d9e0e3; }
.cs-lead-photo img { display: block; object-fit: contain; width: 100%; height: 100%; }
.cs-leads:has(.cs-lead:nth-child(2)) .cs-lead-photo { height: clamp(120px,11vw,165px); }
.cs-favourite { position: absolute; left: 3px; bottom: 4px; border-radius: 2px; padding: 2px 4px; font-size: 10px; font-weight: 750; background: #162529e8; color: #fff; }
.cs-file { flex-wrap: wrap; gap: 1px 5px; justify-content: space-between; padding: 5px 6px; font-size: 10px; }
.cs-file span { font-weight: 700; overflow-wrap: anywhere; }
.cs-file small { color: #774407; font-size: 10px; }
.cs-pose-tools { padding: 0 6px 5px; }
.cs-compare { display: flex; align-items: center; justify-content: space-between; gap: 5px; width: 100%; min-height: 31px; padding: 4px 7px; border-radius: 4px; border: 1px solid #223c4c; background: #293c49; color: white; font-size: 11px; font-weight: 700; }
.cs-compare span { font-size: 17px; line-height: 1; }
.cs-only { font-size: 11px; color: #53616a; }
.cs-alt { border-top: 1px solid #c5ced1; padding: 5px 6px 6px; }
.cs-alt > strong { display: block; font-size: 11px; margin-bottom: 4px; color: #334652; }
.cs-alt .cs-thumb { width: 42px; height: 50px; }
.cs-alt .q-strong { border: 3px solid var(--cs-strong); }
.cs-alt .q-usable { border: 3px solid var(--cs-usable); }
.cs-alt .q-check { border: 3px solid var(--cs-check); }
.cs-alt .q-unknown { border: 2px dashed #667682; }
@media (max-width: 1200px) {
  .cs-people-list { grid-auto-columns: minmax(116px,1fr); }
}
@media (max-width: 730px) {
  .cs-person-actions { flex-wrap: wrap; }
  .cs-hero { padding: 11px; gap: 9px 12px; grid-template-columns: 90px 1fr; }
  .cs-key { height: 112px; }
  .cs-person-actions { grid-column: 1/-1; }
  .cs-person-actions .button { min-height: 36px; }
  .cs-contribution-row { grid-template-columns: 1fr; gap: 3px; }
  .cs-picker-tools { gap: 5px; }
  .cs-pages { margin-left: 0; }
  .cs-gallery { flex-wrap: wrap; }
  .cs-sheet { grid-template-columns: repeat(auto-fill,minmax(min(100%,172px),1fr)); gap: 6px; padding: 5px; }
  .cs-lead-photo { height: 168px; }
  .cs-leads:has(.cs-lead:nth-child(2)) .cs-lead-photo { height: 128px; }
}
@media (max-width: 440px) {
  .cs-title { margin-bottom: 7px; }
  .cs-key { height: 108px; }
  .cs-hero { grid-template-columns: 80px minmax(0,1fr); }
  .cs-identity h2 { font-size: 23px; }
  .cs-review .review-settings-intro { width: 100%; }
  .cs-sheet { grid-template-columns: repeat(auto-fill,minmax(min(100%,148px),1fr)); }
  .cs-lead-photo { height: 156px; }
  .cs-leads:has(.cs-lead:nth-child(2)) .cs-lead-photo { height: 104px; }
  .cs-compare { font-size: 11px; }
  .cs-search { flex: 1; min-width: 111px; }
  .cs-quality-legend { gap: 3px; }
}
@media (pointer: coarse) {
  .cs-search input, .cs-review select { min-height: 42px; font-size: 16px; }
  .cs-compare, .cs-page { min-height: 44px; }
  .cs-score { min-height: 24px; min-width: 24px; }
  .cs-thumb, .cs-alt .cs-thumb { width: 48px; height: 58px; }
}