@import url("./classroom-fonts.css");

body.theme-liquid-woodland {
  --font-sans: "Classroom Chicago", "Chicago", "ChicagoFLF", "Charcoal", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Classroom Univers", "Classroom Chicago", "Univers", "Chicago", "ChicagoFLF", "Charcoal", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  --page-top: #f7f9fd;
  --page-bottom: #e8eef8;
  --page-glow: rgba(0, 113, 227, 0.14);
  --page-glow-strong: rgba(120, 180, 255, 0.14);
  --glass-fill: rgba(255, 255, 255, 0.56);
  --glass-fill-strong: rgba(247, 250, 255, 0.84);
  --glass-fill-soft: rgba(255, 255, 255, 0.34);
  --glass-stroke: rgba(15, 46, 90, 0.12);
  --glass-stroke-soft: rgba(15, 46, 90, 0.08);
  --glass-shadow: 0 32px 96px rgba(35, 68, 121, 0.14), 0 18px 52px rgba(80, 122, 188, 0.14);
  --glass-shadow-soft: 0 18px 56px rgba(35, 68, 121, 0.12);
  --text-main: #17233a;
  --text-muted: rgba(23, 35, 58, 0.72);
  --text-soft: rgba(23, 35, 58, 0.56);
  --accent-gold: #0071e3;
  --accent-copper: #5b8dff;
  --accent-moss: #6aa8ff;
  --accent-sky: rgba(99, 166, 255, 0.88);
  --focus-ring: #5aa7ff;
  --surface-radius-lg: 36px;
  --surface-radius-md: 30px;
  --surface-radius-sm: 22px;
  background:
    radial-gradient(1200px 760px at 18% -10%, var(--page-glow), transparent 60%),
    radial-gradient(960px 620px at 85% 14%, var(--page-glow-strong), transparent 60%),
    linear-gradient(180deg, var(--page-top) 0%, #f0f5fc 32%, var(--page-bottom) 100%);
  color: var(--text-main);
  color-scheme: light;
  font-family: var(--font-sans);
  line-height: 1.55;
  overflow-x: hidden;
}

body.theme-liquid-woodland[data-lighting="morning"],
body.theme-liquid-woodland[data-lighting="day"],
body.theme-liquid-woodland[data-lighting="dusk"] {
  --page-top: #f7f9fd;
  --page-bottom: #e8eef8;
  --page-glow: rgba(0, 113, 227, 0.14);
  --page-glow-strong: rgba(120, 180, 255, 0.14);
  --glass-fill: rgba(255, 255, 255, 0.56);
  --glass-fill-strong: rgba(247, 250, 255, 0.84);
  --glass-fill-soft: rgba(255, 255, 255, 0.34);
  --glass-stroke: rgba(15, 46, 90, 0.12);
  --glass-stroke-soft: rgba(15, 46, 90, 0.08);
  --glass-shadow: 0 32px 96px rgba(35, 68, 121, 0.14), 0 18px 52px rgba(80, 122, 188, 0.14);
  --glass-shadow-soft: 0 18px 56px rgba(35, 68, 121, 0.12);
  --text-main: #17233a;
  --text-muted: rgba(23, 35, 58, 0.72);
  --text-soft: rgba(23, 35, 58, 0.56);
  --accent-gold: #0071e3;
  --accent-copper: #5b8dff;
  --accent-moss: #6aa8ff;
  --accent-sky: rgba(99, 166, 255, 0.88);
  --focus-ring: #5aa7ff;
  color-scheme: light;
}

body.theme-liquid-woodland[data-lighting="night"] {
  --page-top: #111827;
  --page-bottom: #070b12;
  --page-glow: rgba(72, 118, 198, 0.18);
  --page-glow-strong: rgba(34, 84, 162, 0.14);
  --glass-fill: rgba(12, 18, 30, 0.72);
  --glass-fill-strong: rgba(9, 14, 23, 0.86);
  --glass-fill-soft: rgba(16, 23, 38, 0.34);
  --glass-stroke: rgba(255, 255, 255, 0.14);
  --glass-stroke-soft: rgba(255, 255, 255, 0.08);
  --glass-shadow: 0 32px 96px rgba(3, 8, 16, 0.36), 0 18px 52px rgba(24, 44, 84, 0.26);
  --glass-shadow-soft: 0 18px 56px rgba(3, 8, 16, 0.28);
  --text-main: #f4f7ff;
  --text-muted: rgba(244, 247, 255, 0.74);
  --text-soft: rgba(244, 247, 255, 0.58);
  --accent-gold: #69a8ff;
  --accent-copper: #8ec0ff;
  --accent-moss: #8fb4ff;
  --accent-sky: rgba(142, 192, 255, 0.9);
  --focus-ring: #8ec0ff;
  color-scheme: dark;
}

body.theme-liquid-woodland[data-theme="sakura"] {
  --page-top: #fff7fa;
  --page-bottom: #fde7ef;
  --page-glow: rgba(255, 192, 203, 0.38);
  --page-glow-strong: rgba(255, 105, 180, 0.18);
  --glass-fill: rgba(255, 255, 255, 0.76);
  --glass-fill-strong: rgba(255, 255, 255, 0.94);
  --glass-fill-soft: rgba(255, 248, 252, 0.6);
  --glass-stroke: rgba(232, 102, 145, 0.34);
  --glass-stroke-soft: rgba(255, 154, 185, 0.2);
  --glass-shadow: 0 28px 72px rgba(187, 72, 116, 0.14), 0 16px 40px rgba(255, 183, 197, 0.2);
  --glass-shadow-soft: 0 16px 36px rgba(187, 72, 116, 0.12);
  --text-main: #4a0e1c;
  --text-muted: rgba(74, 14, 28, 0.76);
  --text-soft: rgba(74, 14, 28, 0.58);
  --accent-gold: #e86691;
  --accent-copper: #ffb7c5;
  --accent-moss: #ffcdd8;
  --accent-sky: rgba(255, 154, 185, 0.86);
  --focus-ring: #e86691;
  background:
    radial-gradient(ellipse 10px 16px at 22px 24px, rgba(255, 218, 224, 0.86) 0 58%, transparent 63%),
    radial-gradient(ellipse 7px 13px at 112px 40px, rgba(255, 255, 255, 0.92) 0 56%, transparent 62%),
    radial-gradient(ellipse 12px 18px at 72px 122px, rgba(255, 183, 197, 0.58) 0 56%, transparent 62%),
    radial-gradient(ellipse 8px 14px at 170px 78px, rgba(255, 204, 213, 0.82) 0 57%, transparent 63%),
    radial-gradient(ellipse 5px 9px at 238px 162px, rgba(232, 102, 145, 0.28) 0 58%, transparent 64%),
    radial-gradient(1200px 760px at 18% -10%, var(--page-glow), transparent 60%),
    radial-gradient(960px 620px at 85% 14%, var(--page-glow-strong), transparent 60%),
    linear-gradient(180deg, var(--page-top) 0%, #fff1f6 40%, var(--page-bottom) 100%);
  background-repeat: repeat, repeat, repeat, repeat, repeat, no-repeat, no-repeat, no-repeat;
  background-size: 300px 300px, 390px 390px, 340px 340px, 450px 450px, 280px 280px, auto, auto, auto;
  background-position: 0 -300px, 110px -390px, 160px -340px, 240px -450px, 40px -280px, 0 0, 0 0, 0 0;
  animation: sakura-petals-fall 24s linear infinite;
}

body.theme-liquid-woodland[data-theme="diamond"] {
  --page-top: #eafcff;
  --page-bottom: #d8f9fc;
  --page-glow: rgba(96, 232, 240, 0.36);
  --page-glow-strong: rgba(96, 232, 240, 0.24);
  --glass-fill: rgba(255, 255, 255, 0.82);
  --glass-fill-strong: rgba(255, 255, 255, 0.94);
  --glass-fill-soft: rgba(238, 253, 255, 0.7);
  --glass-stroke: rgba(8, 121, 133, 0.18);
  --glass-stroke-soft: rgba(96, 232, 240, 0.28);
  --glass-shadow: 0 28px 72px rgba(8, 121, 133, 0.16), 0 16px 40px rgba(96, 232, 240, 0.18);
  --glass-shadow-soft: 0 16px 36px rgba(8, 121, 133, 0.12);
  --text-main: #12343b;
  --text-muted: rgba(18, 52, 59, 0.76);
  --text-soft: rgba(49, 94, 102, 0.68);
  --accent-gold: #087985;
  --accent-copper: #60e8f0;
  --accent-moss: #315e66;
  --accent-sky: rgba(96, 232, 240, 0.84);
  --focus-ring: #087985;
}

body.theme-liquid-woodland[data-theme="emerald"] {
  --page-top: #f7fff8;
  --page-bottom: #f0fff4;
  --page-glow: rgba(169, 255, 209, 0.28);
  --page-glow-strong: rgba(80, 219, 130, 0.16);
  --glass-fill: rgba(255, 255, 255, 0.72);
  --glass-fill-strong: rgba(255, 255, 255, 0.92);
  --glass-fill-soft: rgba(247, 255, 249, 0.54);
  --glass-stroke: rgba(56, 155, 101, 0.3);
  --glass-stroke-soft: rgba(56, 155, 101, 0.18);
  --glass-shadow: 0 28px 72px rgba(56, 155, 101, 0.14), 0 16px 40px rgba(169, 255, 209, 0.18);
  --glass-shadow-soft: 0 16px 36px rgba(56, 155, 101, 0.12);
  --text-main: #1a3a2a;
  --text-muted: rgba(26, 58, 42, 0.74);
  --text-soft: rgba(26, 58, 42, 0.58);
  --accent-gold: #50db82;
  --accent-copper: #a9ffd1;
  --accent-moss: #c8ffe0;
  --accent-sky: rgba(80, 219, 130, 0.84);
  --focus-ring: #50db82;
}

body.theme-liquid-woodland[data-theme="topaz"] {
  --page-top: #fffaf0;
  --page-bottom: #fff9e3;
  --page-glow: rgba(255, 247, 173, 0.28);
  --page-glow-strong: rgba(255, 185, 0, 0.18);
  --glass-fill: rgba(255, 255, 255, 0.74);
  --glass-fill-strong: rgba(255, 255, 255, 0.94);
  --glass-fill-soft: rgba(255, 251, 235, 0.56);
  --glass-stroke: rgba(244, 169, 0, 0.32);
  --glass-stroke-soft: rgba(244, 169, 0, 0.18);
  --glass-shadow: 0 28px 72px rgba(196, 133, 0, 0.14), 0 16px 40px rgba(255, 215, 0, 0.16);
  --glass-shadow-soft: 0 16px 36px rgba(196, 133, 0, 0.12);
  --text-main: #5c3c00;
  --text-muted: rgba(92, 60, 0, 0.74);
  --text-soft: rgba(92, 60, 0, 0.58);
  --accent-gold: #ffb900;
  --accent-copper: #fff7ad;
  --accent-moss: #ffd94d;
  --accent-sky: rgba(255, 185, 0, 0.84);
  --focus-ring: #ffb900;
}

body.theme-liquid-woodland[data-theme="vaporwave"] {
  --page-top: #050505;
  --page-bottom: #0a0016;
  --page-glow: rgba(255, 0, 255, 0.18);
  --page-glow-strong: rgba(0, 255, 255, 0.14);
  --glass-fill: rgba(0, 0, 0, 0.84);
  --glass-fill-strong: rgba(8, 0, 18, 0.92);
  --glass-fill-soft: rgba(12, 0, 24, 0.64);
  --glass-stroke: rgba(255, 0, 255, 0.38);
  --glass-stroke-soft: rgba(0, 255, 255, 0.18);
  --glass-shadow: 5px 5px 0 rgba(255, 0, 255, 0.42), -3px -3px 0 rgba(0, 255, 255, 0.18);
  --glass-shadow-soft: 4px 4px 0 rgba(255, 0, 255, 0.34), -2px -2px 0 rgba(0, 255, 255, 0.14);
  --text-main: #ffffff;
  --text-muted: rgba(143, 252, 255, 0.8);
  --text-soft: rgba(143, 252, 255, 0.62);
  --accent-gold: #ff00ff;
  --accent-copper: #00ffff;
  --accent-moss: #ffff00;
  --accent-sky: rgba(0, 255, 255, 0.88);
  --focus-ring: #00ffff;
  color-scheme: dark;
  font-family: var(--font-mono);
}

@keyframes sakura-petals-fall {
  from {
    background-position: 0 -300px, 110px -390px, 160px -340px, 240px -450px, 40px -280px, 0 0, 0 0, 0 0;
  }
  to {
    background-position: 150px 900px, -50px 1200px, 220px 1050px, 100px 1350px, 185px 980px, 0 0, 0 0, 0 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.theme-liquid-woodland[data-theme="sakura"] {
    animation: none;
  }
}

@keyframes vaporwave-static-shift {
  0% { transform: translate3d(0, 0, 0); }
  33% { transform: translate3d(1px, -1px, 0); }
  66% { transform: translate3d(-1px, 1px, 0); }
  100% { transform: translate3d(0, 0, 0); }
}

@keyframes vaporwave-road-flicker {
  0%, 100% {
    opacity: 0.18;
    transform: translateX(-50%) perspective(640px) rotateX(68deg) scale(1);
  }
  50% {
    opacity: 0.3;
    transform: translateX(-50%) perspective(640px) rotateX(70deg) scale(1.04);
  }
}

body.theme-liquid-woodland::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.08;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='0.9'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

body.theme-liquid-woodland[data-theme="vaporwave"]::before {
  opacity: 0.05;
  background-image:
    repeating-linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.06) 0 1px,
      rgba(0, 0, 0, 0) 1px 3px
    ),
    linear-gradient(
      90deg,
      rgba(255, 0, 255, 0.06),
      rgba(0, 255, 255, 0.02),
      rgba(255, 255, 0, 0.05)
    ),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='0.9'/%3E%3C/svg%3E");
  background-size: auto, auto, 180px 180px;
  mix-blend-mode: screen;
  animation: vaporwave-static-shift 1.2s steps(2) infinite;
}

body.theme-liquid-woodland[data-theme="vaporwave"]::after {
  content: "";
  position: fixed;
  bottom: -10vh;
  left: 50%;
  z-index: 0;
  width: 180vw;
  height: 34vh;
  pointer-events: none;
  transform: translateX(-50%) perspective(640px) rotateX(68deg);
  background: linear-gradient(90deg, #ff00ff 0%, #00ffff 35%, #ffff00 68%, #ff00ff 100%);
  opacity: 0.16;
  filter: blur(36px);
  -webkit-mask-image: linear-gradient(to top, black 56%, transparent 100%);
  mask-image: linear-gradient(to top, black 56%, transparent 100%);
  animation: vaporwave-road-flicker 4s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  body.theme-liquid-woodland[data-theme="vaporwave"]::before,
  body.theme-liquid-woodland[data-theme="vaporwave"]::after {
    animation: none;
  }
}

body.theme-liquid-woodland .site-header,
body.theme-liquid-woodland main,
body.theme-liquid-woodland .site-footer {
  position: relative;
  z-index: 1;
}

body.theme-liquid-woodland .site-header {
  position: sticky;
  z-index: 120;
}

body.theme-liquid-woodland a {
  color: var(--accent-gold);
}

body.theme-liquid-woodland a:hover {
  color: var(--accent-copper);
}

body.theme-liquid-woodland .skip-link:focus {
  background: rgba(10, 16, 14, 0.92);
  color: var(--text-main);
  border: 1px solid rgba(255, 255, 255, 0.18);
}

body.theme-liquid-woodland :where(a, button, [role="button"], summary, input, select, textarea):focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}

body.theme-liquid-woodland .site-header {
  background: color-mix(in srgb, var(--glass-fill-strong) 82%, rgba(255, 255, 255, 0.24));
  border-bottom: 1px solid var(--glass-stroke);
  box-shadow: 0 18px 40px rgba(35, 68, 121, 0.14);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
  backdrop-filter: blur(18px) saturate(145%);
}

body.theme-liquid-woodland .nav-wrap {
  min-height: 72px;
  padding: 0.56rem 0;
  gap: 1.5rem;
}

body.theme-liquid-woodland .brand {
  display: inline-flex;
  align-items: center;
  gap: 0.62rem;
  color: var(--text-main);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  flex-shrink: 0;
}

body.theme-liquid-woodland .brand::before {
  content: "";
  width: 0.64rem;
  height: 0.64rem;
  border-radius: 999px;
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--accent-gold) 40%, white),
    var(--accent-copper)
  );
  box-shadow:
    0 0 0 6px color-mix(in srgb, var(--accent-gold) 14%, transparent),
    0 10px 22px color-mix(in srgb, var(--accent-gold) 24%, transparent);
  flex-shrink: 0;
}

