:root {
  color-scheme: light;
  --bg: #f7f7f4;
  --surface: #ffffff;
  --text: #202124;
  --muted: #6f746e;
  --line: #dedfd9;
  --primary: #1f6f5b;
  --primary-strong: #155344;
  --accent: #c15f3c;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 64px;
  padding: 0 32px;
  background: rgba(247, 247, 244, 0.92);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
}

.brand {
  font-weight: 800;
  font-size: 20px;
}

.nav {
  display: flex;
  gap: 18px;
  color: var(--muted);
  font-size: 15px;
}

.page {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
  padding: 40px 0 72px;
}

.hero {
  display: grid;
  align-items: end;
  min-height: 360px;
  padding: 56px;
  background: linear-gradient(135deg, #ffffff 0%, #edf3ee 60%, #f4e8dc 100%);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.eyebrow {
  margin: 0 0 10px;
  color: var(--primary);
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

.hero h1 {
  max-width: 760px;
  margin-bottom: 14px;
  font-size: clamp(36px, 6vw, 64px);
  line-height: 1.08;
}

.hero-copy {
  max-width: 620px;
  color: var(--muted);
  font-size: 18px;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  font-weight: 700;
  cursor: pointer;
}

.button.primary {
  border-color: var(--primary);
  background: var(--primary);
  color: #ffffff;
}

.section {
  margin-top: 48px;
}

.section-title {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.section-title h1,
.section-title h2 {
  margin: 0;
}

.section-title a,
.section-title span {
  color: var(--muted);
  font-weight: 700;
}

.item-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 18px;
}

.item-card {
  overflow: hidden;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.item-card img,
.placeholder {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: #e9ebe4;
}

.placeholder {
  display: grid;
  place-items: center;
  color: var(--muted);
  font-weight: 800;
}

.placeholder.large {
  min-height: 420px;
}

.item-card-body {
  padding: 16px;
}

.item-card-body p {
  margin-bottom: 6px;
  color: var(--accent);
  font-size: 13px;
  font-weight: 800;
}

.item-card-body h2,
.item-card-body h3 {
  margin-bottom: 8px;
  font-size: 20px;
  line-height: 1.25;
}

.item-card-body span {
  color: var(--muted);
  font-size: 14px;
}


.view-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 22px;
}

.view-tab {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
}

.view-tab.active {
  border-color: var(--primary);
  background: var(--primary);
  color: #ffffff;
}

.album-view {
  padding: 18px;
  border-radius: 8px;
  background: #1d1f21;
  box-shadow: inset 0 0 0 1px #33383a;
}

.album-page {
  padding: 22px;
  border-radius: 6px;
  background: #2a2d2f;
  box-shadow: inset 0 0 0 1px #43484b;
}

.coin-flip-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 18px;
}

.coin-flip-card {
  display: grid;
  gap: 12px;
  min-height: 230px;
  padding: 16px;
  border: 1px solid #d8d8d2;
  border-radius: 6px;
  background:
    linear-gradient(#ffffff, #ffffff) padding-box,
    linear-gradient(135deg, #e4e4de, #ffffff 45%, #caccc6) border-box;
  color: var(--text);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.28);
}

.coin-flip-window {
  display: grid;
  place-items: center;
  width: min(128px, 72%);
  aspect-ratio: 1;
  margin: 8px auto 0;
  overflow: hidden;
  border: 10px solid #f2f2ee;
  border-radius: 999px;
  background: #d9ddd7;
  box-shadow: inset 0 0 0 1px #c4c8c1, 0 0 0 1px #ecece7;
}

.coin-flip-window img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.coin-flip-placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}

.coin-flip-meta {
  display: grid;
  gap: 3px;
  align-self: end;
  min-width: 0;
  text-align: center;
}

.coin-flip-meta strong {
  overflow: hidden;
  font-size: 14px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.coin-flip-meta span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.slab-view {
  padding: 6px 0;
}

.slab-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 18px;
}

.slab-card {
  display: grid;
  gap: 14px;
  min-height: 390px;
  padding: 14px;
  border: 1px solid #cfd4d5;
  border-radius: 8px;
  background: linear-gradient(145deg, #f8faf9 0%, #e3e8e8 48%, #f5f7f6 100%);
  color: var(--text);
  box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.62), 0 12px 24px rgba(44, 51, 50, 0.12);
}

.slab-label {
  display: grid;
  gap: 5px;
  min-height: 78px;
  padding: 10px 12px;
  border: 1px solid #c9d0d1;
  border-radius: 5px;
  background: linear-gradient(180deg, #ffffff 0%, #eef2f2 100%);
}

.slab-label-title {
  overflow: hidden;
  font-size: 15px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.slab-label-meta {
  color: #5c6668;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.slab-coin-window {
  display: grid;
  place-items: center;
  width: min(190px, 76%);
  aspect-ratio: 1;
  margin: 4px auto;
  overflow: hidden;
  border: 12px solid rgba(255, 255, 255, 0.72);
  border-radius: 999px;
  background: #d5dbdb;
  box-shadow: inset 0 0 12px rgba(43, 52, 53, 0.22), 0 0 0 1px #c4cbcc;
}

.slab-coin-window img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.slab-placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: #667174;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}

.slab-note {
  align-self: end;
  min-height: 48px;
  margin: 0;
  color: #586163;
  font-size: 13px;
  line-height: 1.45;
}



.checklist-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}

.checklist-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.checklist-mode-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 22px;
}

.checklist-mode-tab {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
}

.checklist-mode-tab.active {
  border-color: var(--primary);
  background: var(--primary);
  color: #ffffff;
}

.checklist-series-section {
  margin-top: 28px;
}

.checklist-series-section h2 {
  margin-bottom: 12px;
  font-size: 22px;
}

.checklist-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 12px;
}

