/* Hallmark · macrostructure: source-locked application shell · tone: intimate restraint · anchor hue: coral · theme: studied-DNA (source: LustMaker Home.html) */

:root,
[data-theme="dark"],
.dark {
  color-scheme: dark;

  --color-paper: #0f0f0f;
  --color-paper-2: #161616;
  --color-paper-3: #1f1f1f;
  --color-paper-4: #262626;
  --color-paper-5: #353535;
  --color-paper-inverse: #f3f1ee;
  --color-ink: rgb(255 255 255 / 0.95);
  --color-ink-secondary: rgb(255 255 255 / 0.84);
  --color-ink-muted: rgb(255 255 255 / 0.66);
  --color-ink-quiet: rgb(255 255 255 / 0.48);
  --color-ink-faint: rgb(255 255 255 / 0.35);
  --color-ink-inverse: rgb(24 18 14 / 0.95);
  --color-rule: rgb(255 255 255 / 0.09);
  --color-rule-subtle: rgb(255 255 255 / 0.06);
  --color-rule-strong: rgb(255 255 255 / 0.14);
  --color-scrim: rgb(0 0 0 / 0.55);
  --color-shadow: rgb(0 0 0 / 0.28);
  --color-menu-shadow: rgb(0 0 0 / 0.28);
  --color-menu-ring: rgb(255 255 255 / 0.04);
  --color-drawer-shadow: rgb(0 0 0 / 0.4);
  --color-menu: rgb(24 24 27);

  --color-accent: #ff6b6b;
  --color-accent-hover: #ff6b6b;
  --color-accent-active: #e84545;
  --color-accent-soft: rgb(255 107 107 / 0.1);
  --color-accent-ink: #0f0f0f;
  --color-accent-text: #ff6b6b;
  --color-accent-deep: #8f001a;
  --color-focus: #f4c96b;
  --color-home-glow: rgb(255 107 107 / 0.3);

  --color-gold: #f4c96b;
  --color-gold-soft: rgb(255 199 88 / 0.07);
  --color-gold-border: rgb(255 199 88 / 0.3);
  --color-gold-ink: #0f0f0f;
  --color-success: #4caf50;
  --color-success-text: #4caf50;
  --color-success-soft: rgb(76 175 80 / 0.14);
  --color-warning: #f4c96b;
  --color-warning-soft: rgb(244 201 107 / 0.14);
  --color-info: #7dd9db;
  --color-info-soft: rgb(125 217 219 / 0.14);
  --color-danger: #ff8a80;
  --color-danger-text: #ff8a80;
  --color-danger-soft: rgb(255 107 107 / 0.1);
  --color-danger-fill: #ff6b6b;
  --color-danger-ink: #ffffff;

  --color-chat-sent: #33424f;
  --color-chat-sent-ink: #dbe7f0;
  --color-chat-received: #2c2c2c;
  --color-chat-received-ink: #e0e0e0;
  --color-media-well: rgb(15 15 15 / 0.55);
  --color-media-ink: #ffffff;
  --color-media-scrim: rgb(0 0 0 / 0.55);

  /* Exact source surface roles: bg0 / bg1 / bg2 / bg3 / bg4 / well. */
  --color-surface-page: var(--color-paper);
  --color-surface-shell: var(--color-paper-2);
  --color-surface-card: var(--color-paper-3);
  --color-surface-panel: var(--color-paper-4);
  --color-surface-control: var(--color-paper-5);
  --color-surface-well: var(--color-media-well);
  --color-home-card: var(--color-surface-card);
  --color-home-control: var(--color-surface-card);

  /* Exact source roles: panelT / cardBg / cardT / cardT2 / accCyan / accCoral. */
  --color-surface-panel-translucent: rgb(31 31 31 / 0.66);
  --color-surface-card-translucent: rgb(10 10 10 / 0.9);
  --color-surface-card-ink: #cbd5e1;
  --color-surface-card-ink-muted: #94a3b8;
  --color-accent-cyan: #7dd9db;
  --color-accent-coral: #ffb0b8;

  --background: 12 8% 7%;
  --foreground: 12 10% 96%;
  --card: 12 7% 10%;
  --card-foreground: 12 10% 96%;
  --popover: 12 7% 10%;
  --popover-foreground: 12 10% 96%;
  --primary: 0 100% 71%;
  --primary-foreground: 0 0% 100%;
  --secondary: 12 6% 15%;
  --secondary-foreground: 12 9% 91%;
  --muted: 12 6% 15%;
  --muted-foreground: 12 5% 69%;
  --accent: 0 100% 71%;
  --accent-foreground: 0 0% 100%;
  --destructive: 1 79% 62%;
  --destructive-foreground: 12 10% 96%;
  --border: 12 6% 28%;
  --input: 12 6% 28%;
  --ring: 42 61% 78%;
}

