/* scommweb 토큰 — docs/15 §3 GUI 가이드(GG-AUDIO · GG-NAVI · GG-VOL) 색·치수를 CSS 변수로.
   원본 PNG · 삼성고딕은 쓰지 않는다(D3) — 글꼴은 시스템 글꼴. 바깥 자원 0. */
:root {
  /* 바깥 머리(rksna 형제 색 — doc16 §3.3) */
  --page-bg: #f5f7fb;
  --page-accent: #2f6bff;
  --page-text: #1d2433;

  /* 기본 화면 */
  --dev-w: 800px;
  --dev-h: 480px;
  --status-h: 32px;          /* 상태바 32 px */
  --bg: #0d1114;
  --text: #ffffff;            /* 기본 글자 */
  --sub-player: #a6a6a6;      /* 재생 화면 보조 */
  --sub-list: #acacac;        /* 목록 · NIP 보조 */
  --sub-widget: #8c8c8c;      /* 위젯 · PIP 보조 */

  /* 목록 상태 N / S / P / D */
  --list-n: #222b30;
  --list-n-title: #ffffff;
  --list-n-sub: #acacac;
  --list-s: #2fbcfd;
  --list-s-title: #000000;
  --list-s-sub: #1a1a1a;
  --list-p: #185f80;
  --list-p-title: #000000;
  --list-p-sub: #1a1a1a;
  --list-d-opacity: .4;
  --edit-left: #4a4a4a;       /* 재생목록 편집 왼쪽 */
  --popup-list: #222b30;      /* 팝업 목록 배경 */
  --album3d-line: #333333;    /* 앨범 3D 구분선 1px */
  --popup-line-1: #2f3943;    /* 팝업 헤더 아래 선 3줄 */
  --popup-line-2: #242b34;
  --popup-line-3: #757d87;
  --input-focus: #b6e8fe;     /* 입력칸 활성 테두리 */
  --input-off: #808080;
  --input-on: #000000;
  --popbtn-n: #333333;        /* 팝업 버튼 글자 N */
  --popbtn-sp: #000000;       /* S · P */
  --action-n: #ffffff;        /* 하단 액션 버튼 글자 N */
  --action-sp: #000000;
  --dim-popup: rgba(0, 0, 0, .70);   /* 팝업 딤 70% */
  --dim-player: rgba(0, 0, 0, .80);  /* 재생 화면 딤 80% */
  --music-plate: rgba(0, 0, 0, .50); /* 음악 위젯 판 50% */
  --clock: #60daf4;           /* 시계 숫자(코드는 #aaaaff — 가이드 정본) */
  --edit-title: #2fbcfd;      /* 편집 화면 제목바 */
  --text-pressed: #606060;    /* 글자 눌림(AOSP 잔재) */
  --gal-title: #fef2ee;       /* MyGallery 제목줄 */
  --gal-bottom: #747574;      /* MyGallery 하단 */
  --magenta-key: #ff00ff;     /* 투명색 키(참고용 — 쓰지 않음) */

  /* 그림자 — 헤더 공통 #000 50% 90° 거리 3 크기 5 · 팝업 판 1px 거리 2 · 볼륨 3px 거리 5 */
  --shadow-header: 0 3px 5px rgba(0, 0, 0, .5);
  --shadow-popup: 0 2px 1px rgba(0, 0, 0, .5);
  --shadow-vol: 0 5px 3px rgba(0, 0, 0, .5);
  --shadow-temp: 2px 2px 2px rgba(0, 0, 0, .25);

  /* 치수(px @800×480) */
  --np-h: 308px;      /* Now Playing */
  --art: 240px;
  --seek-h: 68px;
  --ctrl-h: 72px;
  --seek-w: 536px;
  --osd-x: 24px;
  --osd-home-w: 40px;
  --osd-home-h: 54px;
  --osd-sr-w: 52px;
  --osd-sr-h: 45px;
  --tab-h: 60px;
  --row-h: 77px;
  --row-art: 77px;
  --subbtn: 30px;
  --alpha-w: 30px;
  --action-h: 64px;
  --pop-w: 280px;
  --pop-head: 45px;
  --pop-item: 48px;
  --pop-in-w: 360px;
  --pop-in-h: 186px;
  --pop-input-h: 44px;
  --pop-btn-w: 152px;
  --pop-btn-h: 48px;
  --nip-w: 400px;
  --pip-w: 450px;
  --pip-h: 72px;
  --vol-w: 384px;
  --vol-h: 256px;
  --vol-osd: 338px;
  --dock-w: 112px;
  --cell-w: 152px;
  --cell-h: 122px;

  /* 글자(sp ≈ px 1:1 로 둔다 — 800×480 hdpi 기준 화면 px) */
  --fs-title: 14px;
  --fs-sub: 14px;
  --fs-time: 10px;
  --fs-row1: 17px;
  --fs-row2: 12px;
  --fs-rowsub: 10px;
  --fs-pophead: 13px;
  --fs-popitem: 11px;

  /* 글꼴 — 자체 호스팅 nemo 글꼴(css/fonts.css @font-face · 같은 출처)을 먼저, 없으면 시스템 글꼴 */
  --font-ko: "NemoSansKR", system-ui, sans-serif;
  --font-latin: "NemoLato", "Helvetica Neue", Arial, sans-serif;
  --font: "NemoLato", "NemoSansKR", system-ui, sans-serif;   /* 라틴 글리프는 Lato, 한글은 Noto CJK KR */
  --k: 1; /* 반응형 배율 */
}

@media (prefers-reduced-motion: reduce) {
  :root { --motion: 0; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}