body.theme-liquid-woodland .site-nav {
  min-width: 0;
}

body.theme-liquid-woodland .site-nav ul {
  align-items: center;
  justify-content: flex-end;
  gap: 0.42rem;
}

body.theme-liquid-woodland .site-nav ul > li {
  display: flex;
  align-items: center;
}

body.theme-liquid-woodland .site-nav a,
body.theme-liquid-woodland .topbar nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.4rem;
  padding: 0.46rem 0.84rem;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--text-soft);
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  transition:
    color 160ms ease,
    background 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease,
    transform 160ms ease;
}

body.theme-liquid-woodland .site-nav a[aria-current="page"],
body.theme-liquid-woodland .topbar nav a[aria-current="page"] {
  color: var(--text-main);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.26), rgba(255, 255, 255, 0.08)),
    var(--glass-fill);
  border-color: color-mix(in srgb, var(--accent-gold) 24%, rgba(255, 255, 255, 0.22));
  box-shadow:
    0 16px 30px rgba(35, 68, 121, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

body.theme-liquid-woodland .site-nav a:hover,
body.theme-liquid-woodland .topbar nav a:hover {
  color: var(--text-main);
  background: rgba(255, 255, 255, 0.08);
  border-color: var(--glass-stroke-soft);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transform: translateY(-1px);
}

body.theme-liquid-woodland .nav-toggle {
  color: var(--text-soft);
  border-color: transparent;
  background: transparent;
}

body.theme-liquid-woodland .nav-toggle:hover {
  color: var(--text-main);
  background: rgba(255, 255, 255, 0.08);
  border-color: var(--glass-stroke-soft);
}

body.theme-liquid-woodland .nav-settings {
  position: relative;
}

body.theme-liquid-woodland .nav-settings-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.52rem;
  min-height: 2.35rem;
  padding: 0.36rem 0.46rem 0.36rem 0.78rem;
  border: 1px solid var(--glass-stroke);
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.46), rgba(255, 255, 255, 0.18)),
    var(--glass-fill);
  color: var(--text-main);
  box-shadow: 0 18px 38px rgba(35, 68, 121, 0.16);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  backdrop-filter: blur(20px) saturate(150%);
}

body.theme-liquid-woodland .nav-settings-toggle:hover,
body.theme-liquid-woodland .nav-settings.is-open .nav-settings-toggle {
  border-color: color-mix(in srgb, var(--accent-gold) 28%, rgba(255, 255, 255, 0.52));
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0.24)),
    var(--glass-fill-strong);
}

body.theme-liquid-woodland .nav-settings-toggle svg {
  opacity: 0.82;
}

body.theme-liquid-woodland .nav-settings-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.45rem;
  padding: 0.16rem 0.54rem;
  border-radius: 999px;
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--accent-gold) 26%, rgba(255, 255, 255, 0.58)),
      color-mix(in srgb, var(--accent-gold) 42%, rgba(255, 255, 255, 0.12))
    );
  color: color-mix(in srgb, var(--text-main) 74%, var(--accent-gold));
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

body.theme-liquid-woodland .nav-settings-panel {
  width: min(420px, calc(100vw - 2rem));
  padding: 1.05rem;
  border: 1px solid var(--glass-stroke);
  border-radius: 28px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.16)),
    var(--glass-fill-strong);
  box-shadow: 0 30px 84px rgba(35, 68, 121, 0.18), 0 14px 36px rgba(80, 122, 188, 0.14);
  -webkit-backdrop-filter: blur(26px) saturate(160%);
  backdrop-filter: blur(26px) saturate(160%);
  z-index: 180;
}

body.theme-liquid-woodland .nav-settings-head {
  display: grid;
  gap: 0.28rem;
  margin-bottom: 0.82rem;
}

body.theme-liquid-woodland .nav-settings-eyebrow {
  color: var(--text-soft);
  font-size: 0.68rem;
  letter-spacing: 0.12em;
}

body.theme-liquid-woodland .nav-settings-current {
  color: var(--text-main);
  font-family: var(--font-sans);
  font-size: 1.38rem;
  line-height: 0.98;
}

body.theme-liquid-woodland .nav-settings-note {
  margin: 0 0 0.92rem;
  color: var(--text-muted);
  font-size: 0.82rem;
  line-height: 1.5;
}

body.theme-liquid-woodland .nav-settings-auto {
  display: flex;
  align-items: center;
  gap: 0.72rem;
  margin-bottom: 0.92rem;
  padding: 0.78rem 0.88rem;
  border: 1px solid var(--glass-stroke-soft);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.2);
  color: var(--text-main);
}

body.theme-liquid-woodland .nav-settings-auto input {
  flex-shrink: 0;
  accent-color: var(--accent-gold);
}

body.theme-liquid-woodland .nav-theme-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.68rem;
}

body.theme-liquid-woodland .nav-theme-chip {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: 0.68rem;
  min-height: 4rem;
  padding: 0.82rem 0.88rem;
  border: 1px solid var(--glass-stroke-soft);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.18);
  color: var(--text-main);
  box-shadow: none;
}

body.theme-liquid-woodland .nav-theme-chip:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--accent-gold) 26%, rgba(255, 255, 255, 0.54));
  background: rgba(255, 255, 255, 0.28);
}

body.theme-liquid-woodland .nav-theme-chip.is-active {
  border-color: color-mix(in srgb, var(--accent-gold) 36%, rgba(255, 255, 255, 0.58));
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--accent-gold) 20%, rgba(255, 255, 255, 0.38)),
      color-mix(in srgb, var(--accent-gold) 12%, rgba(255, 255, 255, 0.08))
    ),
    rgba(255, 255, 255, 0.24);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