.checklist-tile {
  display: grid;
  gap: 7px;
  min-height: 148px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbf8;
}

.checklist-tile.owned {
  border-color: #a9cdbc;
  background: linear-gradient(180deg, #f5fbf8 0%, #e5f2eb 100%);
  box-shadow: inset 0 0 0 3px rgba(31, 111, 91, 0.08);
}

.checklist-tile.missing {
  border-style: dashed;
  background: #f7f7f4;
  color: #6d716d;
}

.checklist-tile-year {
  color: var(--accent);
  font-size: 13px;
  font-weight: 900;
}

.checklist-tile-title {
  font-size: 16px;
  line-height: 1.25;
}

.checklist-tile-meta {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.checklist-tile-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-self: end;
}

.checklist-badge {
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
}

.checklist-badge.owned {
  background: #dcefe6;
  color: var(--primary-strong);
}

.checklist-badge.missing {
  background: #ebe8df;
  color: #756d61;
}

.checklist-badge.linked {
  background: #e8edf4;
  color: #40506a;
}

.checklist-detail-table,
.admin-checklist-table {
  min-width: 980px;
}

.admin-checklist-form {
  display: grid;
  gap: 18px;
}

.admin-checklist-row.owned {
  background: #f2faf6;
}

.admin-checklist-row.missing {
  background: #fffdf8;
}

.admin-checklist-row input[type='number'] {
  min-width: 72px;
}

.admin-checklist-savebar {
  position: sticky;
  bottom: 0;
  display: flex;
  justify-content: flex-end;
  padding: 12px 0 0;
  background: var(--bg);
}

.catalog-set-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}

.catalog-set-card {
  display: grid;
  gap: 10px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.catalog-set-card h2 {
  margin-bottom: 0;
  font-size: 22px;
}

.catalog-set-card p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
}

.catalog-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
}

.catalog-summary strong {
  color: var(--text);
}

.catalog-series-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 22px 0;
}

.catalog-series-tab {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
}

.catalog-series-tab.active {
  border-color: var(--primary);
  background: var(--primary);
  color: #ffffff;
}

.catalog-item-table span {
  color: var(--muted);
  font-size: 13px;
}

