/*
 * Slotique brand primitives.
 *
 * Source: design handoff bundle (claude.ai/design), slotique-logos.html.
 * Anything that's part of the visual identity — color tokens, type tokens,
 * wordmark, baseline body styles — lives here so future features can import
 * the same vocabulary instead of duplicating values.
 */

:root {
  /* Blush family */
  --blush:        #F4C7C5;
  --blush-deep:   #E89B98;
  --blush-light:  #FBE3E1;
  --blush-pale:   #FEF3F1;

  /* Rose / accent */
  --rose:         #C97B7B;
  --rose-gold:    #C99B7C;
  --rose-gold-hi: #E8C2A2;

  /* Cream / surface */
  --cream:        #FBF6F0;
  --cream-warm:   #F4ECE0;

  /* Brown / sloth fur */
  --brown:        #7A5849;
  --brown-deep:   #4F362B;
  --brown-soft:   #A98372;

  /* Ink / utility */
  --ink:          #2A1F1A;
  --shimmer:      #F2D7B8;

  /* Type families */
  --font-sans:    'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-display: 'Quicksand', 'Plus Jakarta Sans', system-ui, sans-serif;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--rose); }

/* Wordmark — display font, tight tracking, rose period */
.wordmark {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.035em;
  color: var(--ink);
  line-height: 0.95;
  white-space: nowrap;
  display: inline-flex;
  align-items: baseline;
}
.wordmark .dot { color: var(--rose); }

/* Tagline — uppercase rose-gold caption used under the wordmark */
.tagline {
  font-size: 13px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--rose-gold);
  font-weight: 600;
}

/* Flash messages */
.flash {
  max-width: 32rem;
  margin: 1rem auto;
  padding: 0.75rem 1rem;
  border-radius: 8px;
  font-size: 14px;
}
.flash-notice { background: var(--blush-light); color: var(--brown-deep); }
.flash-alert  { background: var(--rose);        color: var(--cream); }