body.theme-liquid-woodland .nav-theme-chip.is-muted {
  opacity: 0.72;
}

body.theme-liquid-woodland .nav-theme-label {
  display: grid;
  gap: 0.14rem;
  text-align: left;
}

body.theme-liquid-woodland .nav-theme-label strong {
  color: var(--text-main);
  font-size: 0.86rem;
  line-height: 1.1;
}

body.theme-liquid-woodland .nav-theme-label small {
  color: var(--text-muted);
  font-size: 0.73rem;
  line-height: 1.35;
}

body.theme-liquid-woodland .nav-theme-swatch {
  width: 0.94rem;
  height: 0.94rem;
  margin-top: 0.1rem;
  border-color: rgba(255, 255, 255, 0.3);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.04);
}

body.theme-liquid-woodland .nav-theme-chip[data-theme="day"] .nav-theme-swatch {
  background: linear-gradient(135deg, #dff1ff, #6eb6ff);
}

body.theme-liquid-woodland .nav-theme-chip[data-theme="night"] .nav-theme-swatch {
  background: linear-gradient(135deg, #445c93, #111827);
}

body.theme-liquid-woodland .nav-theme-chip[data-theme="sakura"] .nav-theme-swatch {
  background: linear-gradient(135deg, #fff7fb, #ff85b2);
}

body.theme-liquid-woodland .nav-theme-chip[data-theme="diamond"] .nav-theme-swatch {
  background: linear-gradient(135deg, #091224, #00c6ff);
}

body.theme-liquid-woodland .nav-theme-chip[data-theme="emerald"] .nav-theme-swatch {
  background: linear-gradient(135deg, #f4fff7, #50db82);
}

body.theme-liquid-woodland .nav-theme-chip[data-theme="topaz"] .nav-theme-swatch {
  background: linear-gradient(135deg, #fff9e3, #ffb900);
}

body.theme-liquid-woodland .nav-theme-chip[data-theme="vaporwave"] .nav-theme-swatch {
  background: linear-gradient(135deg, #050505 12%, #ff00ff 52%, #00ffff 100%);
}

body.theme-liquid-woodland[data-theme="sakura"] .site-header,
body.theme-liquid-woodland[data-theme="sakura"] .nav-settings-panel,
body.theme-liquid-woodland[data-theme="sakura"] .nav-settings-toggle,
body.theme-liquid-woodland[data-theme="sakura"] .nav-theme-chip,
body.theme-liquid-woodland[data-theme="sakura"] .launchpad-shell,
body.theme-liquid-woodland[data-theme="sakura"] .votd-card,
body.theme-liquid-woodland[data-theme="sakura"] .vod-card,
body.theme-liquid-woodland[data-theme="sakura"] .card,
body.theme-liquid-woodland[data-theme="sakura"] .module-banner,
body.theme-liquid-woodland[data-theme="sakura"] .module-tile-grid,
body.theme-liquid-woodland[data-theme="sakura"] .vl-card,
body.theme-liquid-woodland[data-theme="sakura"] .vl-modal,
body.theme-liquid-woodland[data-theme="sakura"] .music-theory-landscape,
body.theme-liquid-woodland[data-theme="sakura"] .music-interval-card,
body.theme-liquid-woodland[data-theme="sakura"] .music-interval-chip,
body.theme-liquid-woodland[data-theme="sakura"] .music-piano-wrap,
body.theme-liquid-woodland[data-theme="sakura"] .home-widget,
body.theme-liquid-woodland[data-theme="sakura"] .home-launch-card,
body.theme-liquid-woodland[data-theme="emerald"] .site-header,
body.theme-liquid-woodland[data-theme="emerald"] .nav-settings-panel,
body.theme-liquid-woodland[data-theme="emerald"] .nav-settings-toggle,
body.theme-liquid-woodland[data-theme="emerald"] .nav-theme-chip,
body.theme-liquid-woodland[data-theme="emerald"] .launchpad-shell,
body.theme-liquid-woodland[data-theme="emerald"] .votd-card,
body.theme-liquid-woodland[data-theme="emerald"] .vod-card,
body.theme-liquid-woodland[data-theme="emerald"] .card,
body.theme-liquid-woodland[data-theme="emerald"] .module-banner,
body.theme-liquid-woodland[data-theme="emerald"] .module-tile-grid,
body.theme-liquid-woodland[data-theme="emerald"] .vl-card,
body.theme-liquid-woodland[data-theme="emerald"] .vl-modal,
body.theme-liquid-woodland[data-theme="emerald"] .music-theory-landscape,
body.theme-liquid-woodland[data-theme="emerald"] .music-interval-card,
body.theme-liquid-woodland[data-theme="emerald"] .music-interval-chip,
body.theme-liquid-woodland[data-theme="emerald"] .music-piano-wrap,
body.theme-liquid-woodland[data-theme="emerald"] .home-widget,
body.theme-liquid-woodland[data-theme="emerald"] .home-launch-card,
body.theme-liquid-woodland[data-theme="topaz"] .site-header,
body.theme-liquid-woodland[data-theme="topaz"] .nav-settings-panel,
body.theme-liquid-woodland[data-theme="topaz"] .nav-settings-toggle,
body.theme-liquid-woodland[data-theme="topaz"] .nav-theme-chip,
body.theme-liquid-woodland[data-theme="topaz"] .launchpad-shell,
body.theme-liquid-woodland[data-theme="topaz"] .votd-card,
body.theme-liquid-woodland[data-theme="topaz"] .vod-card,
body.theme-liquid-woodland[data-theme="topaz"] .card,
body.theme-liquid-woodland[data-theme="topaz"] .module-banner,
body.theme-liquid-woodland[data-theme="topaz"] .module-tile-grid,
body.theme-liquid-woodland[data-theme="topaz"] .vl-card,
body.theme-liquid-woodland[data-theme="topaz"] .vl-modal,
body.theme-liquid-woodland[data-theme="topaz"] .music-theory-landscape,
body.theme-liquid-woodland[data-theme="topaz"] .music-interval-card,
body.theme-liquid-woodland[data-theme="topaz"] .music-interval-chip,
body.theme-liquid-woodland[data-theme="topaz"] .music-piano-wrap,
body.theme-liquid-woodland[data-theme="topaz"] .home-widget,
body.theme-liquid-woodland[data-theme="topaz"] .home-launch-card {
  border-color: var(--glass-stroke);
  box-shadow:
    0 14px 30px color-mix(in srgb, var(--accent-gold) 12%, transparent),
    inset 2px 2px 0 color-mix(in srgb, var(--accent-copper) 68%, white),
    inset -2px -2px 0 color-mix(in srgb, var(--accent-gold) 14%, transparent);
}

body.theme-liquid-woodland[data-theme="diamond"] .site-header,
body.theme-liquid-woodland[data-theme="diamond"] .nav-settings-panel,
body.theme-liquid-woodland[data-theme="diamond"] .nav-settings-toggle,
body.theme-liquid-woodland[data-theme="diamond"] .nav-theme-chip,
body.theme-liquid-woodland[data-theme="diamond"] .launchpad-shell,
body.theme-liquid-woodland[data-theme="diamond"] .votd-card,
body.theme-liquid-woodland[data-theme="diamond"] .vod-card,
body.theme-liquid-woodland[data-theme="diamond"] .card,
body.theme-liquid-woodland[data-theme="diamond"] .module-banner,
body.theme-liquid-woodland[data-theme="diamond"] .module-tile-grid,
body.theme-liquid-woodland[data-theme="diamond"] .vl-card,
body.theme-liquid-woodland[data-theme="diamond"] .vl-modal,
body.theme-liquid-woodland[data-theme="diamond"] .music-theory-landscape,
body.theme-liquid-woodland[data-theme="diamond"] .music-interval-card,
body.theme-liquid-woodland[data-theme="diamond"] .music-interval-chip,
body.theme-liquid-woodland[data-theme="diamond"] .music-piano-wrap,
body.theme-liquid-woodland[data-theme="diamond"] .home-widget,
body.theme-liquid-woodland[data-theme="diamond"] .home-launch-card {
  border-color: var(--glass-stroke);
  box-shadow:
    0 18px 36px rgba(8, 121, 133, 0.14),
    0 0 18px rgba(96, 232, 240, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

body.theme-liquid-woodland[data-theme="diamond"] .site-nav a[aria-current="page"],
body.theme-liquid-woodland[data-theme="diamond"] .site-nav a:hover,
body.theme-liquid-woodland[data-theme="diamond"] .nav-theme-chip.is-active,
body.theme-liquid-woodland[data-theme="diamond"] .nav-settings-toggle:hover {
  border-color: rgba(8, 121, 133, 0.28);
  background:
    linear-gradient(180deg, rgba(96, 232, 240, 0.28), rgba(255, 255, 255, 0.82)),
    rgba(238, 253, 255, 0.88);
}

body.theme-liquid-woodland[data-theme="vaporwave"] .site-header,
body.theme-liquid-woodland[data-theme="vaporwave"] .nav-settings-panel,
body.theme-liquid-woodland[data-theme="vaporwave"] .nav-settings-toggle,
body.theme-liquid-woodland[data-theme="vaporwave"] .nav-theme-chip,
body.theme-liquid-woodland[data-theme="vaporwave"] .launchpad-shell,
body.theme-liquid-woodland[data-theme="vaporwave"] .votd-card,
body.theme-liquid-woodland[data-theme="vaporwave"] .vod-card,
body.theme-liquid-woodland[data-theme="vaporwave"] .card,
body.theme-liquid-woodland[data-theme="vaporwave"] .module-banner,
body.theme-liquid-woodland[data-theme="vaporwave"] .module-tile-grid,
body.theme-liquid-woodland[data-theme="vaporwave"] .vl-card,
body.theme-liquid-woodland[data-theme="vaporwave"] .vl-modal,
body.theme-liquid-woodland[data-theme="vaporwave"] .music-theory-landscape,
body.theme-liquid-woodland[data-theme="vaporwave"] .music-interval-card,
body.theme-liquid-woodland[data-theme="vaporwave"] .music-interval-chip,
body.theme-liquid-woodland[data-theme="vaporwave"] .music-piano-wrap,
body.theme-liquid-woodland[data-theme="vaporwave"] .home-widget,
body.theme-liquid-woodland[data-theme="vaporwave"] .home-launch-card {
  background: linear-gradient(180deg, rgba(20, 0, 38, 0.96), rgba(0, 0, 0, 0.98));
  border-color: rgba(255, 0, 255, 0.48);
  border-radius: 8px;
  box-shadow:
    5px 5px 0 rgba(255, 0, 255, 0.38),
    -3px -3px 0 rgba(0, 255, 255, 0.18);
}

body.theme-liquid-woodland[data-theme="vaporwave"] .site-nav a[aria-current="page"],
body.theme-liquid-woodland[data-theme="vaporwave"] .site-nav a:hover,
body.theme-liquid-woodland[data-theme="vaporwave"] .nav-theme-chip.is-active,
body.theme-liquid-woodland[data-theme="vaporwave"] .nav-settings-toggle:hover {
  border-color: rgba(0, 255, 255, 0.72);
  background:
    linear-gradient(180deg, rgba(255, 0, 255, 0.12), rgba(0, 0, 0, 0.96));
  color: #ffff00;
  text-shadow:
    1px 0 0 rgba(255, 0, 255, 0.55),
    -1px 0 0 rgba(0, 255, 255, 0.55);
}

body.theme-liquid-woodland[data-theme="sakura"] .site-nav a[aria-current="page"],
body.theme-liquid-woodland[data-theme="sakura"] .site-nav a:hover,
body.theme-liquid-woodland[data-theme="sakura"] .nav-theme-chip.is-active,
body.theme-liquid-woodland[data-theme="sakura"] .nav-settings-toggle:hover,
body.theme-liquid-woodland[data-theme="emerald"] .site-nav a[aria-current="page"],
body.theme-liquid-woodland[data-theme="emerald"] .site-nav a:hover,
body.theme-liquid-woodland[data-theme="emerald"] .nav-theme-chip.is-active,
body.theme-liquid-woodland[data-theme="emerald"] .nav-settings-toggle:hover,
body.theme-liquid-woodland[data-theme="topaz"] .site-nav a[aria-current="page"],
body.theme-liquid-woodland[data-theme="topaz"] .site-nav a:hover,
body.theme-liquid-woodland[data-theme="topaz"] .nav-theme-chip.is-active,
body.theme-liquid-woodland[data-theme="topaz"] .nav-settings-toggle:hover {
  border-color: color-mix(in srgb, var(--accent-gold) 58%, rgba(255, 255, 255, 0.78));
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), color-mix(in srgb, var(--accent-gold) 20%, rgba(255, 255, 255, 0.84)));
}

body.theme-liquid-woodland[data-theme="sakura"].theme-home,
body.theme-liquid-woodland[data-theme="sakura"].theme-steam,
body.theme-liquid-woodland[data-theme="sakura"].theme-video-library,
body.theme-liquid-woodland[data-theme="sakura"].theme-music-lab {
  background:
    radial-gradient(ellipse 10px 16px at 22px 24px, rgba(255, 218, 224, 0.78) 0 58%, transparent 63%),
    radial-gradient(ellipse 7px 13px at 112px 40px, rgba(255, 255, 255, 0.86) 0 56%, transparent 62%),
    radial-gradient(ellipse 12px 18px at 72px 122px, rgba(255, 183, 197, 0.5) 0 56%, transparent 62%),
    radial-gradient(ellipse 8px 14px at 170px 78px, rgba(255, 204, 213, 0.72) 0 57%, transparent 63%),
    radial-gradient(1000px 560px at 50% -8%, rgba(255, 192, 203, 0.3), transparent 58%),
    radial-gradient(820px 460px at 84% 12%, rgba(255, 105, 180, 0.15), transparent 56%),
    linear-gradient(180deg, #fff7fa 0%, #fff1f6 44%, #fde7ef 100%);
  background-repeat: repeat, repeat, repeat, repeat, no-repeat, no-repeat, no-repeat;
  background-size: 300px 300px, 390px 390px, 340px 340px, 450px 450px, auto, auto, auto;
  background-position: 0 -300px, 110px -390px, 160px -340px, 240px -450px, 0 0, 0 0, 0 0;
  animation: sakura-petals-fall 24s linear infinite;
}

body.theme-liquid-woodland[data-theme="diamond"].theme-home,
body.theme-liquid-woodland[data-theme="diamond"].theme-steam,
body.theme-liquid-woodland[data-theme="diamond"].theme-video-library,
body.theme-liquid-woodland[data-theme="diamond"].theme-music-lab {
  background:
    radial-gradient(1100px 600px at 50% -8%, rgba(96, 232, 240, 0.34), transparent 58%),
    radial-gradient(920px 560px at 88% 8%, rgba(96, 232, 240, 0.2), transparent 58%),
    linear-gradient(180deg, #f7feff 0%, #eafcff 44%, #d8f9fc 100%);
}

body.theme-liquid-woodland[data-theme="emerald"].theme-home,
body.theme-liquid-woodland[data-theme="emerald"].theme-steam,
body.theme-liquid-woodland[data-theme="emerald"].theme-video-library,
body.theme-liquid-woodland[data-theme="emerald"].theme-music-lab {
  background:
    radial-gradient(1000px 560px at 50% -8%, rgba(169, 255, 209, 0.22), transparent 58%),
    radial-gradient(820px 460px at 84% 12%, rgba(80, 219, 130, 0.12), transparent 56%),
    linear-gradient(180deg, #f7fff8 0%, #f3fff6 44%, #f0fff4 100%);
}

body.theme-liquid-woodland[data-theme="topaz"].theme-home,
body.theme-liquid-woodland[data-theme="topaz"].theme-steam,
body.theme-liquid-woodland[data-theme="topaz"].theme-video-library,
body.theme-liquid-woodland[data-theme="topaz"].theme-music-lab {
  background:
    radial-gradient(1000px 560px at 50% -8%, rgba(255, 247, 173, 0.26), transparent 58%),
    radial-gradient(820px 460px at 84% 12%, rgba(255, 185, 0, 0.14), transparent 56%),
    linear-gradient(180deg, #fffaf0 0%, #fff6d9 44%, #fff9e3 100%);
}

body.theme-liquid-woodland[data-theme="vaporwave"].theme-home,
body.theme-liquid-woodland[data-theme="vaporwave"].theme-steam,
body.theme-liquid-woodland[data-theme="vaporwave"].theme-video-library,
body.theme-liquid-woodland[data-theme="vaporwave"].theme-music-lab {
  background:
    repeating-linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.04) 0 1px,
      rgba(0, 0, 0, 0) 1px 3px
    ),
    radial-gradient(1000px 560px at 50% 108%, rgba(255, 255, 0, 0.16), transparent 40%),
    radial-gradient(980px 520px at -10% -10%, rgba(255, 0, 255, 0.18), transparent 50%),
    radial-gradient(920px 440px at 110% 0%, rgba(0, 255, 255, 0.14), transparent 45%),
    linear-gradient(180deg, #050505 0%, #05000d 44%, #0a0016 100%);
}

body.theme-liquid-woodland.theme-home[data-theme="sakura"] .home-widget--schedule,
body.theme-liquid-woodland.theme-home[data-theme="emerald"] .home-widget--schedule,
body.theme-liquid-woodland.theme-home[data-theme="topaz"] .home-widget--schedule {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.76), rgba(255, 250, 252, 0.54)),
    var(--glass-fill-soft);
  border-color: var(--glass-stroke);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 14px 30px color-mix(in srgb, var(--accent-gold) 12%, transparent);
}

body.theme-liquid-woodland.theme-home[data-theme="diamond"] .home-widget--schedule {
  background:
    radial-gradient(circle at top right, rgba(96, 232, 240, 0.3), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(238, 253, 255, 0.96));
  border-color: var(--glass-stroke);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    0 18px 36px rgba(8, 121, 133, 0.14),
    0 0 18px rgba(96, 232, 240, 0.18);
}

body.theme-liquid-woodland.theme-home[data-theme="sakura"] .home-widget--schedule .home-widget-eyebrow,
body.theme-liquid-woodland.theme-home[data-theme="emerald"] .home-widget--schedule .home-widget-eyebrow,
body.theme-liquid-woodland.theme-home[data-theme="topaz"] .home-widget--schedule .home-widget-eyebrow,
body.theme-liquid-woodland.theme-home[data-theme="diamond"] .home-widget--schedule .home-widget-eyebrow {
  color: var(--text-muted);
}

body.theme-liquid-woodland.theme-home[data-theme="sakura"] .home-widget--schedule .home-widget-title,
body.theme-liquid-woodland.theme-home[data-theme="emerald"] .home-widget--schedule .home-widget-title,
body.theme-liquid-woodland.theme-home[data-theme="topaz"] .home-widget--schedule .home-widget-title,
body.theme-liquid-woodland.theme-home[data-theme="diamond"] .home-widget--schedule .home-widget-title {
  color: var(--text-main);
}

body.theme-liquid-woodland.theme-home[data-theme="sakura"] .weekly-day-card,
body.theme-liquid-woodland.theme-home[data-theme="sakura"] .weekly-day-card--off,
body.theme-liquid-woodland.theme-home[data-theme="emerald"] .weekly-day-card,
body.theme-liquid-woodland.theme-home[data-theme="emerald"] .weekly-day-card--off,
body.theme-liquid-woodland.theme-home[data-theme="topaz"] .weekly-day-card,
body.theme-liquid-woodland.theme-home[data-theme="topaz"] .weekly-day-card--off {
  background: rgba(255, 255, 255, 0.54);
  border-color: var(--glass-stroke-soft);
}

body.theme-liquid-woodland.theme-home[data-theme="diamond"] .weekly-day-card,
body.theme-liquid-woodland.theme-home[data-theme="diamond"] .weekly-day-card--off {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(238, 253, 255, 0.72));
  border-color: rgba(8, 121, 133, 0.18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

body.theme-liquid-woodland.theme-home[data-theme="vaporwave"] .home-widget--schedule {
  background: linear-gradient(180deg, rgba(20, 0, 38, 0.96), rgba(0, 0, 0, 0.98));
  border-color: rgba(255, 0, 255, 0.42);
  box-shadow:
    5px 5px 0 rgba(255, 0, 255, 0.34),
    -3px -3px 0 rgba(0, 255, 255, 0.16);
}

body.theme-liquid-woodland.theme-home[data-theme="vaporwave"] .weekly-day-card,
body.theme-liquid-woodland.theme-home[data-theme="vaporwave"] .weekly-day-card--off {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(0, 255, 255, 0.18);
}

body.theme-liquid-woodland.theme-home[data-theme="sakura"] .weekly-day-dot,
body.theme-liquid-woodland.theme-home[data-theme="emerald"] .weekly-day-dot,
body.theme-liquid-woodland.theme-home[data-theme="topaz"] .weekly-day-dot,
body.theme-liquid-woodland.theme-home[data-theme="diamond"] .weekly-day-dot {
  background: linear-gradient(180deg, var(--accent-copper) 0%, var(--accent-gold) 100%);
  box-shadow: 0 0 0 7px color-mix(in srgb, var(--accent-gold) 14%, transparent), 0 8px 16px color-mix(in srgb, var(--accent-gold) 18%, transparent);
}

body.theme-liquid-woodland.theme-home[data-theme="vaporwave"] .weekly-day-dot {
  background: linear-gradient(180deg, #00ffff 0%, #ff00ff 100%);
  box-shadow:
    0 0 0 7px rgba(255, 0, 255, 0.14),
    0 8px 16px rgba(0, 255, 255, 0.18);
}

body.theme-liquid-woodland main {
  padding: 3rem 0 2rem;
}

body.theme-liquid-woodland .hero {
  padding: 0 0 2.4rem;
}

body.theme-liquid-woodland .eyebrow,
body.theme-liquid-woodland .hero p:last-child,
body.theme-liquid-woodland .section-head p,
body.theme-liquid-woodland .weekly-kicker,
body.theme-liquid-woodland .vod-category,
body.theme-liquid-woodland .music-lab-status,
body.theme-liquid-woodland .music-theory-note,
body.theme-liquid-woodland .vl-category,
body.theme-liquid-woodland .module-banner-sub {
  color: var(--text-muted);
}

body.theme-liquid-woodland h1,
body.theme-liquid-woodland .section-head h2,
body.theme-liquid-woodland .module-banner-title,
body.theme-liquid-woodland .votd-verse,
body.theme-liquid-woodland .vod-title,
body.theme-liquid-woodland .vl-title,
body.theme-liquid-woodland .music-theory-head h2,
body.theme-liquid-woodland .card h2,
body.theme-liquid-woodland .card h3 {
  font-family: var(--font-sans);
}

body.theme-liquid-woodland[data-theme="vaporwave"] h1,
body.theme-liquid-woodland[data-theme="vaporwave"] .section-head h2,
body.theme-liquid-woodland[data-theme="vaporwave"] .module-banner-title,
body.theme-liquid-woodland[data-theme="vaporwave"] .votd-verse,
body.theme-liquid-woodland[data-theme="vaporwave"] .vod-title,
body.theme-liquid-woodland[data-theme="vaporwave"] .vl-title,
body.theme-liquid-woodland[data-theme="vaporwave"] .music-theory-head h2,
body.theme-liquid-woodland[data-theme="vaporwave"] .card h2,
body.theme-liquid-woodland[data-theme="vaporwave"] .card h3,
body.theme-liquid-woodland[data-theme="vaporwave"] .nav-settings-current {
  font-family: var(--font-mono);
  text-shadow:
    1px 0 0 rgba(255, 0, 255, 0.55),
    -1px 0 0 rgba(0, 255, 255, 0.55);
}

body.theme-liquid-woodland h1 {
  margin: 0;
  color: var(--text-main);
  font-size: clamp(3rem, 6vw, 5.4rem);
  line-height: 0.96;
  letter-spacing: -0.04em;
  max-width: 11ch;
}

body.theme-liquid-woodland .section {
  margin-bottom: 1.35rem;
}

body.theme-liquid-woodland .site-footer {
  padding-bottom: 2rem;
}

body.theme-liquid-woodland .site-footer p {
  color: var(--text-soft);
}

body.theme-liquid-woodland .site-footer a {
  color: var(--accent-gold);
}

body.theme-liquid-woodland .launchpad-shell,
body.theme-liquid-woodland .votd-card,
body.theme-liquid-woodland .vod-card,
body.theme-liquid-woodland .card,
body.theme-liquid-woodland .module-banner,
body.theme-liquid-woodland .module-tile-grid,
body.theme-liquid-woodland .vl-card,
body.theme-liquid-woodland .vl-modal,
body.theme-liquid-woodland .music-theory-landscape,
body.theme-liquid-woodland .music-interval-card,
body.theme-liquid-woodland .music-interval-chip,
body.theme-liquid-woodland .music-piano-wrap {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.01)), var(--glass-fill);
  border: 1px solid var(--glass-stroke);
  box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(22px) saturate(160%);
  backdrop-filter: blur(22px) saturate(160%);
}

body.theme-liquid-woodland .card,
body.theme-liquid-woodland .module-banner,
body.theme-liquid-woodland .vl-card,
body.theme-liquid-woodland .music-theory-landscape,
body.theme-liquid-woodland .music-interval-card,
body.theme-liquid-woodland .music-interval-chip,
body.theme-liquid-woodland .music-piano-wrap {
  border-radius: var(--surface-radius-md);
}

body.theme-liquid-woodland .launchpad-shell,
body.theme-liquid-woodland .votd-card,
body.theme-liquid-woodland .vod-card,
body.theme-liquid-woodland .vl-modal {
  border-radius: var(--surface-radius-lg);
}

body.theme-liquid-woodland .card,
body.theme-liquid-woodland .votd-card,
body.theme-liquid-woodland .vod-card,
body.theme-liquid-woodland .launchpad-shell {
  padding: 1.35rem;
}

body.theme-liquid-woodland .card h3 {
  color: var(--text-main);
  margin-bottom: 0.7rem;
  font-size: 1.9rem;
  line-height: 1;
}

body.theme-liquid-woodland .quick-links a {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  color: var(--text-main);
  padding: 0.88rem 0.95rem;
}

body.theme-liquid-woodland .quick-links a:hover {
  background: rgba(255, 255, 255, 0.08);
}

body.theme-liquid-woodland.theme-home {
  background:
    radial-gradient(1000px 560px at 50% -8%, var(--page-glow), transparent 58%),
    radial-gradient(820px 460px at 84% 12%, var(--page-glow-strong), transparent 56%),
    linear-gradient(180deg, var(--page-top) 0%, color-mix(in srgb, var(--page-top) 62%, white) 44%, var(--page-bottom) 100%);
}

body.theme-liquid-woodland.theme-steam {
  background:
    radial-gradient(1100px 600px at 50% -8%, var(--page-glow), transparent 58%),
    radial-gradient(920px 560px at 88% 8%, var(--page-glow-strong), transparent 58%),
    linear-gradient(180deg, var(--page-top) 0%, color-mix(in srgb, var(--page-top) 62%, white) 42%, var(--page-bottom) 100%);
}

body.theme-liquid-woodland.theme-video-library {
  background:
    radial-gradient(980px 560px at 50% -8%, var(--page-glow), transparent 58%),
    radial-gradient(820px 480px at 82% 14%, var(--page-glow-strong), transparent 56%),
    linear-gradient(180deg, var(--page-top) 0%, color-mix(in srgb, var(--page-top) 62%, white) 44%, var(--page-bottom) 100%);
}

body.theme-liquid-woodland.theme-music-lab {
  background:
    radial-gradient(1100px 620px at 50% -10%, var(--page-glow), transparent 58%),
    radial-gradient(780px 420px at 84% 14%, var(--page-glow-strong), transparent 52%),
    linear-gradient(180deg, var(--page-top) 0%, color-mix(in srgb, var(--page-top) 62%, white) 44%, var(--page-bottom) 100%);
}

body.theme-liquid-woodland[data-lighting="night"].theme-home {
  background: linear-gradient(180deg, rgba(8, 11, 18, 0.42) 0%, rgba(8, 11, 18, 0.84) 40%, rgba(7, 9, 15, 0.96) 100%);
}

body.theme-liquid-woodland[data-lighting="night"].theme-steam {
  background:
    radial-gradient(1100px 600px at 50% -8%, rgba(72, 118, 198, 0.18), transparent 58%),
    radial-gradient(920px 560px at 88% 8%, rgba(34, 84, 162, 0.12), transparent 58%),
    linear-gradient(180deg, #101725 0%, #09101a 42%, #060b12 100%);
}

body.theme-liquid-woodland[data-lighting="night"].theme-video-library {
  background:
    radial-gradient(980px 560px at 50% -8%, rgba(72, 118, 198, 0.18), transparent 58%),
    radial-gradient(820px 480px at 82% 14%, rgba(34, 84, 162, 0.12), transparent 56%),
    linear-gradient(180deg, #101725 0%, #09101a 44%, #060b12 100%);
}

body.theme-liquid-woodland[data-lighting="night"].theme-music-lab {
  background:
    radial-gradient(1100px 620px at 50% -10%, rgba(72, 118, 198, 0.18), transparent 58%),
    radial-gradient(780px 420px at 84% 14%, rgba(34, 84, 162, 0.12), transparent 52%),
    linear-gradient(180deg, #101725 0%, #09101a 44%, #060b12 100%);
}


body.theme-liquid-woodland.theme-home .hero {
  text-align: center;
  padding-top: 1.2rem;
  max-width: 44rem;
  margin: 0 auto;
}

body.theme-liquid-woodland.theme-home .hero h1 {
  margin-left: auto;
  margin-right: auto;
}

body.theme-liquid-woodland.theme-home .hero p:last-child {
  margin-left: auto;
  margin-right: auto;
  max-width: 28ch;
  font-size: 1rem;
}

.home-hero-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: 1rem;
}

.home-hero-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.8rem;
  padding: 0.62rem 0.96rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.08);
  color: var(--text-main);
  text-decoration: none;
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
}

.home-hero-link:hover {
  transform: translateY(-1px);
  border-color: rgba(255, 255, 255, 0.26);
  background: rgba(255, 255, 255, 0.12);
}

.home-hero-link--primary {
  background: linear-gradient(180deg, rgba(230, 198, 138, 0.38), rgba(183, 119, 74, 0.42));
  border-color: rgba(233, 211, 168, 0.26);
  color: #fff8ec;
}

body.theme-liquid-woodland.theme-home .launchpad-shell {
  padding: 1.35rem;
}

body.theme-liquid-woodland.theme-home .section-head {
  margin-bottom: 1rem;
}

body.theme-liquid-woodland.theme-home .section-head h2 {
  color: var(--text-main);
  font-size: 2.05rem;
  margin-bottom: 0.2rem;
}

body.theme-liquid-woodland.theme-home .tile-grid--architectural {
  display: grid;
  gap: 1rem;
}

.tile-grid--primary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.tile-grid--secondary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.home-launch-group + .home-launch-group {
  margin-top: 1.15rem;
}

.home-group-head {
  display: grid;
  gap: 0.2rem;
  margin-bottom: 0.85rem;
}

.home-group-kicker {
  margin: 0;
  color: rgba(234, 228, 211, 0.68);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.home-group-head h3 {
  margin: 0;
  color: var(--text-main);
  font-size: 1.42rem;
  letter-spacing: -0.03em;
}

.home-group-head p:last-child {
  margin: 0;
  color: var(--text-muted);
  max-width: 52ch;
  line-height: 1.58;
}

body.theme-liquid-woodland.theme-home .tile {
  position: relative;
  overflow: hidden;
  border-radius: var(--surface-radius-md);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 28px 76px rgba(5, 9, 8, 0.38), 0 18px 38px rgba(32, 56, 46, 0.16);
  padding: 1.35rem;
  min-height: 220px;
  transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease;
  isolation: isolate;
}

body.theme-liquid-woodland.theme-home .tile::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    linear-gradient(180deg, rgba(8, 11, 10, 0.08), rgba(6, 10, 9, 0.82) 100%),
    radial-gradient(circle at 18% 16%, rgba(255, 255, 255, 0.12), transparent 34%);
  pointer-events: none;
}

body.theme-liquid-woodland.theme-home .tile > * {
  position: relative;
  z-index: 1;
}

body.theme-liquid-woodland.theme-home .tile:hover {
  transform: translateY(-6px);
  border-color: rgba(255, 255, 255, 0.2);
  box-shadow: 0 34px 90px rgba(5, 9, 8, 0.44), 0 22px 52px rgba(33, 58, 48, 0.24);
}

body.theme-liquid-woodland.theme-home .tile strong {
  font-size: 1.35rem;
  line-height: 1.04;
}

body.theme-liquid-woodland.theme-home .tile small {
  color: rgba(243, 238, 229, 0.76);
  font-size: 0.92rem;
  max-width: 28ch;
}

body.theme-liquid-woodland.theme-home .tile-kicker {
  color: rgba(234, 228, 211, 0.74);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 0.68rem;
  font-weight: 700;
}

.tile-grid--primary .lessons-home-tile {
  grid-column: 1 / -1;
  min-height: 360px;
  border-radius: var(--surface-radius-lg);
}

.tile-grid--primary .lessons-home-copy {
  min-height: 360px;
  padding: 1.5rem;
}

.tile-grid--primary .tile-slot-apps,
.tile-grid--primary .tile-slot-downloads,
.tile-grid--primary .tile-slot-music {
  grid-column: span 2;
}

.tile-grid--secondary .tile {
  min-height: 200px;
}

.tile-grid--secondary .tile-slot-showcase,
.tile-grid--secondary .tile-slot-videos,
.tile-grid--secondary .tile-slot-recipe,
.tile-grid--secondary .tile-slot-quizzes,
.tile-grid--secondary .tile-slot-pledge {
  grid-column: span 1;
}

body.theme-liquid-woodland.theme-home .tile-liquid::after {
  content: "";
  position: absolute;
  inset: -18%;
  z-index: 0;
  opacity: 0;
  background:
    radial-gradient(circle at 20% 18%, rgba(255, 255, 255, 0.28), transparent 26%),
    linear-gradient(112deg, rgba(255, 255, 255, 0.02) 22%, rgba(255, 255, 255, 0.18) 42%, rgba(255, 255, 255, 0.03) 66%);
  mix-blend-mode: screen;
  transform: translate3d(-10%, 2%, 0) skewX(-12deg);
  transition: opacity 220ms ease, transform 900ms cubic-bezier(0.16, 1, 0.3, 1);
}

body.theme-liquid-woodland.theme-home .tile-liquid:hover::after {
  opacity: 0.62;
  transform: translate3d(10%, -2%, 0) skewX(-12deg);
}

body.theme-liquid-woodland.theme-home .tile-liquid.lessons-home-tile .lessons-home-thumb img {
  transition: transform 900ms cubic-bezier(0.16, 1, 0.3, 1);
}

body.theme-liquid-woodland.theme-home .tile-liquid.music-lab-tile {
  transition:
    transform 240ms ease,
    box-shadow 240ms ease,
    border-color 240ms ease,
    background-position 900ms cubic-bezier(0.16, 1, 0.3, 1);
}

body.theme-liquid-woodland.theme-home .tile-liquid.lessons-home-tile:hover .lessons-home-thumb img {
  transform: scale(1.04) translateY(-1%);
}

body.theme-liquid-woodland.theme-home .tile-liquid.music-lab-tile:hover {
  background-position: center 42%;
}

body.theme-liquid-woodland.theme-home .panel-pledge {
  background:
    linear-gradient(180deg, rgba(12, 11, 15, 0.16) 0%, rgba(11, 9, 13, 0.82) 100%),
    url("../thumbs/pledge-silk-thumb.svg") center / cover no-repeat,
    #20170e;
}

body.theme-liquid-woodland.theme-home .music-lab-tile {
  background:
    linear-gradient(180deg, rgba(12, 10, 8, 0.22) 0%, rgba(11, 8, 7, 0.78) 100%),
    url("../thumbs/music-lab-thumb.png") center 44% / cover no-repeat,
    #261b12;
}

body.theme-liquid-woodland.theme-home .class-downloads-tile {
  background:
    linear-gradient(180deg, rgba(14, 10, 18, 0.16) 0%, rgba(12, 8, 18, 0.8) 100%),
    radial-gradient(130% 90% at 18% 12%, rgba(147, 109, 98, 0.46), transparent 68%),
    radial-gradient(120% 90% at 82% 88%, rgba(71, 92, 126, 0.46), transparent 66%),
    #14101b;
}

body.theme-liquid-woodland.theme-home .video-library-tile {
  background:
    linear-gradient(180deg, rgba(5, 12, 10, 0.16) 0%, rgba(5, 11, 9, 0.82) 100%),
    radial-gradient(130% 80% at 14% 10%, rgba(102, 142, 126, 0.34), transparent 64%),
    radial-gradient(120% 88% at 84% 88%, rgba(60, 112, 93, 0.32), transparent 62%),
    #08110e;
}

body.theme-liquid-woodland.theme-home .home-vod-section {
  margin-top: -0.2rem;
}

body.theme-liquid-woodland.theme-home .home-vod-card {
  padding: 1rem 1.05rem 1.05rem;
  background:
    radial-gradient(110% 76% at 0% 0%, rgba(255, 214, 142, 0.12), transparent 54%),
    radial-gradient(110% 86% at 100% 100%, rgba(78, 118, 102, 0.14), transparent 58%),
    rgba(18, 21, 22, 0.48);
}

body.theme-liquid-woodland.theme-home .vod-eyebrow {
  color: rgba(255, 214, 142, 0.76);
  margin-bottom: 0.3rem;
}

body.theme-liquid-woodland.theme-home .vod-inner {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.82fr);
  gap: 1rem;
  align-items: stretch;
}

body.theme-liquid-woodland.theme-home .vod-copy {
  justify-content: center;
  gap: 0.45rem;
}

body.theme-liquid-woodland.theme-home .vod-title {
  font-size: 1.5rem;
  line-height: 1.02;
  color: var(--text-main);
}

body.theme-liquid-woodland.theme-home .vod-desc {
  color: var(--text-muted);
  font-size: 0.88rem;
  line-height: 1.6;
  -webkit-line-clamp: 4;
}

body.theme-liquid-woodland.theme-home .vod-link {
  color: var(--accent-gold);
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.theme-liquid-woodland.theme-home .vod-thumb-wrap {
  border-radius: calc(var(--surface-radius-md) - 6px);
  border: 1px solid rgba(255, 255, 255, 0.12);
  background:
    linear-gradient(180deg, rgba(8, 9, 10, 0.3), rgba(8, 9, 10, 0.72)),
    radial-gradient(circle at 20% 16%, rgba(189, 217, 207, 0.16), transparent 34%),
    #111514;
  min-height: 240px;
  aspect-ratio: 16 / 9;
}

body.theme-liquid-woodland.theme-home .vod-thumb-wrap:hover .vod-thumb {
  opacity: 0.86;
}

body.theme-liquid-woodland.theme-home .vod-thumb {
  opacity: 0.92;
}

body.theme-liquid-woodland.theme-home .vod-fallback {
  position: absolute;
  inset: 0;
  padding: 1.2rem;
  display: grid;
  align-content: end;
  gap: 0.28rem;
  opacity: 0;
  transition: opacity 180ms ease;
  background:
    linear-gradient(180deg, rgba(7, 8, 8, 0.1), rgba(7, 8, 8, 0.82) 86%),
    radial-gradient(circle at 20% 24%, rgba(220, 230, 218, 0.12), transparent 34%);
}

body.theme-liquid-woodland.theme-home .vod-thumb-wrap--fallback .vod-fallback {
  opacity: 1;
}

body.theme-liquid-woodland.theme-home .vod-thumb-wrap--fallback .vod-thumb {
  opacity: 0;
}

body.theme-liquid-woodland.theme-home .vod-fallback-kicker {
  margin: 0;
  color: rgba(255, 214, 142, 0.72);
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

body.theme-liquid-woodland.theme-home .vod-fallback-title {
  margin: 0;
  color: var(--text-main);
  font-family: var(--font-sans);
  font-size: 1.45rem;
  line-height: 0.96;
}

body.theme-liquid-woodland.theme-home .vod-duration {
  background: rgba(8, 10, 10, 0.74);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  padding: 0.18rem 0.52rem;
}

body.theme-liquid-woodland.theme-home .votd-card {
  background:
    radial-gradient(120% 70% at 0% 0%, rgba(216, 187, 119, 0.16), transparent 54%),
    radial-gradient(110% 70% at 100% 100%, rgba(173, 111, 74, 0.14), transparent 58%),
    rgba(39, 29, 17, 0.52);
  border-color: rgba(216, 187, 119, 0.24);
}

body.theme-liquid-woodland.theme-home .votd-eyebrow {
  color: rgba(237, 204, 144, 0.84);
}

body.theme-liquid-woodland.theme-home .votd-eyebrow-dot,
body.theme-liquid-woodland.theme-home .votd-loading {
  color: rgba(237, 204, 144, 0.44);
}

body.theme-liquid-woodland.theme-home .votd-verse {
  color: #f5efe3;
  font-size: 1.35rem;
}

body.theme-liquid-woodland.theme-home .votd-ref {
  color: rgba(240, 218, 174, 0.88);
}

body.theme-liquid-woodland.theme-home .votd-btn {
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: 0.03em;
}

body.theme-liquid-woodland.theme-home .votd-btn--chapter,
body.theme-liquid-woodland.theme-home .votd-btn--ai {
  background: linear-gradient(180deg, rgba(216, 187, 119, 0.28), rgba(173, 111, 74, 0.3));
  border-color: rgba(233, 211, 168, 0.24);
  color: #fff5de;
}

body.theme-liquid-woodland.theme-home .votd-btn--youversion {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--text-main);
}

body.theme-liquid-woodland.theme-home .home-widget--votd {
  background: transparent;
  border: none;
  box-shadow: none;
}

body.theme-liquid-woodland.theme-home .home-widget--votd .votd-immersion-container {
  background: color-mix(in srgb, var(--glass-fill-strong) 78%, #f7eed8);
  box-shadow:
    0 10px 30px color-mix(in srgb, var(--accent-gold) 10%, rgba(0, 0, 0, 0.16)),
    0 2px 5px rgba(0, 0, 0, 0.12);
}

body.theme-liquid-woodland.theme-home .home-widget--votd .bible-page {
  background-color: color-mix(in srgb, var(--glass-fill-strong) 34%, white);
  border-color: color-mix(in srgb, var(--glass-stroke) 48%, rgba(232, 223, 204, 0.9));
}

body.theme-liquid-woodland.theme-home .home-widget--votd .red-letter-header {
  color: color-mix(in srgb, var(--accent-gold) 42%, #8b0000);
}

body.theme-liquid-woodland.theme-home .home-widget--votd .red-letter-header::after {
  background: linear-gradient(to right, color-mix(in srgb, var(--accent-gold) 42%, #8b0000), transparent);
}

body.theme-liquid-woodland.theme-home .home-widget--votd .votd-verse {
  color: var(--text-main);
  font-size: 1.2rem;
}

body.theme-liquid-woodland.theme-home .home-widget--votd .votd-ref {
  color: color-mix(in srgb, var(--accent-gold) 52%, var(--text-muted));
}

body.theme-liquid-woodland.theme-home .home-widget--votd .votd-btn {
  border-radius: 4px;
  letter-spacing: normal;
}

body.theme-liquid-woodland.theme-home .home-widget--votd .votd-btn--primary,
body.theme-liquid-woodland.theme-home .home-widget--votd .votd-btn--chapter {
  background: var(--text-main);
  border-color: var(--text-main);
  color: color-mix(in srgb, white 92%, var(--accent-copper));
}

body.theme-liquid-woodland.theme-home .home-widget--votd .votd-btn--ai {
  background: rgba(255, 255, 255, 0.92);
  border-color: color-mix(in srgb, var(--accent-gold) 26%, rgba(255, 255, 255, 0.72));
  color: var(--accent-gold);
}

body.theme-liquid-woodland.theme-home .home-widget--votd .votd-btn--secondary,
body.theme-liquid-woodland.theme-home .home-widget--votd .votd-btn--youversion {
  background: transparent;
  border-color: color-mix(in srgb, var(--glass-stroke) 48%, rgba(232, 223, 204, 0.9));
  color: color-mix(in srgb, var(--accent-gold) 52%, var(--text-muted));
}

body.theme-liquid-woodland.theme-home .columns {
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.82fr);
  gap: 1.25rem;
}

body.theme-liquid-woodland.theme-home .card--weekly {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.01)),
    var(--glass-fill);
  border-color: var(--glass-stroke);
}

body.theme-liquid-woodland.theme-home .weekly-header,
body.theme-liquid-woodland.theme-home .weekly-grid {
  gap: 1rem;
}

body.theme-liquid-woodland.theme-home .weekly-focus,
body.theme-liquid-woodland.theme-home .weekly-day-card,
body.theme-liquid-woodland.theme-home .weekly-day-card--off {
  background: rgba(255, 255, 255, 0.38);
  border-color: var(--glass-stroke-soft);
  box-shadow: none;
}

body.theme-liquid-woodland.theme-home .weekly-focus strong,
body.theme-liquid-woodland.theme-home .weekly-day-label,
body.theme-liquid-woodland.theme-home .weekly-day-card h4 {
  color: var(--text-main);
}

body.theme-liquid-woodland.theme-home .weekly-day-what,
body.theme-liquid-woodland.theme-home .weekly-focus,
body.theme-liquid-woodland.theme-home .weekly-day-card--off .weekly-day-label,
body.theme-liquid-woodland.theme-home .weekly-day-card--off .weekly-day-what {
  color: var(--text-muted);
}

body.theme-liquid-woodland.theme-home .weekly-day-dot {
  background: linear-gradient(180deg, var(--accent-copper) 0%, var(--accent-gold) 100%);
  box-shadow: 0 0 0 7px color-mix(in srgb, var(--accent-gold) 14%, transparent), 0 8px 16px color-mix(in srgb, var(--accent-gold) 18%, transparent);
}

body.theme-liquid-woodland.theme-home .home-widget--schedule {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--glass-fill-strong) 76%, rgba(0, 0, 0, 0.06)), color-mix(in srgb, var(--glass-fill-soft) 82%, rgba(0, 0, 0, 0.12))),
    rgba(255, 255, 255, 0.08);
  border-color: var(--glass-stroke);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, white 44%, transparent),
    0 14px 32px color-mix(in srgb, var(--accent-gold) 14%, rgba(17, 11, 6, 0.12));
}

body.theme-liquid-woodland.theme-home .home-widget--schedule .home-widget-eyebrow {
  color: var(--text-muted);
}

body.theme-liquid-woodland.theme-home .home-widget--schedule .home-widget-title {
  color: var(--text-main);
}

body.theme-liquid-woodland.theme-home .weekly-focus {
  background: color-mix(in srgb, var(--accent-gold) 16%, rgba(255, 255, 255, 0.22));
  border-color: color-mix(in srgb, var(--accent-gold) 28%, rgba(255, 255, 255, 0.28));
  color: color-mix(in srgb, var(--text-main) 88%, white);
}

body.theme-liquid-woodland.theme-home .weekly-focus strong {
  color: var(--accent-gold);
}

body.theme-liquid-woodland.theme-home .weekly-day-card.is-current-day {
  border-color: color-mix(in srgb, var(--accent-gold) 42%, rgba(255, 255, 255, 0.42));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--accent-gold) 18%, rgba(255, 255, 255, 0.18)), color-mix(in srgb, var(--glass-fill-soft) 82%, rgba(0, 0, 0, 0.14))),
    rgba(255, 255, 255, 0.08);
  box-shadow: 0 12px 28px color-mix(in srgb, var(--accent-gold) 18%, rgba(31, 18, 11, 0.12));
}

body.theme-liquid-woodland.theme-home .weekly-day-card--off.is-current-day {
  border-color: color-mix(in srgb, var(--accent-gold) 28%, rgba(255, 255, 255, 0.32));
}

body.theme-liquid-woodland.theme-home[data-theme="diamond"] .weekly-day-card,
body.theme-liquid-woodland.theme-home[data-theme="diamond"] .weekly-day-card--off {
  border-color: rgba(8, 121, 133, 0.18);
}

body.theme-liquid-woodland.theme-steam .hero,
body.theme-liquid-woodland.theme-video-library .hero,
body.theme-liquid-woodland.theme-music-lab .hero {
  text-align: center;
  text-shadow: 0 16px 34px rgba(0, 0, 0, 0.18);
}

body.theme-liquid-woodland.theme-steam h1,
body.theme-liquid-woodland.theme-video-library h1,
body.theme-liquid-woodland.theme-music-lab h1 {
  margin-inline: auto;
  max-width: none;
}

body.theme-liquid-woodland.theme-steam .hero p:last-child,
body.theme-liquid-woodland.theme-video-library .hero p:last-child,
body.theme-liquid-woodland.theme-music-lab .hero p:last-child {
  margin-inline: auto;
  max-width: 62ch;
}

body.theme-liquid-woodland.theme-steam .module-section {
  margin-bottom: 1.3rem;
}

body.theme-liquid-woodland.theme-steam .module-banner {
  align-items: center;
  gap: 1.2rem;
  border-radius: var(--surface-radius-md);
  box-shadow: var(--glass-shadow-soft);
}

body.theme-liquid-woodland.theme-steam .module-banner.open {
  border-radius: var(--surface-radius-md) var(--surface-radius-md) 14px 14px;
}

body.theme-liquid-woodland.theme-steam .module-banner-title {
  color: var(--text-main);
}

body.theme-liquid-woodland.theme-steam .module-banner-sub {
  color: var(--text-muted);
}

body.theme-liquid-woodland.theme-steam .module-banner-count {
  background: color-mix(in srgb, var(--accent-gold) 14%, rgba(255, 255, 255, 0.38));
  border: 1px solid color-mix(in srgb, var(--accent-gold) 22%, rgba(255, 255, 255, 0.5));
  color: var(--text-main);
}

body.theme-liquid-woodland.theme-steam .module-tile-grid {
  padding: 1.1rem;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.01)),
    var(--glass-fill-soft);
  border-radius: 0 0 var(--surface-radius-md) var(--surface-radius-md);
  border-top: none;
}

