@font-face {
  font-family: 'Pretendard Variable';
  font-style: normal;
  font-weight: 45 920;
  font-display: swap;
  src: url('../fonts/PretendardVariable.woff2') format('woff2');
}
:root { --ink: #363636; --muted: #65707c; --blue: #1686c9; --line: #e2e6eb; }
html { scroll-behavior: smooth; scroll-padding-top: 1.5rem; }
body { font-family: 'Pretendard Variable', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color: var(--ink); line-height: 1.75; -webkit-font-smoothing: antialiased; }
[hidden] { display: none !important; }
html[lang="ko"] body { word-break: keep-all; overflow-wrap: anywhere; }
a { color: var(--blue); }
a:hover { color: #126b9d; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid #1686c9; outline-offset: 4px; }
.skip-link { position: absolute; top: -80px; left: 1rem; z-index: 100; background: white; padding: .65rem 1rem; }
.skip-link:focus { top: .5rem; }
.navbar { min-height: 3.6rem; border-bottom: 1px solid #f2f3f5; }
.navbar > .container.nav-inner { display: flex; align-items: center; gap: 1rem; min-height: 3.6rem; padding: 0 1.5rem; }
.home-link { display: inline-flex; align-items: center; gap: .5rem; color: #525960; font-size: .9rem; }
.nav-links { display: flex; gap: 1.6rem; margin-left: auto; font-size: .9rem; }
.nav-links a { color: #525960; }
.language-switch { display: flex; gap: 2px; padding: 3px; border: 1px solid #dbdbdb; border-radius: 999px; margin-left: 1.4rem; }
.language-switch button { font: inherit; font-size: .8rem; font-weight: 600; border: 0; padding: .22rem .65rem; color: #555; border-radius: 999px; background: transparent; cursor: pointer; }
.language-switch button[aria-pressed="true"] { color: white; background: #363636; }
.publication-header .hero-body { padding: 3.4rem 1.5rem 2.25rem; }
.eyebrow { font-size: .77rem; font-weight: 650; letter-spacing: .14em; text-transform: uppercase; color: #818892; margin-bottom: 1rem; }
.publication-title.title { margin: 0 auto 1.35rem; font-size: clamp(2rem, 4vw, 3.15rem); line-height: 1.18; letter-spacing: -.035em; font-weight: 700; text-wrap: balance; }
.publication-authors { line-height: 1.6; }
.author-block { display: inline-block; }
.publication-authors a:hover { text-decoration: underline; }
.advisor-label { color: #78818d; font-size: .78em; white-space: nowrap; }
.hero-description { color: #737b85; font-size: 1.12rem; margin-top: 1.15rem; }
.section { padding: 1.6rem 1.5rem; }
.overview-section { padding-top: .9rem; }
.overview-copy { max-width: 860px; margin: 0 auto; }
.title.is-3 { font-size: 1.8rem; letter-spacing: -.025em; font-weight: 650; line-height: 1.35; }
.content p { font-size: 1rem; line-height: 1.85; color: #515963; }
.content strong { color: #343c46; font-weight: 600; }
.control-flow { margin: 1.7rem 0 .3rem; border: 1px solid var(--line); border-radius: 12px; background: #fafbfd; padding: 1.1rem 1.5rem 1.05rem; }
.flow-lane { color: var(--blue); font-size: .82rem; font-weight: 600; text-align: center; }
.return-lane { color: #65707c; }
.flow-nodes { display: grid; grid-template-columns: 1fr 24px 1fr 24px 1fr; align-items: center; gap: .75rem; margin: .9rem 0; }
.flow-node { background: #fff; border: 1px solid #e5e8ed; border-radius: 8px; min-height: 260px; padding: .75rem .7rem 1rem; text-align: center; display: flex; flex-direction: column; justify-content: center; }
.flow-illustration { display: block; width: 100%; max-width: 250px; height: 175px; margin: .25rem auto .55rem; object-fit: contain; }
.flow-node strong { font-size: 1rem; font-weight: 600; }
.flow-node > span:not(.node-number) { font-size: .79rem; color: #69737e; }
.node-number { font-size: .67rem; font-weight: 650; letter-spacing: .08em; color: #9ba6b1; }
.flow-arrow { color: #8b99a5; font-size: 1.4rem; text-align: center; }
figcaption { margin-top: .65rem; text-align: center; color: #626b76; font-size: .91rem; line-height: 1.65; }
.control-flow figcaption { font-size: .82rem; margin-top: .75rem; }
.research-section { padding: 1.1rem 1.5rem; }
.section-intro { color: #64707b; margin: .75rem 0 1.25rem; line-height: 1.75; }
.content .section-intro { font-size: 1.05rem; }
.demo-video { margin: 1.25rem 0 .8rem; }
.demo-note { display: flex; align-items: flex-start; gap: .8rem; margin-top: 1.15rem; padding: .9rem 1.15rem; border: 1px solid #ecd9b4; border-left: 4px solid #cb973a; border-radius: 7px; background: #fff8eb; color: #6f562d; }
.demo-note svg { flex: 0 0 auto; color: #b8862c; margin-top: .25rem; }
.demo-note p { font-size: .91rem; line-height: 1.75; }
.demo-note strong { color: #815b1f; font-weight: 650; }
.presentation-section { padding: .7rem 1.5rem 1.3rem; }
.presentation-card { border: 1px solid #dfe7ef; border-radius: 10px; background: #f8fbfe; padding: 1.25rem 1.5rem; }
.presentation-label { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; color: #6b7988; font-size: .82rem; }
.conference-badge { background: #e5f1fb; color: #1b77b3; border-radius: 5px; padding: .15rem .5rem; font-weight: 650; }
.presentation-label time { margin-left: auto; color: #84909e; font-size: .8rem; }
.presentation-heading { font-size: 1.15rem; font-weight: 650; color: #384755; line-height: 1.5; margin: .85rem 0 .5rem; }
.presentation-session { font-size: .92rem; color: #667383; line-height: 1.8; }
.presentation-session strong { font-weight: 550; color: #52677c; }
.program-source { display: inline-block; font-size: .82rem; margin-top: .65rem; }
video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border-radius: 9px; background: #111; }
.research-toggle { border: 1px solid #dce1e7; border-radius: 11px; overflow: hidden; }
.research-toggle > summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .95rem 1.3rem; cursor: pointer; list-style: none; background: #f8f9fb; }
.research-toggle > summary::-webkit-details-marker { display: none; }
.research-toggle > summary:hover { background: #f0f3f6; }
.principle-label { font-weight: 600; font-size: 1.1rem; }
.principle-icon { font-size: 1.4rem; color: #838c96; transition: transform .2s; }
.research-toggle[open] > summary .principle-icon { transform: rotate(180deg); }
.principle-content { padding: .3rem 1.3rem 1.3rem; }
.notation-note { border: 1px solid #e7ebf0; border-radius: 7px; padding: .9rem 1rem; font-size: .88rem; color: #626d79; line-height: 1.8; }
.math-block { margin: 1.25rem 0; padding: 1.25rem 1.4rem; background: #f5f7fa; border-left: 4px solid var(--blue); border-radius: 7px; }
.math-title { display: flex; align-items: baseline; gap: .7rem; font-size: 1.04rem; font-weight: 650; line-height: 1.6; margin-bottom: .5rem; }
.equation-number { color: #99a6b4; font-size: .74rem; font-weight: 500; letter-spacing: .05em; flex: 0 0 auto; }
.math-eq { text-align: center; margin: .9rem 0; overflow-x: auto; overflow-y: hidden; padding: .2rem 0; max-width: 100%; font-size: 1rem; }
.math-eq mjx-container[display="true"] { margin: .5em 0 !important; }
.math-desc { font-size: .93rem; color: #58636f; line-height: 1.8; }
.friction-detail { border-top: 1px solid #e4e8ed; margin: 1.6rem 0 1rem; padding-top: 1rem; }
.friction-detail > summary { color: #505d6b; font-size: .95rem; font-weight: 600; cursor: pointer; }
.friction-detail .math-eq { font-size: .94rem; }
.footer { margin-top: 2.1rem; padding: 2.5rem 1.5rem; background: #fafafa; color: #737b86; font-size: .9rem; }
.footer-project { font-weight: 600; color: #444e59; margin-bottom: .5rem; }
.footer-separator { padding: 0 .7rem; color: #b4bcc5; }
.template-credit { font-size: .77rem; margin-top: 1.4rem; color: #8b949e; }
html[lang="ko"] .publication-title.title { line-height: 1.3; font-size: clamp(1.85rem, 3.6vw, 2.8rem); }
html[lang="ko"] .eyebrow { letter-spacing: .06em; }
@media (max-width: 600px) {
  .navbar > .container.nav-inner { padding: 0 1rem; gap: .6rem; }
  .home-link { font-size: .8rem; }
  .nav-links { gap: .85rem; font-size: .8rem; }
  .language-switch { margin-left: .3rem; }
  .publication-header .hero-body { padding: 2.4rem 1.25rem 1.7rem; }
  .publication-title.title { font-size: 2rem; }
  .publication-authors.is-size-5 { font-size: 1rem !important; }
  .hero-description { font-size: .98rem; }
  .eyebrow { font-size: .68rem; letter-spacing: .08em; }
  .section, .research-section, .presentation-section { padding-left: 1rem; padding-right: 1rem; }
  .title.is-3 { font-size: 1.5rem; }
  .content p, .content .section-intro { font-size: .96rem; }
  .control-flow { padding: 1rem .75rem; }
  .flow-nodes { grid-template-columns: 1fr; gap: .35rem; }
  .flow-node { min-height: auto; padding: .55rem; }
  .flow-illustration { height: 150px; margin: .1rem auto .3rem; }
  .flow-arrow { transform: rotate(90deg); line-height: 1; }
  .flow-node > span:not(.node-number) { font-size: .82rem; }
  .principle-content { padding: .2rem .8rem 1rem; }
  .principle-label { font-size: .96rem; }
  .research-toggle > summary { padding: .85rem 1rem; }
  .math-block { padding: 1rem .8rem; }
  .math-eq { font-size: .86rem; }
  .math-title { font-size: .98rem; gap: .5rem; }
  .math-desc { font-size: .9rem; }
  figcaption { font-size: .86rem; }
  .demo-note { padding: .8rem .85rem; gap: .6rem; }
  .demo-note p { font-size: .87rem; }
  .presentation-card { padding: 1rem; }
  .presentation-heading { font-size: 1.03rem; }
  .presentation-session { font-size: .89rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .principle-icon { transition: none; }
}