@font-face{
  font-family:"Skyfall Roboto";
  src:url("./assets/ui/fonts/roboto-variable.woff2?v=332863875520fa1d") format("woff2");
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
}
@font-face{
  font-family:"Skyfall Noto Sans CJK KR";
  src:url("./assets/ui/fonts/noto-sans-cjk-kr-regular.woff2?v=137f4cb27ef1ddd4") format("woff2");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:"Skyfall Roboto Mono";
  src:url("./assets/ui/fonts/roboto-mono-variable.woff2?v=5309dc6bdde4848b") format("woff2");
  font-style:normal;
  font-weight:100 700;
  font-display:swap;
}

:root{
  /*
   * Responsive scale is externally owned by the canonical viewport policy.
   * This stylesheet consumes that contract only; it never calculates viewport
   * size, aspect ratio, pointer/DPR tiers, or a fallback responsive curve.
   */
  /* Compatibility aliases for existing geometry consumers; no independent formula. */
  --sf-ui-scale:var(--sf-responsive-scale,1);
  --sf-spacing-scale:var(--sf-responsive-scale,1);

  --sf-ui-cyan:#43e8ff;
  --sf-ui-amber:#ffb302;
  --sf-ui-lime:#8dff5a;
  --sf-ui-danger:#ff3d81;
  --sf-ui-ink:#03070d;
  --sf-ui-surface:rgba(4,14,21,.94);
  --sf-ui-surface-soft:rgba(7,19,28,.78);
  --sf-ui-line:rgba(67,232,255,.22);
  --sf-ui-line-strong:rgba(67,232,255,.42);
  --sf-ui-text:#ecfaff;
  --sf-ui-text-muted:#7893a0;
  --sf-ui-shadow:0 28px 80px rgba(0,0,0,.48);
  --sf-ui-glow-cyan:0 0 26px rgba(67,232,255,.10);
  --sf-ui-glow-amber:0 0 24px rgba(255,179,2,.10);

  /* Global responsive geometry tokens. Authored component multipliers stay static. */
  --sf-space-xs:calc(6px * var(--sf-responsive-scale,1));
  --sf-space-sm:calc(10px * var(--sf-responsive-scale,1));
  --sf-space-md:calc(16px * var(--sf-responsive-scale,1));
  --sf-space-lg:calc(24px * var(--sf-responsive-scale,1));
  --sf-space-xl:calc(32px * var(--sf-responsive-scale,1));
  --sf-control-height-sm:calc(30px * var(--sf-responsive-scale,1));
  --sf-control-height-md:calc(40px * var(--sf-responsive-scale,1));
  --sf-control-height-lg:calc(48px * var(--sf-responsive-scale,1));
  --sf-control-height:var(--sf-control-height-md);
  --sf-dialog-padding-sm:calc(16px * var(--sf-responsive-scale,1));
  --sf-dialog-padding-md:calc(20px * var(--sf-responsive-scale,1));
  --sf-dialog-padding-lg:calc(24px * var(--sf-responsive-scale,1));
  --sf-dialog-gap:var(--sf-space-md);
  --sf-dialog-radius:calc(6px * var(--sf-responsive-scale,1));
  --sf-modal-padding:var(--sf-dialog-padding-md);
  --sf-modal-gap:var(--sf-dialog-gap);
  --sf-modal-radius:var(--sf-dialog-radius);
  --sf-page-padding-x:calc(28px * var(--sf-responsive-scale,1));
  --sf-page-padding-y:calc(18px * var(--sf-responsive-scale,1));
  --sf-page-gap:var(--sf-space-md);

  /* Compatibility aliases: existing consumers inherit the canonical scale. */
  --sf-ui-page-pad-x:var(--sf-page-padding-x);
  --sf-ui-page-pad-y:var(--sf-page-padding-y);
  --sf-ui-gap-1:var(--sf-space-xs);
  --sf-ui-gap-2:var(--sf-space-sm);
  --sf-ui-gap-3:var(--sf-space-md);
  --sf-ui-gap-4:var(--sf-space-lg);

  /* Canonical typography SSOT. Every role has one global responsive owner. */
  --sf-type-user-scale:1;
  --sf-ui-font-body:"Skyfall Roboto","Skyfall Noto Sans CJK KR",sans-serif;
  --sf-ui-font-display:var(--sf-ui-font-body);
  --sf-ui-font-data:"Skyfall Roboto Mono","Skyfall Noto Sans CJK KR",monospace;
  --sf-type-micro:calc(8.75px * var(--sf-responsive-scale,1) * var(--sf-type-user-scale));
  --sf-type-caption:calc(10px * var(--sf-responsive-scale,1) * var(--sf-type-user-scale));
  --sf-type-label:calc(11.25px * var(--sf-responsive-scale,1) * var(--sf-type-user-scale));
  --sf-type-body-sm:calc(12.5px * var(--sf-responsive-scale,1) * var(--sf-type-user-scale));
  --sf-type-body:calc(13.75px * var(--sf-responsive-scale,1) * var(--sf-type-user-scale));
  --sf-type-body-lg:calc(15px * var(--sf-responsive-scale,1) * var(--sf-type-user-scale));
  --sf-type-title-sm:calc(18.75px * var(--sf-responsive-scale,1) * var(--sf-type-user-scale));
  --sf-type-input:var(--sf-type-title-sm);
  --sf-type-title:calc(22.5px * var(--sf-responsive-scale,1) * var(--sf-type-user-scale));
  --sf-type-heading:calc(27.5px * var(--sf-responsive-scale,1) * var(--sf-type-user-scale));
  --sf-type-display:calc(35px * var(--sf-responsive-scale,1) * var(--sf-type-user-scale));
  --sf-type-hero:calc(47.5px * var(--sf-responsive-scale,1) * var(--sf-type-user-scale));
  --sf-ui-enter:cubic-bezier(.2,.75,.25,1);
}

/* New DOM inherits the global typography contract without page/root registration. */
:where(html,body){
  font-family:var(--sf-ui-font-body);
  font-size:var(--sf-type-body);
}
:where(button){
  font-family:inherit;
  font-size:var(--sf-type-body);
}
:where(input,select,textarea){
  font-family:inherit;
  font-size:var(--sf-type-input);
}

/* First-paint boot gate: never expose the simulated battle surface before the canonical game-boot ready event. */
html:not([data-sf-gameboot-ready="true"]) #gl{visibility:hidden!important}