body.theme-liquid-woodland.theme-steam .cs-banner,
body.theme-liquid-woodland.theme-steam .space-banner {
  border-color: rgba(255, 255, 255, 0.12);
}

body.theme-liquid-woodland.theme-video-library .vl-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1rem;
}

body.theme-liquid-woodland.theme-video-library .vl-card {
  grid-column: span 3;
  display: grid;
  gap: 0.8rem;
  padding: 0.95rem;
  text-align: left;
  width: 100%;
  border: 1px solid var(--glass-stroke);
  cursor: pointer;
  transition: transform 240ms ease, border-color 240ms ease, background 240ms ease;
}

body.theme-liquid-woodland.theme-video-library .vl-card--feature {
  grid-column: span 6;
  grid-row: span 2;
  padding: 1.15rem;
}

body.theme-liquid-woodland.theme-video-library .vl-card:hover {
  transform: translateY(-4px);
}

body.theme-liquid-woodland.theme-video-library .vl-thumb-wrap {
  border-radius: calc(var(--surface-radius-md) - 8px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  background:
    linear-gradient(180deg, rgba(7, 9, 10, 0.28), rgba(7, 9, 10, 0.68)),
    #101414;
}

body.theme-liquid-woodland.theme-video-library .vl-card--feature .vl-thumb-wrap {
  min-height: 420px;
  aspect-ratio: auto;
}

body.theme-liquid-woodland.theme-video-library .vl-meta {
  padding: 0;
}

body.theme-liquid-woodland.theme-video-library .vl-category {
  color: rgba(239, 213, 160, 0.72);
}

body.theme-liquid-woodland.theme-video-library .vl-title {
  color: var(--text-main);
  font-size: 1.1rem;
  line-height: 1.05;
}

body.theme-liquid-woodland.theme-video-library .vl-card--feature .vl-title {
  font-size: 2.2rem;
}

body.theme-liquid-woodland.theme-video-library .vl-desc {
  color: var(--text-muted);
  font-size: 0.82rem;
  -webkit-line-clamp: 3;
}

body.theme-liquid-woodland.theme-video-library .vl-card--feature .vl-desc {
  font-size: 0.95rem;
  -webkit-line-clamp: 5;
}

body.theme-liquid-woodland.theme-video-library .vl-play-icon {
  background: rgba(7, 9, 10, 0.18);
}

body.theme-liquid-woodland.theme-video-library .vl-modal-backdrop {
  background: rgba(5, 7, 7, 0.88);
}

body.theme-liquid-woodland.theme-video-library .vl-modal {
  background: linear-gradient(180deg, rgba(10, 16, 14, 0.96), rgba(7, 10, 10, 0.96));
}

body.theme-liquid-woodland.theme-video-library .vl-modal-category {
  color: rgba(239, 213, 160, 0.72);
}

body.theme-liquid-woodland.theme-video-library .vl-modal-title {
  font-family: var(--font-sans);
  font-size: 2rem;
  line-height: 0.96;
}

body.theme-liquid-woodland.theme-video-library .vl-modal-desc {
  color: var(--text-muted);
}

body.theme-liquid-woodland.theme-video-library .vl-modal-close {
  background: rgba(255, 255, 255, 0.08);
}

body.theme-liquid-woodland.theme-music-lab main.music-lab-wrap {
  max-width: 1120px;
}

body.theme-liquid-woodland.theme-music-lab .music-theory-landscape,
body.theme-liquid-woodland.theme-music-lab .card {
  background:
    radial-gradient(circle at 18% 18%, rgba(212, 227, 214, 0.08), transparent 24%),
    linear-gradient(180deg, rgba(14, 22, 19, 0.72), rgba(9, 14, 12, 0.82));
}

body.theme-liquid-woodland.theme-music-lab .music-theory-head h2,
body.theme-liquid-woodland.theme-music-lab .card h2,
body.theme-liquid-woodland.theme-music-lab .card h3 {
  color: var(--text-main);
}

body.theme-liquid-woodland.theme-music-lab .music-lab-grid,
body.theme-liquid-woodland.theme-music-lab .music-interval-summary {
  gap: 1rem;
}

body.theme-liquid-woodland.theme-music-lab .music-interval-card,
body.theme-liquid-woodland.theme-music-lab .music-interval-chip {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.01)),
    rgba(22, 31, 27, 0.62);
  box-shadow: var(--glass-shadow-soft);
}