[data-theme="light"],
.light {
  color-scheme: light;

  --color-paper: #f3f1ee;
  --color-paper-2: #ffffff;
  --color-paper-3: #ffffff;
  --color-paper-4: #f0f4f8;
  --color-paper-5: #e8e4df;
  --color-paper-inverse: #0f0f0f;
  --color-ink: rgb(24 18 14 / 0.95);
  --color-ink-secondary: rgb(24 18 14 / 0.8);
  --color-ink-muted: rgb(24 18 14 / 0.64);
  --color-ink-quiet: rgb(24 18 14 / 0.48);
  --color-ink-faint: rgb(24 18 14 / 0.34);
  --color-ink-inverse: rgb(255 255 255 / 0.95);
  --color-rule: rgb(0 0 0 / 0.1);
  --color-rule-subtle: rgb(0 0 0 / 0.06);
  --color-rule-strong: rgb(0 0 0 / 0.16);
  --color-scrim: rgb(0 0 0 / 0.55);
  --color-shadow: rgb(0 0 0 / 0.16);
  --color-menu: #ffffff;

  --color-accent: #ff6b6b;
  --color-accent-hover: #ff6b6b;
  --color-accent-active: #e84545;
  --color-accent-soft: rgb(255 107 107 / 0.1);
  --color-accent-ink: #0f0f0f;
  --color-accent-text: var(--color-accent-deep);
  --color-accent-deep: #8f001a;
  --color-focus: #996c00;
  --color-home-glow: rgb(255 107 107 / 0.3);

  --color-gold: #996c00;
  --color-gold-soft: rgb(153 108 0 / 0.06);
  --color-gold-border: rgb(153 108 0 / 0.35);
  --color-gold-ink: #ffffff;
  --color-success: #4caf50;
  --color-success-text: #2e7d32;
  --color-success-soft: rgb(76 175 80 / 0.12);
  --color-warning: #996c00;
  --color-warning-soft: rgb(153 108 0 / 0.12);
  --color-info: #0e7490;
  --color-info-soft: rgb(14 116 144 / 0.12);
  --color-danger: #dd4d51;
  --color-danger-text: #a5262e;
  --color-danger-soft: rgb(221 77 81 / 0.1);
  --color-danger-fill: #dd4d51;
  --color-danger-ink: #ffffff;

  --color-chat-sent: #e1ecf4;
  --color-chat-sent-ink: #3a4a56;
  --color-chat-received: #efefef;
  --color-chat-received-ink: #444444;
  --color-media-well: #f4f1ee;
  --color-media-ink: #ffffff;
  --color-media-scrim: rgb(0 0 0 / 0.55);

  /* Exact source surface roles: bg0 / bg1 / bg2 / bg3 / bg4 / well. */
  --color-surface-page: var(--color-paper);
  --color-surface-shell: var(--color-paper-2);
  --color-surface-card: var(--color-paper-3);
  --color-surface-panel: var(--color-paper-4);
  --color-surface-control: var(--color-paper-5);
  --color-surface-well: var(--color-media-well);
  --color-home-card: var(--color-surface-card);
  --color-home-control: var(--color-surface-card);

  /* Exact source roles: panelT / cardBg / cardT / cardT2 / accCyan / accCoral. */
  --color-surface-panel-translucent: rgb(255 255 255 / 0.75);
  --color-surface-card-translucent: rgb(255 255 255 / 0.92);
  --color-surface-card-ink: #475569;
  --color-surface-card-ink-muted: #64748b;
  --color-accent-cyan: #0e7490;
  --color-accent-coral: #dd4d51;

  --background: 36 17% 95%;
  --foreground: 24 28% 8%;
  --card: 36 20% 98%;
  --card-foreground: 24 28% 8%;
  --popover: 36 20% 98%;
  --popover-foreground: 24 28% 8%;
  --primary: 0 100% 71%;
  --primary-foreground: 0 0% 100%;
  --secondary: 210 20% 95%;
  --secondary-foreground: 24 20% 18%;
  --muted: 210 20% 95%;
  --muted-foreground: 24 12% 40%;
  --accent: 0 100% 71%;
  --accent-foreground: 0 0% 100%;
  --destructive: 1 79% 44%;
  --destructive-foreground: 36 20% 98%;
  --border: 30 10% 76%;
  --input: 30 10% 76%;
  --ring: 352 66% 34%;
}

:root {
  --font-body: var(--font-poppins), var(--font-noto-sans), ui-sans-serif, sans-serif;
  --font-display: var(--font-poppins), var(--font-noto-sans), ui-sans-serif, sans-serif;
  --font-outlier: var(--font-poppins), var(--font-noto-sans), ui-sans-serif, sans-serif;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.375rem;
  --text-xl: 1.75rem;
  --text-2xl: 2.25rem;
  --text-display: clamp(2.25rem, 5vw, 4rem);
  --leading-tight: 1.06;
  --leading-heading: 1.15;
  --leading-body: 1.55;

  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 2.5rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;
  --space-5xl: 9rem;

  --radius-xs: 0.5rem;
  --radius-sm: 0.625rem;
  --radius-md: 0.875rem;
  --radius-lg: 1.25rem;
  --radius-xl: 1.25rem;
  --radius-pill: 999px;

  --radius-control-icon: 0.5rem;
  --radius-control: 0.625rem;
  --radius-control-prominent: 0.75rem;
  --radius-menu: 0.875rem;
  --radius-panel: 1rem;
  --radius-card: 1.25rem;

  --control-height: 2.75rem;
  --control-height-compact: 2.25rem;
  --control-height-default: var(--control-height);
  --control-height-large: 3rem;
  --sidebar-width: 15.5rem;
  --sidebar-compact-width: 4.75rem;
  --mobile-bar-height: 3.5rem;
  --mobile-drawer-width: min(17.5rem, calc(100vw - var(--space-xl)));
  --content-max: 90rem;

  --shadow-sm: 0 0.25rem 1rem var(--color-shadow);
  --shadow-md: 0 1rem 3rem var(--color-shadow);
  --shadow-overlay: 0 1.5rem 4rem var(--color-shadow);

  --duration-fast: 160ms;
  --duration-base: 220ms;
  --duration-slow: 320ms;
  --ease-standard: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-emphasized: cubic-bezier(0.16, 1, 0.3, 1);

  --z-base: 0;
  --z-sticky: 20;
  --z-sticky-nav: 40;
  --z-drawer: 60;
  --z-dialog: 80;
  --z-toast: 100;

  --radius: var(--radius-md);
}