:root { color-scheme: dark; background: #000; }
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #000; }
body { overscroll-behavior: none; }
main { position: fixed; inset: 0; display: grid; place-items: center; isolation: isolate; }
img { display: block; width: min(76vw, 900px); max-height: 60vh; object-fit: contain; user-select: none; -webkit-user-drag: none; }
canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 1.6s ease; touch-action: none; }
.ready canvas { opacity: 1; }
.ready img { visibility: hidden; }
@media (max-width: 600px) { img { width: 86vw; } }
@media (prefers-reduced-motion: reduce) { canvas { display: none; transition: none; } .ready img { visibility: visible; } }
.owner-panel { position:fixed; z-index:2; inset:auto 0 max(7vh,24px); margin:auto; width:min(88vw,420px); color:#e2e5e5; font:12px/1.5 system-ui,sans-serif; }
.owner-panel form { display:grid; gap:12px; padding:22px; background:rgba(0,0,0,.9); border:1px solid #26292d; border-radius:4px; }
.owner-panel label { display:grid; gap:5px; color:#a4a8ad; }
.owner-panel input { width:100%; border:1px solid #35383c; background:#090a0b; border-radius:2px; color:#fff; font:inherit; padding:10px; }
.owner-panel button { border:1px solid #35383c; border-radius:2px; padding:9px 12px; background:#111316; color:#e2e5e5; font:inherit; cursor:pointer; }
.owner-panel button:disabled { opacity:.4; cursor:wait; }
.owner-panel [data-owner-close] { position:absolute; right:7px; top:2px; padding:0 5px; border:0; background:transparent; font-size:18px; }
.owner-panel .owner-key-prompt { display:grid; gap:12px; padding:22px; background:rgba(0,0,0,.94); border:1px solid #26292d; border-radius:4px; }
.owner-panel .owner-key-prompt p { margin:0; }
.owner-panel .owner-key-prompt button { justify-self:start; }
.owner-panel :focus-visible { outline:1px solid #c6d3e2; outline-offset:3px; }

