@font-face{
  font-family:'Inter Tight';
  font-style:normal;
  font-weight:100 1000;
  font-display:swap;
  src:url('../assets/fonts/inter/inter-tight.woff2') format('woff2');
}

@font-face{
  font-family:'Acumin Pro Condensed';
  src:url('../assets/fonts/AcuminProCondensed.ttf') format('truetype');
  font-weight:300 900;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:'DIN Bold';
  src:url('../assets/fonts/DIN-Bold.ttf') format('truetype');
  font-weight:700;
  font-style:normal;
  font-display:swap;
}

*{margin:0;padding:0;box-sizing:border-box;}
html,body{
  width:100%;height:100%;overflow:hidden;
  background:#242424;
  display:flex;justify-content:center;align-items:center;
  touch-action:none;-webkit-tap-highlight-color:transparent;
  user-select:none;-webkit-user-select:none;
}
:root{
  --font:'Acumin Pro Condensed','Barlow Condensed','Arial Narrow',sans-serif;
  --c1:#FF4B6E;--c2:#FF6B35;--c3:#4ECDC4;--c4:#C5F135;
  --c5:#4FB3FF;--c6:#FF9F43;--c7:#A29BFE;--c8:#FD79A8;
  --bg:#242424;
  --splash-bg:#000000;
}

/* ── APP SHELL ── */
#app{
  position:absolute;
  width:1080px;height:1920px;
  transform-origin:top left;
  overflow:hidden;
}
#gc{
  position:absolute;inset:0;
  width:1080px;height:1920px;
  display:block;
}

/* ── SHARED SCREEN BASE ── */
.screen{
  position:absolute;inset:0;
  display:flex;flex-direction:column;
  align-items:center;
  font-family:var(--font);
  z-index:10;
  transition:opacity .35s ease, transform .35s ease;
}
.screen.off{opacity:0;pointer-events:none;transform:translateY(60px);}
.screen.on{opacity:1;pointer-events:all;transform:translateY(0);}