Adom Footprint

/* ── adom-footprint shared viewer core (CSS) ───────────────────────────────
   Included VERBATIM by both the live app (app.html) and the static embed
   (embed.html) so the canvas, zoom toolbar and layer-panel rows look identical
   and cannot drift. Self-contained literal colours (no dependency on either
   file's CSS vars). Class prefix: av- */

.av-vp{position:absolute;inset:0;overflow:hidden;cursor:grab;background:radial-gradient(circle at 50% 42%,#121a26 0%,#0d1117 72%)}
.av-vp.grab{cursor:grabbing}
/* DIRECT child only — the zoom-toolbar button icons (.av-tools svg) also live
   inside .av-vp; without '>' they'd inherit position:absolute and stack at 0,0. */
.av-vp > svg{position:absolute;left:0;top:0;width:100%;height:100%;transform-origin:0 0;display:block}

/* zoom toolbar */
/* Grouped translucent toolbar (matches adom-symbol's .tools): one container, borderless
   buttons that highlight on hover — instead of individually-boxed buttons. */
.av-tools{position:absolute;left:10px;top:10px;display:flex;gap:3px;padding:3px;z-index:5;background:rgba(22,27,34,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid #222b38;border-radius:9px}
.av-tools button{width:30px;height:30px;border-radius:6px;border:none;background:transparent;color:#cfd8e2;cursor:pointer;display:grid;place-items:center;transition:background .15s ease,color .15s ease}
.av-tools button svg{width:16px;height:16px;display:block}
.av-tools button:hover{background:#222b38;color:#37c8a6}
.av-tools button:focus,.av-tools button:focus-visible{outline:none}
.av-panhint{position:absolute;right:10px;bottom:9px;color:#8b949e;font-size:11px;z-index:5;pointer-events:none;user-select:none;-webkit-user-select:none}

/* layer panel rows */
.av-lrow{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:8px;cursor:pointer}
.av-lrow:hover{background:#161c27}
.av-lrow .sw{width:13px;height:13px;border-radius:3px;border:1px solid rgba(255,255,255,.15);flex:0 0 13px}
.av-lrow .sw.ring{background:transparent!important}
.av-lrow .ln{flex:1;font-size:13px}
.av-lrow .meta{font-size:10px;color:#8b949e}
.av-lrow .chk{width:16px;height:16px;border-radius:4px;border:1.5px solid #3a4757;display:grid;place-items:center;color:#0b0f17;font-size:11px}
.av-lrow.on .chk{background:#37c8a6;border-color:#37c8a6}
.av-lrow.off .ln,.av-lrow.off .sw{opacity:.4}
.av-lrow.special{background:linear-gradient(100deg,rgba(55,200,166,.10),transparent);border:1px solid rgba(55,200,166,.25);margin-top:4px}
.av-lrow.special .ln{color:#7ef0d2;font-weight:600}