/* DivanNameh — دفتر ادبی معاصر. Source: design-system/divannameh/MASTER.md */
:root {
  --color-background: #f4f1e9;
  --color-surface: #fffcf5;
  --color-surface-muted: #eae5d9;
  --color-foreground: #302d27;
  --color-muted-foreground: #6e685d;
  --color-primary: #824338;
  --color-primary-hover: #69342c;
  --color-primary-soft: #f1e5df;
  --color-on-primary: #fffcf5;
  --color-feature: #343c34;
  --color-on-feature: #fffcf5;
  --color-feature-muted: #d5ddcf;
  --color-border: #d8d0c1;
  --color-control-border: #8e8577;
  --color-focus: #28647b;
  --color-success: #365d42;
  --color-success-surface: #e9f0e7;
  --color-danger: #9a342e;
  --color-danger-surface: #f9eae5;
  --font-body: Vazirmatn, Tahoma, sans-serif;
  --font-literary: Naskh, Tahoma, serif;
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-title: clamp(1.875rem, 3.4vw, 2.875rem);
  --text-poem: clamp(1.25rem, 2vw, 1.625rem);
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --radius-control: .25rem;
  --radius-card: .5rem;
  --radius-pill: 999px;
  --shadow-card: 0 8px 30px rgb(48 45 39 / 5%);
  --shadow-focus: 0 0 0 4px rgb(40 100 123 / 12%);
  --duration-control: 140ms;
  --duration-surface: 200ms;
  --ease-out: cubic-bezier(.2,.8,.2,1);
  --width-content: 72.5rem;
  --width-reading: 58rem;
  --width-sidebar: 14.5rem;
  --icon-size: 1.25rem;
  --control-size: 3rem;
  --gutter: clamp(1.25rem, 3.5vw, 3rem);
  --layer-navigation: 20;
  --layer-skip: 100;
}

:root {
  color-scheme: light;
  --header-height: 4.5rem;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-background: #1d1c18;
  --color-surface: #25231e;
  --color-surface-muted: #343027;
  --color-foreground: #f3ead8;
  --color-muted-foreground: #c6baa4;
  --color-primary: #efab94;
  --color-primary-hover: #ffc6b0;
  --color-primary-soft: #462d28;
  --color-on-primary: #261714;
  --color-feature: #2b382e;
  --color-feature-muted: #c7d5c5;
  --color-border: #544b3e;
  --color-control-border: #a0927c;
  --color-focus: #93cfdf;
  --color-success: #b7ddb8;
  --color-success-surface: #2d3b2e;
  --color-danger: #ffb7ac;
  --color-danger-surface: #482925;
  --shadow-card: none;
  --shadow-focus: 0 0 0 4px rgb(147 207 223 / 20%);
}

@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] {
    color-scheme: dark;
    --color-background: #1d1c18;
    --color-surface: #25231e;
    --color-surface-muted: #343027;
    --color-foreground: #f3ead8;
    --color-muted-foreground: #c6baa4;
    --color-primary: #efab94;
    --color-primary-hover: #ffc6b0;
    --color-primary-soft: #462d28;
    --color-on-primary: #261714;
    --color-feature: #2b382e;
    --color-feature-muted: #c7d5c5;
    --color-border: #544b3e;
    --color-control-border: #a0927c;
    --color-focus: #93cfdf;
    --color-success: #b7ddb8;
    --color-success-surface: #2d3b2e;
    --color-danger: #ffb7ac;
    --color-danger-surface: #482925;
    --shadow-card: none;
    --shadow-focus: 0 0 0 4px rgb(147 207 223 / 20%);
  }
}

