@font-face {
  font-family: Geist;
  src: url('/fonts/Geist-1.7.2.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Pretendard;
  src: url('/fonts/Pretendard-1.3.9.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: dark;
  font-family: Geist, Pretendard, -apple-system, sans-serif;
  font-synthesis: none;
  background: #080e13;
  color: #edf2f3;
  --background: #080e13;
  --text: #edf2f3;
  --muted: #a3b1ba;
  --accent: #b9e5d4;
  --line: #d5e6ed24;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ambient-x: 0px;
  --ambient-y: 0px;
  --hero-y: 0px;
  --aside-y: 0px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-gutter: stable; }
body { margin: 0; isolation: isolate; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
::selection { background: #c8f1df; color: #10211f; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; }
.container { width: min(1180px, calc(100% - 96px)); margin-inline: auto; }
main, .site-footer { position: relative; z-index: 1; }
.page-shell { position: relative; z-index: 1; transition: filter 360ms ease; }
.skip-link { position: absolute; top: -60px; left: 16px; z-index: 60; padding: 12px; background: var(--text); color: var(--background); }
.skip-link:focus { top: 8px; }

/* A fixed, layered atmosphere: the fields drift independently of scroll depth. */
.ambient { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; background: #080e13; }
.ambient-parallax { position: absolute; inset: -12%; transform: translate3d(var(--ambient-x), var(--ambient-y), 0); will-change: transform; }
.ambient-blob { position: absolute; filter: blur(68px); border-radius: 50%; will-change: transform; animation-direction: alternate; animation-iteration-count: infinite; animation-timing-function: ease-in-out; }
.ambient-blob--one { width: 65vw; height: 72vh; top: -15%; right: -12%; background: radial-gradient(ellipse, #327881a6, #3e687440 48%, transparent 72%); animation-name: drift-one; animation-duration: 19s; }
.ambient-blob--two { width: 66vw; height: 90vh; left: -32%; top: 18%; background: radial-gradient(ellipse, #384476a6, #283a7347 45%, transparent 70%); animation-name: drift-two; animation-duration: 24s; animation-delay: -9s; }
.ambient-blob--three { width: 69vw; height: 91vh; bottom: -45%; right: -4%; background: radial-gradient(ellipse, #69938970, #53768738 46%, transparent 72%); animation-name: drift-three; animation-duration: 22s; animation-delay: -13s; }
.ambient-blob--four { width: 60vw; height: 28vh; top: 28%; left: 40%; background: radial-gradient(ellipse, #acc4c633, transparent 70%); animation-name: drift-four; animation-duration: 17s; animation-delay: -6s; }
.ambient::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 48% 38%, transparent 25%, #050a0e55 100%), linear-gradient(90deg, #080e134d, transparent 68%); }
.ambient-grain { position: absolute; inset: 0; z-index: 1; background: url('/grain.svg'); opacity: .055; mix-blend-mode: soft-light; }
@keyframes drift-one { 0% { transform: translate3d(-6%, -8%, 0) rotate(-18deg) scale(1); } 50% { transform: translate3d(-22%, 22%, 0) rotate(8deg) scale(1.16, .87); } 100% { transform: translate3d(6%, 38%, 0) rotate(25deg) scale(.9, 1.1); } }
@keyframes drift-two { 0% { transform: translate3d(0, -10%, 0) rotate(25deg) scale(1); } 100% { transform: translate3d(40%, 18%, 0) rotate(-18deg) scale(1.2, .85); } }
@keyframes drift-three { 0% { transform: translate3d(15%, 5%, 0) rotate(-10deg); } 50% { transform: translate3d(-18%, -32%, 0) rotate(12deg) scale(.85, 1.1); } 100% { transform: translate3d(-40%, -10%, 0) rotate(32deg) scale(1.2); } }
@keyframes drift-four { 0% { transform: rotate(-38deg) translate3d(-10%, -12%, 0) scale(.9); } 100% { transform: rotate(-12deg) translate3d(-40%, 75%, 0) scale(1.5, .8); } }

.site-header { position: sticky; top: 0; z-index: 20; background: #080e1385; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-bottom: 1px solid #d5e6ed12; }
.header-inner { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.site-title { font-size: 15px; letter-spacing: -.025em; font-weight: 620; white-space: nowrap; }
.header-nav { display: flex; align-items: center; gap: 28px; color: #c1cdd3; font-size: 12px; }
.header-nav a { padding-block: 12px; transition: color .2s; }
.header-nav a:hover { color: #fff; }
.motion-toggle { display: inline-flex; align-items: center; gap: 7px; padding: 8px 0 8px 23px; border: 0; border-left: 1px solid var(--line); background: none; color: var(--muted); font-size: 11px; }
.motion-toggle:hover { color: var(--accent); }
.motion-toggle:disabled { cursor: default; }
.motion-symbol { display: block; width: 7px; height: 8px; border-inline: 2px solid currentColor; }
.motion-paused .motion-symbol { width: 0; height: 0; border: 4px solid transparent; border-left: 6px solid currentColor; margin-right: -3px; }

.hero { position: relative; overflow: clip; }
.hero-inner { min-height: min(760px, calc(100svh - 84px)); display: grid; grid-template-columns: minmax(0, 1fr) 265px; align-items: center; gap: 56px; padding-block: 104px 124px; }
.hero-copy { transform: translate3d(0, var(--hero-y), 0); }
.eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 31px; color: #b1c8cf; font-size: 10px; letter-spacing: .065em; font-weight: 500; }
.semester-mark { width: 5px; height: 5px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 12px #b9e5d455; }
.eyebrow-divider { color: #607784; margin-inline: 2px; }
.hero h1 { margin: 0; font-size: clamp(56px, 6.5vw, 92px); letter-spacing: -.065em; line-height: 1.12; font-weight: 590; }
.hero-title-line { display: block; white-space: nowrap; }
.hero-title-last { display: flex; align-items: baseline; margin-top: 6px; }
.title-dot { color: var(--accent); font-weight: 400; margin-left: 2px; }
.hero-title-en { margin-left: 32px; color: #b6ced0; font-size: clamp(9px, .9vw, 12px); font-weight: 420; line-height: 1.65; letter-spacing: .07em; }
.hero-description { margin: 29px 0 0; color: #abbcc6; font-size: 14px; line-height: 1.9; font-weight: 380; }
.hero-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 40px; margin-top: 32px; padding: 15px 21px; border: 1px solid #d4e8eb4d; border-radius: 50px; background: #d4e8eb0d; font-size: 12px; font-weight: 500; transition: background .3s, border-color .3s, transform .3s var(--ease-out); }
.hero-link span { font-size: 17px; color: var(--accent); transition: transform .3s var(--ease-out); }
.hero-link:hover { background: #d4e8eb1c; border-color: #d4e8eb80; transform: translateY(-2px); }
.hero-link:hover span { transform: translate(2px, -2px); }
.hero-side { margin-top: 130px; transform: translate3d(0, var(--aside-y), 0); }
.hero-side-label { display: flex; justify-content: space-between; align-items: center; padding-bottom: 21px; border-bottom: 1px solid #c4e1e14d; color: #b1cacc; font-size: 9px; letter-spacing: .16em; }
.hero-side-label span { font-size: 18px; font-weight: 300; }
.hero-side-row { display: flex; justify-content: space-between; gap: 12px; padding-block: 18px; border-bottom: 1px solid var(--line); font-size: 12px; }
.hero-side-row span { color: var(--muted); }
.hero-side-row strong { font-size: 12px; font-weight: 500; text-align: right; }

.section, .contact-section { scroll-margin-top: 110px; }
.materials-section { padding-block: 80px 106px; background: linear-gradient(#080e1326, #080e1366); border-top: 1px solid var(--line); }
.notices-section { padding-block: 89px 110px; border-top: 1px solid var(--line); background: #080e1338; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 39px; }
.section-kicker { margin: 0 0 18px; color: #93b6b5; font-size: 10px; letter-spacing: .15em; font-weight: 460; }
.section-heading h2, .contact-inner h2 { margin: 0 0 15px; font-size: 42px; line-height: 1.25; letter-spacing: -.045em; font-weight: 510; }
.heading-dot { color: var(--accent); margin-left: 3px; }
.section-description { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; font-weight: 380; }
.section-count { color: var(--muted); font-size: 11px; white-space: nowrap; padding-bottom: 4px; }
.section-count strong { color: #e0ebe8; font-weight: 550; }
.search-bar { display: flex; align-items: center; gap: 24px; min-height: 60px; padding: 12px 21px; border: 1px solid #d5e6ed24; border-radius: 10px; margin-bottom: 27px; background: #e1eeef05; transition: border-color .25s, background .25s, box-shadow .25s; }
.search-label { flex: none; color: #e3ebee; font-size: 12px; font-weight: 500; }
.search-input-wrap { flex: 1; min-width: 0; padding-left: 22px; border-left: 1px solid var(--line); }
.search-input-wrap input { width: 100%; min-width: 0; padding: 5px 0; border: 0; outline: 0; color: var(--text); background: transparent; font-size: 13px; }
.search-input-wrap input::placeholder { color: #889ba6; }
.search-bar:focus-within { border-color: #b9e5d47a; background: #e1eeef0a; box-shadow: 0 0 0 3px #b9e5d409; }
.materials-list, .notice-board { border-top: 1px solid #d5e6ed4d; }
.material-row { position: relative; display: grid; grid-template-columns: 60px minmax(0, 1fr) 120px 185px; align-items: center; gap: 17px; min-height: 141px; padding: 27px 10px; border-bottom: 1px solid var(--line); transition: background .35s; }
.material-row:hover { background: #e1eeef05; }
.material-number { color: #96b9b9; font-size: 29px; font-weight: 300; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.material-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 13px; color: var(--muted); font-size: 10px; }
.material-tags .tag-muted { color: #c3d8ce; }
.material-main h3 { margin: 11px 0 7px; font-size: 19px; line-height: 1.4; letter-spacing: -.025em; font-weight: 510; }
.material-main p { margin: 0; color: var(--muted); font-size: 12px; font-weight: 360; line-height: 1.5; }
.material-time { display: flex; flex-direction: column; gap: 7px; white-space: nowrap; }
.material-time span { color: #99aab5; font-size: 10px; }
.material-time strong { font-size: 12px; font-weight: 430; font-variant-numeric: tabular-nums; }
.material-actions { display: flex; justify-content: flex-end; align-items: center; gap: 17px; font-size: 11px; white-space: nowrap; }
.text-link { color: #becbd2; padding-block: 10px; }
.text-link:hover { color: #fff; }
.download-link { padding: 11px 13px; border: 1px solid #d5e6ed33; border-radius: 7px; color: #d0e9dd; transition: border-color .25s, background .25s; }
.download-link:hover { border-color: #b9e5d480; background: #b9e5d412; }
.empty-state { margin: 0; padding: 38px 10px; color: var(--muted); text-align: center; font-size: 13px; border-bottom: 1px solid var(--line); }
.material-footnote { margin: 21px 0 0; color: #90a3ad; font-size: 11px; line-height: 1.8; }
.notice-row { display: grid; grid-template-columns: 70px minmax(0, 1fr) 80px; align-items: center; gap: 15px; width: 100%; padding: 26px 12px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--text); text-align: left; transition: background .3s; }
.notice-row:hover { background: #e1eeef08; }
.notice-badge { color: var(--accent); font-size: 11px; }
.notice-title { font-size: 15px; font-weight: 480; }
.notice-week { display: flex; justify-content: end; align-items: center; gap: 22px; color: #9aacb7; font-size: 11px; }
.notice-week span { font-size: 18px; color: var(--accent); transition: transform .35s var(--ease-out); }
.notice-row:hover .notice-week span { transform: translate(3px, -3px); }

.contact-section { padding-block: 102px 111px; border-top: 1px solid var(--line); }
.contact-inner { display: flex; justify-content: space-between; align-items: center; gap: 50px; }
.contact-inner h2 { font-size: 49px; }
.contact-inner p:not(.section-kicker) { color: var(--muted); font-size: 13px; line-height: 1.8; margin: 0; }
.contact-details { min-width: 340px; display: flex; flex-direction: column; gap: 17px; }
.contact-details strong { margin-bottom: 7px; color: #c5d8d8; font-size: 13px; font-weight: 500; }
.contact-details a { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: max-content; color: #dce7e9; font-size: 17px; font-weight: 400; letter-spacing: -.01em; }
.contact-details a:first-of-type { font-size: 23px; letter-spacing: -.04em; }
.contact-details a span { color: var(--accent); font-size: 22px; transition: transform .3s; }
.contact-details a:hover { color: #fff; }
.contact-details a:hover span { transform: translate(3px, -3px); }
.site-footer { border-top: 1px solid var(--line); }
.footer-inner { display: flex; justify-content: space-between; gap: 20px; padding-block: 28px; color: #91a4ae; font-size: 10px; font-weight: 380; }

/* Blur the page surface itself: consistent even when backdrop filtering is unavailable. */
html.modal-open { overflow: hidden; }
.modal-veil { position: fixed; inset: 0; z-index: 40; pointer-events: none; opacity: 0; background: #03090d66; transition: opacity 360ms ease; }
.modal-active .modal-veil { opacity: 1; }
.modal-active .page-shell { filter: blur(9px); }
dialog { width: min(520px, calc(100% - 40px)); max-height: calc(100svh - 48px); padding: 0; border: 1px solid #abcac44d; border-radius: 18px; background: linear-gradient(145deg, #223536, #111c25 80%); color: var(--text); box-shadow: 0 32px 100px #0009, inset 0 1px #d9f6f30a; opacity: 0; transform: translateY(14px) scale(.97); filter: blur(5px); transition: opacity 360ms ease, transform 360ms var(--ease-out), filter 360ms ease; }
dialog::backdrop { background: transparent; }
dialog.is-visible { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
.dialog-top { display: flex; justify-content: space-between; align-items: center; padding: 23px 29px; border-bottom: 1px solid var(--line); color: #aecfc7; font-size: 10px; letter-spacing: .1em; }
.dialog-top button { width: 29px; height: 29px; border: 1px solid var(--line); border-radius: 50%; background: #d9f6f305; color: #c5d8dc; font-size: 22px; font-weight: 300; line-height: 1; }
.dialog-top button:hover { color: #fff; background: #d9f6f310; }
dialog h2 { margin: 0; padding: 32px 29px 42px; font-size: 22px; line-height: 1.55; letter-spacing: -.035em; font-weight: 500; }
.will-reveal { transition: opacity .8s ease, transform .8s var(--ease-out); }
.motion-enabled .will-reveal:not(.is-revealed) { opacity: 0; transform: translateY(20px); }
.motion-paused .ambient-blob, .page-hidden .ambient-blob { animation-play-state: paused; }
.motion-paused .ambient-parallax, .motion-paused .hero-copy, .motion-paused .hero-side { transform: none; }
.motion-paused { scroll-behavior: auto; }
.motion-paused .will-reveal { transition: none; }

@media (max-width: 1050px) {
  .hero-inner { gap: 30px; grid-template-columns: minmax(0, 1fr) 220px; }
  .hero h1 { font-size: clamp(47px, 6.7vw, 72px); }
  .hero-title-en { margin-left: 22px; font-size: 9px; }
  .material-row { grid-template-columns: 46px minmax(0, 1fr) 100px 166px; gap: 12px; }
  .material-main h3 { font-size: 17px; }
  .material-actions { gap: 13px; }
  .download-link { padding-inline: 10px; }
}
@media (max-width: 760px) {
  .container { width: calc(100% - 44px); }
  .header-inner { min-height: 72px; gap: 16px; flex-wrap: wrap; padding-block: 15px; }
  .site-title { font-size: 13px; }
  .header-nav { gap: 18px; font-size: 11px; }
  .motion-toggle { padding-left: 15px; font-size: 10px; }
  .hero-inner { grid-template-columns: 1fr; gap: 62px; padding-block: 70px 72px; min-height: auto; }
  .hero h1 { font-size: clamp(40px, 9.5vw, 69px); }
  .eyebrow { gap: 8px; font-size: 9px; margin-bottom: 25px; }
  .hero-title-en { font-size: 9px; margin-left: 28px; }
  .hero-description { font-size: 13px; margin-top: 26px; }
  .hero-link { margin-top: 27px; padding: 13px 19px; font-size: 11px; }
  .hero-side { margin-top: 0; width: 100%; max-width: 500px; }
  .hero-side-row { padding-block: 15px; }
  .hero-side-label { padding-bottom: 16px; }
  .materials-section, .notices-section { padding-block: 67px 76px; }
  .section-heading h2 { font-size: 34px; }
  .section-heading { align-items: start; gap: 16px; margin-bottom: 30px; }
  .section-count { margin-top: 42px; font-size: 10px; }
  .section-description { font-size: 12px; }
  .search-bar { gap: 15px; padding-inline: 15px; min-height: 55px; }
  .search-label { font-size: 11px; }
  .search-input-wrap { padding-left: 15px; }
  .search-input-wrap input { font-size: 12px; }
  .material-row { grid-template-columns: 36px minmax(0, 1fr); gap: 11px; padding: 25px 3px; }
  .material-number { align-self: start; font-size: 23px; padding-top: 1px; }
  .material-main h3 { margin-block: 9px 7px; font-size: 17px; }
  .material-time { grid-column: 2; flex-direction: row; gap: 9px; align-items: center; }
  .material-time strong { font-size: 11px; }
  .material-actions { grid-column: 2; justify-content: start; gap: 23px; margin-top: 2px; }
  .material-tags { font-size: 10px; gap: 10px; }
  .notice-row { grid-template-columns: 42px minmax(0, 1fr); gap: 8px; padding: 22px 4px; }
  .notice-title { font-size: 13px; line-height: 1.7; }
  .notice-week { display: none; }
  .contact-section { padding-block: 73px 86px; }
  .contact-inner { display: block; }
  .contact-inner h2 { font-size: 38px; }
  .contact-inner p:not(.section-kicker) { font-size: 12px; }
  .contact-details { margin-top: 42px; min-width: 0; }
  .contact-details a:first-of-type { font-size: 22px; }
  .footer-inner { font-size: 9px; }
  .ambient-blob { filter: blur(46px); }
  .ambient-blob--one { width: 130vw; height: 60vh; right: -55%; top: -5%; }
  .ambient-blob--two { width: 135vw; left: -75%; }
  .ambient-blob--three { width: 150vw; right: -65%; }
  .ambient-blob--four { display: none; }
  dialog h2 { font-size: 20px; padding: 27px 23px 35px; }
  .dialog-top { padding-inline: 23px; }
}
@media (max-width: 540px) {
  .header-inner { justify-content: center; gap: 12px; }
  .site-title { width: 100%; text-align: center; font-size: 12px; }
  .header-nav { width: 100%; justify-content: space-between; }
  .hero-title-en { font-size: 8px; letter-spacing: .04em; margin-left: 25px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition-duration: 0s !important; }
  .ambient-parallax, .hero-copy, .hero-side, .will-reveal { transform: none !important; opacity: 1 !important; }
}