/* 이 파일은 v3 전용. 루트 styles.css 는 건드리지 않는다.
   출처: ohSorryWeb/scratchpad/v3-T1-report.md §1 · §2 */

:root {
  /* 배경 */
  --v3-bg-page: #1a1a1a;
  --v3-bg-panel: #1f1f1f;
  --v3-bg-surface: #2d2d2d;
  --v3-bg-surface-hover: #232830;
  --v3-bg-surface-raised: #2d323c;
  --v3-bg-surface-muted: #3a3f47;
  --v3-bg-row-gap: #14171c;
  --v3-bg-input: #1a1d22;
  --v3-bg-search: #1c2027;
  --v3-bg-search-item-hover: #2a2f37;
  --v3-bg-row: rgb(31, 31, 31);
  /* 닫힌 폴더 박스 배경 — v1 styles.css:2047 `.__uprofile_pdfolder` 의 rgb(38,38,38) 실측.
     🔴 --v3-bg-row(rgb(31,31,31)) 도 --v3-bg-surface(#2d2d2d) 도 아닌 제3의 값이다.
     PD-7 의 「C1~C5 새 토큰 0개」를 세 번째로 반증한 자리다(§1.2.5 「폴더 박스」). */
  --v3-bg-folder: rgb(38, 38, 38);
  /* Persona head 배너 배경 — v1 report.js 의 rgba(255,107,157,.08) 실측.
     --v3-accent(#ff6b9d) 에 알파 8%. 새 색이 아니라 기존 accent 의 옅은 판이다. */
  --v3-bg-accent-soft: rgba(255, 107, 157, 0.08);

  /* 경계 */
  --v3-border-default: #343a40;
  --v3-border-subtle: #2d323c;
  --v3-border-strong: #495057;
  --v3-border-light: #c8c8c8;
  --v3-border-scrollbar: #4a4a4a;

  /* 브랜드 */
  --v3-accent: #ff6b9d;
  --v3-accent-hover: #ff9bce;
  --v3-accent-soft: #ff8eb1;

  /* 텍스트 */
  --v3-text-strong: #fff;
  --v3-text-main: #e9ecef;
  --v3-text-heading: #f8f9fa;
  --v3-text-hover: #f1f3f5;
  --v3-text-secondary: #ced4da;
  --v3-text-muted: #adb5bd;
  --v3-text-dim: #868e96;
  --v3-text-disabled: #6c757d;
  --v3-text-faint: #495057;
  --v3-text-rate-letter: #b0b5bd;
  --v3-text-empty: #5e6168;

  /* 난이도 — P-2 확정: v1 의 두 팔레트 중 A계열(곡행 팔레트)만 계승한다. 정본 §1.2 C4.
     B계열(#74c0fc/#efef51/#fba8c1/#ce8ef9)은 외부 공유 모듈(analysisRender·ohsorryRender)이
     자기 <style> 과 함께 들고 오는 색이라 v3 가 소유하지 않는다 — 토큰화하지 않는다(정본 §1.1.5). */
  --v3-diff-normal: #1971c2;
  --v3-diff-hyper: #dcaf45;
  --v3-diff-another: #dc3545;
  --v3-diff-leggendaria: #d678c8;
  /* 난이도 키가 위 4종에 없을 때(BEGINNER·미상). v1 은 '#888'/'#aaa' 로 갈려 있었다 — 하나로 고정한다.
     새 색이 아니라 기존 --v3-text-dim(#868e96, v1 B계열 BEGINNER 와 같은 값)의 재사용이다. */
  --v3-diff-fallback: var(--v3-text-dim);

  /* 노트레이더 축 6색 — S2-3a 확정. 정본 §5.4.1 N-8.
     출처는 v1 gist-modules/ohsorryRender.js:223 의 LABEL_COLOR 실측값이다.
     🔴 --v3-diff-another 가 #dc3545 로 값이 같지만 재사용하지 않는다(N-8b) —
        난이도 색을 나중에 손보면 레이더가 같이 움직여서는 안 된다.
     🔴 SP/DP 머리글 색 토큰은 두지 않는다(N-8d) — v1 의 .nr-header.sp/.dp 는
        인라인 style="color:" 에 덮여 한 번도 렌더된 적이 없는 죽은 규칙이다.
        머리글 색은 N-5 의 대표색이다. */
  --v3-radar-notes: #e91e63;
  --v3-radar-chord: #44b544;
  --v3-radar-peak: #ff8c00;
  --v3-radar-charge: #b066d8;
  --v3-radar-scratch: #dc3545;
  --v3-radar-soflan: #1ec5e8;

  /* 램프 배지 배경 — P-2 확정. 정본 §1.2 C3.
     🔴 FC/PFC 와 F 는 v1 에서 **단색이 아니라 blink 애니메이션**이다(styles.css @keyframes).
        그래서 `--v3-lamp-fc` 같은 단일 색 토큰은 성립하지 않는다 — 있었던 것은 3단 시퀀스를
        화살표로 이어 적다 깨진 무효 CSS 였고, P-2 에서 폐기했다.
        FC/PFC 의 3색은 전부 아래 토큰의 재사용이므로 새 색을 만들지 않는다:
          FC/PFC  nc(#5cb8ea) → hc(#ffffff, 테두리 --v3-border-light) → ex(#dcaf45)
          F       f-dark(#5e2222) ↔ f-off(#181b20)
        @keyframes 자체는 토큰이 아니라 램프 컴포넌트 CSS 가 소유한다. */
  --v3-lamp-np: #2a2e35;
  --v3-lamp-ac: #9966cc;
  --v3-lamp-ec: #7bc16a;
  --v3-lamp-nc: #5cb8ea;
  --v3-lamp-hc: #ffffff;
  --v3-lamp-ex: #dcaf45;
  --v3-lamp-f-dark: #5e2222;
  --v3-lamp-f-off: #181b20;

  /* blink 주기 — v1 실측(styles.css .__pd_lamp-F / -FC / -PFC). FC 와 PFC 는 같은 keyframe 을
     주기만 달리 쓴다. prefers-reduced-motion 시의 정적 대체는 컴포넌트 CSS 가 정한다(정본 §1.2 C3). */
  --v3-lamp-blink-f: 0.9s;
  --v3-lamp-blink-fc: 1.4s;
  --v3-lamp-blink-pfc: 0.9s;

  /* 오버레이 딤. v1 .__docs_overlay 의 rgba(0,0,0,0.5) 를 계승한다. */
  --v3-scrim: rgba(0, 0, 0, 0.5);

  /* 토스트 — v1 shared/toast.js 가 인라인 style 로 주던 값 실측(styles.css 가 아니라 JS 쪽에 있었다).
     실패 테두리는 기존 --v3-state-danger(#ff6b6b) 와 같은 값이라 재사용한다. */
  --v3-toast-ok-bg: #2d4a2d;
  --v3-toast-ok-border: #51cf66;
  --v3-toast-ok-text: #b2f2bb;
  --v3-toast-err-bg: #5c2828;
  --v3-toast-err-text: #ffc9c9;

  /* 상태 */
  --v3-state-danger: #ff6b6b;
  --v3-state-danger-soft: #ff8787;
  --v3-state-danger-deep: #c92a2a;
  --v3-state-success: #69db7c;
  --v3-state-info: #74c0fc;
  --v3-state-warning: #ffa94d;
  --v3-state-warning-strong: #ffd43b;
  --v3-state-rival: #74a9e0;
  /* 검색 결과의 레벨/zasa 뱃지 글자색. 새 색이 아니라 --v3-state-rival(#74a9e0)의 재사용이다.
     의미가 달라 이름을 분리했다(rival 색을 바꿔도 검색 뱃지는 따라가지 않는다). */
  --v3-text-search-badge: var(--v3-state-rival);
  --v3-state-self: #e7c14e;
  --v3-state-rival-win-bg: #1f2d39;
  --v3-state-rival-win-hover-bg: #20374b;
  --v3-state-rival-lose-bg: #382224;
  --v3-state-rival-lose-hover-bg: #492427;
  --v3-rate-fill-start: #c44444;
  --v3-rate-fill-end: #e58484;
  --v3-rate-cut: #4a4f58;
  /* rate 바 등급 글자 외곽선 — v1 .__pd_rate_letter 의 4방향 text-shadow 색. */
  --v3-rate-letter-outline: #1a1d23;
  /* 등급 글자 색 C. AAA/AA/A 는 --v3-lamp-ex, B 는 --v3-lamp-nc 와 같은 값이라 재사용한다
     (v1 PD_LETTER_COLOR). 매핑 자체는 rate 바 컴포넌트가 소유한다 — 정본 §1.2 C2. */
  --v3-grade-c: #52a447;
  --v3-source-inf: #a5d8ff;
  --v3-source-ac: #ffd8a8;
  /* 🔴 출처 뱃지 **배경** — 위 두 토큰은 글자색만이고 배경은 미정의였다(v1 styles.css:1290-1291).
     정본 PD-7 이 「새 토큰 0개」로 적은 것이 C1 안에서도 거짓이던 자리다(2026-09-15, S3-2b). */
  --v3-source-ac-bg: rgba(232, 130, 30, 0.35);
  --v3-source-inf-bg: rgba(34, 139, 230, 0.35);
  /* RATE 바 글자 그림자 — 막대 위에서 글자가 읽히게 한다(v1 styles.css:2345). */
  --v3-rate-text-shadow: rgba(0, 0, 0, 0.7);
  /* 곡명 위 시리즈 태그 회색 — 🔴 --v3-text-dim(#868e96)과 **값이 다르다**(v1 styles.css:2780).
     눈으로는 같아 보이고 grep 으로만 갈린다. 두 토큰을 합치지 마라. */
  --v3-text-tag: #8a8f98;
  /* 추천 stage 팔레트 — v1 styles.css:2715-2720(`.__os_estgoal_*`). v1 자기 주석(:2714)이
     「섹션 헤더(OS_REC_STAGES)와 같은 값」이라 적었고 앞 셋이 실제로 같다.
     🔴 램프 배지 토큰과 **다른 팔레트**다(--v3-lamp-ec = #7bc16a != #52a447).
     🔴 값이 같은 토큰이 있어도 재사용하지 않는다 — 위 :63-64(--v3-diff-another)가 같은 판단을
        이미 내렸다. 추천 색을 손보면 난이도·레이더·램프·등급이 같이 움직여서는 안 된다. */
  --v3-recstage-ec: #52a447;
  --v3-recstage-hc: #dc3545;
  --v3-recstage-exh: #d4a017;
  --v3-recstage-cl: #4d8fd6;
  --v3-recstage-ex: #ffd43b;
  --v3-recstage-fc: #5cb8ea;
  /* 추천곡 폴더 섹션 헤더 배경 — v1 styles.css:2635. --v3-lamp-f-off 와 값이 같지만(#181b20)
     의미가 달라 재사용하지 않는다(위와 같은 판단). */
  --v3-bg-recsection: #181b20;

  /* 연습곡 조작 패널의 아래 경계선 — v1 `user/components/recFolder.js:276` 인라인 실측(S3-15d-2).
     🔴 값이 같은 토큰이 있어도 재사용하지 않는다 — `--v3-border-wkpanel`(#14171c)은 `--v3-bg-row-gap` 과
        값이 같지만 **의미가 다르다**(바로 위 `--v3-bg-recsection` · `--v3-text-tag` 가 같은 판단을 이미 내렸다).
     ⚠️ 패널 배경(#1f1f1f)과 라벨 글자(#e9ecef)는 **토큰을 새로 만들지 않았다** —
        `--v3-bg-panel` · `--v3-text-main` 이 값도 의미도 그대로 맞는다.
     🔴 **컨트롤 배색 토큰 셋(`--v3-bg-wkctl` #fff · `--v3-text-wkctl` #555 · `--v3-border-wkctl` #ced4da)은
        2026-09-20 에 지웠다** — v1 리터럴을 옮긴 것이었는데 **사용자가 「v3 팔레트로 어둡게 가자」로 정했다.**
        지금은 `--v3-bg-input` · `--v3-text-main` · `--v3-border-default` 를 쓴다. **되살리지 마라.** */
  --v3-border-wkpanel: #14171c;

  /* 폰트 */
  --v3-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Apple SD Gothic Neo", "Pretendard", sans-serif;
  --v3-font-mono: "SF Mono", Menlo, Consolas, monospace;

  /* 간격 */
  --v3-space-1: 2px;
  --v3-space-2: 3px;
  --v3-space-3: 4px;
  --v3-space-4: 6px;
  --v3-space-5: 8px;
  --v3-space-6: 10px;
  --v3-space-7: 12px;
  --v3-space-8: 14px;
  --v3-space-9: 16px;

  /* 🔴 본문 최대 폭 — **값을 새로 지어낸 것이 아니다.** `.__v3sh_main` 이 쓰던 `960px` 를
     토큰으로 끌어올린 것이다(2026-09-19 세션 51). 헤더·상단 메뉴줄이 같은 폭에 맞춰야 하는데
     🔴 **세 곳에 리터럴로 흩어지면 한쪽만 바뀌어도 줄이 어긋나고 에러가 없다.** */
  --v3-content-max: 960px;
  --v3-space-10: 18px;
  --v3-space-12: 24px;

  /* radius */
  --v3-radius-sm: 3px;
  --v3-radius-md: 4px;
  --v3-radius-lg: 5px;
  --v3-radius-xl: 6px;
  --v3-radius-modal: 8px;

  /* 그림자 */
  --v3-shadow-modal: 0 18px 48px rgba(0, 0, 0, 0.45);
  --v3-shadow-popover: 0 4px 12px rgba(0, 0, 0, 0.4);
  --v3-shadow-toast: 0 6px 24px rgba(0,0,0,.5);

  /* duration·easing */
  --v3-duration-fast: .12s;
  --v3-duration-base: .15s;
  --v3-duration-dialog: .2s;
  --v3-ease-default: ease;
  --v3-ease-linear: linear;

  /* sticky 줄들의 누적 높이. 셸 헤더가 기동 시 자기 높이를 쓰고, 뒤에 붙는 sticky 줄(Compact Strip·
     탭·필터)이 자기 높이를 더한다. 실제 값은 v3/shared/sticky-top.js 가 런타임에 세팅한다(정본 §1.2 C5).
     여기 0px 은 세팅 전에도 var() 가 유효하도록 두는 기본값이다. */
  --v3-sticky-top: 0px;

  /* 단(段) 표시 색 — v1 .__rank_white/_blue/_red/_chuden/_kaiden 실측.
     9급~1급(≤0) 흰색 / 초단~8단(1~8) 파랑 / 9~10단(9~10) 빨강 / 中伝(11)·皆伝(12) 은 그라디언트 반짝임.
     흰색·빨강은 기존 토큰과 같은 값이라 재사용한다 — 새 색은 파랑과 그라디언트 4색뿐이다. */
  --v3-rank-white: var(--v3-text-heading);
  --v3-rank-blue: #4dabf7;
  --v3-rank-red: var(--v3-state-danger);
  --v3-rank-chuden-base: #8c95a0;
  --v3-rank-chuden-peak: #c7ccd2;
  --v3-rank-kaiden-base: #c8a347;
  --v3-rank-kaiden-peak: #ead78a;

  /* z-index — v3 shell 내부의 상대 순서. 값은 전부 v1 styles.css 에 실재하는 수치다.
     🔴 P-2 에서 재산정했다(정본 §1.2 C6). v1 은 모달 레이어가 board=1000 / 랭킹·유저카드=10000 으로
        갈려 있었고 토스트(9999)가 랭킹 모달 아래였다 — 그대로 옮기면 v3 에서도 토스트가 모달 뒤로 숨는다.
        v3 는 스택 컨텍스트가 하나뿐이라 순서를 지키는 쪽으로 고정한다: content < header < overlay < modal < toast. */
  --v3-z-base: 1;
  --v3-z-content: 2;
  --v3-z-sticky: 3;
  /* 셸 sticky 줄(strip·탭줄·필터바) — 폴더 summary(--v3-z-sticky)보다 한 층 위, 헤더보다 아래(세션 110). v1 「tabs 4 / filter 6」 의도의 복원. */
  --v3-z-stickybar: 4;
  --v3-z-header: 5;
  /* 사이드바 서랍. 종전 --v3-z-modal 값(1000)을 그대로 물려받아 렌더는 바뀌지 않는다. */
  --v3-z-overlay: 1000;
  /* 🔴 scrim 은 서랍보다 **반드시 아래**다 — 같은 값을 주면 안 된다.
     z-index 동률이면 DOM 순서가 승자를 정하는데 `index.html` 은 sidebar(42) < scrim(58) 이라
     scrim 이 서랍 위를 덮고 **메뉴 항목 클릭을 전부 가로챈다**(탭하면 메뉴만 닫힌다).
     2026-09-20 실기 사고가 정확히 이것이었다 — S1-8 부터 있던 선재 결함이고 ≤899px 전 기기에 걸렸다. */
  --v3-z-scrim: 999;
  /* 모달 shell — v1 의 실제 모달 레이어(.__shelf_rank_modal · 모바일 유저카드 모달). */
  --v3-z-modal: 10000;
  /* 토스트 — v1 최대 수치(.__pd_pickmenu). 모달 위에 떠야 한다. */
  --v3-z-toast: 10002;
}
