:root{
  --paper:#F3EDDD; --paper-deep:#EAE0C6; --card:#FFFDF7;
  --ink:#2B2417; --ink-soft:#6B6250;
  --forest:#1F3D2E; --forest-deep:#12241A; --forest-mid:#2C5140;
  --brass:#A9832E; --brass-light:#C9A227; --brass-pale:#F1E4BE;
  --rule:#DED0A8;
  --danger:#A83A2C; --ok:#3E6B4C;
  --sidebar:#16261D; --sidebar-soft:#20342A;
  --shadow:0 1px 2px rgba(20,30,20,0.08), 0 10px 30px rgba(20,30,20,0.10);
  --radius:14px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%; text-size-adjust:100%;}
body{margin:0; background:var(--paper); color:var(--ink); font-family:'Inter',sans-serif; -webkit-font-smoothing:antialiased;}
h1,h2,h3,.display{font-family:'Fraunces',Georgia,serif; color:var(--forest); letter-spacing:-0.01em; margin:0;}
.mono{font-family:'JetBrains Mono',monospace;}
/* Fraunces carries no ē / ū / ḍ, and the browser's substitute leaves the marks
   floating off to the side. Noto Serif draws them and matches closely enough
   that a single letter swapped mid-word is invisible. */
.mac{font-family:'Noto Serif',Georgia,'Times New Roman',serif;}
a{color:inherit; text-decoration:none;}
button{font-family:inherit; cursor:pointer;}
/* photographs are the collection's own material: no dragging out of the page,
   no long-press "save image". (A web page cannot stop a screenshot.) */
img{max-width:100%; display:block; -webkit-user-drag:none; user-select:none; -webkit-touch-callout:none;}
:focus-visible{outline:2px solid var(--brass); outline-offset:2px;}
.wrap{max-width:1180px; margin:0 auto; padding:0 60px;}

/* ---------- Top nav (public) ---------- */
.pub-nav{position:sticky; top:0; z-index:50; background:rgba(243,237,221,0.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--rule);}
.pub-nav-inner{max-width:1180px; margin:0 auto; padding:14px 24px; display:flex; align-items:center; gap:28px;}
.brand{font-family:'Fraunces',Georgia,serif; font-weight:700; font-size:17px; color:var(--forest); display:flex; align-items:center; gap:8px; cursor:pointer;}
.brand .brand-mark{width:26px; height:26px; border-radius:50%; background:var(--forest); display:flex; align-items:center; justify-content:center;}
.pub-links{display:flex; gap:22px; flex:1; flex-wrap:wrap;}
.pub-links a{font-size:13.5px; font-weight:600; color:var(--ink-soft); cursor:pointer;}
.pub-links a:hover, .pub-links a.active{color:var(--forest);}
.nav-search{border:1.5px solid var(--rule); background:var(--card); border-radius:999px; padding:8px 14px; font-size:13px; width:180px;}
.admin-link{font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--brass); border:1px solid var(--brass); padding:7px 14px; border-radius:999px; cursor:pointer;}

