:root {
  --bg: #f3efe6;
  --surface: #ebe5d9;
  --surface-raised: #fffaf1;
  --text: #1d1c18;
  --muted: #706b61;
  --line: #cec5b6;
  --accent: #1d1c18;
  --warm: #9b5f35;
  --neon: #b8ff3d;
  --radius: 8px;
  --wide: min(1180px, calc(100vw - 48px));
  --font-display: "Songti SC", STSong, "Noto Serif CJK SC", serif;
  --font-body: Inter, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-code: ui-monospace, SFMono-Regular, Menlo, monospace;
  color-scheme: light;
  font-family: var(--font-body);
  background: var(--bg);
  color: var(--text);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--bg);
}

body {
  min-width: 320px;
  margin: 0;
  background: var(--bg);
  color: var(--text);
}

.site-particle-field {
  position: fixed;
  z-index: 0;
  inset: 0;
  display: block;
  width: 100vw;
  height: 100vh;
  opacity: .92;
  pointer-events: none;
  transition: opacity .5s ease;
}

main,
.site-footer {
  position: relative;
  z-index: 1;
}

.platform-page .site-particle-field {
  opacity: .52;
}

body::selection {
  color: var(--bg);
  background: var(--accent);
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font: inherit;
}

.section-shell {
  width: var(--wide);
  margin: 0 auto;
}

.eyebrow {
  margin: 0;
  color: var(--warm);
  font-size: 11px;
  letter-spacing: .16em;
  line-height: 1.4;
  text-transform: uppercase;
}

.site-header {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 50%;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 28px;
  width: var(--wide);
  padding: 22px 0;
  transform: translateX(-50%);
  transition: padding .3s ease, background .3s ease;
}

.site-header.is-scrolled {
  padding: 14px 18px;
  border: 1px solid rgba(29, 28, 24, .12);
  border-radius: 999px;
  background: rgba(243, 239, 230, .88);
  backdrop-filter: blur(18px);
  box-shadow: 0 8px 30px rgba(54, 45, 31, .07);
}

.brand,
.site-nav,
.header-cta {
  font-size: 12px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: max-content;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.02em;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 33px;
  height: 33px;
  border: 1px solid rgba(29, 28, 24, .72);
  border-radius: 50%;
  color: var(--accent);
  background: var(--neon);
  box-shadow: 0 0 0 3px rgba(184, 255, 61, .16), 0 0 18px rgba(142, 220, 35, .38);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
}

.site-nav {
  display: flex;
  align-items: center;
  gap: 22px;
  color: var(--muted);
}

.site-nav a {
  position: relative;
  padding: 8px 0;
  transition: color .2s ease;
}

.site-nav a::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: var(--accent);
  content: "";
  opacity: 0;
  transform: scaleX(0);
  transition: opacity .2s ease, transform .2s ease;
}

.site-nav a:hover,
.site-nav a.is-current {
  color: var(--text);
}

.site-nav a.is-current::after,
.site-nav a:hover::after {
  opacity: 1;
  transform: scaleX(1);
}

.header-cta,
.primary-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--text);
  border-radius: 2px;
  color: var(--text);
  transition: color .2s ease, background .2s ease, transform .2s ease;
}

.header-cta {
  padding: 9px 13px;
  max-width: 190px;
}
.account-menu { position: relative; justify-self: end; min-width: 0; }
.account-menu-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  display: grid;
  width: max-content;
  min-width: 176px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 250, 241, .98);
  box-shadow: 0 16px 36px rgba(54, 45, 31, .14);
}
.account-menu-panel a,
.account-menu-panel button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 36px;
  padding: 7px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
.account-menu-panel a:hover,
.account-menu-panel button:hover { background: var(--surface-raised); }
.account-menu-panel button { border-top: 1px solid var(--line); border-radius: 0 0 6px 6px; }
.header-cta [data-account-label] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-status-dot { display: inline-block; width: 7px; height: 7px; border: 1px solid var(--muted); border-radius: 50%; background: transparent; flex: 0 0 auto; }
.header-cta.is-authenticated .account-status-dot { border-color: #4a6e16; background: var(--neon); box-shadow: 0 0 9px rgba(142, 220, 35, .72); }

.header-cta:hover,
.primary-cta:hover {
  color: #fffaf1;
  background: var(--text);
  transform: translateY(-2px);
}

.menu-toggle {
  display: none;
  justify-self: end;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  color: var(--text);
  background: transparent;
}

.hero {
  --orbit-turn-x: 0deg;
  --orbit-turn-y: 0deg;
  --orbit-shift-y: 0px;
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: center;
  overflow: hidden;
  isolation: isolate;
}

.hero::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  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='.7' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
  content: "";
  opacity: .055;
  pointer-events: none;
}

.hero-orbit-art {
  position: absolute;
  z-index: -2;
  top: clamp(76px, 9vw, 132px);
  right: max(-8vw, calc((100vw - 1450px) / 2));
  width: min(69vw, 1050px);
  height: min(75vh, 760px);
  overflow: hidden;
  opacity: .94;
  pointer-events: none;
  transform: translate3d(0, var(--orbit-shift-y), 0);
  transition: transform .85s cubic-bezier(.2, .7, .2, 1);
}

.hero-orbit-art::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--bg) 0%, rgba(243, 239, 230, .96) 26%, rgba(243, 239, 230, 0) 64%), linear-gradient(180deg, rgba(243, 239, 230, .4), transparent 25%, rgba(243, 239, 230, .22));
  content: "";
}

.hero-orbit-art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% center;
  mix-blend-mode: multiply;
  transform: perspective(1300px) rotateX(var(--orbit-turn-x)) rotateY(var(--orbit-turn-y)) scale(1.035);
  transform-origin: 62% 48%;
  transition: transform .85s cubic-bezier(.2, .7, .2, 1);
}

