.hospital-case-viewer {
  width: min(960px, calc(100% - 24px));
  max-height: calc(100dvh - 24px);
  padding: 0;
  border: 1px solid #D7D8E3;
  border-radius: 10px;
  color: #171A2B;
  background: #FFFFFF;
  overflow: auto;
}
.hospital-case-viewer::backdrop { background: #171A2BCC; }
.hospital-case-viewer[open] { display: flex; flex-direction: column; }
.case-viewer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-bottom: 1px solid #D7D8E3;
  flex: none;
}
.case-viewer-hospital { display: flex; align-items: center; gap: 10px; min-width: 0; }
.case-viewer-hospital h2 { margin: 0; font-size: 18px; overflow-wrap: anywhere; }
.case-viewer-logo { width: 44px; height: 44px; flex: 0 0 44px; object-fit: contain; }
.case-viewer-close { flex: none; padding: 8px 12px; }
.case-viewer-navigation {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 12px 14px;
  flex: none;
}
.hospital-case-viewer .case-viewer-count { margin: 0; padding: 0; font-size: 13px; color: #555A70; text-align: center; }
.case-viewer-navigation button { min-width: 0; min-height: 44px; padding: 8px; overflow-wrap: anywhere; }
.case-viewer-navigation button:disabled { opacity: .5; cursor: default; }
.case-viewer-stage { padding: 0 14px; min-width: 0; min-height: 0; overflow: auto; flex: 1 1 auto; }
.hospital-case-viewer .dialog-case-visual { max-height: none; }
.hospital-case-viewer .dialog-image { display: block; width: 100%; max-height: 65dvh; object-fit: contain; }
.hospital-case-viewer .dialog-story-bundle .dialog-image { max-height: none; height: auto; }
.hospital-case-viewer .dialog-paired-case { max-height: none; }
.hospital-case-viewer .paired-case-image { object-fit: contain; }
.hospital-case-viewer .case-viewer-caption { margin: 0; padding: 12px 14px; color: #555A70; font-size: 13px; overflow-wrap: anywhere; max-height: 100px; overflow: auto; flex: none; }
.case-viewer-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 14px; border-top: 1px solid #D7D8E3; flex: none; }
.case-viewer-actions .button { min-width: 0; min-height: 44px; text-align: center; overflow-wrap: anywhere; }
.profile-case-jump { display: flex; flex-wrap: wrap; gap: 8px; margin-block: 12px; }
.profile-case-jump .button { min-height: 44px; }
@media (max-width: 480px) {
  .case-viewer-header { align-items: flex-start; }
  .case-viewer-hospital h2 { font-size: 16px; }
  .case-viewer-navigation { gap: 6px; }
  .case-viewer-navigation button { font-size: 13px; }
}