#viewport-notice{position:fixed;inset:0;box-sizing:border-box;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:max(20px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));border:0;background:radial-gradient(ellipse at 50% 5%,#1939a2 0,#080d50 55%,#02051b 100%);color:#eef3ff;text-align:center;overflow:auto;font-family:Arial,Helvetica,sans-serif;overscroll-behavior:contain}
#viewport-notice:not([open]){display:none}
#viewport-notice[open]{display:grid;place-items:center}
#viewport-notice::backdrop{background:#02051b}
.viewport-card{box-sizing:border-box;width:min(100%,480px);padding:24px 20px;border:1px solid #9ab4ff88;border-radius:26px;background:linear-gradient(145deg,#203aaac9,#0a1055f5);box-shadow:0 20px 70px #0007,inset 0 1px 1px #ffffff55}
.viewport-logo{display:block;width:min(100%,330px);height:auto;margin:0 auto 22px}
.viewport-card h1{margin:0 0 16px;color:#ffe56a;font-size:clamp(24px,6vw,32px);line-height:1.15;font-weight:800}
.viewport-card p{margin:12px 0;font-size:16px;line-height:1.5}
.viewport-card .viewport-help{color:#c6d8ff;font-size:14px}
.viewport-qr{display:block;width:min(190px,60vw);height:auto;margin:22px auto 16px;border-radius:8px;background:white;image-rendering:pixelated}
.viewport-address{display:block;color:#ffe991;font-size:clamp(13px,3.5vw,17px);font-weight:700;line-height:1.5;overflow-wrap:anywhere;text-underline-offset:4px}
.viewport-address:focus-visible{outline:3px solid #ffe56a;outline-offset:5px;border-radius:3px}
@media(max-width:719px),(max-height:599px){
 /* Show the notice even while WebAssembly is still loading. */
 #viewport-notice:not([open]){display:grid;place-items:center;z-index:2147483647}
}
@media(max-height:500px){.viewport-card{padding:20px}.viewport-logo{width:240px;margin-bottom:16px}.viewport-qr{width:160px}}
