/* ============================================================
   마이애미짐 디자인 토큰 ③ 회원 앱 (index.html 전용)

   회원이 손에 들고 보는 화면용. 사이니지와 전제가 다르다.
     · 바탕은 네이비가 아니라 블랙 — 폰은 어두운 방에서도 보고, 네이비 기가 섞이면
       회색이 탁해진다
     · 발광 없음 — 작은 화면에서 글로우는 번짐으로만 읽힌다
     · 골드는 3-stop 그라데이션 하나로 통일, 단색이 필요한 자리는 정점 #E9B949

   ※ 관리자·직원·업로드 화면은 지금 사이니지 토큰을 쓰고 있다. 성격상 이쪽이 맞지만
     옮기면 화면 색이 실제로 바뀌므로 이번 파일 나누기에 섞지 않았다. 별도 판단 사항.

   골드 규칙 (design-tokens 시절 §2와 같은 정의)
     골드   성취의 결과 — 게이지 채운 부분 · 1위 · 목표 달성 · 획득한 보상
            + 화면당 대표 액션 1개(브랜드 강조로서의 예외)
     흰색   사실 · 데이터 — 숫자 · 출석한 날 · 완료 체크 · 안내 수치
     회색   아직 — 미달 · 미획득 · 비활성

   tokens-core.css 다음에 불러온다.
   ============================================================ */

:root {

  /* ── 바탕 ───────────────────────────────────────
     아래 네이비 계열(bg-base/surface/elevated/atmos/letterbox)은 앱 화면에서 실제로
     쓰이지 않지만, style.css 한 파일을 모든 화면이 공유하기 때문에 이름이 비면
     그 규칙이 깨진 채로 그려진다. 지금 값을 그대로 둔다 — 이번 작업은 파일을 나누는
     것이고, 값을 바꾸는 건 별도 결정이다. */
  --bg:       #0A0A0C;
  --bg-app:   #0D0D0F;   /* 지금 값 그대로. 앱 배경은 body.app-shell 규칙이 #0A0A0C로 칠한다 */
  --bg-panel: #0F0F11;
  --bg-base:     #0B2A54;
  --bg-surface:  rgba(16, 38, 72, 0.72);
  --bg-elevated: #17376A;
  --bg-signage:  var(--bg-base);
  --letterbox:   linear-gradient(180deg,#1B4488 0%,#0B2A54 42%,#061630 100%);
  --atmos:       #2A66CE;
  --atmos-deep:  #153C7E;
  --accent-glow: rgba(86,144,255,.13);


  /* ── 골드 ─────────────────────────────────────── */
  --gold:        #E9B949;
  --gold-bright: #E9B949;
  --gold-light:  #E9B949;
  --gold-deep:   #A07840;
  --gold-dark:   #A07840;
  --gold-ink:    #1A1206;

  --gold-grad:   linear-gradient(135deg, #A07840 0%, #E9B949 50%, #C9A040 100%);
  --gold-grad-h: linear-gradient(90deg,  #A07840 0%, #E9B949 55%, #C9A040 100%);

  --gold-gauge:  #E9B949;
  --gold-action: #E9B949;
  --gold-reward: #E9B949;

  --gradient-cta:  var(--gold-grad);
  --gradient-text: var(--gold-grad);


  /* ── 게이지 — 흰빛→골드 섞임을 없애고 3-stop 하나로 ──
     앱이 실제로 쓰는 건 --g-app-* 다. --g1~g3은 사이니지 게이지 값이지만, style.css를
     모든 화면이 공유해서 이름이 비면 규칙이 깨지므로 지금 값 그대로 채워 둔다 */
  --g1: rgba(42,102,206,.24);
  --g2: rgba(150,150,190,.44);
  --g3: rgba(255,201,74,.58);

  --g-app-1: #A07840;
  --g-app-2: #E9B949;
  --g-app-3: #C9A040;
  --g-edge1: #E9B949;
  --g-edge2: #C9A040;


  /* ── 발광 제거 ──────────────────────────────────
     작은 화면에서 글로우는 위계가 아니라 번짐으로 읽힌다 */
  --glow-gold: none;
  --g-glow:    none;
  --glow-sm:   none;
  --glow-md:   none;


  /* ── 중립 회색(네이비 기 제거) + 순백 통일 ───────── */
  --text:           #FFFFFF;
  --text-primary:   #FFFFFF;
  --text-secondary: #9A9AA0;
  --text-muted:     #5A5A62;
  --text-dim:       #9A9AA0;

  --border:   #1E1E22;
  --line-1:   #1E1E22;
  --line-2:   #26262A;
  --line-3:   #5A5A62;


  /* ── 순위: 1위만 골드, 2·3위는 흰색 명도로 ───────── */
  --tier-1: #E9B949;
  --tier-2: #FFFFFF;
  --tier-3: #9A9AA0;
  --tier-4: #5A5A62;

  --ghost-text: rgba(200, 230, 255, 0.055);


  /* ── 타입 스케일 · 형태 ──────────────────────────
     아래 값들은 지금 앱이 실제로 쓰고 있는 값 그대로다(사이니지와 같음).
     앱은 손에 들고 보는 거리라 28px 하한이 필요 없고 노치도 안 쓰지만, 그건 값을
     바꾸는 결정이라 이번 작업(파일 나누기)에 섞지 않는다. 값이 하나라도 달라지면
     리팩터링이 아니라 디자인 변경이 되고, 어디가 왜 바뀌었는지 추적이 안 된다.

     앱의 각진 모서리는 지금 --notch가 아니라 선택자별 border-radius:0으로 처리되어
     있다(아래 "앱 형태 규칙" 블록). 나중에 여기 값으로 정리할 수 있다. */
  --text-xs: 28px;
  --text-sm: 34px;
  --text-md: 42px;
  --text-lg: 56px;
  --text-xl: 76px;

  --notch: 28px;
  --stroke: 3px;
}
