/* Keep the HTML controls aligned with the game's physical-pixel UI. */
.archerlab-link { left: max(18px,env(safe-area-inset-left)); top: max(12px,env(safe-area-inset-top)); transform: none; min-height: 44px; display: inline-flex; align-items: center; padding: 10px 16px; border-color: #9c8fb340; color: #d1c6e4; background: #131020c9; font-size: 11px; letter-spacing: .06em; opacity: 1; border-radius: 6px; box-shadow: none; }
.shadow-name-input { font-size: 16px; }
body { height: 100dvh; }
.shadow-name-entry { border: 8px solid transparent; border-image: url('assets/ui/skin-panel-v1.webp') 230 fill / 8px stretch; background: none !important; clip-path: none; filter: none !important; }
#game-container canvas { margin: 0 !important; }
.shadow-name-entry { --entry-accent: #b39bcf; background: linear-gradient(110deg, #71617e, #cbb590, #71617e); filter: drop-shadow(0 12px 28px #0007); }
.shadow-name-input { background: #12101e; color: #eee6f5; }
.archerlab-link:focus-visible { outline: 2px solid #e0c997; outline-offset: 3px; }
@media (max-width: 768px),(max-height:500px) { .archerlab-link { left: max(14px,env(safe-area-inset-left)); top: max(10px,env(safe-area-inset-top)); transform: none; padding: 10px 14px; min-height: 44px; font-size: 11px; opacity: 1; } .shadow-name-input { font-size: 16px; } }

.archerlab-link,.archerlab-link:hover { background: none; border: 12px solid transparent; border-image: url('assets/ui/crafted-frame-v1.webp') 290 fill / 12px / 0 stretch; border-radius: 0; padding: 3px 10px; color: #efe3ff; backdrop-filter: none; -webkit-backdrop-filter: none; }
@media (max-width: 768px),(max-height:500px) { .archerlab-link { padding: 3px 10px; } }