@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;600&family=Cairo:wght@400;600&family=Cormorant+Garamond:wght@400;600&family=DM+Sans:wght@400;600&family=IBM+Plex+Sans:wght@400;600&family=IBM+Plex+Serif:wght@400;600&family=Karla:wght@400;600&family=Manrope:wght@400;600&family=Merriweather:wght@400;700&family=Nunito:wght@400;600&family=Playfair+Display:wght@400;600&family=Poppins:wght@400;600&family=Rajdhani:wght@400;600&family=Source+Serif+4:wght@400;600&family=Space+Grotesk:wght@400;600&family=Sora:wght@400;600&family=Unbounded:wght@400;600&family=Work+Sans:wght@400;600&display=swap');

:root[data-theme="serious-scholar"] {
  --pp-font-head: "Source Serif 4";
  --pp-font-body: "Inter";

  --pp-text-light: rgba(85,85,85,.92);
  --pp-text-dark: #2D333B;
  --pp-bg: #F7F7F7;
  --pp-accent: #5C6B7A;
  --pp-accent-2: #AAB3BF;

  --pp-c1: #F7F7F7;
  --pp-c2: #E6E8EB;
  --pp-c3: #C4C9D1;
  --pp-c4: #7D8795;
  --pp-c5: #3A4351;

  --pp-l1-bg: radial-gradient(circle at 20% 15%, rgba(170,179,191,0.55), transparent 56%),
              linear-gradient(145deg, rgba(247,247,247,1), rgba(196,201,209,0.55));
  --pp-l2-bg: radial-gradient(circle at 78% 20%, rgba(196,201,209,0.45), transparent 58%),
              linear-gradient(155deg, rgba(247,247,247,0.98), rgba(196,201,209,0.45));
  --pp-l3-bg: radial-gradient(circle at 85% 20%, rgba(125,135,149,0.5), transparent 56%),
              linear-gradient(160deg, rgba(230,232,235,0.98), rgba(125,135,149,0.4));
  --pp-l4-bg: radial-gradient(circle at 18% 72%, rgba(125,135,149,0.35), transparent 60%),
              linear-gradient(170deg, rgba(196,201,209,0.9), rgba(125,135,149,0.3));
  --pp-l5-bg: radial-gradient(circle at 15% 75%, rgba(58,67,81,0.45), transparent 55%),
              linear-gradient(165deg, rgba(196,201,209,0.9), rgba(58,67,81,0.45));

  --pp-glass-blur: 12px;
  --pp-glass-tint: rgba(196,201,209,0.10);
  --pp-shadow-base: 0 10px 22px rgba(58,67,81,0.16);
  --pp-border-base: 1px solid rgba(0,0,0,.08);
  --pp-border-strong: 1.5px solid rgba(0,0,0,.16);
  --pp-root-bg: radial-gradient(circle at 12% 12%, rgba(196,201,209,0.2), transparent 65%),
                linear-gradient(160deg, rgba(247,247,247,1), rgba(230,232,235,0.4));

  --pp-l1-opacity: .98; --pp-l1-radius: 6px; --pp-l1-shadow: 0 2px 8px rgba(0,0,0,0.10); --pp-l1-padding: 18px; --pp-l1-contrast: dark;
  --pp-l2-opacity: .95; --pp-l2-radius: 6px; --pp-l2-shadow: 0 4px 10px rgba(0,0,0,0.12); --pp-l2-padding: 16px; --pp-l2-contrast: dark;
  --pp-l3-opacity: .90; --pp-l3-radius: 6px; --pp-l3-shadow: 0 6px 12px rgba(0,0,0,0.14); --pp-l3-padding: 14px; --pp-l3-contrast: dark;
  --pp-l4-opacity: .85; --pp-l4-radius: 6px; --pp-l4-shadow: 0 8px 16px rgba(0,0,0,0.16); --pp-l4-padding: 12px; --pp-l4-contrast: light;
  --pp-l5-opacity: .80; --pp-l5-radius: 6px; --pp-l5-shadow: 0 10px 18px rgba(0,0,0,0.18); --pp-l5-padding: 10px; --pp-l5-contrast: light;
}

