:root { --arena-min-h: 200px; }

html, body { height:100%; }
body { margin:0; background:#fff; font:16px system-ui,-apple-system,Segoe UI,Roboto,sans-serif; color:#111; }
.overlay { position:fixed; inset:0; background:#fff; display:flex; align-items:center; justify-content:center; }
.card { width:min(1200px,100%); padding:18px 14px; display:flex; flex-direction:column; align-items:center; gap:12px; }
.title { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:center; text-align:center; }
.title b { font-weight:800; }
.probe { display:inline-flex; align-items:center; gap:8px; color:#333; font-size:14px; }
.probe .svg { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; color:#000; }

.arena { position:relative; width:100%; min-height:var(--arena-min-h); }
canvas { position:absolute; inset:0; width:100%; height:100%; touch-action:none; }
#BgCanvas { z-index:0; }
#FgCanvas { z-index:1; cursor:pointer; will-change: contents; }

.note { color:#666; font-size:12px; min-height:1.2em; }
.err  { color:#b00020; }
.ok   { color:#1b5e20; }

.hp-wrap { position:absolute; left:-99999px; top:auto; width:1px; height:1px; overflow:hidden; }

/* auxiliary SVG container (not visible for user) */
#__ab_captcha { position:fixed; left:-99999px; width:1px; height:1px; overflow:hidden; pointer-events:auto; }
