/* The Northline Office entrance, ported unchanged from vox/voxel.css (the gate rules),
   plus the corner toggle from assets/traditional-view.js. Only the gate lives here. */
html.gated,html.gated body{overflow:hidden}
.gate{position:fixed;inset:0;z-index:30;display:grid;place-items:center;background-color:#0c0c0c;color:#f2f0ea;
  background-image:radial-gradient(#232323 1.1px,transparent 1.3px);background-size:7px 7px;transition:opacity .6s ease;
  font-family:'Instrument Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.gate.gone{opacity:0}
.gate .bits i{position:absolute;width:14px;height:14px}
.gate .inner{position:relative;width:min(760px,84vw,calc((100vh - 230px)*1.3))}
.gate .mk{display:block;width:100%;height:auto}
.gate .row{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-top:min(52px,5vh);flex-wrap:wrap}
.gate .nm{font-size:clamp(28px,3.1vw,38px);font-weight:600;line-height:1.06;letter-spacing:-.012em}
.gate .nm span{color:#8c8c8c;font-weight:500}
.gate .en{width:min(300px,100%)}
.gate .enter{display:flex;align-items:center;justify-content:space-between;width:100%;height:62px;box-sizing:border-box;padding:0 22px;
  background:#474747;color:#fff;border:0;font:600 17px/1 'Instrument Sans',system-ui,sans-serif;letter-spacing:.01em;cursor:pointer;text-decoration:none;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.28)}
.gate .enter:hover{background:#5a5a5a}
.gate .enter:focus-visible{outline:3px solid #f0c419;outline-offset:3px}
.gate .ar{width:18px;height:16px}
.gate-3d{position:fixed;top:calc(10px + env(safe-area-inset-top));right:12px;z-index:31;display:flex;align-items:center;gap:8px;text-decoration:none}
.gate-3d .face{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(12,12,12,.72);
  box-shadow:0 0 0 1px rgba(255,255,255,.2),0 4px 14px rgba(0,0,0,.5);font-size:22px;line-height:1;transition:transform .15s ease}
.gate-3d:hover .face{transform:scale(1.08)}
.gate-3d .tip{padding:8px 11px;background:#0c0c0c;color:#f2f0ea;font:500 13px/1 system-ui,-apple-system,sans-serif;white-space:nowrap;
  box-shadow:0 0 0 1px rgba(255,255,255,.2);opacity:0;transform:translateX(6px);transition:opacity .15s ease,transform .15s ease;pointer-events:none}
.gate-3d:hover .tip,.gate-3d:focus-visible .tip{opacity:1;transform:none}
.gate-3d:focus-visible{outline:none}.gate-3d:focus-visible .face{outline:3px solid #f0c419;outline-offset:2px}
@media (max-width:700px){
  .gate .row{margin-top:32px}
  .gate .en{width:100%}
}