:root[data-theme="curious-lab"] {
  --pp-font-head: "Sora";
  --pp-font-body: "Inter";

  --pp-text-light: rgba(85,85,85,.92);
  --pp-text-dark: #173048;
  --pp-bg: #F1FBFF;
  --pp-accent: #45B4FF;
  --pp-accent-2: #9EDBFF;

  --pp-c1: #F1FBFF;
  --pp-c2: #D7F0FF;
  --pp-c3: #9EDBFF;
  --pp-c4: #45B4FF;
  --pp-c5: #0A5EA8;

  --pp-l1-bg: radial-gradient(circle at 18% 20%, rgba(158,219,255,0.65), transparent 58%),
              linear-gradient(150deg, rgba(241,251,255,1), rgba(158,219,255,0.55));
  --pp-l2-bg: radial-gradient(circle at 78% 20%, rgba(158,219,255,0.45), transparent 58%),
              linear-gradient(155deg, rgba(241,251,255,0.98), rgba(158,219,255,0.45));
  --pp-l3-bg: radial-gradient(circle at 78% 18%, rgba(69,180,255,0.55), transparent 56%),
              linear-gradient(165deg, rgba(215,240,255,0.98), rgba(69,180,255,0.4));
  --pp-l4-bg: radial-gradient(circle at 18% 72%, rgba(69,180,255,0.35), transparent 60%),
              linear-gradient(170deg, rgba(158,219,255,0.9), rgba(69,180,255,0.3));
  --pp-l5-bg: radial-gradient(circle at 18% 78%, rgba(10,94,168,0.5), transparent 55%),
              linear-gradient(170deg, rgba(158,219,255,0.9), rgba(10,94,168,0.45));

  --pp-glass-blur: 12px;
  --pp-glass-tint: rgba(69,180,255,0.12);
  --pp-shadow-base: 0 10px 22px rgba(10,94,168,0.16);
  --pp-border-base: 1px solid rgba(0,0,0,.08);
  --pp-border-strong: 1.5px solid rgba(0,0,0,.16);
  --pp-root-bg: radial-gradient(circle at 10% 12%, rgba(158,219,255,0.25), transparent 65%),
                linear-gradient(160deg, rgba(241,251,255,1), rgba(215,240,255,0.45));

  --pp-l1-opacity: .98; --pp-l1-radius: 12px; --pp-l1-shadow: 0 2px 10px rgba(10,94,168,0.10); --pp-l1-padding: 18px; --pp-l1-contrast: dark;
  --pp-l2-opacity: .95; --pp-l2-radius: 12px; --pp-l2-shadow: 0 4px 12px rgba(10,94,168,0.12); --pp-l2-padding: 16px; --pp-l2-contrast: dark;
  --pp-l3-opacity: .90; --pp-l3-radius: 12px; --pp-l3-shadow: 0 6px 14px rgba(10,94,168,0.14); --pp-l3-padding: 14px; --pp-l3-contrast: dark;
  --pp-l4-opacity: .85; --pp-l4-radius: 12px; --pp-l4-shadow: 0 8px 16px rgba(10,94,168,0.16); --pp-l4-padding: 12px; --pp-l4-contrast: light;
  --pp-l5-opacity: .80; --pp-l5-radius: 12px; --pp-l5-shadow: 0 10px 18px rgba(10,94,168,0.18); --pp-l5-padding: 10px; --pp-l5-contrast: light;
}