/* ---------- Buttons ---------- */
.btn{display:inline-flex; align-items:center; gap:8px; border:none; border-radius:999px; font-weight:600; font-size:14px; transition:all .15s ease;}
.btn-primary{background:var(--brass-light); color:#241C04; padding:14px 28px; box-shadow:0 6px 18px rgba(201,162,39,.35);}
.btn-primary:hover{transform:translateY(-1px);}
.btn-outline{background:transparent; border:1.5px solid var(--rule); color:var(--forest); padding:12px 22px;}
.btn-outline:hover{border-color:var(--brass);}
.btn-sm{padding:8px 14px; font-size:12.5px; border-radius:8px;}
.btn-dark{background:var(--forest); color:#fff; padding:12px 24px;}
.btn-danger-outline{background:none; border:1.5px solid var(--danger); color:var(--danger);}

/* ---------- Announcement banner (sits above the sticky nav) ---------- */
.top-banner{background:linear-gradient(90deg, var(--forest-deep) 0%, #1B3427 50%, var(--forest-deep) 100%); color:#C6D3C8; border-bottom:1px solid rgba(241,228,190,.14);}
.tb-inner{max-width:1180px; margin:0 auto; padding:9px 24px; display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; font-size:12.5px; line-height:1.5; text-align:center;}
.tb-inner strong{color:var(--brass-pale); font-weight:700;}
.tb-dot{width:6px; height:6px; border-radius:50%; background:var(--brass-light); box-shadow:0 0 0 3px rgba(201,162,39,.18); flex:0 0 auto;}
.tb-link{color:#F1E4BE; font-weight:700; white-space:nowrap; border-bottom:1px solid rgba(241,228,190,.4); padding-bottom:1px;}
.tb-link:hover{border-bottom-color:var(--brass-light);}

/* ---------- Museum Hero ---------- */
/* The photograph behind the hero is a darkened triptych built from objects in
   the collection (see img/hero.jpg); the gradients on top keep the text legible
   whatever the crop. */
.museum-hero{
  position:relative; overflow:hidden; color:#fff; padding:96px 24px 104px; text-align:center;
  background-color:var(--forest-deep);
  background-image:
    linear-gradient(180deg, rgba(16,32,23,.42) 0%, rgba(17,34,25,.58) 45%, rgba(18,36,26,.86) 100%),
    radial-gradient(62% 74% at 50% 46%, rgba(12,24,18,.55) 0%, rgba(12,24,18,0) 78%),
    radial-gradient(80% 95% at 50% 6%, rgba(201,162,39,.16) 0%, rgba(201,162,39,0) 62%),
    url('../img/hero.jpg');
  background-size:cover; background-position:center; background-repeat:no-repeat;
}
.museum-hero::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    repeating-linear-gradient(115deg, rgba(255,255,255,.022) 0 2px, transparent 2px 40px),
    repeating-linear-gradient(25deg, rgba(0,0,0,.05) 0 3px, transparent 3px 26px);
}
.museum-hero::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1px; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(201,162,39,.55), transparent);
}
.museum-hero-inner{position:relative; z-index:2; max-width:800px; margin:0 auto;}

.museum-hero .eyebrow{display:inline-flex; align-items:center; gap:clamp(10px,2vw,20px); font-size:clamp(22px,4.6vw,46px); line-height:1.1; letter-spacing:.14em; text-transform:uppercase; color:var(--brass-light); font-weight:700; margin-bottom:22px; max-width:100%;}
.museum-hero .eb-rule{flex:0 0 auto; width:clamp(18px,5vw,64px); height:2px; background:rgba(201,162,39,.65);}
.museum-hero h1{color:#fff; font-size:clamp(36px,5.4vw,60px); line-height:1.05; margin:0 0 12px; text-shadow:0 3px 30px rgba(0,0,0,.5);}
.museum-hero .hero-native{font-family:'Noto Sans Kannada','Noto Serif',serif; font-size:clamp(21px,2.6vw,29px); line-height:1.5; color:var(--brass-light); letter-spacing:.03em; margin:0 0 14px; text-shadow:0 2px 16px rgba(0,0,0,.45);}
.museum-hero .sub2{font-family:'Fraunces',Georgia,serif; font-style:italic; font-size:19px; color:#DCCF9F; margin-bottom:20px;}
.museum-hero p.desc{font-size:15.5px; color:#DCE5DD; line-height:1.7; max-width:560px; margin:0 auto 34px; text-shadow:0 2px 14px rgba(0,0,0,.4);}
.museum-hero p.desc em{color:var(--brass-pale); font-style:italic;}
.hero-btns{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}
.hero-btns .btn svg{width:16px; height:16px;}
.btn-ghost{background:rgba(255,255,255,.08); border:1.5px solid rgba(241,228,190,.36); color:#F1E4BE; padding:12.5px 24px; backdrop-filter:blur(3px);}
.btn-ghost:hover{background:rgba(255,255,255,.15); border-color:var(--brass-light);}

.stat-strip{display:flex; justify-content:center; flex-wrap:wrap; row-gap:16px; width:fit-content; margin:48px auto 0; padding-top:24px; border-top:1px solid rgba(241,228,190,.2);}
.stat-strip .s{padding:0 30px; border-right:1px solid rgba(241,228,190,.16);}
.stat-strip .s:last-child{border-right:none;}
.stat-strip .s b{display:block; font-family:'Fraunces',Georgia,serif; font-size:27px; line-height:1.1; color:var(--brass-light);}
.stat-strip .s span{font-size:11px; color:#C6D2C8; text-transform:uppercase; letter-spacing:.09em;}

.section[id]{scroll-margin-top:88px;}

@media (max-width:960px){
  .museum-hero{padding:70px 24px 92px; background-attachment:scroll;}
}
@media (max-width:640px){
  .museum-hero{padding:56px 20px 84px;}
  .stat-strip .s{padding:0 18px;}
  .gr-label{display:none;}
  .gr-inner{padding:12px 14px;}
  /* brand + curator link on one row, search on its own — otherwise the fixed
     180px search box pushes the whole page into a sideways scroll */
  .pub-nav-inner{flex-wrap:wrap; gap:12px; padding:12px 16px;}
  .brand{font-size:15px; flex:1 1 auto;}
  .nav-search{order:3; width:100%; flex:1 1 100%;}
  .admin-link{padding:6px 11px; font-size:11px;}
  .wrap{padding:0 22px;}
}

/* ---------- Section titles ---------- */
.section{padding:64px 0;}
.section-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:28px; gap:20px; flex-wrap:wrap;}
.section-head h2{font-size:28px;}
.section-head .eyebrow-sm{font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--brass); font-weight:700; margin-bottom:6px; display:block;}
.section-head p{color:var(--ink-soft); font-size:14px; max-width:50ch; margin:6px 0 0;}
.view-all{font-size:13px; font-weight:700; color:var(--forest); border-bottom:2px solid var(--brass-light); padding-bottom:2px; cursor:pointer;}

/* ---------- Gallery cards ---------- */
/* five to a row on the desktop grid, stepping down as the page narrows */
.gallery-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:16px;}
@media (max-width:1150px){ .gallery-grid{grid-template-columns:repeat(4,1fr);} }
@media (max-width:900px){ .gallery-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:660px){ .gallery-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:420px){ .gallery-grid{grid-template-columns:1fr;} }
.gallery-card{background:var(--card); border:1px solid var(--rule); border-radius:16px; padding:22px 20px; cursor:pointer; transition:all .18s ease; box-shadow:var(--shadow);}
.gallery-card:hover{transform:translateY(-3px); border-color:var(--brass);}
.gallery-card .g-icon{font-size:26px; margin-bottom:14px;}
.gallery-card .g-name{font-family:'Fraunces',Georgia,serif; font-size:16px; color:var(--forest); font-weight:600; margin-bottom:4px;}
.gallery-card .g-count{font-size:12px; color:var(--ink-soft);}

/* ---------- Artifact cards ---------- */
.artifact-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:22px;}
.artifact-card{background:var(--card); border:1px solid var(--rule); border-radius:16px; overflow:hidden; cursor:pointer; box-shadow:var(--shadow); transition:transform .18s ease;}
.artifact-card:hover{transform:translateY(-3px);}
.artifact-card .a-img{width:100%; height:160px; object-fit:cover; background:linear-gradient(135deg,#DED0A8,#EFE6CB);}
.artifact-card .a-img-placeholder{width:100%; height:160px; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#E4D8B4,#F1E8CC); color:var(--brass); font-size:30px;}
.artifact-card .a-body{padding:16px 18px;}
.artifact-card .a-kname{font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--brass); font-weight:700; margin-bottom:4px;}
.artifact-card .a-name{font-family:'Fraunces',Georgia,serif; font-size:17px; color:var(--forest); font-weight:600; margin-bottom:6px;}
.artifact-card .a-desc{font-size:12.5px; color:var(--ink-soft); line-height:1.5; margin-bottom:10px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.artifact-card .a-meta{display:flex; justify-content:space-between; align-items:center; font-size:11px; color:var(--ink-soft);}
.badge{display:inline-flex; align-items:center; gap:4px; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:4px 9px; border-radius:999px;}
.badge-verified{background:#E4EEE6; color:var(--ok);}
.badge-unverified{background:#F1E8D2; color:var(--brass);}
.badge-draft{background:#EDE4D0; color:var(--ink-soft);}
.badge-review{background:#FDEBD3; color:#9A6320;}
.badge-published{background:#DCEEE0; color:var(--ok);}
.badge-archived{background:#EAE3D3; color:var(--ink-soft);}
.badge-featured{background:var(--forest); color:#fff;}

.empty-state{text-align:center; padding:60px 20px; color:var(--ink-soft);}
.empty-state svg{width:36px; height:36px; margin-bottom:14px; color:var(--brass);}

/* ---------- Search / filter bar ---------- */
.filter-bar{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:28px; align-items:center;}
.filter-bar select, .filter-bar input[type=text]{border:1.5px solid var(--rule); background:var(--card); border-radius:10px; padding:10px 14px; font-size:13.5px; color:var(--ink);}
.filter-bar input[type=text]{flex:1; min-width:180px;}
.filter-chip{padding:8px 16px; border-radius:999px; border:1.5px solid var(--rule); background:var(--card); font-size:12.5px; font-weight:600; color:var(--ink-soft); cursor:pointer;}
.filter-chip.active{background:var(--forest); color:#fff; border-color:var(--forest);}

/* ---------- Artifact detail page ---------- */
/* the object hero drops the 1180px cap so the photograph and the custodian card
   still use most of the screen — but it keeps side gutters, otherwise the
   photograph bleeds into the window edge and reads as oversized */
.detail-hero{background:var(--forest-deep); padding:14px 0 0;}
/* wide, but not edge-to-edge on a 27" monitor — past ~1560px the row just
   stretched the photograph and the card away from each other */
.detail-hero > .wrap{max-width:1560px; padding:0 60px;}
@media (max-width:860px){
  .detail-hero > .wrap{padding:0 22px;}
}
.detail-crumb{color:#B9C5BC; font-size:12.5px; padding:18px 0 0;}
.detail-crumb a{color:#D9CFA6; font-weight:600; cursor:pointer;} .detail-crumb a:hover{text-decoration:underline;}
/* the photograph takes the larger share; the custodian card rides in the
   narrow column and is scaled to fit it (see .cb-fit) */
.detail-grid{display:grid; grid-template-columns:1.2fr 0.8fr; gap:34px; padding:16px 0 48px;}
@media (max-width:860px){.detail-grid{grid-template-columns:1fr;}}
/* 3/2 rather than 4/3, plus a hard cap: on a wide monitor a 4/3 box was ~900px
   tall and the photograph swallowed the whole screen */
/* filmstrip on the left, photograph on the right */
.detail-media{display:flex; align-items:flex-start; gap:14px;}

/* The photograph is never cropped: the stage is a transparent flex box and the
   image keeps its own aspect ratio inside it, capped at 470px tall. `cover` in a
   fixed 3/2 box used to slice the top and bottom off every landscape photo. */
.detail-media-main{position:relative; flex:1 1 auto; min-width:0; display:flex; align-items:center; justify-content:center; color:var(--brass); font-size:44px;}
/* the frame shrink-wraps the photograph and clips it, so the zoomed image cannot
   spill over the dark hero around it */
.dm-frame{position:relative; max-width:100%; overflow:hidden; line-height:0; border-radius:16px; border:1px solid rgba(228,211,160,.28); box-shadow:0 20px 44px rgba(0,0,0,.38); cursor:zoom-in; touch-action:manipulation;}
.dm-frame img{display:block; width:auto; height:auto; max-width:100%; max-height:470px; transform-origin:center center; transition:transform .3s cubic-bezier(.2,.7,.3,1); will-change:transform;}
.dm-frame.is-zoomed{cursor:zoom-out;}
.dm-frame.is-zoomed img{transition:transform .1s linear;}
/* the affordance sits on the photograph itself */
.dm-frame::after{content:'⤢  Click to zoom'; position:absolute; right:14px; bottom:14px; padding:7px 13px; border-radius:999px; background:rgba(10,22,15,.72); border:1px solid rgba(228,211,160,.3); color:#F1E4BE; font-size:11.5px; line-height:1.2; letter-spacing:.06em; opacity:0; transform:translateY(4px); transition:opacity .18s ease, transform .18s ease; pointer-events:none;}
.dm-frame:hover::after, .dm-frame:focus-visible::after{opacity:1; transform:none;}
.dm-frame.is-zoomed::after{content:'⤢  Click to reset'; opacity:1; transform:none;}
@media (hover:none){ .dm-frame::after{opacity:.9; transform:none;} }
/* objects with no photograph yet keep the cream panel */
.detail-media-main.is-empty{aspect-ratio:3/2; max-height:470px; background:linear-gradient(135deg,#DED0A8,#F1E8CC); border-radius:16px;}

.detail-thumbs{display:flex; flex-direction:column; gap:10px; flex:0 0 auto;}
.detail-thumbs img{width:72px; height:72px; object-fit:contain; padding:4px; background:linear-gradient(135deg,#DED0A8,#F1E8CC); border-radius:10px; cursor:pointer; border:2px solid transparent; transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease;}
.detail-thumbs img:hover{transform:translateY(-2px); box-shadow:0 8px 18px rgba(0,0,0,.28);}
.detail-thumbs img.active{border-color:var(--brass); box-shadow:0 0 0 3px rgba(201,162,39,.2);}
/* on a phone the strip goes back under the photograph — 72px of thumbnails on
   the left would eat a fifth of the screen */
@media (max-width:560px){
  .detail-media{flex-direction:column-reverse; gap:12px;}
  .detail-thumbs{flex-direction:row; flex-wrap:wrap; justify-content:center; width:100%;}
  .detail-thumbs img{width:62px; height:62px;}
}

/* The frame hugs the photograph — no letterboxing above and below it. Both
   columns land on roughly the same line because the custodian card is trimmed to
   the photograph's height instead of the photograph being stretched to the card. */
@media (min-width:861px){
  .detail-grid{align-items:start;}
  .detail-grid > :first-child{display:flex; flex-direction:column;}
}
.verified-tag{display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:700; color:var(--ok); background:#EAF3EC; padding:6px 12px; border-radius:999px; margin-top:14px;}

.detail-head{color:#fff;}
.detail-head .kname{font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--brass-light); font-weight:700; margin-bottom:8px;}
.detail-head h1{color:#fff; font-size:clamp(30px,2.6vw,44px); line-height:1.08; letter-spacing:-.01em; margin-bottom:6px;}
.detail-head .ename{font-family:'Fraunces',Georgia,serif; font-style:italic; color:#CBD6CE; font-size:16px; margin-bottom:16px;}
.pron-btn{display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.2); color:#fff; padding:9px 16px; border-radius:999px; font-size:12.5px; font-weight:600; margin-bottom:6px; cursor:pointer;}
.pron-btn:hover{background:rgba(255,255,255,.16);}
.pron-btn.playing{background:var(--brass-pale,#EFE6CC); border-color:var(--brass,#C9A227); color:#3A2E0B;}

.museum-body{background:var(--paper);}
.exhibit-section{padding:34px 0; border-bottom:1px solid var(--rule);}
.exhibit-section:last-child{border-bottom:none;}
.exhibit-label{font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--brass); font-weight:700; margin-bottom:12px;}
.exhibit-section h3{font-size:19px; margin-bottom:10px;}
.exhibit-section p{color:var(--ink); font-size:14.5px; line-height:1.7; margin:0 0 8px;}
.exhibit-two{display:grid; grid-template-columns:1fr 1fr; gap:30px;}
@media (max-width:700px){.exhibit-two{grid-template-columns:1fr;}}
.info-list{display:flex; flex-direction:column; gap:10px; font-size:13.5px;}
.info-list .il-row{display:flex; justify-content:space-between; border-bottom:1px dashed var(--rule); padding-bottom:8px; gap:16px;}
.info-list .il-k{color:var(--ink-soft); font-weight:600;}
.info-list .il-v{text-align:right; color:var(--ink); font-weight:500;}
.tag-pill{display:inline-block; background:var(--brass-pale); color:#6E5218; font-size:11.5px; font-weight:700; padding:5px 12px; border-radius:999px; margin:0 6px 6px 0;}

.oral-card{background:var(--card); border:1px solid var(--rule); border-radius:14px; padding:18px 20px; margin-bottom:14px;}
.oral-card .oc-top{display:flex; justify-content:space-between; font-size:12.5px; color:var(--ink-soft); margin-bottom:10px;}
.oral-card .oc-top strong{color:var(--forest);}
.oral-card .oc-transcript{font-family:'Fraunces',Georgia,serif; font-style:italic; font-size:14.5px; color:var(--ink); line-height:1.65;}
.audio-fake{display:flex; align-items:center; gap:10px; background:var(--paper-deep); border-radius:999px; padding:8px 14px; margin-top:10px; font-size:12px; color:var(--ink-soft);}

.source-box{background:var(--paper-deep); border-radius:12px; padding:16px 18px; font-size:12.5px; color:var(--ink-soft); line-height:1.6;}
.source-box strong{color:var(--forest);}

.related-strip{display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:14px;}

/* ---------- Public footer ---------- */
.pub-footer{background:var(--forest-deep); color:#B9C5BC; padding:40px 24px; text-align:center; font-size:12.5px;}

/* ============================================================
   ADMIN
   ============================================================ */
.admin-shell{display:flex; min-height:100vh; background:#EFE9D8;}
.admin-sidebar{width:230px; background:var(--sidebar); color:#CBD6CE; flex-shrink:0; padding:22px 0; display:flex; flex-direction:column;}
.admin-sidebar .as-brand{font-family:'Fraunces',Georgia,serif; font-weight:700; color:#fff; font-size:16px; padding:0 22px 22px; border-bottom:1px solid var(--sidebar-soft); margin-bottom:14px; cursor:pointer;}
.admin-sidebar .as-brand small{display:block; font-family:'Inter'; font-weight:500; color:#8FA396; font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; margin-top:3px;}
.as-link{padding:11px 22px; font-size:13.5px; font-weight:600; color:#AEBBAF; cursor:pointer; border-left:3px solid transparent; display:flex; align-items:center; gap:10px;}
.as-link:hover{color:#fff; background:var(--sidebar-soft);}
.as-link.active{color:#fff; background:var(--sidebar-soft); border-left-color:var(--brass-light);}
.as-sect{font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#6E8175; padding:18px 22px 6px;}
.as-foot{margin-top:auto; padding:16px 22px 4px; font-size:12px; color:#7C8E80;}

.admin-main{flex:1; min-width:0;}
.admin-topbar{background:#fff; border-bottom:1px solid var(--rule); padding:16px 30px; display:flex; justify-content:space-between; align-items:center;}
.admin-topbar h2{font-size:19px;}
.admin-content{padding:28px 30px 60px;}

.stat-cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:16px; margin-bottom:32px;}
.stat-card{background:#fff; border:1px solid var(--rule); border-radius:14px; padding:20px;}
.stat-card b{display:block; font-family:'Fraunces',Georgia,serif; font-size:30px; color:var(--forest);}
.stat-card span{font-size:11.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); font-weight:600;}

.admin-table{width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--rule); border-radius:12px; overflow:hidden;}
.admin-table th{text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft); background:var(--paper-deep); padding:12px 14px; font-weight:700;}
.admin-table td{padding:12px 14px; font-size:13.5px; border-top:1px solid var(--rule); vertical-align:middle;}
.admin-table tr:hover td{background:#FAF6EA;}
.row-actions{display:flex; gap:6px; flex-wrap:wrap;}
.icon-btn{background:none; border:1px solid var(--rule); border-radius:7px; padding:5px 9px; font-size:11.5px; color:var(--ink-soft); cursor:pointer;}
.icon-btn:hover{border-color:var(--brass); color:var(--forest);}
.icon-btn.danger{color:var(--danger); border-color:#E3C7C1;}
.table-scroll{overflow-x:auto;}

.login-wrap{max-width:380px; margin:14vh auto; background:#fff; border-radius:18px; box-shadow:var(--shadow); padding:38px 34px; text-align:center;}
.login-wrap .lock{width:46px; height:46px; border-radius:50%; background:var(--forest); display:flex; align-items:center; justify-content:center; margin:0 auto 18px;}
.login-wrap h2{font-size:20px; margin-bottom:6px;}
.login-wrap p{color:var(--ink-soft); font-size:13px; margin-bottom:22px;}
.login-wrap input{width:100%; padding:13px 14px; border:1.5px solid var(--rule); border-radius:10px; font-size:14px; margin-bottom:14px;}
.login-note{margin-top:16px; font-size:11.5px; color:var(--ink-soft); background:var(--brass-pale); padding:10px 12px; border-radius:8px; text-align:left; line-height:1.5;}

.form-section{background:#fff; border:1px solid var(--rule); border-radius:14px; padding:24px 26px; margin-bottom:22px;}
.form-section h3{font-size:14px; text-transform:uppercase; letter-spacing:.05em; color:var(--brass); margin-bottom:18px;}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px 18px;}
.form-grid .full{grid-column:1/-1;}
@media (max-width:700px){.form-grid{grid-template-columns:1fr;}}
.afield{display:flex; flex-direction:column; gap:6px;}
.afield label{font-size:12.5px; font-weight:600; color:var(--ink);}
.afield input, .afield select, .afield textarea{border:1.5px solid var(--rule); border-radius:9px; padding:11px 12px; font-size:13.5px; font-family:inherit; background:#FEFDF9;}
.afield textarea{min-height:90px; resize:vertical; line-height:1.5;}
.afield input:focus, .afield select:focus, .afield textarea:focus{border-color:var(--brass);}
.afield-hint{font-size:11.5px; color:var(--ink-soft);}
.afield small{font-size:11.5px; color:var(--ink-soft); line-height:1.45;}
.afield-check{display:flex; align-items:flex-start; gap:9px; font-size:13px; color:var(--ink); line-height:1.5;}
.afield-check input{margin-top:2px;}

/* ---- Offline contribution panel (Curator Desk → Custodians) -------------- */
.offline-panel{background:#fff; border:1px solid var(--rule); border-radius:14px; margin-bottom:18px; overflow:hidden;}
.offline-panel[open]{border-color:var(--brass);}
.offline-panel > summary{display:flex; align-items:center; gap:10px; padding:15px 20px; cursor:pointer; font-size:14px; font-weight:700; color:var(--forest); list-style:none;}
.offline-panel > summary::-webkit-details-marker{display:none;}
.offline-panel > summary em{font-style:normal; font-weight:500; font-size:12.5px; color:var(--ink-soft);}
.offline-panel > summary:hover{background:#FBF7EA;}
.offline-plus{display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:var(--brass-pale); color:#5F4B14; font-size:15px; line-height:1;}
.offline-panel[open] .offline-plus{transform:rotate(45deg);}
.offline-panel > form{padding:4px 20px 20px; border-top:1px solid var(--rule);}
.offline-panel > form > .form-grid{margin:16px 0 18px;}

.chip-select{display:flex; flex-wrap:wrap; gap:8px;}
.chip-select .cs{padding:8px 14px; border-radius:999px; border:1.5px solid var(--rule); font-size:12.5px; font-weight:600; cursor:pointer; color:var(--ink-soft); background:#FEFDF9;}
.chip-select .cs.active{background:var(--forest); color:#fff; border-color:var(--forest);}

.admin-upload{border:2px dashed var(--rule); border-radius:12px; padding:26px; text-align:center; cursor:pointer; background:var(--paper-deep); margin-bottom:14px;}
.admin-upload.drag{border-color:var(--brass);}
.admin-img-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:12px;}
.admin-img-card{border:1px solid var(--rule); border-radius:10px; overflow:hidden; background:#fff;}
.admin-img-card img{width:100%; height:90px; object-fit:cover;}
.admin-img-card .aic-body{padding:6px 8px;}
.admin-img-card input{width:100%; border:none; border-bottom:1px solid var(--rule); font-size:11px; padding:3px 0; margin-bottom:3px;}
.admin-img-card button{font-size:10.5px; color:var(--danger); background:none; border:none; cursor:pointer; padding:0;}

.mini-record{border:1.5px solid var(--rule); border-radius:12px; padding:16px 18px; margin-bottom:12px; position:relative; background:#FEFDF9;}
.mini-record .mr-remove{position:absolute; top:12px; right:12px; font-size:11px; color:var(--danger); background:none; border:none; cursor:pointer;}
.add-mini{width:100%; padding:12px; border-radius:10px; border:1.5px dashed var(--brass); background:var(--brass-pale); color:#6E5218; font-weight:600; font-size:13px; margin-top:4px;}

.status-bar{display:flex; justify-content:space-between; align-items:center; background:#fff; border:1px solid var(--rule); border-radius:14px; padding:16px 20px; margin-bottom:22px; flex-wrap:wrap; gap:12px;}
.status-bar .sb-actions{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}

.toast{position:fixed; bottom:24px; right:24px; background:var(--forest); color:#fff; padding:13px 20px; border-radius:10px; font-size:13px; font-weight:600; box-shadow:var(--shadow); z-index:100; opacity:0; transform:translateY(8px); transition:all .25s ease;}
.toast.show{opacity:1; transform:translateY(0);}

.loading-screen{padding:120px 20px; text-align:center; color:var(--ink-soft); font-size:14px;}

@media (max-width:820px){
  .admin-shell{flex-direction:column;}
  .admin-sidebar{width:100%; flex-direction:row; overflow-x:auto; padding:12px;}
  .admin-sidebar .as-brand{display:none;}
  .as-sect{display:none;}
  .as-link{white-space:nowrap; border-left:none; border-bottom:3px solid transparent;}
  .as-link.active{border-left:none; border-bottom-color:var(--brass-light);}
  .as-foot{display:none;}
  .pub-links{display:none;}
}
@media (prefers-reduced-motion: reduce){
  *{transition:none !important; animation:none !important;}
  html{scroll-behavior:auto;}
}

/* ============================================================
   Server-rendered additions (Laravel build)
   ============================================================ */
.flash{border-radius:12px; padding:13px 16px; font-size:13.5px; margin-bottom:20px; line-height:1.5;}
.flash-ok{background:#E4EEE6; border:1px solid #BFDCC7; color:#2E5A3C;}
.flash-err{background:#F8E3DF; border:1px solid #E7C1BA; color:#8C2F22;}
.flash ul{margin:6px 0 0; padding-left:18px;}

a.artifact-card{display:block; color:inherit;}
a.gallery-card{display:block; color:inherit;}

/* pagination (Laravel default markup) */
nav[role="navigation"] .flex{display:flex; gap:6px; flex-wrap:wrap; align-items:center;}
nav[role="navigation"] svg{width:16px; height:16px;}
nav[role="navigation"] a, nav[role="navigation"] span[aria-current], nav[role="navigation"] span{
  display:inline-flex; align-items:center; justify-content:center; min-width:34px; height:34px; padding:0 10px;
  border:1px solid var(--rule); background:var(--card); border-radius:9px; font-size:13px; font-weight:600; color:var(--ink-soft);}
nav[role="navigation"] a:hover{border-color:var(--brass); color:var(--forest);}
nav[role="navigation"] span[aria-current] span{border:0; background:var(--forest); color:#fff; border-radius:9px;}
nav[role="navigation"] p.text-sm{font-size:12.5px; color:var(--ink-soft); margin:0 0 8px;}
nav[role="navigation"] .hidden{display:none;}

/* login extras */
.login-wrap .field-err{color:var(--danger); font-size:12px; text-align:left; margin:-8px 0 12px;}
.login-wrap label.remember{display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--ink-soft); margin-bottom:16px; text-align:left;}
.login-wrap label.remember input{width:auto; margin:0;}

/* admin tables */
.admin-table td .muted{color:var(--ink-soft); font-size:11.5px;}
.inline-form{display:inline;}
.admin-grid-2{display:grid; grid-template-columns:1.4fr 1fr; gap:24px; align-items:start;}
@media (max-width:1000px){.admin-grid-2{grid-template-columns:1fr;}}
.panel{background:#fff; border:1px solid var(--rule); border-radius:14px; padding:20px 22px; margin-bottom:20px;}
.panel h3{font-size:15px; margin-bottom:14px;}
.panel .afield{margin-bottom:12px;}

/* The nav search must sit in the flex row exactly as it did in the prototype;
   the surrounding <form> is only there to make Enter submit. */
.pub-nav-inner form{display:contents;}

/* ============================================================
   Custodian banner — the "Help preserve this piece" block that
   sits under the hero on every object page.
   ============================================================ */
.custodian-wrap{background:var(--paper); padding:34px 0 6px;}
.custodian-banner{--cb-gold:#B08D3F; --cb-gold-soft:#D9C48A; --cb-green:#1E4B37;}
.cb-card{position:relative; background:#FBF3E3; border:1.6px solid var(--cb-gold); border-radius:4px; padding:30px 36px 32px; max-width:920px; margin:0 auto;}
/* the second, thinner rule inside the border — the two together read as an
   engraved certificate frame, and the corner ornaments sit on the inner one */
.cb-card::after{content:''; position:absolute; inset:14px; border:1px solid rgba(176,141,63,.55); pointer-events:none;}
.cb-corner{position:absolute; width:34px; height:34px; z-index:2; line-height:0;}
.cb-corner svg{width:100%; height:100%;}
.cb-corner.cb-tl{top:14px; left:14px;}
.cb-corner.cb-tr{top:14px; right:14px; transform:scaleX(-1);}
.cb-corner.cb-bl{bottom:14px; left:14px; transform:scaleY(-1);}
.cb-corner.cb-br{bottom:14px; right:14px; transform:scale(-1,-1);}

.cb-head{display:grid; grid-template-columns:190px 1fr 190px; gap:18px; align-items:center; position:relative; z-index:1;}
.cb-crest{text-align:center;}
.cb-logo{width:140px; max-width:100%; height:auto; margin:0 auto 10px;}
.cb-seal-name{font-family:'Fraunces',serif; font-size:12px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--cb-green); line-height:1.45;}
.cb-crest-rule{position:relative; width:92px; height:1px; background:var(--cb-gold-soft); margin:14px auto 0;}
.cb-crest-rule span{position:absolute; left:50%; top:50%; width:8px; height:8px; background:var(--cb-gold); transform:translate(-50%,-50%) rotate(45deg);}

.cb-title{text-align:center;}
.cb-flourish svg{width:min(230px,80%); height:auto; display:block; margin:0 auto;}
.cb-flourish-sm svg{width:min(170px,64%);}
.cb-title h2{font-family:'Fraunces',serif; font-size:clamp(24px,3.4vw,42px); font-weight:600; line-height:1.04; letter-spacing:.015em; text-transform:uppercase; color:var(--cb-green); margin:11px 0 3px;}
.cb-title h3{font-family:'Fraunces',serif; font-size:clamp(13px,1.8vw,21px); line-height:1.2; letter-spacing:.02em; text-transform:uppercase; color:#C79A2B; font-weight:600; margin:0 0 10px;}
.cb-house{text-align:right;}
.cb-house svg{width:100%; max-width:170px; height:auto; opacity:.92;}

.cb-lede{position:relative; z-index:1; text-align:center; font-family:'Fraunces',serif; font-size:clamp(13px,1.1vw,15.5px); line-height:1.75; color:#3B3020; margin:20px 0 22px;}
.cb-lede strong{font-weight:700; color:var(--cb-green);}

.cb-offer{position:relative; z-index:1; display:grid; grid-template-columns:1fr 1.15fr 1fr; align-items:center; width:min(100%,660px); margin:0 auto; border:1.4px solid var(--cb-gold-soft); border-radius:14px;}
.cb-offer-cell{padding:18px 16px;}
.cb-offer-cell + .cb-offer-cell{border-left:1px solid var(--cb-gold-soft);}
.cb-offer-note{display:flex; flex-direction:column; align-items:center; gap:9px; text-align:center;}
.cb-offer-note strong{font-family:'Fraunces',serif; font-size:12px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--cb-green); line-height:1.5;}
.cb-ico{display:inline-flex; align-items:center; justify-content:center;}
.cb-ico svg{width:38px; height:38px;}
.cb-offer-price{text-align:center;}
.cb-price{font-family:'Fraunces',serif; font-size:clamp(28px,3.6vw,44px); font-weight:600; line-height:1.05; color:var(--cb-green);}
.cb-price-sub{font-family:'Fraunces',serif; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:#6B5C3E; margin-top:6px;}
.cb-offer-cta{text-align:center;}
.cb-btn{display:inline-flex; align-items:center; justify-content:center; width:100%; max-width:200px; padding:12px 18px; border:none; border-radius:5px; background:linear-gradient(#B08420,#8E6712); color:#FFF7E2; font-family:'Fraunces',serif; font-size:13px; letter-spacing:.07em; text-transform:uppercase; box-shadow:0 4px 14px rgba(143,108,33,.3); transition:transform .15s ease, box-shadow .15s ease;}
.cb-btn:hover{transform:translateY(-1px); box-shadow:0 7px 20px rgba(143,108,33,.42);}

/* ---- The public roll of custodians (/custodians) ------------------------- */
.roll-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
@media (max-width:1050px){ .roll-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .roll-grid{grid-template-columns:1fr;} }
.roll-card{display:flex; gap:16px; align-items:center; background:var(--card); border:1px solid var(--rule); border-radius:14px; padding:14px; transition:border-color .15s ease, transform .15s ease, box-shadow .15s ease;}
.roll-card:hover{border-color:var(--brass); transform:translateY(-2px); box-shadow:0 10px 24px rgba(0,0,0,.08);}
.roll-thumb{flex:0 0 auto; width:78px; height:78px; border-radius:10px; overflow:hidden; background:linear-gradient(135deg,#DED0A8,#F1E8CC); display:flex; align-items:center; justify-content:center; color:var(--brass); font-size:26px;}
.roll-thumb img{width:100%; height:100%; object-fit:cover;}
.roll-body{min-width:0;}
.roll-label{font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--brass); font-weight:700;}
.roll-name{font-family:'Fraunces',Georgia,serif; font-size:19px; color:var(--forest); line-height:1.25; margin:3px 0 5px;}
.roll-object{font-size:13.5px; color:var(--ink-soft); line-height:1.4;}
.roll-object a{color:var(--forest); font-weight:600; border-bottom:1px solid var(--rule);}
.roll-object a:hover{border-bottom-color:var(--brass);}
.roll-meta{margin-top:7px; font-size:11.5px; color:var(--ink-soft);}
.roll-dot{margin:0 6px; color:var(--brass);}
.roll-note{margin-top:18px; font-size:13px; color:var(--ink-soft); font-style:italic;}

/* ---- The certificate as it appears on a taken object's page ----------------
   The certificate is a fixed 1000px document — it cannot reflow into a 560px
   column without falling apart, so it is scaled down as a whole. `zoom` (not
   transform) because zoom reflows: the surrounding grid still reserves the right
   height for it. It is a preview of a document, not body copy. */
.cert-mini{margin-top:20px;}
.cert-mini-eyebrow{font-size:11.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--brass-light); font-weight:700; margin-bottom:10px;}
/* the scale is chosen so the card ends on the photograph's bottom line: the mini
   document lays out ~500px tall, and the photograph leaves ~240px below the
   heading block, hence .48 */
/* text-size-adjust is the important one on a phone: Chrome's text autosizing
   inflates the scaled-down type inside the card, which pushed "Acquired on" and
   "Land of origin" onto two lines and broke the plaque's alignment. */
.cert-mini-doc{overflow:hidden; zoom:.48; -webkit-text-size-adjust:100%; text-size-adjust:100%;}
.cert-mini-doc .cert-card{margin:0 auto; box-shadow:0 16px 36px rgba(0,0,0,.32);}
@media (max-width:1240px){ .cert-mini-doc{zoom:.4;} }
/* below 860 the page is one column, so the card gets the full page width — each
   step is sized for the narrowest viewport in its band, hence the odd numbers */
@media (max-width:860px){ .cert-mini-doc{zoom:.70;} }
@media (max-width:760px){ .cert-mini-doc{zoom:.60;} }
@media (max-width:660px){ .cert-mini-doc{zoom:.50;} }
@media (max-width:560px){ .cert-mini-doc{zoom:.43;} }
@media (max-width:480px){ .cert-mini-doc{zoom:.37;} }
@media (max-width:420px){ .cert-mini-doc{zoom:.32;} }

.cert-taken{margin-top:20px; background:rgba(255,255,255,.05); border:1px solid rgba(228,211,160,.28); border-radius:14px; padding:20px 22px;}
.cert-taken p{margin:0; font-size:13.5px; line-height:1.65; color:#CBD6CE;}

@media (max-width:1000px){
  .cb-card{padding:26px 22px 28px;}
  .cb-head{grid-template-columns:1fr; gap:6px; text-align:center;}
  .cb-house{display:none;}
  .cb-offer{grid-template-columns:1fr;}
  .cb-offer-cell + .cb-offer-cell{border-left:none; border-top:1px solid var(--cb-gold-soft);}
  .cb-offer-cell{padding:22px 20px;}
}
@media (max-width:560px){
  .cb-card{padding:22px 15px 24px;}
  .cb-card::after{inset:8px;}
  .cb-corner{width:24px; height:24px;}
  .cb-corner.cb-tl,.cb-corner.cb-tr{top:8px;} .cb-corner.cb-bl,.cb-corner.cb-br{bottom:8px;}
  .cb-corner.cb-tl,.cb-corner.cb-bl{left:8px;} .cb-corner.cb-tr,.cb-corner.cb-br{right:8px;}
  .cb-logo{width:118px;}
  .cb-lede{margin:16px 0 18px;}
  .cb-btn{max-width:none;}
}

/* ---- Fitted variant -----------------------------------------------------
   The banner as it appears in the object page's right-hand column, beside the
   photograph. Everything here is a real size — an earlier version scaled the
   wide card down with `zoom`, which shrank the body copy to about 9px. */
.cb-fit{margin-top:20px;}
.cb-fit .cb-card{width:100%; max-width:none; padding:18px 22px 20px; box-shadow:0 16px 36px rgba(0,0,0,.3);}
.cb-fit .cb-corner{width:22px; height:22px;}
/* crest beside the headline, not above it — stacking them cost ~100px of height
   and pushed the card well past the bottom of the photograph. The house
   illustration stays hidden: it is the piece that never fitted in this column. */
.cb-fit .cb-head{grid-template-columns:104px 1fr; gap:14px; align-items:center;}
.cb-fit .cb-house{display:none;}
.cb-fit .cb-logo{width:88px; margin-bottom:5px;}
.cb-fit .cb-seal-name{font-size:9px; letter-spacing:.05em; line-height:1.35;}
.cb-fit .cb-crest-rule{display:none;}
.cb-fit .cb-flourish svg{width:min(150px,70%);}
.cb-fit .cb-flourish-sm svg{width:min(120px,54%);}
.cb-fit .cb-title h2{font-size:clamp(22px,1.7vw,29px); margin:5px 0 2px;}
.cb-fit .cb-title h3{font-size:clamp(11.5px,.95vw,14.5px); margin:0 0 5px;}
.cb-fit .cb-lede{font-size:12px; line-height:1.6; margin:12px 0 13px;}
.cb-fit .cb-offer{width:100%; grid-template-columns:.85fr 1fr 1.2fr; border-radius:11px;}
.cb-fit .cb-offer-cell{padding:11px 11px;}
.cb-fit .cb-offer-note{gap:5px;}
.cb-fit .cb-offer-note strong{font-size:10px; letter-spacing:.05em; line-height:1.4;}
.cb-fit .cb-ico svg{width:26px; height:26px;}
.cb-fit .cb-price{font-size:clamp(23px,1.8vw,30px);}
.cb-fit .cb-price-sub{font-size:9px; letter-spacing:.12em; margin-top:3px;}
.cb-fit .cb-btn{max-width:none; padding:10px 12px; font-size:11px; letter-spacing:.05em;}
@media (max-width:1240px){
  /* the button gets the full width of the strip instead of a 130px sliver that
     breaks "Become a Custodian" across two lines */
  .cb-fit .cb-offer{grid-template-columns:1fr 1fr;}
  .cb-fit .cb-offer-cta{grid-column:1 / -1; border-left:none; border-top:1px solid var(--cb-gold-soft);}
}
@media (max-width:860px){
  .cb-fit{margin-top:20px;}
  .cb-fit .cb-card{padding:26px 22px 28px;}
}

/* ============================================================
   Custodian modal
   ============================================================ */
.cm-backdrop{position:fixed; inset:0; z-index:200; background:rgba(12,24,17,.72); backdrop-filter:blur(3px); display:flex; align-items:flex-start; justify-content:center; padding:28px 16px; overflow-y:auto;}
.cm-backdrop[hidden]{display:none;}
.cm-dialog{position:relative; width:100%; max-width:520px; background:var(--card); border:1.5px solid var(--rule); border-radius:16px; box-shadow:0 24px 60px rgba(0,0,0,.4); padding:28px 28px 24px; margin:auto;}
.cm-close{position:absolute; top:12px; right:16px; background:none; border:none; font-size:26px; line-height:1; color:var(--ink-soft);}
.cm-close:hover{color:var(--danger);}
.cm-eyebrow{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--brass); font-weight:700;}
.cm-head h3{font-family:'Fraunces',serif; font-size:24px; color:var(--forest); margin:6px 0;}
.cm-head p{font-size:13px; color:var(--ink-soft); margin:0 0 18px; line-height:1.6;}
.cm-form{display:flex; flex-direction:column; gap:13px;}
.cm-row{display:grid; grid-template-columns:1fr 1fr; gap:13px;}
.cm-row-title{grid-template-columns:90px 1fr;}
.cm-field{display:flex; flex-direction:column; gap:5px;}
.cm-field > span{font-size:12px; font-weight:600; color:var(--ink-soft);}
.cm-field > span b{color:var(--danger);}
.cm-field input, .cm-field select, .cm-field textarea{width:100%; border:1.5px solid var(--rule); border-radius:9px; background:var(--paper); padding:10px 12px; font-family:inherit; font-size:13.5px; color:var(--ink);}
.cm-field input:focus, .cm-field select:focus, .cm-field textarea:focus{outline:none; border-color:var(--brass);}
.cm-hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}
.cm-check{display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--ink-soft);}
.cm-total{display:flex; align-items:center; justify-content:space-between; background:var(--brass-pale); border-radius:10px; padding:12px 16px; font-size:13px; color:#6E5218;}
.cm-total b{font-family:'Fraunces',serif; font-size:21px; color:#4C3A0D;}
.cm-error{background:#FBEAE7; border:1px solid #E4B7AF; color:#8C2E20; border-radius:9px; padding:10px 13px; font-size:12.5px; line-height:1.5;}
.cm-error[hidden]{display:none;}
.cm-pay{width:100%; padding:14px; border:none; border-radius:10px; background:var(--forest); color:#F1E4BE; font-family:'Fraunces',serif; font-size:15.5px; letter-spacing:.04em;}
.cm-pay:hover{background:var(--forest-mid);}
.cm-pay:disabled{opacity:.65; cursor:default;}
.cm-fine{font-size:11.5px; color:var(--ink-soft); text-align:center; line-height:1.6;}
.cm-testmode{color:#8A6A12;}
@media (max-width:520px){
  .cm-row, .cm-row-title{grid-template-columns:1fr;}
  .cm-dialog{padding:24px 18px 20px;}
}

/* ============================================================
   Certificate page
   ============================================================ */
.cert-page{background:var(--paper); padding:44px 0 60px;}
.cert-thanks{text-align:center; max-width:640px; margin:0 auto 34px;}
.cert-tick{display:inline-flex; align-items:center; justify-content:center; width:52px; height:52px; border-radius:50%; background:var(--ok); color:#fff; margin-bottom:14px;}
.cert-tick svg{width:26px; height:26px;}
.cert-thanks h1{font-size:30px; margin-bottom:10px;}
.cert-thanks p{font-size:14.5px; line-height:1.75; color:var(--ink-soft);}
.cert-actions{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin:22px 0 10px;}
.cert-receipt{font-size:11.5px; color:var(--ink-soft);}
.cert-stage{text-align:center;}
.cert-scroll{overflow-x:auto; padding:6px 0 12px;}
.cert-scroll .cert-card{margin:0 auto; box-shadow:0 18px 44px rgba(30,25,10,.16);}
.cert-hint{font-size:12px; color:var(--ink-soft); margin-top:6px;}
@media print{
  .top-banner, .pub-nav, .pub-footer, .cert-thanks, .cert-hint{display:none !important;}
  .cert-page{padding:0; background:#fff;}
  .cert-scroll{overflow:visible;}
}