body.theme-liquid-woodland.theme-music-lab .music-interval-note,
body.theme-liquid-woodland.theme-music-lab .music-interval-name {
  color: var(--text-main);
}

body.theme-liquid-woodland.theme-music-lab .music-interval-semitones,
body.theme-liquid-woodland.theme-music-lab .music-interval-chip span {
  color: var(--text-muted);
}

body.theme-liquid-woodland.theme-music-lab .music-interval-chip strong {
  color: rgba(239, 213, 160, 0.82);
}

body.theme-liquid-woodland.theme-music-lab .music-theory-rail::before {
  background: linear-gradient(90deg, rgba(213, 193, 145, 0.28), rgba(121, 162, 147, 0.26));
}

body.theme-liquid-woodland.theme-music-lab .music-lab-btn,
body.theme-liquid-woodland.theme-music-lab .music-lab-field select {
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-main);
}

body.theme-liquid-woodland.theme-music-lab .music-lab-btn:hover:not(:disabled):not(.btn-active) {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.18);
}

body.theme-liquid-woodland.theme-music-lab .music-lab-btn.btn-active,
body.theme-liquid-woodland.theme-music-lab .ml-seq-step.on {
  background: linear-gradient(180deg, rgba(216, 187, 119, 0.92), rgba(173, 111, 74, 0.94));
  border-color: rgba(243, 224, 184, 0.3);
  color: #1b1109;
}