:root[data-theme="sunset-citrus"] {
  --pp-font-head: "Playfair Display";
  --pp-font-body: "Work Sans";

  --pp-text-light: rgba(85,85,85,.92);
  --pp-text-dark: #402420;
  --pp-bg: #FFF4E8;
  --pp-accent: #F25D3A;
  --pp-accent-2: #FFAD7A;

  --pp-c1: #FFF4E8;
  --pp-c2: #FFD2B8;
  --pp-c3: #FFAD7A;
  --pp-c4: #F25D3A;
  --pp-c5: #9F2F28;

  --pp-l1-bg: radial-gradient(circle at 15% 18%, rgba(255,173,122,0.6), transparent 58%),
              linear-gradient(150deg, rgba(255,244,232,1), rgba(255,173,122,0.5));
  --pp-l2-bg: radial-gradient(circle at 78% 20%, rgba(255,210,184,0.45), transparent 58%),
              linear-gradient(155deg, rgba(255,244,232,0.98), rgba(255,210,184,0.45));
  --pp-l3-bg: radial-gradient(circle at 80% 18%, rgba(242,93,58,0.5), transparent 56%),
              linear-gradient(165deg, rgba(255,210,184,0.98), rgba(242,93,58,0.4));
  --pp-l4-bg: radial-gradient(circle at 18% 72%, rgba(242,93,58,0.35), transparent 60%),
              linear-gradient(170deg, rgba(255,173,122,0.9), rgba(242,93,58,0.3));
  --pp-l5-bg: radial-gradient(circle at 18% 78%, rgba(159,47,40,0.5), transparent 55%),
              linear-gradient(170deg, rgba(255,173,122,0.9), rgba(159,47,40,0.45));

  --pp-glass-blur: 12px;
  --pp-glass-tint: rgba(255,173,122,0.12);
  --pp-shadow-base: 0 10px 22px rgba(159,47,40,0.18);
  --pp-border-base: 1px solid rgba(0,0,0,.08);
  --pp-border-strong: 1.5px solid rgba(0,0,0,.16);
  --pp-root-bg: radial-gradient(circle at 10% 12%, rgba(255,173,122,0.22), transparent 65%),
                linear-gradient(160deg, rgba(255,244,232,1), rgba(255,210,184,0.4));

  --pp-l1-opacity: .98; --pp-l1-radius: 18px; --pp-l1-shadow: 0 4px 12px rgba(159,47,40,0.12); --pp-l1-padding: 18px; --pp-l1-contrast: dark;
  --pp-l2-opacity: .95; --pp-l2-radius: 16px; --pp-l2-shadow: 0 6px 16px rgba(159,47,40,0.14); --pp-l2-padding: 16px; --pp-l2-contrast: dark;
  --pp-l3-opacity: .90; --pp-l3-radius: 14px; --pp-l3-shadow: 0 8px 18px rgba(159,47,40,0.16); --pp-l3-padding: 14px; --pp-l3-contrast: dark;
  --pp-l4-opacity: .85; --pp-l4-radius: 12px; --pp-l4-shadow: 0 10px 22px rgba(159,47,40,0.18); --pp-l4-padding: 12px; --pp-l4-contrast: light;
  --pp-l5-opacity: .80; --pp-l5-radius: 10px; --pp-l5-shadow: 0 12px 26px rgba(159,47,40,0.20); --pp-l5-padding: 10px; --pp-l5-contrast: light;
}

