:root {
  --forest: #174b3b;
  --forest-dark: #10382e;
  --forest-deep: #0d3028;
  --cream: #f6f0df;
  --paper: #fff9e9;
  --paper-deep: #e9ddc0;
  --ink: #163b31;
  --ink-soft: #40594e;
  --red: #b74b35;
  --red-dark: #8f372b;
  --sun: #f4c958;
  --teal: #a9cbbd;
  --line: rgba(23, 75, 59, .22);
  --display: Impact, Haettenschweiler, 'Arial Narrow Bold', 'Arial Black', sans-serif;
  --body: 'Trebuchet MS', 'Avenir Next', Avenir, system-ui, sans-serif;
  --serif: Georgia, 'Times New Roman', serif;
  --shadow: 8px 9px 0 rgba(16, 56, 46, .16);
  font-family: var(--body);
  color: var(--ink);
  background: var(--cream);
  scroll-behavior: smooth;
  scroll-padding-top: 86px;
}

* { box-sizing: border-box; }
html { min-width: 320px; }
body { margin: 0; background: var(--cream); overflow-x: hidden; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, summary:focus-visible { outline: 3px solid #c14b34; outline-offset: 4px; }
::selection { color: var(--forest-deep); background: var(--sun); }
.shell { width: min(1200px, calc(100% - 64px)); margin-inline: auto; }
.section-pad { padding: 112px 0; position: relative; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; top: 8px; left: 8px; padding: 12px 18px; background: var(--sun); color: var(--forest-deep); transform: translateY(-150%); font-weight: 800; }
.skip-link:focus { transform: none; }

.topline { height: 31px; overflow: hidden; color: var(--cream); background: var(--red-dark); display: flex; align-items: center; font-family: var(--display); letter-spacing: .075em; font-size: 11px; }
.topline__scroll { width: max-content; display: flex; align-items: center; gap: 28px; white-space: nowrap; animation: ticker 42s linear infinite; }
.topline__scroll i { color: var(--sun); font-style: normal; font-family: var(--body); }
.topline:hover .topline__scroll { animation-play-state: paused; }
@keyframes ticker { to { transform: translateX(-50%); } }

.site-header { position: sticky; top: 0; z-index: 20; background: var(--cream); border-bottom: 1px solid rgba(23, 75, 59, .13); }
.nav { height: 78px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; gap: 10px; align-items: center; text-decoration: none; }
.brand__stamp { width: 38px; height: 40px; display: grid; place-items: center; background: var(--forest); color: var(--sun); font-family: var(--display); font-size: 25px; transform: rotate(-5deg); border: 2px solid var(--forest); box-shadow: 3px 3px 0 var(--red); }
.brand__stamp span { color: var(--cream); }
.brand__name { display: flex; flex-direction: column; font-family: var(--display); font-size: 18px; letter-spacing: .04em; line-height: .95; }
.brand__name > span { color: var(--red); }
.brand__name small { padding-top: 5px; font: 700 8px/1 var(--body); letter-spacing: .13em; color: var(--forest); }
.nav__links { display: flex; align-items: center; gap: 39px; }
.nav__links a { text-decoration: none; font-size: 10px; font-weight: 900; letter-spacing: .11em; transition: color .18s ease; }
.nav__links a:hover { color: var(--red); }
.nav__links .nav__join { padding: 15px 18px; background: var(--forest); color: var(--cream); box-shadow: 3px 3px 0 var(--sun); transition: transform .18s ease, box-shadow .18s ease; }
.nav__links .nav__join:hover { color: var(--cream); transform: translate(-2px, -2px); box-shadow: 5px 5px 0 var(--sun); }
.nav__join span { color: var(--sun); margin-left: 8px; font-size: 14px; }
.nav__toggle { display: none; border: 0; background: transparent; color: var(--forest); padding: 10px; }

.hero { min-height: 690px; position: relative; padding: 58px 0 27px; overflow: hidden; background: var(--cream); isolation: isolate; }
.hero__grain { position: absolute; inset: 0; z-index: -1; opacity: .2; pointer-events: none; background-image: radial-gradient(#816b3d 0.55px, transparent .55px); background-size: 6px 6px; mask-image: linear-gradient(to right, #000, transparent 68%); }
.hero::before { content: ''; position: absolute; left: -260px; bottom: -450px; width: 800px; height: 700px; border: 1px solid rgba(23,75,59,.1); border-radius: 50%; box-shadow: 0 0 0 44px rgba(23,75,59,.025),0 0 0 88px rgba(23,75,59,.025); z-index: -1; }
.hero__grid { display: grid; grid-template-columns: .89fr 1.11fr; gap: 42px; align-items: center; }
.hero__copy { position: relative; z-index: 2; padding: 12px 0 13px; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 17px; color: var(--sun); font-size: 9px; font-weight: 900; letter-spacing: .18em; line-height: 1.4; }
.eyebrow--green { color: var(--forest); }
.eyebrow--cream { color: var(--cream); }
.pulse-dot { width: 8px; height: 8px; flex: 0 0 8px; background: var(--red); border-radius: 50%; box-shadow: 0 0 0 4px rgba(183,75,53,.13); animation: dot-pulse 2.1s ease-out infinite; }
@keyframes dot-pulse { 60% { box-shadow: 0 0 0 9px rgba(183,75,53,0); } 100% { box-shadow: 0 0 0 4px rgba(183,75,53,0); } }
.hero h1 { position: relative; width: max-content; margin: 0 0 13px -6px; color: var(--forest); font: 900 clamp(72px, 9.6vw, 127px)/.75 var(--display); letter-spacing: -.055em; text-shadow: 4px 4px 0 var(--paper); transform: rotate(-2deg); }
.hero h1 > span { font-size: .88em; letter-spacing: -.04em; }
.hero h1 > b { color: var(--red); font-size: 1.14em; font-style: normal; margin-left: -5px; }
.hero h1 > em { position: absolute; top: -18px; right: -70px; font: normal 34px/1 var(--body); transform: rotate(7deg); filter: drop-shadow(2px 2px 0 var(--paper)); }
.hero__lead { margin: 28px 0 14px; font: 500 clamp(21px, 2.3vw, 28px)/1.2 var(--serif); letter-spacing: -.045em; }
.hero__lead strong { color: var(--red); font-weight: 700; }
.hero__support { color: var(--ink-soft); font-size: 12px; line-height: 1.8; font-weight: 600; }
.hero__actions { display: flex; align-items: center; gap: 24px; margin: 25px 0 30px; }
.button { display: inline-flex; min-height: 52px; align-items: center; justify-content: space-between; gap: 20px; padding: 0 20px; border: 2px solid transparent; cursor: pointer; text-decoration: none; font-family: var(--display); font-size: 16px; letter-spacing: .07em; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.button:hover { transform: translate(-2px,-2px); }
.button--yellow { background: var(--sun); color: var(--forest-deep); box-shadow: 4px 4px 0 var(--forest); }
.button--yellow:hover { box-shadow: 6px 6px 0 var(--forest); }
.button--yellow span { color: var(--red); font-size: 21px; }
.button--green { background: var(--forest); color: var(--cream); box-shadow: 4px 4px 0 var(--sun); }
.button--green:hover { box-shadow: 6px 6px 0 var(--sun); }
.button--green span:last-child { color: var(--sun); font-size: 20px; }
.text-link { display: inline-flex; align-items: center; gap: 8px; padding: 4px 0; border: 0; color: var(--forest); background: transparent; font-size: 9px; font-weight: 900; letter-spacing: .09em; text-decoration: none; cursor: pointer; }
.text-link span { color: var(--red); font-size: 15px; transition: transform .18s ease; }
.text-link:hover span { transform: translateY(3px); }
.hero__note { display: flex; align-items: center; gap: 9px; width: fit-content; color: var(--red); font: 14px var(--display); letter-spacing: .08em; transform: rotate(-2deg); }
.hero__note-pin { color: var(--forest); font-size: 21px; }
.hero__note small { align-self: flex-end; padding-bottom: 2px; font: 700 8px var(--body); color: var(--ink-soft); letter-spacing: .09em; }
.note-dash { width: 29px; border-top: 1px dashed var(--red); }
.hero__scene-wrap { position: relative; padding: 15px 4px; }
.campus-scene { position: relative; width: 100%; aspect-ratio: 760/570; overflow: visible; border: 5px solid var(--forest); background: #9fcbb9; box-shadow: 12px 12px 0 var(--sun), 16px 17px 0 var(--forest); transform: rotate(1.3deg); }
.campus-scene::before { content: ''; position: absolute; inset: -10px; z-index: -1; border: 1px solid rgba(23,75,59,.24); transform: rotate(-2deg); }
.campus-scene > svg { display: block; width: 100%; height: 100%; }
.palm { transform-box: fill-box; transform-origin: bottom center; animation: palm-sway 4.8s ease-in-out infinite alternate; }
.palm--right { animation-delay: -2s; }
@keyframes palm-sway { from { transform: rotate(-1deg); } to { transform: rotate(1.6deg); } }
.scene-label { position: absolute; z-index: 2; display: flex; align-items: center; gap: 7px; padding: 7px 9px; background: var(--paper); color: var(--forest); font-size: 8px; font-weight: 900; letter-spacing: .1em; box-shadow: 3px 3px 0 rgba(16,56,46,.15); }
.scene-label span { color: var(--red); font-size: 13px; }
.scene-label--top { top: -11px; left: 17px; transform: rotate(-4deg); }
.scene-label--bottom { right: 1px; bottom: -13px; transform: rotate(3deg); }
.bell-button { position: absolute; z-index: 3; top: 18%; left: 42%; width: 48px; height: 52px; padding: 0; border: 0; background: transparent; cursor: pointer; filter: drop-shadow(2px 3px 0 rgba(19,49,40,.2)); transition: transform .2s; }
.bell-button svg { display: block; width: 100%; height: 100%; }
.bell-button:hover { transform: rotate(-10deg) scale(1.07); }
.bell-button.is-ringing { animation: bell-ring .55s ease-in-out 3; }
.bell-spark { position: absolute; top: -10px; right: -11px; color: var(--red); font-size: 18px; opacity: 0; transform: scale(.2) rotate(-20deg); transition: .2s; }
.bell-button.is-ringing .bell-spark { opacity: 1; transform: scale(1) rotate(15deg); }
@keyframes bell-ring { 0%,100% { rotate: 0; } 20% { rotate: 15deg; } 40% { rotate: -13deg; } 60% { rotate: 9deg; } 80% { rotate: -5deg; } }
.scene-sticker { position: absolute; display: grid; place-items: center; width: 77px; height: 77px; border-radius: 50%; border: 1px solid var(--forest); background: var(--sun); color: var(--forest); font: 700 8px/1.2 var(--body); text-align: center; letter-spacing: .08em; box-shadow: 3px 4px 0 var(--forest); }
.scene-sticker b { font: 17px/.9 var(--display); letter-spacing: 0; }
.scene-sticker--assembly { top: 15%; right: -5.5%; transform: rotate(9deg); }
.scene-sticker--prep { bottom: 12%; left: -6%; width: 66px; height: 66px; background: var(--paper); transform: rotate(-8deg); }
.scene-sticker--prep b { font-size: 15px; }
.scene-flag { position: absolute; top: 34%; left: 21%; color: var(--red); font-size: 19px; animation: flag-twinkle 3s ease-in-out infinite; }
@keyframes flag-twinkle { 50% { transform: scale(.72) rotate(30deg); opacity: .56; } }
.hero__bottom { display: flex; align-items: center; gap: 15px; margin-top: 37px; color: var(--ink-soft); font-size: 8px; font-weight: 900; letter-spacing: .14em; }
.hero__bottom-line { width: 100%; height: 1px; background: rgba(23,75,59,.27); }
.hero__bottom > span:last-child { color: var(--red); font-size: 13px; }

.memory { overflow: hidden; background: var(--paper); border-block: 1px solid rgba(23,75,59,.13); }
.memory::before { content: ''; position: absolute; top: -84px; right: -42px; width: 265px; height: 265px; border-radius: 50%; border: 1px solid rgba(23,75,59,.14); box-shadow: 0 0 0 20px rgba(23,75,59,.018),0 0 0 42px rgba(23,75,59,.018); }
.memory__layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: 68px; align-items: center; }
.memory__intro { position: relative; z-index: 1; }
.memory h2, .section-heading h2, .culture__heading h2, .discovery h2, .progress h2, .join h2 { margin: 0; font: 400 clamp(48px, 6vw, 73px)/.91 var(--display); letter-spacing: -.025em; color: var(--forest); }
.memory h2 span, .section-heading h2 span, .culture__heading h2 span, .discovery h2 span { color: var(--red); }
.memory__intro > p:not(.eyebrow) { max-width: 400px; margin: 24px 0 0; color: var(--ink-soft); font: 17px/1.65 var(--serif); }
.memory__intro .memory__punch { color: var(--forest); font: 700 23px/1.3 var(--serif); }
.hand-note { display: inline-block; margin-top: 24px; color: var(--red); font: italic 14px var(--serif); transform: rotate(-5deg); }
.memory__wall { min-height: 466px; position: relative; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); grid-template-rows: 150px 150px 125px; gap: 10px; padding: 38px 19px 19px; background: #e5d8b8; border: 1px solid #c3b28e; box-shadow: var(--shadow); transform: rotate(.7deg); }
.memory__wall::before { content: ''; position: absolute; inset: 0; opacity: .22; background-image: radial-gradient(#795f37 .5px, transparent .5px); background-size: 5px 5px; pointer-events: none; }
.wall-tape { position: absolute; z-index: 1; top: -11px; left: calc(50% - 52px); width: 104px; height: 28px; background: rgba(183,75,53,.74); transform: rotate(-2deg); clip-path: polygon(0 0,100% 0,95% 100%,5% 91%); }
.memory-note { position: relative; min-width: 0; border: 1px solid rgba(53,60,39,.14); padding: 15px 12px; text-align: left; color: var(--forest); background: #fff6d7; box-shadow: 2px 4px 7px rgba(63,45,20,.11); cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.memory-note:hover, .memory-note[aria-pressed="true"] { z-index: 2; transform: translateY(-5px) rotate(-1deg) scale(1.025); box-shadow: 4px 8px 10px rgba(63,45,20,.17); }
.memory-note--one { background: #fff0cf; transform: rotate(-2deg); }
.memory-note--two { background: #d8e9db; transform: rotate(1.5deg); }
.memory-note--three { background: #f3d5b8; transform: rotate(-1deg); }
.memory-note--four { background: #fff3cf; transform: rotate(1deg); }
.memory-note--five { background: #d8e4ce; transform: rotate(-1.5deg); }
.memory-note--six { background: #eee0c4; transform: rotate(1.3deg); }
.memory-note__tag { display: block; margin: 5px 0 13px; font-size: 8px; font-weight: 900; letter-spacing: .1em; color: var(--red); }
.memory-note strong { display: block; max-width: 150px; font: 700 15px/1.2 var(--serif); }
.note-icon { position: absolute; top: 8px; right: 9px; font-size: 15px; color: var(--forest); }
.memory-note__doodle { position: absolute; right: 8px; bottom: 8px; color: var(--red); font: italic 10px var(--serif); }
.memory__quote { grid-column: 1 / -1; align-self: center; display: grid; grid-template-columns: 24px 1fr; align-items: center; gap: 7px; min-height: 70px; padding: 8px 15px; background: var(--forest); color: var(--paper); box-shadow: 3px 3px 0 var(--red); }
.memory__quote > span { align-self: start; color: var(--sun); font-size: 20px; }
.memory__quote p { margin: 0; font: italic 15px/1.3 var(--serif); }
.quote-caption { grid-column: 2; margin-top: -5px; color: #bdd3c1; font-size: 7px; font-weight: 900; letter-spacing: .15em; }
.wall-stamp { position: absolute; right: -18px; bottom: -20px; display: grid; place-content: center; width: 74px; height: 74px; border: 2px solid var(--red); border-radius: 50%; color: var(--red); font: 14px/.92 var(--display); text-align: center; letter-spacing: .05em; transform: rotate(13deg); background: rgba(255,249,233,.65); }

.world { color: var(--cream); background: var(--forest); overflow: hidden; }
.world::before { content: ''; position: absolute; right: -210px; top: -190px; width: 540px; height: 540px; border: 1px solid rgba(255,249,233,.1); border-radius: 50%; box-shadow: 0 0 0 54px rgba(255,249,233,.025),0 0 0 106px rgba(255,249,233,.025); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 44px; }
.section-heading h2 { color: var(--forest); }
.section-heading--light h2 { color: var(--cream); }
.section-heading--light h2 span { color: var(--sun); }
.section-heading > p { max-width: 275px; margin: 0 0 4px; color: var(--ink-soft); font: 16px/1.6 var(--serif); }
.section-heading--light > p { color: #c4d5c8; }
.world__board { position: relative; padding: 17px; color: var(--forest); background: var(--paper); box-shadow: 13px 14px 0 rgba(0,0,0,.15); transform: rotate(-.35deg); }
.world__board::before { content: ''; position: absolute; inset: 8px; border: 1px dashed rgba(23,75,59,.28); pointer-events: none; }
.world__board-top, .world__board-foot { position: relative; display: flex; justify-content: space-between; gap: 10px; padding: 10px 11px; color: var(--ink-soft); font-size: 8px; font-weight: 900; letter-spacing: .13em; }
.world__board-top { border-bottom: 1px solid var(--line); }
.world__board-top span:last-of-type { color: var(--red); }
.board-corner { position: absolute; right: 50%; color: var(--red); font-size: 17px; }
.mechanics-grid { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 11px; padding: 18px 2px; }
.mechanic { position: relative; min-height: 160px; display: grid; grid-template-columns: 1fr auto; grid-template-rows: 27px 40px auto; gap: 0 10px; padding: 18px 18px 16px; overflow: hidden; background: #eee5cf; border: 1px solid rgba(23,75,59,.16); transition: transform .18s ease, box-shadow .18s ease; }
.mechanic:hover { z-index: 1; transform: translateY(-4px) rotate(-.7deg); box-shadow: 0 7px 0 rgba(23,75,59,.18); }
.mechanic--wide { grid-column: span 2; grid-template-columns: 40px 51px 1fr 20px; grid-template-rows: 1fr; align-items: center; min-height: 123px; }
.mechanic--red { background: #eed2bc; }
.mechanic--yellow { background: #f1e2b6; }
.mechanic--green { background: #ceddc9; }
.mechanic__no { grid-column: 1; grid-row: 1; color: var(--red); font: 14px var(--display); }
.mechanic--wide .mechanic__no { align-self: start; }
.mechanic__icon { grid-column: 2; grid-row: 1 / 3; display: grid; place-items: center; justify-self: end; width: 47px; height: 47px; border: 1px solid rgba(23,75,59,.29); border-radius: 50%; color: var(--forest); font: 23px/1 var(--serif); }
.mechanic--wide .mechanic__icon { grid-column: 2; grid-row: 1; justify-self: center; }
.mechanic__icon--house,.mechanic__icon--trouble { color: var(--red); }
.mechanic__icon--sports { font-size: 22px; }
.mechanic__icon--map { font-size: 29px; }
.mechanic h3 { grid-column: 1 / -1; grid-row: 2; align-self: end; margin: 0 0 7px; font: 19px/1 var(--display); letter-spacing: .03em; }
.mechanic--wide h3, .mechanic--wide p { grid-column: 3; }
.mechanic p { grid-column: 1 / -1; grid-row: 3; align-self: start; max-width: 250px; margin: 0; color: var(--ink-soft); font: 12px/1.45 var(--serif); }
.mechanic--wide p { grid-row: 1; margin-top: 27px; }
.mechanic__arrow { position: absolute; right: 15px; bottom: 12px; color: var(--red); font-size: 17px; }
.mechanic--wide .mechanic__arrow { align-self: end; grid-column: 4; grid-row: 1; position: static; justify-self: end; }
.world__board-foot { padding-top: 12px; border-top: 1px solid var(--line); }
.world__board-foot span:nth-child(2) { color: var(--forest); }
.world__board-foot span:last-child { color: var(--red); }

.notquiz { color: var(--cream); background: var(--red); overflow: hidden; }
.notquiz::after { content: 'NOPE'; position: absolute; right: -45px; bottom: -92px; color: rgba(89,34,29,.1); font: 220px/.8 var(--display); transform: rotate(-8deg); pointer-events: none; }
.notquiz__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
.notquiz__copy h2 { margin: 0; color: var(--paper); font: 400 clamp(46px,6vw,71px)/.95 var(--display); letter-spacing: -.03em; }
.notquiz__big { margin: 21px 0 18px; color: var(--sun); font: 700 24px/1.2 var(--serif); }
.notquiz__big em { font-weight: 400; }
.notquiz__copy > p:last-child { max-width: 415px; margin: 0; color: #f8e6d1; font: 15px/1.65 var(--serif); }
.subject-book { position: relative; padding: 21px; background: #f0e5cc; color: var(--forest); box-shadow: 12px 13px 0 rgba(93,33,28,.28); transform: rotate(1deg); }
.subject-book::before { content: ''; position: absolute; top: 0; left: 0; width: 13px; height: 100%; background: repeating-linear-gradient(to bottom, var(--forest) 0 10px, transparent 10px 20px); opacity: .85; }
.subject-book__cover { min-height: 110px; position: relative; display: flex; align-items: center; padding: 18px 23px; margin: 0 0 9px 14px; overflow: hidden; color: var(--paper); background: var(--forest); }
.subject-book__cover::after { content: ''; position: absolute; top: -50px; right: -20px; width: 190px; height: 190px; border-radius: 50%; border: 1px solid rgba(255,255,255,.23); box-shadow: 0 0 0 17px rgba(255,255,255,.04),0 0 0 38px rgba(255,255,255,.04); }
.subject-book__label { font: 21px/.95 var(--display); letter-spacing: .03em; }
.subject-book__ring { position: absolute; z-index: 1; right: 40px; top: 25px; color: var(--sun); font-size: 47px; }
.subject-book__scribble { position: absolute; z-index: 1; right: 17px; bottom: 9px; color: var(--sun); font: italic 12px/1.05 var(--serif); transform: rotate(-8deg); }
.subject-row { min-height: 48px; display: grid; grid-template-columns: 30px 1.1fr 1.3fr 22px; gap: 8px; align-items: center; margin-left: 14px; padding: 0 9px; border-bottom: 1px solid rgba(23,75,59,.19); }
.subject-row > span:first-child { color: var(--red); font: 13px var(--display); }
.subject-row strong { font: 16px var(--display); letter-spacing: .03em; }
.subject-row > span:nth-child(3) { color: var(--ink-soft); font: italic 12px var(--serif); }
.subject-row i { color: var(--red); font-style: normal; font-size: 17px; text-align: right; }
.subject-book__footer { display: flex; justify-content: space-between; margin: 12px 0 0 14px; color: var(--red); font-size: 8px; font-weight: 900; letter-spacing: .11em; }

.culture { overflow: hidden; background: var(--cream); }
.culture__heading { position: relative; max-width: 590px; margin-bottom: 46px; }
.culture__heading > p:last-child { max-width: 420px; margin: 19px 0 0; color: var(--ink-soft); font: 16px/1.6 var(--serif); }
.culture-board { display: grid; grid-template-columns: 1.04fr .96fr; min-height: 420px; border: 1px solid var(--forest); background: #ded1af; box-shadow: var(--shadow); transform: rotate(-.25deg); }
.culture-board__scene { min-height: 420px; position: relative; overflow: hidden; background: #9fcbb9; border-right: 1px solid var(--forest); }
.culture-board__scene::before { content: ''; position: absolute; inset: 0; opacity: .22; background-image: radial-gradient(#ffffff .5px, transparent .5px); background-size: 7px 7px; }
.culture-sun { position: absolute; top: 37px; right: 53px; width: 77px; height: 77px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 0 10px rgba(244,201,88,.19); }
.culture-block { position: absolute; z-index: 1; top: 94px; height: 160px; background: #f0e2c3; border: 3px solid var(--forest); border-bottom-width: 5px; }
.culture-block::before { content: ''; position: absolute; top: -31px; left: -9px; right: -9px; height: 29px; background: var(--red); border: 3px solid var(--forest); clip-path: polygon(0 100%,10% 0,90% 0,100% 100%); }
.culture-block::after { content: ''; position: absolute; inset: 39px 12px 14px; background: repeating-linear-gradient(to right, transparent 0 37px, #34644e 37px 40px),linear-gradient(to bottom, #9fcbb9 0 100%); border: 2px solid var(--forest); }
.culture-block span, .culture-block b { position: absolute; z-index: 2; left: 10px; color: var(--forest); font: 700 7px var(--body); letter-spacing: .12em; }
.culture-block span { top: 8px; }
.culture-block b { top: 20px; font: 16px var(--display); letter-spacing: .04em; }
.culture-block--left { left: 38px; width: 44%; }
.culture-block--right { right: 27px; width: 39%; top: 119px; height: 135px; background: #d7c7a4; }
.culture-ground { position: absolute; right: -10%; bottom: -14%; left: -10%; height: 45%; background: #709965; border-radius: 48% 48% 0 0; }
.culture-ground::before { content: ''; position: absolute; top: 18px; left: 15%; right: 15%; bottom: 0; background-image: radial-gradient(#225b42 .8px, transparent .8px); background-size: 14px 14px; opacity: .24; }
.culture-path { position: absolute; z-index: 1; left: 43%; bottom: -40px; width: 120px; height: 210px; transform: perspective(60px) rotateX(14deg) rotate(12deg); background: #d7b883; clip-path: polygon(38% 0,62% 0,100% 100%,0 100%); }
.culture-flag { position: absolute; z-index: 3; bottom: 137px; left: 22px; display: flex; width: 51px; height: 31px; border: 1px solid var(--forest); transform: rotate(-4deg); }
.culture-flag i { flex: 1; background: #237446; }
.culture-flag i:nth-child(2) { background: #f5e9d0; }
.culture-student { position: absolute; z-index: 3; bottom: 68px; width: 46px; height: 119px; }
.culture-student b { position: absolute; top: 0; left: 13px; width: 22px; height: 24px; border-radius: 50%; background: #724834; box-shadow: 0 -6px 0 -2px #302b24; }
.culture-student i { position: absolute; top: 23px; left: 7px; width: 36px; height: 56px; background: #f5ebd5; border: 2px solid var(--forest); clip-path: polygon(16% 0,84% 0,100% 100%,0 100%); }
.culture-student em { position: absolute; top: 75px; left: 10px; width: 31px; height: 34px; border-top: 3px solid #332f2a; background: linear-gradient(80deg, transparent 0 35%, #453932 36% 54%, transparent 55%),linear-gradient(100deg, transparent 0 44%, #453932 45% 65%, transparent 66%); }
.culture-student--a { left: 30%; transform: scale(.8); }
.culture-student--b { left: 57%; bottom: 76px; transform: scale(1.12); }
.culture-student--b i { background: #eee1c3; }
.culture-student--c { right: 9%; bottom: 72px; transform: scale(.92); }
.culture-student--c i { background: #f7eee0; }
.culture-lunchbox { position: absolute; z-index: 4; bottom: 40px; left: 11%; width: 79px; padding: 7px 5px; border: 2px solid var(--forest); background: var(--red); color: var(--paper); font: 12px var(--display); text-align: center; transform: rotate(-7deg); box-shadow: 3px 3px 0 var(--forest); }
.culture-lunchbox i { position: absolute; top: -11px; right: -9px; color: var(--sun); font-style: normal; font-size: 20px; }
.culture-caption { position: absolute; z-index: 5; color: var(--forest); font: 16px/.95 var(--display); letter-spacing: .02em; }
.culture-caption--left { bottom: 15px; left: 15px; transform: rotate(-4deg); }
.culture-caption--right { top: 27px; left: 15px; color: var(--red); font: italic 13px/1 var(--serif); transform: rotate(-5deg); }
.culture-board__notes { position: relative; display: grid; grid-template-columns: 1fr 1fr; align-content: center; gap: 18px; padding: 30px; background: #e8ddc3; }
.culture-board__notes::before { content: ''; position: absolute; inset: 0; opacity: .24; background-image: radial-gradient(#6c5b3d .5px, transparent .5px); background-size: 6px 6px; }
.culture-note { position: relative; min-height: 123px; display: flex; flex-direction: column; justify-content: center; padding: 14px; background: #fff2d4; box-shadow: 3px 4px 0 rgba(70,49,22,.14); transform: rotate(-1deg); }
.culture-note:nth-child(even) { transform: rotate(1.2deg); }
.culture-note--a { background: #f5e5c7; }
.culture-note--b { background: #d8e6d6; }
.culture-note--c { background: #f4d5b4; }
.culture-note--d { background: #fff2d4; }
.culture-note > span { margin-bottom: 11px; color: var(--red); font-size: 8px; font-weight: 900; letter-spacing: .11em; }
.culture-note strong { font: 700 15px/1.15 var(--serif); }
.culture-note small { margin-top: 9px; color: var(--ink-soft); font: 10px/1.4 var(--body); }
.culture-board__marginalia { position: absolute; right: 26px; bottom: 5px; margin: 0; color: var(--red); font: italic 14px var(--serif); transform: rotate(-3deg); }
.culture-board__marginalia span { color: var(--forest); }
.culture-ribbon { display: flex; justify-content: space-between; gap: 14px; padding: 15px 0 0; overflow: hidden; color: var(--forest); font: 11px var(--display); letter-spacing: .06em; white-space: nowrap; }
.culture-ribbon span:nth-child(odd) { color: var(--red); }

.discovery { overflow: hidden; background: #e6dbc0; }
.discovery::before { content: '?'; position: absolute; top: -100px; left: -45px; color: rgba(23,75,59,.055); font: 410px/.9 var(--display); transform: rotate(-13deg); }
.discovery__grid { position: relative; display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 76px; }
.discovery h2 { font-size: clamp(48px,5.4vw,66px); }
.discovery__heading > p:not(.eyebrow) { max-width: 340px; margin: 22px 0; color: var(--ink-soft); font: 16px/1.6 var(--serif); }
.discovery__controls { display: flex; align-items: center; gap: 14px; margin-top: 27px; color: var(--ink-soft); font-size: 9px; font-weight: 900; letter-spacing: .1em; }
.round-control { width: 35px; height: 35px; border: 1px solid var(--forest); border-radius: 50%; color: var(--forest); background: transparent; cursor: pointer; font-size: 16px; transition: color .18s, background .18s, transform .18s; }
.round-control:hover { color: var(--paper); background: var(--forest); transform: scale(1.05); }
.discovery__stack { min-height: 385px; position: relative; display: grid; place-items: center; }
.discovery-card { position: relative; width: min(100%,530px); min-height: 330px; display: flex; flex-direction: column; padding: 29px 33px 17px; background: #fff9e9; border: 1px solid #c5b793; box-shadow: 8px 9px 0 var(--forest); transform: rotate(2deg); transition: transform .25s ease; }
.discovery-card.is-shuffling { transform: rotate(-3deg) translateY(-5px); }
.discovery-card--back { position: absolute; width: min(95%,530px); min-height: 300px; background: #c9d8c1; transform: rotate(-5deg) translate(-6px,4px); box-shadow: 3px 5px 0 var(--red); }
.discovery-card--back > span:first-child { color: var(--forest); font: 16px var(--display); letter-spacing: .07em; }
.discovery-card--back p { margin: 54px 0 0; color: var(--forest); font: 29px/1.15 var(--serif); }
.discovery-card__top { display: flex; justify-content: space-between; gap: 9px; padding-bottom: 10px; border-bottom: 1px solid rgba(23,75,59,.22); color: var(--red); font: 17px var(--display); letter-spacing: .07em; }
.discovery-card__top b { font: 800 8px var(--body); letter-spacing: .1em; color: var(--ink-soft); }
.discovery-card__top i { font-style: normal; color: var(--red); }
.discovery-card__seal { position: absolute; top: 66px; right: 25px; display: grid; place-items: center; width: 53px; height: 53px; border: 1px solid var(--red); border-radius: 50%; color: var(--red); font: 27px var(--display); transform: rotate(12deg); }
.discovery-card > p { max-width: 370px; min-height: 98px; margin: 35px 0 18px; color: var(--forest); font: 28px/1.18 var(--serif); }
.discovery-card__reveal { min-height: 49px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 7px 0; border-top: 1px dashed rgba(23,75,59,.35); border-bottom: 1px dashed rgba(23,75,59,.35); }
.discovery-card__answer { color: var(--forest); font: italic 13px/1.35 var(--serif); }
.discovery-reveal { flex: 0 0 auto; padding: 5px 0; border: 0; background: transparent; color: var(--red); cursor: pointer; font-size: 8px; font-weight: 900; letter-spacing: .08em; }
.discovery-reveal span { margin-left: 4px; font-size: 14px; }
.discovery-card__bottom { display: flex; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 13px; color: var(--ink-soft); font-size: 7px; font-weight: 900; letter-spacing: .1em; }
.discovery__scribble { position: absolute; top: 13px; right: 2px; z-index: 3; color: var(--red); font: italic 15px/.94 var(--serif); transform: rotate(9deg); }

.day { overflow: hidden; background: var(--paper); }
.day::after { content: ''; position: absolute; right: -162px; bottom: -170px; width: 480px; height: 480px; border: 1px solid rgba(23,75,59,.1); border-radius: 50%; box-shadow: 0 0 0 38px rgba(23,75,59,.025),0 0 0 78px rgba(23,75,59,.025); }
.day .section-heading { margin-bottom: 22px; }
.day-clock { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; color: var(--red); font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.day-clock__label { padding: 7px 9px; background: var(--forest); color: var(--cream); }
.day-clock__hands { color: var(--forest); font-size: 18px; }
.timeline { position: relative; display: grid; grid-template-columns: repeat(9, minmax(100px,1fr)); gap: 0; padding: 0 0 13px; margin: 0; overflow-x: auto; scrollbar-color: var(--red) #e9ddc0; scrollbar-width: thin; list-style: none; }
.timeline::before { content: ''; position: absolute; top: 28px; left: 22px; right: 22px; height: 2px; background: repeating-linear-gradient(to right, var(--forest) 0 7px, transparent 7px 13px); opacity: .48; }
.timeline li { position: relative; min-width: 100px; }
.timeline-stop { width: 100%; min-height: 154px; display: flex; flex-direction: column; align-items: flex-start; padding: 0 9px 12px; border: 0; background: transparent; color: var(--forest); text-align: left; cursor: pointer; }
.timeline-stop__dot { z-index: 1; width: 16px; height: 16px; margin: 21px 0 18px 2px; border: 2px solid var(--forest); border-radius: 50%; background: var(--paper); box-shadow: 0 0 0 4px var(--paper); transition: transform .18s, background .18s; }
.timeline-stop.is-active .timeline-stop__dot, .timeline-stop:hover .timeline-stop__dot { transform: scale(1.22); background: var(--sun); }
.timeline-stop time { margin-bottom: 8px; color: var(--red); font: 15px var(--display); letter-spacing: .02em; }
.timeline-stop strong { margin-bottom: 5px; font: 15px var(--display); letter-spacing: .02em; }
.timeline-stop small { max-width: 115px; color: var(--ink-soft); font: 11px/1.4 var(--serif); }
.timeline-stop:hover strong, .timeline-stop.is-active strong { text-decoration: underline; text-decoration-color: var(--sun); text-decoration-thickness: 3px; text-underline-offset: 3px; }
.timeline-event { position: relative; z-index: 1; display: grid; grid-template-columns: 21px 1fr auto; align-items: center; gap: 10px; max-width: 780px; min-height: 58px; margin: 6px auto 0; padding: 12px 17px; color: var(--paper); background: var(--forest); box-shadow: 4px 4px 0 var(--sun); }
.timeline-event > span:first-child { color: var(--sun); }
.timeline-event p { margin: 0; font: italic 15px/1.35 var(--serif); }
.timeline-event__caption { color: #b7d0bd; font-size: 7px; font-weight: 900; letter-spacing: .1em; }
.day__punch { position: relative; z-index: 1; margin: 49px 0 0; text-align: center; color: var(--forest); font: 23px/1.35 var(--serif); }
.day__punch span { color: var(--red); font: 39px/.97 var(--display); }

.progress { color: var(--cream); background: var(--forest-dark); overflow: hidden; }
.progress::before { content: ''; position: absolute; inset: 0; opacity: .12; background-image: linear-gradient(45deg, transparent 49.5%, #e7dec8 50%, transparent 50.5%); background-size: 26px 26px; pointer-events: none; }
.progress__grid { position: relative; display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 80px; }
.progress h2 { color: var(--cream); font-size: clamp(51px,6.4vw,76px); }
.progress__grid > div:first-child > p:not(.eyebrow) { max-width: 335px; color: #c4d5c8; font: 16px/1.55 var(--serif); }
.progress__class { display: inline-flex; align-items: center; gap: 15px; margin-top: 24px; padding: 10px 12px; border: 1px solid rgba(255,249,233,.3); color: #d1dfd1; font-size: 8px; font-weight: 900; letter-spacing: .12em; }
.progress__class b { color: var(--sun); font: 19px var(--display); letter-spacing: .02em; }
.progress__class span { color: var(--sun); font-size: 13px; }
.student-card { position: relative; display: grid; grid-template-columns: 123px 1fr; grid-template-rows: 35px 100px 42px 40px 1fr 40px; column-gap: 18px; padding: 20px 22px 14px; color: var(--forest); background: #eee2c4; border: 1px solid #c0ad83; box-shadow: 9px 11px 0 rgba(0,0,0,.23); transform: rotate(-1deg); }
.student-card::after { content: ''; position: absolute; inset: 8px; border: 1px dashed rgba(23,75,59,.24); pointer-events: none; }
.student-card__top { grid-column: 1 / -1; display: flex; justify-content: space-between; padding: 0 2px 10px; border-bottom: 1px solid rgba(23,75,59,.25); color: var(--ink-soft); font-size: 8px; font-weight: 900; letter-spacing: .12em; }
.student-card__top span:last-child { color: var(--red); }
.student-card__portrait { position: relative; grid-column: 1; grid-row: 2 / 4; align-self: center; width: 113px; height: 122px; overflow: hidden; border: 2px solid var(--forest); background: #aac8b6; }
.portrait-face { position: absolute; z-index: 2; top: 24px; left: 39px; width: 37px; height: 44px; border-radius: 48% 48% 45% 45%; background: #855539; }
.portrait-hair { position: absolute; z-index: 3; top: 19px; left: 37px; width: 40px; height: 20px; border-radius: 50% 50% 8px 8px; background: #302e27; }
.portrait-body { position: absolute; bottom: -21px; left: 19px; width: 77px; height: 79px; background: #eee6d3; border: 2px solid var(--forest); border-radius: 40% 40% 0 0; }
.student-card__portrait > span { position: absolute; top: 6px; left: 8px; z-index: 4; color: var(--red); font-size: 13px; }
.student-card__name { grid-column: 2; grid-row: 2; align-self: end; padding-bottom: 11px; border-bottom: 1px solid rgba(23,75,59,.25); font: 22px var(--display); letter-spacing: .04em; }
.student-card__name span { float: right; color: var(--red); }
.grade-path { grid-column: 2; grid-row: 3; display: flex; align-items: center; justify-content: space-between; gap: 4px; }
.grade-path__item { display: grid; place-items: center; width: 37px; height: 22px; border: 1px solid rgba(23,75,59,.35); color: var(--ink-soft); font: 10px var(--display); }
.grade-path__item.is-now { color: var(--forest); background: var(--sun); border-color: var(--forest); }
.grade-path i { height: 1px; min-width: 4px; flex: 1; background: var(--red); }
.student-card__stats { grid-column: 1 / -1; grid-row: 4 / 6; display: grid; grid-template-columns: 1fr 1fr; gap: 11px 25px; align-content: center; padding: 14px 0; border-top: 1px solid rgba(23,75,59,.2); }
.student-card__stats > div { display: grid; grid-template-columns: 85px 1fr; align-items: center; gap: 8px; color: var(--ink-soft); font-size: 8px; font-weight: 900; letter-spacing: .08em; }
.student-card__stats i { height: 7px; background: rgba(23,75,59,.13); }
.student-card__stats b { display: block; width: var(--stat); height: 100%; background: var(--red); }
.student-card__stats > div:nth-child(2) b { background: #d59e38; }
.student-card__stats > div:nth-child(4) b { background: var(--forest); }
.student-card__bottom { grid-column: 1 / -1; grid-row: 6; display: flex; align-items: center; justify-content: space-between; gap: 9px; border-top: 1px solid rgba(23,75,59,.2); color: var(--ink-soft); font-size: 7px; font-weight: 900; letter-spacing: .07em; }
.student-card__bottom b { margin-left: 4px; color: var(--red); font: 13px var(--display); }
.card-clip { position: absolute; top: -16px; left: calc(50% - 22px); width: 44px; height: 25px; border: 4px solid #bdab87; border-bottom: 0; border-radius: 10px 10px 0 0; }

.join { overflow: hidden; background: #e5d9b9; }
.join__paper { position: absolute; inset: 0; opacity: .27; background-image: radial-gradient(#675639 .55px, transparent .55px); background-size: 6px 6px; pointer-events: none; }
.join__grid { position: relative; display: grid; grid-template-columns: .84fr 1.16fr; gap: 65px; align-items: center; }
.join h2 { font-size: clamp(57px,7vw,84px); }
.join h2 span { color: var(--red); }
.join__copy > p:not(.eyebrow) { max-width: 350px; margin: 21px 0; color: var(--ink-soft); font: 17px/1.55 var(--serif); }
.join__ticket { position: relative; display: flex; flex-direction: column; gap: 6px; width: fit-content; margin-top: 27px; padding: 17px 40px 17px 17px; color: var(--paper); background: var(--red); font: 14px var(--display); letter-spacing: .07em; transform: rotate(-3deg); box-shadow: 4px 4px 0 var(--forest); clip-path: polygon(0 0,100% 0,100% 81%,93% 88%,100% 95%,100% 100%,0 100%); }
.join__ticket span:nth-child(2) { color: var(--sun); }
.join__ticket i { position: absolute; right: 13px; bottom: 11px; font: 22px var(--body); }
.join__stamp { position: absolute; bottom: -5px; left: min(75%,350px); display: grid; place-content: center; width: 107px; height: 107px; border: 2px solid rgba(23,75,59,.45); border-radius: 50%; color: var(--red); font: 26px/.8 var(--display); text-align: center; transform: rotate(-14deg); opacity: .8; }
.join__stamp span { margin-top: 4px; font: 9px/.95 var(--body); font-weight: 900; letter-spacing: .15em; }
.join__form-wrap { position: relative; padding: 0 20px 20px; border: 1px solid #bbae8b; background: var(--paper); box-shadow: 8px 9px 0 rgba(23,75,59,.2); transform: rotate(.3deg); }
.form-tab { display: flex; justify-content: space-between; gap: 10px; margin: 0 -20px 23px; padding: 11px 19px; color: var(--paper); background: var(--forest); font-size: 8px; font-weight: 900; letter-spacing: .13em; }
.form-tab span:last-child { color: var(--sun); }
.signup-form { max-width: 580px; margin: 0 auto; }
.form-head { display: grid; grid-template-columns: 1fr auto; align-items: center; margin-bottom: 19px; }
.form-head h3 { margin: 0; color: var(--forest); font: 34px/.95 var(--display); letter-spacing: .02em; }
.form-head > span { color: var(--red); font-size: 25px; transform: rotate(-12deg); }
.form-head p { grid-column: 1 / -1; margin: 8px 0 0; color: var(--ink-soft); font: italic 13px var(--serif); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field { min-width: 0; display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.field label, .field legend { color: var(--ink); font-size: 10px; font-weight: 900; letter-spacing: .04em; }
.field legend > span { color: var(--ink-soft); font-size: 9px; font-weight: 600; letter-spacing: 0; }
.field input:not([type="radio"]) { width: 100%; height: 45px; padding: 0 12px; border: 1px solid #c8bc9d; border-radius: 0; color: var(--forest); background: #fffdf5; font-size: 12px; transition: border-color .18s, box-shadow .18s; }
.field input::placeholder { color: #8a8b7e; opacity: 1; font: italic 12px var(--serif); }
.field input:not([type="radio"]):focus { border-color: var(--forest); outline: 0; box-shadow: 0 0 0 3px rgba(23,75,59,.12); }
.field input[aria-invalid="true"] { border-color: #a6382d; box-shadow: 0 0 0 2px rgba(166,56,45,.11); }
.field--gender { padding: 0; border: 0; margin: 0 0 15px; }
.field--gender legend { margin-bottom: 8px; padding: 0; }
.radio-row { display: flex; flex-wrap: wrap; gap: 8px; }
.radio-row label { position: relative; display: inline-flex; cursor: pointer; }
.radio-row input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.radio-row label span { display: inline-grid; place-items: center; min-height: 35px; padding: 0 12px; border: 1px solid #c8bc9d; background: #fffdf5; color: var(--ink-soft); font-size: 10px; transition: border .15s,background .15s,color .15s; }
.radio-row input:checked + span { border-color: var(--forest); background: #dce7d7; color: var(--forest); box-shadow: inset 0 -2px 0 var(--forest); }
.radio-row input:focus-visible + span { outline: 3px solid var(--red); outline-offset: 2px; }
.field-error { min-height: 0; color: #a6382d; font-size: 10px; line-height: 1.3; }
.field-error:not(:empty) { min-height: 12px; }
.form-privacy { margin: 2px 0 13px; color: #657167; font: 11px/1.45 var(--serif); }
.form-submit { width: 100%; min-height: 51px; }
.form-submit:disabled { cursor: wait; opacity: .7; }
.form-status, .form-error { margin: 10px 0 0; color: var(--forest); font: italic 12px/1.4 var(--serif); }
.form-error { padding: 10px; border-left: 3px solid var(--red); background: #f5e1d3; color: #7b2d24; }
.form-error[hidden] { display: none; }
.signup-success { max-width: 580px; margin: 2px auto 0; padding: 13px 0 6px; text-align: center; }
.signup-success[hidden] { display: none; }
.success-stamp { width: 49px; height: 49px; display: grid; place-items: center; margin: 0 auto 16px; border: 2px solid var(--forest); border-radius: 50%; color: var(--forest); font-size: 25px; transform: rotate(9deg); }
.signup-success .eyebrow { justify-content: center; margin-bottom: 12px; font-size: 8px; }
.signup-success h3 { margin: 0; color: var(--forest); font: 40px/.91 var(--display); letter-spacing: .01em; }
.signup-success h3 span { font-family: var(--body); font-size: 23px; }
.signup-success > p:not(.eyebrow):not(.share-status) { margin: 13px 0 16px; color: var(--ink-soft); font: 14px/1.5 var(--serif); }
.signup-success #success-message { white-space: pre-line; }
.student-number { display: grid; grid-template-columns: 1fr auto; align-items: center; max-width: 288px; margin: 0 auto 17px; padding: 9px 12px; border: 1px dashed var(--forest); text-align: left; }
.student-number[hidden] { display: none; }
.student-number span { color: var(--red); font-size: 8px; font-weight: 900; letter-spacing: .1em; }
.student-number strong { grid-column: 1; margin-top: 3px; font: 25px var(--display); letter-spacing: .08em; }
.student-number small { grid-column: 2; grid-row: 1 / 3; color: var(--ink-soft); font-size: 7px; font-weight: 900; letter-spacing: .08em; }
.success-actions { display: flex; align-items: center; justify-content: center; gap: 21px; flex-wrap: wrap; }
.success-actions .button { font-size: 12px; min-height: 45px; }
.success-actions .text-link { font-size: 8px; }
.share-status { min-height: 16px; margin: 9px 0 0; color: var(--ink-soft); font: italic 11px var(--serif); }

.footer { color: var(--cream); background: var(--forest-deep); }
.footer__top { display: flex; justify-content: space-between; gap: 60px; padding: 57px 0 46px; }
.brand--footer .brand__stamp { background: var(--sun); color: var(--forest); border-color: var(--sun); box-shadow: 3px 3px 0 var(--red); }
.brand--footer .brand__stamp span { color: var(--red); }
.brand--footer .brand__name { color: var(--cream); }
.brand--footer .brand__name > span { color: var(--sun); }
.brand--footer .brand__name small { color: #d6e3d4; font-size: 10px; }
.footer__brand > p { margin: 17px 0 0; color: #c8d7ca; font: 15px/1.55 var(--serif); }
.footer__links { display: flex; gap: 90px; }
.footer__links > div { min-width: 130px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.footer__label { margin-bottom: 5px; color: #b3cbb8; font-size: 8px; font-weight: 900; letter-spacing: .14em; }
.footer__links a, .footer-disclosure summary { color: var(--cream); font-size: 12px; text-decoration: none; cursor: pointer; }
.footer__links a:hover, .footer-disclosure summary:hover { color: var(--sun); }
.footer-coming { color: #c0d0c3; font-size: 12px; }
.footer-disclosure p { max-width: 300px; color: #c0d0c3; font: 11px/1.6 var(--serif); }
.footer__bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 54px; border-top: 1px solid rgba(255,249,233,.2); color: #bdcfc0; font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.footer__bottom b { color: var(--sun); font-size: 12px; }
.footer__bottom a { color: var(--sun); text-decoration: none; }

@media (max-width: 1000px) {
  .hero__grid { grid-template-columns: .92fr 1.08fr; gap: 26px; }
  .hero h1 { font-size: clamp(78px,10vw,109px); }
  .hero__lead { font-size: 23px; }
  .section-pad { padding-block: 90px; }
  .memory__layout { gap: 39px; grid-template-columns: .72fr 1.28fr; }
  .memory__wall { gap: 8px; padding-inline: 13px; }
  .memory-note { padding: 12px 9px; }
  .memory-note strong { font-size: 13px; }
  .culture-board__notes { gap: 12px; padding: 23px; }
  .culture-note { min-height: 115px; padding: 11px; }
  .notquiz__grid, .progress__grid { gap: 48px; }
  .join__grid { gap: 40px; }
  .footer__links { gap: 56px; }
}

@media (max-width: 760px) {
  :root { scroll-padding-top: 70px; }
  .shell { width: min(100% - 38px, 560px); }
  .section-pad { padding-block: 76px; }
  .topline { height: 27px; font-size: 10px; }
  .topline__scroll { gap: 19px; }
  .nav { height: 66px; }
  .brand__stamp { width: 34px; height: 35px; font-size: 23px; }
  .brand__name { font-size: 16px; }
  .nav__toggle { display: grid; gap: 5px; width: 43px; height: 43px; place-content: center; cursor: pointer; }
  .nav__toggle span { display: block; width: 22px; height: 2px; background: var(--forest); transition: transform .18s; }
  .nav__toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .nav__toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .nav__links { position: absolute; top: 100%; left: 0; right: 0; display: none; align-items: stretch; flex-direction: column; gap: 0; padding: 6px 19px 17px; background: var(--cream); border-bottom: 1px solid rgba(23,75,59,.18); box-shadow: 0 7px 9px rgba(23,75,59,.08); }
  .nav__links.is-open { display: flex; }
  .nav__links a { padding: 15px 7px; border-bottom: 1px solid rgba(23,75,59,.11); }
  .nav__links .nav__join { margin-top: 11px; padding: 15px 16px; text-align: center; border-bottom: 0; }
  .hero { min-height: 0; padding: 46px 0 22px; }
  .hero__grid { grid-template-columns: 1fr; gap: 18px; }
  .hero__copy { padding: 4px 0 0; }
  .eyebrow { margin-bottom: 14px; font-size: 8px; }
  .hero h1 { margin-left: 0; font-size: clamp(82px,20vw,118px); }
  .hero h1 > em { top: -13px; right: -53px; font-size: 25px; }
  .hero__lead { margin-top: 22px; font-size: clamp(23px,6.3vw,28px); }
  .hero__support { font-size: 11px; }
  .hero__actions { gap: 19px; margin: 20px 0 19px; }
  .button--yellow { min-height: 49px; padding-inline: 15px; font-size: 15px; }
  .text-link { font-size: 8px; }
  .hero__note { font-size: 12px; }
  .hero__scene-wrap { margin: 12px 13px 9px 0; padding: 7px 2px; }
  .campus-scene { border-width: 3px; box-shadow: 8px 8px 0 var(--sun),11px 12px 0 var(--forest); }
  .bell-button { width: 33px; height: 38px; }
  .scene-label { font-size: 7px; }
  .scene-sticker { width: 60px; height: 60px; font-size: 7px; }
  .scene-sticker b { font-size: 14px; }
  .scene-sticker--assembly { right: -5%; }
  .scene-sticker--prep { left: -5%; width: 53px; height: 53px; }
  .scene-sticker--prep b { font-size: 12px; }
  .hero__bottom { gap: 8px; margin-top: 27px; font-size: 6px; letter-spacing: .1em; }
  .hero__bottom-line { min-width: 12px; }
  .memory__layout { grid-template-columns: 1fr; gap: 40px; }
  .memory h2, .section-heading h2, .culture__heading h2, .discovery h2 { font-size: clamp(53px,14vw,70px); }
  .memory__intro > p:not(.eyebrow) { margin-top: 17px; font-size: 16px; }
  .memory__intro .memory__punch { font-size: 21px; }
  .hand-note { position: absolute; right: 10px; bottom: 8px; margin: 0; }
  .memory__wall { min-height: 440px; grid-template-rows: 140px 140px 108px; padding: 34px 12px 13px; gap: 8px; }
  .memory-note { padding: 11px 8px; }
  .memory-note strong { font-size: clamp(11px,3vw,14px); }
  .memory-note__tag { font-size: 6px; letter-spacing: .07em; }
  .memory-note__doodle { font-size: 8px; }
  .memory__quote { min-height: 66px; padding-inline: 10px; }
  .memory__quote p { font-size: 13px; }
  .wall-stamp { right: -8px; bottom: -21px; width: 61px; height: 61px; font-size: 12px; }
  .section-heading { align-items: flex-start; flex-direction: column; gap: 17px; margin-bottom: 32px; }
  .section-heading > p { font-size: 14px; }
  .world__board { padding: 10px; }
  .world__board::before { inset: 5px; }
  .world__board-top, .world__board-foot { font-size: 6px; letter-spacing: .08em; }
  .mechanics-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 12px 1px; }
  .mechanic { min-height: 151px; padding: 13px 11px 12px; }
  .mechanic--wide { grid-column: span 2; grid-template-columns: 25px 40px 1fr 15px; min-height: 103px; }
  .mechanic__icon { width: 39px; height: 39px; font-size: 19px; }
  .mechanic--wide .mechanic__icon { width: 39px; height: 39px; }
  .mechanic h3 { font-size: 17px; }
  .mechanic p { font-size: 11px; }
  .mechanic--wide h3 { font-size: 16px; }
  .mechanic--wide p { margin-top: 24px; font-size: 10px; }
  .mechanic__arrow { right: 10px; bottom: 9px; font-size: 15px; }
  .world__board-foot span:nth-child(2) { flex: 1; text-align: center; }
  .notquiz__grid { grid-template-columns: 1fr; gap: 35px; }
  .notquiz__copy h2 { font-size: clamp(51px,13vw,67px); }
  .notquiz__big { margin-top: 16px; font-size: 21px; }
  .notquiz__copy > p:last-child { font-size: 14px; }
  .subject-book { padding: 15px; }
  .subject-book::before { width: 8px; }
  .subject-book__cover, .subject-row, .subject-book__footer { margin-left: 10px; }
  .subject-row { grid-template-columns: 23px 1fr 1.2fr 18px; gap: 4px; min-height: 45px; padding-inline: 4px; }
  .subject-row strong { font-size: 14px; }
  .subject-row > span:nth-child(3) { font-size: 10px; }
  .culture__heading { margin-bottom: 31px; }
  .culture__heading > p:last-child { font-size: 14px; }
  .culture-board { grid-template-columns: 1fr; }
  .culture-board__scene { min-height: 355px; border-right: 0; border-bottom: 1px solid var(--forest); }
  .culture-block { top: 82px; height: 136px; }
  .culture-block--left { left: 9%; width: 42%; }
  .culture-block--right { top: 104px; right: 7%; width: 38%; height: 114px; }
  .culture-ground { height: 43%; }
  .culture-student { bottom: 53px; transform: scale(.83); transform-origin: bottom; }
  .culture-student--a { left: 28%; }
  .culture-student--b { left: 55%; bottom: 54px; transform: scale(.98); }
  .culture-student--c { right: 6%; bottom: 52px; transform: scale(.82); }
  .culture-lunchbox { bottom: 28px; left: 8%; transform: scale(.88) rotate(-7deg); transform-origin: bottom left; }
  .culture-flag { bottom: 121px; left: 12px; transform: scale(.85) rotate(-4deg); transform-origin: bottom left; }
  .culture-caption--left { font-size: 13px; }
  .culture-caption--right { top: 20px; left: 12px; font-size: 12px; }
  .culture-sun { top: 27px; right: 30px; width: 59px; height: 59px; }
  .culture-board__notes { gap: 10px; padding: 19px 14px 38px; }
  .culture-note { min-height: 110px; padding: 10px; }
  .culture-note strong { font-size: 13px; }
  .culture-note small { font-size: 9px; }
  .culture-ribbon { width: calc(100vw - 38px); justify-content: flex-start; gap: 17px; padding-top: 13px; font-size: 10px; }
  .discovery__grid { grid-template-columns: 1fr; gap: 21px; }
  .discovery__heading > p:not(.eyebrow) { max-width: 400px; margin-block: 17px; font-size: 14px; }
  .discovery__controls { margin-top: 18px; }
  .discovery__stack { min-height: 340px; margin-inline: 4px 12px; }
  .discovery-card { min-height: 290px; padding: 23px 20px 15px; }
  .discovery-card--back { min-height: 262px; }
  .discovery-card--back p { margin-top: 48px; font-size: 24px; }
  .discovery-card > p { max-width: 82%; min-height: 86px; margin: 33px 0 12px; font-size: 24px; }
  .discovery-card__seal { top: 61px; right: 18px; width: 42px; height: 42px; font-size: 22px; }
  .discovery-card__top { font-size: 15px; }
  .discovery-card__top b { font-size: 7px; }
  .discovery-reveal { font-size: 7px; }
  .discovery-card__answer { font-size: 11px; }
  .discovery-card__bottom { font-size: 6px; }
  .discovery__scribble { right: -5px; font-size: 12px; }
  .day .section-heading { margin-bottom: 18px; }
  .day-clock { flex-wrap: wrap; font-size: 8px; }
  .timeline { grid-template-columns: repeat(9, 103px); margin-right: -19px; padding-right: 19px; }
  .timeline-stop { min-height: 145px; }
  .timeline-event { grid-template-columns: 18px 1fr; margin-top: 8px; }
  .timeline-event p { font-size: 13px; }
  .timeline-event__caption { grid-column: 2; }
  .day__punch { margin-top: 39px; font-size: 19px; }
  .day__punch span { font-size: 35px; }
  .progress__grid { grid-template-columns: 1fr; gap: 35px; }
  .progress h2 { font-size: clamp(55px,14vw,73px); }
  .progress__grid > div:first-child > p:not(.eyebrow) { font-size: 14px; }
  .student-card { grid-template-columns: 87px 1fr; grid-template-rows: 30px 85px 40px 1fr 37px; gap: 0 11px; padding: 16px 13px 11px; }
  .student-card__portrait { width: 82px; height: 99px; grid-row: 2 / 4; }
  .portrait-face { top: 22px; left: 27px; width: 31px; height: 37px; }
  .portrait-hair { top: 17px; left: 25px; width: 35px; height: 18px; }
  .portrait-body { left: 10px; width: 64px; height: 65px; }
  .student-card__name { font-size: 17px; }
  .grade-path { gap: 2px; }
  .grade-path__item { width: 30px; height: 20px; font-size: 8px; }
  .student-card__stats { grid-row: 4; gap: 9px 13px; padding: 14px 0; }
  .student-card__stats > div { grid-template-columns: 68px 1fr; gap: 5px; font-size: 7px; }
  .student-card__bottom { grid-row: 5; flex-wrap: wrap; justify-content: flex-start; column-gap: 14px; row-gap: 3px; padding: 7px 0; font-size: 6px; }
  .student-card__bottom b { font-size: 11px; }
  .join__grid { grid-template-columns: 1fr; gap: 39px; }
  .join h2 { font-size: clamp(61px,15vw,79px); }
  .join__copy > p:not(.eyebrow) { max-width: 310px; font-size: 15px; }
  .join__ticket { margin-top: 23px; font-size: 12px; }
  .join__stamp { left: auto; right: 9px; bottom: -2px; width: 82px; height: 82px; font-size: 21px; }
  .join__stamp span { font-size: 7px; }
  .join__form-wrap { padding: 0 14px 15px; }
  .form-tab { margin-inline: -14px; padding-inline: 13px; font-size: 7px; }
  .form-head h3 { font-size: 31px; }
  .form-row { gap: 9px; }
  .field input:not([type="radio"]) { height: 43px; padding-inline: 9px; font-size: 11px; }
  .field input::placeholder { font-size: 10px; }
  .radio-row { gap: 5px; }
  .radio-row label span { min-height: 33px; padding-inline: 8px; font-size: 9px; }
  .form-privacy { font-size: 10px; }
  .footer__top { flex-direction: column; gap: 34px; padding: 42px 0 32px; }
  .footer__links { gap: 30px; }
  .footer__links > div { min-width: 0; flex: 1; }
  .footer__bottom { flex-wrap: wrap; justify-content: space-between; padding-block: 13px; font-size: 7px; }
  .footer__bottom span:nth-child(2) { display: none; }
}

@media (max-width: 380px) {
  .shell { width: calc(100% - 30px); }
  .hero__actions { gap: 12px; }
  .button--yellow { padding-inline: 11px; font-size: 13px; }
  .text-link { font-size: 7px; }
  .memory__wall { grid-template-rows: 134px 134px 102px; padding-inline: 8px; gap: 6px; }
  .memory-note { padding-inline: 6px; }
  .memory-note__tag { font-size: 5px; }
  .memory-note strong { font-size: 10px; }
  .world__board-foot { flex-wrap: wrap; justify-content: center; }
  .world__board-foot span:first-child, .world__board-foot span:last-child { display: none; }
  .mechanic { padding-inline: 8px; }
  .mechanic--wide { grid-template-columns: 19px 34px 1fr 11px; }
  .mechanic__icon, .mechanic--wide .mechanic__icon { width: 33px; height: 33px; font-size: 16px; }
  .mechanic h3 { font-size: 15px; }
  .mechanic p { font-size: 10px; }
  .culture-board__notes { padding-inline: 10px; }
  .culture-note { padding: 8px; }
  .culture-note > span { font-size: 7px; }
  .culture-note strong { font-size: 12px; }
  .student-card__stats > div { grid-template-columns: 60px 1fr; font-size: 6px; }
  .student-card__bottom { column-gap: 9px; }
  .radio-row label span { padding-inline: 6px; font-size: 8px; }
  .form-head h3 { font-size: 28px; }
  .footer__links { gap: 18px; }
}

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

/* The pre-launch page is a single, viewport-sized screen. Older landing-page
   sections stay in the document so they can be brought back for launch. */
html {
  height: 100%;
  min-height: 100dvh;
  overflow: hidden;
  scroll-behavior: auto;
}

body {
  display: flex;
  flex-direction: column;
  width: 100vw;
  width: 100dvw;
  height: 100dvh;
  min-height: 100dvh;
  overflow: hidden;
}

#main {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

#main > section:not(.join) { display: none; }

.site-header { position: relative; width: 100%; flex: 0 0 auto; }
.nav { width: 100%; max-width: none; height: 70px; padding-inline: clamp(20px, 5vw, 88px); }
.nav__links { position: static; display: flex; padding: 0; background: transparent; border: 0; box-shadow: none; }
.nav__links .nav__join { padding: 12px 17px; }
.nav__join span { margin-left: 7px; }

.join {
  display: flex;
  width: 100%;
  height: 100%;
  min-height: 0;
  align-items: center;
  justify-content: center;
  padding: clamp(16px, 3dvh, 32px) 0;
  isolation: isolate;
}

.join::before {
  position: absolute;
  z-index: -1;
  top: -28%;
  right: -9%;
  width: min(48vw, 620px);
  aspect-ratio: 1;
  border: 1px solid rgba(23,75,59,.1);
  border-radius: 50%;
  box-shadow: 0 0 0 24px rgba(23,75,59,.025), 0 0 0 50px rgba(23,75,59,.022);
  content: '';
  pointer-events: none;
}

.join__grid {
  width: min(1600px, calc(100% - 64px));
  max-height: 100%;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: clamp(30px, 5vw, 72px);
  align-items: center;
}

.join__copy { min-width: 0; }
.join .eyebrow { margin-bottom: 13px; font-size: 9px; }
.join h2 { font-size: clamp(58px, 6.3vw, 82px); line-height: .86; }
.join__copy > p:not(.eyebrow) { max-width: 385px; margin: 16px 0 0; font-size: clamp(15px, 1.3vw, 18px); line-height: 1.48; }
.join__ticket { gap: 5px; margin-top: 20px; padding: 13px 34px 13px 15px; font-size: 13px; }
.join__stamp { bottom: 7%; left: 37%; }

.join__form-wrap {
  width: 100%;
  min-width: 0;
  padding: 0 22px 17px;
  transform: rotate(.2deg);
}

.form-tab { margin: 0 -22px 16px; padding: 9px 17px; font-size: 8px; }
.form-head { margin-bottom: 13px; }
.form-head h3 { font-size: 31px; }
.form-head p { margin-top: 5px; }
.field { gap: 4px; margin-bottom: 9px; }
.field--gender { margin-bottom: 10px; }
.field--gender legend { margin-bottom: 6px; }
.radio-row { gap: 6px; }
.radio-row label span { min-height: 32px; padding-inline: 10px; font-size: 9px; }
.form-privacy { margin: 0 0 9px; font-size: 10px; line-height: 1.35; }
.form-submit { min-height: 46px; }
.form-status:empty { display: none; }

.signup-success { padding: 10px 0 0; }
.success-stamp { width: 42px; height: 42px; margin-bottom: 10px; }
.signup-success .eyebrow { margin-bottom: 8px; }
.signup-success h3 { font-size: clamp(34px, 3vw, 40px); }
.signup-success h3 span { font-size: 20px; }
.signup-success > p:not(.eyebrow):not(.share-status) { margin: 10px 0 12px; font-size: 13px; }
.student-number { margin-bottom: 12px; padding: 7px 11px; }
.student-number strong { font-size: 23px; }
.success-actions { gap: 16px; }
.success-actions .button { min-height: 40px; padding-inline: 14px; font-size: 11px; }
.share-status { min-height: 0; margin-top: 6px; }

.footer { width: 100%; flex: 0 0 auto; }
.footer__bottom {
  min-height: 31px;
  padding-block: 4px;
  font-size: 7px;
}
.footer__bottom span:nth-child(2) { display: inline; }

@media (max-width: 760px) {
  .shell { width: min(calc(100% - 32px), 560px); }
  .nav { height: 58px; }
  .brand { gap: 8px; }
  .brand__stamp { width: 31px; height: 32px; font-size: 21px; }
  .brand__name { font-size: 15px; }
  .brand__name small { padding-top: 4px; font-size: 7px; }
  .nav__links { position: static; display: flex; width: auto; padding: 0; box-shadow: none; }
  .nav__links .nav__join { margin: 0; padding: 10px 11px; font-size: 9px; }

  .join { padding-block: 8px; }
  .join__grid {
    width: min(calc(100% - 32px), 560px);
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(10px, 1.8dvh, 15px);
  }
  .join__copy { padding: 0; }
  .join .eyebrow { margin-bottom: 7px; font-size: 8px; }
  .join h2 { font-size: clamp(42px, 11vw, 58px); line-height: .82; }
  .join__copy > p:not(.eyebrow) { max-width: 470px; margin-top: 8px; font-size: 13px; line-height: 1.35; }
  .join__ticket { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin-top: 11px; padding: 9px 27px 9px 11px; font-size: 10px; }
  .join__ticket i { right: 9px; bottom: 7px; font-size: 16px; }
  .join__stamp { display: none; }

  .join__form-wrap { padding: 0 14px 12px; transform: none; }
  .form-tab { margin: 0 -14px 11px; padding: 8px 12px; font-size: 7px; }
  .form-head { margin-bottom: 9px; }
  .form-head h3 { font-size: 27px; }
  .form-head p { margin-top: 4px; font-size: 11px; }
  .field { gap: 4px; margin-bottom: 7px; }
  .field label, .field legend { font-size: 9px; }
  .field legend > span { font-size: 8px; }
  .field input:not([type="radio"]) { height: 38px; padding-inline: 9px; font-size: 11px; }
  .field input::placeholder { font-size: 10px; }
  .field--gender { margin-bottom: 8px; }
  .field--gender legend { margin-bottom: 5px; }
  .radio-row { gap: 5px; }
  .radio-row label span { min-height: 28px; padding-inline: 8px; font-size: 8px; }
  .form-privacy { margin-bottom: 7px; font-size: 9px; line-height: 1.3; }
  .form-submit { min-height: 42px; }

  .signup-success { padding: 7px 0 0; }
  .success-stamp { width: 36px; height: 36px; margin-bottom: 8px; font-size: 20px; }
  .signup-success .eyebrow { margin-bottom: 7px; }
  .signup-success h3 { font-size: clamp(31px, 8vw, 38px); }
  .signup-success h3 span { font-size: 18px; }
  .signup-success > p:not(.eyebrow):not(.share-status) { margin: 8px 0 10px; font-size: 12px; }
  .student-number { max-width: 250px; margin-bottom: 10px; padding: 6px 10px; }
  .student-number strong { font-size: 21px; }
  .success-actions { gap: 10px; }
  .success-actions .button { min-height: 37px; padding-inline: 11px; font-size: 10px; }
  .share-status { font-size: 10px; }

  .footer__bottom { justify-content: center; min-height: 27px; }
  .footer__bottom span:nth-child(2) { display: none; }
}

@media (max-width: 380px) {
  .shell { width: calc(100% - 30px); }
  .brand__name { font-size: 14px; }
  .nav__links .nav__join { padding-inline: 9px; font-size: 8px; }
  .join__grid { width: calc(100% - 30px); }
  .join .eyebrow { margin-bottom: 5px; font-size: 7px; }
  .join h2 { font-size: clamp(39px, 12vw, 48px); }
  .join__copy > p:not(.eyebrow) { margin-top: 6px; font-size: 12px; line-height: 1.28; }
  .join__ticket { gap: 3px 8px; margin-top: 8px; padding: 8px 23px 8px 9px; font-size: 9px; }
  .radio-row { gap: 4px; }
  .radio-row label span { padding-inline: 6px; font-size: 7px; }
}

@media (max-height: 680px) and (max-width: 760px) {
  .nav { height: 52px; }
  .footer { display: none; }
  .join { padding-block: 4px; }
  .join__grid { gap: 7px; }
  .join .eyebrow { margin-bottom: 4px; }
  .join h2 { font-size: clamp(37px, 10vw, 45px); }
  .join__copy > p:not(.eyebrow) { margin-top: 5px; font-size: 11px; line-height: 1.24; }
  .join__ticket { gap: 3px 8px; margin-top: 6px; padding-block: 6px; font-size: 8px; }
  .join__form-wrap { padding-bottom: 8px; }
  .form-tab { margin-bottom: 7px; padding-block: 6px; }
  .form-head { margin-bottom: 6px; }
  .form-head > span, .form-head p { display: none; }
  .form-head h3 { font-size: 24px; }
  .field { gap: 3px; margin-bottom: 5px; }
  .field input:not([type="radio"]) { height: 34px; }
  .field--gender { margin-bottom: 5px; }
  .field--gender legend { margin-bottom: 3px; }
  .radio-row label span { min-height: 25px; }
  .form-privacy { margin-bottom: 5px; font-size: 8px; line-height: 1.2; }
  .form-submit { min-height: 37px; }
  .signup-success { padding-top: 2px; }
  .success-stamp { width: 31px; height: 31px; margin-bottom: 5px; font-size: 17px; }
  .signup-success .eyebrow { margin-bottom: 5px; }
  .signup-success h3 { font-size: 30px; }
  .signup-success h3 span { font-size: 16px; }
  .signup-success > p:not(.eyebrow):not(.share-status) { margin: 6px 0 7px; font-size: 11px; }
  .student-number { margin-bottom: 7px; padding: 5px 8px; }
  .student-number strong { font-size: 19px; }
  .success-actions .button { min-height: 33px; }
}