*{box-sizing:border-box}html,body{height:100%;overflow:hidden}body{font:14px/1.5 Arial,sans-serif}
.rune-gate{display:block;height:100dvh;padding-bottom:max(24px,env(safe-area-inset-bottom));isolation:isolate;transition:none}
.rune-gate::before{content:'';position:absolute;inset:-12px;background:#a62e27;opacity:0;pointer-events:none;transition:opacity 220ms ease;z-index:0}
.rune-gate.is-wrong::before{opacity:.18}.rune-gate.is-wrong{animation:rune-refusal 340ms ease-out}
.gate-heading{position:absolute;top:clamp(24px,calc(4vh + 12px),48px);left:16px;right:16px;text-align:center;z-index:1;pointer-events:none}
.gate-heading h1{margin:0;font-size:0}
.gate-heading img{display:block;width:min(480px,calc(100vw - 32px));height:78px;object-fit:contain;margin:auto;color:transparent}
.rune-slots{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(352px,calc(100% - 32px));display:grid;grid-template-columns:repeat(4,1fr);list-style:none;padding:0;margin:0;pointer-events:none}
.rune-slots li{aspect-ratio:1}.rune-slots span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.rune-field{position:absolute;inset:0;z-index:1;pointer-events:none}
.rune{position:absolute;left:0;top:0;padding:5px;border:0;border-radius:4px;background:none;cursor:pointer;touch-action:manipulation;pointer-events:auto;visibility:hidden;transition:transform 460ms cubic-bezier(.22,1,.36,1);-webkit-tap-highlight-color:transparent}
.rune.is-ready{visibility:visible}.rune.is-selected{z-index:1}.rune:disabled{opacity:1;cursor:default;pointer-events:none}
.rune img{display:block;width:150%;height:150%;margin:-25%;object-fit:contain;transition:transform 120ms ease}
.rune:active img{transform:scale(.92)}
.rune:focus-visible,.gate-retry:focus-visible{outline:2px solid #f1d7a7;outline-offset:4px}
@media(hover:hover) and (pointer:fine){.rune:not(:disabled):hover img{transform:scale(1.08)}}
.gate-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.gate-retry{position:absolute;z-index:2;bottom:max(12px,env(safe-area-inset-bottom));left:calc(50% - 22px);width:44px;height:44px;padding:10px;border:0;background:none;color:#ddc197;cursor:pointer}
.gate-retry svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@keyframes rune-refusal{0%,100%{transform:translateX(0)}20%{transform:translateX(-4px)}40%{transform:translateX(4px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
@media(max-height:420px){.gate-heading img{height:48px}.gate-heading{top:14px}.rune-gate{padding-bottom:max(16px,env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){.rune,.rune img{transition:none}.rune-gate.is-wrong{animation:none}.rune-gate::before{transition-duration:120ms}}