:root[data-theme="neon-slate"] {
  --pp-font-head: "Space Grotesk";
  --pp-font-body: "DM Sans";

  --pp-text-light: rgba(85,85,85,.92);
  --pp-text-dark: #1E2A36;
  --pp-bg: #F3F6FA;
  --pp-accent: #4B6B8F;
  --pp-accent-2: #9EB2CC;

  --pp-c1: #F3F6FA;
  --pp-c2: #D8E1EE;
  --pp-c3: #9EB2CC;
  --pp-c4: #4B6B8F;
  --pp-c5: #1E2F45;

  --pp-l1-bg: radial-gradient(circle at 18% 16%, rgba(158,178,204,0.6), transparent 58%),
              linear-gradient(150deg, rgba(243,246,250,1), rgba(158,178,204,0.5));
  --pp-l2-bg: radial-gradient(circle at 78% 20%, rgba(216,225,238,0.45), transparent 58%),
              linear-gradient(155deg, rgba(243,246,250,0.98), rgba(216,225,238,0.45));
  --pp-l3-bg: radial-gradient(circle at 84% 18%, rgba(75,107,143,0.5), transparent 56%),
              linear-gradient(165deg, rgba(216,225,238,0.98), rgba(75,107,143,0.4));
  --pp-l4-bg: radial-gradient(circle at 18% 72%, rgba(75,107,143,0.35), transparent 60%),
              linear-gradient(170deg, rgba(158,178,204,0.9), rgba(75,107,143,0.3));
  --pp-l5-bg: radial-gradient(circle at 18% 78%, rgba(30,47,69,0.5), transparent 55%),
              linear-gradient(170deg, rgba(158,178,204,0.9), rgba(30,47,69,0.45));

  --pp-glass-blur: 12px;
  --pp-glass-tint: rgba(158,178,204,0.12);
  --pp-shadow-base: 0 10px 22px rgba(30,47,69,0.18);
  --pp-border-base: 1px solid rgba(0,0,0,.08);
  --pp-border-strong: 1.5px solid rgba(0,0,0,.16);
  --pp-root-bg: radial-gradient(circle at 12% 12%, rgba(158,178,204,0.22), transparent 65%),
                linear-gradient(160deg, rgba(243,246,250,1), rgba(216,225,238,0.4));

  --pp-l1-opacity: .98; --pp-l1-radius: 8px; --pp-l1-shadow: 0 2px 10px rgba(30,47,69,0.14); --pp-l1-padding: 18px; --pp-l1-contrast: dark;
  --pp-l2-opacity: .95; --pp-l2-radius: 8px; --pp-l2-shadow: 0 4px 12px rgba(30,47,69,0.16); --pp-l2-padding: 16px; --pp-l2-contrast: dark;
  --pp-l3-opacity: .90; --pp-l3-radius: 8px; --pp-l3-shadow: 0 6px 14px rgba(30,47,69,0.18); --pp-l3-padding: 14px; --pp-l3-contrast: dark;
  --pp-l4-opacity: .85; --pp-l4-radius: 8px; --pp-l4-shadow: 0 8px 16px rgba(30,47,69,0.20); --pp-l4-padding: 12px; --pp-l4-contrast: light;
  --pp-l5-opacity: .80; --pp-l5-radius: 8px; --pp-l5-shadow: 0 10px 18px rgba(30,47,69,0.22); --pp-l5-padding: 10px; --pp-l5-contrast: light;
}