.catalog-detail-link {
  color: var(--primary);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.catalog-item-row.owned {
  background: #f2faf6;
}

.catalog-item-row.missing {
  background: #fffdf8;
}

.holding-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}

.holding-badge.owned {
  background: #dcefe6;
  color: var(--primary-strong);
}

.holding-badge.missing {
  background: #eee9df;
  color: #756d61;
}


.admin-catalog-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 18px 0 22px;
}

.admin-catalog-table {
  min-width: 820px;
}

.admin-catalog-form {
  gap: 20px;
}

.admin-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.admin-form-section {
  display: grid;
  gap: 16px;
}

.admin-form-help {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.admin-inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.admin-inline-actions a {
  color: var(--primary);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.admin-holding-form {
  display: grid;
  grid-template-columns: auto 72px minmax(100px, 0.8fr) minmax(160px, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-width: 640px;
}


.catalog-item-detail {
  display: grid;
  gap: 22px;
}

.catalog-item-hero,
.catalog-item-facts,
.catalog-holding-box,
.linked-items-section {
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.catalog-item-hero h1 {
  margin-bottom: 12px;
  font-size: 38px;
  line-height: 1.15;
}

.catalog-item-facts h2,
.catalog-holding-box h2 {
  margin-bottom: 14px;
  font-size: 22px;
}

.catalog-item-fact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 18px;
  margin: 0;
}

.catalog-item-fact-grid div {
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr);
  gap: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.catalog-item-fact-grid dt {
  color: var(--muted);
  font-weight: 800;
}

.catalog-item-fact-grid dd {
  margin: 0;
  white-space: pre-line;
}

.catalog-holding-box p {
  margin-bottom: 8px;
}

.catalog-ratio-note {
  color: var(--muted);
  font-size: 13px;
}

.linked-items-section .section-title {
  margin-bottom: 16px;
}

.linked-item-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
}

.linked-item-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.linked-item-thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: #e9ebe4;
}

.linked-item-meta {
  display: grid;
  gap: 6px;
  padding: 14px;
}

.linked-item-meta strong {
  font-size: 18px;
  line-height: 1.25;
}

.linked-item-meta span,
.linked-item-meta p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.catalog-linked-box {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: center;
  margin: 0 0 22px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.catalog-linked-box span {
  color: var(--muted);
  font-weight: 800;
}

.catalog-linked-box a {
  color: var(--primary);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.empty {
  padding: 48px 24px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  text-align: center;
}

.detail {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
  gap: 36px;
}

.gallery {
  display: grid;
  gap: 12px;
}

.gallery img {
  width: 100%;
  border-radius: 8px;
  border: 1px solid var(--line);
  object-fit: cover;
}

.gallery-item {
  margin: 0;
}

.gallery-item figcaption {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
}

.gallery-item figcaption p {
  flex-basis: 100%;
  margin: 0;
  color: var(--text);
  font-weight: 500;
}

.badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  background: #e5f0eb;
  color: var(--primary-strong);
  font-size: 12px;
  font-weight: 800;
}

.detail-body {
  position: sticky;
  top: 96px;
  align-self: start;
}

.detail-body h1 {
  margin-bottom: 12px;
  font-size: 42px;
  line-height: 1.15;
}

.lead {
  color: var(--muted);
  font-size: 18px;
}

.meta-list {
  display: grid;
  gap: 10px;
  margin: 28px 0;
}

.meta-list div {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.meta-list dt {
  color: var(--muted);
  font-weight: 700;
}

.meta-list dd {
  margin: 0;
}

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
}

.tags span {
  padding: 5px 10px;
  border-radius: 999px;
  background: #e5f0eb;
  color: var(--primary-strong);
  font-weight: 700;
}

.content {
  white-space: pre-line;
}

.stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 24px;
}

.stats div,
.table-wrap,
.item-form {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.stats div {
  padding: 22px;
}

.stats strong {
  display: block;
  font-size: 34px;
}

.stats span {
  color: var(--muted);
  font-weight: 700;
}

.table-wrap {
  overflow-x: auto;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th,
td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  text-align: left;
}

th {
  color: var(--muted);
  font-size: 13px;
  text-transform: uppercase;
}

.form-page {
  max-width: 820px;
  margin-right: auto;
  margin-left: auto;
}

.item-form {
  display: grid;
  gap: 18px;
  padding: 24px;
}

fieldset {
  display: grid;
  gap: 16px;
  min-width: 0;
  margin: 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

legend {
  padding: 0 8px;
  color: var(--text);
  font-weight: 800;
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.money-input {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 112px;
  gap: 8px;
}

label {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-weight: 800;
}

input,
select,
textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 11px 12px;
  background: #ffffff;
  color: var(--text);
  font: inherit;
}

textarea {
  resize: vertical;
}

.checkbox {
  display: flex;
  align-items: center;
  gap: 10px;
}

.checkbox input {
  width: auto;
}

.existing-images {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 10px;
}

.existing-images img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.image-manager {
  grid-template-columns: 1fr;
}

.image-edit-row {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.table-thumb {
  width: 52px;
  height: 52px;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.table-actions a,
.table-actions button {
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--primary);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.detail-subtitle {
  margin-top: 28px;
  font-size: 22px;
}


.detail-view-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 22px;
}

.detail-view-tab {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
}

.detail-view-tab.active {
  border-color: var(--primary);
  background: var(--primary);
  color: #ffffff;
}

.item-slab-detail {
  display: grid;
  place-items: center;
}

.slab-detail-case {
  width: min(860px, 100%);
  padding: 18px;
  border: 1px solid #c9d0d1;
  border-radius: 10px;
  background: linear-gradient(145deg, #f8faf9 0%, #dfe5e5 52%, #f6f8f8 100%);
  box-shadow: inset 0 0 0 5px rgba(255, 255, 255, 0.62), 0 18px 36px rgba(42, 49, 50, 0.14);
}

.slab-detail-label {
  display: grid;
  gap: 6px;
  min-height: 94px;
  padding: 14px 16px;
  border: 1px solid #c3cbcc;
  border-radius: 6px;
  background: linear-gradient(180deg, #ffffff 0%, #eef3f3 100%);
}

.slab-detail-label-title {
  font-size: 22px;
  line-height: 1.2;
}

.slab-detail-label-meta {
  color: #596466;
  font-size: 14px;
  font-weight: 800;
}

.slab-detail-body {
  display: grid;
  gap: 20px;
  padding: 22px 8px 4px;
}

.slab-detail-coin-area {
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 24px;
  align-items: center;
  justify-items: center;
}

.slab-detail-coin {
  display: grid;
  place-items: center;
  width: min(280px, 100%);
  aspect-ratio: 1;
  overflow: hidden;
  border: 16px solid rgba(255, 255, 255, 0.72);
  border-radius: 999px;
  background: #d4dbdb;
  box-shadow: inset 0 0 18px rgba(39, 48, 49, 0.22), 0 0 0 1px #c1c9ca;
}

.slab-detail-coin img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.slab-detail-placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  padding: 16px;
  color: #667174;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
}

.slab-detail-info {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
  margin: 0;
  padding: 14px;
  border: 1px solid #cbd2d3;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.54);
}

.slab-detail-info-row {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  gap: 10px;
  min-width: 0;
}

.slab-detail-info-row dt {
  color: #637073;
  font-weight: 800;
}

.slab-detail-info-row dd {
  margin: 0;
  white-space: pre-line;
}

.item-holder-detail {
  display: grid;
  place-items: center;
  padding: 28px;
  border-radius: 8px;
  background: #202326;
  box-shadow: inset 0 0 0 1px #393f42;
}

.holder-detail-card {
  position: relative;
  display: grid;
  gap: 18px;
  width: min(520px, 100%);
  min-height: 520px;
  padding: 42px 38px 34px;
  border: 1px solid #d9d9d2;
  border-radius: 8px;
  background: linear-gradient(135deg, #ffffff 0%, #f4f4ef 54%, #ffffff 100%);
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.32);
}

.holder-detail-card::before,
.holder-detail-card::after {
  content: '';
  position: absolute;
  top: 18px;
  width: 46px;
  height: 8px;
  border-radius: 999px;
  background: #b9b9b2;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.24);
}

.holder-detail-card::before {
  left: 28px;
  transform: rotate(-8deg);
}

.holder-detail-card::after {
  right: 28px;
  transform: rotate(8deg);
}

.holder-detail-window {
  display: grid;
  place-items: center;
  width: min(310px, 82%);
  aspect-ratio: 1;
  margin: 18px auto 0;
  overflow: hidden;
  border: 18px solid #f0f0eb;
  border-radius: 999px;
  background: #dce0da;
  box-shadow: inset 0 0 0 1px #c5cac2, 0 0 0 1px #ecece7;
}

.holder-detail-window img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.holder-detail-placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
  text-align: center;
}

.holder-detail-meta {
  display: grid;
  gap: 6px;
  padding: 16px 18px;
  border-top: 1px solid #dadbd4;
  border-bottom: 1px solid #dadbd4;
  text-align: center;
}

.holder-detail-meta strong {
  font-size: 24px;
  line-height: 1.2;
}

.holder-detail-meta span {
  color: var(--muted);
  font-size: 15px;
  font-weight: 800;
}

.holder-detail-notes {
  min-height: 72px;
  padding: 12px 14px;
  border-radius: 6px;
  background: #fafaf6;
  color: #3f4643;
  font-size: 15px;
  line-height: 1.55;
  white-space: pre-line;
}

.related-post a {
  color: var(--primary);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 760px) {
  .site-header {
    padding: 0 16px;
  }

  .hero {
    min-height: 300px;
    padding: 32px 22px;
  }

  .section-title,
  .detail,
  .form-grid,
  .stats {
    grid-template-columns: 1fr;
  }

  .album-view,
  .album-page {
    padding: 12px;
  }

  .coin-flip-grid,
  .slab-grid {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  }

  .slab-card {
    min-height: 340px;
  }

  .slab-detail-coin-area,
  .slab-detail-info,
  .catalog-item-fact-grid {
    grid-template-columns: 1fr;
  }

  .item-holder-detail {
    padding: 14px;
  }

  .holder-detail-card {
    min-height: 440px;
    padding: 34px 22px 24px;
  }

  .section-title,
  .checklist-header {
    display: grid;
    align-items: start;
  }

  .checklist-grid {
    grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
  }

  .detail-body {
    position: static;
  }

  .image-edit-row,
  .admin-holding-form,
  .admin-form-grid {
    grid-template-columns: 1fr;
    min-width: 0;
  }
}


.verification-workbench {
  display: grid;
  gap: 18px;
}

.verification-filter-box {
  display: grid;
  grid-template-columns: 150px 220px minmax(220px, 1fr) 170px auto;
  gap: 10px;
  align-items: end;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.verification-filter-box label,
.verification-table label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.verification-filter-box input,
.verification-filter-box select,
.verification-input,
.verification-textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
  color: var(--text);
  font: inherit;
}

.verification-filter-box input,
.verification-filter-box select,
.verification-input {
  min-height: 36px;
  padding: 6px 8px;
}

.verification-textarea {
  min-height: 58px;
  padding: 8px;
  resize: vertical;
}

.verification-quick-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.verification-quick-links a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--primary);
  font-size: 13px;
  font-weight: 800;
}

.verification-table {
  min-width: 1500px;
  font-size: 14px;
}

.verification-table th {
  white-space: nowrap;
}

.verification-table td {
  vertical-align: top;
}

.verification-table td > strong,
.verification-table td > span {
  display: block;
}

.verification-table td > span {
  color: var(--muted);
  font-size: 13px;
}

.verification-row.verified {
  background: #f3faf6;
}

.verification-row.unverified {
  background: #ffffff;
}

.verification-row.pending {
  background: #fffaf0;
}

.verification-row.conflict {
  background: #fff4f1;
}

.verification-row.estimated {
  background: #f5f7fb;
}

.verify-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  width: fit-content;
  margin-bottom: 8px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
}

.verify-badge.verified {
  background: #dcefe6;
  color: var(--primary-strong);
}

.verify-badge.unverified {
  background: #eceee8;
  color: #656a62;
}

.verify-badge.pending {
  background: #f5e7c4;
  color: #7a561c;
}

.verify-badge.conflict {
  background: #f2d2c8;
  color: #8a2f20;
}

.verify-badge.estimated {
  background: #e4eaf3;
  color: #40506a;
}

.verification-savebar {
  position: sticky;
  bottom: 0;
  z-index: 4;
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  align-items: center;
  padding: 12px 0;
  background: var(--bg);
}

.verification-savebar span {
  color: var(--muted);
  font-weight: 800;
}

.verification-missing-warning {
  display: inline-flex;
  margin-top: 8px;
  padding: 3px 7px;
  border-radius: 6px;
  background: #fff0d8;
  color: #8a5a15;
  font-size: 12px;
  font-weight: 900;
}


.catalog-image-gallery {
  display: grid;
  gap: 16px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbf8;
}

.catalog-primary-image {
  width: min(360px, 100%);
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #eef0eb;
}

.catalog-primary-image img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.catalog-image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
}

