/* Gymochi v6: the smaller pages (science, privacy, terms, thanks, 404). Same type and colours as the home page.
   .pg--night is the science page (the lessons' night sky); .pg--day is the legal and thank-you pages (morning paper). */
:root { --ease: cubic-bezier(.32,.72,0,1); color-scheme: light; }
* { box-sizing: border-box; }
html { -webkit-tap-highlight-color: transparent; -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 400 18px/28px 'DM Sans', system-ui, -apple-system, sans-serif; -webkit-font-smoothing: antialiased; overflow-x: clip; }
.pg--night { --ink: #EEF2FC; --mute: #B6C2DE; --acc: #9CC8FF; --line: rgba(238,242,252,.16); --card: rgba(238,242,252,.05); color: var(--ink);
  background: #0A1430 linear-gradient(180deg, #050A18 0, #0A1430 70svh, #12214A 100%) no-repeat; background-attachment: fixed; min-height: 100svh; }
.pg--day { --ink: #17130F; --mute: #4E4840; --acc: #8A5A00; --line: rgba(23,19,15,.14); --card: #FBF8F3; color: var(--ink); background: #F2EFE9; }
a { color: var(--acc); text-underline-offset: 3px; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; border-radius: 6px; }
.skip { position: fixed; left: 16px; top: -64px; z-index: 50; padding: 12px 16px; border-radius: 9999px; background: #17130F; color: #F2EFE9; font-weight: 600; text-decoration: none; }
.skip:focus { top: 16px; }
.pg__bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; max-width: 800px; margin: 0 auto;
  padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 16px max(16px, env(safe-area-inset-left)); }
.pg__brand { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font: 600 21px/32px 'Fraunces', Georgia, serif; color: var(--ink); text-decoration: none; }
.pg__back { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; line-height: 20px; color: var(--mute); }
.pg__w { max-width: 800px; margin: 0 auto; padding: 48px max(16px, env(safe-area-inset-right)) 96px max(16px, env(safe-area-inset-left)); }
.pg__k { margin: 0 0 16px; font: 500 12.5px/16px 'DM Sans', system-ui, sans-serif; letter-spacing: .09em; text-transform: uppercase; color: var(--acc); }
h1 { margin: 0 0 16px; font: 600 48px/1 'Fraunces', Georgia, serif; letter-spacing: -.035em; text-wrap: balance; }
h1 em { font-weight: 500; color: var(--acc); }
h2 { margin: 48px 0 12px; font: 600 24px/32px 'Fraunces', Georgia, serif; letter-spacing: -.01em; }
p, li { text-wrap: pretty; }
.pg__lede { color: var(--mute); max-width: 36em; }
.pg__lede b { color: var(--ink); }
.pg__how { margin: 32px 0 64px; padding: 24px; border-radius: 24px; background: var(--card); border: 1px solid var(--line); display: grid; gap: 12px; font-size: 16px; line-height: 24px; color: var(--mute); }
.pg__how p { margin: 0; } .pg__how b { color: var(--ink); }
.refs { list-style: none; margin: 0; padding: 0; display: grid; }
.ref { display: grid; grid-template-columns: 48px 1fr; gap: 16px; padding: 24px 0; border-top: 1px solid var(--line); scroll-margin-top: 24px; }
.ref:target { background: linear-gradient(90deg, rgba(156,200,255,.12), transparent); border-radius: 16px; }
.ref__n { font: 600 30px/36px 'Fraunces', Georgia, serif; color: var(--acc); font-variant-numeric: tabular-nums; }
.ref__b p { margin: 0; }
.ref__short { font: 600 20px/28px 'Fraunces', Georgia, serif; }
.ref__found { margin-top: 8px !important; }
.ref__apa { margin-top: 12px !important; font-size: 14px; line-height: 20px; color: var(--mute); overflow-wrap: anywhere; }
.ref__meta { margin-top: 12px !important; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; font-size: 14px; line-height: 20px; color: var(--mute); }
.ref__meta a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
.ref__lvl { display: inline-flex; align-items: center; gap: 8px; min-height: 28px; padding: 2px 12px; border: 1px solid var(--line); border-radius: 9999px; font: 500 12.5px/16px 'DM Sans', system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; }
.ref__lvl::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.ref__lvl--strong::before { background: #A6E33B; } .ref__lvl--moderate::before { background: #2EC7FF; } .ref__lvl--emerging::before { background: #FFD60A; }
.pg__foot { max-width: 800px; margin: 0 auto; padding: 24px max(16px, env(safe-area-inset-right)) calc(48px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 4px 20px; font-size: 14px; line-height: 20px; color: var(--mute); }
.pg__foot a { display: inline-flex; align-items: center; min-height: 44px; color: var(--mute); }
/* legal pages: the markdown body */
.pg--day .pg__w { padding-top: 24px; }
.pg--day h1 { font-size: 48px; }
.pg--day li { margin: 6px 0; } .pg--day ul { padding-left: 20px; }
.tw { overflow-x: auto; } table { border-collapse: collapse; width: 100%; font-size: 15px; margin: 12px 0; }
th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
th { font: 500 12.5px/16px 'DM Sans', system-ui, sans-serif; letter-spacing: .09em; text-transform: uppercase; color: var(--mute); }
@media (min-width: 768px) { h1 { font-size: 72px; } .pg__how { padding: 32px; } .ref { grid-template-columns: 64px 1fr; } }
.pg__logo { width: 28px; height: 28px; border-radius: 7px; box-shadow: 0 0 0 1px rgba(23,19,15,.08), 0 4px 12px -6px rgba(23,19,15,.5); }

/* 2026-10-28 (Jet): the new small logo. "Gymochi" in upright Fraunces, letters spaced .12em, with Mochi beside the word
   (brand book section 6 "Logo"). Replaces the app icon and the italic wordmark. */
.wm { font: 600 21px/1 'Fraunces', Georgia, serif; font-style: normal; letter-spacing: .12em; }
.wm__mo { width: 30px; height: auto; margin-left: -4px; transform: translateY(-2px); }