.hero-inner {
  position: relative;
  z-index: 2;
  width: var(--wide);
  margin: 0 auto;
  padding: 118px 0 110px;
}

.hero-copy {
  position: relative;
  z-index: 2;
}

.ink-caption {
  position: absolute;
  z-index: 2;
  right: max(24px, calc((100vw - 1180px) / 2));
  bottom: 34px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .08em;
}

.ink-caption i {
  width: 24px;
  height: 1px;
  background: var(--text);
}

.hero h1 {
  max-width: 650px;
  margin: 22px 0 0;
  font-family: var(--font-display);
  font-size: clamp(48px, 5.2vw, 76px);
  font-weight: 600;
  letter-spacing: -.055em;
  line-height: 1.04;
}

.hero--cosmos {
  isolation: isolate;
  color: #f4f3ff;
  background: #020713;
}

.hero--cosmos::before { z-index: -1; opacity: .13; }

.hero-cosmos,
.hero-cosmos-video,
.hero-cosmos-canvas,
.hero-cosmos-shade {
  position: absolute;
  inset: 0;
}

.hero-cosmos { z-index: 0; overflow: hidden; background: #020713; }
.hero-cosmos-video { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-cosmos-canvas { z-index: 1; width: 100%; height: 100%; pointer-events: none; mix-blend-mode: screen; }
.hero-cosmos-shade { z-index: 2; background: linear-gradient(90deg, rgba(1, 5, 16, .88) 0%, rgba(2, 7, 20, .7) 37%, rgba(3, 8, 22, .18) 66%, rgba(2, 7, 18, .42) 100%), linear-gradient(180deg, rgba(1, 4, 13, .64), transparent 24%, rgba(1, 5, 15, .28) 75%, rgba(1, 4, 13, .62)); }

.hero--cosmos .hero-inner { z-index: 2; }
.hero--cosmos .hero-copy { width: min(900px, 76vw); }
.hero--cosmos .hero-story {
  position: relative;
  width: 100%;
  max-width: none;
  height: 314px;
  margin: 24px 0 0;
  color: #f5f3ff;
  font-family: var(--font-display);
  font-size: clamp(38px, 3.9vw, 54px);
  font-weight: 500;
  letter-spacing: -.045em;
  line-height: 1.18;
  text-shadow: 0 3px 28px rgba(75, 97, 180, .22);
}
.hero-story-viewport { position: relative; display: block; height: 100%; overflow: hidden; }
.hero-story-slot { position: absolute; top: 50%; right: 0; left: 0; display: flex; box-sizing: border-box; flex-direction: column; justify-content: center; min-width: 0; transform: translateY(-50%); }
.hero-story-slot--previous { top: 10px; color: rgba(229, 234, 255, .24); filter: blur(.3px); transform: translateY(0); transform-origin: left center; }
.hero-story-slot--current { top: 50%; transform: translateY(-50%); transition: opacity .8s ease, transform .95s cubic-bezier(.18,.78,.22,1), filter .8s ease; }
.hero-story.is-shifting .hero-story-slot--current { animation: hero-story-enter .95s cubic-bezier(.18,.78,.22,1) both; }
.hero-story.is-shifting .hero-story-slot--previous:not([hidden]) { animation: hero-story-recede .95s cubic-bezier(.18,.78,.22,1) both; }
.hero-story-title { display: block; }
.hero-story-body { display: block; margin-top: 26px; color: rgba(228, 233, 255, .78); font-family: var(--font-sans); font-size: 16px; font-weight: 400; letter-spacing: .01em; line-height: 1.5; text-shadow: none; white-space: nowrap; }
.story-size-question .hero-story-title { font-size: 1em; white-space: nowrap; }
.story-size-welcome .hero-story-title { font-size: 1em; letter-spacing: -.045em; white-space: nowrap; }
.story-size-universe .hero-story-title { font-size: 1em; letter-spacing: -.045em; white-space: nowrap; }
.story-size-starlight .hero-story-title { font-size: clamp(34px, 3vw, 42px); letter-spacing: -.045em; white-space: nowrap; }
.hero-story-slot--previous .hero-story-title { font-size: .47em; letter-spacing: -.025em; white-space: nowrap; }
.hero-story-slot--previous .hero-story-body { margin-top: 9px; color: rgba(228, 233, 255, .47); font-size: 13px; line-height: 1.4; }
.hero-story-final { position: absolute; inset: 0; opacity: 0; transform: translateY(22px); filter: blur(4px); pointer-events: none; transition: opacity 1.25s ease, transform 1.25s cubic-bezier(.18,.78,.22,1), filter 1.25s ease; }
.hero-story-final-kicker { position: absolute; top: 8px; left: 0; display: block; color: rgba(225, 232, 255, .58); font-family: var(--font-sans); font-size: 15px; font-weight: 400; letter-spacing: .01em; white-space: nowrap; }
.hero-story-final-main { display: flex; height: 100%; flex-direction: column; justify-content: center; }
.hero-story-final-title { display: block; font-size: clamp(34px, 3vw, 42px); letter-spacing: -.045em; line-height: 1.22; white-space: nowrap; }
.hero-story-final-title + .hero-story-final-title { margin-top: 16px; color: rgba(237, 241, 255, .9); }
.hero-story.is-final .hero-story-viewport { opacity: 0; transform: translateY(-12px); filter: blur(3px); transition: opacity .55s ease, transform .55s ease, filter .55s ease; }
.hero-story.is-final .hero-story-final { opacity: 1; transform: translateY(0); filter: blur(0); animation: hero-story-settle 7s ease-in-out 1.2s infinite; }
.hero-story.is-reduced .hero-story-final { display: none; }
.hero-question-stars { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.hero-question-star[hidden], .hero-burst-star[hidden] { display: none; }
.hero-question-star { position: absolute; display: block; width: 22px; height: 22px; cursor: default; pointer-events: auto; outline: none; animation: question-star-drift var(--drift-duration, 11s) ease-in-out var(--drift-delay, 0s) infinite; }
.hero-question-star::after { position: absolute; top: 50%; left: 50%; width: 20px; height: 1px; content: ''; background: linear-gradient(90deg, transparent, rgba(223, 235, 255, .72), transparent); box-shadow: 0 0 8px rgba(190, 213, 255, .7); opacity: .06; transform: translate(-50%, -50%) rotate(var(--star-angle, 0deg)); animation: question-star-glint var(--star-duration, 3.8s) ease-in-out var(--star-delay, 0s) infinite; }
.hero-question-star i { position: absolute; inset: 50% auto auto 50%; width: 4px; height: 4px; border-radius: 50%; background: #eef3ff; box-shadow: 0 0 0 2px rgba(173, 196, 255, .1), 0 0 12px 3px rgba(151, 183, 255, .36); transform: translate(-50%, -50%); animation: question-star-twinkle var(--star-duration, 3.8s) ease-in-out var(--star-delay, 0s) infinite; transition: width .22s ease, height .22s ease, box-shadow .22s ease; }
.hero-question-star b { position: absolute; top: 50%; left: var(--tip-left, -212px); width: 190px; padding: 9px 11px; border: 1px solid rgba(202, 215, 255, .45); border-radius: 8px; background: rgba(5, 10, 28, .86); color: rgba(242, 245, 255, .94); font-family: var(--font-sans); font-size: 12px; font-weight: 400; letter-spacing: 0; line-height: 1.5; opacity: 0; pointer-events: none; transform: translate(0, -40%); transition: opacity .22s ease, transform .22s ease; }
.hero-question-star:hover, .hero-question-star:focus { animation-play-state: paused; z-index: 4; }
.hero-question-star:hover i, .hero-question-star:focus i { width: 8px; height: 8px; box-shadow: 0 0 0 5px rgba(177, 199, 255, .18), 0 0 26px 9px rgba(163, 190, 255, .75); }
.hero-question-star.is-question-visible b { opacity: 1; transform: translate(0, -50%); transition-duration: .28s; }
.hero-question-star.is-question-dismissed b { opacity: 0; transition: none; }
.hero-question-star.is-question-visible { z-index: 3; }
.hero-question-star.is-question-visible i { box-shadow: 0 0 0 3px rgba(177,199,255,.14), 0 0 19px 5px rgba(163,190,255,.5); }
.hero-question-star--one { --star-duration: 3.9s; --star-delay: -.8s; --star-angle: 14deg; --drift-duration: 10s; --drift-delay: -4s; --drift-x: 22px; --drift-y: -18px; }
.hero-question-star--two { --star-duration: 4.7s; --star-delay: -1.6s; --star-angle: -37deg; --drift-duration: 12s; --drift-delay: -8s; --drift-x: -24px; --drift-y: 18px; }
.hero-question-star--three { --star-duration: 3.5s; --star-delay: -2.1s; --star-angle: 54deg; --drift-duration: 9s; --drift-delay: -2s; --drift-x: 18px; --drift-y: 24px; }
.hero-question-star--four { --star-duration: 5.1s; --star-delay: -.4s; --star-angle: -12deg; --drift-duration: 13s; --drift-delay: -6s; --drift-x: -22px; --drift-y: -20px; }
.hero-question-star--five { --star-duration: 4.2s; --star-delay: -2.8s; --star-angle: 76deg; --drift-duration: 11s; --drift-delay: -9s; --drift-x: 24px; --drift-y: 16px; }
.hero-question-star--six { --star-duration: 3.7s; --star-delay: -1.2s; --star-angle: 28deg; --drift-duration: 10s; --drift-delay: -3s; --drift-x: -18px; --drift-y: -24px; }
.hero-burst-stars { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.hero-burst-star { position: absolute; display: block; width: 4px; height: 4px; border-radius: 50%; background: #f4f7ff; box-shadow: 0 0 5px 1px rgba(207, 224, 255, .4); opacity: .08; animation: hero-star-burst var(--burst-duration, 13s) ease-in-out var(--burst-delay, 0s) infinite; }
.hero-burst-star::before, .hero-burst-star::after { position: absolute; top: 50%; left: 50%; content: ''; background: linear-gradient(90deg, transparent, rgba(225, 236, 255, .95), transparent); box-shadow: 0 0 10px rgba(193, 218, 255, .8); opacity: .85; }
.hero-burst-star::before { width: 34px; height: 1px; transform: translate(-50%, -50%); }
.hero-burst-star::after { width: 1px; height: 34px; transform: translate(-50%, -50%); }
.hero-burst-star--one { --burst-duration: 14s; --burst-delay: -2.4s; }
.hero-burst-star--two { --burst-duration: 19s; --burst-delay: -11s; }
.hero-burst-star--three { --burst-duration: 16s; --burst-delay: -6.5s; }
.hero-burst-star--four { --burst-duration: 22s; --burst-delay: -14s; }

@keyframes hero-story-enter { from { opacity: 0; transform: translateY(calc(-50% + 34px)); filter: blur(4px); } to { opacity: 1; transform: translateY(-50%); filter: blur(0); } }
@keyframes hero-story-recede { from { opacity: .82; transform: translateY(106px) scale(1.68); filter: blur(0); } to { opacity: 1; transform: translateY(0) scale(1); filter: blur(.3px); } }
@keyframes hero-story-settle { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-2px) rotate(-.08deg); } }
@keyframes question-star-twinkle { 0%, 100% { transform: translate(-50%, -50%) scale(.46); opacity: .22; } 18% { transform: translate(-50%, -50%) scale(.65); opacity: .46; } 34% { transform: translate(-50%, -50%) scale(1.32); opacity: 1; } 43% { transform: translate(-50%, -50%) scale(.72); opacity: .42; } 58% { transform: translate(-50%, -50%) scale(1.04); opacity: .78; } 72% { transform: translate(-50%, -50%) scale(.54); opacity: .28; } }
@keyframes question-star-glint { 0%, 100% { opacity: .03; transform: translate(-50%, -50%) rotate(var(--star-angle, 0deg)) scaleX(.45); } 34% { opacity: .76; transform: translate(-50%, -50%) rotate(var(--star-angle, 0deg)) scaleX(1.25); } 44% { opacity: .12; transform: translate(-50%, -50%) rotate(var(--star-angle, 0deg)) scaleX(.6); } 58% { opacity: .42; transform: translate(-50%, -50%) rotate(var(--star-angle, 0deg)) scaleX(.9); } }
@keyframes question-star-drift { 0%, 100% { transform: translate3d(calc(var(--drift-x) * -.65), calc(var(--drift-y) * -.4), 0); } 35% { transform: translate3d(var(--drift-x), calc(var(--drift-y) * .25), 0); } 68% { transform: translate3d(calc(var(--drift-x) * .4), var(--drift-y), 0); } }
@keyframes hero-star-burst { 0%, 67%, 100% { transform: scale(.4); opacity: .04; } 72% { transform: scale(1); opacity: 1; } 75% { transform: scale(.7); opacity: .28; } 78% { transform: scale(1.2); opacity: .82; } 82% { transform: scale(.48); opacity: .06; } }

.site-header.is-on-cosmos { color: #eef2ff; }
.site-header.is-on-cosmos .brand-mark { border-color: rgba(234, 240, 255, .78); color: #11152b; background: #b7c8ff; box-shadow: 0 0 0 3px rgba(142, 165, 255, .18), 0 0 18px rgba(142, 165, 255, .35); }
.site-header.is-on-cosmos .site-nav { color: rgba(229, 235, 255, .74); }
.site-header.is-on-cosmos .site-nav a:hover,
.site-header.is-on-cosmos .site-nav a.is-current { color: #fff; }
.site-header.is-on-cosmos .site-nav a::after { background: #b7c8ff; }
.site-header.is-on-cosmos .header-cta { border-color: rgba(226, 234, 255, .78); color: #f4f7ff; background: rgba(5, 10, 29, .22); }
.site-header.is-on-cosmos .header-cta:hover { color: #0a1025; background: #eef2ff; }
.site-header.is-on-cosmos.is-scrolled { border-color: rgba(174, 190, 245, .26); background: rgba(3, 8, 23, .76); box-shadow: 0 8px 30px rgba(0, 0, 0, .27); }
.cosmos-home .site-particle-field { opacity: .34; mix-blend-mode: screen; }


.hero-copy {
  width: min(54%, 650px);
}

.hero-subtitle {
  max-width: 470px;
  margin: 28px 0 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.85;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 22px;
  margin-top: 34px;
}

.hero-actions .primary-cta {
  padding: 13px 18px;
  color: #fffaf1;
  background: var(--text);
}

.hero-actions .primary-cta:hover {
  color: var(--text);
  background: transparent;
}

.quiet-link {
  padding: 7px 0;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
  transition: border-color .2s ease, color .2s ease;
}

.quiet-link:hover {
  border-color: var(--text);
  color: var(--text);
}

.hero-note {
  margin: 64px 0 0;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .14em;
}

.scroll-cue {
  position: absolute;
  bottom: 28px;
  left: 50%;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  transform: translateX(-50%);
}

.scroll-cue span {
  color: var(--warm);
  font-size: 16px;
}

.module-index {
  position: relative;
  padding: 116px 0 126px;
  background: linear-gradient(180deg, #020713 0, #111827 28px, rgba(243, 239, 230, .96) 110px, rgba(243, 239, 230, .28) 168px);
}

.section-intro {
  display: grid;
  grid-template-columns: minmax(130px, .7fr) 1.6fr;
  gap: 24px;
  align-items: start;
  margin-bottom: 54px;
}

.section-intro h2 {
  max-width: 740px;
  margin: -8px 0 0;
  font-family: var(--font-display);
  font-size: clamp(32px, 4.6vw, 64px);
  font-weight: 550;
  letter-spacing: -.06em;
  line-height: 1.05;
}

.module-list {
  border-top: 1px solid var(--line);
}

.module-row {
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr) auto 32px;
  gap: 18px;
  align-items: center;
  min-height: 96px;
  border-bottom: 1px solid var(--line);
  transition: padding .3s ease, background .3s ease;
}

.module-row:hover {
  padding: 0 18px;
  background: var(--surface);
}

.module-number {
  color: var(--warm);
  font-size: 12px;
  letter-spacing: .12em;
}

.module-copy {
  display: flex;
  align-items: baseline;
  gap: 18px;
}

.module-copy strong {
  font-family: var(--font-display);
  font-size: clamp(22px, 3vw, 36px);
  font-weight: 560;
  letter-spacing: -.045em;
}

.module-copy small {
  color: var(--muted);
  font-size: 10px;
  letter-spacing: .14em;
}

.module-status {
  color: var(--muted);
  font-size: 12px;
}

.module-arrow {
  color: var(--warm);
  font-size: 20px;
  transition: transform .25s ease;
}

.module-row:hover .module-arrow {
  transform: translate(4px, -4px);
}

.content-section {
  padding: 116px 0;
  border-top: 1px solid var(--line);
}

.content-section:nth-of-type(odd) {
  background: rgba(238, 232, 221, .88);
  backdrop-filter: blur(1.5px);
}

.motion-ready .reveal-section {
  opacity: 0;
  transform: translateY(54px);
  transition: opacity .85s cubic-bezier(.2, .7, .2, 1), transform 1s cubic-bezier(.2, .7, .2, 1);
}

.motion-ready .reveal-section.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.motion-ready .reveal-section .module-row,
.motion-ready .content-section.reveal-section .content-grid > * {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .7s ease, transform .8s cubic-bezier(.2, .7, .2, 1);
}

.motion-ready .reveal-section.is-visible .module-row,
.motion-ready .content-section.reveal-section.is-visible .content-grid > * {
  opacity: 1;
  transform: translateY(0);
}

.motion-ready .reveal-section.is-visible .module-row:nth-child(2),
.motion-ready .content-section.reveal-section.is-visible .content-grid > *:nth-child(2) {
  transition-delay: .1s;
}

.motion-ready .reveal-section.is-visible .module-row:nth-child(3) {
  transition-delay: .18s;
}

.motion-ready .reveal-section.is-visible .module-row:nth-child(4) {
  transition-delay: .26s;
}

.content-grid {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1fr);
  gap: 12vw;
  align-items: start;
}

.content-section h2 {
  max-width: 480px;
  margin: 18px 0 0;
  font-family: var(--font-display);
  font-size: clamp(36px, 5vw, 72px);
  font-weight: 550;
  letter-spacing: -.07em;
  line-height: .98;
}

.section-description {
  max-width: 330px;
  margin: 24px 0 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.8;
}

.content-placeholder {
  min-height: 250px;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, .58);
}

.content-placeholder::before {
  display: block;
  width: 100%;
  height: 1px;
  margin-bottom: 70px;
  background: var(--text);
  content: "";
  opacity: .7;
}

.placeholder-status {
  display: block;
  color: var(--warm);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.content-placeholder p {
  max-width: 360px;
  margin: 14px 0 24px;
  color: var(--muted);
  line-height: 1.7;
}

.content-placeholder button {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 9px 14px;
  color: var(--muted);
  background: transparent;
  cursor: not-allowed;
  font-size: 12px;
}

.content-placeholder--notebook {
  border-radius: 0;
  border-width: 1px 0;
  background: transparent;
}

.content-placeholder--projects {
  border-style: dashed;
}

.content-placeholder--community {
  border-radius: 24px 24px 24px 4px;
}

.site-footer {
  display: flex;
  justify-content: space-between;
  width: var(--wide);
  margin: 0 auto;
  padding: 32px 0 48px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .04em;
}

@media (max-width: 760px) {
  :root { --wide: min(100% - 32px, 620px); }

  .site-header {
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 12px;
    padding: 16px 0;
  }

  .site-header.is-scrolled {
    padding: 11px 13px;
  }

  .menu-toggle { display: block; grid-column: 3; grid-row: 1; }
  .account-menu { grid-column: 2; grid-row: 1; }
  .header-cta { display: inline-flex; max-width: 112px; padding: 8px 10px; }
  .header-cta > span:last-child { display: none; }

  .site-nav {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    left: 0;
    display: grid;
    gap: 0;
    padding: 8px 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(255, 250, 241, .97);
    box-shadow: 0 22px 45px rgba(54, 45, 31, .12);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-6px);
    transition: opacity .2s ease, transform .2s ease;
  }

  .menu-open .site-nav {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }

  .site-nav a { padding: 13px 0; border-bottom: 1px solid var(--line); }
  .site-nav a:last-child { border-bottom: 0; }
  .hero { min-height: auto; }
  .hero--cosmos { min-height: 100svh; }
  .hero--cosmos .hero-inner { min-height: 100svh; padding: 138px 0 94px; }
  .hero--cosmos .hero-copy { width: 100%; }
  .hero--cosmos .hero-story { width: 100%; height: 372px; margin-top: 0; font-size: clamp(33px, 9.6vw, 46px); line-height: 1.2; }
  .hero-story-body { max-width: none; margin-top: 26px; font-size: 15px; line-height: 1.65; }
  .story-size-welcome .hero-story-title { font-size: clamp(27px, 6.8vw, 33px); letter-spacing: -.045em; white-space: nowrap; }
  .story-size-universe .hero-story-title { font-size: clamp(25px, 6.2vw, 31px); letter-spacing: -.045em; white-space: nowrap; }
  .story-size-starlight .hero-story-title { font-size: clamp(25px, 6.2vw, 30px); letter-spacing: -.045em; white-space: nowrap; }
  .hero-story-slot--previous { top: 14px; }
  .hero-story-slot--previous .hero-story-title { font-size: .52em; }
  .hero-story-slot--previous .hero-story-body { margin-top: 8px; font-size: 12px; }
  .hero-story-final-kicker { top: 14px; font-size: 13px; }
  .hero-story-final-title { font-size: clamp(25px, 6.2vw, 30px); letter-spacing: -.045em; white-space: nowrap; }
  .hero-story-final-title + .hero-story-final-title { margin-top: 14px; }
  .hero-cosmos-video { object-position: 61% center; }
  .hero-cosmos-shade { background: linear-gradient(90deg, rgba(1, 5, 16, .89), rgba(2, 7, 20, .58) 78%), linear-gradient(180deg, rgba(1, 4, 13, .58), transparent 42%, rgba(1, 4, 13, .68)); }
  .site-header.is-on-cosmos .menu-toggle { border-color: rgba(226, 234, 255, .62); color: #fff; background: rgba(3, 8, 23, .25); }
  .hero-orbit-art { top: 110px; right: -38%; width: 134%; height: 610px; opacity: .76; }
  .hero-orbit-art::after { background: linear-gradient(90deg, var(--bg) 0%, rgba(243, 239, 230, .9) 46%, rgba(243, 239, 230, .16) 100%), linear-gradient(180deg, rgba(243, 239, 230, .22), var(--bg) 92%); }
  .hero-orbit-art img { object-position: 63% 30%; }
  .hero-inner { display: block; min-height: 100svh; padding: 104px 0 102px; }
  .hero-copy { width: 100%; }
  .hero h1 { font-size: clamp(42px, 12.7vw, 52px); }
  .hero-subtitle { max-width: 330px; font-size: 14px; }
  .hero-actions { align-items: flex-start; gap: 16px; }
  .quiet-link { width: max-content; }
  .hero-note { margin-top: 40px; }
  .ink-caption { right: 16px; bottom: 20px; }
  .scroll-cue { display: none; }
  .module-index { padding: 108px 0 76px; background: linear-gradient(180deg, #020713 0, #111827 26px, rgba(243, 239, 230, .96) 94px, rgba(243, 239, 230, .28) 144px); }
  .content-section { padding: 76px 0; }
  .section-intro, .content-grid { display: block; }
  .section-intro h2 { margin-top: 18px; }
  .module-list { margin-top: 42px; }
  .module-row { grid-template-columns: 38px minmax(0, 1fr) 22px; gap: 10px; min-height: 90px; }
  .module-row:hover { padding: 0; background: transparent; }
  .module-copy { display: block; }
  .module-copy strong { display: block; font-size: 25px; }
  .module-copy small { display: block; margin-top: 5px; }
  .module-status { display: none; }
  .content-placeholder { margin-top: 48px; }
  .site-footer { display: grid; gap: 8px; padding-bottom: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

  .motion-ready .reveal-section,
  .motion-ready .reveal-section .module-row,
  .motion-ready .content-section.reveal-section .content-grid > * {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Public platform and editor share the existing palette and typography. */
[hidden] { display: none !important; }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.button, .platform-shell button {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 36px; padding: 7px 12px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--surface-raised); color: var(--text);
  font: inherit; font-size: 14px; cursor: pointer; text-align: center;
}
.button:hover, .platform-shell button:hover { border-color: var(--accent); }
.platform-shell button[type="submit"] { background: var(--accent); color: var(--bg); border-color: var(--accent); }
.platform-shell button:disabled { cursor: wait; opacity: .55; }
.platform-shell button.danger { color: #9e382b; }
.platform-shell button[aria-pressed="true"] { border-color: var(--accent); color: var(--accent); background: #e2dacd; }
.platform-page .site-header { background: rgba(243, 239, 230, .96); }
.platform-page .platform-shell { animation: page-enter .72s cubic-bezier(.2, .7, .2, 1) both; }
.platform-shell { width: var(--wide); margin: 0 auto; padding: 92px 0 36px; min-height: calc(100svh - 120px); font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }
.platform-shell h1, .platform-shell h2, .platform-shell h3, .platform-shell p { margin: 0; }
.platform-shell h1 { font-size: 26px; line-height: 1.25; }
.platform-shell h2 { font-size: 19px; line-height: 1.4; }
.platform-shell h3 { font-size: 16px; line-height: 1.4; }
.platform-shell > p { margin: 10px 0; }
.platform-shell > .panel, .platform-shell > section, .platform-shell > article { margin-bottom: 12px; }
.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
.toolbar h1, .toolbar h2, .toolbar h3 { margin-right: auto; }
.page-heading { min-height: 40px; margin-bottom: 8px; flex-wrap: nowrap; }
.page-heading h1 { flex: 0 0 auto; white-space: nowrap; }
.page-heading .muted { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; }
.panel { padding: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(235, 229, 217, .94); min-width: 0; }

@keyframes page-enter {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}
.panel > * + * { margin-top: 10px; }
.panel > .toolbar + .feedback:empty, .feedback:empty { display: none; }
.muted { color: var(--muted); font-size: 14px; }
.text-link { color: var(--accent); min-height: 36px; display: inline-flex; align-items: center; }
.feedback { margin: 8px 0; color: var(--accent); white-space: pre-wrap; overflow-wrap: anywhere; }
.feedback.error { color: #862f23; background: #f7e1da; padding: 10px 12px; border-left: 3px solid #b65343; border-radius: 4px; }
.platform-shell label { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: 14px; color: var(--muted); }
.platform-shell input, .platform-shell select, .platform-shell textarea { width: 100%; min-width: 0; max-width: 100%; min-height: 36px; border: 1px solid #b9af9f; border-radius: 6px; padding: 7px 10px; background: #fffaf2; color: var(--text); font: inherit; font-size: 15px; line-height: 1.5; }
.platform-shell textarea { resize: vertical; }
.platform-shell input[type="checkbox"] { width: 18px; height: 18px; min-height: 18px; flex: 0 0 18px; accent-color: var(--accent); }
.platform-shell .check-label { flex-direction: row; align-items: center; align-self: end; min-height: 36px; }
.platform-shell input[type="file"] { font-size: 13px; }
.filters { margin-bottom: 8px; }
.filters label { flex-direction: row; align-items: center; flex: 1 1 200px; }
.filters label:first-child { flex-grow: 2; }
.filters label input, .filters label select { flex: 1; }
.card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.content-card { display: flex; flex-direction: column; align-items: start; gap: 10px; }
.content-card > * { margin: 0; }
.content-card .text-link { margin-top: auto; }
.card-cover { width: 100%; height: 160px; object-fit: cover; border-radius: 6px; }
.tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag { display: inline-block; padding: 2px 7px; font-size: 12px; border: 1px solid var(--line); border-radius: 5px; color: var(--muted); }
.tag.demo { border-color: #a98f67; color: #785f38; }
.detail-meta { margin-bottom: 8px; }
.prose { white-space: pre-wrap; line-height: 1.9; overflow-wrap: anywhere; }
.empty { color: var(--muted); padding: 16px; }
.account-form { max-width: 600px; }
.account-form > .toolbar + .toolbar { margin-top: 8px; }
.learning-accounts .toolbar > label { flex-direction: row; align-items: center; gap: 8px; }
.learning-accounts .toolbar input { width: min(220px, 45vw); }
.learning-accounts .table-scroll { overflow-x: auto; }
.learning-accounts table { border-collapse: collapse; width: 100%; text-align: left; }
.learning-accounts th, .learning-accounts td { padding: 8px; border-bottom: 1px solid var(--line); }
.learning-accounts th, .learning-accounts td:not(:first-child) { white-space: nowrap; }
.learning-accounts td:first-child { min-width: 90px; overflow-wrap: anywhere; }
[data-account-editor] > * + * { margin-top: 14px; }
.learning-gate { max-width: 720px; display: grid; gap: 8px; }
.learning-gate > * { margin: 0; }
.learning-gate button { justify-self: start; }
.learning-access-dialog { width: min(480px, calc(100vw - 24px)); border: 1px solid var(--line); border-radius: 12px; padding: 24px; color: var(--text); background: #fbf7ee; box-shadow: 0 24px 80px rgba(30, 28, 23, .22); }
.learning-access-dialog::backdrop { background: rgba(35, 32, 27, .35); backdrop-filter: blur(2px); }
.learning-access-dialog section { display: grid; gap: 12px; }
.learning-access-dialog h2, .learning-access-dialog p { margin: 0; }
.learning-access-dialog .account-form { max-width: none; }
.learning-access-dialog .dialog-close { position: absolute; top: 8px; right: 10px; min-width: 32px; min-height: 32px; padding: 0; border: 0; background: transparent; font-size: 24px; line-height: 1; }
.contact-qr { width: min(100%, 290px); margin: 0 auto; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.account-profile { display: flex; align-items: center; justify-content: space-between; gap: 16px; max-width: 760px; background: rgba(255, 250, 241, .72); }
.account-profile h2 { margin-top: 5px; font-size: 27px; }
.account-online { display: inline-flex; align-items: center; gap: 6px; color: #46631d; font-size: 12px; font-weight: 700; }
.account-online i { width: 8px; height: 8px; border-radius: 50%; background: var(--neon); box-shadow: 0 0 9px rgba(142, 220, 35, .72); }
.account-alert { max-width: 760px; padding: 12px 14px; border: 1px solid #b58b42; border-radius: var(--radius); background: #fbefd3; }
.account-workspaces { max-width: 940px; border-top: 1px solid var(--line); }
.workspace-grid { display: grid; }
.workspace-card { display: grid; grid-template-columns: minmax(0, 1fr) auto 72px; align-items: center; gap: 18px; min-height: 64px; padding: 10px 4px; border-bottom: 1px solid var(--line); color: var(--text); }
.workspace-card strong { font: 500 19px/1.25 "Songti SC", STSong, serif; }
.workspace-card-status { color: #46631d; font-size: 12px; font-weight: 700; letter-spacing: .04em; white-space: nowrap; }
.workspace-card--ready { cursor: pointer; transition: padding .18s ease, background .18s ease; }
.workspace-card--ready b { color: var(--accent); font-size: 13px; text-align: right; white-space: nowrap; }
.workspace-card--ready:hover, .workspace-card--ready:focus-visible { padding-right: 10px; padding-left: 10px; background: rgba(235, 229, 217, .75); }
.workspace-card--ready:active { background: rgba(224, 215, 200, .85); }
.workspace-card--locked { color: var(--muted); }
.workspace-card--locked .workspace-card-status, .workspace-card--pending .workspace-card-status { color: var(--muted); }
.workspace-card--locked, .workspace-card--pending { grid-template-columns: minmax(0, 1fr) auto; }
.workspace-card--pending { color: var(--muted); }
.account-management { display: flex; align-items: center; justify-content: space-between; gap: 18px; max-width: 760px; }
.account-management > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 36px; cursor: pointer; list-style: none; }
.account-management > summary::-webkit-details-marker { display: none; }
.account-management > summary span:first-child { display: grid; gap: 2px; }
.account-management > summary small { color: var(--muted); font-weight: 400; }
.account-management[open] > summary { margin-bottom: 10px; }
.account-security { max-width: 760px; }
.account-security > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 36px; cursor: pointer; list-style: none; }
.account-security > summary::-webkit-details-marker { display: none; }
.account-security > summary span:first-child { display: flex; align-items: baseline; gap: 10px; }
.account-security > summary small { color: var(--muted); }
.account-security[open] > summary > span:last-child { transform: rotate(45deg); }
.account-security .account-form { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.operations-shell .page-heading { margin-bottom: 8px; }
.ops-layout { display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); gap: 12px; margin-bottom: 12px; align-items: start; }
.ops-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; margin: 10px 0; }
.ops-account-list .ops-fields { grid-template-columns: minmax(0, 1fr); }
.ops-user { border-bottom: 1px solid var(--line); padding: 10px 0; }
.ops-user .toolbar strong { margin-right: auto; }
.operations-shell .ops-search { flex: 1 1 180px; max-width: 300px; margin-left: auto; }
.operations-shell details > summary { cursor: pointer; padding: 8px 0; min-height: 36px; }
.operations-shell [data-inspector] > .toolbar, .operations-shell [data-reset] { margin-top: 12px; }
.operations-shell pre { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; }
.operations-shell iframe { width: 100%; height: 560px; border: 1px solid var(--line); background: #fffaf1; }
.operations-shell [data-inspect-task] { margin: 4px; max-width: 100%; text-align: left; overflow-wrap: anywhere; }
@media (max-width: 760px) { .ops-layout, .ops-fields { grid-template-columns: minmax(0, 1fr); } }
.account-form > label + label { margin-top: 12px; }
.message-form { margin-bottom: 18px; }
.message-form .toolbar label { flex-direction: row; align-items: center; white-space: nowrap; }
.message-form .toolbar input { flex: 1 1 190px; width: 190px; min-width: 0; }
.message-form > label { margin: 8px 0; }
.message { margin: 10px 0; }
.message time { color: var(--muted); font-size: 12px; margin-left: auto; }
.reply-context { border-left: 2px solid var(--line); padding-left: 10px; font-size: 13px; color: var(--muted); }
.honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.admin-tabs { margin-bottom: 12px; }
.course-admin-overview { display: grid; gap: 12px; }
.course-admin-overview > .toolbar > div { margin-right: auto; }
.course-admin-overview .eyebrow { margin-bottom: 3px; }
.course-admin-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.course-admin-metrics article { display: grid; gap: 3px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 6px; background: rgba(255, 250, 241, .55); }
.course-admin-metrics span { color: var(--muted); font-size: 12px; }
.course-admin-metrics strong { font: 500 24px/1.1 "Songti SC", STSong, serif; }
.course-storage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, 260px) auto; align-items: center; gap: 8px 16px; padding: 10px 12px; }
.course-storage > div { display: grid; gap: 2px; }
.course-storage span, .course-storage small { color: var(--muted); font-size: 12px; }
.course-storage progress { width: 100%; accent-color: var(--accent); }
.course-storage.is-warning { border-color: #b58b42; background: #fbefd3; }
.course-storage.is-blocked { border-color: #a24d42; background: #f8ddd8; }
.course-stats-detail > summary { min-height: 36px; padding: 7px 0; cursor: pointer; font-weight: 700; }
.course-stats-detail[open] > summary { margin-bottom: 6px; }
.admin-content-layout { display: grid; grid-template-columns: minmax(200px, .7fr) minmax(0, 2fr); align-items: start; gap: 12px; }
.admin-content-list { max-height: 75vh; overflow-y: auto; padding: 2px; }
.admin-item { margin-bottom: 8px; padding: 12px; }
.editor-heading { position: sticky; top: 82px; z-index: 2; background: var(--surface); padding: 6px 0; }
.editor-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.span-two { grid-column: 1 / -1; }
.editor-form [data-course-fields] { margin-top: 12px; }
.lesson-edit-layout { display: grid; grid-template-columns: minmax(170px, 1fr) minmax(0, 1.2fr); gap: 10px; margin-top: 8px; align-items: start; }
.admin-lesson-list { max-height: 310px; border: 1px solid var(--line); border-radius: 6px; }
.selected-lesson > * + * { margin-top: 10px; }
.selected-lesson-meta { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(180px, .7fr); gap: 10px; }
.upload-form { margin-top: 12px; }
.upload-form .toolbar > label { flex: 1 1 220px; }
.upload-form progress { max-width: 100%; width: 220px; accent-color: var(--accent); }
.upload-form [data-progress-label] { margin-left: 8px; font-size: 13px; color: var(--muted); }
.upload-preview { max-width: 240px; max-height: 150px; object-fit: contain; }
.table-wrap { overflow: auto; }
table { border-collapse: collapse; width: 100%; text-align: left; table-layout: fixed; }
th, td { padding: 10px 12px; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.site-nav a, .menu-toggle, .header-cta { min-height: 36px; }
@media (max-width: 960px) {
  .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-header { gap: 12px; }
  .site-nav { gap: 12px; }
  .admin-content-layout { grid-template-columns: minmax(180px, .7fr) minmax(0, 2fr); }
  .lesson-edit-layout { grid-template-columns: minmax(0, 1fr); }
  .admin-lesson-list { max-height: 220px; }
}
@media (max-width: 760px) {
  .platform-shell { padding-top: 76px; }
  .platform-shell h1 { font-size: 23px; }
  .panel { padding: 12px; }
  .platform-shell .card-grid, .admin-content-layout { grid-template-columns: minmax(0, 1fr); }
  .admin-content-list { max-height: 230px; }
  .editor-heading { top: 68px; }
  .editor-fields { grid-template-columns: minmax(0, 1fr); }
  .course-admin-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .course-storage { grid-template-columns: minmax(0, 1fr); }
  .span-two { grid-column: auto; }
  .platform-shell .toolbar { gap: 8px; }
  .platform-shell .toolbar > label { max-width: 100%; }
  .platform-shell .filters label { flex-basis: 100%; }
  .platform-shell .page-heading .muted { font-size: 12px; }
  .account-profile, .account-management { align-items: flex-start; }
  .account-management { display: grid; }
  .workspace-card { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; }
  .workspace-card--ready b { grid-column: 1 / -1; text-align: left; }
  .account-security > summary span:first-child { display: grid; gap: 1px; }
  .site-nav { visibility: hidden; }
  .menu-open .site-nav { visibility: visible; }
  .message-form .toolbar label { flex: 1 1 100%; }
  .message-form .toolbar input { width: auto; flex-basis: 0; }
  .admin-lesson-list { max-height: 220px; }
  .selected-lesson-meta { grid-template-columns: minmax(0, 1fr); }
}