/* Suggestion list type badge */
.suggest-items .suggest-item .s-type {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 6px;
    font-size: 11px;
    line-height: 1.3;
    border-radius: 10px;
    background: #eef2ff; /* soft indigo */
    color: #334155; /* slate */
    border: 1px solid #c7d2fe;
}
.ruler-about { display:flex; gap:1rem; align-items:flex-start; }
.ruler-about img { width:160px; height:160px; object-fit:cover; border-radius:10px; box-shadow: var(--shadow); }
.ruler-about-text { display:flex; flex-direction:column; gap:0.25rem; }
.ruler-name { font-weight:600; color:#222; }
.ruler-desc { color:#444; font-size:0.95rem; }

/* Overrides appended for ticket polishing */
.tickets-size-small { --ticket-body-size: 8.5pt; }
.ticket-images { background:#222; border-radius:2mm; padding:1mm; }
.ticket-images img { border:0.2mm solid #444; background:#222; }
.ticket-specs li { line-height:1.25; }
@media screen {
    .tickets-page:not(.clamp-text) .ticket-specs { overflow:auto; }
}
/* Reset and base styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --primary-color: #d4af37;
    --primary-dark: #b8941f;
    --secondary-color: #2c3e50;
    --background: #f5f5f5;
    --card-bg: #ffffff;
    --text-primary: #333;
    --text-secondary: #666;
    --border-color: #ddd;
    --shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    --shadow-hover: 0 5px 20px rgba(0, 0, 0, 0.15);
    /* Coin media presentation */
    --coin-bg: #ffffff; /* neutral white behind transparent PNGs */
    --coin-shadow-sm: 0 1px 3px rgba(0,0,0,0.12);
    --coin-shadow-md: 0 4px 12px rgba(0,0,0,0.14);
    /* Ticket sizing variables (defaults = medium) */
    --ticket-card-w: 95mm;
    --ticket-card-h: 55mm;
    --ticket-image-h: 20mm;
    --ticket-specs-h: 24mm; /* fixed specs block height for medium */
    --ticket-gutter: 4mm; /* target gutter used in solver */
    --ticket-margin: 10mm;
    --ticket-title-size: 11pt;
    --ticket-body-size: 8.5pt;
    /* Face caption alignment control */
    --face-caption-min-h: 48px;
    /* Spacing scale */
    --space-4: 4px;
    --space-8: 8px;
    --space-12: 12px;
    --space-16: 16px;
    --space-24: 24px;
    --space-32: 32px;
}
.tickets-size-small { --ticket-card-w: 90mm; --ticket-card-h: 50mm; --ticket-image-h: 18mm; --ticket-specs-h: 24mm; --ticket-title-size: 10pt; --ticket-body-size: 8pt; }
.tickets-size-medium { --ticket-card-w: 95mm; --ticket-card-h: 55mm; --ticket-image-h: 20mm; --ticket-specs-h: 26mm; --ticket-title-size: 11pt; --ticket-body-size: 8.5pt; }
.tickets-size-large { --ticket-card-w: 100mm; --ticket-card-h: 60mm; --ticket-image-h: 22mm; --ticket-specs-h: 28mm; --ticket-title-size: 12pt; --ticket-body-size: 9pt; }

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    line-height: 1.6;
    color: var(--text-primary);
    background: var(--background);
    min-height: 100vh;
}

/* Header */
header {
    background: linear-gradient(135deg, var(--secondary-color), #34495e);
    color: white;
    padding: 2rem 1rem;
    text-align: center;
    box-shadow: var(--shadow);
}

header h1 {
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
}

header p {
    font-size: 1.1rem;
    opacity: 0.9;
}

/* Main content */
main {
    max-width: 1400px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

/* Add coin section */
.add-coin-section {
    margin-bottom: 3rem;
}

.form-container {
    background: var(--card-bg);
    padding: 2rem;
    border-radius: 10px;
    box-shadow: var(--shadow);
    margin-top: 1rem;
    transition: all 0.3s ease;
}

.form-container.hidden {
    display: none;
}

.form-container h2 {
    color: var(--secondary-color);
    margin-bottom: 1.5rem;
}

.form-group {
    margin-bottom: 1.5rem;
}

.form-group label {
    display: block;
    margin-bottom: 0.5rem;
    color: var(--text-secondary);
    font-weight: 500;
}

.form-group input,
.form-group textarea,
.form-group select {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 5px;
    font-size: 1rem;
    transition: border-color 0.3s ease;
}

/* Nomisma suggest minimal styling */
.nomisma-input-wrap { display:flex; gap:0.5rem; align-items:center; }
.external-image-grid { display:flex; gap:1rem; flex-wrap:wrap; align-items:flex-start; }
.external-image-field { display:flex; flex-direction:column; flex:1 1 240px; gap:0.4rem; font-weight:500; color:var(--text-secondary); }
.external-image-field input { font-weight:400; }
.external-image-field small { font-size:0.78rem; color:#6b7280; line-height:1.4; }
.external-image-field code,
.external-image-note code { font-family:"SFMono-Regular","Consolas","Liberation Mono",monospace; font-size:0.85em; background:#f3f4f6; padding:0 4px; border-radius:4px; }
.external-image-note { margin-top:0.5rem; color:#6b7280; font-size:0.85rem; }
.suggest-list { position: relative; margin-top: 0.4rem; }
.suggest-list .suggest-items { position:absolute; left:0; right:0; background:#fff; border:1px solid var(--border-color); border-radius:6px; box-shadow: var(--shadow); max-height: 260px; overflow:auto; z-index: 1000; }
.suggest-item { padding: 0.5rem 0.75rem; cursor: pointer; display:flex; justify-content: space-between; gap:0.5rem; }
.suggest-item:hover { background:#f3f6f9; }
.suggest-item .s-label { color:#222; font-weight:500; }
.suggest-item .s-id { color:#666; font-size:0.85rem; }

/* Chips and badges */
.chip-wrap { display:flex; flex-wrap:wrap; gap:0.5rem; margin-top:0.5rem; }
.chip { display:inline-flex; align-items:center; gap:0.4rem; background:#f3f6f9; border:1px solid #d9e2ec; color:#1f2937; padding:0.25rem 0.5rem; border-radius:999px; font-size:0.85rem; }
.chip .chip-link { color:#2563eb; text-decoration:none; display:inline-flex; align-items:center; }
.chip .chip-remove { border:0; background:transparent; color:#6b7280; cursor:pointer; font-size:1rem; line-height:1; padding:0 0.25rem; }
.badge { display:inline-block; margin-left:0.4rem; font-size:0.7rem; background:#eef2ff; color:#3b82f6; border:1px solid #dbeafe; padding:0.1rem 0.35rem; border-radius:999px; vertical-align:middle; }

/* Date range compact row */
.date-range-row { display:flex; gap:0.75rem; align-items:flex-end; margin-top:0.5rem; flex-wrap:wrap; }
.date-range-item { display:flex; gap:0.5rem; align-items:flex-end; }
.date-range-item label { margin-bottom:0.25rem; font-size:0.85rem; color:#666; display:block; }
.date-range-item input { width: 7rem; }
.date-range-item select { width: 5rem; }
/* Period context summary */
.period-context { margin-top:0.5rem; font-size:0.75rem; color:#444; line-height:1.3; }
.period-context strong { color:#222; }
.suggest-items .suggest-item.suggest-primary { background:#f0f7ff; border-left:4px solid #3b82f6; }
.modal-media { margin-top: 16px; display: grid; gap: 12px; justify-items: center; }
.modal-media.grid-2 { grid-template-columns: 1fr 1fr; }
/* Image wrapper ensuring 1:1 area and sane max widths per viewport */
.img-wrap { aspect-ratio: 1 / 1; width: 100%; max-width: 100%; background: var(--coin-bg); border-radius: 12px; padding: 12px; border: 1px solid rgba(229,231,235,0.6); box-shadow: var(--coin-shadow-sm); display: flex; align-items: center; justify-content: center; }
@media (min-width: 1024px) { .img-wrap { max-width: 420px; } }
@media (min-width: 1280px) { .img-wrap { max-width: 520px; } }
.img-wrap .img-main { width: 100%; height: 100%; object-fit: contain; object-position: center; border-radius: 12px; box-shadow: var(--coin-shadow-sm); }
.modal-thumbs { display: flex; gap: 8px; margin-top: 8px; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
.modal-thumbs img { width: 64px; height: 64px; object-fit: contain; object-position: center; border-radius: 12px; cursor: zoom-in; box-shadow: var(--coin-shadow-sm); border: 1px solid rgba(229,231,235,0.6); background: var(--coin-bg); padding: 4px; }
@media (max-width: 640px) { .modal-thumbs img { width: 56px; height: 56px; } }
@media (min-width: 1536px) { .modal-thumbs img { width: 72px; height: 72px; } }
.modal-thumbs img.selected { outline: 2px solid rgba(156,163,175,0.9); outline-offset: 2px; }

/* Hover magnifier lens */
.magnifier-lens { position: fixed; pointer-events: none; border-radius: 50%; border: 1px solid rgba(0,0,0,0.15); box-shadow: 0 4px 14px rgba(0,0,0,0.18); background-repeat: no-repeat; z-index: 10000; backdrop-filter: none; overflow: hidden; }

.modal-grid { display: grid; gap: 24px; margin-top: 18px; }
@media (min-width: 1024px) { .modal-grid { grid-template-columns: 1fr 1fr; gap: 24px; } }

/* Card styling */
.card { border: 1px solid rgba(0,0,0,0.08); background: rgba(255,255,255,0.85); border-radius: 14px; box-shadow: 0 1px 2px rgba(0,0,0,0.04); padding: var(--space-16) var(--space-24); margin-bottom: var(--space-24); }
.card h3 { font-size: 1.1rem; font-weight: 600; color: #1f2937; margin: 0 0 var(--space-16); display: flex; align-items: center; gap: 6px; }
.section-title { font-size: 1.25rem; font-weight: 650; letter-spacing: .01em; }
.card + .card { margin-top: 0; }
/* Subtle styling for Image Tools card */
.image-tools-card { background: #fafafa; border:1px solid #e5e7eb; border-radius:12px; padding: 0; }
.hero-images-stack { display:flex; flex-direction:column; gap:12px; flex:1 1 520px; }
.hero-images-stack .image-tools-card { margin:0; }
.hero-images-stack .hero-images { order:2; }
.hero-images-stack .image-tools-card { order:1; }
.image-tools-card h3.collapsible-head { font-size: 0.95rem; font-weight: 600; color:#374151; opacity: 0.95; margin:0; padding:8px 12px; display:flex; align-items:center; gap:6px; }
.image-tools-card .collapse-body { padding:8px 12px 10px; }
.modal-media-tools { color:#4b5563; font-size:12px; display:flex; gap:14px; align-items:flex-start; flex-wrap:wrap; margin:6px 0 12px; }
.modal-media-tools .tool-group { display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-8); padding-right:12px; margin-right:8px; border-right:1px solid #eee; }
.modal-media-tools .tool-group:last-child { border-right:none; padding-right:0; margin-right:0; }
.modal-media-tools .tool-label { font-size:11px; color:#6b7280; text-transform:uppercase; letter-spacing:.06em; }
.modal-media-tools .tool-title { font-size:11px; color:#6b7280; text-transform:uppercase; letter-spacing:.06em; }
.modal-media-tools .tool-row { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.modal-media-tools .tool-btn { appearance:none; border:1px solid #e5e7eb; background:#fff; color:#374151; padding:4px 10px; border-radius:999px; font-size:12px; line-height:1.2; cursor:pointer; box-shadow:0 1px 1px rgba(0,0,0,0.03); }
.modal-media-tools .tool-btn:hover { background:#f9fafb; }
.modal-media-tools .tool-btn.selected, .modal-media-tools .tool-btn[aria-pressed="true"] { background:#eef2ff; border-color:#c7d2fe; color:#1e3a8a; }
.modal-media-tools input[type="range"] { width:110px; }
.modal-media-tools .swatch { display:inline-block; width:16px; height:16px; border-radius:4px; border:1px solid #e5e7eb; }
.modal-media-tools .swatch-none { background: linear-gradient(45deg, #fff 25%, #f3f4f6 25%, #f3f4f6 50%, #fff 50%, #fff 75%, #f3f4f6 75%, #f3f4f6 100%); background-size: 8px 8px; }
.modal-media-tools .swatch-grey { background:#d4d4d4; }
.modal-media-tools .swatch-warm { background:#f4e8d2; }
.modal-media-tools .swatch-teal { background:#0d3a4a; }
.modal-media-tools .swatch-charcoal { background:#2a2a2a; }
.modal-media-tools select, .modal-media-tools input[type="range"] { border:1px solid #e5e7eb; border-radius:6px; background:#fff; color:#374151; }
.modal-media-tools #detailResetBtn { background:#f3f4f6; color:#374151; border-color:#e5e7eb; }
.modal-media-tools #detailResetBtn:hover { background:#e5e7eb; }

/* Definition list pattern */
.dl-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (max-width: 640px) { .dl-grid { gap: 8px; } }
@media (min-width: 640px) { .dl-grid.cols-2 { grid-template-columns: 1fr 1fr; } }
.dl { margin: 0; }
/* Small note under linked labels */
.dl-note { margin-top: 4px; font-size: 12px; color: #6b7280; }
/* Source chips for provenance */
.source-chip { display: inline-block; margin-left: 4px; padding: 0 5px; border-radius: 999px; font-size: 0.7rem; line-height: 1.4; vertical-align: middle; color: #525865; background: #f5f7fa; border: 1px solid #e3e7ec; font-weight: 500; }
.chip-stack { display:inline-flex; gap:4px; margin-left:6px; }
.essentials-card dt { font-weight:600; }
.essentials-card dd { margin:0 0 6px 0; }
.essentials-helper { margin-top:6px; font-size:11px; color:#6b7280; }
.hero-grid { display:flex; flex-wrap:wrap; gap:16px; margin-top:12px; background: #fafafa; border: 1px solid #eee; border-radius:12px; padding:12px; }
.hero-images { flex:1 1 520px; display:grid; gap:14px; grid-template-columns: 1fr 1fr; align-items:start; }
.hero-images .face-card { background:transparent; border:none; border-radius:0; padding:0; display:flex; flex-direction:column; }
.hero-images .face-media { position:relative; width:100%; padding-top:100%; background: var(--coin-bg); border-radius:10px; border:1px solid rgba(229,231,235,0.6); overflow:hidden; }
.hero-images .face-media .img-main { position:absolute; left:8px; top:8px; right:8px; bottom:8px; width:auto; height:auto; max-width:calc(100% - 16px); max-height:calc(100% - 16px); object-fit:contain; border-radius:8px; }
.face-caption-label { font-size:11px; font-weight:700; letter-spacing:.08em; color:#374151; margin-top:6px; text-transform:uppercase; display:flex; align-items:center; gap:6px; }
.face-caption-text { font-size:14px; line-height:1.5; color:#1f2937; margin-top:4px; min-height: var(--face-caption-min-h); }
.essentials-wrapper { flex:1 1 280px; }
.legend-sources { margin-top:var(--space-24); font-size:11px; color:#374151; display:flex; flex-wrap:wrap; gap:8px; }
.legend-sources { margin-bottom:16px; }
.legend-sources .legend-item { display:inline-flex; align-items:center; gap:4px; }

/* Two-column context grid */
.context-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap:16px; align-items:start; margin-top: 16px; }
@media (max-width: 980px){ .context-grid { grid-template-columns: 1fr; } }
.context-left { display:flex; flex-direction:column; gap:16px; min-width:0; }
.context-right { display:flex; flex-direction:column; gap:16px; min-width:0; }
.modal-header .subtitle-line { font-size:0.85rem; color:#374151; margin-top:4px; }
.modal-header .helper-line { font-size:11px; color:#6b7280; margin-top:4px; }
.more-menu { position:relative; display:inline-block; }
.more-dropdown { position:absolute; top:100%; right:0; background:#fff; border:1px solid #d1d5db; border-radius:6px; padding:6px 0; min-width:160px; box-shadow:0 4px 12px rgba(0,0,0,0.12); display:none; z-index:50; }
.more-dropdown button { background:none; border:none; width:100%; text-align:left; padding:6px 12px; font-size:13px; cursor:pointer; }
.more-dropdown button:hover { background:#f3f4f6; }
.collapse-toggle { cursor:pointer; font-size:12px; color:#2563eb; margin-top:6px; display:inline-block; }
.collapsed .collapse-body { display:none; }
.type-details-card .compact-row dd { display:flex; align-items:center; gap:4px; }
.source-chip.user { background: #eef2f7; color: #374151; border-color:#e5e7eb; }
.source-chip.nomisma { background: #eef2ff; color: #1e3a8a; border-color:#dbeafe; }
.source-chip.wikidata { background: #edf7ef; color: #14532d; border-color:#d1fae5; }
.source-chip.wikipedia { background: #fefce8; color: #92400e; border-color:#fde68a; }
.source-chip.ocre { background: #f7ecfe; color: #6b21a8; border-color:#e9d5ff; }
.dl-subhead { grid-column: 1 / -1; color: #374151; font-weight: 600; letter-spacing: .02em; margin: 4px 0; font-size: 0.9rem; }

/* Chips and badges (resolved duplicate definition; unified with earlier .chip) */
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip .ext { font-size: 12px; opacity: .65; }

/* Buttons (link buttons) */
.btn-link { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 8px; border: 1px solid rgba(0,0,0,0.1); background: #fff; color: #1f2937; text-decoration: none; font-size: 13px; }
.btn-link:hover { background: #f9fafb; }
.btn-group { display: flex; gap: 8px; flex-wrap: wrap; }

/* About the ruler card */
.ruler-card { display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items:flex-start; }
/* Extra inner horizontal breathing room for text next to large avatar */
.ruler-card > div:last-child { padding-right: 8px; }
.ruler-avatar-wrap { width: 180px; min-width: 150px; max-width: 220px; border-radius: 18px; background: #e5e7eb; padding: 10px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.ruler-avatar { width: 100%; height: auto; max-height: 220px; border-radius: 12px; object-fit: contain; display:block; }
.learnmore-actions { margin-top: 10px; display:flex; gap:8px; flex-wrap:wrap; }
.learnmore-actions .btn-link { font-size:12px; padding:5px 10px; }
.ruler-name-row { display: flex; align-items: baseline; gap: 8px; }
.ruler-name-row .years { font-size: 12px; color: #6b7280; }
.ruler-desc { margin: var(--space-8) 0 0; color: #374151; font-size: 0.95rem; line-height: 1.6; max-width:680px; }
.ruler-desc .desc-long { margin-top:8px; }
.ruler-desc h4 { margin: 12px 0 6px; color:#1f2937; font-weight:600; }
.ruler-desc ul, .ruler-desc ol { margin: 6px 0 10px 0; padding-left: 1.1rem; }
.ruler-desc li { margin: 2px 0; }
.ruler-desc figure { margin: 12px 0; }
.ruler-desc img { display:block; max-width:100%; height:auto; border-radius:8px; box-shadow: var(--coin-shadow-sm); }
.ruler-desc figcaption { font-size: 12px; color:#6b7280; margin-top:4px; }
.ruler-facts { margin-top: 10px; font-size: 13px; color: #374151; }
.ruler-facts ul { margin: 6px 0 0 18px; padding: 0; }
.ruler-facts li { margin: 4px 0; }
.mint-map-block { margin-top: 18px; padding: 12px; border:1px solid #e5e7eb; border-radius: 12px; background:#f8fafc; display:flex; flex-direction:column; gap:10px; }
.mint-map-canvas { width:100%; border-radius:10px; overflow:hidden; background:#e2e8f0; }
.mint-map-canvas img { display:block; width:100%; height:auto; }
.mint-map-frame { width:100%; min-height:220px; border:0; display:block; }
.mint-map-meta { display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; font-size:0.85rem; color:#475569; }
.mint-map-link { font-size:0.82rem; font-weight:600; color:#2563eb; text-decoration:none; }
.mint-map-link:hover { text-decoration:underline; }

/* Description clamp */
.desc-clamp { display: -webkit-box; -webkit-line-clamp: 6; line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; position: relative; max-width:680px; font-size:0.95rem; line-height:1.6; }
/* Catalog type card field grouping with dividers */
.type-card .dl { margin:0; padding: var(--space-8) 0; }
.type-card .dl + .dl { border-top:1px solid #e9edf0; }
.type-card .dl dt { font-size:0.8rem; letter-spacing:.08em; }
/* Catalog reference values: tighter, subdued */
.type-card .dl dd { margin-top:4px; font-size:12px; color:#6b7280; line-height:1.45; font-weight:500; }
/* Large screen readability scaling */
@media (min-width:2000px){
    .type-card .dl dt { font-size:0.85rem; }
    .type-card .dl dd { font-size:0.8rem; }
}
@media (min-width:2560px){
    .type-card .dl dt { font-size:0.9rem; }
    .type-card .dl dd { font-size:0.85rem; }
}
.type-card .collapse-body { padding-top:0; }
/* External text styling */
.external-text { font-size:0.9rem; color:#4b5563; line-height:1.55; max-width:680px; }
.show-more { margin-top: 8px; color: #3949ab; background: none; border: none; padding: 0; cursor: pointer; font-size: 13px; }

/* Dividers */
.divider { border-top: 1px solid #f1f1f1; margin-top: 12px; padding-top: 12px; }

/* Section tweaks */
.section-header-icon { opacity: .7; }
.owl { font-size: 16px; }

/* Skeletons */
.skeleton { background: linear-gradient(90deg,#eee 25%,#f5f5f5 37%,#eee 63%); background-size: 400% 100%; animation: shimmer 1.2s infinite; border-radius: 8px; }
.sk-avatar { width: 64px; height: 64px; border-radius: 14px; }
.sk-line { height: 12px; margin-top: 6px; width: 100%; border-radius: 6px; }
@keyframes shimmer { 0%{ background-position: 200% 0 } 100%{ background-position: -200% 0 } }

/* Mobile spacing */
@media (max-width: 900px){
    .ruler-card { grid-template-columns: minmax(120px, 160px) 1fr; }
    .ruler-avatar-wrap { width: 160px; min-width:130px; }
}
@media (max-width: 640px) {
    .card { padding: 16px; border-radius: 14px; }
    .modal-grid { gap: 16px; }
    .ruler-card { grid-template-columns: 1fr; }
    .ruler-avatar-wrap { width: min(70vw, 220px); min-width:0; margin-bottom:12px; }
}

/* Theming: Dark mode */
:root[data-theme="dark"] {
        --primary-color: #e0b84a;
        --primary-dark: #cba538;
        --secondary-color: #93c5fd; /* used for accents/headers */
        --background: #0f1115;
        --card-bg: #131720;
        --text-primary: #e5e7eb;
        --text-secondary: #9ca3af;
        --border-color: #273142;
        --shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
        --shadow-hover: 0 6px 24px rgba(0, 0, 0, 0.45);
        --coin-bg: #0f1218;
}

[data-theme="dark"] body { background: var(--background); color: var(--text-primary); }
[data-theme="dark"] header { background: linear-gradient(135deg, #1f2937, #111827); }
[data-theme="dark"] .card { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .card h3, [data-theme="dark"] .section-title { color: var(--text-primary); }
[data-theme="dark"] .dl-subhead { color: #cbd5e1; }
[data-theme="dark"] .modal-header .subtitle-line { color:#cbd5e1; }
[data-theme="dark"] .modal-header .helper-line { color:#94a3b8; }
[data-theme="dark"] .ruler-name { color:#e2e8f0; }
[data-theme="dark"] .mint-map-block { background:#0f1218; border-color: var(--border-color); }
[data-theme="dark"] .mint-map-canvas { background:#1f2937; }
[data-theme="dark"] .mint-map-frame { filter:contrast(1.05); }
[data-theme="dark"] .mint-map-meta { color:#cbd5e1; }
[data-theme="dark"] .mint-map-link { color:#93c5fd; }
[data-theme="dark"] .actions-menu, [data-theme="dark"] .more-dropdown { background: var(--card-bg); border-color: var(--border-color); box-shadow: var(--shadow-hover); }
[data-theme="dark"] .more-dropdown button { color: var(--text-primary); }
[data-theme="dark"] .actions-menu .menu-item { color: var(--text-primary); }
[data-theme="dark"] .actions-menu .menu-item:hover, [data-theme="dark"] .more-dropdown button:hover { background: rgba(255,255,255,0.06); }
[data-theme="dark"] .coin-card { background: var(--card-bg); }
[data-theme="dark"] .modal-content { background: var(--card-bg); }
[data-theme="dark"] .modal-header { border-bottom-color: rgba(224,184,74,0.6); }
[data-theme="dark"] .history-toolbar, [data-theme="dark"] .entity-card, [data-theme="dark"] .event-card, [data-theme="dark"] .trace-section, [data-theme="dark"] .tickets-toolbar { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .compare-panel, [data-theme="dark"] .compare-toolbar, [data-theme="dark"] .compare-table th { background: var(--card-bg); color: var(--text-primary); }
[data-theme="dark"] .compare-side { background: #0f1218; border-color: var(--border-color); }
[data-theme="dark"] .compare-table td, [data-theme="dark"] .compare-table tr { border-color: var(--border-color); }
[data-theme="dark"] .timeline-wrap { background: #0e1320; border-color: var(--border-color); }
[data-theme="dark"] .timeline-bar { background: #1f2937; }
[data-theme="dark"] .ruler-chip { background: #0e1320; border-color: var(--border-color); color: var(--text-primary); }
[data-theme="dark"] .ex-thumb { background: #0e1320; border-color: var(--border-color); }

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
    outline: none;
    border-color: var(--primary-color);
}

/* Image picker (edit/add) */
.image-draft-list { display:flex; gap:10px; flex-wrap:wrap; }
.image-draft { width:130px; border:1px solid #e5e7eb; background:#fff; border-radius:10px; padding:8px; box-shadow: var(--coin-shadow-sm, 0 1px 2px rgba(0,0,0,0.04)); }
.image-draft img { width:100%; height:100px; object-fit:cover; border-radius:8px; background:#f3f4f6; }
.image-draft .img-meta { margin-top:6px; font-size:12px; color:#6b7280; display:flex; align-items:center; justify-content:space-between; }
.image-draft .img-actions { margin-top:6px; display:flex; flex-wrap:wrap; gap:6px; }
.image-draft .role-badge { font-size:10px; padding:2px 6px; border-radius:999px; background:#eef2f7; color:#374151; border:1px solid #e5e7eb; text-transform:uppercase; letter-spacing:.06em; }
.image-draft .role-badge.obv { background:#eef2ff; color:#1e3a8a; border-color:#dbeafe; }
.image-draft .role-badge.rev { background:#edf7ef; color:#14532d; border-color:#d1fae5; }

.form-group small {
    display: block;
    margin-top: 0.3rem;
    color: var(--text-secondary);
    font-size: 0.85rem;
}

.enrich-opt { display:block; margin-top:0.35rem; font-size:0.75rem; color:#555; user-select:none; }
.enrich-opt input { margin-right:0.35rem; }

.form-actions {
    display: flex;
    gap: 1rem;
    margin-top: 2rem;
}

/* Buttons */
.btn-primary,
.btn-secondary,
.btn-danger {
    padding: 0.75rem 1.5rem;
    border: none;
    border-radius: 5px;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 500;
}

.btn-primary {
    background: var(--primary-color);
    color: var(--secondary-color);
}

.btn-primary:hover {
    background: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: var(--shadow);
}

.btn-secondary {
    background: #95a5a6;
    color: white;
}

.btn-secondary:hover {
    background: #7f8c8d;
}

.btn-danger {
    background: #e74c3c;
    color: white;
}

.btn-danger:hover {
    background: #c0392b;
}

/* Filters */
.filters {
    display: flex;
    gap: 1rem;
    margin-bottom: 2rem;
    flex-wrap: wrap;
    align-items: center;
}

/* Actions dropdown */
.actions-wrap {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.actions-menu-wrap { position: relative; }
.actions-menu { position: absolute; right: 0; top: 110%; background: #fff; border: 1px solid var(--border-color); border-radius: 8px; box-shadow: var(--shadow-hover); min-width: 200px; z-index: 10; padding: 0.25rem; }
.actions-menu .menu-item { display: block; width: 100%; text-align: left; background: transparent; border: 0; padding: 0.6rem 0.8rem; border-radius: 6px; cursor: pointer; font-size: 0.95rem; color: var(--text-primary); }
.actions-menu .menu-item:hover { background: #f5f7fa; }

.search-input,
.sort-select {
    padding: 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 5px;
    font-size: 1rem;
}

.search-input {
    flex: 1;
    min-width: 200px;
}

.sort-select {
    min-width: 150px;
}

/* Coins grid */
.coins-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 2rem;
    margin-bottom: 2rem;
}

.coin-card {
    background: var(--card-bg);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: all 0.3s ease;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.coin-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-hover);
}

/* Visual highlight for selected cards in selection mode */
body.selection-mode .coin-card.selected {
    outline: 2px solid var(--primary-color);
    outline-offset: -2px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.18);
}

.coin-card-images {
    position: relative;
    aspect-ratio: 1 / 1; /* enforce square placeholder/media */
    overflow: hidden;
    background: var(--coin-bg);
    border-radius: 12px;
    padding: 0; /* remove frame for a seamless 3D flip */
    perspective: 900px; /* ensure 3D perspective applies */
    flex: 0 0 auto;
}

.coin-card-images img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

/* 3D flip on hover */
.coin-3d { position: absolute; inset: 0; perspective: 900px; border-radius: inherit; overflow: hidden; }
.coin-rotator { position: absolute; inset: 0; transform-style: preserve-3d; -webkit-transform-style: preserve-3d; transition: transform 2s cubic-bezier(0.2, 0.8, 0.2, 1); border-radius: inherit; overflow: hidden; transform-origin: center center; }
.coin-face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; width: 100%; height: 100%; object-fit: contain; object-position: center; border: 0; background: var(--coin-bg); border-radius: 0; box-shadow: none; transform-style: preserve-3d; -webkit-transform-style: preserve-3d; transition: transform 2s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 1.5s ease; }
.coin-front { transform: rotateY(0deg); opacity: 1; }
.coin-back { transform: rotateY(180deg); opacity: 0; }
.coin-card:hover .coin-front,
.coin-card:focus-within .coin-front,
.coin-card-images:hover .coin-front { transform: rotateY(-180deg); opacity: 0; }
.coin-card:hover .coin-back,
.coin-card:focus-within .coin-back,
.coin-card-images:hover .coin-back { transform: rotateY(0deg); opacity: 1; }
[data-theme="dark"] .coin-face { background: var(--coin-bg); }
[data-theme="dark"] .coin-card-images { background: var(--coin-bg); }
[data-theme="dark"] .coin-card-content h3 { color: var(--text-primary); }
[data-theme="dark"] .coin-info-item { color: var(--text-secondary); }
[data-theme="dark"] .coin-info-item strong { color: var(--text-primary); }
[data-theme="dark"] .form-group input,
[data-theme="dark"] .form-group textarea,
[data-theme="dark"] .form-group select,
[data-theme="dark"] .search-input,
[data-theme="dark"] .sort-select { background:#1e2530; border:1px solid #3b4757; color:#e5e7eb; }
[data-theme="dark"] .form-group input:focus,
[data-theme="dark"] .form-group textarea:focus,
[data-theme="dark"] .form-group select:focus { border-color: var(--primary-color); }
[data-theme="dark"] .form-group label { color:#cbd5e1; }
[data-theme="dark"] .form-group small { color:#94a3b8; }
[data-theme="dark"] .search-input::placeholder { color:#64748b; }
[data-theme="dark"] .sort-select { background:#1e2530; }
[data-theme="dark"] .btn-primary { background: var(--primary-color); color:#0f1115; }
[data-theme="dark"] .btn-primary:hover { background: var(--primary-dark); }
[data-theme="dark"] .btn-secondary { background:#334155; color:#e2e8f0; }
[data-theme="dark"] .btn-secondary:hover { background:#475569; }
[data-theme="dark"] .btn-danger { background:#b91c1c; }
[data-theme="dark"] .btn-danger:hover { background:#991b1b; }
[data-theme="dark"] .chip, [data-theme="dark"] .ruler-chip, [data-theme="dark"] .simple-list .tag { background:#1e2530; border-color:#3b4757; color:#e2e8f0; }
[data-theme="dark"] .source-chip { background:#1e2530; border-color:#3b4757; color:#e2e8f0; }
[data-theme="dark"] .source-chip.user { background:#1e2530; }
[data-theme="dark"] .source-chip.nomisma { background:#1e2530; color:#93c5fd; }
[data-theme="dark"] .source-chip.wikidata { background:#1e2530; color:#86efac; }
[data-theme="dark"] .source-chip.wikipedia { background:#1e2530; color:#fbbf24; }
[data-theme="dark"] .source-chip.ocre { background:#1e2530; color:#d8b4fe; }
[data-theme="dark"] .dl dt { color:#94a3b8; }
[data-theme="dark"] .dl dd { color:#e5e7eb; }
[data-theme="dark"] .legend-sources { color:#94a3b8; }
[data-theme="dark"] .legend-sources .legend-desc { color:#64748b; }
[data-theme="dark"] .ruler-avatar-wrap { background:#1e2530; }
[data-theme="dark"] .image-tools-card { background:#1a202c; border-color:#2d3748; }
[data-theme="dark"] .image-tools-card h3.collapsible-head { color:#e2e8f0; }
[data-theme="dark"] .modal-media-tools .tool-btn { background:#1e2530; border-color:#3b4757; color:#e2e8f0; }
[data-theme="dark"] .modal-media-tools .tool-btn:hover { background:#2a313d; }
[data-theme="dark"] .modal-media-tools .tool-btn[aria-pressed="true"] { background:#334155; border-color:#475569; }
[data-theme="dark"] .modal-thumbs img { background:#1e2530; border-color:#3b4757; }
[data-theme="dark"] .hero-grid { background:#1e2530; border-color:#3b4757; }
[data-theme="dark"] .hero-images .face-card { background:transparent; border:none; }
[data-theme="dark"] .face-caption-label { color:#e2e8f0; }
[data-theme="dark"] .face-caption-text { color:#e5e7eb; }
[data-theme="dark"] .essentials-helper { color:#64748b; }
[data-theme="dark"] .external-text { color:#cbd5e1; }
[data-theme="dark"] .conflict-card { background:linear-gradient(120deg,#382b00,#2a2000); border-color:#b45309; }
[data-theme="dark"] .conflict-card h3 { color:#fbbf24; }
[data-theme="dark"] .conflict-intro, [data-theme="dark"] .conflict-note { color:#fbbf24; }
[data-theme="dark"] .compare-side { background:#1e2530; }
[data-theme="dark"] .compare-table .diff-high { background:#3b2f00; }
[data-theme="dark"] .image-lightbox .ilb-stage img { background:#0f1218; }
[data-theme="dark"] .image-lightbox .ilb-toolbar { background:rgba(0,0,0,0.55); }
[data-theme="dark"] .image-lightbox .ilb-toolbar button { background:rgba(255,255,255,0.15); }
[data-theme="dark"] .image-lightbox .ilb-toolbar button:hover { background:rgba(255,255,255,0.25); }
[data-theme="dark"] .ruler-desc h4 { color:#e5e7eb; }
[data-theme="dark"] .ruler-desc figcaption { color:#9ca3af; }
[data-theme="dark"] .bio-chip { background:#1e2530; border-color:#3b4757; color:#e2e8f0; }
[data-theme="dark"] .museum-panel.panel-white { background:#1e2530; }
[data-theme="dark"] .museum-panel.panel-grey { background:#1e2530; }
[data-theme="dark"] .museum-panel.panel-black { background:#0b0f14; }
[data-theme="dark"] .tickets-panel, [data-theme="dark"] .tickets-toolbar { background:#131720; border-color:#273142; }
[data-theme="dark"] .ticket-card { background:#0f1218; border-color:#273142; }
[data-theme="dark"] .ticket-images img { background:#131720; border-color:#273142; }
[data-theme="dark"] .structured-ref-item { background:#1e2530; border-color:#3b4757; }
[data-theme="dark"] .structured-ref-label { color:#e5e7eb; }
[data-theme="dark"] .structured-ref-meta { color:#94a3b8; }
[data-theme="dark"] .structured-ref-links a { color:#93c5fd; }
.coin-card:hover { will-change: transform; }

.coin-card-images .image-count {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 0.3rem 0.6rem;
    border-radius: 15px;
    font-size: 0.85rem;
}

.coin-card-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: var(--primary-color);
    color: var(--secondary-color);
    padding: 0.3rem 0.6rem;
    border-radius: 15px;
    font-size: 0.75rem;
    font-weight: 600;
}


.coin-card-content {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    flex: 1;
}

.coin-card-content h3 {
    color: var(--secondary-color);
    margin-bottom: 0.25rem;
    font-size: 1.3rem;
    line-height: 1.3;
    min-height: 3rem;
    max-height: 3rem;
    overflow: hidden;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Selection mode: hide print checkboxes by default; show when selection mode is active */
.print-select { display: none; }
body.selection-mode .print-select {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.9rem;
    color: var(--text-secondary);
    margin: 0.25rem 0 0.75rem;
}

.coin-info {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 1rem;
    flex: 1;
}

.coin-info-item {
    display: grid;
    grid-template-columns: 130px 1fr;
    column-gap: 0.75rem;
    font-size: 0.9rem;
    color: var(--text-secondary);
    align-items: flex-start;
    min-height: 36px;
}

.coin-info-item span {
    font-weight: 600;
    color: var(--text-secondary);
    white-space: nowrap;
}

.coin-info-item strong {
    color: var(--text-primary);
    justify-self: end;
    text-align: right;
    line-height: 1.4;
}

@media (max-width: 600px) {
    .coin-info-item { grid-template-columns: 1fr; }
    .coin-info-item span { white-space: normal; }
    .coin-info-item strong {
        justify-self: start;
        text-align: left;
    }
}

.coin-card-actions {
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
}

.coin-card-actions button {
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

.btn-view {
    background: var(--primary-color);
    color: var(--secondary-color);
    flex: 1;
}

.btn-view:hover {
    background: var(--primary-dark);
}

.btn-delete {
    background: #e74c3c;
    color: white;
}

.btn-delete:hover {
    background: #c0392b;
}

.data-modal {
    max-width: 720px;
    position: relative;
}

.data-modal h2 {
    margin-top: 0;
    margin-bottom: 0.5rem;
}

.data-modal-lead {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin-bottom: 1rem;
}

.data-panel {
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 1rem 1.25rem;
    background: var(--card-bg, #fff);
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.data-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.storage-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.75rem 1rem;
    margin: 0;
}

.storage-stats dt {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.25rem;
    color: var(--text-secondary);
}

.storage-stats dd {
    margin: 0;
    font-weight: 600;
    color: var(--text-primary);
}

.data-panel-note {
    color: var(--text-secondary);
    font-size: 0.8rem;
}

.export-scope-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.export-scope-option {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.65rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
    color: var(--text-secondary);
}

.export-scope-option input[type="radio"] {
    accent-color: var(--primary-color);
}

.export-scope-option.disabled {
    opacity: 0.55;
}

.export-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.data-panel p {
    margin: 0;
    color: var(--text-secondary);
}

/* Empty state */
.empty-state {
    text-align: center;
    padding: 4rem 2rem;
    color: var(--text-secondary);
    font-size: 1.2rem;
}

/* Floating print selection bar */
.print-bar {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: 20px;
    background: var(--card-bg);
    box-shadow: var(--shadow-hover);
    border: 1px solid var(--border-color);
    border-radius: 999px;
    padding: 0.5rem 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    z-index: 1200;
}

/* Modal */
.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.7);
}

.modal:not(.hidden) {
    display: block;
}

.modal-content {
    background-color: var(--card-bg);
    margin: 2% auto;
    padding: 2rem;
    border-radius: 10px;
    max-width: 1000px;
    max-height: 90vh;
    overflow-y: auto;
    position: relative;
}

.close-modal {
    position: absolute;
    right: 1.5rem;
    top: 1.5rem;
    font-size: 2rem;
    font-weight: bold;
    color: var(--text-secondary);
    cursor: pointer;
    transition: color 0.3s ease;
}

.close-modal:hover {
    color: var(--text-primary);
}

.modal-header {
    margin-bottom: 2rem;
    border-bottom: 2px solid var(--primary-color);
    padding-bottom: 1rem;
    display: flex;
    align-items: center;
    /* Ensure actions don't overlap the absolute close button in the top-right */
    padding-right: 4rem;
}

.modal-header h2 {
    color: var(--secondary-color);
    font-size: 2rem;
}

/* Modal actions (Edit/Delete) */
.modal-actions { margin-left: auto; display: flex; gap: 0.5rem; }

/* Learn more spacing when expanded */
.learn-more { margin-top: 0.75rem; }

.modal-images {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

.modal-images img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 5px;
    box-shadow: var(--shadow);
}

.modal-3d-viewer {
    margin: 2rem 0;
}

.modal-3d-viewer h3 {
    margin-bottom: 1rem;
    color: var(--secondary-color);
}

#viewer3D {
    width: 100%;
    height: 500px;
    border-radius: 5px;
    box-shadow: var(--shadow);
    background: #f9f9f9;
}

/* --- Modal Redesign Utility Additions removed: duplicates consolidated above --- */

/* Image Lightbox */
.image-lightbox { position: fixed; inset: 0; background: rgba(0,0,0,0.9); z-index: 2000; display: flex; align-items: center; justify-content: center; }
.image-lightbox.hidden { display: none; }
.image-lightbox .ilb-stage { position: relative; max-width: 90vw; max-height: 85vh; overflow: hidden; cursor: grab; }
.image-lightbox .ilb-stage img { display: block; max-width: min(90vw, 1600px); max-height: 90vh; object-fit: contain; transform-origin: center center; user-select: none; background: var(--coin-bg); border-radius: 12px; box-shadow: var(--coin-shadow-md); }
.image-lightbox .ilb-toolbar { position: fixed; top: 12px; left: 50%; transform: translateX(-50%); display: flex; gap: 0.5rem; align-items: center; background: rgba(255,255,255,0.08); padding: 0.4rem 0.6rem; border-radius: 8px; }
.image-lightbox .ilb-toolbar button { background: rgba(255,255,255,0.15); color: #fff; border: none; padding: 0.4rem 0.6rem; border-radius: 6px; cursor: pointer; }
.image-lightbox .ilb-toolbar button:hover { background: rgba(255,255,255,0.25); }
.image-lightbox .ilb-prev, .image-lightbox .ilb-next { position: fixed; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,0.15); color:#fff; border:none; width: 44px; height: 44px; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 20px; }
.image-lightbox .ilb-prev { left: 16px; }
.image-lightbox .ilb-next { right: 16px; }
.image-lightbox .ilb-prev:hover, .image-lightbox .ilb-next:hover { background: rgba(255,255,255,0.25); }

.modal-info {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.info-section {
    background: #f9f9f9;
    padding: 1.5rem;
    border-radius: 5px;
}

.info-section h3 {
    color: var(--secondary-color);
    margin-bottom: 1rem;
    font-size: 1.2rem;
}

.info-item {
    margin-bottom: 0.75rem;
}

.info-item strong {
    display: block;
    color: var(--text-primary);
    margin-bottom: 0.2rem;
}

.info-item span {
    color: var(--text-secondary);
}

.modal-description {
    margin-top: 2rem;
}

.modal-description h3 {
    color: var(--secondary-color);
    margin-bottom: 1rem;
}

.modal-description p {
    line-height: 1.8;
    color: var(--text-secondary);
}

/* Responsive design */
@media (max-width: 768px) {
    header h1 {
        font-size: 2rem;
    }

    header p {
        font-size: 1rem;
    }

    .coins-grid {
        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
        gap: 1.5rem;
    }

    .form-actions {
        flex-direction: column;
    }

    .form-actions button {
        width: 100%;
    }

    .filters {
        flex-direction: column;
    }

    .search-input,
    .sort-select {
        width: 100%;
    }

    .modal-content {
        margin: 5% 1rem;
        padding: 1.5rem;
    }

    .modal-info {
        grid-template-columns: 1fr;
    }

    #viewer3D {
        height: 300px;
    }
}

@media (max-width: 480px) {
    main {
        padding: 1rem 0.5rem;
    }

    .coins-grid {
        grid-template-columns: 1fr;
    }

    .coin-card-images { aspect-ratio: 1 / 1; }
}

/* 3D Viewer Fallback */
.viewer-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    flex-direction: column;
    gap: 1rem;
}

.viewer-fallback-title {
    font-size: 1.2rem;
    color: #666;
}

.viewer-fallback-message {
    color: #999;
}

.viewer-fallback-btn {
    padding: 0.75rem 1.5rem;
}

/* Print styles scaffolding */
@media print {
    header, .add-coin-section, .coins-section, #printBar, .modal, .tickets-toolbar { display: none !important; }
    body { background: white; }
    .tickets-overlay { position: static; display: block !important; background: transparent; }
    .tickets-page { box-shadow: none; margin: 0; }
    .tickets-pages { gap: 0; }
    @page { size: A4; margin: 12mm; }
}

/* History Explorer overlay */
.history-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 1400; display: flex; align-items: center; justify-content: center; }
.history-overlay.hidden { display: none; }
.history-panel { background: var(--card-bg); width: 100%; max-width: 1100px; margin: 2% auto; border-radius: 10px; overflow: hidden; box-shadow: var(--shadow-hover); max-height: 90vh; display: flex; flex-direction: column; }
.history-toolbar { display: flex; justify-content: space-between; align-items: center; padding: 1rem; border-bottom: 1px solid var(--border-color); background: #fff; position: sticky; top: 0; z-index: 2; }
.history-title { font-weight: 600; color: var(--secondary-color); }
.history-body { padding: 1rem; display: grid; gap: 1.25rem; flex: 1; overflow-y: auto; }
.history-notice { background: #fff7ed; color: #7c2d12; border: 1px solid #fdba74; border-radius: 8px; padding: 0.6rem 0.8rem; font-size: 0.95rem; }

/* Overview single-column (article-like) layout */
.history-overview { display: block; max-width: 1000px; margin: 0 auto; }
.history-main { display: flex; flex-direction: column; gap: 16px; }
.history-side { display: none; }
.period-header h2 { margin: 0; font-size: 1.5rem; color: #1f2937; }
.period-range { color: #6b7280; margin-top: 2px; }
.period-intro { margin-top: 8px; color: #374151; }
.ov-section { margin-top: 4px; }
.ov-section + .ov-section { margin-top: 12px; }
.ov-section h4 { margin: 0 0 8px; color: #374151; font-size: 1rem; }
.ov-bullets { padding-left: 1rem; }
.simple-list { display: flex; flex-wrap: wrap; gap: 8px 12px; color: #111827; }
.simple-list .tag { background: #f3f4f6; border: 1px solid #e5e7eb; padding: 4px 8px; border-radius: 999px; font-size: 12px; }

/* Two-column responsive grid for entity cards */
.entity-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }

/* Entity cards (sidebar) */
.entity-list { display: flex; flex-direction: column; gap: 12px; }
.entity-card { border: 1px solid var(--border-color); background: #fff; border-radius: 12px; overflow: hidden; box-shadow: var(--shadow); }
.entity-card .thumb { width: 100%; height: 140px; object-fit: cover; background: #f3f4f6; display: block; }
.entity-card .inner { padding: 10px 12px; }
.entity-card .title { font-weight: 600; color: #111827; margin-bottom: 2px; }
.entity-card .subtitle { color: #6b7280; font-size: 12px; }
.entity-card .card-links { border-top: 1px solid #efefef; padding: 6px 12px; font-size: 12px; color: #6b7280; display: flex; gap: 8px; }
.entity-card .card-links a { color: #2563eb; text-decoration: none; }
.entity-card .card-links a:hover { text-decoration: underline; }

/* Small spinner */
.spinner { width: 24px; height: 24px; border: 3px solid #e5e7eb; border-top-color: var(--primary-color); border-radius: 50%; animation: spin 0.8s linear infinite; display:inline-block; }
.spinner.sm { width: 16px; height: 16px; border-width: 2px; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Timeline basics */
.timeline-section h3, .rulers-section h3, .events-section h3 { margin: 0.25rem 0 0.5rem; color: var(--secondary-color); }
.timeline-wrap { position: relative; border: 1px solid var(--border-color); border-radius: 10px; background: #f8fafc; padding: 16px; overflow: hidden; }
.timeline-bar { position: relative; height: 16px; background: #e5e7eb; border-radius: 999px; box-shadow: inset 0 1px 2px rgba(0,0,0,0.06); }
.timeline-range { position: absolute; left: 0; right: 0; top: 0; bottom: 0; border-radius: 999px; background: linear-gradient(90deg,#e0e7ff,#fce7f3); opacity: 0.6; }
.timeline-highlight { position: absolute; top: -4px; height: 24px; border-radius: 999px; background: var(--primary-color); box-shadow: 0 2px 8px rgba(0,0,0,0.12); }
.timeline-labels { display: flex; justify-content: space-between; margin-top: 8px; color: #374151; font-size: 12px; }

/* Rulers placeholder */
.rulers-wrap { display: flex; gap: 8px; flex-wrap: wrap; }
.ruler-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; border: 1px solid var(--border-color); background: #fff; font-size: 13px; }
.ruler-chip.active { background: #eef2ff; border-color: #c7d2fe; font-weight: 600; }

/* Events list (stub) */
.events-wrap { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.event-card { border: 1px solid var(--border-color); border-radius: 10px; background: #fff; padding: 10px; }
.event-card .event-title { font-weight: 600; color: #111827; margin-bottom: 4px; }
.event-card .event-year { color: #6b7280; font-size: 12px; }
.event-card .card-links { border-top: 1px solid #efefef; margin-top: 8px; padding-top: 6px; font-size: 12px; color: #6b7280; display: flex; gap: 8px; }
.event-card .card-links a { color: #2563eb; text-decoration: none; }
.event-card .card-links a:hover { text-decoration: underline; }

/* Trace panel */
.trace-section { border: 1px dashed #d1d5db; background: #fafafa; border-radius: 8px; padding: 10px; }
.trace-section h3 { margin: 0 0 8px; color: #374151; font-size: 1rem; }
.trace-list { font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; white-space: normal; color: #111827; }
.trace-list .t-step { padding: 6px 8px; border-top: 1px solid #eee; display: grid; grid-template-columns: 1fr auto; gap: 6px; }
.trace-list .t-step:first-child { border-top: 0; }
.trace-list .t-meta { color: #6b7280; font-size: 11px; }
.trace-list .t-em { font-weight: 600; }

/* Ruler profile specifics */
.ruler-profile { display: grid; grid-template-columns: 120px 1fr; gap: 16px; align-items: start; }
.ruler-portrait { width: 120px; height: 120px; border-radius: 12px; object-fit: cover; background: #f3f4f6; border: 1px solid var(--border-color); }
.ruler-profile h2 { margin: 0; font-size: 1.25rem; }
.ruler-dates { color:#6b7280; font-size: 0.9rem; }
.ruler-summary { margin-top: 8px; color:#374151; }
.ruler-links { display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; }
.coins-mini-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; margin-top: 8px; }
.coins-mini-card { border: 1px solid var(--border-color); border-radius: 10px; background:#fff; padding: 8px; display:flex; gap:8px; align-items:center; }
.coins-mini-card img { width: 40px; height: 40px; object-fit: cover; border-radius: 6px; background: var(--coin-bg); }

/* Tickets overlay and page */
.tickets-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.6);
    z-index: 1300;
}
.tickets-overlay.hidden { display: none; }
.tickets-panel {
    background: var(--card-bg);
    width: 100%;
    max-width: 1200px;
    margin: 2% auto;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: var(--shadow-hover);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
}
.tickets-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    border-bottom: 1px solid var(--border-color);
    flex-wrap: wrap;
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--card-bg);
}
.tickets-controls { display: flex; gap: 1rem; align-items: center; }
.tickets-controls-row { display:flex; align-items:center; gap:0.75rem; flex-wrap:wrap; }
.tickets-toolbar-title { flex: 1 1 100%; margin-bottom:0.5rem; }
.tickets-controls label { display: inline-flex; gap: 0.4rem; align-items: center; color: var(--text-secondary); }
.tickets-actions { display: flex; gap: 0.5rem; }
.tickets-info { color: var(--text-secondary); font-size: 0.9rem; }

.tickets-page {
    margin: 1rem auto;
    background: white;
    width: 210mm;
    min-height: 297mm;
    box-shadow: 0 0 0 rgba(0,0,0,0); /* avoid affecting layout math */
    padding: var(--ticket-margin);
    display: flex;
    flex-direction: column;
}

.tickets-page.letter { width: 216mm; min-height: 279mm; }

.tickets-pages { display: flex; flex-direction: column; gap: 15mm; overflow: auto; flex: 1; position: relative; }
.tickets-pages .tickets-page { page-break-after: always; }
.tickets-pages .tickets-page:last-child { page-break-after: auto; }
.tickets-page-footer { text-align: center; margin-top: 5mm; color: #777; font-size: 9pt; }

@media screen {
    .tickets-page-footer { opacity: 0.8; }
}

.tickets-grid { display: grid; justify-content: center; align-content: center; }

/* Zoom support for preview panel */
.tickets-pages { --zoom: 1; transform: scale(var(--zoom)); transform-origin: top left; width: calc(100% / var(--zoom)); }
.v1-simplified .tickets-grid, .v1-simplified .ticket-card, .v1-simplified .tickets-size-small, .v1-simplified .tickets-size-large { all: unset; }
.v1-simplified .tickets-page { background: transparent; box-shadow:none; padding:12mm; }
.v1-simplified .tickets-toolbar select { display:none; }
.v1-simplified .tickets-toolbar .tickets-computed, .v1-simplified #layoutNotice { display:none; }

/* Ruler overlay (mm ticks) */
.ruler-active #rulerOverlay { display:block; position:absolute; inset:0; pointer-events:none; }
.ruler-active #rulerOverlay::before,
.ruler-active #rulerOverlay::after { content:''; position:absolute; left:0; top:0; right:0; bottom:0; }
/* Horizontal ruler at top */
.ruler-active #rulerOverlay::before { height:8mm; background: repeating-linear-gradient(to right, transparent 0, transparent 4mm, rgba(0,0,0,0.15) 4mm, rgba(0,0,0,0.15) 4.2mm); border-bottom:1px solid rgba(0,0,0,0.2); }
/* Vertical ruler at left */
.ruler-active #rulerOverlay::after { width:8mm; background: repeating-linear-gradient(to bottom, transparent 0, transparent 4mm, rgba(0,0,0,0.15) 4mm, rgba(0,0,0,0.15) 4.2mm); border-right:1px solid rgba(0,0,0,0.2); }

/* Typography scaling per preset (applied via inline vars fallback) */
.preset-ticket90 { --ticket-title-size:10pt; --ticket-body-size:8pt; }
.preset-ticket100 { --ticket-title-size:11pt; --ticket-body-size:8.5pt; }
.preset-flipFront { --ticket-title-size:11pt; --ticket-body-size:9pt; }
.preset-flipBack { --ticket-title-size:11pt; --ticket-body-size:9pt; }
.preset-tray6030 { --ticket-title-size:9pt; --ticket-body-size:7pt; }
.preset-a4single { --ticket-title-size:16pt; --ticket-body-size:10pt; }
.preset-a4grid { --ticket-title-size:10pt; --ticket-body-size:8pt; }

/* A4 Grid entries */
.a4grid-entry .ticket-card { padding: 3mm; }
.a4grid-entry .ticket-images img { object-fit: contain; background:#fff; border:0.2mm solid #ddd; border-radius: 1mm; }
.a4grid-entry .a4grid-text .ticket-refs { margin-top: 0.5mm; }

/* Full text overlay (screen only, non-printing) */
.fulltext-overlay.hidden { display: none; }
.simplified .tickets-page { position: relative; }
@page { size: A4 portrait; margin:12mm; }

/* Simplified v1 Ticket 100x50 Fold 5x5 */
.v1-ticket-card { position: relative; width:100mm; height:50mm; padding:2mm; box-sizing:border-box; font-family: "Libre Baskerville", Georgia, "Times New Roman", serif; display:flex; flex-direction:row; color:#222; }
/* Reserved heights and spacing */
.v1-ticket-card { --front-title-h: 12mm; --front-sub-h: 5.5mm; --front-mint-h: 5.5mm; --front-auth-h: 5.5mm; --front-specs-h: 4.5mm; --front-gap: 1mm; --back-desc-h: 28mm; --back-refs-h: 5mm; }
.v1-front, .v1-back { width:50mm; height:100%; display:flex; flex-direction:column; box-sizing:border-box; }
.v1-front { padding-right:2mm; }
.v1-back { padding-left:2mm; }
.v1-front-top, .v1-front-bottom, .v1-back-top, .v1-back-bottom { width:100%; }
/* Anchor bottom groups to the bottom; keep top groups at the top */
.v1-front-bottom, .v1-back-bottom { margin-top:auto; }
/* Optional fold guide (screen only, not printed) */
@media screen { .v1-ticket-card::after { content:""; position:absolute; left:50mm; top:2mm; bottom:2mm; width:0; border-left:0.1mm solid rgba(0,0,0,0.15); } }
.v1-title { font-size:10pt; font-variant:small-caps; letter-spacing:0.02em; font-weight:600; line-height:1.35; display:-webkit-box; -webkit-line-clamp:3; line-clamp: 3; -webkit-box-orient:vertical; overflow:hidden; height: calc(3 * 1.35em); }
.v1-subline { font-size:9pt; line-height:1.35; font-style:italic; white-space:normal; overflow:hidden; height: 1.35em; }
.v1-mint { font-size:9pt; line-height:1.35; white-space:normal; overflow:hidden; height: 1.35em; }
.v1-auth { font-size:8.5pt; line-height:1.35; white-space:normal; overflow:hidden; height: 1.35em; }
.v1-specs { font-size:8.5pt; line-height:1.35; padding-top:2mm; border-top:0.15mm solid rgba(0,0,0,0.15); white-space:normal; height: calc(1.35em + 2mm); }
.v1-specs.no-divider { border-top: none; }
.v1-desc { position:relative; font-size:8.5pt; line-height:1.35; color:#222; white-space:normal; overflow:hidden; max-height: calc(9 * 1.35em); }
.v1-refs { font-size:7pt; line-height:1.2; color:#666; }

/* Row positioning */
.v1-page-inner { position:relative; width:186mm; height:273mm; margin:0 auto; }
.v1-row { position:absolute; left:0; width:100%; display:flex; justify-content:center; }

/* Fade clamp for long back description (after ~6 lines) */
.v1-desc.fade:after { content:""; position:absolute; left:0; right:0; bottom:0; height:6mm; background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1)); pointer-events:none; }

/* Cut marks: L-shape corners outside trim */
.cut-mark { position:absolute; width:0; height:0; }
.cut-mark[data-pos="tl"]::before, .cut-mark[data-pos="tr"]::before, .cut-mark[data-pos="bl"]::before, .cut-mark[data-pos="br"]::before,
.cut-mark[data-pos="tl"]::after, .cut-mark[data-pos="tr"]::after, .cut-mark[data-pos="bl"]::after, .cut-mark[data-pos="br"]::after {
    content:""; position:absolute; background:#999; }
.cut-mark[data-pos="tl"]::before { width:3mm; height:0.2mm; left:-1mm; top:-1mm; }
.cut-mark[data-pos="tl"]::after { width:0.2mm; height:3mm; left:-1mm; top:-1mm; }
.cut-mark[data-pos="tr"]::before { width:3mm; height:0.2mm; right:-1mm; top:-1mm; }
.cut-mark[data-pos="tr"]::after { width:0.2mm; height:3mm; right:-1mm; top:-1mm; }
.cut-mark[data-pos="bl"]::before { width:3mm; height:0.2mm; left:-1mm; bottom:-1mm; }
.cut-mark[data-pos="bl"]::after { width:0.2mm; height:3mm; left:-1mm; bottom:-1mm; }
.cut-mark[data-pos="br"]::before { width:3mm; height:0.2mm; right:-1mm; bottom:-1mm; }
.cut-mark[data-pos="br"]::after { width:0.2mm; height:3mm; right:-1mm; bottom:-1mm; }

@media print {
    .tickets-actions, .tickets-toolbar-title select, #presetSelect { display:none !important; }
}
.fulltext-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); display: flex; align-items: center; justify-content: center; z-index: 999; }
.fulltext-dialog { background: #fff; color: #111; width: min(720px, 92vw); max-height: 80vh; overflow: auto; border-radius: 8px; box-shadow: var(--shadow-hover); }
.fulltext-header { display:flex; align-items:center; justify-content: space-between; padding: 0.75rem 1rem; border-bottom: 1px solid #eee; position: sticky; top:0; background:#fff; }
.fulltext-dialog pre { margin: 0; padding: 1rem; white-space: pre-wrap; font: 12px/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

@media print {
    .fulltext-overlay, .fulltext-btn { display: none !important; }
}

/* Optional per-card button if we later add it; keep style ready */
.fulltext-btn { position: absolute; right: 2mm; top: 2mm; font-size: 10px; padding: 2px 6px; border-radius: 6px; background: rgba(0,0,0,0.08); color: #222; display: inline-block; cursor: pointer; }

/* Ticket cards */
.ticket-wrap { position: relative; width: var(--ticket-card-w); height: var(--ticket-card-h); }
.ticket-card {
    width: var(--ticket-card-w);
    height: var(--ticket-card-h);
    box-sizing: border-box;
    border: 0.3mm solid #bbb;
    border-radius: 3mm;
    padding: 3mm; /* equal padding for easy math */
    display: flex;
    flex-direction: column;
    gap: 2mm;
    font-family: Arial, Helvetica, sans-serif;
    overflow: hidden;
    position: relative;
}
.ticket-images { display: flex; gap: 2mm; height: var(--ticket-image-h); }
.ticket-images img { flex: 1 1 50%; height: 100%; object-fit: contain; border: 0.2mm solid #ddd; background:#fff; }
.ticket-title { font-weight: 700; font-size: var(--ticket-title-size); line-height: 1.15; max-height: calc(2 * 1.15em); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; }
.ticket-specs { font-size: var(--ticket-body-size); color: #333; list-style: none; height: var(--ticket-specs-h); overflow: hidden; }
.ticket-specs li { line-height: 1.2; }
.ticket-refs { font-size: var(--ticket-body-size); color: #333; margin-top: 0.5mm; max-height: calc(2 * 1.2em); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; }

/* Never show scrollbars for ticket text containers, even when clamp is off */
@media screen {
    .tickets-page:not(.clamp-text) .ticket-specs { overflow: hidden; }
}

/* Clamping */
/* clamp-text now redundant for title/refs, kept for future body clamp variations */

/* Flip 2×2: enforce single-line fields and truncation */
.flip-card .ticket-title { -webkit-line-clamp: 1; line-clamp: 1; max-height: 1.25em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.flip-card .line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.2; }
.flip-card .ticket-specs { height: auto; padding: 0; margin: 0; }
.flip-card .ticket-refs { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-height: 1.25em; }

/* Cut guides */
.tickets-page.cut-guides { position: relative; }
.tickets-page.cut-guides .with-marks { position: relative; }
.tickets-page.cut-guides .cut-mark { position: absolute; width: 0; height: 0; }
.tickets-page.cut-guides .cut-mark::before,
.tickets-page.cut-guides .cut-mark::after { content: ''; position: absolute; background: #000; }
/* 3mm ticks, 0.2mm thick, exactly at trim (no offset) */
.tickets-page.cut-guides .cut-mark[data-pos="tl"]::before { width: 3mm; height: 0.2mm; left: -3mm; top: 0; }
.tickets-page.cut-guides .cut-mark[data-pos="tl"]::after  { width: 0.2mm; height: 3mm; left: 0; top: -3mm; }
.tickets-page.cut-guides .cut-mark[data-pos="tr"]::before { width: 3mm; height: 0.2mm; left: 0; top: 0; }
.tickets-page.cut-guides .cut-mark[data-pos="tr"]::after  { width: 0.2mm; height: 3mm; left: 0; top: -3mm; }
.tickets-page.cut-guides .cut-mark[data-pos="bl"]::before { width: 3mm; height: 0.2mm; left: -3mm; top: 0; }
.tickets-page.cut-guides .cut-mark[data-pos="bl"]::after  { width: 0.2mm; height: 3mm; left: 0; top: 0; }
.tickets-page.cut-guides .cut-mark[data-pos="br"]::before { width: 3mm; height: 0.2mm; left: 0; top: 0; }
.tickets-page.cut-guides .cut-mark[data-pos="br"]::after  { width: 0.2mm; height: 3mm; left: 0; top: 0; }

/* Size presets (card physical size approximations) */
.tickets-size-small .ticket-card { width: 90mm; height: 50mm; }
.tickets-size-medium .ticket-card { width: 95mm; height: 55mm; }
.tickets-size-large .ticket-card { width: 100mm; height: 60mm; }

/* Image rail option: when off, reclaim space and slightly bump body size */
.images-off .ticket-images { display: none !important; }
.images-off .ticket-card { gap: 1.2mm; }
.images-off { --ticket-image-h: 0mm; --ticket-specs-h: 28mm; }
.images-off.preset-ticket90 { --ticket-body-size: 8.5pt; }
.images-off.preset-ticket100 { --ticket-body-size: 9pt; }

/* Layout presets */
.tickets-layout-2x5 { display:grid; grid-template-columns: repeat(2, var(--ticket-card-w)); grid-auto-rows: var(--ticket-card-h); gap: var(--ticket-gutter); }
.tickets-layout-3x3 { display:grid; grid-template-columns: repeat(3, var(--ticket-card-w)); grid-auto-rows: var(--ticket-card-h); gap: var(--ticket-gutter); }
.tickets-layout-3x4 { display:grid; grid-template-columns: repeat(3, var(--ticket-card-w)); grid-auto-rows: var(--ticket-card-h); gap: var(--ticket-gutter); }
.tickets-layout-4x3 { display:grid; grid-template-columns: repeat(4, var(--ticket-card-w)); grid-auto-rows: var(--ticket-card-h); gap: var(--ticket-gutter); }

/* Auto-fit grid will assign custom template columns inline; ensure gap variable applies */
.tickets-grid[style*="grid-template-columns"] { gap: var(--ticket-gutter); }

/* Ruler overlay base element hidden by default */
#rulerOverlay { display:none; }
.preset-desc { font-size:0.75rem; color:#666; margin-top:0.25rem; max-width:520px; line-height:1.2; }
.preset-desc strong { color:#222; }

/* Compare Mode */
.compare-overlay { position: fixed; inset:0; background: rgba(0,0,0,0.65); z-index:1500; display:flex; align-items:center; justify-content:center; }
.compare-overlay.hidden { display:none; }
.compare-panel { background:#fff; width:100%; max-width:1400px; margin:1.5% auto; border-radius:12px; box-shadow: var(--shadow-hover); display:flex; flex-direction:column; max-height:92vh; }
.compare-toolbar { display:flex; flex-wrap:wrap; gap:0.5rem; align-items:center; justify-content:space-between; padding:0.75rem 1rem; border-bottom:1px solid var(--border-color); background:#fff; position:sticky; top:0; z-index:2; }
.compare-title { font-weight:600; color:#2c3e50; }
.compare-tools { display:flex; gap:0.5rem; flex-wrap:wrap; }
.compare-body { padding:1rem; display:flex; flex-direction:column; gap:1.5rem; overflow-y:auto; }
.compare-images { display:grid; grid-template-columns:1fr 1fr; gap:1rem; align-items:start; }
.compare-side { background:#f8fafc; border:1px solid #e2e8f0; border-radius:10px; padding:0.75rem; display:flex; flex-direction:column; gap:0.5rem; position:relative; }
.compare-side.dark-bg { background:#111; }
.compare-image-wrap { position:relative; width:100%; padding-top:100%; background:#ececec; border:1px solid #d1d5db; border-radius:10px; overflow:hidden; cursor:grab; }
.compare-image-wrap img { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) scale(1); max-width:100%; max-height:100%; object-fit:contain; transition:transform 0.05s linear; }
.compare-replace { display:flex; gap:0.5rem; align-items:center; font-size:0.8rem; }
.compare-replace select { flex:1; padding:0.35rem 0.5rem; font-size:0.85rem; }
.compare-table-wrap { background:#f9fafb; border:1px solid #e2e8f0; border-radius:10px; padding:1rem; }
.compare-table-wrap h3 { margin:0 0 0.75rem; font-size:1.05rem; color:#374151; }
.compare-table { width:100%; border-collapse:collapse; font-size:0.9rem; }
.compare-table th, .compare-table td { padding:0.5rem 0.6rem; border-bottom:1px solid #e5e7eb; vertical-align:top; }
.compare-table th { text-align:left; font-weight:600; color:#111827; background:#fff; position:sticky; top:0; }
.compare-table tr:last-child td { border-bottom:0; }
.compare-table .diff-high { background:#fff7ed; box-shadow:inset 0 0 0 9999px rgba(253,230,138,0.25); }
.compare-table .cell-label { font-weight:600; width:160px; }
.compare-meter { font-weight:600; }
.compare-meter.low { color:#dc2626; }
.compare-meter.medium { color:#d97706; }
.compare-meter.high { color:#16a34a; }
.compare-panel.fullscreen { position:fixed; inset:0; width:100%; height:100%; max-width:none; margin:0; border-radius:0; }
.compare-panel.fullscreen .compare-body { max-height:calc(100vh - 56px); }
@media (max-width: 1100px){ .compare-images { grid-template-columns:1fr; } }
@media (max-width: 640px){ .compare-toolbar { flex-direction:column; align-items:flex-start; } }

/* Compare View Modes removed: Compare shows unmodified images */

/* Museum Mode */
.museum-overlay { position: fixed; inset:0; z-index:1700; overflow: auto; overflow-x: hidden; }
.museum-overlay.hidden { display:none; }
.museum-stage { position:relative; min-height:100vh; background:#101010; display:flex; flex-direction:column; }
.museum-layout { position:relative; flex:1; display:flex; align-items:center; justify-content:center; padding:40px 40px 160px; width:98vw; max-width:98vw; margin:0 auto; }
@media (min-width:1920px){ .museum-layout { padding:60px 60px 180px; } }
.museum-panel { width:100%; display:flex; flex-direction:column; align-items:center; gap:36px; padding:32px; border-radius:28px; min-height: clamp(640px, 82vh, 1600px); position:relative; overflow:hidden; }
@media (min-width:768px){ .museum-panel { flex-direction:row; align-items:center; gap:52px; padding:40px; } }
@media (min-width:1200px){ .museum-panel { gap:64px; padding:46px; } }
/* Refined breakpoint: 1920–2559px pull plaque closer to imagery */
@media (min-width:1920px) and (max-width:2559px){ .museum-panel { gap:40px; padding:52px 56px 52px 48px; } .museum-plaque { padding-right:28px; } }
/* Ultra-wide (≥2560 incl. 4K) keep generous gap */
@media (min-width:2560px){ .museum-panel { gap:72px; padding:60px 80px 60px 60px; } .museum-plaque { padding-right:0; } }
.museum-panel.panel-white { background:#faf9f7; }
.museum-panel.panel-grey { background:#f3f3f3; }
.museum-panel.panel-black { background:#0b0b0b; }
/* Subtle paper texture + vignette */
.museum-panel.panel-white::before,
.museum-panel.panel-grey::before { content:""; position:absolute; inset:0; pointer-events:none; background:
    radial-gradient(circle at 50% 55%, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0.02) 55%, rgba(0,0,0,0) 75%) ,
    repeating-linear-gradient(45deg, rgba(0,0,0,0.015) 0, rgba(0,0,0,0.015) 2px, transparent 2px, transparent 4px);
    mix-blend-mode:multiply; opacity:0.55; }
.museum-panel.panel-white::after,
.museum-panel.panel-grey::after { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at center, rgba(255,255,255,0) 55%, rgba(0,0,0,0.04) 95%); opacity:0.35; }
.museum-coin-panel { position:relative; flex:1 1 0; display:flex; align-items:center; justify-content:center; min-height:clamp(560px, 78vh, 1800px); overflow:hidden; padding-bottom:142px; }
@media (min-width:1200px){ .museum-coin-panel { flex: 0 0 64%; } .museum-plaque { flex: 0 0 36%; } }
@media (min-width:1920px) and (max-width:2559px){ .museum-coin-panel { flex: 0 0 52%; padding-bottom:180px; } .museum-plaque { flex: 0 0 48%; } }
@media (min-width:2560px){ .museum-coin-panel { flex: 0 0 60%; } .museum-plaque { flex: 0 0 40%; } }
.museum-img-wrap { position:relative; width:100%; height:100%; min-height:360px; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.museum-img-wrap::before { content:""; position:absolute; width:80%; max-width:1300px; height:64%; max-height:720px; border-radius:50%; filter: blur(28px); opacity:0.22; pointer-events:none; }
.museum-panel.panel-white .museum-img-wrap::before { background: radial-gradient(ellipse at center, rgba(0,0,0,0.18) 0%, rgba(0,0,0,0.10) 40%, rgba(0,0,0,0.05) 70%, rgba(0,0,0,0) 85%); }
.museum-panel.panel-grey  .museum-img-wrap::before { background: radial-gradient(ellipse at center, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.14) 45%, rgba(0,0,0,0.08) 70%, rgba(0,0,0,0) 85%); }
.museum-panel.panel-black .museum-img-wrap::before { background: radial-gradient(ellipse at center, rgba(255,255,255,0.16) 0%, rgba(255,255,255,0.10) 45%, rgba(255,255,255,0.05) 70%, rgba(255,255,255,0) 85%); opacity:0.18; }
.museum-img { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); max-width: 96%; max-height: 82vh; object-fit:contain; opacity:0; transition:opacity 600ms ease; filter: drop-shadow(0 14px 28px rgba(0,0,0,0.18)); }
.museum-img.visible { opacity:1; }
@media (min-width:1920px) and (max-width:2559px){
    .museum-img { max-width:64%; max-height:55vh; top:48%; }
    .museum-img-wrap::before { width:54%; height:46%; max-width:820px; }
}
@media (min-width:2560px){
    .museum-img { max-width:66%; max-height:60vh; }
    .museum-img-wrap::before { width:58%; height:48%; max-width:1180px; }
}
.museum-face-caption { position:absolute; left:50%; bottom:34px; transform:translateX(-50%); text-align:left; background:transparent; color:#1c1c1c; padding:0; width:min(92vw, 620px); font-family:"Constantia", Georgia, serif; pointer-events:none; }
.museum-panel.panel-black .museum-face-caption { color:#f5f5f5; }
.museum-face-caption .face-label { font-size:0.8rem; letter-spacing:0.24em; text-transform:uppercase; margin-bottom:8px; display:block; opacity:0.7; border-top:1px solid rgba(0,0,0,0.12); padding-top:10px; }
.museum-panel.panel-black .museum-face-caption .face-label { border-top-color:rgba(255,255,255,0.25); }
.museum-face-caption .face-text { font-size: clamp(1.12rem, 0.8vw + 0.35rem, 1.45rem); line-height:1.6; color:inherit; padding:0; margin:0; font-style:italic; }
@media (prefers-reduced-motion:no-preference){ .museum-face-caption .face-text { transition:color 150ms ease; } }
@media (max-width:640px){ .museum-face-caption { bottom:18px; width:90vw; } }
.museum-plaque { position:relative; flex:1 1 50%; pointer-events:none; max-width:1000px; width:100%; text-align:center; align-self:center; padding: clamp(18px, 2.5vw, 48px) clamp(14px, 2vw, 40px); display:flex; flex-direction:column; gap:0.65rem; }
.museum-plaque .m-line { overflow-wrap:anywhere; word-break:break-word; }
@media (min-width:768px){ .museum-plaque { text-align:left; align-items:flex-start; } }
.museum-plaque .m-heading { width:100%; display:flex; flex-direction:column; gap:0.4rem; }
@media (max-width:767px){ .museum-plaque .m-heading { align-items:center; } }
.museum-plaque .m-line { line-height:1.32; }
/* Collection label */
/* Collection label repositioned inward */
.museum-plaque .m-collection-label { align-self:flex-start; font-family:"Constantia", Georgia, serif; font-size:0.75rem; letter-spacing:0.28em; font-weight:600; color:#6b6b6b; opacity:0.9; text-transform:uppercase; }
@media (max-width:767px){ .museum-plaque .m-collection-label { align-self:center; } }
@media (min-width:1920px){ .museum-plaque .m-collection-label { font-size:0.85rem; } }
/* Hero Title */
.museum-plaque .m-name { font-family:"Constantia", Georgia, serif; font-size: clamp(2.75rem, 2.2vw + 0.5rem, 4.5rem); font-weight:600; margin:0; letter-spacing:-0.5px; line-height:1.05; }
/* Horizontal rule */
.museum-plaque .m-rule { width:28%; max-width:180px; height:0.5px; background:rgba(0,0,0,0.10); margin:8px 0 4px; }
/* Subtitle (Date • Mint) */
.museum-plaque .m-meta { font-family:"Constantia", Georgia, serif; font-size: clamp(1.35rem, 1.25vw + 0.4rem, 2.15rem); font-weight:400; font-style:italic; color:#4a4a4a; letter-spacing:0.02em; margin:0 0 18px; line-height:1.15; }
/* Metadata grouped lines */
.museum-plaque .m-info-group { margin:0 0 18px; }
.museum-plaque .m-info-line { font-family:"Constantia", Georgia, serif; font-size: clamp(1.125rem, 0.65vw + 0.55rem, 1.5rem); font-weight:400; color:#666; line-height:1.25; }
.museum-plaque .m-info-line + .m-info-line { margin-top:4px; }
/* Description paragraph */
.museum-plaque .m-desc { font-family:"Constantia", Georgia, serif; font-size: clamp(1.15rem, 0.75vw + 0.6rem, 1.65rem); margin:0 0 18px; color:#333; line-height:1.62; max-width:560px; }
.museum-plaque .m-desc p { margin:0; hanging-punctuation:first; text-indent:0; }
/* Notes (OBV / REV) */
.museum-plaque .m-notes { max-width:560px; margin:0; }
@media (min-width:1920px){
    .museum-plaque .m-desc,
    .museum-plaque .m-notes { max-width:640px; }
}
@media (min-width:2560px){
    .museum-plaque .m-desc,
    .museum-plaque .m-notes { max-width:760px; }
}
.museum-plaque .m-note-line { font-family:"Constantia", Georgia, serif; font-size: clamp(0.95rem, 0.45vw + 0.55rem, 1.125rem); color:#777; font-variant:small-caps; line-height:1.35; }
.museum-plaque .m-note-line + .m-note-line { margin-top:6px; }
/* Panel color-dependent text adjustments */
.museum-panel.panel-white .museum-plaque { color:#1e1e1e; }
.museum-panel.panel-grey  .museum-plaque { color:#161616; }
.museum-panel.panel-black .museum-plaque { color:#eaeaea; }
/* Optical vertical alignment tweak */
@media (min-width:1200px){ .museum-coin-panel { transform:translateY(2%); } .museum-plaque { transform:translateY(-2%); } }
.museum-panel.panel-white .museum-plaque { color:#1a1a1a; }
.museum-panel.panel-grey  .museum-plaque { color:#141414; }
.museum-panel.panel-black .museum-plaque { color:#eaeaea; }
.museum-toolbar { position:fixed; left:50%; transform:translateX(-50%); bottom:16px; display:flex; gap:8px; align-items:center; background:rgba(17,17,17,0.65); color:#fff; padding:6px 10px; border-radius:999px; opacity:0; transition:opacity 200ms ease; }
.museum-panel.panel-white ~ .museum-toolbar { background:rgba(20,20,20,0.7); color:#fff; }
.museum-panel.panel-grey  ~ .museum-toolbar { background:rgba(20,20,20,0.7); color:#fff; }
.museum-panel.panel-black ~ .museum-toolbar { background:rgba(240,240,240,0.18); color:#f5f5f5; }
.museum-stage.show-controls .museum-toolbar { opacity:1; }
.museum-toolbar .inline-ctrl { display:inline-flex; align-items:center; gap:6px; font-size:0.9rem; }
.museum-toolbar select { padding:2px 6px; font-size:0.9rem; }
.museum-toolbar .btn-secondary { padding:4px 8px; font-size:0.85rem; }
/* Structured References */
.structured-refs-list { display:flex; flex-direction:column; gap:6px; margin-top:0.6rem; }
.structured-ref-item { display:flex; align-items:center; justify-content:space-between; gap:0.75rem; padding:6px 10px; border:1px solid #e2e8f0; background:#fff; border-radius:8px; font-size:0.85rem; }
.structured-ref-main { display:flex; flex-direction:column; gap:2px; }
.structured-ref-label { font-weight:600; color:#1f2937; letter-spacing:.02em; }
.structured-ref-meta { font-size:0.7rem; color:#64748b; display:flex; gap:0.5rem; align-items:center; flex-wrap:wrap; }
.structured-ref-links a { font-size:0.7rem; color:#2563eb; text-decoration:none; }
.structured-ref-links a:hover { text-decoration:underline; }
.structured-ref-remove { background:#f43f5e; color:#fff; border:none; padding:4px 8px; font-size:0.7rem; border-radius:6px; cursor:pointer; }
.structured-ref-remove:hover { background:#e11d48; }
.structured-ref-form.hidden { display:none; }
.structured-ref-chip { display:inline-block; background:#f1f5f9; color:#334155; border:1px solid #cbd5e1; font-size:0.65rem; padding:2px 6px; border-radius:999px; letter-spacing:.04em; text-transform:uppercase; }

/* OCRE Type Details examples */
.examples { margin-top: 6px; }
.examples-label { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: #6b7280; margin-bottom: 6px; }
.examples-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.ex-thumb { display: inline-block; width: 72px; height: 72px; border-radius: 8px; overflow: hidden; border: 1px solid #e5e7eb; background: #f8fafc; box-shadow: var(--coin-shadow-sm); }
.ex-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.examples-more { margin-top: 6px; }
/* ==== Layout & Button Refinements (appended) ==== */
.essentials-row { margin-top:16px; display:flex; flex-direction:column; gap:12px; }
.essentials-card .essentials-dl { display:grid; grid-template-columns: repeat(auto-fit,minmax(160px,1fr)); gap:12px 24px; }
@media (max-width:640px){ .essentials-card .essentials-dl { grid-template-columns:1fr; gap:8px 12px; } }
.btn-sm { padding:4px 8px !important; font-size:11px !important; line-height:1.2; }
.legend-sources .legend-desc { font-size:11px; color:#6b7280; margin-left:4px; }
/* Collapsible headers */
.collapsible .collapse-body { transition: height .25s ease, opacity .25s ease; }
.card.collapsible h3 { cursor:pointer; position:relative; }
.collapsible-head { display:flex; align-items:center; gap:6px; cursor:pointer; }
.caret { width:10px; height:10px; display:inline-block; border-right:2px solid #555; border-bottom:2px solid #555; transform:rotate(45deg); transition:transform .25s ease; margin-right:4px; }
.card.collapsed .caret { transform:rotate(-45deg); }
.card.collapsed .collapse-body { display:none; }
/* Typography improvements */
.dl dt { font-size:10px; letter-spacing:.08em; font-weight:600; text-transform:uppercase; color:#64748b; }
.dl dd { font-size:15px; line-height:1.5; color:#111827; }
.type-details-dl dt { color:#475569; }
.type-details-dl dd { font-size:14px; }
/* Card spacing polish */
.card h3 { margin-bottom:12px; }
.card .dl + .dl { margin-top:10px; }
.ruler-desc { margin-top:6px; }
.modal-header { margin-bottom:1.25rem; }
.card { padding:22px 30px; }
/* Bio relations under ruler card */
.bio-section { margin-top:10px; display:flex; flex-direction:column; gap:6px; }
.bio-row { display:flex; gap:10px; align-items:flex-start; flex-wrap:wrap; }
.bio-label { font-size:11px; color:#6b7280; text-transform:uppercase; letter-spacing:.06em; min-width:92px; }
.bio-chips { display:flex; gap:6px; flex-wrap:wrap; }
.bio-chip { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; border:1px solid #e5e7eb; background:#fff; color:#374151; font-size:12px; cursor:pointer; }
.bio-chip:hover { background:#f9fafb; }
.bio-facts { margin:8px 0 12px; padding:8px 12px; background:#f1f5f9; border:1px solid #e2e8f0; border-radius:10px; }
.bio-facts-head { font-size:11px; font-weight:600; letter-spacing:.06em; color:#475569; text-transform:uppercase; margin-bottom:6px; }
[data-theme="dark"] .bio-facts { background:#1f2937; border-color:#334155; }
[data-theme="dark"] .bio-facts-head { color:#cbd5e1; }
/* Provide extra horizontal breathing room for textual context cards only (exclude media tools) */
.image-tools-card { padding:0; }
.conflict-card { border:1px solid #fbbf24; background:linear-gradient(120deg,#fffbe6,#fff8d1); }
.conflict-card h3 { color:#92400e; }
.badge-warning { display:inline-block; background:#f59e0b; color:#fff; font-size:10px; padding:2px 6px; border-radius:999px; letter-spacing:.05em; text-transform:uppercase; margin-left:6px; }
.conflict-intro { font-size:12px; margin:0 0 8px; color:#92400e; }
.conflict-list { margin:0 0 8px 1rem; padding:0; font-size:12px; }
.conflict-list li { list-style:disc; margin:2px 0 2px 4px; }
.conflict-note { font-size:11px; color:#b45309; }
/* Gentle spacing above bottom legend and conflicts */
.legend-sources { margin-top: 20px; }
.conflict-card { margin-top: 20px; }