:root[data-theme="botanic-moss"] {
  --pp-font-head: "Cormorant Garamond";
  --pp-font-body: "Karla";

  --pp-text-light: rgba(85,85,85,.92);
  --pp-text-dark: #264032;
  --pp-bg: #F3F8F1;
  --pp-accent: #5C8A64;
  --pp-accent-2: #A4C3A0;

  --pp-c1: #F3F8F1;
  --pp-c2: #D7E7D2;
  --pp-c3: #A4C3A0;
  --pp-c4: #5C8A64;
  --pp-c5: #2D4F36;

  --pp-l1-bg: radial-gradient(circle at 16% 18%, rgba(164,195,160,0.6), transparent 58%),
              linear-gradient(150deg, rgba(243,248,241,1), rgba(164,195,160,0.5));
  --pp-l2-bg: radial-gradient(circle at 78% 20%, rgba(215,231,210,0.45), transparent 58%),
              linear-gradient(155deg, rgba(243,248,241,0.98), rgba(215,231,210,0.45));
  --pp-l3-bg: radial-gradient(circle at 80% 18%, rgba(92,138,100,0.5), transparent 56%),
              linear-gradient(165deg, rgba(215,231,210,0.98), rgba(92,138,100,0.4));
  --pp-l4-bg: radial-gradient(circle at 18% 72%, rgba(92,138,100,0.35), transparent 60%),
              linear-gradient(170deg, rgba(164,195,160,0.9), rgba(92,138,100,0.3));
  --pp-l5-bg: radial-gradient(circle at 18% 78%, rgba(45,79,54,0.5), transparent 55%),
              linear-gradient(170deg, rgba(164,195,160,0.9), rgba(45,79,54,0.45));

  --pp-glass-blur: 12px;
  --pp-glass-tint: rgba(164,195,160,0.12);
  --pp-shadow-base: 0 10px 22px rgba(45,79,54,0.18);
  --pp-border-base: 1px solid rgba(0,0,0,.08);
  --pp-border-strong: 1.5px solid rgba(0,0,0,.16);
  --pp-root-bg: radial-gradient(circle at 10% 12%, rgba(164,195,160,0.22), transparent 65%),
                linear-gradient(160deg, rgba(243,248,241,1), rgba(215,231,210,0.4));

  --pp-l1-opacity: .98; --pp-l1-radius: 16px; --pp-l1-shadow: 0 4px 12px rgba(45,79,54,0.12); --pp-l1-padding: 18px; --pp-l1-contrast: dark;
  --pp-l2-opacity: .95; --pp-l2-radius: 16px; --pp-l2-shadow: 0 6px 16px rgba(45,79,54,0.14); --pp-l2-padding: 16px; --pp-l2-contrast: dark;
  --pp-l3-opacity: .90; --pp-l3-radius: 14px; --pp-l3-shadow: 0 8px 18px rgba(45,79,54,0.16); --pp-l3-padding: 14px; --pp-l3-contrast: dark;
  --pp-l4-opacity: .85; --pp-l4-radius: 12px; --pp-l4-shadow: 0 10px 22px rgba(45,79,54,0.18); --pp-l4-padding: 12px; --pp-l4-contrast: light;
  --pp-l5-opacity: .80; --pp-l5-radius: 10px; --pp-l5-shadow: 0 12px 26px rgba(45,79,54,0.20); --pp-l5-padding: 10px; --pp-l5-contrast: light;
}

:root[data-theme="noir-orchid"] {
  --pp-font-head: "Unbounded";
  --pp-font-body: "Manrope";

  --pp-text-light: rgba(85,85,85,.92);
  --pp-text-dark: #2B1B3A;
  --pp-bg: #F7F2FA;
  --pp-accent: #7A4BB3;
  --pp-accent-2: #B89AD9;

  --pp-c1: #F7F2FA;
  --pp-c2: #E2D0EF;
  --pp-c3: #B89AD9;
  --pp-c4: #7A4BB3;
  --pp-c5: #3B1F5F;

  --pp-l1-bg: radial-gradient(circle at 18% 18%, rgba(184,154,217,0.6), transparent 58%),
              linear-gradient(150deg, rgba(247,242,250,1), rgba(184,154,217,0.5));
  --pp-l2-bg: radial-gradient(circle at 78% 20%, rgba(226,208,239,0.45), transparent 58%),
              linear-gradient(155deg, rgba(247,242,250,0.98), rgba(226,208,239,0.45));
  --pp-l3-bg: radial-gradient(circle at 82% 18%, rgba(122,75,179,0.5), transparent 56%),
              linear-gradient(165deg, rgba(226,208,239,0.98), rgba(122,75,179,0.4));
  --pp-l4-bg: radial-gradient(circle at 18% 72%, rgba(122,75,179,0.35), transparent 60%),
              linear-gradient(170deg, rgba(184,154,217,0.9), rgba(122,75,179,0.3));
  --pp-l5-bg: radial-gradient(circle at 18% 78%, rgba(59,31,95,0.5), transparent 55%),
              linear-gradient(170deg, rgba(184,154,217,0.9), rgba(59,31,95,0.45));

  --pp-glass-blur: 12px;
  --pp-glass-tint: rgba(184,154,217,0.12);
  --pp-shadow-base: 0 10px 22px rgba(59,31,95,0.18);
  --pp-border-base: 1px solid rgba(0,0,0,.08);
  --pp-border-strong: 1.5px solid rgba(0,0,0,.16);
  --pp-root-bg: radial-gradient(circle at 12% 12%, rgba(184,154,217,0.22), transparent 65%),
                linear-gradient(160deg, rgba(247,242,250,1), rgba(226,208,239,0.4));

  --pp-l1-opacity: .98; --pp-l1-radius: 20px; --pp-l1-shadow: 0 4px 12px rgba(59,31,95,0.12); --pp-l1-padding: 18px; --pp-l1-contrast: dark;
  --pp-l2-opacity: .95; --pp-l2-radius: 18px; --pp-l2-shadow: 0 6px 16px rgba(59,31,95,0.14); --pp-l2-padding: 16px; --pp-l2-contrast: dark;
  --pp-l3-opacity: .90; --pp-l3-radius: 16px; --pp-l3-shadow: 0 8px 18px rgba(59,31,95,0.16); --pp-l3-padding: 14px; --pp-l3-contrast: dark;
  --pp-l4-opacity: .85; --pp-l4-radius: 14px; --pp-l4-shadow: 0 10px 22px rgba(59,31,95,0.18); --pp-l4-padding: 12px; --pp-l4-contrast: light;
  --pp-l5-opacity: .80; --pp-l5-radius: 12px; --pp-l5-shadow: 0 12px 26px rgba(59,31,95,0.20); --pp-l5-padding: 10px; --pp-l5-contrast: light;
}

