/* ============================================================
   Shared "record-linked media" lightbox — media.css
   Pairs with media.js. Any element carrying data-media-src
   becomes a trigger that opens the media (image / document
   scan / local video / DVIDS / YouTube) in this overlay.
   Namespaced .rml-* so it never collides with page styles.
   ============================================================ */
[data-media-src]{cursor:pointer}

/* a small affordance you can opt into on text/link triggers */
.rml-cue{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;
  letter-spacing:.02em;color:#a8c0e0;border:1px solid #233148;background:#0c1726;
  border-radius:7px;padding:6px 11px;text-decoration:none;transition:.15s;cursor:pointer}
.rml-cue:hover{border-color:#3a5080;color:#cfe0f2;background:#0f1d30}
.rml-cue .rml-ic{font-size:13px;line-height:1}

/* thumbnail trigger */
.rml-thumb{position:relative;display:block;border-radius:8px;overflow:hidden;border:1px solid #1a2535;cursor:pointer}
.rml-thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .25s}
.rml-thumb:hover img{transform:scale(1.04)}
.rml-thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.45))}
.rml-thumb .rml-badge{position:absolute;left:8px;bottom:7px;z-index:1;font-size:10px;font-weight:800;
  letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.5);
  border-radius:5px;padding:3px 7px;backdrop-filter:blur(2px)}

/* overlay */
.rml-overlay{position:fixed;inset:0;z-index:9999;display:none;background:rgba(0,0,0,.93);
  align-items:center;justify-content:center;flex-direction:column;padding:24px}
.rml-overlay.open{display:flex}
.rml-stage{display:flex;align-items:center;justify-content:center;max-width:96vw;max-height:82vh;overflow:hidden}
.rml-stage img{max-width:96vw;max-height:82vh;object-fit:contain;border-radius:6px;box-shadow:0 12px 60px rgba(0,0,0,.6)}
.rml-stage video{max-width:96vw;max-height:82vh;border-radius:6px;background:#000;box-shadow:0 12px 60px rgba(0,0,0,.6)}
.rml-frame{position:relative;width:min(980px,94vw);aspect-ratio:16/9;box-shadow:0 12px 60px rgba(0,0,0,.6);border-radius:6px;overflow:hidden}
.rml-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}
.rml-cap{color:#c8c4bc;font:13px/1.55 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  text-align:center;margin-top:14px;max-width:880px;padding:0 20px}
.rml-cap b{color:#e8e2d6;font-weight:800}
.rml-close{position:fixed;top:12px;right:18px;font-size:34px;line-height:1;color:#fff;
  background:none;border:none;cursor:pointer;padding:6px}
.rml-close:hover{color:#d9c587}
.rml-hint{position:fixed;bottom:14px;left:0;right:0;text-align:center;color:#5a6a7a;font-size:11px;letter-spacing:.04em}

/* ── zoomable image / scan / document page ── */
.rml-zoomwrap{display:flex;align-items:center;justify-content:center;
  max-width:96vw;max-height:82vh;overflow:hidden;touch-action:none}
.rml-zimg{max-width:96vw;max-height:82vh;object-fit:contain;border-radius:6px;
  box-shadow:0 12px 60px rgba(0,0,0,.6);background:#fff;cursor:zoom-in;
  transform-origin:center center;will-change:transform;user-select:none;-webkit-user-drag:none}
.rml-zoomwrap.zoomed .rml-zimg{cursor:grab}

/* zoom control cluster (image/scan/doc modes) */
.rml-zoom{display:none;position:fixed;bottom:46px;left:50%;transform:translateX(-50%);z-index:3;gap:8px}
.rml-overlay.zoomable .rml-zoom{display:flex}
.rml-zbtn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;
  font-size:20px;line-height:1;color:#e8e2d6;background:rgba(12,23,38,.72);
  border:1px solid #233148;border-radius:9px;cursor:pointer;transition:.15s}
.rml-zbtn:hover{background:rgba(20,35,56,.95);color:#d9c587;border-color:#3a5080}
.rml-zreset{font-size:15px}

/* ── multi-page document viewer (type=doc) ── */
.rml-nav{display:none;position:fixed;top:50%;transform:translateY(-50%);z-index:2;
  width:46px;height:64px;align-items:center;justify-content:center;
  font-size:34px;line-height:1;color:#e8e2d6;background:rgba(12,23,38,.62);
  border:1px solid #233148;border-radius:10px;cursor:pointer;transition:.15s}
.rml-overlay.doc .rml-nav{display:flex}
.rml-nav:hover{background:rgba(20,35,56,.9);color:#d9c587;border-color:#3a5080}
.rml-nav:disabled{opacity:.28;cursor:default}
.rml-prev{left:16px}
.rml-next{right:16px}
.rml-pg-src{color:#8aa0bb;font-weight:600}
@media (max-width:780px){
  .rml-nav{width:40px;height:54px;font-size:28px}
  .rml-prev{left:6px}.rml-next{right:6px}
}