:root,
[data-theme="default-current"] {
  --page-background:
    radial-gradient(circle at 20% 0%, rgba(180, 140, 255, 0.28), transparent 20rem),
    radial-gradient(circle at 84% 78%, rgba(22, 199, 196, 0.18), transparent 18rem),
    linear-gradient(180deg, #111642 0%, #090e2d 72%, #05091f 100%);
  --main-card-background: #151a4a;
  --card-background: #fff9e5;
  --text-color: #fff8dc;
  --muted-text-color: #d7d2c1;
  --heading-color: #fff8dc;
  --accent-primary: #ff5b4f;
  --accent-primary-dark: #e3453d;
  --accent-secondary: #16c7c4;
  --accent-secondary-dark: #0b9393;
  --accent-warm: #ffc93d;
  --accent-warm-soft: #ffe38d;
  --border-color: #ffc93d;
  --button-radius: 999px;
  --compact-button-radius: 999px;
  --main-card-radius: 30px;
  --card-radius: 26px;
  --panel-radius: 18px;
  --badge-radius: 999px;
  --card-border: 3px solid rgba(255, 201, 61, 0.58);
  --main-card-border: 2px solid rgba(255, 201, 61, 0.32);
  --field-border-color: rgba(22, 199, 196, 0.44);
  --focus-ring: rgba(22, 199, 196, 0.38);
  --shadow: 0 28px 78px rgba(0, 0, 0, 0.34);
  --soft-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
  --badge-bg: var(--accent-warm);
  --badge-text: #10143a;
  --badge-alt-bg: var(--accent-secondary);
  --badge-alt-text: #10143a;
  --badge-warm-bg: var(--accent-primary);
  --badge-warm-text: #fff;
  --decorative-motif-display: block;
  --decorative-motif-opacity: 1;
  --logo-filter: drop-shadow(0 12px 16px rgba(0, 0, 0, 0.22));
  --cream: var(--main-card-background);
  --paper: var(--card-background);
  --ink: var(--text-color);
  --muted: var(--muted-text-color);
  --teal: var(--accent-secondary);
  --teal-dark: var(--accent-secondary-dark);
  --coral: var(--accent-primary);
  --coral-dark: var(--accent-primary-dark);
  --gold: var(--accent-warm);
  --gold-soft: var(--accent-warm-soft);
  --line: var(--border-color);
}

[data-theme="family-bold"] {
  --page-background:
    radial-gradient(circle at 12% 10%, rgba(255, 215, 77, 0.35), transparent 18rem),
    radial-gradient(circle at 88% 84%, rgba(0, 174, 181, 0.28), transparent 19rem),
    #fff3df;
  --main-card-background: #fff9e8;
  --card-background: #ffffff;
  --text-color: #112857;
  --muted-text-color: #5b5870;
  --heading-color: #112857;
  --accent-primary: #ff4f5e;
  --accent-primary-dark: #d93645;
  --accent-secondary: #00aeb5;
  --accent-secondary-dark: #007a82;
  --accent-warm: #ffc83d;
  --accent-warm-soft: #ffe08a;
  --border-color: #112857;
  --button-radius: 14px;
  --compact-button-radius: 10px;
  --main-card-radius: 28px;
  --card-radius: 26px;
  --panel-radius: 14px;
  --card-border: 2px solid var(--border-color);
  --main-card-border: 2px solid rgba(17, 40, 87, 0.28);
  --field-border-color: rgba(17, 40, 87, 0.35);
  --focus-ring: rgba(0, 174, 181, 0.36);
  --shadow: 0 18px 0 rgba(17, 40, 87, 0.12), 0 26px 44px rgba(17, 40, 87, 0.15);
  --soft-shadow: 0 7px 0 rgba(17, 40, 87, 0.12);
  --badge-bg: #112857;
  --badge-text: #fff;
  --badge-alt-bg: var(--accent-primary);
  --badge-alt-text: #fff;
  --badge-warm-bg: var(--accent-warm);
  --badge-warm-text: #112857;
}

[data-theme="soft-playful"] {
  --page-background:
    radial-gradient(circle at 18% 16%, rgba(255, 172, 170, 0.26), transparent 17rem),
    radial-gradient(circle at 80% 78%, rgba(137, 214, 210, 0.26), transparent 18rem),
    #f8f0ea;
  --main-card-background: #fff7f1;
  --card-background: #fffdf9;
  --text-color: #26344f;
  --muted-text-color: #756a6f;
  --heading-color: #26344f;
  --accent-primary: #f47f7b;
  --accent-primary-dark: #cc5f62;
  --accent-secondary: #72c7c0;
  --accent-secondary-dark: #358f8a;
  --accent-warm: #f2bd62;
  --accent-warm-soft: #f8ddb0;
  --border-color: #eab983;
  --button-radius: 24px;
  --compact-button-radius: 18px;
  --main-card-radius: 34px;
  --card-radius: 32px;
  --panel-radius: 22px;
  --main-card-border: 1px solid rgba(234, 185, 131, 0.42);
  --field-border-color: rgba(114, 199, 192, 0.42);
  --focus-ring: rgba(244, 127, 123, 0.28);
  --shadow: 0 18px 50px rgba(73, 58, 74, 0.13);
  --soft-shadow: 0 10px 24px rgba(73, 58, 74, 0.11);
  --badge-bg: #fff0ea;
  --badge-text: #9b4f55;
  --badge-alt-bg: #e7f7f4;
  --badge-alt-text: #247a75;
  --badge-warm-bg: #fff3cf;
  --badge-warm-text: #705027;
  --decorative-motif-opacity: 0.58;
}

[data-theme="bright-social"] {
  --page-background:
    linear-gradient(135deg, rgba(10, 111, 255, 0.16), transparent 34%),
    radial-gradient(circle at 88% 16%, rgba(255, 214, 0, 0.34), transparent 17rem),
    #f4fbff;
  --main-card-background: #ffffff;
  --card-background: #ffffff;
  --text-color: #101828;
  --muted-text-color: #667085;
  --heading-color: #0b285f;
  --accent-primary: #ff5a5f;
  --accent-primary-dark: #d64147;
  --accent-secondary: #0a84ff;
  --accent-secondary-dark: #0062c7;
  --accent-warm: #ffd600;
  --accent-warm-soft: #ffe96b;
  --border-color: #8bd2ff;
  --button-radius: 16px;
  --compact-button-radius: 12px;
  --main-card-radius: 24px;
  --card-radius: 22px;
  --panel-radius: 16px;
  --main-card-border: 1px solid rgba(10, 132, 255, 0.18);
  --field-border-color: rgba(10, 132, 255, 0.28);
  --focus-ring: rgba(10, 132, 255, 0.28);
  --shadow: 0 22px 48px rgba(16, 24, 40, 0.12);
  --soft-shadow: 0 10px 22px rgba(16, 24, 40, 0.1);
  --badge-bg: var(--accent-secondary);
  --badge-text: #fff;
  --badge-alt-bg: var(--accent-primary);
  --badge-alt-text: #fff;
  --badge-warm-bg: var(--accent-warm);
  --badge-warm-text: #101828;
}

[data-theme="paper-tactile"] {
  --page-background:
    linear-gradient(90deg, rgba(67, 44, 27, 0.035) 1px, transparent 1px),
    linear-gradient(rgba(67, 44, 27, 0.035) 1px, transparent 1px),
    #f4ead8;
  --main-card-background: #fff8e9;
  --card-background: #fffdf5;
  --text-color: #2f261c;
  --muted-text-color: #736550;
  --heading-color: #382512;
  --accent-primary: #d9583f;
  --accent-primary-dark: #a93f2d;
  --accent-secondary: #2f8f83;
  --accent-secondary-dark: #1f665f;
  --accent-warm: #d99a2b;
  --accent-warm-soft: #edc47b;
  --border-color: #c8944d;
  --button-radius: 10px;
  --compact-button-radius: 8px;
  --main-card-radius: 18px;
  --card-radius: 16px;
  --panel-radius: 12px;
  --badge-radius: 8px;
  --main-card-border: 1.5px solid rgba(123, 84, 42, 0.35);
  --card-border: 1.5px solid rgba(123, 84, 42, 0.45);
  --field-border-color: rgba(123, 84, 42, 0.35);
  --focus-ring: rgba(47, 143, 131, 0.28);
  --shadow: 0 14px 34px rgba(70, 46, 25, 0.16);
  --soft-shadow: 0 6px 14px rgba(70, 46, 25, 0.12);
  --badge-bg: #f4d5b6;
  --badge-text: #6e3725;
  --badge-alt-bg: #cfe6db;
  --badge-alt-text: #255a53;
  --badge-warm-bg: #f0c979;
  --badge-warm-text: #382512;
  --decorative-motif-opacity: 0.42;
}

[data-theme="playful-premium"] {
  --page-background:
    radial-gradient(circle at 14% 12%, rgba(252, 190, 86, 0.22), transparent 16rem),
    radial-gradient(circle at 84% 76%, rgba(47, 138, 126, 0.22), transparent 18rem),
    #f7f3ec;
  --main-card-background: #fffaf0;
  --card-background: #fffefa;
  --text-color: #162335;
  --muted-text-color: #69615a;
  --heading-color: #172033;
  --accent-primary: #e15b4f;
  --accent-primary-dark: #b8463e;
  --accent-secondary: #2f8a7e;
  --accent-secondary-dark: #20665e;
  --accent-warm: #dca449;
  --accent-warm-soft: #efcf92;
  --border-color: #d7a85f;
  --button-radius: 18px;
  --compact-button-radius: 14px;
  --main-card-radius: 30px;
  --card-radius: 28px;
  --panel-radius: 18px;
  --main-card-border: 1px solid rgba(215, 168, 95, 0.5);
  --field-border-color: rgba(47, 138, 126, 0.28);
  --focus-ring: rgba(220, 164, 73, 0.32);
  --shadow: 0 26px 70px rgba(22, 35, 53, 0.18);
  --soft-shadow: 0 12px 28px rgba(22, 35, 53, 0.13);
  --badge-bg: #172033;
  --badge-text: #fffaf0;
  --badge-alt-bg: #2f8a7e;
  --badge-alt-text: #fffaf0;
  --badge-warm-bg: #dca449;
  --badge-warm-text: #172033;
  --decorative-motif-opacity: 0.78;
}