/* Themes redefined as palette-rotation patterns */
:root[data-theme="121212"],
:root[data-theme="123123"],
:root[data-theme="1234"],
:root[data-theme="12345"] {
  --pp-font-head: "Source Serif 4";
  --pp-font-body: "Work Sans";

  --pp-text-light: rgba(85,85,85,.92);
  --pp-text-dark: #1F1F1F;
  --pp-bg: var(--pp-c1);
  --pp-accent: var(--pp-c4);
  --pp-accent-2: var(--pp-c3);

  --pp-glass-blur: 6px;
  --pp-glass-tint: rgba(0,0,0,0.04);
  --pp-shadow-base: 0 6px 12px rgba(0,0,0,0.10);
  --pp-border-base: 1px solid rgba(0,0,0,0.05);
  --pp-border-strong: 1px solid rgba(0,0,0,0.08);
  --pp-root-bg: var(--pp-c1);

  --pp-l1-opacity: .98; --pp-l1-radius: 10px; --pp-l1-shadow: 0 2px 6px rgba(0,0,0,0.08); --pp-l1-padding: 18px; --pp-l1-contrast: dark;
  --pp-l2-opacity: .95; --pp-l2-radius: 10px; --pp-l2-shadow: 0 3px 8px rgba(0,0,0,0.10); --pp-l2-padding: 16px; --pp-l2-contrast: dark;
  --pp-l3-opacity: .90; --pp-l3-radius: 10px; --pp-l3-shadow: 0 4px 10px rgba(0,0,0,0.12); --pp-l3-padding: 14px; --pp-l3-contrast: dark;
  --pp-l4-opacity: .85; --pp-l4-radius: 10px; --pp-l4-shadow: 0 5px 12px rgba(0,0,0,0.14); --pp-l4-padding: 12px; --pp-l4-contrast: light;
  --pp-l5-opacity: .80; --pp-l5-radius: 10px; --pp-l5-shadow: 0 6px 14px rgba(0,0,0,0.16); --pp-l5-padding: 10px; --pp-l5-contrast: light;
}

:root[data-theme="121212"] {
  --pp-l1-bg: var(--pp-c1);
  --pp-l2-bg: var(--pp-c2);
  --pp-l3-bg: var(--pp-c1);
  --pp-l4-bg: var(--pp-c2);
  --pp-l5-bg: var(--pp-c1);
}

:root[data-theme="123123"] {
  --pp-l1-bg: var(--pp-c1);
  --pp-l2-bg: var(--pp-c2);
  --pp-l3-bg: var(--pp-c3);
  --pp-l4-bg: var(--pp-c2);
  --pp-l5-bg: var(--pp-c1);
}

