/* Staging-only Halloween entrance. The normal homepage stays underneath. */
.potion-portal{position:absolute;right:38%;bottom:28px;display:flex;align-items:center;flex-direction:column;gap:5px;width:178px;padding:13px 16px 16px;background:rgba(13,24,17,.91);color:#f5e9c9;border:1px solid #b79b66;text-decoration:none;box-shadow:0 8px 26px #0005;z-index:2}
.potion-portal img{display:block;width:142px;height:71px;transition:transform .35s ease}
.potion-portal span{font:700 14px/1.3 Arial,sans-serif;letter-spacing:.045em}
.potion-portal:hover{background:#172c20;border-color:#e8ca8d}
.potion-portal:hover img,.potion-portal:focus-visible img{transform:translateY(-3px) rotate(-2deg)}
.potion-gateway{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;color:#f5e9c9;background:transparent;overflow:hidden}
.potion-gateway::backdrop{background:rgba(6,12,8,.65)}
.potion-gateway:not([open]){display:none}
.gateway-bar{position:absolute;top:0;left:0;right:0;min-height:56px;display:flex;align-items:center;gap:18px;padding:8px 24px;background:#111b13;z-index:3;opacity:1}
.gateway-bar h2{margin:0;font:normal 19px/1.3 Georgia,serif;flex:1}
.gateway-bar a{font:13px/1.3 Arial,sans-serif;color:#f5e9c9;text-underline-offset:4px;min-height:40px;display:flex;align-items:center}
.gateway-close{padding:10px 16px;min-height:40px;border:1px solid #b79b66;background:#172c20;color:#f5e9c9;font:700 13px/1.3 Arial,sans-serif;cursor:pointer}
.gateway-close:focus-visible,.gateway-bar a:focus-visible{outline:3px solid #e5ac42;outline-offset:2px}
.gateway-frame{position:absolute;top:56px;left:0;width:100%;height:calc(100% - 56px);border:0;opacity:0;transition:opacity 1.15s ease;background:#101910}
.gateway-loading{position:absolute;inset:56px 0 0;display:grid;place-content:center;background:#101910;font:normal 24px Georgia,serif}
.potion-gateway.revealed{background:#101910}
.potion-gateway.revealed .gateway-frame,.potion-gateway.revealed .gateway-bar{opacity:1}
.potion-gateway.revealed .gateway-loading{display:none}
.gateway-storm{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 77% 12%,rgba(190,207,210,.16),transparent 62%)}
.gateway-storm svg{position:absolute;right:7%;top:0;width:28%;height:64%;opacity:.55;filter:drop-shadow(0 0 12px #e4dcaf)}
.potion-gateway.storming .gateway-storm{animation:potion-lightning 4s linear both}
@keyframes potion-lightning{
  0%,8%,23%,38%,53%,68%,83%,100%{opacity:0}
  11%,41%,71%{opacity:.85}
  17%,47%,77%{opacity:.24}
}
@media(max-width:900px){
 .hero-copy .potion-portal{position:relative;right:auto;bottom:auto;margin-top:18px;width:144px;padding:8px 12px 12px;gap:3px}
 .potion-portal img{width:116px;height:58px}
 .potion-portal span{font-size:13px}
}
@media(min-width:641px) and (max-width:900px){.hero{height:auto;min-height:620px}}
@media(max-width:640px){.gateway-bar{gap:10px;padding:8px 12px}.gateway-bar h2{font-size:16px}.gateway-bar a{display:none}.gateway-close{padding-inline:10px}}
@media(prefers-reduced-motion:reduce){.potion-portal img,.gateway-frame,.gateway-bar{transition:none}.potion-portal:hover img,.potion-portal:focus-visible img{transform:none}.gateway-storm{display:none!important}}
@media print{.potion-portal,.potion-gateway{display:none!important}}

/* Mobile tap entrance: red eyes during the fade, then flight in the chamber. */
.gateway-bar{height:64px;min-height:64px}
.gateway-close{min-height:44px}
.gateway-frame{top:64px;height:calc(100% - 64px)}
.gateway-loading{inset:64px 0 0}
.gateway-creature{position:absolute;display:none;z-index:4;pointer-events:none;transform-origin:50% 50%}
.gateway-creature img{display:block;width:100%;height:auto}
.gateway-creature .portal-eyes{position:absolute;inset:0;width:100%;height:100%}
.potion-gateway.arriving .gateway-creature{display:block}
.potion-portal.inviting{animation:portal-invitation 2.4s ease-in-out both}
.potion-portal.inviting img{animation:portal-nudge 2.4s ease-in-out both}
@keyframes portal-invitation{0%,100%{box-shadow:0 8px 26px #0005}45%{box-shadow:0 0 22px #b79b6666}}
@keyframes portal-nudge{0%,100%{transform:none}35%{transform:translate(3px,-4px) rotate(2deg)}65%{transform:translate(-2px,-2px) rotate(-1deg)}}
@media(prefers-reduced-motion:reduce){.gateway-creature{display:none!important}.potion-portal.inviting,.potion-portal.inviting img{animation:none!important}}

/* Center entrance v3: three spaced lightning strikes over a four-second flight. */
.gateway-storm{inset:64px 0 0;background:radial-gradient(ellipse at 50% 45%,rgba(180,201,205,.24),transparent 72%)}
.gateway-storm svg{right:8%;width:30%;height:90%;opacity:.85;filter:drop-shadow(0 0 9px #e4e8cf)}
.gateway-storm .bolt-left{left:8%;right:auto;top:4%;height:83%;transform:scaleX(-1)}
.gateway-storm svg path{stroke:#f1f7ef;stroke-width:4;filter:drop-shadow(0 0 3px #dcefff)}
.potion-gateway.storming .gateway-loading{color:transparent}

/* Scope portal chrome above theme button and heading rules. */
#potion-gateway .gateway-bar h2{color:#f5e9c9}
#potion-gateway .gateway-close,#potion-gateway .gateway-close:hover,#potion-gateway .gateway-close:focus{color:#f5e9c9;background:#172c20;border:1px solid #b79b66;padding:10px 16px;min-height:44px;font:700 13px/1.3 Arial,sans-serif;text-transform:none;letter-spacing:0}
#potion-gateway .gateway-close:focus-visible{outline:3px solid #e5ac42;outline-offset:2px}

/* Center the seasonal entrance beneath shopping actions inside the text area. */
.hero-copy .actions{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);width:min(100%,400px);align-items:center;gap:10px 12px}
.hero-copy .actions .button{min-width:0;text-align:center}
.hero-copy .actions .potion-portal{position:static;right:auto;bottom:auto;grid-column:1 / -1;justify-self:center;margin:0;width:126px;min-height:66px;padding:4px 8px;gap:2px;background:transparent;border-color:transparent;box-shadow:none}
.hero-copy .actions .potion-portal img{width:88px;height:44px}
.hero-copy .actions .potion-portal span{font-size:12px;letter-spacing:.02em}
.hero-copy .actions .potion-portal:hover{background:#172c20;border-color:#b79b66}
@media(max-width:640px){.hero-copy .actions{gap:8px 9px}.hero-copy .actions .potion-portal{width:116px;min-height:62px}}