/* Crafts N Creations — Royal Minimalist design tokens (client-approved, light mode).
   NB: the token names --gold / --gold-lt are legacy handles carried over from the
   original dark mock; in the approved palette they resolve to Cherry Maroon and
   Charcoal respectively. They're kept so the ported markup stays 1:1. */
:root{
  --bg:#F9F9F9;          /* app background / page ground        */
  --desk:#EDEDEB;        /* desktop "desk" behind the admin window */
  --surface:#FFFFFF;     /* cards, sidebar, inputs, sheets      */
  --raised:#F2F1EF;      /* secondary fills, live-price notice  */
  --gold:#720612;        /* PRIMARY ACCENT — Cherry Maroon      */
  --gold-lt:#111827;     /* key figures / prices — Charcoal     */
  --tp:#111827;          /* text primary (Charcoal)             */
  --ts:#4B5563;          /* text secondary (Muted Gray)         */
  --border:#E5E4E2;      /* card / input borders (Platinum)     */
  --div:#ECEBE9;         /* row dividers                        */
  --ok:#15803D;          /* success / available / paid          */
  --warn:#B45309;        /* on-order / in-production / amber     */
  --danger:#B91C1C;      /* suspended / debit / delete          */
  --live:#16A34A;        /* pulsing LIVE dot                    */
  --blue:#2563EB;        /* analytics accents                   */
  --whatsapp:#1FA855;    /* WhatsApp CTA                        */
  --amber-bg:#FEF3E0;    /* rate-outdated / fallback banners    */
  --ok-bg:#EAF7EF;       /* billing-rate Y highlight box        */
  --rate-bg:#FBF6E9;     /* market-rate X input field           */
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Inter',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  color:var(--tp);
}
a{color:inherit}
button{font-family:inherit}
img{max-width:100%;display:block}

@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}}

/* Screen router: every full screen is a .screen; the active one is shown. */
.screen{display:none}
.screen.active{display:flex}

/* Hide scrollbars where the design calls for it */
.noscroll::-webkit-scrollbar{display:none}
.noscroll{scrollbar-width:none}