/* ============================================================
   base.css - design tokens, reset, page-level defaults
   ============================================================ */

:root{
  /* palette */
  --gold:#ffd873;
  --gold-deep:#e6a536;
  --pink:#ff6fa0;
  --sky:#4fd0ea;
  --ink:#241a33;
  --stage-void:#100a1c;

  /* surfaces */
  --panel-bg: rgba(14,10,26,0.62);
  --panel-bg-strong: rgba(10,7,20,0.78);

  /* typography */
  --font-display:'Mochiy Pop One', sans-serif;
  --font-body:'Zen Maru Gothic','Hiragino Maru Gothic ProN', sans-serif;

  /* the signature diagonal of the whole UI */
  --skew-angle:-8deg;

  /* The duo's footprint. It lives here rather than on .duo-wrap because
     the copy on the scrim has to stand clear of the pair, and works the
     required offset out from these two numbers. */
  --duo-left:11vw;
  --ny-w:min(86vh, 72vw);

  /* layer order */
  --z-curtain:5;
  --z-sparkle:6;
  --z-particle:8;
  --z-float:12;                 /* the diagonal scrim, behind the duo */
  --z-character:15;
  --z-panel:20;
  --z-bubble:30;
  --z-intro:100;
}

*{ box-sizing:border-box; }

html,body{
  margin:0;
  padding:0;
  width:100%;
  height:100%;
  overflow:hidden;              /* single screen, never scrolls */
  font-family:var(--font-body);
  color:#fff;
  background:var(--stage-void);
  -webkit-user-select:none;
  user-select:none;
}