.catalog-image-card {
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.catalog-image-card img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: #e9ebe4;
}

.catalog-image-meta {
  display: grid;
  gap: 5px;
  padding: 12px;
  color: var(--muted);
  font-size: 13px;
}

.catalog-image-meta strong {
  color: var(--text);
  font-size: 15px;
}

.catalog-image-type {
  color: var(--primary-strong);
  font-weight: 900;
}

.catalog-image-source {
  color: var(--primary);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.admin-catalog-image-page {
  display: grid;
  gap: 18px;
}

.admin-catalog-image-upload {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.admin-catalog-image-upload h2 {
  grid-column: 1 / -1;
  margin: 0;
}

.admin-catalog-image-upload label,
.admin-catalog-image-form label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.admin-catalog-image-upload input,
.admin-catalog-image-upload select,
.admin-catalog-image-upload textarea,
.admin-catalog-image-form input,
.admin-catalog-image-form select,
.admin-catalog-image-form textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
  color: var(--text);
  font: inherit;
}

.admin-catalog-image-upload input,
.admin-catalog-image-upload select,
.admin-catalog-image-form input,
.admin-catalog-image-form select {
  min-height: 36px;
  padding: 6px 8px;
}

.admin-catalog-image-upload textarea,
.admin-catalog-image-form textarea {
  padding: 8px;
  resize: vertical;
}

.admin-catalog-image-list {
  display: grid;
  gap: 14px;
}

.admin-catalog-image-card {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.admin-catalog-image-thumb {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #eef0eb;
}

.admin-catalog-image-thumb img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.admin-catalog-image-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.admin-catalog-image-form > strong,
.admin-catalog-image-form .catalog-image-source {
  grid-column: 1 / -1;
}

.catalog-thumb {
  width: 64px;
  aspect-ratio: 1;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #eef0eb;
}

.catalog-thumb-placeholder {
  display: grid;
  place-items: center;
  width: 64px;
  aspect-ratio: 1;
  border: 1px dashed var(--line);
  border-radius: 6px;
  background: #f7f7f4;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-align: center;
}

.checklist-catalog-thumb {
  width: 100%;
  max-width: 92px;
  margin-bottom: 6px;
}

.checkbox-label {
  display: flex !important;
  flex-direction: row;
  gap: 8px !important;
  align-items: center;
}

.checkbox-label input[type='checkbox'] {
  width: auto;
  min-height: 0;
}


.catalog-primary-image .catalog-thumb-placeholder {
  width: 100%;
  min-height: 240px;
  border: 0;
  border-radius: 0;
}


.admin-catalog-image-preview {
  display: grid;
  gap: 10px;
  margin-bottom: 18px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.admin-catalog-image-preview-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.admin-catalog-image-preview-grid a {
  display: grid;
  gap: 5px;
  width: 88px;
  color: var(--primary);
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}

.admin-catalog-image-preview-grid .catalog-thumb {
  width: 88px;
}

.catalog-filter-box,
.admin-catalog-filter-box,
.item-filter-box {
  display: grid;
  gap: 14px;
  margin: 20px 0;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.catalog-filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.catalog-filter-grid label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.catalog-filter-grid input,
.catalog-filter-grid select {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
  color: var(--text);
  font: inherit;
}

.catalog-filter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.filter-reset-link {
  color: var(--primary);
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.active-filter-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 2px;
}

.active-filter-chip,
.catalog-image-count,
.catalog-linked-count {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  background: #eef3ee;
  color: var(--primary-strong);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.catalog-status-cell {
  color: var(--primary-strong);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.catalog-result-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: baseline;
  margin: 14px 0;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
}

.catalog-result-summary strong {
  color: var(--text);
  font-size: 18px;
}

.catalog-empty-state {
  display: grid;
  gap: 6px;
  margin: 18px 0;
  padding: 22px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fafaf7;
  color: var(--muted);
  text-align: center;
}

.catalog-empty-state strong {
  color: var(--text);
}

.admin-catalog-result-table {
  min-width: 1320px;
}

.admin-catalog-result-table td {
  vertical-align: top;
}

@media (max-width: 720px) {
  .catalog-filter-grid {
    grid-template-columns: 1fr;
  }

  .catalog-filter-actions {
    align-items: stretch;
  }

  .catalog-filter-actions .button,
  .catalog-filter-actions .filter-reset-link {
    justify-content: center;
    width: 100%;
  }
}

.dataset-status-filter { display:flex; flex-wrap:wrap; gap:12px; align-items:end; margin:18px 0; }
.dataset-status-filter label { display:grid; gap:5px; font-weight:800; }
.dataset-status-summary { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; margin:18px 0; }
.dataset-status-card { padding:15px; border:1px solid var(--line); border-radius:10px; background:var(--surface); display:grid; gap:5px; }
.dataset-status-card strong { font-size:25px; }
.dataset-status-card span { color:var(--muted); font-size:12px; font-weight:800; }
.dataset-status-table { min-width:1100px; }
.dataset-status-table td { vertical-align:top; }
.issue-badge, .data-status-badge { display:inline-block; padding:3px 7px; border-radius:999px; margin:2px; font-size:11px; font-weight:900; }
.issue-badge.issued { background:#dff5e6; color:#176b35; } .issue-badge.not-issued { background:#f3e4e4; color:#8a2525; }
.issue-badge.unknown { background:#fff1c9; color:#775500; } .issue-badge.excluded { background:#e8e8e8; color:#555; } .issue-badge.special { background:#e8ddff; color:#5d3296; }
.data-status-badge.draft { background:#eee; color:#555; } .data-status-badge.basic { background:#dcecff; color:#245a95; }
.data-status-badge.sourced { background:#dff4ed; color:#176b58; } .data-status-badge.verified { background:#d9f2db; color:#276a2b; }
.data-status-badge.complete { background:#c9efd0; color:#145b20; } .data-status-badge.review { background:#ffe0c2; color:#8a4b13; }
.dataset-priority { font-weight:900; color:var(--primary-strong); }


.import-page {
  display: grid;
  gap: 22px;
}

.import-help-box {
  display: grid;
  gap: 8px;
  padding: 16px;
  border: 1px solid #e3d8b8;
  border-radius: 8px;
  background: #fff9e8;
  color: #5d5336;
}

.import-help-box p,
.import-help-box ul {
  margin: 0;
}

.import-sample-box {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.import-sample-box h2 {
  margin: 0;
  font-size: 20px;
}

.import-sample-box pre {
  overflow-x: auto;
  margin: 0;
  padding: 14px;
  border-radius: 6px;
  background: #202124;
  color: #f7f7f4;
  font-size: 13px;
  line-height: 1.5;
}

.import-preview-summary,
.import-result-box {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}

.import-preview-summary div,
.import-result-box div {
  display: grid;
  gap: 4px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.import-preview-summary strong,
.import-result-box strong {
  font-size: 26px;
  line-height: 1;
}

.import-preview-summary span,
.import-result-box span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.import-preview-table {
  min-width: 1180px;
}

.import-preview-table td {
  vertical-align: top;
}

.import-action-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.import-action-badge.insert {
  background: #dcefe6;
  color: var(--primary-strong);
}

.import-action-badge.update {
  background: #e8edf4;
  color: #40506a;
}

.import-action-badge.skip {
  background: #f3ded8;
  color: #8b3c29;
}

.import-warning-list,
.import-error-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.import-warning-list li,
.import-error-list li {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}

.import-warning-list li {
  background: #fff1bf;
  color: #725700;
}

.import-error-list li {
  background: #f6d8d3;
  color: #8b2f22;
}

.import-result-box {
  margin-bottom: 6px;
}


.generate-page {
  display: grid;
  gap: 22px;
}

.generate-help-box {
  display: grid;
  gap: 8px;
  padding: 16px;
  border: 1px solid #e3d8b8;
  border-radius: 8px;
  background: #fff9e8;
  color: #5d5336;
}

.generate-help-box p,
.generate-help-box ul {
  margin: 0;
}

.generate-pattern-box {
  display: grid;
  gap: 8px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.generate-pattern-box h2,
.generate-pattern-box p {
  margin: 0;
}

.generate-pattern-box code {
  padding: 2px 6px;
  border-radius: 6px;
  background: #ece7da;
  font-weight: 800;
}

.generate-preview-summary,
.generate-result-box {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}

.generate-preview-summary div,
.generate-result-box div {
  display: grid;
  gap: 4px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.generate-preview-summary strong,
.generate-result-box strong {
  font-size: 26px;
  line-height: 1;
}

.generate-preview-summary span,
.generate-result-box span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.generate-preview-table {
  min-width: 1100px;
}

.generate-preview-table td {
  vertical-align: top;
}

.generate-action-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.generate-action-badge.insert {
  background: #dcefe6;
  color: var(--primary-strong);
}

.generate-action-badge.skip {
  background: #f3ded8;
  color: #8b3c29;
}

.generate-result-box {
  margin-bottom: 6px;
}


.bulk-edit-page {
  display: grid;
  gap: 22px;
}

.bulk-edit-help-box,
.bulk-edit-filter-box,
.bulk-edit-fields-box {
  display: grid;
  gap: 10px;
}

.bulk-edit-help-box {
  padding: 16px;
  border: 1px solid #e3d8b8;
  border-radius: 8px;
  background: #fff9e8;
  color: #5d5336;
}

.bulk-edit-help-box p,
.bulk-edit-help-box ul {
  margin: 0;
}

.bulk-edit-field-row {
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(240px, 1fr);
  gap: 12px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.bulk-edit-field-row .bulk-edit-apply {
  display: flex;
  gap: 8px;
  align-items: center;
  min-height: 40px;
  font-weight: 900;
}

.bulk-edit-field-row input,
.bulk-edit-field-row select,
.bulk-edit-field-row textarea {
  width: 100%;
}

.bulk-edit-preview-summary,
.bulk-edit-result-box {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}

.bulk-edit-preview-summary div,
.bulk-edit-result-box div {
  display: grid;
  gap: 4px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.bulk-edit-preview-summary strong,
.bulk-edit-result-box strong {
  font-size: 26px;
  line-height: 1;
}

.bulk-edit-preview-summary span,
.bulk-edit-result-box span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.bulk-edit-preview-table {
  min-width: 980px;
}

.bulk-edit-preview-table td {
  vertical-align: top;
}

.bulk-edit-change {
  background: #fffdf4;
}

.bulk-edit-before {
  color: #7a6f59;
}

.bulk-edit-after {
  color: var(--primary-strong);
  font-weight: 900;
}

.bulk-edit-after span {
  display: inline-block;
  margin-left: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.bulk-edit-result-box {
  margin-bottom: 6px;
}

@media (max-width: 720px) {
  .bulk-edit-field-row {
    grid-template-columns: 1fr;
  }
}