:root{color-scheme:dark;--bg: #07090c;--panel: #10161c;--line: #24303c;--amber: #e8b44c;--amber-dim: rgba(232, 180, 76, .18);--cyan: #3ad7c0;--text: #e8edf2;--muted: #9aa5b1;--danger: #e05a4f;--mono: "IBM Plex Mono", "ui-monospace", "SFMono-Regular", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:var(--mono)}body{min-height:100dvh}#app{min-height:100dvh;display:grid;grid-template-rows:auto 1fr auto}.topbar,.dock{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--panel);flex-wrap:wrap}.dock{border-bottom:0;border-top:1px solid var(--line);justify-content:space-between}.brand{letter-spacing:.14em;font-size:12px;font-weight:600}.brand span{color:var(--amber)}.meta,.caption{color:var(--muted);font-size:12px}.loops{display:flex;flex-wrap:wrap;gap:6px;margin-left:auto}.loops button,.dots button,.next,.restart{font:inherit;cursor:pointer;color:var(--text);background:transparent;border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:11px;letter-spacing:.08em}.loops button.active,.next{background:var(--amber);color:#111;border-color:var(--amber)}.stage-wrap{display:grid;place-items:center;padding:12px 16px 8px;min-height:0}.stage{position:relative;width:min(100%,1280px);aspect-ratio:16 / 9;background:#05070a;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 24px 80px #00000073}.stage img{display:block;width:100%;height:100%;object-fit:contain;background:#05070a}.stage.loading:after,.stage.error .fallback{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-size:13px}.stage.loading:after{content:"Loading Night Mill frame…";background:#07090c8c}.stage.error .fallback{background:var(--bg);color:var(--danger);padding:24px;text-align:center}.hotspot{position:absolute;border:2px solid transparent;border-radius:10px;background:transparent;cursor:pointer;padding:0}.hotspot:hover,.hotspot:focus-visible{outline:none;border-color:var(--amber);box-shadow:0 0 0 6px var(--amber-dim),0 0 28px #e8b44c59}.hotspot .hit{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.dock-left,.dock-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.dots{display:flex;gap:6px}.dots button{width:10px;height:10px;padding:0;border-radius:50%;background:var(--line)}.dots button.active{background:var(--amber);border-color:var(--amber)}.frame-index{color:var(--cyan);font-size:12px}.empty{padding:48px 16px;text-align:center;color:var(--muted)}@media(max-width:720px){.loops{margin-left:0;width:100%}.stage-wrap{padding:8px}.dock{align-items:stretch;flex-direction:column}.next,.restart{width:100%;text-align:center;padding:10px 12px}}