:root {
  --bg: #0c0c0d;
  --paper: #f3f1ec;
  --ink: #1a1814;
  --chrome: #e8e4dc;
  --copper: #c45c4a;
  --mute: #8a857c;
  --gold1: #e8c56a;
  --gold2: #b8892b;
  --gold3: #7a5618;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  background: var(--bg);
  color: var(--chrome);
  padding: 24px 16px 64px;
}
.hidden { display: none !important; }
.top { text-align: center; margin-bottom: 28px; }
.eyebrow { letter-spacing: .28em; text-transform: uppercase; font-size: 11px; color: var(--copper); }
h1 { font-weight: 400; font-size: 28px; margin: 8px 0; }
.sub, .hint, .tiny, .status { font-family: system-ui, sans-serif; }
.sub { color: var(--mute); margin: 0; }
.install-btn { margin-top: 14px; }
.panel { border: 1px solid #2a2a2c; padding: 16px; margin-bottom: 16px; }
h2 { font-size: 16px; font-weight: 400; margin: 0 0 10px; }
label { display: block; font-family: system-ui, sans-serif; font-size: 13px; color: var(--mute); margin: 10px 0; }
input, select, textarea {
  width: 100%; margin-top: 6px; padding: 10px; background: #161618; color: var(--chrome);
  border: 1px solid #333; font-size: 15px;
}
textarea { min-height: 200px; font-family: ui-monospace, Menlo, monospace; font-size: 13px; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
button, .file-btn, .install-btn {
  font-family: system-ui, sans-serif; border: 0; padding: 12px 14px;
  background: var(--copper); color: #fff; cursor: pointer;
}
.ghost { background: transparent; color: var(--chrome); border: 1px solid #444; width: 100%; margin-top: 8px; }
button:disabled { opacity: .4; }
#preview { width: 100%; margin-top: 12px; max-height: 220px; object-fit: contain; background: #111; }
.exhibit { padding: 0; margin-bottom: 16px; }
.plaque { background: var(--paper); color: var(--ink); padding: 16px; }
.plaque h3 { margin: 8px 0 6px; font-size: 22px; }
.meta { font-family: system-ui, sans-serif; font-size: 12px; color: #5c5850; text-transform: uppercase; letter-spacing: .1em; }
.desc { font-size: 16px; line-height: 1.4; margin: 8px 0; }
.score { border-top: 1px solid #d7d2c8; padding-top: 10px; font-family: system-ui, sans-serif; font-size: 13px; }
.gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.card { cursor: pointer; }
.card p { margin: 8px 0 0; font-size: 13px; text-align: center; }
.open-mini { font-size: 12px; padding: 8px; }
.row { display: flex; justify-content: space-between; align-items: baseline; }
.status, .tiny, .hint { font-size: 13px; color: var(--mute); }

.gold-frame {
  position: relative;
  background:
    repeating-linear-gradient(90deg, #c4962e 0 2px, #e6c35c 2px 4px, #8a6218 4px 6px),
    linear-gradient(145deg, #f0d78a, #b8892b 40%, #6e4e14);
  padding: 16px;
  box-shadow:
    inset 0 0 0 2px #5c4010,
    inset 0 0 0 5px #e8c86a,
    inset 0 0 0 7px #8a6218,
    inset 0 0 0 10px #d4af37,
    inset 0 0 0 12px #5c4010,
    0 10px 22px #0008;
  border: 10px solid #c9a034;
  border-image: linear-gradient(145deg, #f3de8a, #8a5a14 35%, #e6c35c 70%, #6a4810) 1;
}
.gold-frame::before {
  content: "";
  position: absolute;
  inset: 8px;
  border: 2px dotted #6e4e14;
  pointer-events: none;
}
.gold-frame img {
  width: 100%;
  display: block;
  object-fit: cover;
  aspect-ratio: 3 / 4;
  background: #111;
  position: relative;
  z-index: 1;
}
.lightbox { position: fixed; inset: 0; background: #0c0c0de6; z-index: 40; overflow: auto; padding: 16px; }
.lb-inner { max-width: 520px; margin: 48px auto 12px; }
.lb-inner .gold-frame img { max-height: 52vh; object-fit: contain; aspect-ratio: auto; }

.lb-actions { max-width: 520px; margin: 0 auto 32px; clear: both; }

.artist-label { display: block; margin: 0 0 12px; font-family: system-ui, sans-serif; font-size: 13px; color: var(--mute); }
.artist-label input { width: 100%; margin-top: 6px; padding: 10px; background: #161618; color: var(--chrome); border: 1px solid #333; font-size: 15px; }
.exhibit-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.close-exhibit, .close-lb {
  font-family: system-ui, sans-serif; border: 0; padding: 12px 16px;
  background: var(--copper); color: #fff; cursor: pointer; border-radius: 4px; z-index: 50;
}
.close-lb { position: fixed; top: max(12px, env(safe-area-inset-top)); right: 12px; box-shadow: 0 4px 16px #0008; }
.exhibit-hint { font-family: system-ui, sans-serif; font-size: 12px; color: var(--mute); }
.exhibit-body { cursor: pointer; }

.store-link{margin:.35rem 0 0;text-align:center}
.store-link a{color:#c4a35a;font-size:.85rem;text-decoration:underline;text-underline-offset:2px}
.store-link a:hover{color:#e0c57a}
.card-actions{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.45rem}
.card-actions .ghost{flex:1;min-width:7rem}
button.danger, .ghost.danger{color:#e8b4b4;border-color:#6a3030}
button.danger:hover, .ghost.danger:hover{background:#3a1818;color:#ffd0d0}

.actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:stretch}
.file-btn.ghost-file{background:transparent;border:1px solid #c4a35a;color:#c4a35a}
.file-btn.ghost-file:hover{background:rgba(196,163,90,.12)}
