:root {
  --bg: #11110f;
  --bg-soft: #171714;
  --paper: #e8e3d8;
  --paper-dim: #bdb6a8;
  --ink: #181816;
  --gold: #b39a68;
  --burgundy: #651c2b;
  --line: rgba(232, 227, 216, .17);
  --line-dark: rgba(24, 24, 22, .15);
  --max: 1380px;
  --serif: 'Cormorant Garamond', 'Noto Serif KR', Georgia, serif;
  --sans: 'Manrope', 'Noto Sans KR', 'Pretendard', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  --mono: 'IBM Plex Mono', 'Noto Sans KR', monospace;
  --ko-sans: 'Noto Sans KR', 'Pretendard', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  --ko-serif: 'Noto Serif KR', 'Batang', serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--bg); color: var(--paper); font-family: var(--sans); font-size: 16px; line-height: 1.65; word-break: keep-all; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
button, input { font: inherit; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { color: inherit; }
.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; }

.intro { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 50% 35%, #26241d 0, #121210 38%, #080808 100%); }
.intro::before { content: ''; position: absolute; inset: -20%; background: repeating-radial-gradient(ellipse at center, transparent 0 3px, rgba(255,255,255,.012) 4px 5px); animation: drift 18s linear infinite; }
.intro-noise { position: absolute; inset: 0; opacity: .025; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); mix-blend-mode: screen; }
.intro-inner { position: relative; z-index: 1; width: min(90vw, 760px); text-align: center; padding: 48px 24px; display: flex; flex-direction: column; align-items: center; }
.intro-crest { width: 168px; margin: 0 auto 28px; opacity: .98; filter: drop-shadow(0 14px 28px rgba(0,0,0,.42)); }
.intro-crest-large { width: clamp(240px, 34vw, 360px); margin-bottom: 28px; }
.eyebrow { margin: 0 0 18px; font: 13px/1.35 var(--mono); letter-spacing: .25em; color: var(--gold); }
.intro h1 { margin: 0; font: 400 clamp(38px, 7vw, 82px)/.92 var(--serif); letter-spacing: -.045em; }
.intro-subtitle { position: relative; display: inline-block; margin: 24px 0 42px; font: 14px/1 var(--mono); letter-spacing: .65em; color: #c9b07b; }
.intro-subtitle::before, .intro-subtitle::after { content: attr(data-glitch); position: absolute; inset: 0; opacity: 0; }
.intro-subtitle::before { color: #8baec7; transform: translateX(-2px); }
.intro-subtitle::after { color: #9b1d33; transform: translateX(2px); }
.intro-subtitle.glitch::before, .intro-subtitle.glitch::after { animation: flash .45s steps(2); }
.enter-button { display: block; margin: 0 auto; min-width: 210px; padding: 15px 22px; border: 1px solid rgba(232,227,216,.42); background: rgba(255,255,255,.03); letter-spacing: .17em; font-size: 13px; cursor: pointer; transition: .25s ease; }
.enter-button:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.sound-toggle { display: inline-flex; align-items: center; gap: 8px; font: 12px/1.35 var(--ko-sans); letter-spacing: .08em; color: #a49d91; cursor: pointer; }
.sound-toggle input { accent-color: var(--gold); }
.intro-sound { margin-top: 16px; }
.legal-copy { margin: 36px 0 0; font: 11px/1.6 var(--mono); letter-spacing: .08em; color: #777268; }

.site { min-height: 100vh; }
.topbar { position: sticky; top: 0; z-index: 50; height: 128px; display: grid; grid-template-columns: 470px 1fr auto; align-items: center; padding: 0 34px; border-bottom: 1px solid var(--line); background: rgba(17,17,15,.94); backdrop-filter: blur(18px); }
.brand { display: flex; align-items: center; gap: 16px; min-width: 0; }
.brand-crest { width: 92px; height: auto; flex: 0 0 auto; }
.brand span { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.brand strong { font: 600 34px/1 var(--serif); letter-spacing: .02em; }
.brand small { font: 14px/1.25 var(--serif); letter-spacing: .015em; color: var(--paper-dim); }
.footer-brand { display: flex; align-items: center; gap: 14px; }
.footer-brand img { width: 54px; height: auto; opacity: .92; }
.footer-brand div { display: flex; flex-direction: column; gap: 3px; }
.main-nav { justify-self: center; display: flex; align-items: center; gap: clamp(18px, 2.8vw, 42px); }
.main-nav a { position: relative; font: 500 12px/1 var(--mono); letter-spacing: .12em; color: #bbb4a7; padding: 12px 0; }
.main-nav a::after { content: ''; position: absolute; left: 0; right: 100%; bottom: 5px; height: 1px; background: var(--gold); transition: right .25s; }
.main-nav a:hover, .main-nav a.active { color: var(--paper); }
.main-nav a:hover::after, .main-nav a.active::after { right: 0; }
.header-actions { justify-self: end; }
.icon-button { border: 0; background: transparent; font: 500 11px/1 var(--mono); letter-spacing: .12em; color: #aaa397; cursor: pointer; }
.menu-button { display: none; border: 0; background: transparent; width: 36px; height: 36px; padding: 8px; }
.menu-button span:not(.sr-only) { display: block; height: 1px; margin: 6px 0; background: var(--paper); }

#app { min-height: calc(100vh - 128px); outline: none; }
.page { animation: pageIn .42s ease both; }
.container { width: min(calc(100% - 52px), var(--max)); margin-inline: auto; }
.section { padding: 110px 0; }
.section-tight { padding: 70px 0; }
.section-label { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; font: 500 12px/1.3 var(--mono); letter-spacing: .18em; color: var(--gold); }
.section-label::before { content: ''; width: 34px; height: 1px; background: currentColor; }
.display { margin: 0; font: 400 clamp(52px, 8vw, 122px)/.88 var(--serif); letter-spacing: -.055em; }
.lead { max-width: 760px; margin: 24px 0 0; color: #bdb6aa; font: 19px/1.85 var(--ko-serif); }
.button-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 22px; border: 1px solid rgba(232,227,216,.32); background: transparent; font: 500 12px/1 var(--mono); letter-spacing: .12em; cursor: pointer; transition: .22s; }
.button:hover { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.button.primary { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.button.primary:hover { background: var(--gold); border-color: var(--gold); }

.hero { position: relative; min-height: calc(100vh - 128px); display: grid; align-items: end; overflow: hidden; }
.hero-media { position: absolute; inset: 0; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.72) saturate(.78); }
.hero-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12,12,10,.86), rgba(12,12,10,.24) 58%, rgba(12,12,10,.08)), linear-gradient(0deg, rgba(12,12,10,.9), transparent 50%); }
.hero-content { position: relative; z-index: 2; width: min(calc(100% - 52px), var(--max)); margin: 0 auto; padding: 120px 0 80px; }
.hero-seal-wrap { margin: 0 0 30px; }
.hero-seal { width: clamp(200px, 19vw, 290px); filter: drop-shadow(0 14px 32px rgba(0,0,0,.34)); }
.hero h1 { max-width: 930px; margin: 0; font: 400 clamp(56px, 9.5vw, 154px)/.78 var(--serif); letter-spacing: -.07em; }
.hero h1 span { display: block; color: #c4a873; }
.hero-copy { max-width: 650px; margin: 34px 0 0; font: 16px/1.85 var(--ko-sans); color: #c4beb2; }
.hero-meta { display: flex; gap: 28px; margin-top: 45px; padding-top: 20px; border-top: 1px solid var(--line); font: 11px/1.4 var(--mono); letter-spacing: .15em; color: #9d9689; }
.hero-secret { position: absolute; right: 34px; bottom: 34px; font: 10px/1 var(--mono); color: rgba(255,255,255,.22); letter-spacing: .16em; writing-mode: vertical-rl; }

.split-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(40px, 7vw, 110px); align-items: center; }
.image-frame { position: relative; border: 1px solid var(--line); padding: 12px; }
.image-frame::before { content: 'ARCHIVED COPY'; position: absolute; right: 12px; top: -18px; font: 10px/1 var(--mono); letter-spacing: .12em; color: #827b70; }
.image-frame img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.stat-strip { display: grid; grid-template-columns: repeat(3, 1fr); border-block: 1px solid var(--line); }
.stat { padding: 32px; border-right: 1px solid var(--line); }
.stat:last-child { border-right: 0; }
.stat strong { display: block; margin-bottom: 8px; font: 34px/1 var(--serif); }
.stat span { font: 11px/1.45 var(--mono); letter-spacing: .12em; color: #978f82; }

.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.feature-card { min-height: 290px; padding: 34px; background: var(--bg); display: flex; flex-direction: column; }
.feature-card .number { font: 11px/1 var(--mono); color: var(--gold); }
.feature-card h3 { margin: auto 0 18px; font: 35px/1 var(--serif); }
.feature-card p { margin: 0; color: #a9a296; line-height: 1.75; font-size: 15px; font-family: var(--ko-sans); }
.feature-card a { margin-top: 24px; font: 11px/1 var(--mono); letter-spacing: .12em; color: var(--paper); }

.paper-page { background: var(--paper); color: var(--ink); }
.paper-page .top-spacer { height: 1px; }
.paper-page .section-label { color: #785d2c; }
.paper-page .lead { color: #4a4640; }
.academy-hero { position: relative; min-height: 72vh; display: grid; align-items: end; overflow: hidden; }
.academy-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(.15) contrast(.95); }
.academy-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(18,18,15,.78), transparent 65%); }
.academy-hero .container { position: relative; z-index: 1; padding-bottom: 58px; color: var(--paper); }
.academy-hero-copy { max-width: 1380px; }
.academy-hero-copy h1 { max-width: 780px; }
.academy-official-name { max-width: 760px; }
.academy-hero h1 { max-width: 900px; margin: 0; font: 400 clamp(52px, 8vw, 120px)/.84 var(--serif); letter-spacing: -.06em; }
.legacy-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 90px; }
.legacy-copy h2 { margin: 0; font: 400 clamp(48px, 6vw, 86px)/.95 var(--serif); letter-spacing: -.045em; }
.legacy-copy p { max-width: 720px; margin-top: 30px; font: 19px/1.9 var(--ko-serif); color: #4d4942; }
.facts { border-top: 1px solid var(--line-dark); }
.fact { display: flex; justify-content: space-between; gap: 30px; padding: 21px 0; border-bottom: 1px solid var(--line-dark); }
.fact span { font: 11px/1.45 var(--mono); letter-spacing: .12em; color: #706b62; }
.fact strong { font: 500 20px/1.3 var(--ko-serif); }
.campus-grid { display: grid; grid-template-columns: 1.4fr .6fr; gap: 18px; }
.campus-grid img { width: 100%; height: 100%; object-fit: cover; }
.campus-grid .main-campus { min-height: 550px; }
.campus-stack { display: grid; gap: 18px; }
.campus-stack img { min-height: 266px; }
.partner-grid { display: grid; grid-template-columns: repeat(2, 1fr); border: 1px solid var(--line-dark); }
.partner { position: relative; min-height: 220px; padding: 38px; border-right: 1px solid var(--line-dark); overflow: hidden; }
.partner:last-child { border-right: 0; }
.partner h3 { margin: 35px 0 10px; font: 38px/1 var(--serif); }
.partner p { max-width: 460px; color: #58534c; line-height: 1.75; font-family: var(--ko-sans); font-size: 15px; }
.partner .secret { position: absolute; inset: auto 38px 25px; opacity: 0; transform: translateY(8px); transition: .25s; font: 11px/1.3 var(--ko-sans); letter-spacing: .08em; color: var(--burgundy); }
.partner:hover .secret { opacity: 1; transform: none; }

.students-header { padding: 100px 0 52px; border-bottom: 1px solid var(--line); }
.filters { display: flex; gap: 9px; flex-wrap: wrap; margin-top: 34px; }
.filter { padding: 11px 15px; border: 1px solid var(--line); background: transparent; color: #aba397; font: 500 11px/1 var(--mono); letter-spacing: .1em; cursor: pointer; }
.filter.active, .filter:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.student-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border-inline: 1px solid var(--line); }
.student-card { position: relative; min-height: 620px; background: var(--bg); overflow: hidden; cursor: pointer; }
.student-card img { width: 100%; height: 440px; object-fit: cover; filter: grayscale(.15) saturate(.75); transition: .6s ease; }
.student-card:hover img { transform: scale(1.025); filter: grayscale(0) saturate(.9); }
.student-card-content { padding: 25px 26px 30px; }
.student-card .meta { display: flex; justify-content: space-between; gap: 20px; font: 10px/1.4 var(--mono); letter-spacing: .09em; color: #877f73; }
.student-card h2 { margin: 18px 0 7px; font: 40px/1 var(--serif); }
.student-card p { margin: 0; color: #a59e92; font-size: 15px; line-height: 1.6; font-family: var(--ko-sans); }
.student-card::after { content: 'VIEW RECORD'; position: absolute; right: 20px; bottom: 23px; font: 10px/1 var(--mono); letter-spacing: .12em; color: var(--gold); }

.profile-hero { position: relative; min-height: 690px; display: grid; grid-template-columns: 1.05fr .95fr; border-bottom: 1px solid var(--line); }
.profile-image { min-height: 690px; overflow: hidden; background: #1a1a18; }
.profile-image img { width: 100%; height: 100%; object-fit: cover; }
.profile-copy { padding: clamp(54px, 7vw, 110px); display: flex; flex-direction: column; justify-content: flex-end; }
.back-link { align-self: flex-start; margin-bottom: auto; font: 11px/1 var(--mono); letter-spacing: .12em; color: #aaa295; cursor: pointer; }
.profile-copy h1 { margin: 0; font: 400 clamp(62px, 8vw, 118px)/.82 var(--serif); letter-spacing: -.065em; }
.profile-copy .handle { margin-top: 16px; font: 12px/1 var(--mono); letter-spacing: .12em; color: var(--gold); }
.profile-copy blockquote { max-width: 600px; margin: 42px 0 0; font: 20px/1.75 var(--ko-serif); color: #cac4b9; }
.profile-tabs { display: flex; gap: 0; border-bottom: 1px solid var(--line); overflow-x: auto; }
.profile-tabs button { flex: 1; min-width: 155px; padding: 22px 20px; border: 0; border-right: 1px solid var(--line); background: transparent; font: 500 11px/1 var(--mono); letter-spacing: .12em; cursor: pointer; }
.profile-tabs button.active { background: var(--paper); color: var(--ink); }
.profile-panel { padding: 90px 0; }
.record-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; }
.record-card { border-top: 1px solid var(--line); padding-top: 24px; }
.record-card h3 { margin: 0 0 24px; font: 500 12px/1 var(--mono); letter-spacing: .16em; color: var(--gold); }
.record-card p { margin: 0; font: 23px/1.7 var(--ko-serif); color: #c7c1b6; }
.connections { border-top: 1px solid var(--line); }
.connection { display: grid; grid-template-columns: 260px 1fr; gap: 50px; padding: 26px 0; border-bottom: 1px solid var(--line); }
.connection strong { font: 24px/1 var(--serif); }
.connection span { color: #aaa397; line-height: 1.7; font-family: var(--ko-sans); font-size: 15px; }

.social-shell { background: #e9e6df; color: #141414; min-height: calc(100vh - 92px); }
.social-header { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; padding: 70px 0 35px; border-bottom: 1px solid rgba(0,0,0,.14); }
.social-header h1 { margin: 0; font: 400 clamp(54px, 7vw, 96px)/.9 var(--serif); }
.profile-switcher { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.profile-switcher button { width: 42px; height: 42px; padding: 2px; border-radius: 50%; border: 1px solid rgba(0,0,0,.18); background: transparent; overflow: hidden; cursor: pointer; }
.profile-switcher img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.instagram { width: min(calc(100% - 40px), 980px); margin: 0 auto; padding-bottom: 80px; }
.ig-profile { display: grid; grid-template-columns: 160px 1fr; gap: 50px; padding: 54px 0 38px; align-items: center; }
.ig-avatar { width: 142px; height: 142px; border-radius: 50%; padding: 4px; border: 1px solid rgba(0,0,0,.18); }
.ig-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.ig-headline { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.ig-headline h2 { margin: 0; font: 600 28px/1.2 var(--sans); }
.ig-verified { width: 15px; height: 15px; display: inline-grid; place-items: center; border-radius: 50%; background: #3777b7; color: white; font-size: 9px; }
.ig-follow { padding: 10px 17px; border: 0; border-radius: 4px; background: #111; color: white; font-weight: 700; cursor: pointer; }
.ig-stats { display: flex; gap: 34px; margin: 24px 0 18px; font-size: 15px; }
.ig-stats strong { margin-right: 5px; }
.ig-bio { font-size: 15px; line-height: 1.7; font-family: var(--ko-sans); }
.ig-tabs { display: flex; justify-content: center; gap: 55px; border-top: 1px solid rgba(0,0,0,.15); }
.ig-tabs span { padding: 18px 0; border-top: 1px solid #111; margin-top: -1px; font: 500 12px/1 var(--mono); letter-spacing: .12em; }
.post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }
.post { position: relative; aspect-ratio: 1; overflow: hidden; cursor: pointer; background: #c9c4ba; }
.post img { width: 100%; height: 100%; object-fit: cover; transition: .35s; }
.post:hover img { transform: scale(1.025); filter: brightness(.72); }
.post-overlay { position: absolute; inset: 0; display: grid; place-items: center; opacity: 0; transition: .25s; color: white; font-weight: 700; }
.post:hover .post-overlay { opacity: 1; }
.post.empty { display: grid; place-items: center; font: 12px/1.55 var(--mono); text-align: center; color: #716c64; }

.modal { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 24px; background: rgba(0,0,0,.82); }
.modal[hidden] { display: none; }
.modal-card { position: relative; width: min(1040px, 96vw); max-height: 90vh; display: grid; grid-template-columns: 1fr 430px; overflow: auto; background: #f0ede7; color: #111; box-shadow: 0 35px 100px rgba(0,0,0,.55); }
.modal-image { min-height: 620px; background: #222; }
.modal-image img { width: 100%; height: 100%; object-fit: cover; }
.modal-copy { padding: 28px; }
.modal-owner { display: flex; align-items: center; gap: 12px; padding-bottom: 17px; border-bottom: 1px solid rgba(0,0,0,.12); }
.modal-owner img { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; }
.modal-owner strong { font-size: 15px; }
.modal-caption { margin: 23px 0; font-size: 15px; line-height: 1.75; font-family: var(--ko-sans); }
.comments { border-top: 1px solid rgba(0,0,0,.12); }
.comment { padding: 14px 0; border-bottom: 1px solid rgba(0,0,0,.08); font-size: 14px; line-height: 1.6; font-family: var(--ko-sans); }
.comment strong { margin-right: 8px; }
.modal-footer { margin-top: 25px; font-size: 14px; }
.modal-footer small { display: block; margin-top: 8px; color: #74706a; font: 11px/1.3 var(--mono); }
.modal-close { position: fixed; top: 20px; right: 24px; z-index: 2; width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; background: rgba(0,0,0,.45); color: white; cursor: pointer; }

.archive-page { background: #0b0d0f; min-height: calc(100vh - 92px); font-family: var(--mono); }
.archive-header { display: grid; grid-template-columns: 1fr auto; gap: 50px; align-items: end; padding: 74px 0 38px; border-bottom: 1px solid rgba(130,154,166,.18); }
.archive-header h1 { margin: 0; font: 400 clamp(52px, 7vw, 96px)/.9 var(--serif); }
.archive-header p { max-width: 620px; margin: 20px 0 0; color: #89969c; font-size: 14px; line-height: 1.8; font-family: var(--ko-sans); }
.terminal-status { text-align: right; color: #6f8d75; font-size: 11px; letter-spacing: .08em; }
.call-list { border-top: 1px solid rgba(130,154,166,.15); }
.call-row { display: grid; grid-template-columns: 110px 1fr 150px 190px 34px; gap: 20px; align-items: center; padding: 25px 0; border-bottom: 1px solid rgba(130,154,166,.15); cursor: pointer; transition: .2s; }
.call-row:hover { padding-inline: 14px; background: rgba(117,148,163,.06); }
.call-row .id { color: #b0c1c8; font-size: 12px; }
.call-row strong { font: 400 19px/1.2 var(--serif); }
.call-row span { color: #728087; font-size: 11px; }
.call-row .status { color: #809f89; }
.call-row .arrow { font-size: 20px; color: #8297a1; }
.player-shell { display: grid; grid-template-columns: 420px 1fr; gap: 55px; padding: 58px 0 100px; }
.player-meta { border: 1px solid rgba(130,154,166,.2); padding: 28px; align-self: start; }
.player-meta .back { display: inline-block; margin-bottom: 35px; color: #91a2aa; font-size: 11px; cursor: pointer; }
.player-meta h2 { margin: 0; font: 400 38px/1.08 var(--serif); }
.player-meta dl { margin: 36px 0 0; }
.player-meta dl div { display: flex; justify-content: space-between; padding: 13px 0; border-bottom: 1px solid rgba(130,154,166,.15); font-size: 11px; }
.player-meta dt { color: #68767c; }
.player-meta dd { margin: 0; color: #b3c1c7; }
.waveform { height: 160px; display: flex; align-items: center; gap: 3px; padding: 0 10px; border-block: 1px solid rgba(130,154,166,.16); overflow: hidden; }
.waveform i { display: block; flex: 1; min-width: 2px; height: var(--h); background: #6c8792; opacity: .65; transition: .2s; }
.waveform.playing i { animation: wave 1.1s ease-in-out infinite alternate; animation-delay: calc(var(--n) * -35ms); }
.audio-controls { display: flex; align-items: center; gap: 16px; padding: 24px 0; border-bottom: 1px solid rgba(130,154,166,.16); }
.audio-controls button { border: 1px solid rgba(130,154,166,.28); background: transparent; padding: 11px 14px; color: #b8c5cb; cursor: pointer; font-size: 11px; }
.audio-controls .play { width: 48px; height: 48px; border-radius: 50%; }
.audio-controls input[type='range'] { flex: 1; accent-color: #839da8; }
.audio-time { min-width: 104px; text-align: right; color: #7a8990; font-size: 11px; }
.transcript { margin-top: 38px; }
.transcript h3 { margin: 0 0 20px; font-size: 12px; letter-spacing: .12em; color: #71848d; }
.transcript-row { display: grid; grid-template-columns: 78px 126px 1fr; gap: 20px; padding: 18px 0; border-bottom: 1px solid rgba(130,154,166,.12); font-size: 13px; line-height: 1.75; }
.transcript-row time { color: #56656c; }
.transcript-row strong { color: #8fa7b1; }
.transcript-row p { margin: 0; color: #b7c1c5; }
.redacted { display: inline-block; padding: 0 5px; background: #070808; color: #070808; transition: .3s; cursor: help; }
.redacted:hover { color: #c0c7ca; }
.file-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin-top: 60px; background: rgba(130,154,166,.15); border: 1px solid rgba(130,154,166,.15); }
.file-card { min-height: 210px; padding: 26px; background: #0b0d0f; display: flex; flex-direction: column; }
.file-card small { color: #64747b; font-size: 10px; }
.file-card strong { margin: auto 0 15px; font: 400 22px/1.1 var(--serif); }
.file-card span { color: #7e9098; font-size: 10px; }

.ever-page { background: #11100f; }
.poster-hero { position: relative; min-height: calc(100vh - 92px); display: grid; align-items: center; overflow: hidden; }
.poster-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .58; filter: saturate(.7); }
.poster-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,10,9,.9), rgba(10,10,9,.18)), linear-gradient(0deg, rgba(10,10,9,.85), transparent 60%); }
.poster-copy { position: relative; z-index: 1; width: min(calc(100% - 52px), var(--max)); margin: 0 auto; padding: 100px 0; }
.poster-copy .title { margin: 0; font: italic 400 clamp(78px, 14vw, 210px)/.72 var(--serif); letter-spacing: -.08em; }
.poster-copy .title span { display: block; margin-left: clamp(30px, 10vw, 160px); color: #c9ac75; }
.poster-copy p { max-width: 560px; margin: 42px 0 0; color: #c2bbb0; font: 17px/1.75 var(--serif); }
.media-grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: 20px; }
.video-placeholder { position: relative; min-height: 520px; display: grid; place-items: center; border: 1px solid var(--line); background: linear-gradient(135deg, #1d1b18, #0e0e0d); overflow: hidden; }
.video-placeholder::before { content: ''; position: absolute; inset: 0; background: url('../assets/images/post-limbo.svg') center/cover; opacity: .24; }
.play-large { position: relative; width: 95px; height: 95px; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; background: rgba(0,0,0,.25); color: white; cursor: pointer; }
.play-large::after { content: ''; position: absolute; left: 40px; top: 33px; border-left: 19px solid currentColor; border-top: 14px solid transparent; border-bottom: 14px solid transparent; }
.album-card { border: 1px solid var(--line); padding: 24px; }
.album-card img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.album-card h3 { margin: 24px 0 8px; font: 38px/1 var(--serif); }
.album-card p { margin: 0; color: #9e978b; font: 12px/1.6 var(--mono); }
.track-controls { display: flex; gap: 12px; margin-top: 22px; }
.track-controls button { border: 1px solid var(--line); background: transparent; padding: 10px 14px; cursor: pointer; }
.credit-row { display: grid; grid-template-columns: 180px 1fr; gap: 30px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.credit-row span { font: 11px/1.3 var(--mono); color: #8f887c; }
.credit-row strong { font: 400 19px/1.2 var(--serif); }

.footer { min-height: 116px; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 30px 34px; border-top: 1px solid var(--line); background: #0d0d0c; }
.footer div:first-child { display: flex; flex-direction: column; gap: 7px; }
.footer strong { font: 14px/1 var(--serif); }
.footer span { font: 10px/1.35 var(--mono); letter-spacing: .1em; color: #756f65; }
.footer-status { font: 10px/1 var(--mono); letter-spacing: .1em; color: #778a79; }
.footer-status i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 8px; background: #6e956f; box-shadow: 0 0 12px #6e956f; }
.toast { position: fixed; left: 50%; bottom: 30px; z-index: 120; transform: translate(-50%, 20px); padding: 12px 16px; background: #e9e5dc; color: #151515; opacity: 0; pointer-events: none; transition: .25s; font: 11px/1.3 var(--ko-sans); letter-spacing: .04em; box-shadow: 0 10px 30px rgba(0,0,0,.3); }
.toast.show { opacity: 1; transform: translate(-50%, 0); }

@keyframes pageIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes drift { to { transform: translate3d(4%, -3%, 0) rotate(.5deg); } }
@keyframes flash { 0%,100% { opacity: 0; clip-path: inset(0); } 30% { opacity: .8; clip-path: inset(10% 0 58%); } 55% { opacity: .55; clip-path: inset(65% 0 5%); } }
@keyframes wave { to { transform: scaleY(.45); opacity: .35; } }

@media (max-width: 1080px) {
  .topbar { grid-template-columns: 1fr auto auto; padding: 0 22px; }
  .menu-button { display: block; justify-self: end; }
  .main-nav { position: fixed; inset: 104px 0 auto; display: none; padding: 26px; background: rgba(13,13,12,.98); border-bottom: 1px solid var(--line); flex-direction: column; align-items: flex-start; }
  .main-nav.open { display: flex; }
  .header-actions { margin-left: 10px; }
  .split-grid, .legacy-grid { grid-template-columns: 1fr; gap: 55px; }
  .student-grid { grid-template-columns: repeat(2, 1fr); }
  .profile-hero { grid-template-columns: 1fr; }
  .profile-image { min-height: 70vh; }
  .profile-copy { min-height: 530px; }
  .player-shell { grid-template-columns: 1fr; }
  .player-meta { width: 100%; }
  .media-grid { grid-template-columns: 1fr; }
  .file-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
  .container, .hero-content, .poster-copy { width: min(calc(100% - 30px), var(--max)); }
  .topbar { height: 68px; padding: 0 14px; }
  .brand-crest { width: 72px; }
  .brand strong { font-size: 26px; }
  .brand small { font-size: 12px; }
  
  
  .main-nav { inset: 96px 0 auto; }
  .icon-button { font-size: 9px; }
  .section { padding: 76px 0; }
  .hero { min-height: calc(100vh - 72px); }
  .hero h1 { font-size: clamp(55px, 18vw, 90px); }
  .hero-meta { flex-direction: column; gap: 10px; }
  .stat-strip { grid-template-columns: 1fr; }
  .stat { border-right: 0; border-bottom: 1px solid var(--line); }
  .feature-grid { grid-template-columns: 1fr; }
  .campus-grid { grid-template-columns: 1fr; }
  .campus-grid .main-campus { min-height: 390px; }
  .campus-stack { grid-template-columns: 1fr 1fr; }
  .campus-stack img { min-height: 180px; }
  .partner-grid { grid-template-columns: 1fr; }
  .partner { border-right: 0; border-bottom: 1px solid var(--line-dark); }
  .student-grid { grid-template-columns: 1fr; }
  .student-card { min-height: 570px; }
  .profile-image { min-height: 58vh; }
  .profile-copy { padding: 42px 24px; }
  .record-grid { grid-template-columns: 1fr; gap: 46px; }
  .connection { grid-template-columns: 1fr; gap: 10px; }
  .social-header { align-items: flex-start; flex-direction: column; }
  .profile-switcher { justify-content: flex-start; }
  .ig-profile { grid-template-columns: 92px 1fr; gap: 20px; }
  .ig-avatar { width: 88px; height: 88px; }
  .ig-stats { gap: 14px; font-size: 13px; }
  .post-grid { gap: 2px; }
  .modal-card { grid-template-columns: 1fr; }
  .modal-image { min-height: 52vh; }
  .call-row { grid-template-columns: 82px 1fr 30px; }
  .call-row > span:nth-of-type(1), .call-row .status { display: none; }
  .archive-header { grid-template-columns: 1fr; }
  .terminal-status { text-align: left; }
  .transcript-row { grid-template-columns: 58px 84px 1fr; gap: 10px; font-size: 12px; }
  .file-grid { grid-template-columns: 1fr; }
  .footer { align-items: flex-start; flex-direction: column; padding: 28px 16px; }
}

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

/* Korean typography and readability tuning */
html[lang="ko"] h1, html[lang="ko"] h2, html[lang="ko"] h3, html[lang="ko"] blockquote { word-break: keep-all; }
.main-nav a, .brand, .section-label, .button, .filter, .profile-tabs button { white-space: nowrap; }

@media (max-width: 1080px) {
  .main-nav a { font-size: 14px; padding: 10px 0; }
}

@media (max-width: 760px) {
  .topbar { height: 72px; }
  .main-nav { inset: 96px 0 auto; }
  .brand-crest { width: 76px; }
  .brand strong { font-size: 28px; }
  .brand small { font-size: 12px; }
  .hero-copy { font-size: 15px; }
  .legal-copy { font-size: 10px; }
  .feature-card p, .student-card p, .ig-bio { font-size: 14px; }
}

/* v3 — 2024 timeline, expanded directory, and public character dossiers */
.main-nav a { font-size: 14px; letter-spacing: .13em; }
.icon-button { font-size: 11px; }
.section-label { font-size: 12px; }

.display.compact { max-width: 900px; font-size: clamp(46px, 6vw, 82px); }
.section-heading-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; margin-bottom: 44px; }
.record-code { flex: 0 0 auto; padding: 11px 14px; border: 1px solid var(--line); color: var(--gold); font: 11px/1 var(--mono); letter-spacing: .12em; }
.current-record-section { background: #0e0e0d; }
.timeline-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.timeline-grid article { position: relative; min-height: 310px; padding: 30px; background: #121210; overflow: hidden; }
.timeline-grid article > span { position: absolute; top: 18px; right: 22px; font: 400 72px/1 var(--serif); color: rgba(232,227,216,.07); }
.timeline-grid small { display: inline-block; color: var(--gold); font: 11px/1 var(--mono); letter-spacing: .14em; }
.timeline-grid h3 { margin: 72px 0 16px; font: 36px/.95 var(--serif); }
.timeline-grid p { margin: 0; color: #a9a295; font: 15px/1.8 var(--ko-sans); }
.timeline-grid .sealed::after { content: 'RECORDS SEALED'; position: absolute; left: 27px; bottom: 24px; color: #8f2b3c; font: 10px/1 var(--mono); letter-spacing: .16em; }

.power-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line-dark); background: var(--line-dark); gap: 1px; }
.power-grid article { min-height: 290px; padding: 36px; background: var(--paper); }
.power-grid span { color: #80776a; font: 11px/1 var(--mono); letter-spacing: .13em; }
.power-grid h3 { margin: 70px 0 16px; font: 43px/1 var(--serif); }
.power-grid p { margin: 0; color: #555047; font: 15px/1.85 var(--ko-sans); }

.student-grid { grid-template-columns: repeat(4, 1fr); }
.student-card { min-height: 600px; }
.student-card img { height: 405px; }
.student-card .meta { font-size: 11px; }
.student-card h2 { margin-bottom: 3px; font-size: 39px; }
.student-ko-name { display: block; margin-bottom: 13px; color: #81796d; font: 13px/1.4 var(--ko-sans); }
.student-mini-facts { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 18px; padding-right: 74px; }
.student-mini-facts span { padding: 6px 8px; border: 1px solid var(--line); color: #8e867a; font: 9px/1 var(--mono); letter-spacing: .08em; }
.student-card.filtered-out { display: none; }

.profile-ko-name { margin-top: 13px; color: #aaa397; font: 18px/1.4 var(--ko-sans); }
.profile-facts { display: grid; grid-template-columns: repeat(6, 1fr); border: 1px solid var(--line); background: var(--line); gap: 1px; }
.profile-facts > div { min-height: 124px; padding: 22px; background: var(--bg); display: flex; flex-direction: column; justify-content: space-between; }
.profile-facts span { color: #877f73; font: 10px/1 var(--mono); letter-spacing: .14em; }
.profile-facts strong { color: #ded8cc; font: 19px/1.3 var(--serif); font-weight: 500; }
.profile-overview { display: grid; grid-template-columns: 1.25fr .75fr; gap: 70px; margin-top: 88px; }
.profile-story h2 { margin: 0 0 28px; max-width: 760px; font: 400 clamp(46px, 6vw, 78px)/.92 var(--serif); letter-spacing: -.045em; }
.profile-story > p:last-child { margin: 0; max-width: 830px; color: #c9c2b7; font: 20px/1.95 var(--ko-serif); }
.profile-position { align-self: start; padding: 30px; border: 1px solid var(--line); border-top: 3px solid var(--profile-accent); }
.profile-position > span { display: block; margin-bottom: 26px; color: var(--gold); font: 10px/1 var(--mono); letter-spacing: .14em; }
.profile-position strong { display: block; margin-bottom: 22px; font: 32px/1.05 var(--serif); }
.profile-position p { margin: 0; color: #aaa397; font: 15px/1.9 var(--ko-sans); }
.profile-detail-grid { display: grid; grid-template-columns: 1.1fr .95fr .95fr; gap: 1px; margin-top: 70px; border: 1px solid var(--line); background: var(--line); }
.detail-card { min-height: 285px; padding: 30px; background: var(--bg); }
.detail-card h3 { margin: 0 0 32px; color: var(--gold); font: 11px/1 var(--mono); letter-spacing: .15em; }
.detail-card ul { margin: 0; padding: 0; list-style: none; }
.detail-card li { padding: 11px 0; border-bottom: 1px solid var(--line); color: #c4bdb1; font: 15px/1.55 var(--ko-sans); }
.tag-list { display: flex; flex-wrap: wrap; gap: 9px; }
.tag-list span { padding: 10px 12px; border: 1px solid var(--line); color: #c7c0b4; font: 11px/1 var(--mono); letter-spacing: .08em; }
.archive-note { margin-top: 52px; padding: 30px 34px; border-left: 3px solid var(--profile-accent); background: rgba(255,255,255,.025); }
.archive-note span { color: #91897c; font: 10px/1 var(--mono); letter-spacing: .14em; }
.archive-note p { margin: 16px 0 0; color: #c6bfb3; font: 17px/1.85 var(--ko-serif); }

.profile-switcher button { width: 48px; height: 48px; }
.transcript-row { transition: .25s ease; }
.transcript-row.active { padding-inline: 12px; background: rgba(124,154,167,.08); }
.transcript-row.active strong, .transcript-row.active p { color: #e0e8eb; }

@media (max-width: 1280px) {
  .student-grid { grid-template-columns: repeat(3, 1fr); }
  .profile-facts { grid-template-columns: repeat(3, 1fr); }
  .timeline-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 1080px) {
  .student-grid { grid-template-columns: repeat(2, 1fr); }
  .power-grid { grid-template-columns: 1fr; }
  .profile-overview { grid-template-columns: 1fr; gap: 44px; }
  .profile-detail-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .section-heading-row { align-items: flex-start; flex-direction: column; }
  .timeline-grid { grid-template-columns: 1fr; }
  .timeline-grid article { min-height: 260px; }
  .student-grid { grid-template-columns: 1fr; }
  .student-card img { height: 430px; }
  .profile-facts { grid-template-columns: repeat(2, 1fr); }
  .profile-facts > div { min-height: 110px; }
  .profile-story > p:last-child { font-size: 18px; }
  .profile-position { padding: 24px; }
}

/* v4 — final canon, academy maps, annual calendar, Korean signature lines */
.intro-school-sub { display: inline-block; margin-top: 10px; font: 500 clamp(12px, 1.6vw, 17px)/1 var(--mono); letter-spacing: .38em; color: var(--gold); }
.academy-official-name { max-width: 720px; margin: 26px 0 0; font: 500 13px/1.5 var(--mono); letter-spacing: .16em; color: #d6c8aa; }
.timeline-grid .timeline-link { cursor: pointer; transition: background .25s ease, transform .25s ease; }
.timeline-grid .timeline-link:hover { background: #181713; }
.timeline-grid .timeline-link i { position: absolute; left: 30px; bottom: 26px; color: var(--gold); font: 10px/1 var(--mono); letter-spacing: .13em; font-style: normal; }

.academy-page { --academy-ink: #171714; --academy-muted: #625d54; }
.academy-subnav { position: sticky; top: 92px; z-index: 20; display: flex; justify-content: center; overflow-x: auto; border-bottom: 1px solid var(--line-dark); background: rgba(232,227,216,.94); backdrop-filter: blur(14px); }
.academy-subnav button { flex: 0 0 auto; padding: 19px 25px; border: 0; border-right: 1px solid var(--line-dark); background: transparent; color: #514b43; font: 600 11px/1 var(--mono); letter-spacing: .12em; cursor: pointer; }
.academy-subnav button:first-child { border-left: 1px solid var(--line-dark); }
.academy-subnav button:hover { background: #d9d1c2; color: #171714; }
.academy-program-section { border-block: 1px solid var(--line-dark); background: #ddd6ca; }
.program-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; border: 1px solid var(--line-dark); background: var(--line-dark); }
.program-grid article { min-height: 150px; display: flex; flex-direction: column; justify-content: space-between; padding: 23px; background: var(--paper); }
.program-grid span { color: #9b8d73; font: 11px/1 var(--mono); }
.program-grid strong { font: 500 20px/1.45 var(--ko-serif); color: #24211d; }

.location-section { background: #d8d1c5; }
.location-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(44px, 7vw, 110px); align-items: center; }
.location-copy h2 { margin: 0; max-width: 680px; font: 400 clamp(48px, 6vw, 82px)/.92 var(--serif); letter-spacing: -.04em; }
.location-copy > p:not(.section-label) { max-width: 650px; margin: 28px 0 0; color: #4e4941; font: 17px/1.9 var(--ko-serif); }
.location-facts { margin: 40px 0 0; border-top: 1px solid var(--line-dark); }
.location-facts div { display: grid; grid-template-columns: 105px 1fr; gap: 24px; padding: 18px 0; border-bottom: 1px solid var(--line-dark); }
.location-facts dt { color: #81786a; font: 10px/1.4 var(--mono); letter-spacing: .12em; }
.location-facts dd { margin: 0; color: #25221e; font: 14px/1.6 var(--ko-sans); }
.region-map { position: relative; padding: 20px; border: 1px solid rgba(24,24,22,.22); background: #11110f; color: #e8e3d8; overflow: hidden; }
.region-map::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(120deg, rgba(255,255,255,.025), transparent 40%); }
.map-visual { position: relative; border: 1px solid rgba(232,227,216,.12); background: #0f0f0e; aspect-ratio: 16 / 9; overflow: hidden; }
.map-visual > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.88) contrast(1.03) brightness(.95); }
.map-overlay { position: absolute; inset: 0; width: 100%; height: 100%; }
.map-route { fill: none; stroke: rgba(239,225,188,.45); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 12 9; }
.map-route.major { stroke: #d4b06d; stroke-width: 4.5; stroke-dasharray: none; }
.map-route.muted { stroke: rgba(239,225,188,.24); stroke-width: 2.5; }
.map-node { fill: #e8d2a0; stroke: rgba(20,20,18,.75); stroke-width: 5; }
.map-node.campus { fill: #f4e2ba; filter: drop-shadow(0 0 18px rgba(212,176,109,.35)); }
.map-label-card { position: absolute; min-width: 160px; padding: 10px 12px; border: 1px solid rgba(239,225,188,.22); background: rgba(12,12,11,.74); backdrop-filter: blur(10px); box-shadow: 0 18px 30px rgba(0,0,0,.18); }
.map-label-card strong { display: block; color: #f4ead7; font: 600 11px/1.25 var(--mono); letter-spacing: .12em; }
.map-label-card span { display: block; margin-top: 6px; color: #a59880; font: 12px/1.45 var(--ko-sans); }
.map-label-card.campus { left: 34%; top: 14%; min-width: 210px; }
.map-label-card.beverly { left: 17%; top: 44%; }
.map-label-card.west-hollywood { left: 43%; top: 34%; }
.map-label-card.hollywood { left: 62%; top: 22%; }
.map-label-card.downtown { left: 72%; top: 58%; }
.map-route-legend { display: flex; flex-wrap: wrap; gap: 18px 30px; margin-top: 14px; color: #b5a991; font: 11px/1.4 var(--ko-sans); }
.map-route-legend span { display: inline-flex; align-items: center; gap: 10px; }
.map-route-legend .line { width: 34px; height: 0; border-top: 2px dashed rgba(239,225,188,.45); }
.map-route-legend .line.major { border-top-style: solid; border-top-color: #d4b06d; border-top-width: 3px; }
.map-disclaimer { margin-top: 10px; color: #817a70; font: 9px/1 var(--mono); letter-spacing: .13em; text-align: right; }

.campus-directory-section { background: var(--paper); }
.campus-directory { display: grid; grid-template-columns: 1.35fr .65fr; gap: 22px; }
.campus-blueprint { position: relative; min-height: 650px; border: 1px solid var(--line-dark); background: #10100f; overflow: hidden; }
.campus-blueprint::before { content: 'SAINT JUDE CAMPUS / AERIAL DIRECTORY'; position: absolute; left: 22px; top: 18px; z-index: 3; color: rgba(244,234,215,.78); font: 10px/1 var(--mono); letter-spacing: .13em; }
.campus-base { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.campus-blueprint::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,8,8,.08), rgba(8,8,8,.16)); pointer-events: none; }
.campus-overlay { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; }
.campus-road { fill: none; stroke: rgba(242,225,180,.42); stroke-width: 10; stroke-linecap: round; stroke-dasharray: 18 14; }
.campus-road.minor { stroke: rgba(242,225,180,.24); stroke-width: 7; }
.campus-ring { fill: rgba(255,255,255,.04); stroke: rgba(242,225,180,.56); stroke-width: 5; }
.campus-node { position: absolute; z-index: 2; display: flex; align-items: flex-start; gap: 9px; min-width: 160px; padding: 12px 14px; border: 1px solid rgba(242,225,180,.22); border-radius: 14px; background: rgba(12,12,11,.73); backdrop-filter: blur(10px); color: #f0e9dc; text-align: left; cursor: pointer; transition: .22s ease; box-shadow: 0 12px 30px rgba(0,0,0,.18); }
.campus-node b { width: 28px; min-width: 28px; height: 28px; display: grid; place-items: center; border-radius: 999px; background: rgba(212,176,109,.18); color: #f2d9a7; font: 600 11px/1 var(--mono); }
.campus-node span { display: block; padding-top: 2px; font: 600 11px/1.35 var(--mono); letter-spacing: .06em; }
.campus-node:hover, .campus-node.active { background: rgba(29,28,25,.94); border-color: rgba(242,225,180,.42); transform: translateY(-3px); box-shadow: 0 16px 34px rgba(0,0,0,.28); }
.campus-node.active b, .campus-node:hover b { background: #d4b06d; color: #161512; }
.campus-node.glass-hall { left: 37%; top: 17%; }
.campus-node.studio-wing { left: 58%; top: 18%; }
.campus-node.red-room { left: 54%; top: 42%; }
.campus-node.west-field { left: 7%; top: 28%; }
.campus-node.locker-room { left: 17%; top: 48%; }
.campus-node.chapel-theater { left: 61%; top: 67%; }
.campus-node.rooftop-garden { left: 59%; top: 54%; }
.north-mark { position: absolute; z-index: 3; right: 24px; top: 20px; color: rgba(244,234,215,.8); font: 12px/1.25 var(--mono); text-align: center; }
.campus-detail { min-height: 650px; display: flex; flex-direction: column; justify-content: center; padding: 48px; border: 1px solid var(--line-dark); background: #191916; color: var(--paper); }
.campus-detail > span { color: var(--gold); font: 10px/1 var(--mono); letter-spacing: .14em; }
.campus-detail h3 { margin: 34px 0 24px; font: 400 clamp(42px, 5vw, 72px)/.9 var(--serif); }
.campus-detail p { margin: 0; color: #bcb4a7; font: 17px/1.9 var(--ko-serif); }
.campus-detail small { margin-top: 45px; color: #746e64; font: 9px/1.5 var(--mono); letter-spacing: .12em; }

.calendar-section { background: #171714; color: var(--paper); }
.calendar-section .section-label { color: var(--gold); }
.calendar-intro { max-width: 760px; margin: 24px 0 0; color: #9e978b; font: 15px/1.8 var(--ko-sans); }
.calendar-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.calendar-card { position: relative; min-height: 315px; padding: 28px; border: 0; background: #11110f; color: var(--paper); text-align: left; cursor: pointer; overflow: hidden; transition: .22s ease; }
.calendar-card:hover { background: #1c1b17; transform: translateY(-3px); z-index: 1; }
.calendar-number { position: absolute; right: 18px; top: 12px; color: rgba(232,227,216,.07); font: 400 74px/1 var(--serif); }
.calendar-card small { color: var(--gold); font: 500 11px/1 var(--mono); letter-spacing: .14em; }
.calendar-card h3 { max-width: 270px; margin: 72px 0 18px; font: 400 34px/.96 var(--serif); }
.calendar-card p { margin: 0; color: #aaa397; font: 14px/1.8 var(--ko-sans); }
.calendar-card i { position: absolute; left: 28px; right: 28px; bottom: 24px; padding-top: 15px; border-top: 1px solid var(--line); color: #847c70; font: 9px/1 var(--mono); font-style: normal; letter-spacing: .1em; }
.schedule-modal { color: #171714; }
.schedule-dialog { width: min(820px, 95vw); max-height: 90vh; overflow: auto; background: #eee9df; box-shadow: 0 40px 120px rgba(0,0,0,.55); }
.schedule-dialog header { padding: 48px 52px 42px; border-bottom: 1px solid var(--line-dark); background: #1b1b18; color: var(--paper); }
.schedule-dialog header > div { display: flex; justify-content: space-between; gap: 20px; color: var(--gold); font: 500 11px/1 var(--mono); letter-spacing: .13em; }
.schedule-dialog h2 { margin: 34px 0 18px; font: 400 clamp(48px, 7vw, 78px)/.9 var(--serif); }
.schedule-dialog header p { max-width: 640px; margin: 0; color: #b7b0a4; font: 16px/1.8 var(--ko-serif); }
.schedule-dialog-body { padding: 46px 52px 54px; }
.schedule-dialog-body > p { margin: 0; color: #3f3a34; font: 17px/1.9 var(--ko-serif); }
.schedule-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 38px 0; border: 1px solid var(--line-dark); background: var(--line-dark); }
.schedule-meta div { padding: 22px; background: #eee9df; }
.schedule-meta span, .schedule-program > span { display: block; margin-bottom: 11px; color: #83796a; font: 10px/1 var(--mono); letter-spacing: .12em; }
.schedule-meta strong { font: 500 15px/1.45 var(--sans); }
.schedule-program { padding-top: 32px; border-top: 1px solid var(--line-dark); }
.schedule-program ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin: 0; padding: 0; border: 1px solid var(--line-dark); background: var(--line-dark); list-style: none; }
.schedule-program li { padding: 16px 18px; background: #eee9df; color: #2d2924; font: 14px/1.5 var(--ko-sans); }

.signature-label { margin-top: 40px; color: var(--gold); font: 10px/1 var(--mono); letter-spacing: .14em; }
.profile-copy blockquote { margin-top: 17px; font-size: clamp(20px, 2vw, 27px); line-height: 1.65; }
.connection-section { padding-bottom: 0; }
.connection-direction-note { max-width: 900px; margin: 0 0 28px; padding: 18px 20px; border-left: 3px solid var(--profile-accent); background: rgba(255,255,255,.025); color: #aaa397; font: 14px/1.8 var(--ko-sans); }
.connection-direction-note strong { color: #ded8cd; }
.connections { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.connection { min-width: 0; min-height: 280px; display: flex; flex-direction: column; align-items: flex-start; gap: 0; padding: 28px; border: 0; background: var(--bg); color: var(--paper); text-align: left; cursor: pointer; transition: .22s ease; }
.connection:hover { background: #1a1916; transform: translateY(-3px); }
.connection.static { cursor: default; }
.connection.static:hover { transform: none; }
.connection-direction { margin-bottom: 35px; color: var(--profile-accent); font: 600 11px/1.5 var(--ko-sans); }
.connection strong { font: 400 32px/1 var(--serif); }
.connection small { margin-top: 8px; color: #827a6e; font: 11px/1.4 var(--ko-sans); }
.connection p { margin: 25px 0 0; color: #aaa397; font: 15px/1.8 var(--ko-sans); }
.connection i { margin-top: auto; padding-top: 28px; color: #776f64; font: 9px/1 var(--mono); font-style: normal; letter-spacing: .1em; }

@media (max-width: 1240px) {
  .program-grid { grid-template-columns: repeat(3, 1fr); }
  .calendar-grid { grid-template-columns: repeat(3, 1fr); }
  .connections { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 1080px) {
  .academy-subnav { top: 92px; justify-content: flex-start; }
  .location-grid, .campus-directory { grid-template-columns: 1fr; }
  .campus-detail { min-height: 390px; }
  .region-map { padding: 14px; }
  .calendar-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
  .intro-school-sub { letter-spacing: .22em; }
  .academy-subnav { top: 72px; }
  .academy-subnav button { padding: 16px 18px; font-size: 10px; }
  .program-grid { grid-template-columns: repeat(2, 1fr); }
  .program-grid article { min-height: 125px; }
  .location-copy h2 { font-size: 50px; }
  .region-map { padding: 10px; }
  .map-label-card { min-width: 126px; padding: 8px 10px; }
  .map-label-card strong { font-size: 9px; }
  .map-label-card span { font-size: 10px; }
  .campus-blueprint { min-height: 570px; }
  .campus-node { min-width: 122px; padding: 8px 10px; }
  .campus-node b { width: 22px; min-width: 22px; height: 22px; font-size: 10px; }
  .campus-node span { font-size: 8px; }
  .campus-node.glass-hall { left: 31%; top: 16%; }
  .campus-node.studio-wing { left: 54%; top: 18%; }
  .campus-node.red-room { left: 50%; top: 42%; }
  .campus-node.west-field { left: 3%; top: 28%; }
  .campus-node.locker-room { left: 12%; top: 47%; }
  .campus-node.chapel-theater { left: 59%; top: 68%; }
  .campus-node.rooftop-garden { left: 54%; top: 54%; }
  .campus-detail { min-height: 340px; padding: 34px 26px; }
  .calendar-grid { grid-template-columns: 1fr; }
  .calendar-card { min-height: 280px; }
  .schedule-dialog header, .schedule-dialog-body { padding-left: 26px; padding-right: 26px; }
  .schedule-meta, .schedule-program ul { grid-template-columns: 1fr; }
  .connections { grid-template-columns: 1fr; }
  .connection { min-height: 250px; }
}
.connection span.connection-direction { margin-bottom: 35px; color: var(--profile-accent); font: 600 11px/1.5 var(--ko-sans); letter-spacing: 0; }


/* v5 — social network, HaloWire, global modal and copy cleanup */
body.modal-open { overflow: hidden; }
.modal { z-index: 1000; opacity: 0; transition: opacity .18s ease; }
.modal.visible { opacity: 1; }
.modal > *:not(.modal-close) { position: relative; z-index: 1; }
.modal-close { z-index: 1002; }
.schedule-dialog { position: relative; z-index: 1001; }

.social-titlebar { padding: 68px 0 32px; border-bottom: 1px solid rgba(0,0,0,.13); background: #e4e0d8; }
.social-titlebar-inner { display: flex; align-items: end; justify-content: space-between; gap: 36px; }
.social-titlebar h1 { margin: 0; font: 400 clamp(58px, 8vw, 110px)/.82 var(--serif); letter-spacing: -.055em; }
.social-view-tabs { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.social-view-tabs button { padding: 13px 17px; border: 1px solid rgba(0,0,0,.18); background: transparent; color: #49443e; font: 600 10px/1 var(--mono); letter-spacing: .1em; cursor: pointer; }
.social-view-tabs button:hover, .social-view-tabs button.active { background: #161613; color: #eee8dd; border-color: #161613; }
.social-panel { animation: socialPanelIn .28s ease both; }
.social-panel[hidden] { display: none !important; }
@keyframes socialPanelIn { from { opacity: 0; transform: translateY(8px); } }
.social-header { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding-top: 42px; padding-bottom: 26px; }
.social-header h2 { display: inline; margin: 0 12px 0 0; font: 400 35px/1 var(--serif); }
.social-header > div:first-child > span { color: #766f67; font: 13px/1 var(--ko-sans); }
.social-kicker { margin: 0 0 11px; color: #8b7755; font: 10px/1 var(--mono); letter-spacing: .13em; }
.profile-switcher button.active { border-color: #181816; box-shadow: 0 0 0 2px #181816; }
.story-row { display: flex; gap: 28px; padding: 26px 0 30px; border-top: 1px solid rgba(0,0,0,.12); }
.story-item { display: grid; justify-items: center; gap: 9px; }
.story-item > span { width: 70px; height: 70px; padding: 3px; border: 1px solid #9f8d6e; border-radius: 50%; }
.story-item img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; filter: grayscale(.6); }
.story-item small { font: 9px/1 var(--mono); letter-spacing: .08em; color: #635e57; }
.ig-tabs .active { color: #111; }

.halowire-shell { width: min(calc(100% - 38px), 1180px); margin: 54px auto 90px; border: 1px solid #292d31; background: #101215; color: #d8dee3; box-shadow: 0 35px 80px rgba(0,0,0,.2); }
.halowire-header { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 27px 32px; border-bottom: 1px solid #292d31; background: #15181c; }
.halowire-header > div { display: flex; align-items: center; gap: 18px; }
.halo-symbol { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid #748899; border-radius: 50%; color: #a8c3d7; font-size: 22px; }
.halowire-header p { margin: 0 0 5px; color: #70808c; font: 9px/1 var(--mono); letter-spacing: .14em; }
.halowire-header h2 { margin: 0; font: 500 28px/1 var(--sans); letter-spacing: -.03em; }
.halowire-header small { color: #65737e; font: 9px/1 var(--mono); letter-spacing: .12em; }
.halo-trends { display: flex; align-items: center; gap: 10px; padding: 15px 26px; overflow-x: auto; border-bottom: 1px solid #292d31; }
.halo-trends > span { margin-right: 8px; color: #91a2af; font: 9px/1 var(--mono); letter-spacing: .14em; }
.halo-trends button { flex: 0 0 auto; padding: 8px 11px; border: 1px solid #303842; border-radius: 999px; background: #181c21; color: #9fadb8; font: 11px/1 var(--sans); cursor: pointer; }
.halo-layout { display: grid; grid-template-columns: 1fr 260px; }
.halo-feed { border-right: 1px solid #292d31; }
.halo-card { padding: 28px 31px 22px; border-bottom: 1px solid #292d31; }
.halo-card:last-child { border-bottom: 0; }
.halo-meta { display: flex; align-items: center; gap: 12px; color: #697986; font: 10px/1 var(--mono); }
.halo-meta span { color: #b2c1cc; }
.halo-meta i { margin-left: auto; padding: 6px 8px; border: 1px solid #34404a; font-style: normal; }
.halo-card > p { margin: 22px 0; color: #d5dce1; font: 16px/1.8 var(--ko-sans); }
.halo-media { display: grid; place-items: center; min-height: 130px; margin: 20px 0; border: 1px solid #29313a; background: linear-gradient(135deg, #171b20, #111317); color: #52616c; font: 10px/1 var(--mono); letter-spacing: .12em; }
.halo-card footer { display: flex; gap: 22px; color: #687783; font: 10px/1 var(--mono); }
.halo-card footer button { padding: 0; border: 0; background: transparent; color: inherit; cursor: pointer; }
.halo-card footer button.reacted { color: #a9c6d9; }
.halo-poll { display: grid; gap: 9px; margin: 21px 0; }
.halo-poll button { position: relative; display: flex; justify-content: space-between; padding: 15px 16px; overflow: hidden; border: 1px solid #34404a; background: #15191e; color: #b8c3cc; cursor: pointer; }
.halo-poll button i { position: absolute; inset: 0 auto 0 0; width: var(--poll); background: rgba(103,135,158,.12); pointer-events: none; }
.halo-poll button span, .halo-poll button strong { position: relative; z-index: 1; }
.halo-poll button.selected { border-color: #819aae; color: #dce9f2; }
.halo-sidebar { padding: 31px 26px; background: #121519; }
.halo-sidebar > span { color: #657580; font: 9px/1 var(--mono); letter-spacing: .13em; }
.halo-sidebar > strong { display: block; margin-top: 24px; font: 400 48px/1 var(--serif); color: #b5c5d0; }
.halo-sidebar > p { margin: 7px 0 35px; color: #62717c; font: 11px/1 var(--mono); }
.halo-sidebar > div { border-top: 1px solid #29313a; }
.halo-sidebar > div p { display: grid; grid-template-columns: 28px 1fr; gap: 10px; margin: 0; padding: 18px 0; border-bottom: 1px solid #29313a; color: #8c9aa5; font: 12px/1.6 var(--ko-sans); }
.halo-sidebar b { color: #53616b; font: 10px/1.7 var(--mono); }

.deleted-shell { padding-top: 72px; padding-bottom: 100px; }
.deleted-shell header { max-width: 780px; margin-bottom: 48px; }
.deleted-shell h2 { margin: 0; font: 400 clamp(50px, 7vw, 88px)/.9 var(--serif); }
.deleted-shell header > p:last-child { margin-top: 22px; color: #686159; font: 16px/1.8 var(--ko-sans); }
.deleted-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; border: 1px solid rgba(0,0,0,.16); background: rgba(0,0,0,.16); }
.deleted-card { min-height: 330px; display: flex; flex-direction: column; padding: 32px; background: #ded9cf; }
.deleted-status { display: flex; justify-content: space-between; gap: 16px; color: #8b7e6c; font: 9px/1 var(--mono); letter-spacing: .11em; }
.deleted-status strong { color: #771e2c; }
.deleted-card h3 { margin: 75px 0 20px; font: 400 37px/1 var(--serif); }
.deleted-card p { margin: 0; color: #504a43; font: 15px/1.8 var(--ko-sans); }
.deleted-card footer { display: flex; justify-content: space-between; gap: 16px; margin-top: auto; padding-top: 26px; border-top: 1px solid rgba(0,0,0,.12); color: #81796f; font: 9px/1 var(--mono); letter-spacing: .08em; }
.deleted-card footer i { color: #6d2934; font-style: normal; }

.connection-direction-note { background: transparent; padding: 0 0 18px; border-left: 0; border-bottom: 1px solid var(--line); }
.connection-direction { min-height: 38px; }

@media (max-width: 900px) {
  .social-titlebar-inner, .social-header { align-items: flex-start; flex-direction: column; }
  .social-view-tabs { justify-content: flex-start; }
  .halo-layout { grid-template-columns: 1fr; }
  .halo-feed { border-right: 0; }
  .halo-sidebar { border-top: 1px solid #292d31; }
}
@media (max-width: 680px) {
  .social-titlebar { padding-top: 48px; }
  .social-view-tabs { display: grid; grid-template-columns: 1fr; width: 100%; }
  .social-view-tabs button { width: 100%; }
  .story-row { gap: 14px; overflow-x: auto; }
  .story-item > span { width: 58px; height: 58px; }
  .halowire-header { align-items: flex-start; flex-direction: column; }
  .halo-card { padding-inline: 21px; }
  .halo-meta { flex-wrap: wrap; }
  .halo-meta i { margin-left: 0; }
  .deleted-grid { grid-template-columns: 1fr; }
  .deleted-card { min-height: 290px; }
}
.file-card.interactive { cursor: pointer; transition: .2s ease; }
.file-card.interactive:hover { border-color: rgba(136,170,188,.38); background: rgba(136,170,188,.045); transform: translateY(-2px); }

/* v6 — motion system, refined navigation and five-record audio archive */
.main-nav { counter-reset: navitem; }
.main-nav a { display: inline-flex; align-items: center; gap: 7px; }
.main-nav a::before { counter-increment: navitem; content: '0' counter(navitem); color: #6f695f; font-size: 8px; letter-spacing: .04em; transform: translateY(-1px); transition: color .22s ease; }
.main-nav a:hover::before, .main-nav a.active::before { color: var(--gold); }
.topbar { transition: background .28s ease, border-color .28s ease; }
.button { position: relative; overflow: hidden; }
.button::after { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.14), transparent 80%); transform: translateX(-120%); transition: transform .52s ease; }
.button:hover::after { transform: translateX(120%); }
.hero-media img { transform: translate3d(var(--pointer-x, 0), var(--pointer-y, 0), 0) scale(1.025); transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.hero-content { transform: translate3d(calc(var(--pointer-x, 0) * -.22), calc(var(--pointer-y, 0) * -.18), 0); transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.hero-secret { animation: secretPulse 4.8s ease-in-out infinite; }
@keyframes secretPulse { 50% { color: rgba(255,255,255,.38); } }

.reveal { opacity: 0; transform: translateY(22px); transition: opacity .65s ease var(--reveal-delay, 0ms), transform .65s cubic-bezier(.2,.7,.2,1) var(--reveal-delay, 0ms); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.feature-card, .student-card, .calendar-card, .connection, .file-card { transition: transform .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease; }
.feature-card:hover, .student-card:hover { transform: translateY(-5px); box-shadow: 0 24px 55px rgba(0,0,0,.18); }

.archive-page { position: relative; isolation: isolate; }
.archive-page::before { content: ''; position: fixed; inset: 92px 0 0; z-index: -1; pointer-events: none; opacity: .035; background: repeating-linear-gradient(0deg, transparent 0 3px, #9ec1cf 4px); }
.archive-index-summary { display: grid; grid-template-columns: repeat(4, 1fr); margin: 30px 0 0; border: 1px solid rgba(130,154,166,.15); background: rgba(130,154,166,.15); gap: 1px; }
.archive-index-summary > div { min-height: 112px; padding: 22px 24px; background: #0b0d0f; display: flex; flex-direction: column; justify-content: space-between; }
.archive-index-summary span { color: #697980; font: 9px/1 var(--mono); letter-spacing: .14em; }
.archive-index-summary strong { color: #bccad0; font: 400 35px/1 var(--serif); }
.archive-toolbar { display: flex; flex-wrap: wrap; gap: 8px; padding: 28px 0 18px; }
.archive-toolbar button { padding: 10px 13px; border: 1px solid rgba(130,154,166,.23); background: transparent; color: #74828a; font: 500 9px/1 var(--mono); letter-spacing: .12em; cursor: pointer; }
.archive-toolbar button:hover, .archive-toolbar button.active { border-color: #8fa8b4; background: rgba(126,159,174,.1); color: #d5e0e5; }
.call-list { border-top: 1px solid rgba(130,154,166,.15); }
.call-row { grid-template-columns: 92px minmax(280px, 1fr) 74px 74px 170px 28px; min-height: 124px; padding: 20px 0; }
.call-row.filtered-out { display: none; }
.call-row:focus-visible { outline: 1px solid #8fa8b4; outline-offset: 4px; }
.call-title { min-width: 0; }
.call-title small { display: block; margin-bottom: 9px; color: #65747b; font: 9px/1 var(--mono); letter-spacing: .12em; }
.call-title strong { display: block; color: #d8e0e3; font: 400 24px/1.1 var(--ko-serif); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.call-title p { max-width: 680px; margin: 10px 0 0; color: #76848a; font: 12px/1.65 var(--ko-sans); }
.call-duration, .call-date { color: #84939a !important; font-size: 10px !important; }
.call-row .status { font-size: 9px; letter-spacing: .08em; }
.call-row .arrow { align-self: center; }

.player-summary { margin: 20px 0 0; color: #829098; font: 14px/1.8 var(--ko-sans); }
.waveform-header { display: flex; justify-content: space-between; gap: 20px; padding-bottom: 12px; color: #64747b; font: 9px/1 var(--mono); letter-spacing: .1em; }
.waveform-header strong { color: #a8bbc4; font-weight: 500; }
.call-pagination { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 30px; border: 1px solid rgba(130,154,166,.15); background: rgba(130,154,166,.15); }
.call-pagination button { min-height: 112px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; padding: 22px 24px; border: 0; background: #0b0d0f; color: #d5dde1; text-align: left; cursor: pointer; }
.call-pagination button:last-child { align-items: flex-end; text-align: right; }
.call-pagination button:hover { background: rgba(121,153,167,.08); }
.call-pagination span { color: #607078; font: 9px/1 var(--mono); letter-spacing: .12em; }
.call-pagination strong { font: 500 14px/1.55 var(--ko-sans); }
.transcript h3 { font-family: var(--ko-sans); letter-spacing: .08em; }
.transcript-row p { font-family: var(--ko-sans); }

@media (max-width: 1180px) {
  .call-row { grid-template-columns: 82px minmax(240px, 1fr) 70px 150px 28px; }
  .call-date { display: none; }
}
@media (max-width: 840px) {
  .archive-index-summary { grid-template-columns: repeat(2, 1fr); }
  .call-row { grid-template-columns: 72px 1fr 25px; min-height: 112px; }
  .call-duration, .call-date, .call-row .status { display: none; }
  .call-title strong { white-space: normal; font-size: 20px; }
  .call-title p { font-size: 11px; }
  .call-pagination { grid-template-columns: 1fr; }
  .call-pagination button:last-child { align-items: flex-start; text-align: left; }
}
@media (max-width: 680px) {
  .main-nav a::before { font-size: 9px; }
  .archive-index-summary > div { min-height: 96px; padding: 18px; }
  .call-row { grid-template-columns: 62px 1fr 20px; gap: 12px; }
  .call-row .id { font-size: 9px; }
  .call-title small { font-size: 8px; }
  .call-title p { display: none; }
  .waveform-header span:last-child { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

@media (max-width: 900px) {
  .hero-seal { width: 180px; }
  .footer-brand img { width: 44px; }
}
@media (max-width: 640px) {
  .intro-crest { width: 148px; margin-bottom: 24px; }
  .brand-crest { width: 62px; }
  .brand strong { font-size: 22px; }
  .brand small { font-size: 11px; }
  .hero-seal { width: 150px; }
  }

@media (max-width: 1100px) {
  .topbar { height: 114px; grid-template-columns: 400px 1fr auto; }
  #app { min-height: calc(100vh - 114px); }
  .hero { min-height: calc(100vh - 114px); }
}
@media (max-width: 640px) {
  .topbar { height: 96px; grid-template-columns: 1fr auto auto; padding: 0 16px; }
  #app { min-height: calc(100vh - 96px); }
  .hero { min-height: calc(100vh - 96px); }
  .brand { gap: 10px; }
  .brand small { display: block; font-size: 10px; }
}

/* v15 — recovered dialogue transcript presentation */
.transcript { margin-top: 34px; border-top: 1px solid rgba(130,154,166,.18); }
.transcript-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 26px 18px 18px; border-bottom: 1px solid rgba(130,154,166,.18); }
.transcript-heading h3 { margin: 0; color: #dbe3e6; font: 400 30px/1 var(--ko-serif); }
.transcript-heading span { color: #607078; font: 9px/1 var(--mono); letter-spacing: .16em; }
.transcript-row { position: relative; grid-template-columns: 54px 116px 1fr; gap: 22px; padding: 20px 18px; border-bottom: 1px solid rgba(130,154,166,.11); background: linear-gradient(90deg, rgba(124,154,167,.018), transparent 52%); }
.transcript-row::before { content: ''; position: absolute; left: 0; top: 18px; bottom: 18px; width: 2px; background: transparent; transition: .22s ease; }
.transcript-row time { color: #56666d; font: 500 10px/1.7 var(--mono); letter-spacing: .12em; }
.transcript-row strong { color: #9fb5be; font: 600 14px/1.7 var(--ko-sans); }
.transcript-row p { max-width: 780px; color: #c2cbd0; font: 15px/1.85 var(--ko-sans); }
.transcript-row.active { padding-inline: 22px 18px; background: linear-gradient(90deg, rgba(179,154,104,.12), rgba(124,154,167,.055) 42%, transparent); }
.transcript-row.active::before { background: #b39a68; }
.transcript-row.active time { color: #b39a68; }
.transcript-row.active strong, .transcript-row.active p { color: #edf2f3; }

@media (max-width: 760px) {
  .transcript-heading { align-items: flex-start; flex-direction: column; gap: 10px; padding-inline: 12px; }
  .transcript-heading h3 { font-size: 25px; }
  .transcript-row { grid-template-columns: 34px 72px 1fr; gap: 10px; padding: 16px 10px; }
  .transcript-row strong { font-size: 12px; }
  .transcript-row p { font-size: 13px; line-height: 1.75; }
}

/* v17 — transcript timing is synced to detected speech starts */
.transcript-row { cursor: pointer; }
.transcript-row:hover { background: linear-gradient(90deg, rgba(179,154,104,.07), rgba(124,154,167,.03) 46%, transparent); }
.transcript-row time { font-variant-numeric: tabular-nums; }