:root{color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;background:#000;overflow:hidden}
main{width:100vw;height:100dvh;display:grid;place-items:center}
.screen{position:relative;width:min(100vw,46.0251046025dvh);aspect-ratio:440/956;overflow:hidden;background:#000;isolation:isolate;user-select:none;-webkit-user-select:none}
#hotspots{position:absolute;inset:0;width:100%;height:100%;z-index:2}
.hotspot{position:absolute;border:0;padding:0;background:transparent;cursor:pointer;border-radius:14px;-webkit-tap-highlight-color:transparent}
.hotspot:focus-visible{outline:2px solid #ff5462;background:#ff546220}
.hotspot:active{background:#ffffff08}
#loading{position:absolute;inset:0;background:#000;z-index:5}
#loading[hidden]{display:none}
.debug .hotspot{outline:1px solid #f54855a0;background:#f5485520}
#canvas{position:absolute;inset:0;width:100%;height:100%}#portal{position:absolute;inset:0;z-index:6}#portal[hidden]{display:none}.overlay-dim{position:absolute;inset:0;background:#0004}.menu-dim{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.sheet-dim{background:#0005}.native-overlay{position:absolute;isolation:isolate}.native-overlay>img{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.native-overlay .hotspot{border-radius:0}.transition-surface{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none}#decoders{position:absolute;inset:0;pointer-events:none}.hotspot{touch-action:none}

.menu-dim{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}.native-material{position:absolute;inset:0;backdrop-filter:blur(10px) saturate(1.15);-webkit-backdrop-filter:blur(10px) saturate(1.15);mask-size:100% 100%;mask-repeat:no-repeat;pointer-events:none}

.context-dim{background:#0006}.pressed-preview{position:absolute;pointer-events:none}
.native-sheet-motion{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

.menu-highlight{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.native-overlay .hotspot:active{background:transparent}.native-overlay>img[hidden],.menu-highlight[hidden]{display:none}

html,body{overscroll-behavior:none}
.screen,.hotspot{touch-action:pan-y;-webkit-touch-callout:none}
.native-scroll{position:absolute;inset:12.1338912134% 0 14.539748954% 0;z-index:1;overflow-x:hidden;overflow-y:auto;overscroll-behavior:none;scrollbar-width:none;touch-action:pan-y}
.native-scroll::-webkit-scrollbar{display:none}
.native-scroll.locked{overflow-y:hidden;touch-action:none}
#portal,#portal .hotspot{touch-action:none}
.scroll-world{position:relative;width:100%}
.scroll-backing,.scroll-body-frame{position:absolute;left:0;top:0;width:100%;pointer-events:none}
.scroll-body-frame{z-index:1}
.scroll-targets{position:absolute;inset:0;z-index:2;pointer-events:none}
#hotspots{pointer-events:none}
.hotspot{pointer-events:auto}
.scroll-chrome{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.scroll-chrome[hidden]{display:none}
.recorded-island{position:absolute;left:35.6818181818%;top:1.4644351464%;width:28.6363636364%;height:3.870292887%;border-radius:999px;background:#000;z-index:8;pointer-events:none}
