/* =========================================================
   mifplus blog — ADMIN design system
   공개 사이트(blog.css)와 동일 브랜드 톤. Paperlogy + 미니멀.
   ⚠ 레거시 관리자 페이지 인라인 스타일 호환을 위해
     --bg/--text/--muted/--line/--blue/--card 토큰 유지.
========================================================= */

@font-face {
  font-family: "Paperlogy";
  src: url("/Paperlogy-Regular.woff2") format("woff2");
  /* ⚠ 이 파일은 가변폰트가 아니라 Regular(400) 단일 굵기다 (fvar 축 없음).
     `font-weight: 400 800` 로 범위를 선언하면 브라우저가 "이 face가 700을 지원한다"고
     믿어 합성 볼드를 적용하지 않아, Paperlogy 제목이 굵어지지 않는다.
     400 으로 정직하게 선언해야 700 요청 시 합성 볼드가 적용된다. */
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root{
  /* 레거시 호환 토큰(값만 새 팔레트로) */
  --bg:#ffffff;
  --text:#15191d;
  --muted:#73797f;
  --line:#e8e9e7;
  --blue:#2563eb;
  --card:#ffffff;

  /* 새 토큰 */
  --surface:#f6f6f4;
  --surface-2:#efefec;
  --dark:#151b21;
  --radius:12px;
  --shadow:0 12px 34px rgba(18,23,28,.06);
  --shadow-sm:0 4px 14px rgba(18,23,28,.05);
  --admin-max:1000px;   /* 공개 사이트 blog.css --container 와 동일 */

  --font-display:"Paperlogy","Noto Sans KR",system-ui,sans-serif;
  --font-body:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",Arial,sans-serif;
}

*{ box-sizing:border-box; }
html{ max-width:100%; overflow-x:hidden; }
body{
  margin:0;
  max-width:100%;
  background:var(--surface);
  color:var(--text);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  /* body에 overflow-x:hidden 을 주면 overflow-y가 auto로 승격되어 body가 스크롤 컨테이너가 되고,
     그 결과 sticky(.adminTop / .dash-head)가 뷰포트 기준으로 고정되지 못해 깨진다.
     clip 은 스크롤 컨테이너를 만들지 않으므로 가로 넘침은 자르면서 sticky는 유지된다. */
  overflow-x:clip;
}
a{ color:inherit; text-decoration:none; }
a:hover{ color:var(--blue); }

/* 관리자 본문 컨테이너
   공개 사이트(blog.css .wrap)와 동일한 산식 → 콘텐츠 폭이 정확히 같아진다.
   좌우 padding 대신 width 계산으로 여백을 만들기 때문에, 1000px가 '콘텐츠 폭' 그대로다. */
.wrap{ width:min(calc(100% - 48px), var(--admin-max)); margin:0 auto; padding:24px 0 56px; }
.wrap h1, .wrap h2, .wrap h3{ font-family:var(--font-display); letter-spacing:-.02em; }

/* =========================================================
   상단 바 (topbar)
   ✅ 공개 사이트의 header.site-header / .brand / .primary-nav 와 동일한 사양.
      (84px 고정 높이 · 반투명+blur · 텍스트 링크 · hover/active 언더라인)
========================================================= */
/* 헤더 높이. JS(admin_head)가 실제 높이를 측정해 덮어쓰지만,
   JS 없이도 동작하도록 기본값 제공. 모바일 드롭다운의 max-height 계산에 쓰인다. */
:root{ --admin-top-h:84px; }

.adminTop{
  position:sticky; top:0; z-index:2000;
  display:flex; align-items:center;
  height:84px;
  background:rgba(255,255,255,.92);
  border-bottom:1px solid rgba(232,233,231,.7);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.adminTop .inner{
  /* .wrap 과 동일한 산식이어야 브랜드가 본문 좌측 끝과 정확히 정렬된다 */
  width:min(calc(100% - 48px), var(--admin-max));
  margin:0 auto;
  padding:0;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}

/* 브랜드 — 공개 사이트 .brand 와 동일 (+ 관리자 식별용 태그만 유지) */
.adminBrand{
  font-family:var(--font-display);
  font-size:22px; font-weight:700; letter-spacing:-.04em; color:var(--text);
  flex:0 0 auto; white-space:nowrap;
  display:inline-flex; align-items:center; gap:8px;
}
.adminBrand:hover{ color:var(--text); }
.adminBrand-tag{
  font-family:var(--font-body); font-size:11px; font-weight:600; letter-spacing:0;
  color:var(--muted); border:1px solid var(--line); border-radius:999px;
  padding:2px 8px;
}

/* 메뉴 — 알약 칩이 아니라 공개 사이트 .primary-nav 와 동일한 텍스트 링크 + 언더라인.
   gap은 항목이 9개라 28px(공개) 대신 24px. 1000px 폭에서 넘치지 않는다. */
.adminNav{
  display:flex; align-items:center; gap:24px;
  font-size:14px; font-weight:600;
}
.adminNav a{
  position:relative; display:inline-flex; align-items:center;
  color:var(--text); white-space:nowrap;
}
.adminNav a::after{
  content:""; position:absolute; left:0; bottom:-8px; width:100%; height:1px;
  background:var(--text); transform:scaleX(0); transform-origin:right;
  transition:transform .25s ease;
}
.adminNav a:hover{ color:var(--text); }
.adminNav a:hover::after{ transform:scaleX(1); transform-origin:left; }
.adminNav a.active::after{ transform:scaleX(1); background:var(--blue); }

.mCount{ display:inline-flex; align-items:center; gap:5px; margin-left:7px; }
.mBadge{
  display:inline-flex; align-items:center; justify-content:center;
  height:19px; min-width:19px; padding:0 7px; border-radius:999px;
  border:1px solid var(--line); background:#fff; color:var(--muted);
  font-size:11px; font-weight:700; line-height:1;
}
.mBadge.white{ border-color:var(--line); background:#fff; color:var(--muted); }
.mBadge.red{ border-color:#fecdd3; color:#b91c1c; background:#fff1f2; }
.mBadge.blue{ border-color:rgba(37,99,235,.25); color:var(--blue); background:rgba(37,99,235,.07); }

/* =========================================================
   모바일 햄버거 메뉴 (공개 사이트 .menu-button / .primary-nav 와 동일 패턴)
========================================================= */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

.adminMenuBtn{
  display:none; /* PC에서는 숨김 — 브랜드 옆 가로 메뉴(.adminNav) 사용 */
  border:0; background:transparent; width:34px; padding:5px;
  cursor:pointer; color:var(--text); flex:0 0 auto;
}
.adminMenuBtn span:not(.sr-only){
  display:block; height:1.5px; background:currentColor; margin:5px 0;
  transition:transform .25s ease, opacity .25s ease;
}

@media(max-width:720px){
  /* 공개 사이트 모바일 헤더와 동일한 70px */
  :root{ --admin-top-h:70px; }
  .adminTop{ height:70px; }

  .adminTop .inner{ width:min(calc(100% - 32px), var(--admin-max)); padding:0; }
  .adminBrand{ font-size:20px; }
  .adminMenuBtn{ display:block; }

  /* 햄버거 → X */
  .adminMenuBtn[aria-expanded="true"] span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
  .adminMenuBtn[aria-expanded="true"] span:nth-child(2){ opacity:0; }
  .adminMenuBtn[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

  /* 드롭다운 패널.
     .adminTop이 position:sticky(=positioned)라 absolute의 기준이 된다.
     fixed 대신 absolute를 쓰는 이유: .adminTop의 backdrop-filter가 fixed의 기준(containing block)을
     가로채기 때문에 fixed는 뷰포트 기준으로 동작하지 않는다. */
  .adminNav{
    position:absolute; left:0; right:0; top:100%;
    display:grid; gap:0;
    padding:8px 16px 16px; /* 좌우 16px = .wrap 의 모바일 여백(32px/2) 과 정렬 */
    background:rgba(255,255,255,.98);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    border-bottom:1px solid var(--line);
    max-height:calc(100vh - var(--admin-top-h)); overflow-y:auto;
    transform:translateY(-130%); opacity:0; pointer-events:none;
    transition:transform .28s ease, opacity .28s ease;
  }
  .adminNav.open{ transform:translateY(0); opacity:1; pointer-events:auto; }

  /* 드롭다운에서는 리스트 행. (공개 사이트 모바일 .primary-nav 와 동일) */
  .adminNav a{
    width:100%; padding:14px 2px;
    border-bottom:1px solid var(--line);
    justify-content:space-between;
  }
  .adminNav a::after{ display:none; } /* 세로 목록에선 언더라인 애니메이션 미사용 */
  .adminNav a.active{ color:var(--blue); font-weight:700; }

  .wrap{ width:min(calc(100% - 32px), var(--admin-max)); padding:18px 0 48px; }
}

/* =========================================================
   ✅ 모바일 폼 자동 확대(auto-zoom) 차단
   iOS Safari는 폼 컨트롤 글자가 16px 미만이면 포커스 시 화면을 멋대로 확대한다.
   viewport에 user-scalable=no / maximum-scale=1 을 주면 막히지만
   사용자의 '의도적인' 핀치 확대까지 봉쇄되어 접근성이 나빠진다.
   → 글자 크기를 16px로 올려 '자동 확대'만 차단한다. (핀치 확대는 그대로 동작)
   각 페이지의 인라인 <style>이 이 파일보다 늦게 로드되므로 !important 필요.
========================================================= */
@media(max-width:720px){
  input:not([type=checkbox]):not([type=radio]):not([type=range]),
  select,
  textarea,
  [contenteditable="true"],
  .note-editable{
    font-size:16px !important;
  }
}

/* =========================================================
   폼 요소 (레거시 .field / .btn 호환 · 새 룩)
========================================================= */
.field{
  width:100%;
  border:1px solid var(--line);
  border-radius:10px;
  padding:11px 13px;
  font-size:14px;
  outline:none;
  background:#fff;
  color:var(--text);
  transition: box-shadow .15s ease, border-color .15s ease;
}
.field::placeholder{ color:#a4a8a3; font-weight:400; }
.field:focus{ border-color:#a9adb0; box-shadow:0 0 0 4px rgba(21,27,33,.06); }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border:1px solid transparent; cursor:pointer; border-radius:10px;
  padding:11px 16px; font-weight:700; font-size:14px;
  background:var(--dark); color:#fff;
  box-shadow:0 8px 22px rgba(21,27,33,.14);
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn:hover{ transform:translateY(-2px); color:#fff; box-shadow:0 12px 28px rgba(21,27,33,.18); }
.btn:active{ transform:translateY(0); }
.btn.ghost{ background:#fff; color:var(--text); border-color:var(--line); box-shadow:none; }
.btn.ghost:hover{ color:var(--text); border-color:#c8cbcd; background:var(--surface); }
.btn.blue{ background:var(--blue); box-shadow:0 8px 22px rgba(37,99,235,.18); }
.btn.blue:hover{ background:#1d4ed8; }
.btn.danger{ background:#fff; color:#b91c1c; border-color:#fecdd3; box-shadow:none; }
.btn.danger:hover{ color:#b91c1c; background:#fff1f2; border-color:#fda4af; }
.btn.sm{ padding:7px 12px; font-size:12.5px; border-radius:8px; box-shadow:none; }

/* summernote 툴바 정리(레거시 유지) */
.note-editor.note-frame{ border:1px solid var(--line) !important; border-radius:12px !important; overflow:hidden; }
.note-editor .note-toolbar{ display:flex !important; flex-wrap:wrap !important; gap:6px !important; background:var(--surface) !important; }
.note-editor .note-toolbar .note-btn-group{ margin:0 !important; }
.note-editor .note-toolbar .note-btn{ border-radius:8px !important; }

/* =========================================================
   재사용 유틸리티 (관리자 페이지가 채택 가능; a- 프리픽스로 충돌 회피)
========================================================= */
.a-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:20px; }
.a-panel{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.a-title{ font-family:var(--font-display); font-size:22px; font-weight:700; letter-spacing:-.03em; margin:0; }
.a-subtle{ color:var(--muted); font-size:13px; }
.a-head{ display:flex; align-items:center; justify-content:space-between; gap:14px; margin:6px 0 20px; }
.a-toolbar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.a-empty{ padding:56px 0; text-align:center; color:var(--muted); font-size:14px; }
.a-muted{ color:var(--muted); }
.a-pill{
  display:inline-flex; align-items:center; gap:6px; padding:5px 10px; border-radius:999px;
  border:1px solid var(--line); background:#fff; color:var(--muted); font-size:12px; font-weight:600;
}
.a-pill.on{ color:var(--blue); border-color:rgba(37,99,235,.28); background:rgba(37,99,235,.06); }

/* 테이블 */
.a-table{ width:100%; border-collapse:collapse; font-size:14px; }
.a-table th, .a-table td{ padding:12px 14px; text-align:left; border-bottom:1px solid var(--line); }
.a-table thead th{ color:var(--muted); font-weight:600; font-size:12px; letter-spacing:.02em; text-transform:uppercase; background:var(--surface); }
.a-table tbody tr:hover{ background:var(--surface); }
.a-table tbody tr:last-child td{ border-bottom:0; }

/* 스탯 카드 */
.a-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:14px; }
.a-stat{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:18px 20px; }
.a-stat .k{ color:var(--muted); font-size:12.5px; font-weight:600; }
.a-stat .v{ font-family:var(--font-display); font-size:26px; font-weight:700; margin-top:6px; letter-spacing:-.02em; }

/* =========================================================
   ✅ 관리자 페이지 공용 디자인 시스템  (.adminPage 스코프)
   방문자(admin_count) / 목록(admin_dashboard) 이 동일한 컴포넌트를 공유한다.
   → 여기 한 곳만 고치면 두 페이지가 같이 바뀐다. (복붙 금지)

   .adminPage 로 스코프를 둔 이유:
   .box/.card/.btn/.tbl 같은 흔한 이름을 전역에 풀면 다른 admin 페이지
   (recent/setting/tags/categories)의 인라인 스타일과 충돌하기 때문.
   → 이 시스템을 쓰려는 페이지만 최상위에 class="adminPage" 를 붙인다.

   폰트 규칙은 공개 사이트와 동일: 본문 --font-body, 제목/숫자만 --font-display
========================================================= */
.adminPage{ width:100%; font-family:var(--font-body); }

/* ---- 페이지 헤더 ---- */
.adminPage .pageHead{
  padding:0 0 14px; margin:0 0 16px;
  border-bottom:1px solid var(--line);
}
.adminPage .pageHead h1{
  margin:0; font-family:var(--font-display);
  font-size:20px; font-weight:700; letter-spacing:-.02em; color:var(--text);
}
.adminPage .pageHead .sub{ margin:6px 0 0; color:var(--muted); font-size:13px; }
.adminPage .pageHead .sub b{ color:var(--text); font-variant-numeric:tabular-nums; }

/* ---- 세그먼트 컨트롤 (탭 / 상태필터 공용) ----
   자식이 <button>(탭)이든 <a>(필터)든 동일하게 보이게 한다. */
.adminPage .seg{
  display:flex; gap:4px; padding:4px;
  border:1px solid var(--line); border-radius:999px; background:var(--surface);
  overflow-x:auto; scrollbar-width:none;
}
.adminPage .seg::-webkit-scrollbar{ display:none; }
.adminPage .seg > *{
  flex:0 0 auto; border:0; background:transparent; cursor:pointer;
  display:inline-flex; align-items:center; height:30px; padding:0 14px;
  border-radius:999px; white-space:nowrap; text-decoration:none;
  color:var(--muted); font-size:12.5px; font-weight:600;
  transition:color .15s ease, background .15s ease;
}
.adminPage .seg > *:hover{ color:var(--text); }
.adminPage .seg > .is-active{ background:var(--dark); color:#fff; font-weight:700; }

/* ---- 툴바 ---- */
.adminPage .toolbar{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:0 0 14px; }
.adminPage .toolbar form{ display:flex; gap:8px; align-items:center; margin:0; }
.adminPage .scopeLabel{ color:var(--muted); font-size:12px; font-weight:600; }

.adminPage .select{
  border:1px solid var(--line); border-radius:10px;
  height:34px; padding:0 10px;
  font-size:13px; font-weight:600;
  background:var(--bg); color:var(--text); outline:none; cursor:pointer;
}

.adminPage .btn{
  border:1px solid var(--line); background:var(--bg); color:var(--muted);
  height:34px; padding:0 14px; border-radius:999px; cursor:pointer;
  font-size:12.5px; font-weight:600;
  transition:color .15s ease, border-color .15s ease, background .15s ease;
}
.adminPage .btn:hover{ color:var(--text); border-color:#d5d6d2; }
.adminPage .btn.is-active{ background:var(--dark); border-color:var(--dark); color:#fff; font-weight:700; }

.adminPage .searchBox{
  display:flex; align-items:center; gap:8px;
  border:1px solid var(--line); border-radius:10px;
  height:34px; padding:0 12px; background:var(--bg);
}
.adminPage .searchBox input{
  border:0; outline:none; background:transparent;
  font-size:13px; font-weight:500; color:var(--text); width:240px;
}
.adminPage .searchBox input::placeholder{ color:var(--muted); }

/* ---- 패널 ---- */
.adminPage .box{
  border:1px solid var(--line); border-radius:var(--radius);
  background:var(--bg); padding:18px;
}
.adminPage .box + .box{ margin-top:14px; }
.adminPage .box h3{
  margin:0 0 14px; font-family:var(--font-display);
  font-size:15px; font-weight:700; letter-spacing:-.02em; color:var(--text);
}

/* ---- KPI 카드 ---- */
.adminPage .cards{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.adminPage .cards + .box{ margin-top:14px; }
.adminPage .card{
  border:1px solid var(--line); border-radius:var(--radius);
  background:var(--bg); padding:16px;
}
.adminPage .card .k{ color:var(--muted); font-size:12px; font-weight:600; }
.adminPage .card .v{
  margin-top:8px; color:var(--text);
  font-family:var(--font-display); font-size:24px; font-weight:700;
  letter-spacing:-.02em; font-variant-numeric:tabular-nums;
}

/* ---- 미니 카드 ---- */
.adminPage .miniCards{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:0 0 14px; }
.adminPage .miniCard{
  border:1px solid var(--line); border-radius:var(--radius);
  background:var(--surface); padding:14px;
}
.adminPage .miniCard .k{ color:var(--muted); font-size:12px; font-weight:600; }
.adminPage .miniCard .v{
  margin-top:6px; color:var(--text);
  font-family:var(--font-display); font-size:20px; font-weight:700;
  letter-spacing:-.02em; font-variant-numeric:tabular-nums;
}
.adminPage .miniCard .s{
  margin-top:4px; color:var(--muted); font-size:12px; font-weight:500;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

/* ---- 테이블 ---- */
.adminPage .tblWrap{
  border:1px solid var(--line); border-radius:var(--radius);
  background:var(--bg);
  overflow-x:auto;              /* 모바일에서 좁으면 가로 스크롤 (레이아웃 깨짐 방지) */
}
.adminPage .tbl{ width:100%; border-collapse:collapse; }
.adminPage .tbl th, .adminPage .tbl td{
  padding:12px 14px; text-align:left; font-size:13px;
  border-bottom:1px solid var(--line);
}
.adminPage .tbl th{
  background:var(--surface); color:var(--muted);
  font-size:12px; font-weight:600; white-space:nowrap;
}
.adminPage .tbl tbody tr:last-child td{ border-bottom:0; }
.adminPage .tbl tbody tr:hover{ background:var(--surface); }
/* 마지막 열 = 수치 → 우측 정렬. JS가 만들어내는 행에도 자동 적용된다. */
.adminPage .tbl th:last-child, .adminPage .tbl td:last-child{
  text-align:right; font-variant-numeric:tabular-nums;
}
.adminPage .tbl td:last-child b{ font-weight:700; }
/* '데이터 없음' 같은 colspan 셀은 가운데 */
.adminPage .tbl td[colspan]{ text-align:center; color:var(--muted); padding:24px 14px; }

.adminPage .muted{ color:var(--muted); }
.adminPage .link{ color:var(--blue); font-weight:600; cursor:pointer; text-underline-offset:3px; }
.adminPage .link:hover{ text-decoration:underline; }

/* 글 목록 셀 — 방문자 '게시글' 탭과 목록(dashboard) 이 동일하게 쓴다 */
.adminPage .aTitle a{ color:var(--text); font-weight:700; }
.adminPage .aTitle a:hover{ color:var(--blue); }
.adminPage .aMuted{ color:var(--muted); font-weight:500; white-space:nowrap; }
.adminPage .aCnt{ font-weight:700; color:var(--text); }

/* ---- 페이저: Prev/Next 형 (방문자) ---- */
.adminPage .pager{
  display:flex; justify-content:space-between; align-items:center;
  gap:10px; flex-wrap:wrap; margin-top:12px;
}
.adminPage .pbtns{ display:flex; gap:8px; align-items:center; }
.adminPage .pbtn{
  border:1px solid var(--line); background:var(--bg); color:var(--muted);
  height:32px; padding:0 14px; border-radius:999px; cursor:pointer;
  font-size:12.5px; font-weight:600;
}
.adminPage .pbtn:hover:not(:disabled){ color:var(--text); border-color:#d5d6d2; }
.adminPage .pbtn:disabled{ opacity:.35; cursor:default; }
.adminPage .pstat{ color:var(--muted); font-size:12px; font-weight:500; font-variant-numeric:tabular-nums; }

/* ---- 페이저: 번호 형 (목록) ---- */
.adminPage .pageNav{
  display:flex; justify-content:center; align-items:center;
  gap:6px; flex-wrap:wrap; margin-top:16px;
}
.adminPage .pageNav a, .adminPage .pageNav span{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:32px; height:32px; padding:0 8px;
  border:1px solid var(--line); border-radius:8px; background:var(--bg);
  color:var(--muted); font-size:12.5px; font-weight:600;
  font-variant-numeric:tabular-nums;
}
.adminPage .pageNav a:hover{ color:var(--text); border-color:#d5d6d2; }
.adminPage .pageNav .on{ background:var(--dark); border-color:var(--dark); color:#fff; font-weight:700; }
.adminPage .pageNav .dots{ border:0; background:transparent; min-width:auto; }

/* ---- 반응형: PC/모바일 동일한 구성, 열 수만 접는다 ---- */
@media(max-width:720px){
  .adminPage .cards{ grid-template-columns:repeat(2,1fr); }
  .adminPage .miniCards{ grid-template-columns:1fr; }
  .adminPage .box{ padding:14px; }
  .adminPage .searchBox{ flex:1; }
  .adminPage .searchBox input{ width:100%; }
  .adminPage .toolbar > form:first-child{ flex:1; }
}

/* =========================================================
   ✅ 글 목록 카드 — 공개 블로그(home.php .cards.list / .card)와 동일한 사양
   값은 home.php 와 1:1로 맞춘다. (원본이 바뀌면 여기도 같이 고칠 것)

   ⚠ 클래스명이 .card 가 아니라 .postCard 인 이유:
      `.adminPage .card` 는 이 시스템에서 이미 KPI 카드(방문자 월별 탭)로 쓰이고 있어
      이름을 재사용하면 그쪽이 깨진다. 이름만 다르고 스타일은 공개 사이트와 동일.
========================================================= */
.adminPage .postList{ display:flex; flex-direction:column; gap:14px; }

.adminPage .postCard{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  padding:22px 24px;
  cursor:pointer;
  display:flex; flex-direction:column; gap:12px;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.adminPage .postCard:hover{ transform:translateY(-3px); border-color:#e0e1de; box-shadow:var(--shadow); }
.adminPage .postCard:active{ transform:translateY(-1px); }

/* 카드 상단 메타 줄 — 관리자 전용 정보(발행상태·비밀글·조회수)가 여기 들어간다 */
.adminPage .metaTop{ display:flex; justify-content:space-between; gap:10px; align-items:center; flex-wrap:wrap; }
.adminPage .metaLeft,
.adminPage .metaRight{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.adminPage .postCard .cat{ color:var(--blue); font-weight:700; font-size:12px; letter-spacing:.02em; }
.adminPage .postCard .date{ color:var(--muted); font-weight:600; font-size:12px; }
.adminPage .postCard .views{ color:var(--muted); font-weight:600; font-size:12px; font-variant-numeric:tabular-nums; }

.adminPage .titleRow{ display:flex; align-items:center; gap:10px; min-width:0; }
/* 공개 사이트와 동일: 본문과 같은 폰트·크기, 굵기만 다름 */
.adminPage .postCard .title{
  margin:0; font-size:14px; font-weight:700; font-family:var(--font-body);
  color:var(--text); flex:0 1 auto; min-width:0; word-break:break-word;
}
.adminPage .postCard .title a{ color:inherit; }
.adminPage .postCard .title a:hover{ color:var(--blue); }

.adminPage .rowMid{ display:grid; gap:14px; align-items:start; }
.adminPage .rowMid.hasThumb{ grid-template-columns:1fr 200px; }
.adminPage .rowMid.noThumb{ grid-template-columns:1fr; }
.adminPage .contentCol{ min-width:0; display:flex; flex-direction:column; gap:14px; }

.adminPage .excerpt{ font-size:14px; color:#4f565d; line-height:1.75; margin:0; }
.adminPage .excerpt.is-secret{ color:#1e3a8a; font-weight:600; }

.adminPage .tagsRow{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.adminPage .tagchip{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:600; padding:7px 12px; border-radius:8px;
  border:1px solid var(--line); background:#fff; color:var(--muted); text-decoration:none;
  transition:color .2s ease, border-color .2s ease, background .2s ease;
}
.adminPage .tagchip:hover{ color:var(--text); border-color:#c8cbcd; background:var(--surface); }

.adminPage .thumb{
  border-radius:10px; border:1px solid var(--line); background:var(--surface);
  overflow:hidden; display:flex; align-items:stretch; justify-content:stretch;
}
.adminPage .thumb img{ width:100%; height:100%; display:block; object-fit:cover; transition:transform .45s ease; }
.adminPage .postCard:hover .thumb img{ transform:scale(1.04); }
.adminPage .thumb-square{ aspect-ratio:1/1; }

@media(max-width:720px){
  .adminPage .postCard{ padding:18px; }
  .adminPage .rowMid{ display:flex; flex-direction:column; }
  .adminPage .rowMid .thumb{ order:1; }
  .adminPage .rowMid .contentCol{ order:2; }
  .adminPage .thumb-square{ aspect-ratio:16/9; }
}