html, body { width: 100%; height: 100%; padding: 0; margin: 0; overflow: hidden; background: #0b0b12 }
#unity-container { position: fixed; inset: 0; width: 100vw; height: 100vh; background: #0b0b12 }
#unity-container.unity-desktop, #unity-container.unity-mobile { left: 0; top: 0; transform: none }
#unity-canvas { display: block; width: 100%; height: 100%; background: #0b0b12 }
#unity-container.unity-mobile #unity-canvas { width: 100%; height: 100% }
#unity-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none }

/* IDE-940: branded boot screen (Midnight Glass) shown while the wasm loads.
   Tokens mirror the login landing (web/index.html, kit screen 9). */
@font-face { font-family: Inter; font-weight: 400; src: url(boot-font-regular.otf) }
@font-face { font-family: Inter; font-weight: 600; src: url(boot-font-semibold.otf) }
@font-face { font-family: Inter; font-weight: 700 800; src: url(boot-font-bold.otf) }

#boot {
  position: fixed; inset: 0; z-index: 10;
  font-family: Inter, system-ui, -apple-system, sans-serif; color: #F1F3FA;
  display: grid; place-items: center;
  opacity: 1; transition: opacity .55s ease;
  -webkit-font-smoothing: antialiased;
}
#boot.out { opacity: 0; pointer-events: none; }
.boot-scene { position: absolute; inset: 0; background: #0A0F24 url(boot-room.svg) center / cover no-repeat; }
.boot-veil { position: absolute; inset: 0; background: radial-gradient(circle at 50% 50%, rgba(6,9,20,.30), rgba(6,9,20,.78)); }
.boot-card {
  position: relative; width: 340px; border-radius: 20px; text-align: center;
  background-color: rgba(18,25,54,.72);
  background-image: linear-gradient(180deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,0) 38%);
  -webkit-backdrop-filter: blur(20px) saturate(160%); backdrop-filter: blur(20px) saturate(160%);
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 18px 44px rgba(0,0,0,.50);
  padding: 26px 28px 22px;
  animation: bootIn .6s cubic-bezier(.34,1.28,.5,1) .1s backwards;
}
@keyframes bootIn {
  0%   { opacity: 0; transform: translateY(18px) scale(.97); }
  60%  { opacity: 1; transform: translateY(-3px) scale(1.005); }
  100% { opacity: 1; transform: none; }
}
.boot-logo {
  width: 52px; height: 52px; border-radius: 16px; margin: 0 auto 10px;
  background: rgba(242,166,90,.16); color: #F7BD82;
  display: grid; place-items: center;
}
.boot-logo svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.boot-title { font-size: 22px; font-weight: 800; letter-spacing: -.01em; }
.boot-tag { font-size: 13px; color: #9AA3C2; margin-top: 3px; }
.boot-track {
  height: 6px; border-radius: 3px; overflow: hidden; margin: 20px 4px 8px;
  background: rgba(255,255,255,.12); position: relative;
}
.boot-fill {
  position: absolute; inset: 0; border-radius: 3px; background: #F2A65A;
  transform: scaleX(0); transform-origin: 0 50%;
  transition: transform .3s cubic-bezier(.2,.9,.3,1);
}
/* indeterminate pulse until the first real progress event arrives */
#boot.waiting .boot-fill {
  animation: bootPulse 1.6s ease-in-out infinite;
  transition: none;
}
@keyframes bootPulse {
  0%   { transform: translateX(-100%) scaleX(.35); }
  50%  { transform: translateX(30%)  scaleX(.45); }
  100% { transform: translateX(160%) scaleX(.35); }
}
.boot-pct { font-size: 12px; font-weight: 600; color: #9AA3C2; min-height: 15px; }
.boot-tip {
  font-size: 12.5px; color: #9AA3C2; line-height: 1.45; min-height: 36px;
  margin: 10px auto 0; max-width: 260px;
  transition: opacity .25s ease;
}
.boot-tip.swap { animation: bootTipIn .35s cubic-bezier(.2,.9,.3,1); }
@keyframes bootTipIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
.boot-links { margin-top: 14px; display: flex; justify-content: center; }
.boot-link {
  display: inline-flex; align-items: center; height: 34px; padding: 0 16px;
  border-radius: 10px; background: rgba(255,255,255,.06); color: #F1F3FA;
  font-size: 13px; font-weight: 600; text-decoration: none;
  border: 1px solid rgba(255,255,255,.11); transition: background .15s;
}
.boot-link:hover { background: rgba(255,255,255,.10); }
#boot.out .boot-card { animation: none; }
@media (prefers-reduced-motion: reduce) {
  .boot-card, .boot-tip.swap { animation: none; }
  #boot.waiting .boot-fill { animation: none; transform: scaleX(.3); }
}