/* DESIGN CONTROLS — values are pixels on the 1920px desktop artwork.
   Desktop scales as one composition. Mobile has a separate layout below.
   Moving an artwork changes its painted position, never the text flow. */
:root {
  --video-height: 904;
  --transition-overlap: 40;
  /* The visible torn boundary lies about 60px into the transparent PNG. */
  --transition-edge-inset: 60;
  --oliver-x: -12;
  --oliver-y: 30;
  --oliver-width: 472;
  --logo-x: 0;
  --logo-y: 500;
  --logo-width: 832;
  --clown-x: 0;
  --clown-y: 0;
  --clown-width: 1290;
  /* PNG is already faded; 1 preserves its original transparency. */
  --clown-opacity: 1;
  --content-width: 1360;
  --what-ticket-x: 0;
  --what-ticket-y: 0;
  --what-ticket-scale: 1;
  --who-ticket-x: 0;
  --who-ticket-y: 0;
  --who-ticket-scale: 1;
  --book-x: 0;
  --book-y: 0;
  --book-scale: 1;
  --bullet-overlap: 80;
  --bullet-icon-x: 0;
  --bullet-icon-y: 0;
  --bullet-icon-scale: 1;
  --join-x: 0;
  --join-y: 0;
  --join-scale: 1;
  --heading-colour: #ffeb91;
}
/* Use phone-sized pixel adjustments here, independently of desktop. */
@media (max-width: 700px) {
  :root {
    --oliver-y: 30; --oliver-width: 210;
    --logo-y: 230; --logo-width: 370;
    --clown-y: 0; --clown-width: 650;
    --what-ticket-x: 0; --what-ticket-y: 0;
    --who-ticket-x: 0; --who-ticket-y: 0;
    --book-x: 0; --book-y: 0;
    --bullet-overlap: 32;
  }
}
