/* Student chapter: original navy panels remain the margins of a quiet school journal. */
@font-face { font-family: "Shang Student Serif"; src: url("./assets/fonts/shang-student-serif.woff2") format("woff2"); font-style: normal; font-weight: 200 900; font-display: swap; }
.story-scene:has(.story-slide--student.is-active) .story-heading { display: none; }
.story-scene:has(.story-slide--student.is-active) .story-stage .story-shade { background: none; }
.story-scene:has(.story-slide--student.is-active) .story-content { position: absolute; top: 60.5%; bottom: auto; left: 3.8%; right: 3.8%; width: 92.4%; margin: 0; padding: 0; transform: none; text-shadow: none; }
.student-notes { display: flex; justify-content: space-between; gap: 0; color: #eee5d7; font-family: "Shang Student Serif", var(--story-serif); }
.student-note { width: 21%; min-width: 0; }
.student-meta { display: flex; align-items: center; gap: 12px; color: #c6b699; font-family: "Segoe UI", sans-serif; font-size: clamp(8px, .65vw, 12px); letter-spacing: .18em; }
.student-meta i { width: 25px; height: 1px; background: #b5a182; opacity: .55; }
.student-note h3 { display: flex; align-items: center; gap: 16px; margin: 14px 0 18px; color: #f0e5d1; font-size: clamp(25px, 2.1vw, 42px); line-height: 1.4; font-weight: 500; letter-spacing: .16em; }
.student-note h3 span { font-size: .5em; color: #c4a981; }
.student-line { margin: 0; font-size: clamp(16px, 1.14vw, 23px); line-height: 1.95; letter-spacing: .025em; font-weight: 400; text-wrap: pretty; }
.student-section-mark { display: block; margin: 0 0 20px; color: #c9b898; font-family: "Segoe UI", "Microsoft YaHei", sans-serif; font-size: clamp(9px, .72vw, 13px); letter-spacing: .16em; }
.student-line--signature { margin-top: 1em; padding-top: .85em; border-top: 1px solid rgba(206,185,148,.26); color: #dcc3c4; }
.story-scene { --student-reveal-from: inset(0 100% 0 0); }
.story-scene[data-story-direction="previous"] { --student-reveal-from: inset(0 0 0 100%); }
.story-animated .is-visible .story-stage .story-frame--student.is-active { animation: student-page-arrival 1.25s cubic-bezier(.2,.65,.25,1) both; }
.story-animated .is-visible .story-slide--student.is-active .student-note { animation: student-note-arrival 1s .22s cubic-bezier(.2,.65,.25,1) both; }
.story-animated .is-visible .story-slide--student.is-active .student-line { animation: student-ink-arrival .9s ease both; animation-delay: calc(.35s + var(--student-order) * .16s); }
.amb-student-thread { fill: none; stroke: url(#student-gold); stroke-width: .9; stroke-dasharray: 72 130; animation: student-margin-light 14s ease-in-out infinite alternate; }
@keyframes student-page-arrival { from { clip-path: var(--student-reveal-from); filter: brightness(1.07); } to { clip-path: inset(0); filter: brightness(1); } }
@keyframes student-note-arrival { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: translateY(0); } }
@keyframes student-ink-arrival { from { opacity: 0; filter: blur(2px); transform: translateY(4px); } to { opacity: 1; filter: blur(0); transform: translateY(0); } }
@keyframes student-margin-light { from { opacity: .12; stroke-dashoffset: 80; } to { opacity: .38; stroke-dashoffset: -80; } }
@media (max-width: 1200px) {
  .story-scene:has(.story-slide--student.is-active) .story-content { position: relative; top: auto; bottom: auto; left: auto; right: auto; width: 100%; padding: 36px max(6vw, calc((100% - 820px) / 2)) 42px; background: #1b2b43; }
  .student-notes { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
  .student-note { width: auto; }
  .student-line { font-size: 17px; }
  .student-note h3 { font-size: 28px; }
  .student-meta, .student-section-mark { font-size: 10px; }
  .student-note--continuation { padding-top: 3px; }
}
@media (max-width: 640px) {
  .story-scene:has(.story-slide--student.is-active) .story-content { padding: 32px 7vw 38px; }
  .student-notes { display: block; }
  .student-note--continuation { margin-top: 26px; }
  .student-line { font-size: 16px; line-height: 2; }
  .student-note h3 { margin-bottom: 20px; }
  .student-section-mark { margin-bottom: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .story-animated .is-visible .story-stage .story-frame--student.is-active,
  .story-animated .is-visible .story-slide--student.is-active .student-note,
  .story-animated .is-visible .story-slide--student.is-active .student-line { animation: none; opacity: 1; clip-path: none; filter: none; transform: none; }
  .story-ambient .amb-student-thread { animation: none; }
}

@media (min-width: 1201px) {
  .story-scene:has(.story-slide--student.is-active) .story-stage .story-back { top: auto; bottom: 3%; left: 3.8%; }
  body:has(#story.is-visible .story-slide--student.is-active) #music-home-slot > .music-player { top: var(--student-music-top); bottom: auto; right: 3.8%; background: rgba(30,45,65,.94); border-color: rgba(225,205,175,.35); --music-ink: #eadcc7; --music-accent: #d6b6b4; }
  body:has(#story.is-visible .story-slide--student.is-active) #music-home-slot .music-track small { color: #c6b69f; }
}