
.reading-progress{position:fixed;top:0;left:0;right:0;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:left;z-index:150;pointer-events:none}
.section-compass{display:flex;align-items:center;justify-content:center;gap:10px;padding:25px 20px;flex-wrap:wrap;background:var(--bg);border-bottom:1px solid var(--line)}.section-compass a{border:1px solid var(--line);border-radius:30px;padding:9px 17px;font-size:12px;transition:background .2s,color .2s,transform .2s}.section-compass a:hover,.section-compass a[aria-current]{background:var(--accent);color:var(--on-accent)}.section-compass a:hover{transform:translateY(-3px)}
.site-nav a[aria-current]{text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:2px}
.hook-title{position:relative}.hook-title:after{content:'';display:block;width:52px;height:3px;background:currentColor;margin-top:25px;transform-origin:left;animation:hook-line 1s ease-out both}
@keyframes hook-line{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.motion-enter{animation:section-arrive .75s cubic-bezier(.2,.65,.3,1) both}@keyframes section-arrive{from{opacity:.25;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
.btn,.event-story,.image-button,.play-item svg{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}.image-button{overflow:hidden}.image-button img{transition:transform .65s cubic-bezier(.2,.6,.3,1),filter .4s}.btn:hover{transform:translateY(-3px);box-shadow:0 8px 22px #0002}.btn:active{transform:translateY(0)}.image-button:hover img{transform:scale(1.045)}.event-story:hover{transform:translateY(-4px)}.play-item:hover svg{transform:rotate(-8deg) scale(1.08)}
.ambient-hero{position:relative;isolation:isolate}.ambient-hero:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 350px 240px at var(--light-x,60%) var(--light-y,30%),color-mix(in srgb,var(--accent) 13%,transparent),transparent 75%)}
.back-to-top{position:fixed;right:20px;bottom:125px;z-index:45;width:44px;height:44px;border-radius:50%;background:var(--accent);color:var(--on-accent);box-shadow:0 4px 20px #0002;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .2s,transform .2s,visibility .2s}.back-to-top.is-visible{opacity:1;visibility:visible;transform:none}
@media(hover:none){.image-button:hover img,.event-story:hover,.btn:hover{transform:none;box-shadow:none}}@media(max-width:640px){.section-compass{gap:8px;padding:20px 16px}.section-compass a{font-size:11px;padding:8px 12px}.back-to-top{right:14px;bottom:135px;width:38px;height:38px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation:none!important;transition:none!important}.image-button:hover img,.event-story:hover,.btn:hover,.play-item:hover svg{transform:none}.ambient-hero:after{display:none}}

/* 2026-09-16 모바일 섹션 바로가기: 3×2 격자, 칩 크기 동일 */
@media(max-width:640px){.section-compass{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:18px 16px}.section-compass a{display:flex;align-items:center;justify-content:center;min-height:42px;padding:8px 6px;text-align:center;white-space:nowrap}}
