/* Theme: Ember Paper (ember-paper) */
/* A warm, literary-inspired workspace theme reminiscent of fine paper and ink, illuminated by a glowing ember accent. */

@tailwind base;
@tailwind components;
@tailwind utilities;

@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

@layer base {
  :root {
    /* A warm, literary ink-grey that scales from creamy paper to deep, rich charcoal. */
    --palette-neutral-100: #FBFAFA;
    --palette-neutral-150: #F9F9F8;
    --palette-neutral-200: #F5F4F2;
    --palette-neutral-250: #EEECE9;
    --palette-neutral-300: #E4E1DC;
    --palette-neutral-350: #D6D3CC;
    --palette-neutral-400: #C6C1B8;
    --palette-neutral-450: #B2ADA1;
    --palette-neutral-500: #9B9487;
    --palette-neutral-550: #807969;
    --palette-neutral-600: #666052;
    --palette-neutral-650: #504A40;
    --palette-neutral-700: #3D3930;
    --palette-neutral-750: #2E2B25;
    --palette-neutral-800: #24211C;
    --palette-neutral-850: #1E1C17;
    --palette-neutral-900: #1C1A15;
    /* The signature glowing ember red, bringing soft warmth and distinct focal points. */
    --palette-brand-100: #FEF9F9;
    --palette-brand-150: #FEF7F7;
    --palette-brand-200: #FDF1F0;
    --palette-brand-250: #FCE6E4;
    --palette-brand-300: #F9D7D4;
    --palette-brand-350: #F6C3C0;
    --palette-brand-400: #F2ACA7;
    --palette-brand-450: #EE908B;
    --palette-brand-500: #E7716A;
    --palette-brand-550: #E03A30;
    --palette-brand-600: #BD241B;
    --palette-brand-650: #941C14;
    --palette-brand-700: #73150F;
    --palette-brand-750: #58100B;
    --palette-brand-800: #450C09;
    --palette-brand-850: #3A0A07;
    --palette-brand-900: #360A07;
    --palette-danger-100: #FEF9F9;
    --palette-danger-150: #FDF7F7;
    --palette-danger-200: #FBF1F1;
    --palette-danger-250: #F9E7E6;
    --palette-danger-300: #F5D9D8;
    --palette-danger-350: #EFC7C5;
    --palette-danger-400: #E9B2AF;
    --palette-danger-450: #E19894;
    --palette-danger-500: #D77B76;
    --palette-danger-550: #CA4B44;
    --palette-danger-600: #A8352E;
    --palette-danger-650: #842924;
    --palette-danger-700: #671F1B;
    --palette-danger-750: #4F1815;
    --palette-danger-800: #3F1310;
    --palette-danger-850: #35100D;
    --palette-danger-900: #310F0D;
    --palette-warning-100: #FDFAF6;
    --palette-warning-150: #FDF8F3;
    --palette-warning-200: #FBF3E9;
    --palette-warning-250: #F8EAD9;
    --palette-warning-300: #F3DDC2;
    --palette-warning-350: #EDCDA5;
    --palette-warning-400: #E5B982;
    --palette-warning-450: #DBA158;
    --palette-warning-500: #CC852D;
    --palette-warning-550: #A56C23;
    --palette-warning-600: #83551B;
    --palette-warning-650: #664215;
    --palette-warning-700: #4E3310;
    --palette-warning-750: #3C270C;
    --palette-warning-800: #2E1E09;
    --palette-warning-850: #261907;
    --palette-warning-900: #241707;
    --palette-success-100: #F8FBF9;
    --palette-success-150: #F5FAF7;
    --palette-success-200: #EEF6F1;
    --palette-success-250: #E1F0E7;
    --palette-success-300: #CFE6D8;
    --palette-success-350: #B7DBC6;
    --palette-success-400: #9BCCAF;
    --palette-success-450: #7ABA94;
    --palette-success-500: #56A475;
    --palette-success-550: #45855F;
    --palette-success-600: #36694B;
    --palette-success-650: #2A523A;
    --palette-success-700: #203F2C;
    --palette-success-750: #183022;
    --palette-success-800: #13251A;
    --palette-success-850: #0F1F16;
    --palette-success-900: #0E1D14;
    --palette-info-100: #F8FAFC;
    --palette-info-150: #F6F9FB;
    --palette-info-200: #EFF5F8;
    --palette-info-250: #E4EDF3;
    --palette-info-300: #D4E3EC;
    --palette-info-350: #C0D5E2;
    --palette-info-400: #A8C5D7;
    --palette-info-450: #8CB1C9;
    --palette-info-500: #6C9AB8;
    --palette-info-550: #4B7F9F;
    --palette-info-600: #3B647F;
    --palette-info-650: #2D4E63;
    --palette-info-700: #223B4C;
    --palette-info-750: #1A2D39;
    --palette-info-800: #14232C;
    --palette-info-850: #101D25;
    --palette-info-900: #0F1B22;
    --palette-accent-100: #FCFAF8;
    --palette-accent-150: #FCF9F6;
    --palette-accent-200: #F9F3EE;
    --palette-accent-250: #F4EBE2;
    --palette-accent-300: #EDDFD1;
    --palette-accent-350: #E4CFBA;
    --palette-accent-400: #D9BCA0;
    --palette-accent-450: #CBA580;
    --palette-accent-500: #BB8B5D;
    --palette-accent-550: #A07041;
    --palette-accent-600: #7F5933;
    --palette-accent-650: #634527;
    --palette-accent-700: #4C341D;
    --palette-accent-750: #3A2816;
    --palette-accent-800: #2D1F11;
    --palette-accent-850: #25190E;
    --palette-accent-900: #22180D;
  }

  :root {
    --radius: 0.25rem;
    --radius-sm: calc(var(--radius) - 4px);
    --radius-md: calc(var(--radius) - 2px);
    --radius-lg: var(--radius);
    --radius-xl: calc(var(--radius) + 4px);
    --background: #FDFAF6;
    --foreground: #37352F;
    --card: #FDFAF6;
    --card-foreground: #37352F;
    --popover: #FDFAF6;
    --popover-foreground: #37352F;
    --primary: var(--palette-brand-600);
    --primary-foreground: var(--palette-neutral-100);
    --secondary: var(--palette-neutral-200);
    --secondary-foreground: var(--palette-neutral-800);
    --muted: var(--palette-neutral-150);
    --muted-foreground: var(--palette-neutral-600);
    --accent: var(--palette-neutral-150);
    --accent-foreground: var(--palette-neutral-900);
    --destructive: var(--palette-danger-600);
    --destructive-foreground: var(--palette-neutral-100);
    --border: var(--palette-neutral-250);
    --input: var(--palette-neutral-300);
    --ring: var(--palette-brand-500);
    --chart-1: #E8746D;
    --chart-2: #B88655;
    --chart-3: #498C64;
    --chart-4: #4B7C9B;
    --chart-5: #82729B;
    --sidebar: #F7F2EB;
    --sidebar-foreground: var(--palette-neutral-800);
    --sidebar-primary: var(--palette-brand-600);
    --sidebar-primary-foreground: var(--palette-neutral-100);
    --sidebar-accent: var(--palette-neutral-200);
    --sidebar-accent-foreground: var(--palette-neutral-900);
    --sidebar-border: var(--palette-neutral-200);
    --sidebar-ring: var(--palette-brand-500);
    --font-sans: "IBM Plex Sans", system-ui, sans-serif;
    --font-display: "IBM Plex Serif", system-ui, sans-serif;
    --font-mono: "IBM Plex Mono", ui-monospace, monospace;
    --text-hero: 600 3rem/3.5rem var(--font-display);
    --text-hero-tracking: -0.01em;
    --text-title: 600 2rem/2.5rem var(--font-display);
    --text-heading: 600 1.375rem/1.75rem var(--font-display);
    --text-body: 400 0.875rem/1.375rem var(--font-sans);
    --text-caption: 400 0.75rem/1rem var(--font-sans);
    --text-label: 500 0.8125rem/1.125rem var(--font-sans);
    --text-overline: 600 0.6875rem/0.875rem var(--font-sans);
    --text-overline-tracking: 0.08em;
    --text-overline-transform: uppercase;
    --shadow-xs: 0 1px 2px rgba(55, 53, 47, 0.04);
    --shadow-sm: 0 2px 4px rgba(55, 53, 47, 0.06);
    --shadow-md: 0 4px 12px rgba(55, 53, 47, 0.08);
    --shadow-lg: 0 8px 24px rgba(55, 53, 47, 0.1);
    --shadow-xl: 0 16px 32px rgba(55, 53, 47, 0.12);
    --gradient-brand_wash: linear-gradient(180deg, rgba(232, 116, 109, 0.08) 0%, rgba(232, 116, 109, 0) 100%);
  }

  .dark {
    --background: #1C1A17;
    --foreground: #F4F0EA;
    --card: #24221E;
    --card-foreground: #F4F0EA;
    --popover: #24221E;
    --popover-foreground: #F4F0EA;
    --primary: var(--palette-brand-500);
    --primary-foreground: var(--palette-neutral-900);
    --secondary: var(--palette-neutral-800);
    --secondary-foreground: var(--palette-neutral-200);
    --muted: var(--palette-neutral-850);
    --muted-foreground: var(--palette-neutral-400);
    --accent: var(--palette-neutral-800);
    --accent-foreground: var(--palette-neutral-100);
    --destructive: var(--palette-danger-500);
    --destructive-foreground: var(--palette-neutral-900);
    --border: var(--palette-neutral-750);
    --input: var(--palette-neutral-700);
    --ring: var(--palette-brand-500);
    --chart-1: #E8746D;
    --chart-2: #B88655;
    --chart-3: #498C64;
    --chart-4: #4B7C9B;
    --chart-5: #82729B;
    --sidebar: #161513;
    --sidebar-foreground: var(--palette-neutral-200);
    --sidebar-primary: var(--palette-brand-500);
    --sidebar-primary-foreground: var(--palette-neutral-900);
    --sidebar-accent: var(--palette-neutral-800);
    --sidebar-accent-foreground: var(--palette-neutral-100);
    --sidebar-border: var(--palette-neutral-800);
    --sidebar-ring: var(--palette-brand-500);
  }
}

@layer base {
  * { border-color: var(--border); }
  body { background-color: var(--background); color: var(--foreground); font-family: var(--font-sans); }
}

@layer components {
  .text-hero {
    font: var(--text-hero);
    letter-spacing: var(--text-hero-tracking);
  }
  .text-title {
    font: var(--text-title);
  }
  .text-heading {
    font: var(--text-heading);
  }
  .text-body {
    font: var(--text-body);
  }
  .text-caption {
    font: var(--text-caption);
  }
  .text-label {
    font: var(--text-label);
  }
  .text-overline {
    font: var(--text-overline);
    letter-spacing: var(--text-overline-tracking);
    text-transform: var(--text-overline-transform);
  }
}