/* Direction: Diwali night — aubergine sky, marigold flame, a high-contrast serif */
/* Completed by the platform from the short form: both modes, every
   palette token, each text-on-ground pair at its floor. To restyle, write the
   short form again (the decisions in one :root) and it is completed again. */

:root {
  color-scheme: dark;
  --canvas: #1b0f1e;
  --surface: #2a1830;
  --surface-2: #35203c;
  --border: #4d3256;
  --border-strong: #5f5762;
  --ink: #fdf1dc;
  --muted: #cdb7ae;
  --accent: #f4a21f;
  --accent-hover: #f6b041;
  --accent-ink: #1b0f1e;
  --accent-text: #ffc15a;
  --accent-strong: #f4a21f;
  --accent-soft: #4b2f1e;
  --accent-border: #7d511e;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #1a2825;
  --success-strong: #499c68;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #3d1e19;
  --warning-strong: #ca854f;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #3e121e;
  --danger-strong: #d16969;
  --chart-1: #f4a21f;
  --chart-2: #98d25e;
  --chart-3: #1fb3ae;
  --chart-4: #8fc2fb;
  --chart-5: #ba7ae1;
  --chart-6: #fe9eab;

  --font-display: "Playfair Display", Georgia, serif;
  --font-body: "DM Sans", system-ui, sans-serif;
  --radius-card: 18px;
  --radius-btn: 999px;
  --display-weight: 600;
  --x-band: #3b0f24;
  --x-on-photo: #fff;
  --font-mono: "JetBrains Mono Variable", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --font-sans: "DM Sans", system-ui, sans-serif;
  --display-tracking: -0.02em;
  --eyebrow-tracking: 0.08em;
}

html[data-theme="light"] {
  color-scheme: light;
  --canvas: #ffffff;
  --surface: #ffffff;
  --surface-2: #f4f3f4;
  --border: #dfdde0;
  --border-strong: #bbb7bc;
  --ink: #1b0f1e;
  --muted: #6d666e;
  --accent: #f4a21f;
  --accent-hover: #cf8a1a;
  --accent-ink: #1b0f1e;
  --accent-text: #946213;
  --accent-strong: #946213;
  --accent-soft: #fdf2e0;
  --accent-border: #fad59a;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #e3f0e8;
  --success-strong: #137638;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #f6eae1;
  --warning-strong: #a64c08;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #f7e4e4;
  --danger-strong: #b91c1c;
  --chart-1: #ca8721;
  --chart-2: #6d9c3e;
  --chart-3: #1b918d;
  --chart-4: #4d96e2;
  --chart-5: #9662b6;
  --chart-6: #de7283;
}

.hero-glow {
  background:
    radial-gradient(55% 60% at 50% 0%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 70%),
    radial-gradient(40% 40% at 85% 20%, color-mix(in srgb, var(--accent-text) 12%, transparent), transparent 70%);
}
.diya-mark { position: relative; width: 64px; height: 56px; margin-inline: auto; }
.diya-mark .flame {
  position: absolute; left: 50%; top: 0; width: 18px; height: 28px; margin-left: -9px;
  border-radius: 50% 50% 50% 50% / 62% 62% 38% 38%;
  background: linear-gradient(to top, var(--accent), var(--accent-text));
  box-shadow: 0 0 24px 6px color-mix(in srgb, var(--accent) 60%, transparent);
  transform-origin: 50% 100%;
  animation: flicker 2.4s ease-in-out infinite;
}
.diya-mark .bowl {
  position: absolute; left: 0; right: 0; bottom: 0; height: 26px;
  border-radius: 0 0 64px 64px; background: var(--accent); opacity: .9;
}
@keyframes flicker {
  0%, 100% { transform: scale(1) rotate(0deg); }
  25% { transform: scale(1.06, .94) rotate(-2deg); }
  50% { transform: scale(.96, 1.08) rotate(1.5deg); }
  75% { transform: scale(1.04, .97) rotate(-1deg); }
}
.reduced-motion .diya-mark .flame { animation: none; }
.pcard { transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.pcard:hover {
  transform: translateY(-4px);
  border-color: var(--accent);
  box-shadow: 0 14px 34px -14px color-mix(in srgb, var(--accent) 45%, transparent);
}
.reduced-motion .pcard:hover { transform: none; }
[data-add] .ic-check { display: none; }
[data-add].is-added .ic-check { display: inline-block; }
[data-add].is-added .ic-plus { display: none; }
[data-menu-toggle] .ic-x { display: none; }
[data-menu-toggle][aria-expanded="true"] .ic-x { display: inline-block; }
[data-menu-toggle][aria-expanded="true"] .ic-menu { display: none; }
.pay-card {
  background: color-mix(in srgb, var(--x-on-photo) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--x-on-photo) 18%, transparent);
}
.pay-ic { background: color-mix(in srgb, var(--accent) 22%, transparent); }
.note-strip {
  background: color-mix(in srgb, var(--accent) 20%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent);
}
.pill-active { background: var(--accent); color: var(--canvas); }
.glow-ring { box-shadow: 0 0 80px 10px color-mix(in srgb, var(--accent) 25%, transparent); }