body.theme-liquid-woodland.theme-music-lab .music-lab-pad {
  border-radius: 16px;
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.05);
  color: var(--text-main);
}

body.theme-liquid-woodland.theme-music-lab .music-lab-pad:active {
  background: rgba(255, 255, 255, 0.1);
}

body.theme-liquid-woodland.theme-music-lab .music-piano-wrap {
  padding: 0.95rem;
}

body.theme-liquid-woodland.theme-music-lab .music-piano-roll,
body.theme-liquid-woodland.theme-music-lab .ml-osc-canvas {
  border: 1px solid rgba(255, 255, 255, 0.08);
  background:
    radial-gradient(circle at 18% 14%, rgba(202, 222, 214, 0.08), transparent 24%),
    #121918;
}

body.theme-liquid-woodland.theme-music-lab .music-piano-help,
body.theme-liquid-woodland.theme-music-lab .ml-seq-label,
body.theme-liquid-woodland.theme-music-lab .ml-adsr-note,
body.theme-liquid-woodland.theme-music-lab details,
body.theme-liquid-woodland.theme-music-lab summary,
body.theme-liquid-woodland.theme-music-lab li {
  color: var(--text-muted);
}

body.theme-liquid-woodland.theme-music-lab .music-piano-key {
  border-color: rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, #f8f6f1 0%, #d8d5cf 100%);
  color: #2d312f;
}

