@font-face {
  font-family: 'Scratch';
  src: url('/Scratch.woff2') format('woff2');
}

* {
  user-select: none;
  cursor: default;
}

html, body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  margin: 0;
}

body {
  background: #0d0d10;
  font-family: 'Scratch', sans-serif;
  font-weight: 400;
  -webkit-text-stroke: 0.3px currentColor;
  text-shadow: 0 0 0.5px currentColor;
  color: #000;
}

#page {
  position: fixed;
  background-image: url('/img/desktop.jpg');
  background-repeat: no-repeat;
}

body.portrait #bg {
  transform: rotate(-90deg);
}

/* ── Default classes for AddText elements ── */

.page-logo, .p-title-1, .p-title-2, .p-title-3 {
  color: #000000ee;
}
.section{
  font-size: calc(1.8 * var(--sq));
  color:#4E00C2;
}
.subsect{
  font-size: calc(1.1 * var(--sq));
  color:#175B80;
}
.blurb{
  font-size: calc(1.0 * var(--sq));
  color:#000;
}

.nope{
  font-size: calc(1.2 * var(--sq));
  color:#77777777;
}
.note{
  font-size: calc(0.7 * var(--sq));
  color:#bb1111cc;
}

.disc{
  font-size: calc(0.8 * var(--sq));
  color:#000000aa;
}

.phone-shadow, .phone-img, .phone-canvas, .preview-canvas {
  pointer-events: none;
  position: fixed;
}

.preview-canvas {
  display: none;
}

.logo-hr {
  pointer-events: none;
  transform-origin: left center;
  transform: scaleX(20);
}

.tagline {
  pointer-events: none;
  color: #0300B6;
}

.gly, .glg, .glb, .glm {
  font-size: calc(2.2 * var(--sq));
  text-decoration: none;
  transition: color 0.4s, background 0.4s, -webkit-text-stroke 2.4s;
  mix-blend-mode: multiply;
  &:hover { -webkit-text-stroke: 0.7px currentColor; }
}

.gly { background: #f5e64288; &:hover { color: #333300ff; background: #f5e642ff; } }
.glg { background: #44ff8866; &:hover { color: #005500ff; background: #44ff88ff; } }
.glb { background: #88ccff66; &:hover { color: #000055ff; background: #88ccffff; } }
.glm { background: #f572f666; &:hover { color: #330033ff; background: #f572f6ff; } }