/* Account palettes; paper inherits the original literary identity. */
:root[data-palette="ocean"] {
  --color-background: #f0f4f8;
  --color-surface: #f9fcff;
  --color-surface-muted: #e1eaf2;
  --color-foreground: #203447;
  --color-muted-foreground: #52667a;
  --color-primary: #235b8e;
  --color-primary-hover: #18466f;
  --color-primary-soft: #e0ecf8;
  --color-on-primary: #ffffff;
  --color-feature: #1f3c54;
  --color-on-feature: #f7fbff;
  --color-feature-muted: #c9dfef;
  --color-border: #c9d6e2;
  --color-control-border: #74899d;
  --color-focus: #2366a0;
}
:root[data-palette="ocean"][data-theme="dark"] {
  --color-background: #141e29;
  --color-surface: #1b2937;
  --color-surface-muted: #26394b;
  --color-foreground: #e6f0fa;
  --color-muted-foreground: #b3c8da;
  --color-primary: #95c9f4;
  --color-primary-hover: #b9dcfa;
  --color-primary-soft: #243f58;
  --color-on-primary: #112a40;
  --color-feature: #213b51;
  --color-on-feature: #f1f7ff;
  --color-feature-muted: #c0d8ec;
  --color-border: #41586d;
  --color-control-border: #829bb1;
  --color-focus: #a2d7ff;
}
@media (prefers-color-scheme: dark) {
  :root[data-palette="ocean"][data-theme="auto"] {
  --color-background: #141e29;
  --color-surface: #1b2937;
  --color-surface-muted: #26394b;
  --color-foreground: #e6f0fa;
  --color-muted-foreground: #b3c8da;
  --color-primary: #95c9f4;
  --color-primary-hover: #b9dcfa;
  --color-primary-soft: #243f58;
  --color-on-primary: #112a40;
  --color-feature: #213b51;
  --color-on-feature: #f1f7ff;
  --color-feature-muted: #c0d8ec;
  --color-border: #41586d;
  --color-control-border: #829bb1;
  --color-focus: #a2d7ff;
}
}
:root[data-palette="forest"] {
  --color-background: #eff5ef;
  --color-surface: #f9fcf7;
  --color-surface-muted: #e0ebdf;
  --color-foreground: #253b2d;
  --color-muted-foreground: #526b59;
  --color-primary: #306344;
  --color-primary-hover: #244e34;
  --color-primary-soft: #e0efdf;
  --color-on-primary: #ffffff;
  --color-feature: #294736;
  --color-on-feature: #f8fff8;
  --color-feature-muted: #c9dfca;
  --color-border: #c7d8c8;
  --color-control-border: #738c78;
  --color-focus: #2c7054;
}
:root[data-palette="forest"][data-theme="dark"] {
  --color-background: #151f19;
  --color-surface: #1c2b22;
  --color-surface-muted: #293d30;
  --color-foreground: #e7f3e8;
  --color-muted-foreground: #b6cebb;
  --color-primary: #9ed3ac;
  --color-primary-hover: #bde9c7;
  --color-primary-soft: #294b36;
  --color-on-primary: #132e1d;
  --color-feature: #243e2e;
  --color-on-feature: #f2fff5;
  --color-feature-muted: #c4deca;
  --color-border: #425c49;
  --color-control-border: #829f8a;
  --color-focus: #b1e5bf;
}
@media (prefers-color-scheme: dark) {
  :root[data-palette="forest"][data-theme="auto"] {
  --color-background: #151f19;
  --color-surface: #1c2b22;
  --color-surface-muted: #293d30;
  --color-foreground: #e7f3e8;
  --color-muted-foreground: #b6cebb;
  --color-primary: #9ed3ac;
  --color-primary-hover: #bde9c7;
  --color-primary-soft: #294b36;
  --color-on-primary: #132e1d;
  --color-feature: #243e2e;
  --color-on-feature: #f2fff5;
  --color-feature-muted: #c4deca;
  --color-border: #425c49;
  --color-control-border: #829f8a;
  --color-focus: #b1e5bf;
}
}
:root[data-palette="plum"] {
  --color-background: #f5f0f6;
  --color-surface: #fffaff;
  --color-surface-muted: #ece2ee;
  --color-foreground: #3d2b42;
  --color-muted-foreground: #725b78;
  --color-primary: #784581;
  --color-primary-hover: #603467;
  --color-primary-soft: #f1e3f3;
  --color-on-primary: #ffffff;
  --color-feature: #4e3456;
  --color-on-feature: #fff7ff;
  --color-feature-muted: #e4cde8;
  --color-border: #ddcde0;
  --color-control-border: #987f9d;
  --color-focus: #834b92;
}
:root[data-palette="plum"][data-theme="dark"] {
  --color-background: #231a27;
  --color-surface: #2e2233;
  --color-surface-muted: #402f47;
  --color-foreground: #f5e9f8;
  --color-muted-foreground: #d1bbd7;
  --color-primary: #d6ace1;
  --color-primary-hover: #e9c6f1;
  --color-primary-soft: #51385b;
  --color-on-primary: #301939;
  --color-feature: #432e4b;
  --color-on-feature: #fff5ff;
  --color-feature-muted: #e1c8e7;
  --color-border: #624b6b;
  --color-control-border: #a28aaa;
  --color-focus: #e0b8f1;
}
@media (prefers-color-scheme: dark) {
  :root[data-palette="plum"][data-theme="auto"] {
  --color-background: #231a27;
  --color-surface: #2e2233;
  --color-surface-muted: #402f47;
  --color-foreground: #f5e9f8;
  --color-muted-foreground: #d1bbd7;
  --color-primary: #d6ace1;
  --color-primary-hover: #e9c6f1;
  --color-primary-soft: #51385b;
  --color-on-primary: #301939;
  --color-feature: #432e4b;
  --color-on-feature: #fff5ff;
  --color-feature-muted: #e1c8e7;
  --color-border: #624b6b;
  --color-control-border: #a28aaa;
  --color-focus: #e0b8f1;
}
}

/* Palette samples intentionally remain stable while previewing other colors. */
[data-swatch="paper"] { --swatch-bg: #f4f1e9; --swatch-accent: #824338; --swatch-ink: #343c34; }
[data-swatch="ocean"] { --swatch-bg: #e1eaf2; --swatch-accent: #235b8e; --swatch-ink: #1f3c54; }
[data-swatch="forest"] { --swatch-bg: #e0ebdf; --swatch-accent: #306344; --swatch-ink: #294736; }
[data-swatch="plum"] { --swatch-bg: #ece2ee; --swatch-accent: #784581; --swatch-ink: #4e3456; }