/* the lift between pages */
html.liftin body::after{content:'';position:fixed;inset:0;z-index:499;background:#0a0a0a}
/* above the nav (z-index 400): the doors cover the bar and the mark */
#gate{position:fixed;inset:0;z-index:500;pointer-events:none;visibility:hidden;overflow:hidden}
#gate.on{visibility:visible;pointer-events:auto}
#gate .dr{position:absolute;background-color:#0a0a0a;box-shadow:0 0 0 1px #000}
#gate .dl{background-image:url('../assets/doors/gate-left.webp');background-size:cover;background-position:right center;background-repeat:no-repeat}
#gate .drr{background-image:url('../assets/doors/gate-right.webp');background-size:cover;background-position:left center;background-repeat:no-repeat}
#gate .dt,#gate .db{display:none}
#gate .dt{background-position:left bottom}#gate .db{background-position:left top}
/* The per-destination lift textures were for the OLD four-panel tiled lift. They
   target `.dr`, which the new door leaves also carry, and `#gate.to-s1 .dr` out-
   specifies `#gate .dl`, so on every internal page they painted the old steel over
   the new door art for the first half of the transition. Removed, not restored. */
#gate .dr::after{content:'';position:absolute;background:#fff;opacity:.35}
#gate .dl,#gate .drr{top:0;bottom:0;width:50%}
#gate .dl{left:0;transform:translateX(-101%)}#gate .drr{right:0;transform:translateX(101%)}
#gate .dl::after{right:0;top:0;bottom:0;width:1px}#gate .drr::after{left:0;top:0;bottom:0;width:1px}
#gate .dt,#gate .db{left:0;right:0;height:50%}
#gate .dt{top:0;transform:translateY(-101%)}#gate .db{bottom:0;transform:translateY(101%)}
#gate .dt::after{bottom:0;left:0;right:0;height:1px}#gate .db::after{top:0;left:0;right:0;height:1px}
#gate .panel{position:absolute;left:50%;top:50%;width:min(28vw,340px);transform:translate(-50%,-50%);opacity:0}
#gate .panel::before{content:'';position:absolute;inset:-5% -4% -22%;background:#050505;box-shadow:0 0 60px 30px rgba(0,0,0,.75);z-index:-1}
#gate .panel .hs{width:100%;height:auto;display:block;position:relative}
#gate .panel .hs *{fill:none;stroke:#8a8a8a;stroke-width:1;vector-effect:non-scaling-stroke}
#gate .panel .hs .mintLn{stroke:#FF6F52;stroke-width:1.6}
#gate .panel .hs .lampOn{fill:#FF6F52;stroke:#FF6F52}
#gate .panel .floor{position:absolute;left:10%;top:20%;width:43%;height:60%;display:flex;align-items:center;justify-content:center;line-height:1;font-family:var(--disp);font-variation-settings:'wdth' 100;font-size:calc(min(28vw,340px) * .2);color:#FF6F52;text-shadow:0 0 14px rgba(255,111,82,.55);letter-spacing:.02em}
#gate .panel .dest{position:absolute;left:0;right:0;top:104%;text-align:center;font-family:var(--label);font-variation-settings:'wdth' 150;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:#7a7a7a}
#gate .lines{position:absolute;inset:0;opacity:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.14) 0 1px,transparent 1px 90px);background-size:100% 90px}


/* the level readout, matching index.html. Font stack in full: this file loads on
   pages whose tokens differ. */
#gate .levelbox{position:absolute;right:5vw;bottom:5.5vh;z-index:3;opacity:0;pointer-events:none;
  border:1px solid #343434;background:rgba(10,10,10,.74);padding:14px 18px 12px;min-width:134px;text-align:right}
#gate .levelbox .lvl{font-family:'modulator-text-vf','ModulatorTextLocal','Anton',sans-serif;
  font-variation-settings:'wdth' 100;font-size:42px;line-height:1;letter-spacing:.02em;
  color:#FF6F52;text-shadow:0 0 14px rgba(255,111,82,.45)}
#gate .levelbox .lvlname{margin-top:9px;font-family:'modulator-text-vf','ModulatorTextLocal','Anton',sans-serif;
  font-variation-settings:'wdth' 150;font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;
  color:#8a8a8a;white-space:nowrap}
@media (max-width:900px){#gate .levelbox{right:6vw;bottom:4vh;padding:11px 14px 9px;min-width:106px}
  #gate .levelbox .lvl{font-size:31px}#gate .levelbox .lvlname{font-size:8.5px;letter-spacing:.2em}}
