/* 페이지 탭 바 — 밑줄형, 활성 굵게(screener_kr `web/tabs.css` 패턴 승계). 이 저장소에서는
   "관리자 모드" 탭 하나만을 위한 것이라 `is_local_admin` 이 아니면 탭 바 자체가 서버에서
   렌더링되지 않는다(`web/pages.py`, `web/admin_gate.py`) — 여기 CSS 는 그 경우를 위한
   `display:none` 을 따로 둘 필요가 없다(마크업이 없으면 그릴 것도 없다).

   고른 값은 **색이 아니라 색 + 굵기 + border** 로 말한다 — 색약 규칙(파랑/주황만, 색 하나로
   상태를 구분하지 않는다). 좁은 화면 전용 규칙은 두지 않는다 — `mobile.css` 자리다. */

.tabs {
  display: flex; gap: 4px; margin: 0 0 16px; border-bottom: 1px solid var(--line);
  overflow-x: auto;
}
.tab-btn {
  padding: 8px 14px; border: none; border-bottom: 2px solid transparent;
  background: none; color: var(--muted); font: inherit; font-size: 14px;
  font-weight: 600; cursor: pointer; white-space: nowrap;
}
.tab-btn:hover { color: var(--text); }
.tab-btn[aria-selected="true"] {
  color: var(--accent); border-bottom-color: var(--accent); font-weight: 700;
}

/* 활성 판만 보인다 — 나머지는 `hidden` 속성(`web/static/tabs.js`). */
.pane[hidden] { display: none; }

.admin-gate-note {
  margin: 0 0 14px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--card); font-size: 13px; color: var(--muted);
}

/* 가상계좌 탭(`paper_tabs.js`)이 기간 버튼(`#period-tabs`)을 `hidden` 으로 숨긴다 — 그런데
   `.period-tabs { display: flex }`(style.css)가 브라우저 기본 `[hidden]{display:none}` 을
   이긴다. 여기서 다시 이긴다. style.css 는 200줄이 차 있어 여기 둔다. */
.period-tabs[hidden] { display: none; }