body.theme-liquid-woodland.theme-music-lab .music-piano-key--black {
  background: linear-gradient(180deg, #4e5a56 0%, #1e2623 100%);
  color: #ede8de;
}

body.theme-liquid-woodland.theme-music-lab .music-piano-key.is-active {
  box-shadow: inset 0 0 0 2px rgba(216, 187, 119, 0.72), 0 0 18px rgba(216, 187, 119, 0.22);
}

body.theme-liquid-woodland.theme-music-lab .ml-slider-val,
body.theme-liquid-woodland.theme-music-lab .ml-seq-bpm-val {
  color: rgba(240, 213, 162, 0.9);
}

body.theme-liquid-woodland.theme-music-lab .ml-slider-field input[type="range"],
body.theme-liquid-woodland.theme-music-lab .ml-seq-bpm-field input[type="range"] {
  accent-color: #d7b873;
}

body.theme-liquid-woodland.theme-music-lab .ml-seq-step {
  border-radius: 8px;
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.05);
}

body.theme-liquid-woodland.theme-music-lab .ml-seq-step.seq-current {
  outline-color: rgba(216, 187, 119, 0.95);
}

body.theme-liquid-woodland.theme-music-lab .ml-seq-step.on.seq-current {
  background: linear-gradient(180deg, rgba(214, 155, 84, 0.96), rgba(187, 103, 61, 0.96));
  border-color: rgba(255, 222, 166, 0.3);
}