:root[data-theme="1234"] {
  --pp-l1-bg: var(--pp-c1);
  --pp-l2-bg: var(--pp-c2);
  --pp-l3-bg: var(--pp-c3);
  --pp-l4-bg: var(--pp-c4);
  --pp-l5-bg: var(--pp-c3);
}

:root[data-theme="12345"] {
  --pp-l1-bg: var(--pp-c1);
  --pp-l2-bg: var(--pp-c2);
  --pp-l3-bg: var(--pp-c3);
  --pp-l4-bg: var(--pp-c4);
  --pp-l5-bg: var(--pp-c5);
}

:root[data-theme="storybook"] {
  --pp-font-head: "Merriweather";
  --pp-font-body: "Poppins";

  --pp-text-light: rgba(85,85,85,.92);
  --pp-text-dark: #3A2A1C;
  --pp-bg: #FFF6F0;
  --pp-accent: #C47543;
  --pp-accent-2: #E7B28B;

  --pp-c1: #FFF6F0;
  --pp-c2: #F7DCC9;
  --pp-c3: #E7B28B;
  --pp-c4: #C47543;
  --pp-c5: #6E3B1F;

  --pp-l1-bg: radial-gradient(circle at 16% 18%, rgba(231,178,139,0.65), transparent 58%),
              linear-gradient(145deg, rgba(255,246,240,1), rgba(231,178,139,0.55));
  --pp-l2-bg: radial-gradient(circle at 78% 20%, rgba(231,178,139,0.45), transparent 58%),
              linear-gradient(155deg, rgba(255,246,240,0.98), rgba(231,178,139,0.45));
  --pp-l3-bg: radial-gradient(circle at 80% 20%, rgba(196,117,67,0.55), transparent 56%),
              linear-gradient(165deg, rgba(247,220,201,0.98), rgba(196,117,67,0.4));
  --pp-l4-bg: radial-gradient(circle at 18% 72%, rgba(196,117,67,0.35), transparent 60%),
              linear-gradient(170deg, rgba(231,178,139,0.9), rgba(196,117,67,0.3));
  --pp-l5-bg: radial-gradient(circle at 18% 78%, rgba(110,59,31,0.55), transparent 55%),
              linear-gradient(170deg, rgba(231,178,139,0.9), rgba(110,59,31,0.5));

  --pp-glass-blur: 12px;
  --pp-glass-tint: rgba(231,178,139,0.12);
  --pp-shadow-base: 0 10px 22px rgba(110,59,31,0.16);
  --pp-border-base: 1px solid rgba(0,0,0,.08);
  --pp-border-strong: 1.5px solid rgba(0,0,0,.16);
  --pp-root-bg: radial-gradient(circle at 10% 12%, rgba(231,178,139,0.22), transparent 65%),
                linear-gradient(160deg, rgba(255,246,240,1), rgba(247,220,201,0.4));

  --pp-l1-opacity: .98; --pp-l1-radius: 18px; --pp-l1-shadow: 0 4px 12px rgba(110,59,31,0.10); --pp-l1-padding: 18px; --pp-l1-contrast: dark;
  --pp-l2-opacity: .95; --pp-l2-radius: 16px; --pp-l2-shadow: 0 6px 16px rgba(110,59,31,0.12); --pp-l2-padding: 16px; --pp-l2-contrast: dark;
  --pp-l3-opacity: .90; --pp-l3-radius: 14px; --pp-l3-shadow: 0 8px 18px rgba(110,59,31,0.14); --pp-l3-padding: 14px; --pp-l3-contrast: dark;
  --pp-l4-opacity: .85; --pp-l4-radius: 12px; --pp-l4-shadow: 0 10px 22px rgba(110,59,31,0.16); --pp-l4-padding: 12px; --pp-l4-contrast: light;
  --pp-l5-opacity: .80; --pp-l5-radius: 10px; --pp-l5-shadow: 0 12px 28px rgba(110,59,31,0.18); --pp-l5-padding: 10px; --pp-l5-contrast: light;
}