/* Amida' — brand tokens (direction 4a)
   oklch() is authoritative; hex is a fallback for older targets. */

:root {
  /* Ink & ground */
  --amida-walnut:      oklch(0.25 0.03 40);   /* #362A22 — primary ink, wordmark, icon ground */
  --amida-cream:       oklch(0.96 0.022 85);  /* #F8F0E4 — app background */
  --amida-shell:       oklch(0.88 0.05 55);   /* #F3D9C6 — cards, chips, dividers-on-cream */

  /* Accent */
  --amida-pomegranate: oklch(0.50 0.16 20);   /* #B33B33 — aleph, apostrophe, primary action */
  --amida-rose:        oklch(0.72 0.16 30);   /* #EE8468 — aleph on dark, highlights, badges */

  /* Derived UI */
  --amida-ink-soft:    oklch(0.45 0.03 45);   /* secondary text on cream */
  --amida-ink-faint:   oklch(0.62 0.025 50);  /* captions, meta, placeholders */
  --amida-hairline:    oklch(0.87 0.03 80);   /* 1px borders on cream */
  --amida-surface:     oklch(0.94 0.026 85);  /* raised surface on cream */
  --amida-focus:       oklch(0.50 0.16 20 / 0.35);

  /* Type */
  --amida-font-display: 'Suez One', 'Frank Ruhl Libre', Georgia, serif;
  --amida-font-ui:      'Heebo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --amida-font-mono:    'DM Mono', ui-monospace, monospace;

  --amida-radius-icon: 22.5%;   /* app icon squircle-ish */
  --amida-radius-card: 12px;
  --amida-radius-chip: 999px;
}

/* Fonts
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Suez+One&family=Heebo:wght@400;500;800&display=swap">
*/

/* ---- Logo ---- */

.amida-logo {
  display: inline-flex;
  align-items: baseline;
  font-family: var(--amida-font-display);
  font-weight: 400;              /* Suez One ships one weight */
  font-size: 76px;               /* set this; everything else scales in em */
  line-height: 0.9;
  color: var(--amida-walnut);
  white-space: nowrap;
  -webkit-font-smoothing: antialiased;
}
.amida-logo__aleph {             /* the Hebrew aleph standing in for the A */
  font-size: 1.18em;
  margin-right: 0.02em;
  color: var(--amida-pomegranate);
}
.amida-logo__tick {              /* the real apostrophe */
  color: var(--amida-pomegranate);
}

/* On dark / photo grounds */
.amida-logo--reverse { color: var(--amida-cream); }
.amida-logo--reverse .amida-logo__aleph,
.amida-logo--reverse .amida-logo__tick { color: var(--amida-rose); }

/* Single-ink lockup (embroidery, fax-grade printing, favicons) */
.amida-logo--mono,
.amida-logo--mono .amida-logo__aleph,
.amida-logo--mono .amida-logo__tick { color: currentColor; }

/* Clear space: keep 0.5 × cap height (≈ 0.35em) clear on all four sides. */
.amida-logo { padding: 0.35em 0.35em 0.2em; }

/* ---- App icon / avatar ---- */

.amida-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 84px;                   /* set any size; contents scale */
  aspect-ratio: 1;
  border-radius: var(--amida-radius-icon);
  background: var(--amida-walnut);
  overflow: hidden;
}
.amida-icon__aleph {
  font-family: var(--amida-font-display);
  font-size: 0.9em;              /* relative to .amida-icon font-size */
  line-height: 0.9;
  color: var(--amida-rose);
}
/* usage: <div class="amida-icon" style="width:84px;font-size:84px">
            <span class="amida-icon__aleph">&#1488;</span></div>            */

.amida-avatar {                  /* round, inverted */
  display: inline-flex; align-items: center; justify-content: center;
  width: 84px; aspect-ratio: 1; border-radius: 50%;
  background: var(--amida-pomegranate);
  font-family: var(--amida-font-display);
  font-size: 0.52em;
  color: var(--amida-cream);
}