:root{
  --viewer-width:100vw;
  --viewer-height:100dvh;
  --header-height:140px;
  --footer-height:150px;
  --background-square-size:min(100vw,calc(100dvh - var(--header-height) - var(--footer-height)));
  --portal-square:var(--background-square-size);
  --layer-bg:0;
  --layer-machine:20;
  --layer-hud:30;
  --layer-controls:40;
  --layer-utility:50;
  --layer-nav:60;
  --layer-modal:70;
}
html.gateway-viewer-root,body.gateway-viewer{
  width:100%;height:100%;min-width:0;min-height:0;margin:0!important;padding:0!important;
  overflow:hidden!important;overscroll-behavior:none;
}
body.gateway-viewer{position:relative;background:#030304}

/* One square background plane shared by every realm. */
.gateway-global-bg{
  position:fixed;top:var(--header-height);right:0;bottom:var(--footer-height);left:0;
  z-index:var(--layer-bg);pointer-events:none;overflow:hidden;background:#030304;
}
.gateway-global-bg__image,
.gateway-global-bg__shade{
  position:absolute;left:50%;top:50%;
  width:var(--background-square-size);height:var(--background-square-size);
  transform:translate(-50%,-50%);
}
.gateway-global-bg__image{background-position:center;background-repeat:no-repeat;background-size:contain}
.gateway-global-bg__shade{background:linear-gradient(180deg,rgba(2,2,4,.08),rgba(2,2,4,.22))}
body.gateway-viewer>.bed,body.gateway-viewer>.viewer-bed{visibility:hidden!important;pointer-events:none!important}

/* One viewport contract. */
.gateway-global-shell{
  position:relative!important;z-index:var(--layer-hud);width:var(--viewer-width)!important;height:var(--viewer-height)!important;
  min-width:0!important;min-height:0!important;max-width:none!important;margin:0!important;padding:0!important;
  display:grid!important;grid-template-rows:var(--header-height) minmax(0,1fr) var(--footer-height)!important;
  overflow:hidden!important;box-sizing:border-box!important;
}
.gateway-global-header{
  position:relative;z-index:var(--layer-hud);min-width:0;min-height:0!important;overflow:hidden!important;
  display:flex!important;align-items:flex-start!important;justify-content:center!important;
  padding:8px 8px 0!important;border:0!important;background:#030304!important;backdrop-filter:none!important;
}

/* Global top viewer — reference/Figma target. */
.gateway-reference-console{
  position:relative;width:calc(100vw - 16px);height:124px;box-sizing:border-box;overflow:hidden;
  border:1px solid rgba(126,76,171,.24);border-radius:8px;
  background:
    linear-gradient(180deg,rgba(7,6,10,.995),rgba(2,2,4,.99)),
    repeating-linear-gradient(90deg,transparent 0 44px,rgba(107,67,143,.018) 45px 46px);
  box-shadow:inset 0 0 0 1px rgba(231,197,71,.025),inset 0 0 34px rgba(111,61,153,.055);
  color:#efeeee;font-family:ui-monospace,Menlo,Consolas,system-ui,sans-serif;
}
.gateway-reference-led{position:absolute;width:4px;height:4px;border-radius:50%;background:#a35ee0;box-shadow:0 0 9px rgba(168,92,226,.7)}
.gateway-reference-led--tl{left:7px;top:12px}.gateway-reference-led--tr{right:7px;top:12px}
.gateway-reference-led--bl{left:7px;bottom:11px}.gateway-reference-led--br{right:7px;bottom:11px}
.gateway-reference-title-row{
  position:absolute;left:20px;right:20px;top:11px;height:38px;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  border:1px solid rgba(140,92,181,.27);border-radius:6px;
  background:linear-gradient(180deg,rgba(9,7,12,.93),rgba(4,3,6,.94));
  box-shadow:inset 0 0 22px rgba(95,48,138,.055);
}
.gateway-reference-title{
  width:calc(100% - 34px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;
  font-size:clamp(11px,1.45vw,20px);font-weight:800;line-height:1;letter-spacing:.075em;text-transform:uppercase;
  text-shadow:0 0 10px rgba(220,210,229,.1);
}
.gateway-reference-title span{color:#f0efed}.gateway-reference-title strong{color:#b986dd;font-weight:800}.gateway-reference-title b{padding:0 .46em;color:#8d6a9f;font-weight:600}
.gateway-reference-ready-row{
  position:absolute;left:20px;right:20px;top:57px;height:32px;
  display:flex;align-items:center;justify-content:space-between;padding:0 10px;box-sizing:border-box;
  border-top:1px solid rgba(138,88,171,.11);border-bottom:1px solid rgba(138,88,171,.11);
  background:linear-gradient(90deg,rgba(7,6,9,.92),rgba(3,3,5,.64),rgba(7,6,9,.92));
}
.gateway-reference-ready-copy{
  display:flex;align-items:center;gap:.7rem;font-size:clamp(8px,.88vw,12px);font-weight:800;
  letter-spacing:.15em;text-transform:uppercase;color:#f0efef;
}
.gateway-reference-ready-copy b{color:#79667f;font-weight:800}.gateway-reference-ready-copy strong{color:#f2f1f2}
.gateway-reference-ready-tick{display:block;width:3px;height:13px;background:#ddd9e0;box-shadow:0 0 7px rgba(213,199,224,.28)}
.gateway-reference-signal-row{
  position:absolute;left:20px;right:20px;bottom:8px;height:19px;
  display:flex;align-items:center;justify-content:center;
  border-top:1px solid rgba(122,74,160,.09);
  color:#54385e;font-size:7px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
}
.gateway-reference-signal-copy{white-space:nowrap}.gateway-reference-signal-copy b{color:#5e3a6d}.gateway-reference-signal-copy strong{color:#684071}
.gateway-reference-layer{
  position:absolute;right:4px;top:50%;transform:translateY(-50%);
  display:flex;align-items:center;gap:5px;color:#72517d;
}
.gateway-reference-layer--portal{display:none}
.gateway-reference-layer>span{font-size:5px;letter-spacing:.12em}.gateway-reference-layer>strong{font-size:7px;color:#9167a4}
.gateway-reference-layer-controls{display:flex;align-items:center}
.gateway-reference-layer-chips{display:flex!important;gap:3px!important;margin:0!important;justify-content:flex-end!important}
.gateway-reference-layer-chips button{
  min-height:0!important;padding:2px 5px!important;border-radius:8px!important;
  border:1px solid rgba(139,92,196,.24)!important;background:rgba(5,4,7,.78)!important;
  font-size:5px!important;line-height:1!important;color:#8d7a95!important;
}
.gateway-reference-layer-chips button.active{color:#e9e2ed!important;border-color:rgba(182,129,222,.42)!important}

.gateway-global-stage{
  position:relative;z-index:var(--layer-machine);min-width:0;min-height:0!important;height:auto!important;
  overflow:hidden!important;display:flex!important;align-items:center!important;justify-content:center!important;
}
.gateway-global-stage--generated{display:block!important}
.gateway-global-content{
  position:relative;z-index:var(--layer-controls);width:100%;height:100%;min-width:0;min-height:0;
  overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;box-sizing:border-box;
}
.gateway-global-footer{
  position:relative;z-index:var(--layer-utility);min-width:0;min-height:0!important;height:auto!important;
  overflow:hidden!important;border-top:1px solid rgba(101,60,134,.18);
  background:linear-gradient(180deg,rgba(5,4,7,.985),rgba(2,2,4,.997));backdrop-filter:none!important;box-sizing:border-box;
}
.gateway-global-utility{
  position:absolute;left:1rem;right:1rem;bottom:.45rem;display:flex;justify-content:space-between;align-items:center;
  z-index:var(--layer-utility);font-size:.52rem;letter-spacing:.12em;text-transform:uppercase;
}
.gateway-global-utility a{color:#9d9a91;text-decoration:none}.gateway-global-utility a:hover{color:#d7b557}

/* Generated functional/utility pages remain inside the stage. */
.gateway-viewer .gateway-global-content>.portal-shell,
.gateway-viewer .gateway-global-content>.arc,
.gateway-viewer .gateway-global-content>.matrix{
  height:100%!important;min-height:0!important;max-width:none!important;overflow:auto!important;box-sizing:border-box!important;
  background-color:transparent!important;background-image:none!important;background-attachment:scroll!important;
}
.gateway-viewer .gateway-global-content>.portal-shell{width:min(1100px,100%)!important;margin:0 auto!important;padding-bottom:1rem!important}
.gateway-viewer[data-realm="arcana"] .grid{grid-template-columns:minmax(220px,32%) minmax(0,1fr)!important;height:auto!important;min-height:0!important}
.gateway-viewer[data-realm="arcana"] .top{flex-direction:row!important;align-items:center!important}
.gateway-viewer[data-realm="crystal-matrix"] .viewer{grid-template-columns:minmax(220px,42%) minmax(0,1fr)!important}
.gateway-viewer[data-realm="crystal-matrix"] .top{flex-direction:row!important;align-items:center!important}

/* Realm landing pages retain their functional content but use the global top plane. */
.gateway-global-shell--landing .viewer-stage{min-height:0!important;height:auto!important;padding:clamp(.4rem,1.3dvh,.8rem)!important}
.gateway-global-shell--landing .viewer-bottom{min-height:0!important;max-height:none!important;overflow:auto!important;padding:.55rem .9rem .7rem!important}
.gateway-global-shell--landing .viewer-bed{visibility:hidden!important}

/* Portal is the Figma 1960 square, centered, with no second background copy. */
.gateway-global-shell--portal .stage{
  min-height:0!important;height:auto!important;padding:0!important;overflow:hidden!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
}
.gateway-global-shell--portal .field{
  width:var(--portal-square)!important;height:var(--portal-square)!important;
  max-width:none!important;max-height:none!important;aspect-ratio:1/1!important;
}
.gateway-viewer[data-realm="portal"] .gateway-global-bg__image{opacity:0!important}
.gateway-viewer[data-realm="portal"] .gateway-global-bg__shade{background:#030304!important}
.gateway-global-shell--portal .vol-dock{
  position:absolute!important;top:50%!important;right:0!important;transform:translateY(-50%);
  z-index:var(--layer-utility)
}
.gateway-viewer[data-realm="portal"] .portal-utility{display:flex!important;pointer-events:none}
.gateway-viewer[data-realm="portal"] .portal-utility a{pointer-events:auto}
.gateway-viewer[data-realm="portal"] .legal-slim{display:block!important}

/* Portal dock: reference 6x2 realm plate. */
.gateway-viewer .gw-universal-nav{z-index:var(--layer-nav)}
.gateway-global-shell--portal .gw-universal-nav{
  position:absolute!important;left:50%!important;right:auto!important;top:7px!important;bottom:20px!important;
  width:calc(100vw - 16px)!important;max-width:none!important;height:auto!important;
  transform:translateX(-50%)!important;margin:0!important;pointer-events:none!important;
}
.gateway-global-shell--portal .gw-universal-nav__panel{pointer-events:none!important}
.gateway-global-shell--portal .gw-universal-nav__grid>a{pointer-events:auto!important}
.gateway-global-shell--portal .gw-universal-nav__toggle{display:none!important}
.gateway-global-shell--portal .gw-universal-nav__panel{
  display:block!important;position:static!important;left:auto!important;transform:none!important;
  width:100%!important;height:100%!important;margin:0!important;padding:8px 16px 6px!important;box-sizing:border-box!important;
  border:1px solid rgba(122,74,160,.22)!important;border-radius:8px!important;
  background:linear-gradient(180deg,rgba(6,5,8,.98),rgba(2,2,4,.995))!important;
  box-shadow:inset 0 0 24px rgba(94,48,133,.055)!important;backdrop-filter:none!important;
}
.gateway-global-shell--portal .gw-universal-nav__panel::before,
.gateway-global-shell--portal .gw-universal-nav__panel::after{
  content:"";position:absolute;top:12px;width:4px;height:4px;border-radius:50%;background:#9d5ed3;box-shadow:0 0 8px rgba(165,88,223,.6)
}
.gateway-global-shell--portal .gw-universal-nav__panel::before{left:8px}
.gateway-global-shell--portal .gw-universal-nav__panel::after{right:8px}
.gateway-global-shell--portal .gw-universal-nav__grid{
  width:auto!important;height:100%!important;max-width:100%!important;aspect-ratio:1774/887!important;
  margin:0 auto!important;display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;grid-template-rows:repeat(2,minmax(0,1fr))!important;
  gap:0!important;align-items:center!important;
}
.gateway-global-shell--portal .gw-universal-nav__grid>a{
  width:min(72%,3.8rem)!important;height:auto!important;max-height:100%!important;aspect-ratio:1/1!important;
  align-self:center!important;justify-self:center!important;
}
.gateway-global-shell--portal .gw-universal-nav__readout{display:none!important}
.gateway-viewer [role="dialog"],.gateway-viewer .modal,.gateway-viewer .overlay{z-index:var(--layer-modal)}

/* Non-Portal REALMS pull-up: above footer utility, below dialogs. */
.gateway-global-shell>.gw-universal-nav--pullup{
  position:absolute;left:50%;right:auto;top:auto;bottom:calc(var(--footer-height) - 1px);
  transform:translateX(-50%);z-index:var(--layer-nav);width:min(46rem,calc(100vw - 8px));max-width:calc(100vw - 8px);
  height:auto;margin:0;display:flex;flex-direction:column-reverse;align-items:center;pointer-events:none;
}
.gateway-global-shell>.gw-universal-nav--pullup .gw-universal-nav__toggle{
  pointer-events:auto;position:relative;top:0;min-width:5.5rem;min-height:44px;margin:0;
  border-radius:8px 8px 0 0;touch-action:manipulation;
}
.gateway-global-shell>.gw-universal-nav--pullup .gw-universal-nav__panel{
  pointer-events:auto;position:relative;left:auto;transform:none;width:100%;margin:0;
  padding:8px 12px 6px;box-sizing:border-box;border:1px solid rgba(122,74,160,.28);border-radius:8px;
  background:linear-gradient(180deg,rgba(6,5,8,.98),rgba(2,2,4,.995));
  box-shadow:inset 0 0 24px rgba(94,48,133,.08),0 16px 40px rgba(0,0,0,.5);backdrop-filter:none;
}
.gateway-global-shell>.gw-universal-nav--pullup:not(.open) .gw-universal-nav__panel{display:none}
.gateway-global-shell>.gw-universal-nav--pullup.open .gw-universal-nav__panel{display:block}
/* Popup keeps the Portal's compact 12-symbol plate scale, rather than
   stretching the approved sprite across a large 52rem-wide menu. */
.gateway-global-shell>.gw-universal-nav--pullup .gw-universal-nav__grid{
  width:100%;
  max-width:100%;
  height:clamp(104px,10dvh,128px);
  min-height:0;
  aspect-ratio:auto;
  margin:0 auto;
  grid-template-columns:repeat(6,minmax(0,1fr));
  grid-template-rows:repeat(2,minmax(0,1fr));
}
.gateway-global-shell>.gw-universal-nav--pullup .gw-universal-nav__grid>a{
  width:min(72%,3.8rem);
  height:auto;
  min-width:0;
  min-height:0;
  aspect-ratio:1;
  align-self:center;
  justify-self:center;
}
.gateway-global-shell>.gw-universal-nav--pullup .gw-universal-nav__readout{display:block}

@media(max-width:760px){
  :root{--header-height:122px;--footer-height:122px}
  .gateway-global-header{padding:5px 4px 0!important}
  .gateway-reference-console{width:calc(100vw - 8px);height:109px;border-radius:6px}
  .gateway-reference-title-row{left:11px;right:11px;top:7px;height:34px}
  .gateway-reference-title{font-size:clamp(8px,3vw,12px);letter-spacing:.04em}
  .gateway-reference-title b{padding:0 .22em}
  .gateway-reference-ready-row{left:11px;right:11px;top:47px;height:31px;padding:0 7px}
  .gateway-reference-ready-copy{gap:.4rem;font-size:7px;letter-spacing:.1em}
  .gateway-reference-signal-row{left:11px;right:11px;bottom:6px;height:16px;font-size:5px;letter-spacing:.1em}
  .gateway-reference-layer{right:1px}
  .gateway-reference-layer>span{display:none}
  .gateway-reference-layer-chips button{padding:2px 3px!important;font-size:4px!important}
  .gateway-global-shell--portal .gw-universal-nav{top:6px!important;bottom:17px!important;width:calc(100vw - 8px)!important}
  .gateway-global-shell--portal .gw-universal-nav__panel{padding:5px 6px 4px!important}
  .gateway-global-shell--portal .gw-universal-nav__grid>a{width:min(76%,3rem)!important}
}
@media(max-height:720px){
  :root{--header-height:116px;--footer-height:112px}
  .gateway-reference-console{height:104px}
  .gateway-reference-title-row{top:6px;height:32px}
  .gateway-reference-ready-row{top:44px;height:29px}
  .gateway-reference-signal-row{bottom:5px;height:16px}
  .gateway-global-shell--portal .gw-universal-nav{top:5px!important;bottom:16px!important}
  .gateway-global-shell--portal .legal-slim{font-size:.42rem}
  .gateway-global-shell--portal .portal-utility{font-size:.46rem}
}

/* Desktop/tablet Portal: reclaim header/footer height for the square and overlay viewer chrome on the background edges. */
@media(min-width:761px){
  .gateway-global-shell--portal{
    --portal-square:min(100vw,100dvh);
    display:block!important;
    position:relative!important;
  }
  .gateway-global-shell--portal .gateway-global-header{
    background:transparent!important;
    backdrop-filter:none!important;
  }
  .gateway-global-shell--portal .gateway-reference-console{
    background:
      linear-gradient(180deg,rgba(7,6,10,.82),rgba(2,2,4,.76)),
      repeating-linear-gradient(90deg,transparent 0 44px,rgba(107,67,143,.010) 45px 46px)!important;
    backdrop-filter:blur(2px) saturate(1.02)!important;
    -webkit-backdrop-filter:blur(2px) saturate(1.02)!important;
  }
  .gateway-global-shell--portal .gateway-reference-title-row{
    background:linear-gradient(180deg,rgba(9,7,12,.82),rgba(4,3,6,.76))!important;
  }
  .gateway-global-shell--portal .gateway-reference-ready-row{
    background:linear-gradient(90deg,rgba(7,6,9,.76),rgba(3,3,5,.62),rgba(7,6,9,.76))!important;
  }
  .gateway-global-shell--portal .gateway-global-footer{
    background:transparent!important;
    border-top-color:transparent!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  .gateway-global-shell--portal .gw-universal-nav__panel{
    background:transparent!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  .gateway-global-shell--portal .gateway-global-stage{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .gateway-global-shell--portal .gateway-global-header{
    position:absolute!important;
    left:50%!important;
    top:calc((100dvh - var(--portal-square))/2)!important;
    width:var(--portal-square)!important;
    height:var(--header-height)!important;
    transform:translateX(-50%)!important;
    box-sizing:border-box!important;
  }
  .gateway-global-shell--portal .gateway-reference-console{
    width:calc(100% - 16px)!important;
  }
  .gateway-global-shell--portal .gateway-global-footer{
    position:absolute!important;
    left:50%!important;
    bottom:calc((100dvh - var(--portal-square))/2)!important;
    width:var(--portal-square)!important;
    height:var(--footer-height)!important;
    transform:translateX(-50%)!important;
    box-sizing:border-box!important;
  }
  .gateway-global-shell--portal .gw-universal-nav{
    width:calc(100% - 16px)!important;
    max-width:none!important;
  }
}


/* Universal realm-specific lower information glass, shared by the V5-stack viewer.
   The existing navigation and utility footer remain functional above this backdrop. */
.gateway-global-footer .gateway-bottom-reference-console{
  position:absolute;
  inset:8px 8px 27px;
  z-index:2;
  box-sizing:border-box;
  display:grid;
  grid-template-rows:auto 1fr;
  gap:5px;
  padding:9px 16px;
  overflow:hidden;
  pointer-events:none;
  border:1px solid rgba(126,76,171,.26);
  border-radius:8px;
  background:linear-gradient(180deg,rgba(7,6,10,.86),rgba(2,2,4,.81));
  box-shadow:inset 0 0 0 1px rgba(231,197,71,.02),inset 0 0 34px rgba(111,61,153,.06);
  backdrop-filter:blur(2px) saturate(1.02);
  -webkit-backdrop-filter:blur(2px) saturate(1.02);
  color:#efeeee;
  font-family:ui-monospace,Menlo,Consolas,system-ui,sans-serif;
  text-align:center;
}
.gateway-bottom-reference-title{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding-bottom:5px;
  border-bottom:1px solid rgba(140,92,181,.25);
  font-size:clamp(8px,1vw,13px);
  letter-spacing:.11em;
  font-weight:800;
}
.gateway-bottom-reference-line{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:1rem;
  min-width:0;
  color:#b986dd;
  font-size:clamp(7px,.9vw,11px);
  letter-spacing:.11em;
  text-transform:uppercase;
}
.gateway-bottom-reference-line>strong{color:#f0efed}
.gateway-bottom-reference-line>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gateway-global-footer .gateway-global-utility,
.gateway-global-footer .portal-utility,
.gateway-global-footer .legal-slim{z-index:5}
.gateway-global-shell--portal .gw-universal-nav{z-index:6!important}
@media(max-width:760px){
 .gateway-global-footer .gateway-bottom-reference-console{inset:5px 5px 18px;padding:7px}
 .gateway-bottom-reference-title{font-size:8px}
 .gateway-bottom-reference-line{font-size:7px;gap:.4rem}
}


/* CANONICAL PORTAL VIEWER GEOMETRY
   One square reference, one inset, one positioning model.
   Both panels are absolutely centered inside equally sized header/footer
   boxes. Pin matching left/right edges; no per-panel translation. */
.gateway-global-shell--portal{
  --gateway-viewer-inset:8px;
  /* The same left/right insets apply within equal-sized header/footer boxes. */
}
/* The portal adopts legacy .v4-top and .v4-bot elements.
   The original inline .v4-bot rule retains .85rem side padding.
   Absolutely positioned children use the padding box as their containing
   block, so matching 8px insets alone did NOT mean matching edges. */
.gateway-global-shell--portal .gateway-global-header,
.gateway-global-shell--portal .gateway-global-footer{
  padding-left:0!important;
  padding-right:0!important;
}
.gateway-global-shell--portal .gateway-global-footer{
  padding-top:0!important;
  padding-bottom:0!important;
}
.gateway-global-shell--portal .gateway-global-header .gateway-reference-console,
.gateway-global-shell--portal .gateway-global-footer .gateway-bottom-reference-console{
  position:absolute!important;
  box-sizing:border-box!important;
  left:var(--gateway-viewer-inset)!important;
  right:var(--gateway-viewer-inset)!important;
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  transform:none!important;
}
.gateway-global-shell--portal .gateway-global-header .gateway-reference-console{
  top:8px;
}
.gateway-global-shell--portal .gateway-global-footer .gateway-bottom-reference-console{
  top:7px;
  bottom:22px;
  z-index:2;
  padding-top:6px;
  background:linear-gradient(180deg,rgba(7,6,10,.56),rgba(2,2,4,.73));
}
.gateway-global-shell--portal .gateway-global-footer .gw-universal-nav,
.gateway-global-shell--portal .gateway-global-footer .gw-universal-nav__panel{
  z-index:7!important;
}
.gateway-global-shell--portal .gateway-global-footer .gateway-bottom-reference-title{
  font-size:clamp(7px,.78vw,10px);
  padding-bottom:3px;
}
@media(max-width:760px){
  .gateway-global-shell--portal{--gateway-viewer-inset:4px}
  .gateway-global-shell--portal .gateway-global-header .gateway-reference-console{top:5px}
  .gateway-global-shell--portal .gateway-global-footer .gateway-bottom-reference-console{top:5px;bottom:18px}
}

/* Realm footer system modes: INFORMATION <-> REALMS.
   This is an in-place screen swap, never a floating menu or overlay. */
.gateway-global-footer .gw-universal-nav--footer-mode{
  position:absolute!important;
  inset:0!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  top:0!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  margin:0!important;
  transform:none!important;
  display:block!important;
  pointer-events:none!important;
  z-index:8!important;
}
.gateway-global-footer .gw-universal-nav--footer-mode .gw-universal-nav__toggle{
  display:block!important;
  position:absolute!important;
  bottom:0!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  z-index:2!important;
  min-width:6.5rem;
  height:25px;
  min-height:25px;
  padding:3px 12px;
  border-radius:7px 7px 0 0;
  pointer-events:auto!important;
}
.gateway-global-footer .gw-universal-nav--footer-mode .gw-universal-nav__panel{
  display:none!important;
  position:absolute!important;
  inset:5px 8px 26px!important;
  left:8px!important;
  transform:none!important;
  width:auto!important;
  height:auto!important;
  max-width:none!important;
  margin:0!important;
  padding:4px 12px!important;
  box-sizing:border-box!important;
  border:1px solid rgba(126,76,171,.26)!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,rgba(7,6,10,.56),rgba(2,2,4,.73))!important;
  pointer-events:auto!important;
  overflow:hidden!important;
}
.gateway-global-footer--navigation .gw-universal-nav--footer-mode .gw-universal-nav__panel{
  display:flex!important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.gateway-global-footer--navigation .gateway-bottom-reference-console{
  visibility:hidden!important;
  pointer-events:none!important;
}
.gateway-global-footer .gw-universal-nav--footer-mode .gw-universal-nav__grid{
  display:grid!important;
  /* Approved sprite is 1774:887 (2:1). Keep the hit-target grid
     exactly over the rendered artwork at any footer height. */
  width:min(100%,calc((var(--footer-height) - 44px) * 2))!important;
  height:auto!important;
  max-height:100%!important;
  min-height:0!important;
  aspect-ratio:1774/887!important;
  margin:0 auto!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  grid-template-rows:repeat(2,minmax(0,1fr))!important;
}
.gateway-global-footer .gw-universal-nav--footer-mode .gw-universal-nav__grid>a{
  width:min(72%,3.8rem)!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:1!important;
  align-self:center!important;
  justify-self:center!important;
}
.gateway-global-footer .gw-universal-nav--footer-mode .gw-universal-nav__readout{
  display:none!important;
}
@media(max-width:760px){
  .gateway-global-footer .gw-universal-nav--footer-mode .gw-universal-nav__panel{
    inset:4px 4px 26px!important;
    left:4px!important;
    padding:3px 5px!important;
  }
  .gateway-global-footer .gw-universal-nav--footer-mode .gw-universal-nav__grid>a{
    width:min(76%,3rem)!important;
  }
}

/* Footer navigation is a real console mode: the two screens occupy the
   identical inset rectangle, with one visible at a time. */
.gateway-global-footer .gw-universal-nav--footer-mode .gw-universal-nav__panel{
  inset:5px 8px 26px!important;
  border-radius:8px!important;
}
.gateway-global-footer--navigation .gateway-bottom-reference-console{
  display:none!important;
}
.gateway-global-footer--navigation .gw-universal-nav--footer-mode .gw-universal-nav__panel{
  display:flex!important;
}
.gateway-global-footer .gw-universal-nav--footer-mode .gw-universal-nav__toggle:focus-visible{
  outline:2px solid #e8c547;
  outline-offset:2px;
}
@media(max-width:760px){
  .gateway-global-footer .gw-universal-nav--footer-mode .gw-universal-nav__panel{
    inset:4px 4px 26px!important;
  }
}