body.theme-liquid-woodland.theme-music-lab details summary {
  cursor: pointer;
}

body.theme-liquid-woodland .vod-modal,
body.theme-liquid-woodland .vl-modal {
  border: 1px solid rgba(255, 255, 255, 0.12);
}

body.theme-liquid-woodland .vod-modal-backdrop {
  background: rgba(5, 7, 7, 0.88);
}

body.theme-liquid-woodland .vod-modal,
body.theme-liquid-woodland .vod-modal video {
  background: #0c100f;
}

body.theme-liquid-woodland .vod-modal-title,
body.theme-liquid-woodland .vl-modal-title {
  color: var(--text-main);
}

body.theme-liquid-woodland .vod-modal-category {
  color: rgba(239, 213, 160, 0.72);
}

body.theme-liquid-woodland .vod-modal-close {
  background: rgba(255, 255, 255, 0.08);
}

@supports not ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
  body.theme-liquid-woodland .launchpad-shell,
  body.theme-liquid-woodland .votd-card,
  body.theme-liquid-woodland .vod-card,
  body.theme-liquid-woodland .card,
  body.theme-liquid-woodland .module-banner,
  body.theme-liquid-woodland .module-tile-grid,
  body.theme-liquid-woodland .vl-card,
  body.theme-liquid-woodland .vl-modal,
  body.theme-liquid-woodland .music-theory-landscape,
  body.theme-liquid-woodland .music-interval-card,
  body.theme-liquid-woodland .music-interval-chip,
  body.theme-liquid-woodland .music-piano-wrap,
  body.theme-liquid-woodland .site-header {
    background: var(--glass-fill-strong);
  }
}

@media (max-width: 1040px) {
  body.theme-liquid-woodland.theme-video-library .vl-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.theme-liquid-woodland.theme-video-library .vl-card,
  body.theme-liquid-woodland.theme-video-library .vl-card--feature {
    grid-column: span 1;
    grid-row: auto;
  }

  body.theme-liquid-woodland.theme-video-library .vl-card--feature .vl-thumb-wrap {
    min-height: 320px;
  }
}

@media (max-width: 900px) {
  body.theme-liquid-woodland.theme-home .tile-grid--primary,
  body.theme-liquid-woodland.theme-home .tile-grid--secondary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.theme-liquid-woodland.theme-home .tile-grid--primary .lessons-home-tile,
  body.theme-liquid-woodland.theme-home .tile-grid--primary .tile-slot-apps,
  body.theme-liquid-woodland.theme-home .tile-grid--primary .tile-slot-downloads,
  body.theme-liquid-woodland.theme-home .tile-grid--primary .tile-slot-music {
    grid-column: span 2;
  }

  body.theme-liquid-woodland.theme-home .vod-thumb-wrap {
    min-height: 260px;
  }
}

@media (max-width: 680px) {
  body.theme-liquid-woodland .site-nav.is-open,
  body.theme-liquid-woodland .topbar nav.is-open {
    margin-top: 0.8rem;
    padding: 0.58rem;
    border: 1px solid var(--glass-stroke);
    border-radius: 26px;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.32), rgba(255, 255, 255, 0.12)),
      var(--glass-fill-strong);
    box-shadow: 0 24px 56px rgba(35, 68, 121, 0.18);
  }

  body.theme-liquid-woodland .site-nav a,
  body.theme-liquid-woodland .topbar nav a {
    border-bottom-color: transparent;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.06);
    box-shadow: none;
    transform: none;
  }

  body.theme-liquid-woodland .nav-settings-toggle {
    width: 100%;
    justify-content: space-between;
    margin-top: 0.55rem;
  }

  body.theme-liquid-woodland .nav-settings-panel {
    width: 100%;
    margin-top: 0.75rem;
    border-radius: 24px;
  }

  body.theme-liquid-woodland .nav-theme-grid {
    grid-template-columns: 1fr;
  }

  body.theme-liquid-woodland h1 {
    font-size: clamp(2.35rem, 13vw, 3.35rem);
  }

  body.theme-liquid-woodland.theme-home .hero {
    padding-top: 0.5rem;
  }

  body.theme-liquid-woodland.theme-home .vod-inner {
    grid-template-columns: 1fr;
  }

  body.theme-liquid-woodland.theme-home .tile-grid--primary,
  body.theme-liquid-woodland.theme-home .tile-grid--secondary,
  body.theme-liquid-woodland.theme-home .columns,
  body.theme-liquid-woodland.theme-video-library .vl-grid {
    grid-template-columns: 1fr;
  }

  body.theme-liquid-woodland.theme-home .tile-grid--primary .lessons-home-tile,
  body.theme-liquid-woodland.theme-home .tile-grid--primary .tile-slot-apps,
  body.theme-liquid-woodland.theme-home .tile-grid--primary .tile-slot-downloads,
  body.theme-liquid-woodland.theme-home .tile-grid--primary .tile-slot-music,
  body.theme-liquid-woodland.theme-home .tile-grid--secondary .tile-slot-showcase,
  body.theme-liquid-woodland.theme-home .tile-grid--secondary .tile-slot-videos,
  body.theme-liquid-woodland.theme-home .tile-grid--secondary .tile-slot-recipe,
  body.theme-liquid-woodland.theme-home .tile-grid--secondary .tile-slot-quizzes,
  body.theme-liquid-woodland.theme-home .tile-grid--secondary .tile-slot-pledge {
    grid-column: span 1;
  }

  body.theme-liquid-woodland.theme-home .tile,
  body.theme-liquid-woodland.theme-home .launchpad-shell,
  body.theme-liquid-woodland.theme-home .vod-card,
  body.theme-liquid-woodland .card,
  body.theme-liquid-woodland .votd-card,
  body.theme-liquid-woodland .vl-card {
    border-radius: 26px;
  }

  body.theme-liquid-woodland.theme-home .lessons-home-copy {
    min-height: 290px;
  }

  .home-hero-actions {
    flex-direction: column;
  }

  body.theme-liquid-woodland.theme-home .vod-thumb-wrap {
    min-height: 220px;
  }

  body.theme-liquid-woodland.theme-home .vod-title,
  body.theme-liquid-woodland.theme-video-library .vl-card--feature .vl-title {
    font-size: 1.42rem;
  }

  body.theme-liquid-woodland.theme-music-lab .music-lab-grid {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.theme-liquid-woodland .woodland-ambient__video {
    display: none;
  }

  body.theme-liquid-woodland *,
  body.theme-liquid-woodland *::before,
  body.theme-liquid-woodland *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

/* ClassroomOS remastered home owns its own launch-console sizing. */
body.theme-liquid-woodland.theme-home .cos-home .hero {
  width: min(1180px, calc(100% - 2rem));
  max-width: none;
  margin-inline: auto;
  padding-top: clamp(2rem, 5vw, 4.25rem);
  text-align: left;
}

body.theme-liquid-woodland.theme-home .cos-home .hero h1 {
  margin-left: 0;
  margin-right: 0;
  font-size: clamp(2.35rem, 6vw, 5rem);
}

@media (max-width: 560px) {
  body.theme-liquid-woodland.theme-home .cos-home .hero h1 {
    font-size: clamp(1.85rem, 8.6vw, 2.6rem);
  }
}

/* Liquid Woodland can be loaded without classroom-home.css on small pages. */
body.theme-liquid-woodland,
body.theme-liquid-woodland :where(h1, h2, h3, h4, h5, h6, p, a, button, input, select, textarea, label, legend, summary, details, li, dt, dd, th, td, caption, small, strong, em, b, i, span, div) {
  font-family: var(--font-sans) !important;
}

body.theme-liquid-woodland :where(code, pre, samp, kbd, code *, pre *, samp *, kbd *, .mono, .font-mono, [class*="mono"], [class*="code"], [class*="terminal"], [class*="console"]) {
  font-family: var(--font-mono) !important;
}
