/* features/nav-menu — PC 왼쪽 레일 (2026-10-13 신설)
   운영자 지시 2026-10-13 「Pc 버전에서 아이콘의 크기를 조금 키우는건 … 관리자 아래 부분은 … 모바일처럼
   팝업형태 … 해상도가 작은 화면에도 왼쪽 메뉴 스크롤이 나오지 않는게 목표」.
   · 관리자 묶음·넘친 메뉴는 nav-menu.js fitDesk()가 접고, 「관리자」(또는 「더보기」) 단추가 이 팝업을 연다.
   · 폰(760px 이하)의 하단 탭바·시트는 css/shell.css 그대로다 — 여기 규칙은 전부 761px 이상에서만 먹는다.
   ⚠ 색은 레일 토큰(--rail-*)만 쓴다 — 레일은 라이트 테마에서도 어둡고, 이 팝업은 레일이 옆으로 펼쳐진 것이다. */

@media (min-width: 761px) {
  .rail-more-sheet.rms-desk {
    position: fixed; z-index: 1310;
    left: calc(var(--rail-w) + 6px); top: var(--hdr-total);
    width: 196px; max-height: calc(100% - var(--hdr-total) - 12px);
    overflow-y: auto;
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; padding: 8px;
    background: var(--rail-bg);
    border: 1px solid var(--rail-border); border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
  }
  .rms-desk .rms-hd, .rms-desk .rms-cap { grid-column: 1 / -1; }
  .rms-desk .rms-hd {
    padding: 2px 4px 4px; color: var(--rail-fg); opacity: .72;
    font-size: var(--fs-xs); font-weight: 700; letter-spacing: -.02em;
  }
  .rms-desk .rms-cap {
    margin: 4px 4px 2px; padding-top: 6px; border-top: 1px solid var(--rail-sep);
    color: var(--rail-fg); opacity: .72; font-size: var(--fs-xs); font-weight: 700;
  }
  /* ⚠ width·margin을 다시 적는다 — app.css 전역 button{width:100%;margin-top:8px} (shell.css 시트와 같은 이유) */
  .rms-desk .rms-row {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    width: auto; margin: 0; padding: 8px 4px; min-height: 58px;
    background: none; border: 1px solid transparent; border-radius: var(--radius-md);
    color: var(--rail-fg); font-family: inherit; font-size: var(--fs-sm); font-weight: 600;
    line-height: 1.2; text-align: center; cursor: pointer; word-break: keep-all;
  }
  .rms-desk .rms-row:hover { color: var(--rail-fg-strong); background: var(--rail-hover); }
  .rms-desk .rms-row.on {
    color: var(--rail-accent); background: var(--rail-accent-bg);
    border-color: color-mix(in srgb, var(--rail-accent) 45%, transparent);
  }
  .rms-desk .rms-row svg {
    width: 22px; height: 22px; flex: none;
    fill: none; stroke: currentColor; stroke-width: 1.4;
    stroke-linejoin: round; stroke-linecap: round;
  }
  /* 레일과 같은 묶음색 (shell.css #bar.nav-rail button[data-rgrp] 과 같은 토큰) */
  .rms-desk .rms-row[data-rgrp="find"]  svg { stroke: var(--rail-grp-find); }
  .rms-desk .rms-row[data-rgrp="stat"]  svg { stroke: var(--rail-grp-stat); }
  .rms-desk .rms-row[data-rgrp="view"]  svg { stroke: var(--rail-grp-view); }
  .rms-desk .rms-row[data-rgrp="watch"] svg { stroke: var(--rail-grp-watch); }
  .rms-desk .rms-row.on svg { stroke: currentColor; }
  /* 「관리자」 단추 — 접힌 관리자 묶음의 입구. 방패 아이콘은 레일 svg 규칙(18px·선)을 그대로 받는다. */
  #bar.nav-rail button.rail-more[data-mode="adm"] { color: var(--rail-fg); }
  #bar.nav-rail button.rail-more[data-mode="adm"] svg { stroke: var(--rail-fg-strong); }
  #bar.nav-rail button.rail-more.on svg { stroke: currentColor; }
}

/* 아이콘 키우기 — 세로 여유가 있는 PC 창에서만 (46→52px · 아이콘 18→22px · 글자 10→11px).
   ⚠ 820px 문턱: 헤더 68px + 일반 10칸·「관리자」 1칸 × 52px + 간격 = 약 720px. 그 아래 창은 종전 크기 그대로
     두고, 그래도 넘치면 fitDesk()가 뒤에서부터 「더보기」로 접는다(스크롤은 생기지 않는다).
   ⛔ 레일 폭(--rail-w 58px)은 바꾸지 않는다 — 서랍·인스펙터·지도 자 위치가 모두 그 값을 따른다. */
@media (min-width: 761px) and (min-height: 820px) {
  #bar.nav-rail button { width: 52px; height: 52px; font-size: var(--fs-sm); }
  #bar.nav-rail button svg { width: 22px; height: 22px; }
  /* 영어 라벨(「Holding / go-around」 등)은 46px에서도 이미 두세 줄이라 글자는 키우지 않는다(아이콘만) */
  html[lang="en"] #bar.nav-rail button { font-size: var(--fs-xs); }
}
