/* Gelati Celesti — app tokens */
:root {
  --teal:        #1C4754;
  --teal-deep:   #143946;
  --teal-ink:    #10323F;
  --cream:       #F3ECDF;
  --cream-soft:  #EFE6D6;
  --cream-deep:  #E7DDC8;
  --powder:      #A9C7DB;
  --powder-soft: #CBDDEA;
  --aqua:        #BEE1DE;
  --coral:       #E8604C;
  --coral-soft:  #F28D7E;
  --pink:        #F4C1C1;
  --peach:       #F6B24E;
  --butter:      #E9A63E;
  --white:       #FFFFFF;

  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  --shadow-card: 0 1px 2px rgba(16,50,63,0.04), 0 8px 24px rgba(16,50,63,0.06);
  --shadow-pop:  0 10px 30px rgba(16,50,63,0.15);

  --font-script: "Caveat Brush", "Sacramento", cursive;
  --font-display: "Barlow Condensed", "Oswald", system-ui, sans-serif;
  --font-body: "DM Sans", "Figtree", system-ui, sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; font-family: var(--font-body); color: var(--teal-ink); background: #E9E2D3; }

.script { font-family: var(--font-script); font-weight: 400; line-height: 0.95; }
.display { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600; }
.eyebrow { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.16em; font-weight: 600; font-size: 11px; }

/* Reusable star */
.gc-star { display: inline-block; width: 0.8em; height: 0.8em; color: inherit; }

/* Checker row divider */
.gc-checker-row {
  height: 12px;
  background-image:
    linear-gradient(90deg, var(--teal) 50%, transparent 50%),
    linear-gradient(90deg, var(--coral) 50%, transparent 50%),
    linear-gradient(90deg, var(--peach) 50%, transparent 50%),
    linear-gradient(90deg, var(--powder) 50%, transparent 50%);
  background-size: 24px 12px, 24px 12px, 24px 12px, 24px 12px;
  background-position: 0 0, 6px 0, 12px 0, 18px 0;
  background-repeat: repeat-x;
}

/* Striped fill helper */
.gc-stripes {
  background-image: repeating-linear-gradient(
    90deg,
    currentColor 0 6px,
    transparent 6px 14px
  );
}

/* Common */
button { font-family: inherit; cursor: pointer; border: none; background: none; padding: 0; color: inherit; }
a { color: inherit; text-decoration: none; }

/* Hide scrollbars within phone screens */
.gc-noscroll::-webkit-scrollbar { display: none; }
.gc-noscroll { scrollbar-width: none; }
