/* Portal boot presentation only. Removed when the native lobby opens. */
#portal-game-status {
  --boot-gold: #e9cc91;
  position: fixed;
  inset: 0;
  z-index: 100000;
  box-sizing: border-box;
  overflow: hidden auto;
  min-height: 100%;
  display: grid;
  grid-template-rows: auto 1fr auto;
  color-scheme: dark;
  color: #f7f1df;
  background: #081c29;
  font: 14px/1.7 'Be Vietnam Pro', Arial, sans-serif;
  text-align: center;
  touch-action: pan-y;
  isolation: isolate;
}
#portal-game-status * { box-sizing: border-box; }
#portal-game-status .boot-landscape {
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background: linear-gradient(180deg, #081c2966 0%, #081c2926 35%, #081c2966 65%, #081c29 100%),
    linear-gradient(90deg, #081c29ad, #0c30366b 48%, #081c298c),
    url('/portal/assets/sanctuary.jpg') center 46% / cover no-repeat;
}
#portal-game-status::after {
  content: '';
  position: absolute;
  inset: 16px;
  z-index: -1;
  border: 1px solid #e9cc9129;
  pointer-events: none;
}
#portal-game-status .boot-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: max(36px, env(safe-area-inset-top)) max(48px, env(safe-area-inset-right)) 0 max(48px, env(safe-area-inset-left));
}
#portal-game-status .boot-studio { font-size: 10px; letter-spacing: 3px; color: #fff4d8bd; }
#portal-game-status .boot-studio b { color: var(--boot-gold); font-size: 19px; vertical-align: -2px; margin-right: 8px; }
#portal-game-status .boot-home {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 7px 18px;
  border: 1px solid #e9cc914f;
  border-radius: 5px;
  color: #f5e5c5;
  background: #0b25395c;
  font-size: 12px;
  text-decoration: none;
}
#portal-game-status .boot-home span { font: 26px/1 Georgia, serif; }
#portal-game-status .boot-home:hover { background: #173d45; border-color: var(--boot-gold); }
#portal-game-status .boot-center {
  position: relative;
  align-self: center;
  width: min(640px, 90%);
  margin: 24px auto;
  padding: 65px 20px 50px;
}
#portal-game-status .boot-seal {
  position: absolute;
  width: 350px;
  height: 350px;
  left: calc(50% - 175px);
  top: calc(50% - 175px);
  border: 1px solid #efd7a53d;
  border-radius: 50%;
  background: radial-gradient(circle, #082e33a6, #082e3300 70%);
  z-index: -1;
  pointer-events: none;
}
#portal-game-status .boot-seal::before {
  content: '';
  position: absolute;
  inset: -15px;
  border: 1px solid #e9cc912e;
  border-top-color: #e9cc9180;
  border-bottom-color: #e9cc9180;
  border-radius: 50%;
  animation: boot-aura 6s ease-in-out infinite;
}
#portal-game-status .boot-seal::after {
  content: '✦';
  position: absolute;
  top: -14px;
  left: calc(50% - 9px);
  width: 18px;
  color: var(--boot-gold);
  font-size: 16px;
  text-shadow: 0 0 16px #ffd77a99;
}
#portal-game-status .boot-logo {
  position: relative;
  display: block;
  width: min(500px, 100%);
  height: auto;
  margin: 0 auto;
  filter: drop-shadow(0 8px 22px #061e36b3);
}
#portal-game-status .boot-ornament {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  margin: 24px auto 12px;
  color: var(--boot-gold);
  font-size: 20px;
}
#portal-game-status .boot-ornament span { width: 72px; height: 1px; background: linear-gradient(90deg, transparent, #e9cc9199); }
#portal-game-status .boot-ornament span:last-child { transform: rotate(180deg); }
#portal-game-status .boot-tagline { margin: 0; color: #f2e1bf; font: 400 18px/1.6 'Lora', Georgia, serif; letter-spacing: .7px; text-shadow: 0 2px 10px #031420; }
#portal-game-status .boot-bottom { width: min(420px, 86%); margin: 0 auto; padding: 12px 0 max(55px, calc(env(safe-area-inset-bottom) + 24px)); }
#portal-game-status .boot-activity { position: relative; width: 260px; max-width: 85%; height: 2px; overflow: hidden; margin: 0 auto 20px; background: #e9cc9130; }
#portal-game-status .boot-activity span { display: block; width: 45%; height: 100%; background: linear-gradient(90deg, transparent, #ffe0a2, transparent); animation: boot-flow 2.3s ease-in-out infinite; }
#portal-game-status .boot-message { min-height: 25px; margin: 0; color: #f6ead2; font-size: 13px; }
#portal-game-status .boot-caption { margin: 22px 0 0; font-size: 9px; letter-spacing: 2px; color: #b6c9c6a6; }
#portal-game-status .boot-retry { min-height: 46px; margin-top: 18px; padding: 10px 24px; border: 1px solid #f8dfa8; border-radius: 5px; background: linear-gradient(110deg, #f1d8a5, #cfab64); color: #18302f; font: inherit; font-size: 13px; cursor: pointer; }
#portal-game-status .boot-retry span { margin-left: 12px; }
#portal-game-status .boot-retry[hidden] { display: none; }
#portal-game-status .boot-retry:disabled { opacity: .6; cursor: wait; }
#portal-game-status :is(a, button):focus-visible { outline: 2px solid #fbe1a9; outline-offset: 5px; }
#portal-game-status[data-state=error] .boot-activity { visibility: hidden; }
#portal-game-status[data-state=error] .boot-caption { visibility: hidden; }
#portal-game-status[data-state=error] .boot-seal::before,
#portal-game-status[data-state=error] .boot-lights i { animation-play-state: paused; }
#portal-game-status .boot-lights { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
#portal-game-status .boot-lights i { position: absolute; left: 22%; top: 64%; width: 3px; height: 3px; border-radius: 50%; background: #f8db93; box-shadow: 0 0 12px 3px #eccb815c; animation: boot-drift 8s ease-in-out infinite; }
#portal-game-status .boot-lights i:nth-child(2) { left: 77%; top: 45%; animation-delay: -3s; }
#portal-game-status .boot-lights i:nth-child(3) { left: 60%; top: 80%; width: 2px; height: 2px; animation-delay: -6s; }
@keyframes boot-flow { from { transform: translateX(-110%); } to { transform: translateX(330%); } }
@keyframes boot-aura { 50% { opacity: .35; } }
@keyframes boot-drift { 0%, 100% { opacity: 0; transform: translate(0, 20px); } 45% { opacity: .85; } 90% { opacity: 0; transform: translate(18px, -65px); } }
@media (max-width: 600px) {
  #portal-game-status::after { inset: 9px; }
  #portal-game-status .boot-header { padding: max(22px, calc(env(safe-area-inset-top) + 10px)) max(24px, calc(env(safe-area-inset-right) + 12px)) 0 max(24px, calc(env(safe-area-inset-left) + 12px)); }
  #portal-game-status .boot-studio { font-size: 8px; letter-spacing: 2px; }
  #portal-game-status .boot-studio b { margin-right: 3px; }
  #portal-game-status .boot-home { padding: 5px 12px; font-size: 10px; gap: 6px; }
  #portal-game-status .boot-center { width: 96%; padding: 50px 15px 40px; }
  #portal-game-status .boot-seal { width: 250px; height: 250px; left: calc(50% - 125px); top: calc(50% - 125px); }
  #portal-game-status .boot-tagline { font-size: 14px; letter-spacing: 0; }
  #portal-game-status .boot-caption { font-size: 8px; letter-spacing: 1.5px; }
  #portal-game-status .boot-ornament { margin-top: 20px; }
  #portal-game-status .boot-bottom { padding-bottom: max(44px, calc(env(safe-area-inset-bottom) + 24px)); }
  #portal-game-status .boot-landscape { background-position: center, center, 61% center; }
}
@media (max-height: 550px) {
  #portal-game-status .boot-header { padding-top: max(15px, env(safe-area-inset-top)); }
  #portal-game-status .boot-center { margin: 10px auto; padding: 16px 20px; }
  #portal-game-status .boot-logo { width: 260px; }
  #portal-game-status .boot-seal { width: 180px; height: 180px; left: calc(50% - 90px); top: calc(50% - 90px); }
  #portal-game-status .boot-ornament { margin: 8px auto 4px; }
  #portal-game-status .boot-tagline { font-size: 10px; }
  #portal-game-status .boot-bottom { padding: 8px 0 max(20px, env(safe-area-inset-bottom)); }
  #portal-game-status .boot-activity { margin-bottom: 10px; }
  #portal-game-status .boot-caption { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  #portal-game-status *, #portal-game-status *::before { animation: none !important; }
  #portal-game-status .boot-activity span { width: 100%; opacity: .65; }
}