/* 서버스캔 관리자 — 대시보드 규칙(무채색 틀 · 색은 데이터에만 · 타이트한 간격). 모바일 먼저(min-width 만), 모바일 터치 44 */
.adm {
  --a-page: #0f0f0f; --a-card: #1f1f1f; --a-inner: #161616; --a-row: #171717; --a-head: #000; --a-sel: #323232; --a-stroke: #444; --a-div: #2b2b2b;
  --a-text: #fff; --a-sub: #b3b3b3; --a-mute: #8a8a8a;
  --a-up-bg: #10342d; --a-up-fg: #40c4aa; --a-warn-bg: #341500; --a-warn-fg: #ffddc7;
  --a-bar: #40c4aa; --a-bar-bg: #2b2b2b;
  --a-pad: 16px; --a-gap: 12px; --a-r: 8px; --a-btn: 44px;
  background: var(--a-page); color: var(--a-text); font-size: 14px; line-height: 1.45; letter-spacing: -.01em;
}
.adm .ico { display: block; }
.adm .mono { font-family: var(--f-body); font-variant-numeric: tabular-nums; }
.adm-shell { display: flex; flex-direction: column; min-height: 100vh; }
/* 메뉴 — 모바일은 위쪽 줄, 1024 부터 왼쪽 */
.adm-side { display: flex; flex-wrap: wrap; align-items: center; gap: var(--a-gap); padding: var(--a-gap) var(--a-pad); background: var(--a-head); }
.adm-brand .brand-txt small { color: var(--a-mute); }
.adm-nav { order: 3; display: flex; flex-wrap: wrap; gap: 2px; width: 100%; }
.adm-nav a { display: inline-flex; align-items: center; gap: 8px; min-height: var(--a-btn); min-width: 0; padding: 0 12px; border-radius: var(--a-r); color: var(--a-sub); font-size: 14px; line-height: 1.45; }
.adm-nav a:hover, .adm-nav a:focus-visible { color: var(--a-text); background: var(--a-sel); }
.adm-nav a[aria-current] { color: var(--a-text); background: var(--a-sel); font-weight: 600; }
.adm-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--a-warn-bg); color: var(--a-warn-fg); font-style: normal; font-size: 12px; line-height: 1; font-weight: 500; }
.adm-out { margin-left: auto; }
.adm-main { display: flex; flex-direction: column; gap: var(--a-gap); flex: 1 1 auto; min-width: 0; padding: var(--a-pad); }
.adm-main .flash { margin: 0; }
/* 버튼 — 무채색 pill, 텍스트가 주인공 */
.adm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: var(--a-btn); padding: 0 16px; border: 0; border-radius: 999px; background: #333; color: var(--a-text); font: inherit; font-size: 14px; line-height: 1.45; font-weight: 500; cursor: pointer; }
.adm-btn:hover, .adm-btn:focus-visible { background: #3d3d3d; }
.adm-btn-pri { background: #e8e8e8; color: #111; }
.adm-btn-pri:hover, .adm-btn-pri:focus-visible { background: #fff; }
/* 머리말 */
.adm-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--a-gap); padding: 4px 0; }
.adm-head h1 { font-size: 20px; line-height: 1.4; font-weight: 500; letter-spacing: -.025em; }
.adm-head p { margin-top: 2px; color: var(--a-sub); font-size: 14px; line-height: 1.45; }
/* 카드 */
.card.kpi, .adm .card { padding: var(--a-pad); border: 0; border-radius: var(--a-r); background: var(--a-card); min-width: 0; }
.card-h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px var(--a-gap); margin-bottom: var(--a-gap); }
.card-h h2 { min-width: 0; overflow-wrap: anywhere; font-size: 16px; line-height: 1.45; font-weight: 600; letter-spacing: -.02em; }
.card-sub { color: var(--a-mute); font-size: 12px; line-height: 1.45; font-weight: 500; }
.adm-more { display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-height: var(--a-btn); min-width: 44px; color: var(--a-sub); font-size: 13px; line-height: 1.45; }
.adm-more:hover, .adm-more:focus-visible { color: var(--a-text); }
.adm-empty { color: var(--a-mute); font-size: 14px; line-height: 1.6; }
.adm-empty-card { display: flex; flex-direction: column; gap: 6px; }
.adm-empty-card h2 { font-size: 16px; line-height: 1.45; font-weight: 600; }
.adm-empty-card p { color: var(--a-sub); }
/* KPI — 오늘 점검만 크게 */
.kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--a-gap); }
.kpi { display: flex; flex-direction: column; gap: 6px; }
.kpi-link:hover, .kpi-link:focus-visible { background: #262626; }
.kpi-l { overflow-wrap: anywhere; color: var(--a-sub); font-size: 13px; line-height: 1.45; }
.kpi-v { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; }
.kpi-v b { font-size: 24px; line-height: 1.3; font-weight: 600; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.kpi-v span { color: var(--a-sub); font-size: 14px; line-height: 1.45; }
.kpi-main .kpi-v b { font-size: 32px; }
.delta { display: inline-flex; align-items: center; height: 21px; padding: 0 8px; border-radius: 999px; background: #2b2b2b; color: var(--a-sub); font-style: normal; font-size: 12px; line-height: 1; font-weight: 500; }
.delta.up { background: var(--a-up-bg); color: var(--a-up-fg); }
.delta.warn { background: var(--a-warn-bg); color: var(--a-warn-fg); }
/* 카드 묶음 */
.adm-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--a-gap); }
/* 일별 막대 */
.bars { display: block; width: 100%; height: 140px; background: var(--a-inner); border-radius: 6px; }
.bars rect { fill: #4a4a4a; }
.bars rect.is-today { fill: var(--a-bar); }
.bars-x { display: flex; justify-content: space-between; margin-top: 6px; color: var(--a-mute); font-size: 12px; line-height: 1.45; }
/* 가로 막대 */
.hbars { display: flex; flex-direction: column; gap: 8px; }
.hbars li { display: grid; grid-template-columns: minmax(0, 1fr) 72px 40px; align-items: center; gap: var(--a-gap); min-height: 28px; }
.hb-l { display: flex; align-items: center; gap: 8px; min-width: 0; color: var(--a-sub); font-size: 14px; line-height: 1.45; }
.hb-t { min-width: 0; overflow-wrap: anywhere; }
.hb-track { display: block; width: 100%; height: 8px; }
.hb-bg { fill: var(--a-bar-bg); }
.hb-fill { fill: var(--a-bar); }
.hb-v { justify-self: end; font-size: 14px; line-height: 1.45; font-weight: 600; font-variant-numeric: tabular-nums; }
.g-sm { width: 26px; height: 26px; font-size: 14px; border-radius: 6px; }
.ev { display: flex; flex-direction: column; }
.ev div { display: flex; align-items: center; justify-content: space-between; gap: var(--a-gap); min-height: 40px; border-bottom: 1px solid var(--a-div); }
.ev div:last-child { border-bottom: 0; }
.ev dt { min-width: 0; color: var(--a-sub); font-size: 14px; line-height: 1.45; }
.ev dd { font-size: 14px; line-height: 1.45; font-weight: 600; font-variant-numeric: tabular-nums; }
.mini { display: flex; flex-direction: column; }
.mini li { display: flex; align-items: center; gap: var(--a-gap); min-height: 52px; border-bottom: 1px solid var(--a-div); }
.mini li:last-child { border-bottom: 0; }
.mini-t { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.mini-t b { font-size: 14px; line-height: 1.45; font-weight: 600; overflow-wrap: anywhere; }
.mini-t small { color: var(--a-mute); font-size: 12px; line-height: 1.45; }
.mini-k { color: var(--a-sub); font-size: 13px; }
/* 표 — 모바일은 카드, 768 부터 표 */
.tbl-wrap { width: 100%; }
.tbl { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 15px; line-height: 1.45; color: var(--a-sub); }
.tbl thead { display: none; }
.tbl.as-cards tr { display: flex; flex-direction: column; gap: 4px; padding: var(--a-gap); margin-bottom: 8px; border-radius: 6px; background: var(--a-row); }
.tbl.as-cards td { display: flex; justify-content: space-between; align-items: center; gap: var(--a-gap); min-width: 0; overflow-wrap: anywhere; }
.tbl.as-cards td::before { content: attr(data-l); flex: none; color: var(--a-mute); font-size: 12px; line-height: 1.45; font-weight: 500; }
.tbl a { display: inline-flex; align-items: center; min-height: var(--a-btn); min-width: 44px; color: inherit; text-decoration: underline; text-decoration-color: #555; text-underline-offset: 3px; }
.tbl .tbl-key { min-width: 44px; color: var(--a-text); font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
.tbl .tbl-key:hover, .tbl .tbl-key:focus-visible { text-decoration: underline; }
.pager { display: flex; align-items: center; justify-content: center; gap: var(--a-gap); margin-top: var(--a-gap); color: var(--a-sub); }
/* 찾기 */
.filters { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--a-gap); align-items: end; }
.adm .inp { min-height: var(--a-btn); padding: 8px 12px; border: 1px solid var(--a-stroke); border-radius: var(--a-r); background: var(--a-inner); color: var(--a-text); font-size: 14px; }
.adm .inp:focus { border-color: #8a8a8a; box-shadow: none; }
.adm .field { min-width: 0; }
.adm .field-label { min-height: var(--a-btn); margin-bottom: 0; overflow-wrap: anywhere; color: var(--a-sub); font-size: 12px; font-weight: 500; }
.adm .check { color: var(--a-sub); font-weight: 500; }
.adm .check span::before { background: var(--a-inner); border-color: var(--a-stroke); }
.adm .check input:checked + span::before { background: #e8e8e8; border-color: #e8e8e8; box-shadow: inset 0 0 0 3px var(--a-inner); }
/* 탭 */
.adm .tabs { margin: 0; }
.adm .tabs a { border: 0; background: var(--a-card); color: var(--a-sub); }
.adm .tabs a[aria-current] { background: var(--a-sel); color: var(--a-text); }
/* 상담 문의 카드 */
.adm .inq { gap: var(--a-gap); }
.adm .inq-msg { background: var(--a-inner); }
.adm .inq-kv a { color: var(--a-text); text-decoration-color: #555; }
/* 리포트(관리자에서 열 때) — 손님용 버튼 · 안내는 숨긴다 */
.adm .rep-actions, .adm .upsell, .adm .consult-cta, .adm .ai-prompt { display: none; }
.adm .rep-head, .adm .sec-tight { padding-left: 0; padding-right: 0; background: none; border: 0; }
.adm .rep-head .wrap, .adm .sec-tight .wrap, .adm-main > .wrap { padding: 0; max-width: none; }
/* 로그인 */
.adm-login-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--a-gap); min-height: 100vh; padding: var(--a-pad); }
.adm-login { display: flex; flex-direction: column; gap: var(--a-gap); width: 100%; max-width: 360px; padding: 24px; border-radius: var(--a-r); background: var(--a-card); }
.adm-login h1 { font-size: 20px; line-height: 1.4; font-weight: 500; }
.adm-login .flash { margin: 0; }
.adm-login .field { display: flex; flex-direction: column; }
.adm-login .btn { min-height: var(--a-btn); border-radius: 999px; background: #e8e8e8; color: #111; }

@media (min-width: 640px) {
  .kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .filters { grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)) auto auto; }
}
@media (min-width: 768px) {
  .adm-main { padding: 24px; }
  .adm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .span-2, .span-3 { grid-column: 1 / -1; }
  .tbl thead { display: table-header-group; }
  .tbl th, .tbl.as-cards td { overflow-wrap: anywhere; }
  .tbl th { height: 40px; padding: 0 12px; background: var(--a-head); color: var(--a-sub); font-size: 12px; line-height: 1.45; font-weight: 500; text-align: left; white-space: normal; }
  .tbl th:first-child { border-radius: 6px 0 0 6px; } .tbl th:last-child { border-radius: 0 6px 6px 0; }
  .tbl.as-cards tr { display: table-row; padding: 0; margin: 0; border-radius: 0; background: none; }
  .tbl.as-cards td { display: table-cell; height: 55px; padding: 0 12px; border-bottom: 1px solid var(--a-div); vertical-align: middle; }
  .tbl.as-cards td::before { content: none; }
}
@media (min-width: 1024px) {
  .adm { --a-btn: 36px; }
  .adm-shell { flex-direction: row; background: linear-gradient(90deg, var(--a-head) 212px, transparent 212px); }
  .adm-side { flex-direction: column; flex-wrap: nowrap; align-items: stretch; flex: none; width: 212px; min-height: 100vh; padding: 20px 16px; position: sticky; top: 0; height: 100vh; }
  .adm-brand { padding: 0 8px 12px; }
  .adm-nav { order: 0; flex-direction: column; flex-wrap: nowrap; }
  .adm-nav a { min-height: 44px; padding: 0 16px; }
  .adm-out { margin: auto 0 0; }
  .adm-out .adm-btn { width: 100%; }
  .kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .adm-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .span-2 { grid-column: span 2; }
  .span-3 { grid-column: 1 / -1; }
}

/* 방문 · 유입 — 기간 · 범위 탭 줄, 두 줄 막대, 이어진 비율, 출처 표(이름 아래 막대), 내 방문 빼기 */
.stat-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--a-gap); }
.bars rect.s0 { fill: #4a5568; }
.bars rect.s1 { fill: var(--a-bar); }
.legend { display: inline-flex; align-items: center; gap: 6px; }
.legend i { display: block; width: 10px; height: 10px; border-radius: 2px; }
.legend i.lg1 { margin-left: 6px; }
.lg0 { background: #4a5568; } .lg1 { background: var(--a-bar); }
.funnel { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.funnel li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 4px var(--a-gap); }
.fu-l { min-width: 0; color: var(--a-sub); font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
.fu-bar { grid-column: 1 / -1; grid-row: 2; }
.funnel b { font-size: 14px; line-height: 1.45; font-weight: 600; font-variant-numeric: tabular-nums; }
.funnel small { min-width: 44px; color: var(--a-mute); font-size: 12px; line-height: 1.45; text-align: right; font-variant-numeric: tabular-nums; }
.src-tbl .src-l { display: block; min-width: 0; color: var(--a-text); line-height: 1.45; overflow-wrap: anywhere; }
.src-tbl .hb-track { margin-top: 6px; }
.src-tbl .src-m { display: block; margin-top: 4px; color: var(--a-mute); font-size: 12px; line-height: 1.45; }
.src-tbl td.num, .src-tbl th:not(:first-child) { overflow-wrap: normal; word-break: keep-all; }
.src-tbl.as-cards td:first-child { flex-wrap: wrap; }
.src-tbl.as-cards td:first-child .src-l { flex: 1 1 0; text-align: right; }
.src-tbl.as-cards td:first-child .hb-track, .src-tbl.as-cards td:first-child .src-m { flex: 0 0 100%; }
.tbl td small { color: var(--a-mute); font-size: 12px; }
.stat-ex { display: flex; flex-wrap: wrap; gap: 8px; }
@media (min-width: 768px) {
  .tbl.src-tbl { table-layout: auto; }
  .src-tbl th:not(:first-child), .src-tbl td.num { width: 1%; padding: 0 0 0 8px; text-align: right; }
  .src-tbl th:first-child, .src-tbl.as-cards td:first-child { padding-left: 8px; padding-right: 8px; }
  .src-tbl.as-cards td:first-child .src-l { text-align: left; }
  .src-tbl.as-cards td { height: auto; padding-top: 10px; padding-bottom: 10px; }
}
/* 오탐 신고 */
.adm-note { margin: 0 0 12px; font-size: 14px; line-height: 1.7; color: var(--a-sub); }
.fp-tbl td b { display: block; line-height: 1.5; }
.fp-tbl td small { display: block; font-size: 12px; color: var(--a-mute); }
.fp-shapes { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.fp-shapes li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; min-width: 0; }
.fp-shapes code { flex: 1 1 200px; min-width: 0; font-size: 12px; overflow-wrap: anywhere; }
.fp-shapes span { font-size: 12px; color: var(--a-mute); }
.fp-note { margin: 6px 0 0; font-size: 13px; line-height: 1.6; color: var(--a-sub); overflow-wrap: anywhere; }
@media (min-width: 768px) {
  .fp-tbl th:nth-child(1) { width: 26%; }
  .fp-tbl th:nth-child(2), .fp-tbl th:nth-child(3), .fp-tbl th:nth-child(4) { width: 64px; }
}
