/* === MEDIA PAGE FOUNDATION === */
.media-body {
  display: block;
  min-width: 320px;
  color: #7b2737;
  background: #fff;
  font: 13px/1.45 Georgia, "Times New Roman", serif;
}

.media-body p { font-family: Georgia, "Times New Roman", serif; }
.media-body a { color: #8c1a25; text-decoration: underline; }
.media-body a:hover,
.media-body a:focus-visible { color: #d21d3b; }

.media-shell {
  width: min(calc(100% - 32px), 760px);
  margin: 0 auto;
  padding: 28px 16px 34px;
}

/* === VELVETLORI MEDIA HEADER === */
.media-masthead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 8px;
}

.media-shell:not(.media-admin-shell) .media-masthead {
  width: calc(100% - 28px);
  margin-left: 28px;
}

.media-title {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #b92f51 !important;
  text-decoration: none !important;
}

.media-masthead > img {
  display: block;
  width: 60px;
  height: 72px;
  object-fit: contain;
  transform: translateY(-5px) rotate(5deg);
}

.media-title-rule {
  flex: 1;
  min-width: 32px;
  height: 9px;
  background: linear-gradient(to bottom, #b92f51 0 3px, transparent 3px 6px, #b92f51 6px 9px);
}

.media-masthead > strong {
  color: #b92f51;
  font: italic 700 32px/1 Georgia, "Times New Roman", serif;
  text-shadow: 0 1px 1px rgba(135, 23, 29, .14);
}

.media-utility { display: flex; gap: 12px; padding-bottom: 2px; }
.media-utility a { font-style: italic; font-weight: 700; text-decoration: none; }
.media-utility a:hover,
.media-utility a:focus-visible { text-decoration: underline; text-underline-offset: 3px; }

/* === MEDIA LANDING DIRECTORY === */
.media-directory {
  width: calc(100% - 28px);
  margin: 2px 0 16px 28px;
  border: 4px double #87171d;
  background: #fff;
}

.media-directory table {
  display: block;
  width: 100%;
  border-collapse: collapse;
}

.media-directory tbody { display: block; }
.media-directory tr {
  display: grid;
  grid-template-columns: 158px minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  margin: 0 18px;
  padding: 18px 0;
  border-bottom: 2px dotted #ef9cab;
}
.media-directory tr:last-child { border-bottom: 0; }
.media-directory td { display: block; padding: 0; vertical-align: middle; }

.directory-preview { width: 158px; }
.directory-thumbnail {
  display: block;
  width: 150px;
  height: 150px;
  border: 1px solid #ef9cab;
  background: #fff7f8;
}
.directory-preview img { display: block; width: 100%; height: 100%; object-fit: cover; }

.directory-copy { position: relative; height: 150px; align-self: start; padding-top: 3px; padding-bottom: 28px; }
.directory-copy h2 { margin: 0 0 7px; font: italic 700 20px/1.1 Georgia, "Times New Roman", serif; }
.media-body .directory-copy h2 a,
.media-body .directory-copy h2 a:hover,
.media-body .directory-copy h2 a:focus-visible { color: #87171d; text-decoration: none; }
.directory-copy p { margin: 0 0 4px; color: #984657; font-size: 13px; line-height: 1.4; }
.directory-enter,
.directory-status { position: absolute; bottom: 0; left: 0; font-style: italic; font-weight: 700; }
.directory-enter { bottom: -4px; }
.directory-enter-button {
  width: 110px;
  min-height: 44px;
  margin-left: 0;
  padding: 8px 10px;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
}

.media-body .directory-enter-button,
.media-body .directory-enter-button:link,
.media-body .directory-enter-button:visited,
.media-body .directory-enter-button:hover,
.media-body .directory-enter-button:focus-visible {
  color: #fff;
  text-decoration: none;
}
.directory-status {
  padding: 3px 8px;
  border: 1px solid #c8c8c8;
  color: #8a8a8a;
  background: #ededed;
  text-shadow: 0 1px 0 #fff;
  cursor: not-allowed;
}

.media-return-home {
  display: flex;
  justify-content: center;
  margin: 18px 0 0 28px;
}

.media-return-home-button {
  width: 150px;
  margin-left: 0;
}

.media-body .media-return-home-button,
.media-body .media-return-home-button:link,
.media-body .media-return-home-button:visited,
.media-body .media-return-home-button:hover,
.media-body .media-return-home-button:focus-visible {
  color: #fff;
  text-decoration: none;
}

.media-return-home + .site-footer {
  margin-top: 10px;
}

.media-body .site-footer a,
.media-body .site-footer a:link,
.media-body .site-footer a:visited,
.media-body .site-footer a:hover,
.media-body .site-footer a:focus-visible {
  text-decoration: none;
}

/* === ADMIN AND LOGIN === */
.media-admin-shell { width: min(calc(100% - 32px), 640px); }
.media-admin-header {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 10px;
  margin-bottom: 4px;
  padding-left: 8px;
}
.media-admin-header img {
  display: block;
  width: 60px;
  height: 72px;
  object-fit: contain;
  transform: translateY(-8px) rotate(5deg);
}
.media-admin-header-rule {
  flex: 1;
  height: 9px;
  background: linear-gradient(to bottom, #b92f51 0 3px, transparent 3px 6px, #b92f51 6px 9px);
}
.media-admin-header h1 {
  margin: 0;
  color: #b92f51;
  font: italic 700 32px/1 Georgia, "Times New Roman", serif;
  text-shadow: 0 1px 1px rgba(135, 23, 29, .14);
}
.admin-card { padding: 18px; border: 4px double #b92f51; background: #fff; }
.media-form-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 10px;
  padding: 7px 10px;
  color: #b92f51;
  background: #f7e1e3;
}
.media-form-heading h1 {
  margin: 0;
  color: #b92f51;
  font: 400 16px/1.2 "Times New Roman", Times, serif;
}
.media-form-heading-links { display: flex; align-items: center; justify-content: flex-end; }
.media-form-heading-links .footer-diamond { font-size: .42em; }
.media-form-heading a { color: #87171d; font-size: 11px; text-decoration: none; }
.media-form-heading a:hover,
.media-form-heading a:focus-visible { text-decoration: underline; text-underline-offset: 2px; }
.media-form { display: grid; gap: 14px; }
.media-form label { display: grid; gap: 6px; color: #7b2737; font-weight: 400; }
.media-form input,
.media-form select,
.media-form textarea { width: 100%; padding: 8px 9px; border: 1px solid #efc4cb; border-radius: 0; color: #52151e; background: #fff; font: 13px/1.4 "Times New Roman", Times, serif; }
.media-form input:focus,
.media-form select:focus,
.media-form textarea:focus { outline: 2px solid #efb7c1; outline-offset: 1px; }
.media-form textarea { min-height: 90px; resize: vertical; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

/* === JOURNAL TAG PICKER === */
.tag-picker {
  margin-top: 6px;
}
.tag-picker-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  gap: 10px;
}
.tag-picker-row .tag-picker-input { min-width: 0; }
.tag-picker-row [data-tag-add] {
  min-width: 52px;
  padding: 7px 12px;
  border: 1px solid #87171d;
  color: #fff;
  background: #87171d;
  font: 13px/1.2 "Times New Roman", Times, serif;
  cursor: pointer;
}
.tag-picker-row [data-tag-add]:hover,
.tag-picker-row [data-tag-add]:focus-visible { background: #b92f51; }
.tag-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}
.tag-chip-list:empty { display: none; }
.tag-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 8px;
  border: 1px solid #dca3ae;
  color: #7b2737;
  background: #f7e1e3;
  line-height: 1.2;
}
.tag-chip-remove {
  padding: 0;
  border: 0;
  color: #87171d;
  background: transparent;
  font: 700 15px/1 "Times New Roman", Times, serif;
  cursor: pointer;
}
.tag-suggestion-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  margin-top: 11px;
}
.tag-suggestion-tab {
  padding: 0;
  border: 0;
  color: #8c1a25;
  background: transparent;
  font: 13px/1.3 "Times New Roman", Times, serif;
  cursor: pointer;
}
.tag-suggestion-tab:hover,
.tag-suggestion-tab:focus-visible,
.tag-suggestion-tab.is-active {
  color: #b92f51;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.tag-suggestion-divider { color: #bd7583; }
.tag-suggestions {
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #efc4cb;
  background: #fff;
}
.tag-suggestions[hidden],
.tag-suggestion-group[hidden] { display: none !important; }
.tag-suggestion-group {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.tag-suggestion {
  padding: 4px 9px;
  border: 1px solid #dca3ae;
  color: #7b2737;
  background: #fff;
  font: 12px/1.3 "Times New Roman", Times, serif;
  cursor: pointer;
}
.tag-suggestion:hover,
.tag-suggestion:focus-visible,
.tag-suggestion.is-selected {
  border-color: #b92f51;
  background: #f7e1e3;
}
.tag-suggestion small { color: #9a6b74; }

.journal-editor-card { position: relative; padding: 14px; border: 1px solid #dca3ae; background: #fff; }
.journal-editor-label { display: block; margin-bottom: 12px; color: #7b2737; }
.editor-toolbar { display: grid; gap: 6px; margin-bottom: 12px; padding: 0; background: #fff; }
.editor-toolbar-row { display: flex; flex-wrap: wrap; gap: 6px; }
.editor-toolbar-row[hidden] { display: none; }
.editor-toolbar-extended { padding-top: 6px; border-top: 1px dotted #dca3ae; }
.editor-toolbar button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 28px;
  padding: 0 6px;
  border: 1px solid #dca3ae;
  color: #87171d;
  background: #fffafa;
  font: 700 12px/1 "Times New Roman", Times, serif;
  cursor: pointer;
}
.editor-toolbar button:hover,
.editor-toolbar button:focus-visible { background: #f7e1e3; }
.editor-toolbar .editor-italic { font-style: italic; }
.editor-toolbar .editor-underline { text-decoration: underline; text-underline-offset: 2px; }
.editor-toolbar .editor-strike { text-decoration: line-through; }
.editor-toolbar .editor-link { text-decoration: underline; text-underline-offset: 2px; }
.editor-toolbar .editor-heading { font-size: 15px; }
.editor-toolbar .editor-divider { min-width: 46px; }
.editor-toolbar .editor-align { width: 30px; min-width: 30px; padding: 0 5px; }
.editor-align-icon {
  display: grid;
  align-content: space-between;
  width: 17px;
  height: 14px;
}
.editor-align-icon i { display: block; height: 2px; background: currentColor; }
.editor-align-icon i:nth-child(1),
.editor-align-icon i:nth-child(3) { width: 17px; }
.editor-align-icon i:nth-child(2) { width: 12px; }
.editor-align-center i { margin-right: auto; margin-left: auto; }
.editor-align-right i { margin-left: auto; }
.editor-toolbar .editor-toolbar-toggle { width: 30px; min-width: 30px; padding: 5px; }
.editor-toolbar-toggle > span {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 3px);
  grid-template-rows: repeat(2, 3px);
  justify-content: center;
  align-content: start;
  gap: 1px;
  width: 18px;
  height: 18px;
  padding: 2px;
  border: 1px solid currentColor;
}
.editor-toolbar-toggle > span::after {
  position: absolute;
  right: 3px;
  bottom: 3px;
  left: 3px;
  height: 2px;
  background: currentColor;
  content: "";
}
.editor-toolbar-toggle i { display: block; width: 3px; height: 3px; background: currentColor; }
.editor-toolbar-toggle[aria-expanded="true"] { background: #f7e1e3; }
.editor-toolbar .editor-list {
  width: 30px;
  min-width: 30px;
  padding-right: 2px;
  padding-left: 2px;
  font-size: 15px;
}
.editor-list-icon {
  position: relative;
  display: grid;
  grid-template-columns: 7px 1fr;
  column-gap: 1px;
  width: 25px;
  height: 18px;
}
.editor-list-icon-numbered,
.editor-list-icon-bulleted { flex: 0 0 25px; }
.editor-list-markers,
.editor-list-lines,
.editor-list-numbers {
  display: grid;
  grid-template-rows: repeat(3, 1fr);
  align-items: center;
}
.editor-list-markers i,
.editor-list-lines i,
.editor-list-numbers i { display: block; font-style: normal; }
.editor-list-markers i {
  width: 4px;
  height: 4px;
  margin-left: 2px;
  border-radius: 50%;
  background: currentColor;
}
.editor-list-lines i {
  width: 15px;
  height: 2px;
  background: currentColor;
}
.editor-list-remove .editor-list-lines i { width: 14px; }
.editor-list-numbers i {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 7px;
  height: 6px;
  font: 7px/1 Arial, sans-serif;
  text-align: right;
}
.editor-list-cross {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
  font: 700 20px/18px Arial, sans-serif;
  text-align: center;
  transform: translateX(1px);
  text-shadow:
    -1px -1px 0 #fffafa,
     0 -1px 0 #fffafa,
     1px -1px 0 #fffafa,
    -1px  0   0 #fffafa,
     1px  0   0 #fffafa,
    -1px  1px 0 #fffafa,
     0  1px 0 #fffafa,
     1px  1px 0 #fffafa;
}
.editor-toolbar .editor-citation { align-items: flex-start; padding-top: 5px; }
.editor-surface { min-height: 330px; padding: 14px; border: 1px solid #dca3ae; background: #fff; color: #52151e; font: 14px/1.65 "Times New Roman", Times, serif; outline: none; }
.editor-surface:focus { outline: 2px solid #efb7c1; outline-offset: 1px; }
.editor-surface:empty::before { content: attr(data-placeholder); color: #9a6b74; pointer-events: none; }
.editor-surface h3 { margin: 8px 0 6px; font-size: 26px; line-height: 1.1; }
.editor-surface p { margin: 0 0 8px; }
.editor-surface ul,
.editor-surface ol { margin: 0 0 12px 24px; padding: 0; }
.editor-surface hr { margin: 18px 0; border: 0; border-top: 1px solid #dca3ae; }
.editor-surface sup { font-size: .72em; vertical-align: super; line-height: 0; }
.editor-surface img { display: block; max-width: 100%; height: auto; margin: 14px auto 20px; cursor: grab; }
.editor-surface img:active { cursor: grabbing; }
.editor-surface img.editor-image-align-left { float: left; margin: 6px 14px 10px 0; }
.editor-surface img.editor-image-align-center { float: none; margin-right: auto; margin-left: auto; }
.editor-surface img.editor-image-align-right { float: right; margin: 6px 0 10px 14px; }
.editor-surface img.editor-image-align-none { float: none; margin-right: 0; margin-left: 0; }
.editor-surface::after { display: block; clear: both; content: ""; }
.editor-image-selection {
  position: absolute;
  z-index: 40;
  border: 1px solid #87171d;
  pointer-events: none;
}
.editor-image-selection[hidden] { display: none; }
.editor-image-handle {
  position: absolute;
  width: 9px;
  min-width: 0;
  height: 9px;
  padding: 0;
  border: 1px solid #777;
  border-radius: 0;
  background: #fff;
  pointer-events: auto;
}
.editor-image-handle.handle-nw { top: -5px; left: -5px; cursor: nwse-resize; }
.editor-image-handle.handle-ne { top: -5px; right: -5px; cursor: nesw-resize; }
.editor-image-handle.handle-sw { bottom: -5px; left: -5px; cursor: nesw-resize; }
.editor-image-handle.handle-se { right: -5px; bottom: -5px; cursor: nwse-resize; }
.editor-image-toolbar {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  display: flex;
  gap: 2px;
  padding: 4px;
  border: 1px solid #aeb4b8;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .16);
  pointer-events: auto;
}
.editor-image-toolbar button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  min-width: 30px;
  height: 28px;
  padding: 0 5px;
  border: 1px solid transparent;
  color: #87171d;
  background: #fff;
  cursor: pointer;
}
.editor-image-toolbar button:hover,
.editor-image-toolbar button:focus-visible,
.editor-image-toolbar button.is-active { border-color: #87171d; background: #f7e1e3; }
.editor-image-toolbar .editor-image-description svg { width: 16px; height: 16px; fill: currentColor; }
.editor-image-toolbar .editor-image-remove { font: 700 20px/1 Arial, sans-serif; }
.editor-image-no-align {
  display: grid;
  align-content: space-between;
  width: 17px;
  height: 14px;
}
.editor-image-no-align i { display: block; width: 17px; height: 2px; background: currentColor; }
.editor-image-no-align i:nth-child(2) { width: 11px; }
.journal-image-picker { color: #7b2737; }
.journal-image-picker > strong { display: block; margin-bottom: 7px; }
.journal-thumbnail-picker > strong small { color: #9a6b74; font-weight: 400; }
.journal-thumbnail-preview {
  position: relative;
  width: 180px;
  height: 120px;
  margin-bottom: 10px;
  border: 1px solid #dca3ae;
  background: #fff;
}
.journal-thumbnail-preview[hidden] { display: none; }
.journal-thumbnail-preview img { display: block; width: 100%; height: 100%; object-fit: cover; }
.journal-thumbnail-preview button {
  position: absolute;
  top: 5px;
  right: 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  padding: 0;
  border: 1px solid #dca3ae;
  color: #87171d;
  background: #fffafa;
  font: 700 20px/1 Arial, sans-serif;
  cursor: pointer;
}
.journal-thumbnail-preview button:hover,
.journal-thumbnail-preview button:focus-visible { background: #f7e1e3; }
.journal-image-picker-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.journal-image-picker-row button {
  padding: 7px 11px;
  border: 1px solid #dca3ae;
  color: #87171d;
  background: #fffafa;
  font: 700 13px/1.2 "Times New Roman", Times, serif;
  cursor: pointer;
}
.journal-image-picker-row button:hover,
.journal-image-picker-row button:focus-visible { background: #f7e1e3; }
.journal-image-picker-row span { color: #9a6b74; font-size: 12px; }
.journal-upload-status { min-height: 1.2em; margin: 6px 0 0; color: #7b2737; font-size: 12px; }
.journal-entry-images {
  padding-bottom: 8px;
  border-bottom: 1px dotted #dca3ae;
}
.journal-entry-images .journal-upload-status:empty { display: none; }
.journal-entry-details { color: #7b2737; }
.journal-entry-details > strong { display: block; margin-bottom: 10px; }
.journal-entry-details > strong small { color: #9a6b74; font-weight: 400; }
.journal-entry-detail-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.journal-listening-help { color: #9a6b74; font-size: 11px; font-weight: 400; }
.journal-current-mood-field {
  display: grid;
  align-self: start;
  align-content: start;
  gap: 6px;
}
.journal-current-mood-label { color: #7b2737; }
.journal-mood-dropdown { position: relative; min-width: 0; }
.media-form .journal-mood-native {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  pointer-events: none;
}
.journal-mood-toggle {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  width: 100%;
  min-height: 36px;
  padding: 6px 9px;
  border: 1px solid #efc4cb;
  color: #52151e;
  background: #fff;
  font: 13px/1.4 "Times New Roman", Times, serif;
  text-align: left;
  cursor: pointer;
}
.journal-mood-toggle:hover,
.journal-mood-toggle:focus-visible { background: #fffafa; }
.journal-mood-toggle:focus-visible { outline: 2px solid #efb7c1; outline-offset: 1px; }
.journal-mood-toggle img {
  display: block;
  width: auto;
  max-width: 24px;
  height: auto;
  max-height: 24px;
  margin: auto;
}
.journal-mood-toggle img[hidden] { visibility: hidden; }
.journal-mood-chevron {
  width: 0;
  height: 0;
  justify-self: end;
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
  border-top: 6px solid #87171d;
  transition: transform .12s ease;
}
.journal-mood-toggle[aria-expanded="true"] .journal-mood-chevron { transform: rotate(180deg); }
.journal-mood-menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + 3px);
  right: 0;
  left: 0;
  max-height: 210px;
  padding: 4px;
  overflow-y: auto;
  border: 1px solid #dca3ae;
  background: #fff;
  box-shadow: 0 4px 9px rgba(82, 21, 30, .18);
}
.journal-mood-menu[hidden] { display: none; }
.journal-mood-menu button {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  width: 100%;
  min-height: 30px;
  padding: 4px 7px;
  border: 0;
  color: #52151e;
  background: #fff;
  font: 12px/1.25 "Times New Roman", Times, serif;
  text-align: left;
  cursor: pointer;
}
.journal-mood-menu button[data-value=""] { grid-template-columns: 1fr; }
.journal-mood-menu button:hover,
.journal-mood-menu button:focus-visible,
.journal-mood-menu button[aria-selected="true"] { background: #f7e1e3; }
.journal-mood-menu button:focus-visible { outline: 1px solid #87171d; outline-offset: -1px; }
.journal-mood-menu button img {
  display: block;
  width: auto;
  max-width: 24px;
  height: auto;
  max-height: 24px;
  margin: auto;
}
.primary-action:disabled { cursor: wait; opacity: .55; }
.form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 16px; margin-top: 6px; }
.primary-action { padding: 8px 18px; border: 0; color: #fff; background: #87171d; font: italic 13px Georgia, serif; cursor: pointer; }
.primary-action:hover { background: #b92f51; }
.danger-action { padding: 0; border: 0; color: #b02434; background: none; font: inherit; text-decoration: underline; cursor: pointer; }
.manage-actions .danger-action { border: 0; color: #b02434; background: none; }
.form-error { padding: 10px 12px; color: #8a0c18; background: #fde6e9; }
.form-notice { padding: 10px 12px; color: #426642; background: #eef7ee; }
.form-notice a { margin-left: 8px; color: #87171d; }
.manage-list { display: grid; gap: 10px; margin-top: 42px; }
.media-manage-list { margin-top: 0; }
.manage-list > h1 { margin: 0 0 4px; padding: 7px 10px; color: #b92f51; background: #f7e1e3; font: 400 16px/1.2 "Times New Roman", Times, serif; }
.manage-row { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 16px; padding: 9px; border: 1px solid #efd0d6; background: #fff; }
.manage-row h2 { margin: 0 0 2px; color: #87171d; font-size: 16px; font-weight: 400; }
.manage-row p { margin: 0; color: #666; font-size: 11px; }
.manage-actions { display: flex; gap: 12px; align-items: center; }
.login-card { max-width: 390px; margin: 70px auto; }

@media (max-width: 520px) {
  .media-shell { width: min(calc(100% - 20px), 880px); padding-top: 18px; }
  .media-admin-header { padding-left: 0; }
  .media-admin-header img { width: 48px; height: 58px; }
  .media-admin-header h1 { font-size: 27px; }
  .media-form-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
  .media-masthead { align-items: flex-start; flex-direction: column; gap: 8px; }
  .media-masthead > img { width: 48px; height: 58px; }
  .media-masthead > strong { font-size: 27px; }
  .media-directory tr { grid-template-columns: 104px minmax(0, 1fr); gap: 10px; margin: 0 10px; padding: 12px 0; }
  .directory-preview { width: 104px; }
  .directory-thumbnail { width: 98px; height: 98px; }
  .directory-copy { min-height: 98px; height: auto; display: flex; flex-direction: column; padding-bottom: 0; }
  .directory-enter,
  .directory-status { position: static; margin-top: auto; align-self: flex-start; }
  .directory-copy h2 { font-size: 17px; }
  .directory-copy p { font-size: 12px; }
  .form-grid { grid-template-columns: 1fr; }
  .journal-entry-detail-fields { grid-template-columns: 1fr; }
  .manage-row { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .media-shell:not(.media-admin-shell) .media-masthead,
  .media-directory {
    width: 100%;
    margin-left: 0;
  }

  .media-return-home { margin-left: 0; }
}