:root {color-scheme:dark;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
html,body {width:100%;height:100%;overflow:hidden;overscroll-behavior:none;background:#112c29;margin:0;padding:0}
#canvas {position:fixed;inset:0;width:100vw!important;height:100vh!important;height:100dvh!important;touch-action:none;display:block}
#screen-toggle {position:fixed;z-index:25;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));width:38px;height:38px;padding:9px;display:grid;place-items:center;border:1px solid #c5ae6a88;border-radius:10px;background:#102d29b8;color:#f2dc99;cursor:pointer;opacity:.75}
#screen-toggle:hover,#screen-toggle:focus-visible {opacity:1;outline:2px solid #e9c166;outline-offset:3px}
#screen-toggle svg {width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.7}
#mobile-entry {position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,#092b2bdb,#102524f5),url('screen-cover.webp') center/cover;color:#f3f1df;text-align:center;box-sizing:border-box}
#mobile-entry[hidden] {display:none}
#mobile-entry .entry-card {max-width:420px;width:100%;padding:25px 22px 27px;border:1px solid #9d985b66;border-radius:22px;background:#102e2bdd;box-shadow:0 25px 80px #0007;box-sizing:border-box}
#mobile-entry .entry-art {width:150px;height:150px;object-fit:contain;margin:0 auto 10px;animation:entry-float 3.4s ease-in-out infinite}
#mobile-entry .eyebrow {font-size:12px;letter-spacing:.2em;color:#e7bd65;font-weight:700;margin:0 0 10px}
#mobile-entry h1 {font-size:clamp(25px,6vw,35px);line-height:1.15;margin:0 0 14px}
#mobile-entry p {font-size:15px;line-height:1.55;color:#c3d0ba;margin:0 0 20px}
#mobile-enter {width:100%;min-height:54px;padding:14px;border:1px solid #ffe0a1;border-radius:12px;background:linear-gradient(#f6ce73,#e5ae46);color:#293e2c;font-size:16px;font-weight:800;cursor:pointer}
#mobile-entry .rotate-guide {display:none;width:68px;height:68px;stroke:#efd18a;fill:none;stroke-width:2.4;margin:10px auto 20px;animation:rotate-phone 2.8s ease-in-out infinite}
#mobile-entry.await-rotate .rotate-guide {display:block}
#mobile-entry.await-rotate .entry-art {display:none}
#mobile-entry .entry-note {font-size:12px;margin:15px 0 0;color:#98b3a5}
@keyframes entry-float {50% {transform:translateY(-7px)}}
@keyframes rotate-phone {0%,20% {transform:rotate(0deg)}60%,100% {transform:rotate(90deg)}}
@media (orientation:landscape) and (max-height:520px) {#mobile-entry .entry-card {max-width:640px;padding:18px 25px}#mobile-entry .entry-art {width:84px;height:84px;float:left;margin:5px 22px 5px 0}#mobile-entry h1 {font-size:26px}#mobile-entry p {font-size:13px;margin-bottom:12px}#mobile-entry .entry-note {font-size:11px;margin-top:8px}}
@media (prefers-reduced-motion:reduce) {#mobile-entry .entry-art,#mobile-entry .rotate-guide {animation:none}}
