/* RLCNF Nav Loader — 전역 페이지 이동 로딩 스피너 (design-system.md §3.5.13)
 * 전체 문서 이동(같은 origin) 시 0.5s 지연 후 화면 정중앙 흰 카드 + 스피너.
 * SPA 부분 교체(exam/quick/note 진행)는 문서 이동이 없어 자연 제외 — nav-loader.js 트리거 참조.
 * 토큰 전용. 스피너 시각 스펙은 modal.css .rl-scoring-loader__spinner와 동일(같은 역할 컴포넌트 정합).
 */

/* fixed 풀뷰포트 정중앙. 딤 스크림 없음 → pointer-events:none(순수 시각, 기존 화면 조작 비차단). */
.rl-nav-loader {
    position: fixed;
    inset: 0;
    z-index: 20100; /* 실 스낵바(modal.css:622, 20001) 위 — 이동 중 최상위. 레이어 등록 §2.8.3 */
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    opacity: 0;
    transition: opacity 150ms var(--ease-out);
}
/* [hidden] UA 룰(0,1,0)이 author 클래스 룰(0,1,0)에 cascade에서 짐 — 명시 selector(0,2,0)로 강제. */
.rl-nav-loader[hidden] {
    display: none;
}
.rl-nav-loader.is-shown {
    opacity: 1;
}

.rl-nav-loader__card {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--rl-sp-5);
    border-radius: var(--rl-r-lg);
    background: var(--rl-surface-elev);
    box-shadow: var(--rl-shadow-md);
}

/* 36×36 / 3px stroke — modal.css .rl-scoring-loader__spinner와 동일 출처(머지 게이트 G2 P2 명세 메트릭 허용, §8.5.3·§3.5.13). */
.rl-nav-loader__spinner {
    width: 36px;
    height: 36px;
    border-radius: var(--rl-r-full);
    border: 3px solid var(--rl-line-2);
    border-top-color: var(--rl-primary);
    animation: rl-nav-spin 720ms linear infinite;
}
@keyframes rl-nav-spin {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .rl-nav-loader {
        transition: none;
    }
    .rl-nav-loader__spinner {
        animation: none;
    }
}

/* Dark — surface-elev/line-2/primary 스코프 재정의(modal.css §7.2 동일 hex·동일 패턴, G1 토큰 매핑 예외). */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .rl-nav-loader {
        --rl-surface-elev: #1F2940;
        --rl-line-2: #2A3450;
        --rl-primary: #3B82F6;
    }
}
:root[data-theme="dark"] .rl-nav-loader {
    --rl-surface-elev: #1F2940;
    --rl-line-2: #2A3450;
    --rl-primary: #3B82F6;
}
