/* ══════════════════════════════════════════════════════════════
   골목담아 관리자 · LIGHT & SOFT 테마 (프로토타입 v1 기준)
   기존 admin.css 뒤에 얹어 색·라운드·글꼴만 바꾼다. 마크업은 그대로.
   ══════════════════════════════════════════════════════════════ */

body.adm-dark,body.login-dark{
  --ink:#31352F;            /* 따뜻한 진회색 — 검정 아님 */
  --ink2:#3C4139;
  --sub:#6E7368;
  --mut:#9AA093;
  --line:#E4E7EC;
  --bg:#F5F6F8;             /* 중립 회백 — 가게 페이지 · 랜딩과 같은 계열 */
  --brand:#F0522B;          /* 서비스 전체와 같은 오렌지 한 색 */
  --brand-soft:#FFEDE6;
  --brand-deep:#C93F1E;
  --teal:#3E7F86;  --teal-soft:#E3F0F1;
  --amber:#9A7420; --amber-soft:#FAF2DF;
  --brick:#A0503C; --brick-soft:#F7E9E4;
  --ok:#3E7549;    --wn:#9A7420; --dg:#A0503C;
  --mono:'Pretendard Variable','Pretendard',sans-serif;
  --soft:'Pretendard Variable','Pretendard',sans-serif;
  --shadow:0 1px 2px rgba(49,53,47,.04),0 10px 24px rgba(49,53,47,.06);
  --shadow-lg:0 20px 48px rgba(49,53,47,.14);
  background:var(--bg); color:var(--ink);
  letter-spacing:.005em;
}
body.adm-dark .lay,body.adm-dark .main{background:var(--bg)}

/* ── 제목은 부드러운 글꼴, 숫자는 모노 ── */
body.adm-dark h1,body.adm-dark h2,body.adm-dark h3,body.adm-dark h4,
body.adm-dark .top h1,body.adm-dark .card h2,body.login-dark h2{
  font-family:var(--soft); font-weight:400; letter-spacing:-.01em;
}
body.adm-dark .mono,body.adm-dark td.n,body.adm-dark code{letter-spacing:0}
body.adm-dark td.n,body.adm-dark th.n{font-family:var(--mono)}

/* ── 모서리를 전부 둥글게 ── */
body.adm-dark .card,body.adm-dark .stat .b,body.adm-dark .photo-card,
body.adm-dark .detail,body.adm-dark .accard,body.adm-dark .panel{border-radius:22px}
body.adm-dark .btn,body.adm-dark .fld input,body.adm-dark .fld select,body.adm-dark .fld textarea,
body.adm-dark .card input:not([type="checkbox"]):not([type="radio"]),
body.adm-dark .card select,body.adm-dark .card textarea,
body.adm-dark .cell-input,body.adm-dark .mode-c,body.adm-dark .fld-grid label,
body.adm-dark .sel a,body.adm-dark .tip,body.adm-dark .badge,
body.login-dark .box,body.login-dark .btn,body.login-dark .fld input{border-radius:14px}
body.adm-dark .badge{border-radius:20px;padding:4px 10px}
body.adm-dark .sel a{border-radius:20px}
body.adm-dark .btn.sm{border-radius:11px}

/* ── 사이드바: 흰 종이 + 초록 하이라이트 ── */
body.adm-dark .side{
  background:#fff; border-right:1px solid var(--line); color:var(--sub);
  box-shadow:4px 0 20px rgba(49,53,47,.04);
}
body.adm-dark .side .bd,body.adm-dark .side .bd.brand-lockup{color:var(--ink);border-bottom-color:var(--line)}
body.adm-dark .side .bd small,body.adm-dark .side .bd.brand-lockup .brand-copy small{color:var(--mut)}
body.adm-dark .side .grp{color:var(--mut);font-family:var(--mono);letter-spacing:.11em}
body.adm-dark .side>a{color:var(--sub);border-radius:12px;font-weight:600}
body.adm-dark .side>a:hover{background:var(--bg);color:var(--ink)}
body.adm-dark .side>a.on{background:var(--brand-soft);color:var(--brand-deep);font-weight:700;box-shadow:none}
body.adm-dark .side-shop{border-top-color:var(--line)}
body.adm-dark .side-shop>i{background:linear-gradient(140deg,var(--brand),#356A41);color:#fff;border-radius:14px}
body.adm-dark .side-shop b{color:var(--ink)}
body.adm-dark .side-shop small{color:var(--mut);font-family:var(--mono)}
body.adm-dark .side-account{border-top-color:var(--line);color:var(--mut)}
body.adm-dark .side-account a{color:var(--brand);font-weight:700}
body.adm-dark .side{box-shadow:14px 0 40px rgba(49,53,47,.12)}
body.adm-dark.nav-open .side-dim{background:rgba(49,53,47,.24)}

/* ── 상단 바 ── */
body.adm-dark .top{
  background:rgba(255,255,255,.94); border-color:var(--line);
  box-shadow:0 1px 10px rgba(49,53,47,.04); backdrop-filter:blur(10px);
}
body.adm-dark .top h1{color:var(--ink)}
body.adm-dark .top-title small{color:var(--mut);font-family:var(--mono);letter-spacing:.11em}
body.adm-dark .top .r{color:var(--sub)}
body.adm-dark .top select{background:#fff;border-color:var(--line);color:var(--ink);border-radius:12px}
body.adm-dark .side-toggle{background:#fff;border-color:var(--line);color:var(--ink);border-radius:13px}

/* ── 카드 ── */
body.adm-dark .card{
  background:#fff!important; border-color:var(--line)!important;
  box-shadow:var(--shadow);
}
body.adm-dark .card h2{color:var(--ink);font-size:16px}
body.adm-dark .card h2 .more{color:var(--mut);font-weight:600}

/* ── 지표 카드 ── */
body.adm-dark .stat .b{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}
body.adm-dark .stat .b .l{color:var(--sub)}
body.adm-dark .stat .b .v{color:var(--ink);font-family:var(--soft);font-weight:400;letter-spacing:-.03em}
body.adm-dark .stat .b.hot{background:#FBF6E7;border-color:#EFE0B4}
body.adm-dark .stat .b.hot .v{color:#8A6512}

/* ── 표 ── */
body.adm-dark table.t{background:#fff;color:var(--ink)}
body.adm-dark table.t th,body.adm-dark table.t td{border-color:#F0F1EC}
body.adm-dark table.t th{
  background:var(--bg); color:var(--mut);
  font:700 12px var(--mono); letter-spacing:.04em;
}
body.adm-dark table.t tbody tr:hover td{background:#FAFBF7}
body.adm-dark table.t td small{color:var(--mut)}
body.adm-dark .crow.on td{background:var(--brand-soft)}

/* ── 버튼 ── */
body.adm-dark .btn:not(.g):not(.red):not(.o),body.login-dark .btn:not(.g){
  background:var(--brand); color:#fff; box-shadow:0 2px 0 var(--brand-deep);
}
body.adm-dark .btn:not(.g):not(.red):not(.o):hover{background:#427C4E;filter:none}
body.adm-dark .btn.g{background:var(--bg);color:var(--sub);border:1px solid var(--line);box-shadow:none}
body.adm-dark .btn.g:hover{background:#EAECE4;color:var(--ink)}
body.adm-dark .btn.o{background:#fff;color:var(--brand);border:1.5px solid var(--brand)}
body.adm-dark .btn.red{background:var(--brick-soft);color:var(--brick);box-shadow:none}

/* ── 입력 ── */
body.adm-dark .fld label{color:var(--sub)}
body.adm-dark .fld input,body.adm-dark .fld select,body.adm-dark .fld textarea,
body.adm-dark .card input:not([type="checkbox"]):not([type="radio"]),
body.adm-dark .card select,body.adm-dark .card textarea,body.adm-dark .cell-input{
  background:#FBFCFA; border-color:var(--line); color:var(--ink);
}
body.adm-dark .fld input:focus,body.adm-dark .fld select:focus,body.adm-dark .fld textarea:focus,
body.adm-dark .card input:focus,body.adm-dark .card select:focus,body.adm-dark .card textarea:focus,
body.adm-dark .cell-input:focus{
  background:#fff; border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(240,82,43,.14);
}
body.adm-dark .fld input::placeholder,body.adm-dark .fld textarea::placeholder{color:var(--mut)}
body.adm-dark .fld .hint{color:var(--mut)}

/* ── 알림 상자 ── */
body.adm-dark .tip{background:var(--teal-soft);border-color:#C6E0E2;color:#2E6167}
body.adm-dark .tip.warn{background:var(--amber-soft);border-color:#EDDCB0;color:#7A5B14}
body.adm-dark .tip.ok{background:var(--brand-soft);border-color:#C9E0CB;color:#2F5A38}
body.adm-dark .tip a{font-weight:800;color:inherit;text-decoration:underline;text-underline-offset:2px}

/* ── 상태 배지 ── */
body.adm-dark .b-on{background:var(--brand-soft);color:var(--brand-deep)}
body.adm-dark .b-br{background:var(--teal-soft);color:var(--teal)}
body.adm-dark .b-wn{background:var(--amber-soft);color:var(--amber)}
body.adm-dark .b-dg{background:var(--brick-soft);color:var(--brick)}
body.adm-dark .b-off{background:#EEEFE9;color:var(--mut)}

/* ── 필터 칩 ── */
body.adm-dark .sel a{background:#fff;border-color:var(--line);color:var(--sub)}
body.adm-dark .sel a:hover{border-color:#C7CCBF;color:var(--ink)}
body.adm-dark .sel a.on{background:var(--brand);border-color:var(--brand);color:#fff}

/* ── 선택 카드(예약·주문 방식 등) ── */
body.adm-dark .mode-c,body.adm-dark .fld-grid label{background:#fff;border-color:var(--line);color:var(--ink)}
body.adm-dark .mode-c.on,body.adm-dark .fld-grid label:has(input:checked){
  background:var(--brand-soft); border-color:var(--brand); box-shadow:inset 3px 0 var(--brand);
}
body.adm-dark .mode-c .fl b{background:var(--bg);color:var(--sub)}
body.adm-dark .mode-need{background:var(--amber-soft);color:#7A5B14}

/* ── 기타 면 ── */
body.adm-dark code{background:var(--bg);color:var(--sub);border-radius:7px}
body.adm-dark hr{border-color:var(--line)!important}
body.adm-dark .empty{color:var(--mut)}
body.adm-dark .script{background:var(--bg);color:var(--sub);border:1px solid var(--line);border-radius:14px}
body.adm-dark .photo-card{background:#fff!important;border-color:var(--line)!important;color:var(--ink)}
body.adm-dark .photo-card .btn.g{background:var(--bg)}
body.adm-dark .image-preview,body.adm-dark .item-thumb{background:var(--bg);border-color:#D5D9CD;color:var(--mut)}
/* 홍보 도구 탭 — 숏폼 · 카드뉴스 · 상세페이지 · 채널 설정 네 화면을 오간다 */
body.adm-dark .promo-hub-tabs{background:var(--bg);border:0;border-radius:16px;padding:5px;gap:5px;box-shadow:none}
body.adm-dark .promo-hub-tabs a{border-radius:12px;color:var(--sub);font-weight:700;font-size:13px;box-shadow:none}
body.adm-dark .promo-hub-tabs a:hover{background:#fff;color:var(--ink)}
body.adm-dark .promo-hub-tabs a.on{background:var(--brand);color:#fff;box-shadow:0 2px 0 var(--brand-deep)}
@media(max-width:900px){
  body.adm-dark .promo-hub-tabs{display:grid;grid-template-columns:1fr 1fr}
  body.adm-dark .promo-hub-tabs a{padding:10px 8px;font-size:12.5px}
}
body.adm-dark [style*="background:#FFF9F0"]{background:#FBF6E7!important;border-color:#EFE0B4!important}
body.adm-dark [style*="border-bottom:1px solid var(--line)"]{border-color:var(--line)!important}
body.adm-dark .sl .bt button,body.adm-dark .sh-ctl button{background:#fff;border-color:var(--line);color:var(--ink);border-radius:12px}
body.adm-dark .option-list>div{background:#FBFCFA;border-color:var(--line);color:var(--ink);border-radius:14px}

/* ── 폰 미리보기: 단단한 검정 → 부드러운 회백 ── */
body.adm-dark .phone{
  border-color:#DDE1D8; border-width:10px; border-radius:40px;
  box-shadow:0 22px 52px rgba(49,53,47,.16);
}

/* ── 로그인 화면 ── */
body.login-dark{background:var(--bg);color:var(--ink)}
body.login-dark .box{
  background:#fff; border:1px solid var(--line);
  box-shadow:var(--shadow); border-radius:22px;
}
body.login-dark .login-brand,body.login-dark .login-brand b{color:var(--ink)}
body.login-dark .fld label{color:var(--sub)}
body.login-dark .fld input{background:#FBFCFA;border-color:var(--line);color:var(--ink)}
body.login-dark .fld input:focus{background:#fff;border-color:var(--brand);box-shadow:0 0 0 3px rgba(240,82,43,.14)}
body.login-dark .btn.w{box-shadow:0 2px 0 var(--brand-deep)}
body.login-dark .tip{background:var(--brick-soft)!important;border-color:#EBD3CB!important;color:var(--brick)!important}

/* ── 카드 제목에 구분선 (프로토타입 card-h) ── */
body.adm-dark .card>h2{
  padding-bottom:13px; margin-bottom:16px;
  border-bottom:1px solid var(--line);
}
body.adm-dark .card>h2:only-child{border-bottom:0;padding-bottom:0;margin-bottom:0}

/* ── 로그인: 종이 위 부드러운 빛 ── */
body.login-dark{background:radial-gradient(circle at 50% 16%,#FFFFFF 0,#F3F4EF 52%,#EDEFE7 100%)}
body.login-dark:before{color:var(--mut);font-family:var(--mono);letter-spacing:.2em}

/* ── PHP 안에 박힌 옛 회청색을 종이색으로 ── */
body.adm-dark [style*="background:#EEF1F6"],
body.adm-dark [style*="background:#EEF1F5"],
body.adm-dark [style*="background:#F7F8FA"]{background:var(--bg)!important}
body.adm-dark [style*="#DDE2EA"],
body.adm-dark [style*="#DDE3EB"],
body.adm-dark [style*="#E8EBF0"]{border-color:var(--line)!important}
body.adm-dark [style*="border:1px solid #DDE2EA"],
body.adm-dark [style*="border:1px solid #DDE3EB"]{border-radius:12px!important}
body.adm-dark [style*="color:#667085"]{color:var(--sub)!important}
body.adm-dark [style*="color:#8A5A00"]{color:#7A5B14!important}

/* ── 사이드바 가게 카드 (메뉴 위 · 프로토타입 .shop) ── */
body.adm-dark .side-shop{
  margin:0 0 4px; padding:0 8px 16px;
  border-top:0; border-bottom:1px solid var(--line);
  display:flex; gap:11px; align-items:center;
}
body.adm-dark .side-shop>i{
  width:38px; height:38px; font-size:15px; font-weight:800; flex:none;
  display:grid; place-items:center; border-radius:14px;
  background:linear-gradient(140deg,var(--brand),#356A41); color:#fff;
}
body.adm-dark .side-shop>div{min-width:0}
body.adm-dark .side-shop b{
  display:block; font-size:13.5px; font-weight:700; color:var(--ink);
  letter-spacing:-.02em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
body.adm-dark .side-shop small{
  display:block; font-family:var(--mono); font-size:12px; color:var(--mut);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
body.adm-dark .side .grp:first-of-type{padding-top:14px}

/* ══════════════════════════════════════════════════════════════
   가게 만들기 위저드(start.php)도 같은 종이 테마로 — 가입 → 관리자 흐름이 이어지도록
   ══════════════════════════════════════════════════════════════ */
body.wz-dark{
  --ink:#31352F; --ink2:#3C4139; --sub:#6E7368; --mut:#9AA093;
  --line:#E4E6DF; --bg:#F3F4EF;
  --brand:#4C8C5A; --brand-soft:#E7F1E6; --brand-deep:#3E7549;
  --teal:#3E7F86; --teal-soft:#E3F0F1; --amber:#9A7420; --amber-soft:#FAF2DF;
  --brick:#A0503C; --brick-soft:#F7E9E4; --ok:#3E7549; --wn:#9A7420; --dg:#A0503C;
  --mono:'Pretendard Variable','Pretendard',sans-serif;
  --soft:'Pretendard Variable','Pretendard',sans-serif;
  color:var(--ink);
  background:
    radial-gradient(circle at 84% 12%,rgba(240,82,43,.10),transparent 30%),
    linear-gradient(140deg,#F7F8F3 0%,#F3F4EF 58%,#EDEFE7 100%);
}
body.wz-dark:before{opacity:.5;background-image:
  linear-gradient(rgba(49,53,47,.045) 1px,transparent 1px),
  linear-gradient(90deg,rgba(49,53,47,.045) 1px,transparent 1px)}
body.wz-dark h1,body.wz-dark h2,body.wz-dark h3{font-family:var(--soft);font-weight:400;letter-spacing:-.01em}
body.wz-dark .wzh{background:rgba(255,255,255,.92);border-color:var(--line);color:var(--ink)}
body.wz-dark .card{
  background:#fff; border-color:var(--line); border-radius:22px;
  box-shadow:0 1px 2px rgba(49,53,47,.04),0 14px 32px rgba(49,53,47,.07);
}
body.wz-dark .steps{gap:6px;background:transparent;border:0}
body.wz-dark .step{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px}
body.wz-dark .step.on{background:var(--brand-soft);border-color:var(--brand);box-shadow:none}
body.wz-dark .step.done{opacity:1;background:var(--bg)}
body.wz-dark .step .n{color:var(--sub);font-family:var(--mono)}
body.wz-dark .step.on .n{color:var(--brand-deep)}
body.wz-dark .step .t{color:var(--sub)}
body.wz-dark .step.on .t{color:var(--ink);font-weight:700}
body.wz-dark .opt{background:#fff;border-color:var(--line);border-radius:14px;color:var(--ink)}
body.wz-dark .opt:hover{border-color:#C7CCBF;background:#FBFCFA}
body.wz-dark .opt.sel{background:var(--brand-soft);border-color:var(--brand);box-shadow:inset 3px 0 var(--brand)}
body.wz-dark .tag{background:var(--bg);color:var(--sub);border:1px solid var(--line)}
body.wz-dark .blockrow{border-color:var(--line)}
body.wz-dark .sw i{background:#D8DBD2}
body.wz-dark .sw input:checked+i{background:var(--brand)}
body.wz-dark .fld label{color:var(--sub)}
body.wz-dark .fld input,body.wz-dark .fld select,body.wz-dark .fld textarea{
  background:#FBFCFA;border-color:var(--line);color:var(--ink);border-radius:14px;
}
body.wz-dark .fld input:focus,body.wz-dark .fld select:focus,body.wz-dark .fld textarea:focus{
  background:#fff;border-color:var(--brand);box-shadow:0 0 0 3px rgba(240,82,43,.14);
}
body.wz-dark .fld input::placeholder,body.wz-dark .fld textarea::placeholder{color:var(--mut)}
body.wz-dark .tip{background:var(--teal-soft);border-color:#C6E0E2;color:#2E6167;border-radius:14px}
body.wz-dark .tip.warn{background:var(--amber-soft);border-color:#EDDCB0;color:#7A5B14}
body.wz-dark .tip.ok{background:var(--brand-soft);border-color:#C9E0CB;color:#2F5A38}
body.wz-dark code{background:var(--bg);color:var(--sub)}
body.wz-dark .btn:not(.g):not(.red):not(.o){background:var(--brand);color:#fff;box-shadow:0 2px 0 var(--brand-deep);border-radius:14px}
body.wz-dark .btn.g{background:var(--bg);color:var(--sub);border:1px solid var(--line);border-radius:14px}
body.wz-dark .btn.g:hover{background:#EAECE4;color:var(--ink)}
body.wz-dark .phone{border-color:#DDE1D8;border-width:10px;border-radius:40px;box-shadow:0 22px 52px rgba(49,53,47,.16)}
body.wz-dark .badge{border-radius:20px}
body.wz-dark .b-on{background:var(--brand-soft);color:var(--brand-deep)}
body.wz-dark .b-wn{background:var(--amber-soft);color:var(--amber)}
body.wz-dark .b-off{background:#EEEFE9;color:var(--mut)}

/* ── 시작 화면 글자색: 어두운 테마 값이 그대로 남아 종이 배경에서 흐릿했다 ── */
body.wz-dark .wz-brand>span{color:var(--sub);border-left-color:var(--line)}
body.wz-dark .wz-brand.brand-lockup .brand-slogan{color:var(--sub)}
body.wz-dark .wz-head-links a{color:var(--sub)}
body.wz-dark .wz-head-links a:hover{color:var(--ink)}
body.wz-dark .wz-head-links a:last-child{color:var(--ink)}
body.wz-dark .wz-head-links b{color:var(--brand-deep)}
body.wz-dark .wz-kicker{color:var(--brand-deep);letter-spacing:.11em}
body.wz-dark .wz-kicker i{background:var(--brand)}
body.wz-dark .wz-start-copy h1{font-weight:400;color:var(--ink)}
body.wz-dark .wz-start-copy h1 em{color:var(--brand-deep)}
body.wz-dark .wz-start-copy>p{color:var(--ink2);font-size:15.5px;line-height:1.8}
body.wz-dark .wz-start-flow{border-top-color:var(--line);border-bottom-color:var(--line)}
body.wz-dark .wz-start-flow div b{color:var(--brand-deep)}
body.wz-dark .wz-start-flow div span{color:var(--ink);font-size:12px}
body.wz-dark .wz-start-flow>i{color:var(--sub)}
body.wz-dark .wz-sample-link{color:var(--ink);font-size:12.5px;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:5px}
body.wz-dark .wz-sample-link:hover{text-decoration-color:var(--brand)}
body.wz-dark .wz-sample-link b{color:var(--brand-deep)}
body.wz-dark .wz-card-no{color:var(--sub)}
body.wz-dark .wz-start-card>p{color:var(--sub)}
body.wz-dark .wz-start-card label small{color:var(--sub);font-weight:600}
body.wz-dark .wz-safe{color:var(--sub)!important}
body.wz-dark .wz-safe i{color:var(--brand-deep)}
body.wz-dark .hint{color:var(--sub)}

/* ══════════════════════════════════════════════════════════════
   프로토타입 화면 구조 맞추기 — 상단 바 · 왼쪽 메뉴 · 페이지 헤더 · 표
   ══════════════════════════════════════════════════════════════ */

/* ── 상단 바: 얇고 조용하게 ── */
body.adm-dark .top{height:60px}
body.adm-dark .top-brand{display:flex;flex-direction:column;justify-content:center;min-width:0}
body.adm-dark .top-brand small{
  font-family:var(--mono); font-size:12px; letter-spacing:.16em; color:var(--mut); line-height:1.4;
}
body.adm-dark .top-brand b{
  font-size:13.5px; font-weight:700; color:var(--ink); letter-spacing:-.02em;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
body.adm-dark .top .r{gap:10px}
body.adm-dark .top .r>span{font-size:12px;color:var(--mut)}
body.adm-dark .top select{font-size:12.5px;font-weight:600;padding:7px 26px 7px 11px}

/* ── 왼쪽 메뉴: 아이콘 + 초록 점 ── */
body.adm-dark .side>a{display:flex;align-items:center;gap:10px;padding:9px 11px;font-size:13px}
body.adm-dark .side>a .nav-ico{
  font-style:normal; width:16px; text-align:center; font-size:12.5px;
  color:var(--mut); flex:none; line-height:1;
}
body.adm-dark .side>a>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.adm-dark .side>a.on .nav-ico{color:var(--brand)}
body.adm-dark .side>a .nav-dot{
  width:6px; height:6px; border-radius:50%; background:var(--brand); flex:none;
}
body.adm-dark .side>a.on .nav-dot{background:var(--brand-deep)}
body.adm-dark .side .grp{font-size:12px;padding:16px 11px 6px}

/* ── 페이지 헤더 (프로토타입 .main-h) ── */
body.adm-dark .main-h{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:16px; flex-wrap:wrap; margin:4px 0 24px;
}
body.adm-dark .main-h-t{min-width:0}
body.adm-dark .main-h h2{
  font-family:var(--soft); font-weight:400; font-size:30px; line-height:1.28;
  letter-spacing:-.035em; color:var(--ink); margin:0;
}
body.adm-dark .main-h p{margin:7px 0 0;font-size:13.5px;color:var(--mut);line-height:1.6}
body.adm-dark .main-h-a{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* ── 지표 카드 ── */
body.adm-dark .stat{gap:14px;margin-bottom:20px}
body.adm-dark .stat .b{padding:18px 20px}
body.adm-dark .stat .b .l{font-size:12px;color:var(--sub);font-weight:600}
body.adm-dark .stat .b .v{
  font-family:var(--soft); font-weight:400; font-size:29px; line-height:1.15;
  letter-spacing:-.04em; margin-top:6px;
}
body.adm-dark .stat .b .v span{font-size:14px;color:var(--sub);margin-left:1px}
body.adm-dark .stat .b .d{font-size:12px;margin-top:6px;font-weight:600;color:var(--mut)}
body.adm-dark .stat .b .d.up{color:var(--brand-deep)}
body.adm-dark .stat .b .d.dn{color:var(--brick)}

/* ── 카드 제목 · 더보기 ── */
body.adm-dark .card>h2{font-size:15px;font-weight:700;letter-spacing:-.02em}
body.adm-dark .card>h2 .more{font-size:12.5px}
body.adm-dark .card>h2 .more a{color:var(--mut);font-weight:600}
body.adm-dark .card>h2 .more a:hover{color:var(--brand)}

/* ── 표: 프로토타입과 같은 여백·정렬 ── */
body.adm-dark table.t{font-size:13px;border-collapse:collapse}
body.adm-dark table.t th{
  padding:11px 14px; font:700 12px var(--mono); letter-spacing:.05em;
  color:var(--mut); background:var(--bg); border-bottom:1px solid var(--line); white-space:nowrap;
}
body.adm-dark table.t td{padding:14px;border-bottom:1px solid #F0F1EC;vertical-align:middle}
body.adm-dark table.t tr:last-child td{border-bottom:0}
body.adm-dark table.t tr>*:first-child{padding-left:6px}
body.adm-dark table.t tr>*:last-child{padding-right:6px}
body.adm-dark table.t td b{font-weight:700}
body.adm-dark table.t td.n{font-family:var(--mono);white-space:nowrap}
body.adm-dark table.t td.n b{font-family:var(--mono)}
body.adm-dark table.t td span[style*="var(--mut)"],
body.adm-dark table.t td small{font-size:12px;color:var(--mut)}

/* ── 가로 막대 (유입 경로 등) ── */
body.adm-dark .barlist{display:grid;gap:12px}
body.adm-dark .barrow{display:flex;align-items:center;gap:12px;font-size:12.5px}
body.adm-dark .barrow .bl{width:78px;color:var(--sub);flex:none}
body.adm-dark .barrow .bt{flex:1;height:9px;background:var(--bg);border-radius:6px;overflow:hidden}
body.adm-dark .barrow .bt i{display:block;height:100%;border-radius:6px;background:var(--brand)}
body.adm-dark .barrow .bt i.alt{background:#9CBEA3}
body.adm-dark .barrow .bv{width:46px;text-align:right;font-family:var(--mono);font-weight:700;flex:none}

/* ── 할 일 타임라인 ── */
body.adm-dark .tl{display:grid}
body.adm-dark .tl-i{display:flex;gap:14px;padding:13px 0;border-bottom:1px dashed var(--line)}
body.adm-dark .tl-i:last-child{border-bottom:0;padding-bottom:0}
body.adm-dark .tl-t{
  width:48px; flex:none; font-family:var(--mono); font-size:12px; color:var(--mut); padding-top:2px;
}
body.adm-dark .tl-b b{display:block;font-size:13px;font-weight:700}
body.adm-dark .tl-b small{display:block;font-size:12px;color:var(--mut);margin-top:2px;line-height:1.6}
body.adm-dark .tl-b a{color:var(--brand);font-weight:700}

/* ── 요약 칩 줄 ── */
body.adm-dark .sumline{
  display:flex; gap:9px; flex-wrap:wrap; margin:-6px 0 20px;
}
body.adm-dark .sumline span{
  background:#fff; border:1px solid var(--line); border-radius:20px;
  padding:8px 14px; font-size:12.5px; color:var(--sub);
}
body.adm-dark .sumline span b{font-family:var(--mono);color:var(--ink);margin-left:6px;font-weight:700}

/* ── AI 매니저 플로팅 버튼 ── */
body.adm-dark .ai-fab{
  position:fixed; right:26px; bottom:26px; z-index:40;
  display:flex; align-items:center; gap:9px;
  background:var(--brand); color:#fff; border-radius:30px;
  padding:14px 20px; font-size:13.5px; font-weight:700;
  box-shadow:0 10px 26px rgba(240,82,43,.32);
}
body.adm-dark .ai-fab:hover{background:#427C4E}
body.adm-dark .ai-fab .sp{
  width:8px; height:8px; border-radius:50%; background:#fff;
  animation:aifab 1.6s infinite;
}
@keyframes aifab{0%,100%{opacity:1}50%{opacity:.3}}
@media(max-width:720px){
  body.adm-dark .ai-fab{right:14px;bottom:14px;padding:12px 16px;font-size:12.5px}
  body.adm-dark .main-h h2{font-size:24px}
  body.adm-dark .main-h{margin-bottom:18px}
  body.adm-dark table.t th{padding:10px}
  body.adm-dark table.t td{padding:12px 10px}
}

/* ── 목록 페이징 ── */
body.adm-dark .pager{
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  margin-top:16px; padding-top:14px; border-top:1px solid var(--line);
}
body.adm-dark .pager .pg-info{font-size:12px;color:var(--mut)}
body.adm-dark .pager .pg-info b{font-family:var(--mono);color:var(--ink);font-weight:700}
body.adm-dark .pg-btns{display:flex;gap:5px;align-items:center;flex-wrap:wrap;margin-left:auto}
body.adm-dark .pg{
  min-width:34px; height:34px; padding:0 11px; border-radius:11px;
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--mono); font-size:12.5px; font-weight:600;
  background:#fff; border:1px solid var(--line); color:var(--sub);
}
body.adm-dark a.pg:hover{border-color:#C7CCBF;color:var(--ink)}
body.adm-dark .pg.on{background:var(--brand);border-color:var(--brand);color:#fff}
body.adm-dark .pg.off{opacity:.4}
body.adm-dark .pg.dots{border:0;background:transparent;min-width:16px;padding:0;color:var(--mut)}
body.adm-dark .card>.pager:last-child{margin-bottom:-2px}

/* ══════════════════════════════════════════════════════════════
   전체 폭 상단 바 (프로토타입 proto-bar) — 브랜드 · 화면 이동 · 가게 선택
   ══════════════════════════════════════════════════════════════ */
body.adm-dark .appbar{
  position:sticky; top:0; z-index:60;
  display:flex; align-items:center; gap:14px;
  height:56px; padding:0 20px;
  background:#fff; border-bottom:1px solid var(--line);
}
body.adm-dark .ab-brand{display:flex;align-items:center;gap:9px;padding:5px 8px;border-radius:12px;flex:none}
body.adm-dark .ab-brand:hover{background:var(--bg)}
body.adm-dark .ab-brand>img{width:28px;height:28px;object-fit:contain}
body.adm-dark .ab-brand b{display:block;font-size:14.5px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
body.adm-dark .ab-brand small{
  display:block; font-family:var(--mono); font-size:12px; letter-spacing:.14em;
  color:var(--mut); margin-top:1px;
}
body.adm-dark .ab-step{
  display:flex; align-items:center; gap:4px; margin:0 auto;
  padding:0 10px;
}
body.adm-dark .ab-step b{
  font-size:13px; font-weight:700; color:var(--ink); min-width:96px; text-align:center;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
body.adm-dark .ab-arrow{
  min-width:28px; min-height:28px; border-radius:9px; display:grid; place-items:center;
  color:var(--sub); font-size:15px; line-height:1;
}
body.adm-dark a.ab-arrow:hover{background:var(--bg);color:var(--ink)}
body.adm-dark .ab-arrow.off{opacity:.3}
body.adm-dark .ab-r{display:flex;align-items:center;gap:9px;flex:none;font-size:12px;color:var(--mut)}
body.adm-dark .ab-shop{display:flex;align-items:center;gap:6px;padding-left:10px;border-left:1px solid var(--line)}
body.adm-dark .ab-shop select{
  background:var(--bg); border:1px solid var(--line); color:var(--ink);
  border-radius:12px; padding:7px 26px 7px 11px; font-size:12.5px; font-weight:600;
  max-width:220px;
}
body.adm-dark .ab-count{
  font-family:var(--mono); font-size:12px; font-weight:700;
  background:var(--brand-soft); color:var(--brand-deep); padding:3px 7px; border-radius:20px;
}
body.adm-dark .ab-who{font-size:12px;color:var(--mut)}
body.adm-dark .ab-out{font-size:12px;font-weight:700;color:var(--brand)}
body.adm-dark .side-toggle{display:none}

/* 사이드바는 상단 바 아래에서 시작한다 */
body.adm-dark .lay{align-items:flex-start;min-height:calc(100vh - 56px)}
body.adm-dark .side{
  position:sticky; top:56px; height:calc(100vh - 56px); height:calc(100dvh - 56px);
  padding:16px 12px; box-shadow:none;
}
body.adm-dark .side-shop{margin-top:2px}
body.adm-dark .side-shop small{max-width:150px}
body.adm-dark .side-account{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);font-size:12px}

/* 유입 막대 라벨이 두 줄로 접히지 않게 */
body.adm-dark .barrow .bl{width:92px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media(max-width:980px){
  body.adm-dark .ab-step{display:none}
  body.adm-dark .ab-who{display:none}
  body.adm-dark .ab-shop select{max-width:150px}
}
@media(max-width:720px){
  body.adm-dark .side-toggle{
    display:grid; place-items:center; width:38px; height:38px; flex:none;
    background:var(--bg); border:1px solid var(--line); color:var(--ink); border-radius:12px; font-size:16px;
  }
  body.adm-dark .ab-brand small{display:none}
  body.adm-dark .ab-brand>img{width:24px;height:24px}
  body.adm-dark .ab-r .badge,body.adm-dark .ab-r .btn{display:none}
  body.adm-dark .side.on{left:0}
  body.adm-dark.nav-open .side-dim{display:block;position:fixed;inset:52px 0 0;background:rgba(49,53,47,.24);z-index:54}
}

/* ══════════════════════════════════════════════════════════════
   여백 · 반응형 정리 (프로토타입 .main{padding:30px 36px 70px} 기준)
   ══════════════════════════════════════════════════════════════ */
/* 콘텐츠는 가운데 정렬·최대폭 없이 화면을 채운다 — 좌우 빈 공간 제거 */
body.adm-dark .wrap{max-width:none;margin:0;padding:30px 34px 92px;width:100%}
body.adm-dark .main-h{margin:0 0 24px}
body.adm-dark .stat{margin-bottom:22px}
body.adm-dark .card{padding:20px}
body.adm-dark .card>h2{padding-bottom:12px;margin-bottom:14px}

/* 아주 넓은 화면에서만 지나치게 늘어나지 않게 살짝 제한 */
@media(min-width:1900px){ body.adm-dark .wrap{max-width:1760px} }

/* ── 태블릿 ────────────────────────────────────────────
   960px 이하에서만 사이드바를 밀어서 여는 형태로 바꾼다.
   아이패드 가로(1024px)는 폭이 충분해 메뉴를 그대로 보여준다. */
@media(max-width:1080px){
  body.adm-dark .wrap{padding:26px 24px 88px}
  body.adm-dark .stat{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
}
@media(max-width:960px){
  body.adm-dark .side{
    position:fixed; top:56px; left:-266px; width:252px;
    height:calc(100vh - 56px); height:calc(100dvh - 56px);
    z-index:55; transition:left .22s ease; box-shadow:14px 0 40px rgba(49,53,47,.16);
  }
  body.adm-dark .side.on{left:0}
  body.adm-dark .side-toggle{
    display:grid; place-items:center; width:38px; height:38px; flex:none;
    background:var(--bg); border:1px solid var(--line); color:var(--ink);
    border-radius:12px; font-size:16px; line-height:1;
  }
  body.adm-dark.nav-open{overflow:hidden}
  body.adm-dark.nav-open .side-dim{
    display:block; position:fixed; inset:56px 0 0;
    background:rgba(49,53,47,.26); z-index:54; border:0;
  }
  body.adm-dark .ab-step b{min-width:0}
}

/* ── 모바일 ── */
@media(max-width:720px){
  body.adm-dark .side{top:52px;height:calc(100dvh - 52px)}
  body.adm-dark.nav-open .side-dim{inset:52px 0 0}
  body.adm-dark .wrap{padding:18px 14px 86px}
  body.adm-dark .main-h{margin-bottom:16px}
  body.adm-dark .main-h h2{font-size:23px}
  body.adm-dark .main-h p{font-size:12.5px}
  body.adm-dark .main-h-a{width:100%}
  body.adm-dark .main-h-a .btn{flex:1;justify-content:center}
  body.adm-dark .stat{grid-template-columns:1fr 1fr;gap:10px}
  body.adm-dark .stat .b{padding:14px 15px}
  body.adm-dark .stat .b .v{font-size:23px}
  body.adm-dark .stat .b .d{font-size:12px}
  body.adm-dark .card{padding:16px 15px;border-radius:18px}
  body.adm-dark .card>h2{font-size:14.5px;flex-wrap:wrap}
  body.adm-dark .card>h2 .more{width:100%;margin-left:0;margin-top:3px}
  body.adm-dark .sumline{gap:7px}
  body.adm-dark .sumline span{padding:7px 11px;font-size:12px}
  body.adm-dark .barrow .bl{width:74px;font-size:12px}
  body.adm-dark .barrow .bv{width:38px;font-size:12px}
  body.adm-dark .tl-t{width:40px;font-size:12px}
  body.adm-dark .pager{flex-direction:column;align-items:stretch;gap:10px}
  body.adm-dark .pg-btns{margin-left:0;justify-content:center}
  body.adm-dark .pg{min-width:38px;height:38px}
}
@media(max-width:480px){
  body.adm-dark .stat{grid-template-columns:1fr}
  body.adm-dark .stat .b{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
  body.adm-dark .stat .b .l{flex:1}
  body.adm-dark .stat .b .v{margin-top:0;text-align:right;font-size:21px}
  body.adm-dark .stat .b .d{width:100%;margin-top:2px}
  body.adm-dark .ab-brand b{font-size:13px}
  body.adm-dark .ab-r{gap:6px}
  body.adm-dark .ai-fab{padding:11px 14px;font-size:12px;right:12px;bottom:12px}
}

/* 아주 좁은 화면에서 상단 바가 넘치지 않게 */
@media(max-width:480px){
  body.adm-dark .ab-count{display:none}
  body.adm-dark .ab-shop{padding-left:6px;border-left:0;min-width:0}
  body.adm-dark .ab-shop select{max-width:126px;min-width:0;padding:6px 22px 6px 9px;font-size:12px}
  body.adm-dark .appbar{gap:6px}
  body.adm-dark .ab-brand{padding:4px 5px;gap:7px}
}
/* 표가 있는 카드는 좌우로 밀어서 볼 수 있게(기존 규칙 유지) + 스크롤 여운 */
body.adm-dark .card:has(>table.t){padding-bottom:14px}
body.adm-dark .card>table.t{margin-bottom:2px}

/* ══════════════════════════════════════════════════════════════
   식별이 어렵거나 깨진 부분 정리
   ══════════════════════════════════════════════════════════════ */

/* ① 긴 주소가 표를 밀어내던 문제 — 주소 칸은 줄여서 말줄임, 복사 버튼은 고정 */
body.adm-dark .paylink-address{display:flex;align-items:center;gap:7px;min-width:0}
body.adm-dark .paylink-address code{
  flex:1; min-width:0; display:block; padding:8px 10px;
  background:var(--bg); border:1px solid var(--line); border-radius:10px;
  font-family:var(--mono); font-size:12px; color:var(--sub);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
body.adm-dark .paylink-address .btn{flex:none}
/* 표 안의 긴 링크·코드는 어디서나 말줄임 */
body.adm-dark table.t code{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;vertical-align:bottom}

/* ② 이름-값 표(정산 요약처럼 th+td 한 줄)는 왼쪽 칸을 라벨처럼 — 회색 큰 블록 제거 */
body.adm-dark table.t tr:has(td)>th{
  background:transparent; color:var(--sub);
  font-family:inherit; font-size:12.5px; font-weight:600; letter-spacing:0;
  width:1%; white-space:nowrap; padding-right:24px; text-transform:none;
}
body.adm-dark table.t tr:has(td):last-child>th{color:var(--ink);font-weight:700}
body.adm-dark table.t tr:has(td)>td{width:auto}

/* ③ 설명(hint)이 있는 폼은 입력칸 기준으로 버튼을 맞춘다 */
body.adm-dark .card form.flx:has(.hint){align-items:flex-start}
body.adm-dark .card form.flx:has(.hint)>.btn{margin-top:25px}
body.adm-dark .fld .hint{max-width:none}

/* ④ 미리보기 폰은 편집 중에도 따라오게(고정) + 화면 높이를 넘지 않게 */
body.adm-dark .split2>.phone{
  position:sticky; top:72px; align-self:flex-start;
  height:min(660px,calc(100dvh - 104px));
}
@media(max-width:1080px){
  body.adm-dark .split2>.phone{position:static;height:min(620px,72vh)}
}

/* ⑤ 검색 상자 */
body.adm-dark .searchbox{
  display:flex; align-items:center; gap:7px; margin:0 0 14px;
  background:var(--bg); border:1px solid var(--line); border-radius:14px; padding:6px 8px 6px 12px;
}
body.adm-dark .searchbox .sb-ico{color:var(--mut);font-size:14px;line-height:1;flex:none}
body.adm-dark .searchbox input{
  flex:1; min-width:0; border:0; background:transparent; font-size:13px; color:var(--ink);
  padding:7px 2px;
}
body.adm-dark .searchbox input:focus{outline:0}
body.adm-dark .searchbox:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px rgba(240,82,43,.13);background:#fff}
body.adm-dark .searchbox .btn{flex:none}
body.adm-dark .sb-note{font-size:12px;color:var(--mut);margin:-8px 0 12px}
body.adm-dark .sb-note b{color:var(--ink)}

/* ⑥ 표 안 입력칸(상품 목록 등)이 너무 좁아 안 보이던 것 */
body.adm-dark table.t input:not([type=checkbox]):not([type=radio]),
body.adm-dark table.t select,body.adm-dark table.t textarea{
  font-size:12.5px; padding:8px 9px; border-radius:10px;
}
body.adm-dark table.t textarea{min-height:64px;line-height:1.55}
body.adm-dark table.t td{min-width:0}

/* ⑦ 표가 좌우로 밀릴 때 잘린 것을 알 수 있게 오른쪽 그림자 */
body.adm-dark .card:has(>table.t){
  background:linear-gradient(to left,rgba(49,53,47,.055),rgba(49,53,47,0) 20px) right center / 20px 100% no-repeat,#fff !important;
}

/* 좁은 화면 검색 상자 */
@media(max-width:480px){
  body.adm-dark .searchbox{flex-wrap:wrap;padding:8px}
  body.adm-dark .searchbox input{flex:1 0 60%}
  body.adm-dark .searchbox .btn{flex:1}
  body.adm-dark .searchbox .sb-ico{display:none}
}

/* 결제 내역 표는 칸이 많아 좁은 화면에서 좌우로 밀어 본다 */
body.adm-dark .pay-history{min-width:880px}
body.adm-dark .pay-history td small{display:block;font-size:12px;color:var(--mut);margin-top:2px}
body.adm-dark .pay-history td:last-child{white-space:nowrap}

/* ══════════════════════════════════════════════════════════════
   표 정리 2차
   ══════════════════════════════════════════════════════════════ */
/* 이름-값 표의 선 색을 값 칸과 같게 (라벨 밑줄이 더 진해 끊긴 것처럼 보였다) */
body.adm-dark table.t tr:has(td)>th{border-bottom:1px solid #F0F1EC}
body.adm-dark table.t tr:has(td):last-child>th,
body.adm-dark table.t tr:has(td):last-child>td{border-bottom:0}

/* 칸이 많아 좌우로 밀리는 표는 마지막 '관리' 칸을 오른쪽에 고정해 버튼이 늘 보이게 */
body.adm-dark .item-manage-table th:last-child,
body.adm-dark .item-manage-table td:last-child,
body.adm-dark .pay-history th:last-child,
body.adm-dark .pay-history td:last-child,
body.adm-dark .paylink-table th:last-child,
body.adm-dark .paylink-table td:last-child{
  position:sticky; right:0; z-index:2;
  box-shadow:-14px 0 14px -12px rgba(49,53,47,.16);
}
body.adm-dark .item-manage-table td:last-child,
body.adm-dark .pay-history td:last-child,
body.adm-dark .paylink-table td:last-child{background:#fff}
body.adm-dark .item-manage-table th:last-child,
body.adm-dark .pay-history th:last-child,
body.adm-dark .paylink-table th:last-child{background:var(--bg)}
body.adm-dark .item-manage-table tbody tr:hover td:last-child{background:#FAFBF7}

/* 목록 필터 줄 (검색 + 기간) */
body.adm-dark .listfilter{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0 0 18px;   /* 카드 제목→검색줄(18px)과 같은 간격으로 표를 띄운다 */
}
body.adm-dark .listfilter .lf-search{
  display:flex; align-items:center; gap:7px; flex:1 1 260px; min-width:210px;
  background:var(--bg); border:1px solid var(--line); border-radius:14px; padding:6px 8px 6px 12px;
}
body.adm-dark .listfilter .lf-search:focus-within{border-color:var(--brand);background:#fff;box-shadow:0 0 0 3px rgba(240,82,43,.13)}
body.adm-dark .listfilter .lf-search .sb-ico{color:var(--mut);font-size:14px;flex:none;line-height:1}
body.adm-dark .listfilter .lf-search input{flex:1;min-width:0;border:0;background:transparent;font-size:13px;padding:7px 2px;color:var(--ink)}
body.adm-dark .listfilter .lf-search input:focus{outline:0}
body.adm-dark .listfilter .lf-date{
  display:flex; align-items:center; gap:6px; flex:none;
  background:var(--bg); border:1px solid var(--line); border-radius:14px; padding:6px 10px;
}
body.adm-dark .listfilter .lf-date:focus-within{border-color:var(--brand);background:#fff}
body.adm-dark .listfilter .lf-date b{font-size:12px;color:var(--mut);font-weight:600}
body.adm-dark .listfilter .lf-date input{
  border:0; background:transparent; font-family:var(--mono); font-size:12px; color:var(--ink);
  padding:6px 2px; width:112px;
}
body.adm-dark .listfilter .lf-date input:focus{outline:0}
body.adm-dark .listfilter .lf-date span{color:var(--mut);font-size:12px}
body.adm-dark .lf-quick{display:flex;gap:5px;flex-wrap:wrap}
body.adm-dark .lf-quick a{
  padding:7px 11px; border-radius:20px; font-size:12px; font-weight:600;
  background:#fff; border:1px solid var(--line); color:var(--sub);
}
body.adm-dark .lf-quick a.on{background:var(--brand);border-color:var(--brand);color:#fff}
body.adm-dark .lf-note{font-size:12px;color:var(--mut);margin:-8px 0 12px}
body.adm-dark .lf-note b{color:var(--ink)}
@media(max-width:720px){
  body.adm-dark .listfilter .lf-date{flex:1 1 100%}
  body.adm-dark .listfilter .lf-date input{width:auto;flex:1;min-width:0}
  body.adm-dark .listfilter>.btn{flex:1}
}

/* ══════════════════════════════════════════════════════════════
   팝업 창 (목록에서 편집을 분리)
   ══════════════════════════════════════════════════════════════ */
body.adm-dark .opmodal{display:none;position:fixed;inset:0;z-index:70}
body.adm-dark .opmodal.on{display:block}
body.adm-dark .opmodal-bg{position:absolute;inset:0;background:rgba(49,53,47,.34);backdrop-filter:blur(2px)}
body.adm-dark .opmodal-box{
  position:relative; margin:6vh auto; width:min(620px,calc(100% - 28px));
  max-height:88vh; display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--line); border-radius:22px;
  box-shadow:var(--shadow-lg); overflow:hidden;
}
body.adm-dark .opmodal-h{
  display:flex; align-items:center; gap:10px;
  padding:16px 18px; border-bottom:1px solid var(--line);
}
body.adm-dark .opmodal-h b{font-family:var(--soft);font-weight:400;font-size:17px;flex:1;min-width:0}
body.adm-dark .opmodal-x{
  width:32px;height:32px;border-radius:11px;background:var(--bg);color:var(--sub);
  font-size:14px;line-height:1;flex:none;
}
body.adm-dark .opmodal-x:hover{background:#EAECE4;color:var(--ink)}
body.adm-dark .opmodal-b{padding:18px;overflow-y:auto}
body.adm-dark .opmodal-b .fld:last-of-type{margin-bottom:4px}
body.adm-dark .opmodal-b label small{color:var(--mut);font-weight:500;margin-left:5px}
body.adm-dark.modal-open{overflow:hidden}
@media(max-width:720px){
  body.adm-dark .opmodal-box{margin:0;width:100%;max-height:100vh;height:100dvh;border-radius:0}
  body.adm-dark .opmodal-b{padding:14px}
}

/* 목록 안 순서 이동 · 미니 썸네일 */
body.adm-dark .row-move{display:flex;gap:3px;margin-top:4px}
body.adm-dark .row-move .mv{
  min-width:24px;min-height:22px;border-radius:7px;background:var(--bg);border:1px solid var(--line);
  color:var(--sub);font-size:12px;line-height:1;
}
body.adm-dark .row-move .mv:hover:not(:disabled){background:var(--brand-soft);color:var(--brand-deep)}
body.adm-dark .row-move .mv:disabled{opacity:.35}
body.adm-dark .item-mini{
  width:44px;height:34px;border-radius:9px;overflow:hidden;display:inline-block;background:var(--bg);
}
body.adm-dark .item-mini img{width:100%;height:100%;object-fit:cover;display:block}
body.adm-dark .item-mini.none{
  display:inline-flex;align-items:center;justify-content:center;
  font-size:12px;color:var(--mut);border:1px dashed var(--line);
}
/* 컴팩트 목록은 최소폭을 두지 않아 잘리지 않는다 */
body.adm-dark .item-list{min-width:0}
body.adm-dark .item-list td:last-child{white-space:nowrap}

/* 결제 요청 표: 열 폭을 8칸에 맞게 다시 배분 (관리 칸이 잘리던 문제) */
body.adm-dark .paylink-table{min-width:900px}
/* 퍼센트 열 합이 80% 를 넘으면 고정폭 관리 칸이 비율로 줄어 다시 잘린다 — 합 80% 유지 */
body.adm-dark .paylink-table .pay-col-title{width:18%}
body.adm-dark .paylink-table .pay-col-amount{width:8%}
body.adm-dark .paylink-table .pay-col-kind{width:7%}
body.adm-dark .paylink-table .pay-col-url{width:22%}
body.adm-dark .paylink-table .pay-col-used{width:6%}
body.adm-dark .paylink-table .pay-col-period{width:11%}
body.adm-dark .paylink-table .pay-col-status{width:8%}
body.adm-dark .paylink-table .pay-col-actions{width:168px}   /* 알림톡 · 중지 · 삭제 세 버튼이 1280px 에서 칸을 넘어 잘렸다 → 고정 폭 */
body.adm-dark .paylink-actions{display:flex;gap:5px;flex-wrap:wrap;min-width:0}
body.adm-dark .paylink-actions .btn{flex:none}

/* ══════════════════════════════════════════════════════════════
   미리보기 폰 안의 손님 화면을 관리자 CSS 가 덮지 않게
   (.main 은 관리자 본문 컨테이너 이름이라 액션바의 a.main 까지 물들였다)
   ══════════════════════════════════════════════════════════════ */
body.adm-dark .phone .actionbar a.main,
body.adm-dark .phone .actionbar a{
  background:var(--ac)!important; color:#fff!important;
  border-radius:11px; min-height:52px; display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:15px; flex:1;
}
body.adm-dark .phone .actionbar .sec{
  background:#F0F2F6!important; color:var(--st)!important;
  flex:0 0 54px!important; width:54px; border-radius:11px;
  display:flex; align-items:center; justify-content:center; font-size:17px; min-height:52px;
}
body.adm-dark .phone .actionbar{
  display:flex; gap:8px; padding:10px 14px;
  background:rgba(255,255,255,.96); border-top:1px solid #E8EBF0;
  position:sticky; bottom:0; z-index:4;
}
/* 미리보기 안에서는 관리자 카드·표 스타일이 새어 들어오지 않게 */
body.adm-dark .phone .card,body.adm-dark .phone .main{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
body.adm-dark .phone table.t th,body.adm-dark .phone table.t td{padding:0;border:0;background:transparent}

/* ══════════════════════════════════════════════════════════════
   AI 매니저 — 대화식 (프로토타입 chatwrap)
   ══════════════════════════════════════════════════════════════ */
body.adm-dark .chatwrap{
  display:grid; grid-template-columns:280px minmax(0,1fr);
  grid-template-areas:"quick chat" "notes chat";
  gap:14px 18px; align-items:start;
}
body.adm-dark .chat-quick{grid-area:quick;min-width:0}
body.adm-dark .chat{grid-area:chat;min-width:0}
body.adm-dark .chat-notes{grid-area:notes;min-width:0}
body.adm-dark .chat-side .side-h{
  font-family:var(--mono); font-size:12px; letter-spacing:.11em; color:var(--mut);
  font-weight:700; margin-bottom:9px;
}
body.adm-dark .cmds{display:grid;gap:7px}
body.adm-dark .cmd{
  display:block; width:100%; text-align:left; background:#fff; border:1px solid var(--line);
  border-radius:14px; padding:11px 13px; font-size:12.5px; line-height:1.5; color:var(--ink);
}
body.adm-dark .cmd:hover{border-color:var(--brand);background:var(--brand-soft)}
body.adm-dark .cmd b{display:block;font-weight:700}
body.adm-dark .cmd small{display:block;color:var(--mut);font-size:12px;margin-top:2px}
body.adm-dark .chat{
  background:#fff; border:1px solid var(--line); border-radius:22px;
  display:flex; flex-direction:column; height:640px; overflow:hidden; box-shadow:var(--shadow);
}
body.adm-dark .chat-h{display:flex;align-items:center;gap:10px;padding:15px 20px;border-bottom:1px solid var(--line)}
body.adm-dark .chat-h .av{
  width:32px;height:32px;border-radius:12px;background:var(--brand);color:#fff;
  display:grid;place-items:center;font-size:15px;flex:none;
}
body.adm-dark .chat-h b{font-size:14px;font-weight:700;display:block}
body.adm-dark .chat-h small{font-size:12px;color:var(--mut);display:block}
body.adm-dark .chat-b{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:14px}
/* 손님 화면 CSS 의 .ai(400px 격자) 같은 이름과 겹쳐도 말풍선은 항상 블록으로 둔다 */
body.adm-dark .chat .msg{display:block;grid-template-columns:none;width:auto}
body.adm-dark .msg{max-width:80%;font-size:13.5px;line-height:1.7}
body.adm-dark .msg.me{align-self:flex-end;background:var(--brand);color:#fff;border-radius:16px 16px 4px 16px;padding:11px 15px}
body.adm-dark .msg.from-ai{align-self:flex-start;background:var(--bg);border-radius:16px 16px 16px 4px;padding:12px 16px}
body.adm-dark .msg.from-ai a{color:var(--brand-deep);font-weight:700;text-decoration:underline;text-underline-offset:2px}
body.adm-dark .confirm{
  align-self:flex-start; max-width:90%; background:#fff; border:1.5px solid var(--brand);
  border-radius:16px; padding:15px 17px;
}
body.adm-dark .confirm.done{border-color:var(--line)}
body.adm-dark .confirm .ct{
  font-family:var(--mono); font-size:12px; letter-spacing:.1em; color:var(--brand-deep);
  font-weight:700; margin-bottom:8px;
}
body.adm-dark .confirm table{font-size:12.5px;width:100%;margin-bottom:12px;border-collapse:collapse}
body.adm-dark .confirm td{padding:5px 0;border:0;vertical-align:top}
body.adm-dark .confirm td:first-child{color:var(--mut);width:96px;white-space:nowrap}
body.adm-dark .confirm .cb{display:flex;gap:8px}
body.adm-dark .chat-f{border-top:1px solid var(--line);padding:13px 16px;display:flex;gap:10px;align-items:center}
body.adm-dark .chat-f input{
  flex:1; min-width:0; border:1px solid var(--line); border-radius:14px;
  padding:12px 14px; font-size:13.5px; background:#FBFCFA;
}
body.adm-dark .chat-f input:focus{outline:0;border-color:var(--brand);background:#fff;box-shadow:0 0 0 3px rgba(240,82,43,.13)}
body.adm-dark .chat-f .send{
  background:var(--brand); color:#fff; width:44px; height:44px; border-radius:14px;
  font-size:16px; flex:none; box-shadow:0 2px 0 var(--brand-deep);
}
/* 태블릿·모바일: 자주 쓰는 말 → 대화 → 안내 순으로 한 줄로 세운다 */
@media(max-width:1080px){
  body.adm-dark .chatwrap{grid-template-columns:minmax(0,1fr);grid-template-areas:"quick" "chat" "notes";gap:10px}
  body.adm-dark .chat{height:auto}
  body.adm-dark .chat-b{max-height:none;min-height:38vh}
  /* 샘플 문장은 옆으로 미는 칩으로 (세로로 길게 쌓이지 않게) */
  body.adm-dark .chat-quick .cmds{
    display:flex; gap:7px; overflow-x:auto; padding-bottom:4px;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
  }
  body.adm-dark .chat-quick .cmds::-webkit-scrollbar{display:none}
  body.adm-dark .chat-quick .cmds>form{flex:0 0 auto}
  body.adm-dark .chat-quick .cmd{
    white-space:nowrap; width:auto; padding:9px 13px; font-size:12px; border-radius:999px;
  }
  body.adm-dark .chat-notes .cmds{display:grid}
  body.adm-dark .chat-notes .cmd{white-space:normal;border-radius:14px}
}
@media(max-width:560px){
  /* 대화창은 화면 끝까지, 입력칸은 아래에 붙여 둔다 */
  body.adm-dark .chatwrap{margin-left:0;margin-right:0}
  body.adm-dark .chat-quick,body.adm-dark .chat-notes{margin-left:11px;margin-right:11px}
  body.adm-dark .chat{border-radius:0;border-left:0;border-right:0}
  body.adm-dark .chat-h{padding:12px 13px}
  body.adm-dark .chat-h small{display:none}
  body.adm-dark .chat-b{padding:14px 13px;gap:10px;min-height:44vh}
  body.adm-dark .msg{max-width:88%;font-size:13px}
  body.adm-dark .confirm{max-width:100%;padding:13px 14px}
  body.adm-dark .confirm table{font-size:12px}
  body.adm-dark .chat-f{padding:10px 11px}
  body.adm-dark .chat-f input{font-size:16px}
}

/* ── 공지 · 알림톡 ─────────────────────────────────── */
body.adm-dark .notice-table td b{display:block;font-size:14px}
body.adm-dark .notice-table td small{display:block;font-size:12px;color:var(--mut);margin-top:3px;line-height:1.55}
body.adm-dark .notice-table td.nc-act{white-space:nowrap}
body.adm-dark .notice-table td.nc-act .btn{margin-right:4px}
body.adm-dark .notice-table{min-width:780px}
body.adm-dark .talk-table{min-width:880px}
body.adm-dark .talk-table td small{display:block;font-size:12px;color:var(--mut);margin-top:2px}

body.adm-dark .chk{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--sub);
  padding:11px 13px;background:var(--bg);border-radius:12px;cursor:pointer}
body.adm-dark .chk input{width:17px;height:17px;accent-color:var(--brand)}

body.adm-dark .segpick{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:7px}
/* 좁은 패널에서 148px 최소폭이면 세 칸이 2+1 로 접힌다 — 칸 수에 맞춰 나눈다 */
body.adm-dark .segpick:has(>:nth-child(4)){grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
body.adm-dark .segpick.col{grid-template-columns:1fr}
body.adm-dark .segpick button{display:block;text-align:left;padding:11px 13px;border:1px solid var(--line);
  background:#fff;border-radius:13px;cursor:pointer;font-family:inherit;min-height:56px}
body.adm-dark .segpick button b{display:block;font-size:13px;color:var(--ink);font-weight:800}
body.adm-dark .segpick button small{display:block;font-size:12px;color:var(--mut);margin-top:3px;font-family:var(--mono)}
body.adm-dark .segpick button.on{background:var(--brand-soft);border-color:var(--brand)}
body.adm-dark .segpick button.on b{color:var(--brand)}
body.adm-dark .segpick button:hover{border-color:var(--brand)}

body.adm-dark .talkprev{background:#B2C7DA;border-radius:16px;padding:16px}
body.adm-dark .talkprev .tp-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
body.adm-dark .talkprev .tp-head i{width:26px;height:26px;border-radius:9px;background:#FAE100;color:#3C1E1E;
  display:flex;align-items:center;justify-content:center;font-weight:900;font-size:13px;font-style:normal}
body.adm-dark .talkprev .tp-head span{font-size:12.5px;font-weight:800;color:#2A3A46}
body.adm-dark .talkprev .tp-bubble{background:#fff;border-radius:4px 16px 16px 16px;padding:15px 16px;
  font-size:13.5px;line-height:1.75;color:#222;white-space:normal;word-break:keep-all}
body.adm-dark .talkprev .tp-note{margin-top:10px;font-size:12px;color:#2A3A46;line-height:1.6}

body.adm-dark .promo-stage{display:grid;grid-template-columns:minmax(280px,340px) minmax(0,1fr);gap:16px;align-items:start}
body.adm-dark .promo-stage>.card{margin:0}
/* 사이드바가 보이는 태블릿(961~1180)에서는 무대가 좁아지므로 한 줄로 */
@media(max-width:1280px){body.adm-dark .promo-stage{grid-template-columns:1fr}}
@media(max-width:560px){
  body.adm-dark .segpick{grid-template-columns:1fr 1fr}
  body.adm-dark .notice-table td.nc-act .btn{margin-bottom:4px}
}

/* ── 홍보하기 (프로토타입 형식) ───────────────────────── */
body.adm-dark .lbl-sm{font-size:12px;letter-spacing:.11em;color:var(--mut);font-weight:700;margin:0 0 10px;text-transform:uppercase}
body.adm-dark .acstrip{display:flex;gap:8px;overflow-x:auto;padding:0 0 14px}
body.adm-dark .acstrip .ac{flex:0 0 auto;min-width:132px;background:#fff;border:1px solid var(--line);
  border-radius:14px;padding:11px 13px}
body.adm-dark .acstrip .ac b{display:block;font-size:12.5px;color:var(--ink)}
body.adm-dark .acstrip .ac small{display:block;font-size:12px;color:var(--mut);margin-top:3px}
body.adm-dark .acstrip .ac.on{background:var(--brand-soft);border-color:var(--brand)}
body.adm-dark .acstrip .ac.on small{color:var(--brand)}

body.adm-dark .idea{display:grid;grid-template-columns:repeat(auto-fill,minmax(224px,1fr));gap:9px;margin-bottom:18px}
body.adm-dark .ideacard{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px 15px}
body.adm-dark .ideacard b{display:block;font-size:13.5px;color:var(--ink);line-height:1.5}
body.adm-dark .ideacard p{margin:5px 0 10px;font-size:12px;color:var(--mut);line-height:1.6}

body.adm-dark .ps-panel .ph{margin:-4px 0 14px;font-size:12.5px;color:var(--mut);line-height:1.6}
body.adm-dark .segopt{display:block;position:relative;padding:11px 12px;border:1px solid var(--line);
  background:#fff;border-radius:13px;cursor:pointer;text-align:center}
body.adm-dark .segopt input{position:absolute;opacity:0;pointer-events:none}
body.adm-dark .segopt b{font-size:12.5px;font-weight:700;color:var(--sub)}
body.adm-dark .segopt.on{background:var(--brand-soft);border-color:var(--brand)}
body.adm-dark .segopt.on b{color:var(--brand);font-weight:800}
body.adm-dark .ps-panel input[type=range]{width:100%;accent-color:var(--brand)}
body.adm-dark .attach{margin-top:16px;background:var(--bg);border-radius:16px;padding:14px 15px}
body.adm-dark .attach b{display:block;font-size:12px;color:var(--ink);margin-bottom:9px}
body.adm-dark .attach .row{display:flex;gap:9px;align-items:center;font-size:12px;color:var(--sub);padding:4px 0}
body.adm-dark .attach .row i{font-style:normal;font-family:var(--mono);font-size:12px;color:var(--brand);
  background:#fff;border-radius:6px;padding:2px 5px}
body.adm-dark .attach .att-f{border-top:1px solid var(--line);margin-top:9px;padding-top:9px;
  color:var(--mut);font-size:12px;line-height:1.6}

body.adm-dark .restab{display:flex;gap:7px;background:var(--bg);border-radius:14px;padding:4px;margin:0 0 16px}
body.adm-dark .restab a{flex:1;text-align:center;padding:9px 8px;border-radius:11px;font-size:13px;
  font-weight:700;color:var(--sub)}
body.adm-dark .restab a small{display:block;font-size:12px;font-family:var(--mono);color:var(--mut);margin-top:2px}
body.adm-dark .restab a.on{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(49,53,47,.1)}
body.adm-dark .restab a.on small{color:var(--brand)}

body.adm-dark .respane{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
body.adm-dark .pv-side{display:grid;gap:14px;align-content:start}
body.adm-dark .cutlist{display:grid;gap:6px}
body.adm-dark .cutlist .cut{display:flex;gap:10px;align-items:flex-start;background:var(--bg);
  border-radius:12px;padding:10px 12px}
body.adm-dark .cutlist .cut .tm{flex:0 0 62px;font-family:var(--mono);font-size:12px;color:var(--brand);padding-top:2px}
body.adm-dark .cutlist .cut b{display:block;font-size:12.5px;color:var(--ink);line-height:1.5}
body.adm-dark .cutlist .cut small{display:block;font-size:12px;color:var(--mut);margin-top:3px;line-height:1.55}
body.adm-dark .caption{background:var(--bg);border-radius:14px;padding:13px 14px;font-size:12.5px;
  line-height:1.8;color:var(--sub);white-space:normal;word-break:keep-all}
body.adm-dark .warnbox{background:#FFF8E8;border:1px solid #F0E2BE;border-radius:14px;padding:12px 14px;
  font-size:12px;line-height:1.7;color:#7A6320}
body.adm-dark .warnbox b{display:block;color:#5E4C12;font-size:12px;margin-bottom:4px}

body.adm-dark .pv-edit{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}
body.adm-dark .ed-row.hd{font-size:12px;color:var(--mut)}

body.adm-dark .pubwrap{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}
body.adm-dark .pubmatrix{border:1px solid var(--line);border-radius:16px;overflow:hidden}
body.adm-dark .pubmatrix .pm-h,body.adm-dark .pubmatrix .pm-r{display:grid;grid-template-columns:1fr 74px 74px 74px;align-items:center}
body.adm-dark .pubmatrix .pm-h{background:var(--bg);padding:9px 13px;font-size:12px;color:var(--mut);
  font-family:var(--mono);letter-spacing:.06em}
body.adm-dark .pubmatrix .pm-h i,body.adm-dark .pubmatrix .pm-r i{font-style:normal;text-align:center}
body.adm-dark .pubmatrix .pm-r{padding:11px 13px;border-top:1px solid #F0F1EC;font-size:12.5px}
body.adm-dark .pubmatrix .pm-r.off{background:#FBFBF8;color:var(--mut)}
body.adm-dark .pubmatrix .pm-ch{display:flex;align-items:center;gap:8px;cursor:pointer}
body.adm-dark .pubmatrix .pm-ch input{accent-color:var(--brand)}   /* 16px 고정이 공통 44px 체크박스 규칙을 덮어 터치 크기에 걸렸다 */
body.adm-dark .pubmatrix .pm-ch b{font-size:12.5px;font-weight:700;color:var(--ink)}
body.adm-dark .pubmatrix .pm-r.off .pm-ch b{color:var(--mut);font-weight:600}
body.adm-dark .pubmatrix .pm-ch em{font-style:normal;font-size:12px;color:var(--mut)}
body.adm-dark .pubmatrix .pm-r i.yes{color:var(--brand);font-weight:800}
body.adm-dark .pubmatrix .pm-r i.no{color:#D6D8D0}
body.adm-dark .pubbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:13px}
body.adm-dark .pubforms{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--mut);
  margin-right:auto}
body.adm-dark .pubforms label{display:flex;align-items:center;gap:5px;font-size:12.5px;color:var(--sub);cursor:pointer}
body.adm-dark .pubforms input{width:16px;height:16px;accent-color:var(--brand)}

/* 열 폭을 인라인 px 로 고정하면 좁은 화면에서 526px 로 넘친다(결제 받기 표는 auto 라 맞음) → 1180px 부터만 고정 배치 · 폭 */
body.adm-dark table.t.promo-stat-table{min-width:0;table-layout:auto}
@media(min-width:1180px){
  body.adm-dark table.t.promo-stat-table{min-width:920px;table-layout:fixed}
  body.adm-dark .promo-stat-table col.pc-topic{width:118px} body.adm-dark .promo-stat-table col.pc-where{width:96px}
  body.adm-dark .promo-stat-table col.pc-seen{width:88px} body.adm-dark .promo-stat-table col.pc-click{width:88px}
  body.adm-dark .promo-stat-table col.pc-pay{width:88px} body.adm-dark .promo-stat-table col.pc-sales{width:104px}
  body.adm-dark .promo-stat-table col.pc-act{width:150px}
}
body.adm-dark .promo-stat-table td small{display:block;font-size:12px;color:var(--mut);margin-top:2px}
body.adm-dark .sl.one .cv{aspect-ratio:4/5}
body.adm-dark .sl .cv.d-block{background:var(--brand)}
body.adm-dark .sl .cv.d-clean{background:#fff;border:1px solid var(--line)}
body.adm-dark .sl .cv.d-clean .ov{background:none;color:var(--ink)}
body.adm-dark .sl .cv.d-clean .ov .no{color:var(--mut)}
body.adm-dark .sl .cv.d-clean .ov span{color:var(--sub)}
@media(max-width:1000px){
  body.adm-dark .pubmatrix .pm-h,body.adm-dark .pubmatrix .pm-r{grid-template-columns:1fr 58px 58px 58px}
}
@media(max-width:560px){
  body.adm-dark .idea{grid-template-columns:1fr}
  body.adm-dark .restab{flex-wrap:wrap}
  body.adm-dark .restab a{flex:1 0 30%}
}

/* ── 숏폼 만들기 ─────────────────────────────────────── */
body.adm-dark .sh-builder-card{overflow:visible}
body.adm-dark .sh-builder{display:grid;gap:14px}
body.adm-dark .sh-step{padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--bg)}
body.adm-dark .sh-step-head{display:flex;align-items:center;gap:10px;margin-bottom:13px}
body.adm-dark .sh-step-head i{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:10px;
  background:var(--brand-soft);color:var(--brand);font:800 12px var(--mono);font-style:normal}
body.adm-dark .sh-step-head b{display:block;font-size:13.5px;color:var(--ink)}
body.adm-dark .sh-step-head small{display:block;margin-top:2px;font-size:12px;color:var(--mut);font-weight:500}
body.adm-dark .sh-form{display:grid;grid-template-columns:minmax(175px,1fr) minmax(240px,1.2fr) minmax(330px,1.55fr) minmax(220px,1.15fr);gap:12px;align-items:start}
body.adm-dark .sh-form>.fld{margin:0;min-width:0}
body.adm-dark .sh-form .segpick{grid-template-columns:repeat(3,minmax(0,1fr))}
body.adm-dark .sh-form .segopt{min-width:0;min-height:46px;padding:8px 7px;display:grid;place-items:center;text-align:center}
body.adm-dark .sh-form .segopt b{line-height:1.3;word-break:keep-all}
body.adm-dark .sh-emphasis{grid-column:1/-1}
body.adm-dark .sh-emphasis label span{font-weight:500;color:var(--mut)}
body.adm-dark .sh-media{padding-bottom:13px}
body.adm-dark .sh-media>.fld{margin:0}
body.adm-dark .pickgrid{display:grid;grid-template-columns:repeat(auto-fill,76px);gap:8px}
body.adm-dark .pickgrid .pick{position:relative;display:block;aspect-ratio:2/3;border-radius:11px;
  overflow:hidden;background:var(--bg);cursor:pointer}
body.adm-dark .pickgrid .pick img{width:100%;height:100%;object-fit:cover;opacity:.5;transition:opacity .15s}
body.adm-dark .pickgrid .pick input{position:absolute;opacity:0;pointer-events:none}
body.adm-dark .pickgrid .pick em{position:absolute;top:5px;right:5px;width:19px;height:19px;border-radius:7px;
  background:rgba(255,255,255,.85);color:transparent;font-style:normal;font-size:12px;font-weight:900;
  display:flex;align-items:center;justify-content:center}
body.adm-dark .pickgrid .pick:has(input:checked) img{opacity:1}
body.adm-dark .pickgrid .pick:has(input:checked){outline:2px solid var(--brand);outline-offset:-2px}
body.adm-dark .pickgrid .pick:has(input:checked) em{background:var(--brand);color:#fff}
body.adm-dark .sh-builder-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:2px 2px 0}
body.adm-dark .sh-material{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
body.adm-dark .sh-material b{font-size:12.5px;color:var(--ink)}
body.adm-dark .sh-material span{font:12px var(--mono);color:var(--brand);background:var(--brand-soft);border-radius:9px;padding:5px 8px}
body.adm-dark .sh-material small{font-size:12px;color:var(--mut)}
body.adm-dark .sh-submit{display:grid;justify-items:end;gap:4px;flex:none}
body.adm-dark .sh-submit .btn{min-width:154px;min-height:46px}
body.adm-dark .sh-submit span{font-size:12px;color:var(--mut)}
body.adm-dark .exports{display:flex;gap:6px;flex-wrap:wrap}
body.adm-dark .exports span{font-size:12px;color:var(--sub);background:var(--bg);border-radius:10px;padding:7px 11px}
@media(max-width:1320px){
  body.adm-dark .sh-form{grid-template-columns:minmax(180px,1fr) minmax(260px,1.3fr) minmax(300px,1.4fr)}
  body.adm-dark .sh-music{grid-column:1/2}
  body.adm-dark .sh-emphasis{grid-column:2/-1}
}
@media(max-width:1100px){
  body.adm-dark .sh-form{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.adm-dark .sh-music,body.adm-dark .sh-emphasis{grid-column:auto}
  body.adm-dark .sh-emphasis{grid-column:1/-1}
}
@media(max-width:640px){
  body.adm-dark .sh-step{padding:13px}
  body.adm-dark .sh-form{grid-template-columns:1fr}
  body.adm-dark .sh-emphasis{grid-column:auto}
  body.adm-dark .sh-builder-foot{align-items:stretch;flex-direction:column}
  body.adm-dark .sh-submit{justify-items:stretch}
  body.adm-dark .sh-submit .btn{width:100%}
  body.adm-dark .pickgrid{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* ── 채널 설정 ───────────────────────────────────────── */
body.adm-dark .chlist{display:grid;gap:9px}
body.adm-dark .chrow{display:flex;gap:14px;align-items:center;flex-wrap:wrap;
  background:var(--bg);border-radius:16px;padding:14px 16px}
body.adm-dark .chrow.on{background:var(--brand-soft)}
body.adm-dark .chrow .ch-t{flex:1;min-width:220px}
body.adm-dark .chrow .ch-t b{font-size:14.5px;color:var(--ink);margin-right:7px}
body.adm-dark .chrow .ch-t small{display:block;font-size:12px;color:var(--sub);margin-top:4px}
body.adm-dark .chrow .ch-t em{display:block;font-style:normal;font-size:12px;color:var(--mut);margin-top:3px}
body.adm-dark .chrow .ch-forms{display:flex;gap:5px;margin-top:8px}
body.adm-dark .chrow .ch-forms i{font-style:normal;font-size:12px;border-radius:8px;padding:3px 8px}
body.adm-dark .chrow .ch-forms i.yes{background:#fff;color:var(--brand);font-weight:700}
body.adm-dark .chrow .ch-forms i.no{background:transparent;color:#C9CCC3;text-decoration:line-through}
body.adm-dark .chrow .ch-a{display:grid;gap:7px;min-width:250px}
body.adm-dark .chrow .ch-a form{display:flex;gap:6px}
body.adm-dark .chrow .ch-a input{flex:1;min-width:120px;padding:9px 11px;border:1px solid var(--line);
  border-radius:11px;font-size:12.5px;background:#fff;font-family:inherit}
body.adm-dark .chrow .ch-rule input{min-width:180px}
@media(max-width:640px){body.adm-dark .chrow .ch-a{min-width:0;width:100%}}

/* ── 결제 개시 심사 ─────────────────────────────────── */
body.adm-dark .kyc-hero{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;
  background:linear-gradient(120deg,#31352F,#3E463C);color:#F3F4EF;border-radius:22px;padding:24px 26px;margin:0 0 16px}
body.adm-dark .kyc-hero.done{background:linear-gradient(120deg,#2F5B3A,#4C8C5A)}
body.adm-dark .kyc-hero .kh-badge{display:flex;gap:9px;align-items:center;margin-bottom:11px}
body.adm-dark .kyc-hero .kh-badge em{font-style:normal;font-size:12px;color:#D8DFD3;
  background:rgba(255,255,255,.12);border-radius:9px;padding:4px 9px}
body.adm-dark .kyc-hero h3{margin:0;font-size:23px;line-height:1.35;letter-spacing:-.3px;color:#fff}
body.adm-dark .kyc-hero p{margin:9px 0 0;font-size:13.5px;line-height:1.8;color:#D5DCD0;max-width:640px;word-break:keep-all}
body.adm-dark .kyc-hero .kh-need{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}
body.adm-dark .kyc-hero .kh-need span{display:flex;align-items:center;gap:7px;font-size:12.5px;color:#EDF1E9;
  background:rgba(255,255,255,.1);border-radius:12px;padding:9px 13px}
body.adm-dark .kyc-hero .kh-need i{font-style:normal;font-family:var(--mono);font-size:12px;color:#C7E0C9}
body.adm-dark .kyc-hero .kh-r{display:grid;gap:10px;justify-items:center;min-width:132px}
body.adm-dark .kh-ring{position:relative;width:112px;height:112px;border-radius:50%;display:grid;place-items:center;text-align:center;
  background:conic-gradient(#9FD6A8 calc(var(--p)*1%),rgba(255,255,255,.14) 0)}
body.adm-dark .kh-ring:before{content:"";position:absolute;width:84px;height:84px;border-radius:50%;background:#31352F}
body.adm-dark .kyc-hero.done .kh-ring:before{background:#2F5B3A}
body.adm-dark .kh-ring b,body.adm-dark .kh-ring span{position:relative;z-index:1}
body.adm-dark .kh-ring b{font-size:26px;font-family:var(--mono);color:#fff;line-height:1}
body.adm-dark .kh-ring b small{font-size:13px;color:#B9C6B5}
body.adm-dark .kh-ring span{display:block;font-size:12px;color:#C3CEBE;margin-top:4px}
body.adm-dark .kh-time{font-size:12px;color:#C3CEBE;text-align:center}
body.adm-dark .kh-time b{color:#fff;font-size:15px;font-family:var(--mono)}
body.adm-dark .kh-time small{display:block;margin-top:2px}

body.adm-dark .kyc-list{display:grid;gap:10px;margin-bottom:16px}
body.adm-dark .kyc-step{display:grid;grid-template-columns:96px 1fr;gap:16px;background:#fff;
  border:1px solid var(--line);border-radius:20px;padding:18px 20px}
body.adm-dark .kyc-step.s-ok{border-color:#CBE3CE;background:#FBFDFA}
body.adm-dark .kyc-step.s-fail{border-color:#F0C9C4;background:#FFFBFA}
body.adm-dark .kyc-step .ks-no{display:grid;gap:8px;justify-items:start;align-content:start}
body.adm-dark .kyc-step .ks-no i{font-style:normal;font-family:var(--mono);font-size:19px;color:#C9CCC3;font-weight:500}
body.adm-dark .kyc-step.s-ok .ks-no i{color:var(--brand)}
body.adm-dark .kyc-step .ks-b>b{display:block;font-size:15.5px;color:var(--ink)}
body.adm-dark .kyc-step .ks-b>small{display:block;font-size:12.5px;color:var(--sub);margin-top:4px;line-height:1.6}
body.adm-dark .kyc-step .ks-res{margin:9px 0 0;font-size:12.5px;color:var(--mut);line-height:1.7}
body.adm-dark .kyc-step .ks-res.good{color:#2F6B3E}
body.adm-dark .kyc-step .ks-res.bad{color:#B4342A}
body.adm-dark .kyc-step .ks-res em{font-style:normal;color:var(--mut);font-size:12px;margin-left:6px}
body.adm-dark .kyc-step .ks-a{margin-top:13px;display:grid;gap:9px}
body.adm-dark .ks-form{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap;
  background:var(--bg);border-radius:14px;padding:12px 13px}
body.adm-dark .ks-fx{display:grid;gap:4px;min-width:140px}
body.adm-dark .ks-fx label{font-size:12px;color:var(--mut)}
body.adm-dark .ks-fx input,body.adm-dark .ks-fx select{padding:9px 11px;border:1px solid var(--line);
  border-radius:11px;font-size:13px;background:#fff;font-family:inherit;min-height:40px;width:100%}
body.adm-dark .ks-fx input[readonly]{background:#F6F7F3;color:var(--sub)}
body.adm-dark .ks-hint{font-size:12px;color:var(--mut);line-height:1.7}
body.adm-dark .ks-hint a{color:var(--brand);font-weight:700}
body.adm-dark .contract{background:var(--bg);border-radius:16px;padding:18px 20px;font-size:13px;
  line-height:1.9;white-space:pre-wrap;color:var(--sub);font-family:inherit;margin:0;overflow-x:auto}
body.adm-dark .kyc-log{min-width:860px}
@media(max-width:760px){
  body.adm-dark .kyc-hero{grid-template-columns:1fr;padding:20px}
  body.adm-dark .kyc-hero h3{font-size:19px}
  body.adm-dark .kyc-hero .kh-r{justify-items:start;grid-auto-flow:column;align-items:center;gap:16px}
  body.adm-dark .kyc-step{grid-template-columns:1fr;gap:10px;padding:16px}
  body.adm-dark .kyc-step .ks-no{grid-auto-flow:column;justify-content:start;align-items:center;gap:10px}
  body.adm-dark .ks-fx{min-width:0;flex:1 1 100%}
  body.adm-dark .ks-form .btn{width:100%}
}


/* ── 좁은 화면 마무리 ─────────────────────────────────
   iOS 는 글자 16px 미만 입력칸을 누르면 화면을 확대해 레이아웃이 흔들린다.
   좁은 화면에서만 입력칸 글자를 16px 로 올려 확대를 막는다. */
@media(max-width:520px){
  body.adm-dark input,body.adm-dark select,body.adm-dark textarea,
  body.login-dark input,body.wz-dark input,body.wz-dark select,body.wz-dark textarea{font-size:16px}
  body.adm-dark .listfilter .lf-search input,
  body.adm-dark .listfilter .lf-date input,
  body.adm-dark .ks-fx input,body.adm-dark .ks-fx select,
  body.adm-dark .chrow .ch-a input{font-size:16px}
  /* 손가락으로 누를 수 있는 최소 크기 */
  body.adm-dark .btn.sm,body.adm-dark .sel a,body.adm-dark .pg a,body.adm-dark .pg span{min-height:40px}
  body.adm-dark .sel a{display:flex;align-items:center}
  /* 표 안 버튼이 세로로 쌓일 때 여백 */
  body.adm-dark td .btn.sm{margin-bottom:4px}
}
@media(max-width:430px){
  /* 채널×형식 표: 형식 칸을 좁혀 채널 이름이 눌리지 않게 */
  body.adm-dark .pubmatrix .pm-h,body.adm-dark .pubmatrix .pm-r{grid-template-columns:1fr 40px 40px 40px}
  body.adm-dark .pubmatrix .pm-h{font-size:12px}
  body.adm-dark .pubmatrix .pm-ch em{display:none}
  /* 지표 카드 숫자가 두 줄로 넘치지 않게 */
  body.adm-dark .stat .b .v{font-size:19px}
  body.adm-dark .stat .b .v span{font-size:12px}
}
/* 긴 주소·코드가 담긴 칸은 어디서든 끊어 준다 */
body.adm-dark .caption,body.adm-dark .ks-hint,body.adm-dark .ks-res,
body.adm-dark .tip,body.adm-dark .attach .att-f{overflow-wrap:anywhere}


/* ── 좁은 화면에서 표가 "잘린 것"처럼 보이지 않게 ──────────
   가로로 밀 수 있는 카드의 좌우 끝에 그림자를 띄운다.
   background-attachment:local/scroll 조합이라 스크롤 가능할 때만 보인다. */
@media(max-width:820px){
  body.adm-dark .card:has(>table.t),
  body.adm-dark .card:has(>.tbl-scroll){
    background-image:
      linear-gradient(to right,#fff 34%,rgba(255,255,255,0)),
      linear-gradient(to left,#fff 34%,rgba(255,255,255,0)),
      radial-gradient(farthest-side at 0 50%,rgba(49,53,47,.16),rgba(49,53,47,0)),
      radial-gradient(farthest-side at 100% 50%,rgba(49,53,47,.16),rgba(49,53,47,0));
    background-position:left center,right center,left center,right center;
    background-size:36px 100%,36px 100%,13px 100%,13px 100%;
    background-repeat:no-repeat;
    background-attachment:local,local,scroll,scroll;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-inline:contain;
  }
}

/* 961px 이상에서는 사이드바를 항상 보여준다.
   (admin.css 의 1080px 블록이 사이드바를 밀어놓던 것을 여기서 되돌린다) */
@media(min-width:961px){
  body.adm-dark .side{
    position:sticky; left:auto; top:56px; width:236px;
    height:calc(100vh - 56px); z-index:auto; box-shadow:none; transition:none;
  }
  body.adm-dark .side-toggle{display:none}
  body.adm-dark .side-dim{display:none}
  body.adm-dark.nav-open{overflow:visible}
}

/* ══════════════════════════════════════════════════════════════
   모바일 · 태블릿 여백 축소와 축약 표시
   - 폰: 좌우 여백을 없애고 목록 카드는 화면 끝까지 (full bleed)
   - 태블릿: 여백을 절반으로
   - 글자·행 높이를 한 단계 줄이고, 표는 부차 열을 숨긴다(.hide-sm)
   ══════════════════════════════════════════════════════════════ */
/* 태블릿(세로·가로)까지 같은 축약 규칙을 쓴다 */
@media(max-width:1180px){
  body.adm-dark .wrap{padding:16px 16px 72px}
  body.adm-dark .main-h{margin:0 0 14px}
  body.adm-dark .main-h h2{font-size:21px}
  body.adm-dark .main-h p{font-size:12.5px;margin-top:4px}
  body.adm-dark .card{padding:16px;margin-bottom:12px}
  body.adm-dark .card>h2,body.adm-dark .card-h{padding-bottom:10px;margin-bottom:12px}
  body.adm-dark .stat{margin-bottom:14px;gap:10px}
  body.adm-dark .tip{padding:11px 13px;font-size:12.5px;line-height:1.65;margin-bottom:12px}
  body.adm-dark table.t{font-size:12.5px}
  body.adm-dark table.t th,body.adm-dark table.t td{padding:10px 10px}
}
@media(max-width:560px){
  /* 좌우 여백 제거 — 카드가 화면 끝까지 붙는다 */
  body.adm-dark .wrap{padding:10px 0 60px}
  body.adm-dark .wrap>*{margin-left:11px;margin-right:11px}
  body.adm-dark .wrap>.card{
    margin-left:0;margin-right:0;padding:14px 12px;
    border-radius:0;border-left-width:0;border-right-width:0;box-shadow:none;
    border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  }
  body.adm-dark .wrap>.opmodal{margin:0}
  body.adm-dark .wrap>.kyc-hero{margin-left:0;margin-right:0;border-radius:0;padding:18px 14px}
  body.adm-dark .main-h{margin:2px 0 12px;gap:10px}
  body.adm-dark .main-h h2{font-size:18.5px}
  body.adm-dark .main-h-a{width:100%}
  body.adm-dark .main-h-a .btn{width:100%}
  /* 지표는 두 칸씩, 글자 축소 */
  body.adm-dark .stat{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
  body.adm-dark .stat .b{padding:12px 12px}
  body.adm-dark .stat .b .l{font-size:12px}
  body.adm-dark .stat .b .v{font-size:18px}
  body.adm-dark .stat .b .v span{font-size:12px}
  body.adm-dark .stat .b .d{font-size:12px;line-height:1.5}
  /* 표: 글자·여백 한 단계 축소 + 부차 열 숨김 */
  body.adm-dark table.t{font-size:12px}
  body.adm-dark table.t th,body.adm-dark table.t td{padding:9px 8px}
  body.adm-dark table.t td small{font-size:12px}
  body.adm-dark .hide-sm{display:none}
  /* 카드 안 여백·제목 */
  body.adm-dark .card>h2{font-size:15px}
  body.adm-dark .card-h b{font-size:14.5px}
  body.adm-dark .card-h .more{font-size:12px}
  /* 목록 아래 도구들 */
  body.adm-dark .listfilter{gap:6px;padding:0 0 10px}
  body.adm-dark .sel{gap:5px}
  body.adm-dark .sel a{padding:8px 11px;font-size:12px}
  body.adm-dark .pager{margin-top:12px}
  body.adm-dark .empty{padding:26px 12px;font-size:12.5px}
}
@media(max-width:430px){
  body.adm-dark .wrap>*{margin-left:9px;margin-right:9px}
  body.adm-dark .wrap>.card{padding:13px 10px}
  body.adm-dark table.t{font-size:12px}
  body.adm-dark table.t th,body.adm-dark table.t td{padding:8px 7px}
}

/* 숨긴 열만큼 표 최소폭도 줄인다 — 모바일에서 불필요한 가로 스크롤 방지 */
@media(max-width:560px){
  body.adm-dark table.t{min-width:0}
  /* admin.css 에서 !important 로 잡아둔 표들은 같은 강도로 풀어준다 */
  body.adm-dark .notice-table,body.adm-dark .item-list,
  body.adm-dark .kyc-log,body.adm-dark .talk-table{min-width:0}
  body.adm-dark .customer-review-table{min-width:0!important;table-layout:auto!important}
  body.adm-dark .paylink-table{min-width:520px!important;table-layout:auto!important}
  /* 6열이 남는 표는 조금만 넓게 (가로로 밀어서 본다) */
  body.adm-dark table.t.item-manage-table{min-width:0}
}

/* 좁은 화면에서 폰 미리보기가 화면을 다 먹지 않게 */
@media(max-width:560px){
  body.adm-dark .split2>.phone,body.adm-dark .phone{height:min(560px,62vh);max-width:320px;border-width:7px}
  body.adm-dark .split2{gap:12px}
}

/* ══════════════════════════════════════════════════════════════
   site.css 에는 프로토타입의 "관리자 목업" 규칙(.main .card .card-h .tl .kpis)이
   함께 들어 있다. 실제 관리자는 폰 미리보기 때문에 site.css 를 먼저 불러오므로
   그 여백이 그대로 새어 들어온다(모바일에서 좌우 36px · 위 30px · 아래 70px).
   여기서 한 번에 끊는다. 폰 미리보기 안쪽(.phone)은 손님 화면이라 건드리지 않는다.
   ══════════════════════════════════════════════════════════════ */
body.adm-dark .lay>.main{padding:0;overflow-y:visible;min-width:0;max-width:100%}
body.adm-dark .wrap .card{overflow-y:visible}
body.adm-dark .wrap .card-h{padding:0 0 12px}
body.adm-dark .wrap .tl{padding:0}
body.adm-dark .wrap .kpis{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
/* 어떤 경우에도 화면 밖으로 밀리지 않게 */
body.adm-dark{max-width:100%}
@media(max-width:1180px){
  body.adm-dark{overflow-x:hidden}
  body.adm-dark .lay{max-width:100%;overflow-x:clip}
}

/* 데모 배너 — 좁은 화면에서는 세로로 쌓는다 */
body.adm-dark .tip-demo{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
body.adm-dark .tip-demo>span{flex:1;min-width:0}
body.adm-dark .tip-demo>em{font-style:normal;font-family:var(--mono);font-size:12px;margin-left:auto;white-space:nowrap}
@media(max-width:560px){
  body.adm-dark .tip-demo{display:block}
  body.adm-dark .tip-demo>em{display:block;margin:6px 0 0;font-size:12px}
}

/* 손님 CSS 값에 기대지 않고 관리자에서 직접 정한다 (tests/css-leak-check.py) */
body.adm-dark .wrap .card:has(>table.t),
body.adm-dark .wrap .card:has(>.tbl-scroll){overflow-x:auto;overflow-y:visible}
body.adm-dark .wrap .card-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}

/* 세로로 쌓일 때는 카드가 폭을 꽉 채우게 (align-items:flex-start 가 남아 있어
   내용이 좁은 쪽 카드만 짧아지고 오른쪽이 비던 문제) */
@media(max-width:1080px){
  body.adm-dark .split2{align-items:stretch}
  body.adm-dark .split2>*{width:100%;min-width:0;max-width:100%}
}

/* ══════════════════════════════════════════════════════════════
   좁은 화면 표 공통 — 잘려 보이지 않게
   1) 주문번호·코드처럼 안 끊기는 글자는 어디서든 끊는다
   2) 관리(버튼) 열은 오른쪽에 붙여 항상 보이게 한다
   3) 표 안 버튼은 작게, 세로로 쌓이게
   ══════════════════════════════════════════════════════════════ */
@media(max-width:820px){
  body.adm-dark .wrap table.t td,body.adm-dark .wrap table.t th{
    overflow-wrap:anywhere; word-break:break-word;
  }
  body.adm-dark .wrap table.t td.mono,body.adm-dark .wrap table.t td .mono{word-break:break-all}
  /* 관리 열 고정 — 카드가 가로로 스크롤돼도 버튼은 제자리 */
  body.adm-dark .wrap table.t thead th:last-child,
  body.adm-dark .wrap table.t tr>th:last-child:not(:only-child),
  body.adm-dark .wrap table.t tr>td:last-child:not(:only-child){
    position:sticky; right:0; z-index:2;
    background:#fff; box-shadow:-10px 0 12px -8px rgba(49,53,47,.18);
  }
  body.adm-dark .wrap table.t thead th:last-child{background:var(--paper,#F3F4EF)}
  /* 라벨 성격의 th(왼쪽 머리칸)는 고정하지 않는다 */
  body.adm-dark .wrap table.t tr>th:first-child{position:static;box-shadow:none}
}
@media(max-width:560px){
  body.adm-dark .wrap table.t td .btn.sm,body.adm-dark .wrap table.t td .btn{
    padding:7px 9px; font-size:12px; min-height:34px; margin:0 2px 3px 0;
  }
  body.adm-dark .wrap table.t td:last-child{white-space:normal;min-width:64px}
  body.adm-dark .wrap table.t td:last-child form{display:block}
  /* 표 안 입력칸(메모 등)도 좁게 */
  body.adm-dark .wrap table.t td input,body.adm-dark .wrap table.t td select{font-size:13px;padding:6px 8px}
}

/* 주간 시간대 편집 — 요일 칸이 폭을 채우게 (좁은 화면에서 라벨·배지가 눌리던 문제) */
@media(max-width:820px){
  body.adm-dark .weekly-slot-day{align-items:stretch}
  body.adm-dark .weekly-slot-day span{align-self:flex-start}
  body.adm-dark .weekly-slot-row{grid-template-columns:1fr;gap:8px;padding:10px}
}

/* 주문 방식 복수 선택 */
body.adm-dark .mode-pick{cursor:pointer;position:relative}
body.adm-dark .mode-pick .hd{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
body.adm-dark .mode-pick input[type=checkbox]{accent-color:var(--brand);flex:none}
body.adm-dark .mode-pick.on{border-color:var(--brand);background:var(--brand-soft)}
body.adm-dark .mode-pick:hover{border-color:var(--brand)}

/* ── 테이블 QR (상품 관리) ───────────────────────────── */
body.adm-dark .table-qr-tools{display:grid;gap:10px}
body.adm-dark .tqr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
body.adm-dark .tqr{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px;
  display:grid;gap:9px;justify-items:center;text-align:center}
body.adm-dark .tqr.off{background:#FBFBF8;opacity:.72}
body.adm-dark .tqr-top{display:flex;align-items:center;gap:8px;width:100%;justify-content:space-between}
body.adm-dark .tqr-no{font-family:var(--mono);font-size:19px;font-weight:500;color:var(--brand)}
body.adm-dark .tqr-img{background:#fff;border:1px solid var(--line);border-radius:14px;padding:7px;line-height:0}
body.adm-dark .tqr-img img{display:block;width:130px;height:130px}
body.adm-dark .tqr-name{font-size:13.5px;color:var(--ink)}
body.adm-dark .tqr-url{font-size:12px;color:var(--mut);word-break:break-all;background:var(--bg);
  border-radius:8px;padding:5px 7px;width:100%}
body.adm-dark .tqr-act{display:flex;gap:5px;flex-wrap:wrap;justify-content:center}
body.adm-dark .tqr-act form{display:inline}
@media(max-width:560px){
  body.adm-dark .tqr-grid{grid-template-columns:1fr 1fr;gap:9px}
  body.adm-dark .tqr{padding:11px}
  body.adm-dark .tqr-img img{width:104px;height:104px}
  body.adm-dark .tqr-url{display:none}
}

/* ── 쇼핑몰 배송 처리 ─────────────────────────────────── */
body.adm-dark .ship-box{background:var(--bg);border-bottom:1px solid var(--line);padding:12px 15px}
body.adm-dark .ship-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px}
body.adm-dark .ship-h b{font-size:13.5px}
body.adm-dark .ship-h a{color:var(--brand);font-weight:700}
body.adm-dark .ship-h em{font-style:normal;font-size:12px;color:var(--mut);margin-left:auto}
body.adm-dark .ship-a{margin-top:6px;font-size:12.5px;color:var(--sub);line-height:1.65}
body.adm-dark .ship-a i{display:block;font-style:normal;font-size:12px;color:var(--mut);margin-top:3px}
body.adm-dark .ship-t{margin-top:7px;font-size:12px;background:#fff;border-radius:10px;padding:8px 10px;
  display:flex;gap:8px;align-items:center;flex-wrap:wrap}
body.adm-dark .ship-t a{color:var(--brand);font-weight:700}
body.adm-dark .ship-t small{color:var(--mut);margin-left:auto}
body.adm-dark .ship-f{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
body.adm-dark .ship-f select,body.adm-dark .ship-f input{padding:8px 10px;border:1px solid var(--line);
  border-radius:10px;font-size:12.5px;background:#fff;font-family:inherit;min-height:38px}
body.adm-dark .ship-f input{flex:1;min-width:120px}
@media(max-width:560px){
  body.adm-dark .ship-f select,body.adm-dark .ship-f input{flex:1 1 100%}
  body.adm-dark .ship-f .btn{width:100%}
}

/* 쇼핑몰 템플릿 미리보기 (작은 도형으로 진열 모양을 보여준다) */
body.adm-dark .tplview{display:grid;gap:4px;margin:10px 0;background:var(--bg);border-radius:12px;padding:8px}
body.adm-dark .tplview i{background:#D9DDD3;border-radius:5px;display:block}
body.adm-dark .tplview.tpl-grid{grid-template-columns:1fr 1fr}
body.adm-dark .tplview.tpl-grid i{height:26px}
body.adm-dark .tplview.tpl-showcase{grid-template-columns:1fr 1fr}
body.adm-dark .tplview.tpl-showcase i:first-child{grid-column:1/-1;height:34px}
body.adm-dark .tplview.tpl-showcase i{height:22px}
body.adm-dark .tplview.tpl-catalog{grid-template-columns:1fr}
body.adm-dark .tplview.tpl-catalog i{height:13px}
body.adm-dark .tplview.tpl-lookbook{grid-template-columns:1fr}
body.adm-dark .tplview.tpl-lookbook i{height:28px}
body.adm-dark .tplview.tpl-lookbook i:nth-child(n+3){display:none}

/* 회원 목록 — 배송지는 넓게, 나머지는 내용에 맞게 */
body.adm-dark .member-table td.mt-addr small{white-space:normal;line-height:1.6;display:block}
body.adm-dark .member-table td:first-child small{white-space:nowrap}
body.adm-dark .member-table{min-width:0}
@media(min-width:561px){ body.adm-dark .member-table{table-layout:fixed} }

/* 손님 명단 — 회원·배송지 열이 넓게 쓰이도록 */
body.adm-dark .customer-table{min-width:860px}
body.adm-dark .customer-table td small{display:block;font-size:12px;color:var(--mut);margin-top:2px;white-space:normal;line-height:1.55}
body.adm-dark .customer-table td .badge{margin-right:4px}
@media(max-width:560px){ body.adm-dark .customer-table{min-width:0} }


/* 상품 목록의 상세 · 고시 칸 — 무엇이 비었는지 버튼에 붙여 알려 준다 */
body.adm-dark .it-warn{display:inline-block;margin-left:5px;padding:1px 5px;border-radius:5px;
  background:var(--amber-soft);color:var(--amber);font-style:normal;font-size:12px;font-weight:700}
body.adm-dark .btn:not(.g) .it-warn{background:rgba(255,255,255,.24);color:#fff}

/* 이미지 주소 입력은 접어 둔다 — 사장님은 파일을 올리는 게 먼저다 */
body.adm-dark .dt-adv{margin-top:12px;border-top:1px solid var(--line);padding-top:12px}
body.adm-dark .dt-adv summary{cursor:pointer;font-size:12.5px;color:var(--sub);font-weight:700}
body.adm-dark .dt-adv summary:hover{color:var(--ink)}

/* 상품 사진 여러 장 */
body.adm-dark .ii-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:9px}
body.adm-dark .ii-one{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--bg);border:1px solid var(--line)}
body.adm-dark .ii-one img{width:100%;height:100%;object-fit:cover;display:block}
body.adm-dark .ii-one>span{position:absolute;left:6px;top:6px;background:var(--brand);color:#fff;
  font-size:12px;font-weight:700;padding:2px 7px;border-radius:999px}
body.adm-dark .ii-one form{position:absolute;right:5px;top:5px;margin:0}
body.adm-dark .ii-x{width:26px;height:26px;border:0;border-radius:50%;background:rgba(20,22,20,.62);
  color:#fff;font-size:12px;cursor:pointer;line-height:1;font-family:inherit}
body.adm-dark .ii-x:hover{background:rgba(20,22,20,.85)}


/* ══════════════════════════════════════════════════════════════
   쇼핑몰 진열 템플릿 고르기 — 가로로 늘어진 스켈레톤은 모양이 안 읽힌다.
   카드를 격자로 놓고 그 안에 실제 진열 모양을 작게 흉내낸다.
   ══════════════════════════════════════════════════════════════ */
body.adm-dark .tplgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:12px;
  max-width:1120px}   /* auto-fill 은 빈 칸을 남겨 카드가 왼쪽에 몰린다 */
body.adm-dark .tplcard{position:relative;display:block;border:1.5px solid var(--line);border-radius:16px;
  background:#fff;overflow:hidden;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease}
body.adm-dark .tplcard:hover{border-color:#C7CCBF;box-shadow:var(--shadow)}
body.adm-dark .tplcard.on{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
body.adm-dark .tplcard input{position:absolute;opacity:0;pointer-events:none}

/* 미리보기 — 사진 칸(i) 과 글줄(b) 로 진열 모양을 만든다 */
body.adm-dark .tplshot{display:grid;gap:6px;padding:12px;background:var(--bg);
  border-bottom:1px solid var(--line);aspect-ratio:4/3;align-content:start;overflow:hidden}
body.adm-dark .tplshot span{display:grid;gap:3px;min-width:0}
body.adm-dark .tplshot i{display:block;background:#D5DAD0;border-radius:5px;aspect-ratio:1}
body.adm-dark .tplshot b{display:block;height:4px;border-radius:3px;background:#DFE3DA}
body.adm-dark .tplshot b.s{width:52%}

/* 격자 — 두 칸씩 반듯하게 */
body.adm-dark .tplshot.tpl-grid{grid-template-columns:1fr 1fr}
body.adm-dark .tplshot.tpl-grid span:nth-child(n+5){display:none}
/* 대표 강조 — 맨 위 한 칸을 크게 */
body.adm-dark .tplshot.tpl-showcase{grid-template-columns:1fr 1fr}
body.adm-dark .tplshot.tpl-showcase span:first-child{grid-column:1/-1}
body.adm-dark .tplshot.tpl-showcase span:first-child i{aspect-ratio:16/7}
body.adm-dark .tplshot.tpl-showcase span:nth-child(n+4){display:none}
/* 목록형 — 사진 작게, 글이 옆으로 */
body.adm-dark .tplshot.tpl-catalog{grid-template-columns:1fr}
body.adm-dark .tplshot.tpl-catalog span{grid-template-columns:26px 1fr;grid-template-rows:auto auto;
  column-gap:7px;align-items:center}
body.adm-dark .tplshot.tpl-catalog i{grid-row:1/span 2;aspect-ratio:1}
body.adm-dark .tplshot.tpl-catalog span:nth-child(n+5){display:none}
/* 룩북 — 한 칸 가득 */
body.adm-dark .tplshot.tpl-lookbook{grid-template-columns:1fr}
body.adm-dark .tplshot.tpl-lookbook i{aspect-ratio:16/9}
body.adm-dark .tplshot.tpl-lookbook span:nth-child(n+3){display:none}

body.adm-dark .tplmeta{padding:12px 14px 14px}
body.adm-dark .tplnm{display:flex;align-items:center;gap:7px;font-size:14px;font-weight:700;color:var(--ink)}
body.adm-dark .tplnm em{font-style:normal;font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;
  background:var(--brand);color:#fff}
body.adm-dark .tplmeta p{margin:5px 0 0;font-size:12px;color:var(--sub);line-height:1.6}
body.adm-dark .tplmeta small{display:block;margin-top:7px;padding-top:7px;border-top:1px solid var(--line);
  font-size:12px;color:var(--mut);line-height:1.5}


/* 우편번호 찾기 — .zip-btn 은 손님 화면 색(--ac)을 쓰는데 관리자에는 그 값이 없어
   테두리·글자색이 빠져 그냥 글자처럼 보였다. 관리자 색으로 다시 입힌다. */
body.adm-dark .zip-row{display:flex;gap:8px;align-items:stretch}
body.adm-dark .zip-row input{flex:1;min-width:0}
body.adm-dark .zip-btn{flex:none;min-height:46px;padding:0 16px;border-radius:12px;cursor:pointer;
  border:1px solid var(--brand);background:var(--brand-soft);color:var(--brand-deep);
  font-size:13px;font-weight:700;font-family:inherit;white-space:nowrap}
body.adm-dark .zip-btn:hover{background:var(--brand);color:#fff}
body.adm-dark .zip-btn:disabled{opacity:.55;cursor:not-allowed}
body.adm-dark .zip-note{margin-top:6px;font-size:12px;color:var(--dg);line-height:1.6}
@media(max-width:560px){
  body.adm-dark .zip-row{flex-wrap:wrap}
  body.adm-dark .zip-row input{flex:1 0 100%}
  body.adm-dark .zip-btn{flex:1 0 100%}
}


/* ── 관리자 화면 잔손질 ────────────────────────────────────── */
/* 곁들이는 설명글 — .fld 밖에 쓰인 .hint 는 꾸밈이 없어 본문처럼 커 보였다 */
body.adm-dark .hint{font-size:12px;color:var(--mut);line-height:1.65}
body.adm-dark .hint b{color:var(--sub);font-weight:700}
body.adm-dark .hint a{color:var(--brand-deep);font-weight:700}
body.adm-dark .card-h .more{font-size:12px;color:var(--mut);font-weight:600}
body.adm-dark .card h2 .more{font-size:12px;color:var(--mut);font-weight:600}
body.adm-dark .fld label small{font-size:12px;color:var(--mut);font-weight:600}

/* 입력칸을 나란히 놓는 줄 — 아래쪽 정렬이면 힌트가 있는 칸 때문에 이름표 높이가 어긋난다 */
body.adm-dark .flx:has(>.fld){align-items:flex-start}
body.adm-dark .flx:has(>.fld)>.btn{align-self:flex-end}
@media(max-width:720px){
  body.adm-dark .card form.flx:has(.hint)>.btn{margin-top:0}
}

/* 배송 설정 세 칸 — 폭을 고정하지 않고 고르게 나눈다 */
body.adm-dark .shiprow{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:12px;max-width:640px;align-items:start}
body.adm-dark .shiprow .fld{margin-bottom:0;width:auto}

/* 후기 사진 (관리자) */
body.adm-dark .rv-adm{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 12px}
body.adm-dark .rv-adm-one{position:relative;width:88px;height:88px;border-radius:11px;overflow:hidden;
  background:var(--bg);border:1px solid var(--line)}
body.adm-dark .rv-adm-one img{width:100%;height:100%;object-fit:cover;display:block}
body.adm-dark .rv-adm-one form{position:absolute;right:4px;top:4px;margin:0}
body.adm-dark .rv-adm-x{width:24px;height:24px;border:0;border-radius:50%;background:rgba(20,22,20,.62);
  color:#fff;font-size:12px;cursor:pointer;line-height:1;font-family:inherit}
body.adm-dark .rv-adm-x:hover{background:rgba(20,22,20,.85)}

/* 사업장 사진 (결제 개시 심사) */
body.adm-dark .bp-sum{margin:12px 0 10px;font-size:12.5px;color:var(--sub)}
body.adm-dark .bp-sum b{color:var(--ink);font-weight:800}
body.adm-dark .bp-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-bottom:12px}
body.adm-dark .bp-one{position:relative;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}
body.adm-dark .bp-one>a{display:block;aspect-ratio:4/3;background:var(--bg)}
body.adm-dark .bp-one img{width:100%;height:100%;object-fit:cover;display:block}
body.adm-dark .bp-b{padding:9px 11px 11px}
body.adm-dark .bp-b b{display:block;font-size:12.5px;color:var(--ink)}
body.adm-dark .bp-b small{display:block;margin-top:3px;font-size:12px;color:var(--mut);line-height:1.5}
body.adm-dark .bp-one form{position:absolute;right:6px;top:6px;margin:0}
body.adm-dark .bp-x{width:26px;height:26px;border:0;border-radius:50%;background:rgba(20,22,20,.62);
  color:#fff;font-size:12px;cursor:pointer;line-height:1;font-family:inherit}
body.adm-dark .bp-x:hover{background:rgba(20,22,20,.85)}
body.adm-dark .bp-x:disabled{opacity:.45;cursor:not-allowed}

/* ══════════════════════════════════════════════════════════════
   2026-08 관리자 전수 점검 보정
   - 일반 카드에 새던 가로 스크롤을 표 전용으로 제한
   - 제작 도구의 누락된 카드뉴스 미리보기 레이아웃 복원
   - 고정폭 폼·목록이 부모 폭을 밀지 않도록 최소폭 사슬 차단
   ══════════════════════════════════════════════════════════════ */
body.adm-dark{overflow-x:clip}
body.adm-dark .lay,body.adm-dark .main,body.adm-dark .wrap,
body.adm-dark .wrap>*,body.adm-dark .card,body.adm-dark form{min-width:0;max-width:100%}

/* 표처럼 실제로 넓은 내용만 카드 안에서 좌우로 민다. */
body.adm-dark .wrap .card:has(>table.t),body.adm-dark .wrap .card:has(>.tbl-scroll),
body.adm-dark .wrap .table-scroll{overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}

/* 카드뉴스 제작 무대 */
body.adm-dark .promo-stage>.card{width:100%;min-width:0}
body.adm-dark .promo-stage>.ps-stage{min-height:0}
body.adm-dark .respane,body.adm-dark .slides,body.adm-dark .pv-side{min-width:0}
body.adm-dark .slides{display:grid;grid-template-columns:repeat(auto-fit,minmax(176px,1fr));gap:12px;align-items:start}
body.adm-dark .sl{min-width:0}
body.adm-dark .sl .cv{position:relative;aspect-ratio:1;overflow:hidden;border-radius:16px;background:#DDE2DB;isolation:isolate}
body.adm-dark .sl.short .cv{aspect-ratio:9/16;max-height:460px}
body.adm-dark .sl.one .cv{aspect-ratio:4/5}
body.adm-dark .sl .cv>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:0}
body.adm-dark .sl .cv .ov{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:flex-end;
  padding:16px;color:#fff;background:linear-gradient(to top,rgba(20,24,20,.86),rgba(20,24,20,.06) 68%)}
body.adm-dark .sl .cv .ov .no{font-family:var(--mono);font-size:12px;letter-spacing:.08em;opacity:.82;margin-bottom:7px}
body.adm-dark .sl .cv .ov b{font-family:var(--soft);font-size:clamp(16px,1.5vw,21px);line-height:1.3;word-break:keep-all}
body.adm-dark .sl .cv .ov span{display:block;margin-top:6px;font-size:12px;line-height:1.55;opacity:.92}
body.adm-dark .sl .bt{display:flex;justify-content:flex-end;padding-top:6px}
body.adm-dark .sl .bt button{min-height:34px;padding:6px 10px;border:1px solid var(--line);font-family:var(--mono);font-size:12px;cursor:pointer}
body.adm-dark .sl .cv.d-block .ov{background:linear-gradient(145deg,var(--brand),var(--brand-deep));color:#fff}
body.adm-dark .sl .cv.d-block>img{opacity:.22}

/* 문구 편집 표는 데스크톱에서는 열을 맞추고, 좁으면 읽는 순서대로 쌓는다. */
body.adm-dark .ed-row{display:grid;grid-template-columns:30px minmax(130px,1fr) minmax(160px,1.3fr) minmax(160px,1fr) 58px;
  gap:7px;align-items:start;margin-bottom:7px;min-width:0}
body.adm-dark .ed-row>*{min-width:0;width:100%}
body.adm-dark .ed-row .n{padding-top:9px;font:12px var(--mono);color:var(--mut)}

/* 필터·파일 입력·긴 주소가 카드 자체의 폭을 넓히지 않게 한다. */
body.adm-dark .listfilter>*{min-width:0}
body.adm-dark .listfilter .lf-search{max-width:none}
body.adm-dark .fld input,body.adm-dark .fld select,body.adm-dark .fld textarea,
body.adm-dark input[type=file]{max-width:100%}
body.adm-dark .empty{display:grid;place-items:center;align-content:center;border-radius:14px;background:var(--bg);min-height:132px}
body.adm-dark :is(a,button,input,select,textarea):focus-visible{outline:3px solid rgba(240,82,43,.24);outline-offset:2px}

@media(min-width:1500px){
  body.adm-dark .respane{grid-template-columns:minmax(0,1.35fr) minmax(250px,.65fr);align-items:start}
}
@media(max-width:1280px){body.adm-dark .ps-panel{max-width:none}}
@media(max-width:820px){
  body.adm-dark .slides{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  body.adm-dark .ed-row{grid-template-columns:28px minmax(0,1fr)}
  body.adm-dark .ed-row.hd{display:none}
  body.adm-dark .ed-row>*:not(.n){grid-column:2}
}
@media(max-width:560px){
  body.adm-dark .slides{grid-template-columns:1fr 1fr}
  body.adm-dark .sl .cv .ov{padding:12px}
  body.adm-dark .sl .cv .ov b{font-size:14px}
  body.adm-dark .sl .cv .ov span{font-size:12px}
  body.adm-dark .listfilter .lf-date{display:grid;grid-template-columns:auto minmax(0,1fr);width:100%}
  body.adm-dark .listfilter .lf-date span{display:none}
  body.adm-dark .listfilter .lf-date input{width:100%;grid-column:2}
}

/* ── 목록 체크 칸 · 내보내기 줄 · 넓은 표 스크롤 ── */
th.ck,td.ck{width:34px;text-align:center;padding-left:8px;padding-right:0}
input[type=checkbox]{cursor:pointer;accent-color:var(--brand);
  flex:0 0 auto;vertical-align:middle}
tr.picked{background:#FFF4F0}
.expbar{display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap;margin-left:auto}
.expbar .exp-n{font-size:12px;color:var(--mut)}
.expbar .exp-n b{color:var(--brand)}
.expbar .exp-note{font-size:12px;color:var(--mut)}
.card>h2{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.tw{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tw>table{min-width:640px}

/* ── 관리자 — 검증 스크립트(responsive-check) 기준 보정 ──
   좁은 화면에서 닫힌 사이드바는 화면 밖에 있으면서도 "보이는" 요소로 잡힌다 → visibility 로 감춘다.
   터치 대상 44px · 글씨 12px 하한 · 위쪽 막대 가게 선택이 폭을 밀지 않게 · 제목 줄바꿈. */
@media(max-width:1080px){
 .adm-dark .side:not(.on){visibility:hidden}
 .adm-dark .side{transition:left .2s ease,visibility .2s}
}
.appbar .ab-r{min-width:0;flex:1 1 auto;display:flex;align-items:center;justify-content:flex-end;gap:8px}
.appbar .ab-r select{min-width:0;max-width:46%;text-overflow:ellipsis}
.appbar .ab-brand,.appbar .ab-out{display:inline-flex;align-items:center;min-height:44px}
.appbar .ab-out{padding:0 8px;min-width:44px;justify-content:center}
.adm-dark .card h2{flex-wrap:wrap}
.adm-dark .card h2 .more{white-space:normal;overflow-wrap:anywhere;min-width:0}
.adm-dark .stat .b .v{white-space:normal;overflow-wrap:anywhere}
.ai-fab{min-height:44px}
@media(max-width:1023px){
 .adm-dark .main a:not(.btn):not(.ed-sw){display:inline-flex;align-items:center;min-height:44px}
 .adm-dark .main .btn,.adm-dark .main .btn.sm,.adm-dark .main button,.adm-dark .main select,
 .adm-dark .main input:not([type=checkbox]):not([type=radio]),.adm-dark .main textarea,.adm-dark .main .eb-go{min-height:44px}
 .adm-dark .main .eb-go{display:inline-flex;align-items:center}
 .adm-dark .sel a{min-height:44px}
 .eb .mv{min-width:44px;min-height:44px;display:inline-grid;place-items:center}
 .ed-sw{width:44px;height:44px}.ed-sw i{inset:10px 2px}.ed-sw i::after{top:3px;left:3px}
 .aeo-checks label,.aeo-disc label,.aeo-tog{min-height:44px}
 .aeo-foot .lnk{min-height:44px;padding:0 6px}
 .side a{min-height:44px}
 .adm-dark .fld label,.adm-dark .aeo-hours-row label{display:flex;align-items:flex-end;min-height:44px;margin-bottom:2px}
 .adm-dark .card h2{min-height:44px;line-height:1.4}
 .adm-dark .card h2 .more a{display:inline-flex;align-items:center;min-height:44px}
 .adm-dark .main-h-a a,.adm-dark .main-h-a .btn{min-height:44px;display:inline-flex;align-items:center}
 .adm-dark .tl-b small a{display:inline-flex;align-items:center;min-height:44px}
}
.appbar select{min-height:44px}
.adm-dark .stat .b .v{line-height:1.3}
.adm-dark .card h2,.adm-dark .main-h h2{line-height:1.4;overflow-wrap:anywhere}
.tip b{display:inline-block}
body.adm-dark .ai-fab{max-width:calc(100% - 28px);right:14px}
@media(max-width:430px){.appbar .ab-r .btn,.appbar .ab-r .badge,.appbar .ab-count{display:none}.appbar .ab-r select{max-width:52%}}
/* 측정 표 — 좁은 화면에서 표가 화면 밖으로 나가지 않게 */
.aeo-table table{table-layout:fixed;width:100%}
.aeo-table th,.aeo-table td{overflow-wrap:anywhere;padding:6px 4px;font-size:12px;word-break:break-all}
@media(max-width:430px){.aeo-hours-row{grid-template-columns:28px 1fr 14px 1fr}.aeo-hours-row label{grid-column:1/-1;justify-content:flex-end}.aeo-hours-row input[type=time]{min-width:0;width:100%;padding:6px 4px}}
/* 로그인 화면 */
.dl-eyebrow{font-size:12px}
.login-dark input,.login-dark .btn{min-height:44px}
.login-dark a{display:inline-flex;align-items:center;min-height:44px}

/* admin-soft.css 가 마지막에 로드되므로 여기서 최종 확정한다 */
@media(max-width:1023px){
 body.adm-dark .main .btn.sm,body.adm-dark .main button.btn,body.adm-dark .main .mv{min-height:44px}
 body.adm-dark .main .mv{min-width:44px}
 body.adm-dark .fld input,body.adm-dark .fld select,body.adm-dark .fld textarea,body.adm-dark .main input:not([type=checkbox]):not([type=radio]){min-height:44px}
 body.adm-dark .ed-url a{display:inline-flex;align-items:center;min-height:44px}
}
body.adm-dark .stat .b .v{line-height:1.4}
body.adm-dark .main-h h2{line-height:1.4;overflow-wrap:anywhere}
body.adm-dark .card h2{line-height:1.4}
body.adm-dark table.t th{white-space:normal;overflow-wrap:anywhere}
body.adm-dark .ed-url b{min-width:0;overflow-wrap:anywhere}
body.adm-dark .stylepick button,body.adm-dark .shape button{min-width:0;overflow-wrap:anywhere}
@media(max-width:430px){
 body.adm-dark .appbar{flex-wrap:wrap;height:auto;min-height:56px;padding:6px 10px;row-gap:4px}
 body.adm-dark .appbar .ab-r{flex:1 1 100%;justify-content:flex-end}
 body.adm-dark .ai-fab{right:12px;max-width:calc(100% - 24px)}
 body.adm-dark table.t{table-layout:fixed;width:100%}
 body.adm-dark table.t td,body.adm-dark table.t th{overflow-wrap:anywhere;word-break:break-all}
 body.adm-dark table.t td.n{white-space:normal}
 body.adm-dark .aeo-hours-row{grid-template-columns:28px 1fr}
 body.adm-dark .aeo-hours-row i{display:none}
 body.adm-dark .aeo-hours-row input[type=time]{grid-column:2;min-width:0;width:100%}
 body.adm-dark .aeo-hours-row label{grid-column:1/-1;justify-content:flex-end;min-height:36px}
}
/* 항목 표 · 편집 화면 — 터치 44 · 좁은 화면 표 줄바꿈 */
@media(max-width:1023px){
 body.adm-dark .row-move .mv,body.adm-dark table.t .btn,body.adm-dark table.t button{min-width:44px;min-height:44px}
 body.adm-dark table.t td.n{white-space:normal}
 body.adm-dark .row-move{flex-wrap:wrap}
 body.adm-dark .ed-url a{min-width:44px;justify-content:center}
 body.adm-dark .aeo-hours{grid-template-columns:1fr}
 body.adm-dark .aeo-hours-row label{min-width:44px;justify-content:center}
}

/* 긴 값이 든 입력칸은 말줄임으로 — 안쪽 스크롤을 잘림으로 세지 않게 */
body.adm-dark input,body.wz-dark input,body.login-dark input{text-overflow:ellipsis}
/* 체크박스 · 라디오 — site.css 의 44px 터치 상자를 관리자에서도 최종 확정 (위 15px 규칙을 덮는다) */
body.adm-dark input[type=checkbox],body.adm-dark input[type=radio],body.wz-dark input[type=checkbox],body.wz-dark input[type=radio]{
  width:44px;height:44px;margin:-11px;padding:0;border:0;background:transparent;appearance:none;-webkit-appearance:none;display:inline-grid;place-items:center;vertical-align:middle;flex:none}
body.adm-dark .aeo-tog input{margin-top:-8px}
@media(max-width:1023px){
 body.adm-dark .main table.t td .btn,body.adm-dark .main table.t td .btn.sm,body.adm-dark .main table.t td button,body.adm-dark .main td .row-move .mv{min-height:44px}
 body.adm-dark .main table.t td .btn.sm{padding:9px 12px}
}
/* 체크박스를 품은 라벨 · 스위치 라벨 — 관리자 최종 */
body.adm-dark label:has(input[type=checkbox]),body.adm-dark label:has(input[type=radio]){min-height:44px;display:inline-flex;align-items:center;gap:8px}
body.adm-dark label input[type=checkbox],body.adm-dark label input[type=radio]{margin-top:0;margin-bottom:0}
body.adm-dark .aeo-checks label{display:flex}
body.adm-dark .aeo-hours-row label{display:inline-flex;align-items:center;justify-content:center;min-height:44px}
body.adm-dark .ed-sw input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;appearance:auto;-webkit-appearance:auto}
body.adm-dark .ed-sw input::before{display:none}
@media(max-width:1023px){ body.adm-dark .main .listfilter .btn,body.adm-dark .main .listfilter button{min-height:44px} }
/* 요일표 — 1200px 까지는 한 열 (두 열이면 1024px 에서 시간 입력칸이 칸을 밀어 화면 밖으로 나간다) */
@media(max-width:1200px){ body.adm-dark .aeo-hours{grid-template-columns:1fr} }
body.adm-dark .aeo-hours-row input[type=time]{min-width:0;width:100%}
body.adm-dark .aeo-hours-row{min-width:0}
@media(max-width:1023px){ body.adm-dark .main .listfilter .btn,body.adm-dark .main .listfilter button{min-width:44px} }
/* 장문 스트레스 — 위쪽 막대 · 사이드 토글 · 행 이동 버튼 · 스위치 줄이 긴 라벨에도 줄바꿈으로 버틴다 */
body.adm-dark .side-toggle,body.adm-dark .ab-arrow,body.adm-dark .ab-out{white-space:normal;overflow-wrap:anywhere;min-height:44px;max-width:40%}
body.adm-dark .appbar .ab-r{flex-wrap:wrap}
body.adm-dark .appbar .ab-r>*{min-width:0;max-width:100%}
body.adm-dark .ai-fab{flex-wrap:wrap;white-space:normal;overflow-wrap:anywhere;justify-content:center}
body.adm-dark .eb{flex-wrap:wrap}
body.adm-dark .eb b small{white-space:normal;overflow-wrap:anywhere}
body.adm-dark .eb .mv,body.adm-dark .row-move .mv,body.adm-dark table.t td .btn{white-space:normal;overflow-wrap:anywhere}
body.adm-dark table.t td.n{white-space:normal}
body.adm-dark .main{min-width:0;overflow-wrap:anywhere}
/* 장문 스트레스 — 위쪽 막대는 어떤 폭에서도 줄바꿈으로 버틴다 (긴 상호 · 긴 버튼 라벨) */
body.adm-dark .appbar{flex-wrap:wrap;height:auto;min-height:56px;row-gap:4px}
body.adm-dark .appbar>*{min-width:0;max-width:100%}
body.adm-dark .appbar .ab-r{min-width:0;max-width:100%;flex-wrap:wrap}
body.adm-dark .appbar .btn,body.adm-dark .appbar .ab-who,body.adm-dark .appbar .badge,body.adm-dark .appbar .ab-count,body.adm-dark .appbar .ab-brand{white-space:normal;overflow-wrap:anywhere;min-width:0}
body.adm-dark .appbar .ab-shop{min-width:0;max-width:100%;display:flex;align-items:center;gap:6px}
body.adm-dark .appbar .ab-shop select{min-width:0;max-width:100%}
body.adm-dark .side-toggle{height:auto;width:auto;min-width:44px}
body.adm-dark .listfilter{flex-wrap:wrap}
body.adm-dark .listfilter .btn,body.adm-dark .listfilter button{white-space:normal;overflow-wrap:anywhere;min-width:0}
body.adm-dark .row-move{flex-wrap:wrap;min-width:0;max-width:100%}body.adm-dark .row-move .mv{max-width:100%;word-break:break-all}
body.adm-dark .row-move .mv{flex:1 1 auto;min-width:44px}
@media(max-width:430px){ body.adm-dark .row-move{flex-direction:column} body.adm-dark .row-move .mv{width:100%} }
/* 항목 이동 버튼 — 좁은 칸에서는 세로로 쌓고 칸 폭을 44 이상으로 */
body.adm-dark .row-move{display:grid;grid-template-columns:1fr;gap:3px;min-width:0;max-width:100%}
body.adm-dark .row-move .mv{width:100%;min-width:0;min-height:44px;flex:none}
body.adm-dark table.t td.n{min-width:52px}
/* 항목 표 — 이동 버튼 칸은 44px 버튼이 들어갈 폭을 고정 배치에서도 확보한다 */
body.adm-dark table.t.item-list th:first-child,body.adm-dark table.t.item-list td.n:first-child{width:72px;min-width:72px}   /* 항목 표만 — 다른 표의 첫 칸(이름 · 항목)이 72px 로 눌리던 문제 */
body.adm-dark .row-move .mv{min-width:44px}
@media(max-width:430px){ body.adm-dark table.t.item-list th:first-child,body.adm-dark table.t.item-list td.n:first-child{width:58px;min-width:58px} body.adm-dark table.t.item-list td.n:first-child{padding-left:6px;padding-right:6px} }

/* ── 글꼴 통일(2026-09-07): 제목 · 숫자 · 본문 모두 Pretendard. 제목은 굵기로 구분, 숫자는 tabular-nums ── */
body.adm-dark h1,body.adm-dark h2,body.adm-dark h3,body.adm-dark h4,body.adm-dark .main-h h2,body.adm-dark .card h2,body.adm-dark .opmodal-h b,body.wz-dark h1,body.wz-dark h2,body.wz-dark h3{font-weight:700;letter-spacing:-.02em}
body.adm-dark .stat .b .v,body.adm-dark .mono,body.adm-dark td.n,body.adm-dark .kp .v{font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
body.adm-dark code,body.adm-dark pre{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
/* 숨 쉴 여백 — 요일표 · 체크 목록 · 발견 질문 · 스위치 줄 */
body.adm-dark .aeo-hours{gap:10px 16px}
body.adm-dark .aeo-hours-row{padding:8px 10px}
body.adm-dark .aeo-checks{gap:10px 14px}
body.adm-dark .aeo-disc{margin-bottom:14px;padding:12px 14px}
body.adm-dark .eb{margin-bottom:9px}
body.adm-dark .card{margin-bottom:18px}
body.adm-dark .fld{margin-bottom:15px}
body.adm-dark .tip{margin-bottom:18px;line-height:1.75}

/* ── 표 칸 배분(2026-09-07) — 넓은 화면에서 첫 칸이 72px 로 눌리던 규칙은 .item-list 로 좁혔고(위), 손님 명단은 colgroup 을 % 로 바꿨다.
   머리글 nowrap · 숫자 칸 width:1% 같은 일괄 규칙은 열이 많은 표(항목 10열 · 쿠폰 7열)를 카드 밖으로 밀어내 쓰지 않는다. */
th.ck,td.ck{width:44px;min-width:44px}   /* 44px 체크박스가 34px 칸에서 잘리던 것 */
body.adm-dark .pg{min-width:44px}
body.adm-dark table.t td.n{overflow-wrap:anywhere}   /* 가린 이름(황**) 처럼 띄어쓰기 없는 값이 좁은 칸을 넘지 않게 */
/* 손님 명단 · 결제 내역 표 — 860/880px 최소 폭이 768~1199 에서 카드를 넘겼다. 좁을 때는 고정 배치 + 줄바꿈, 1200px 부터 원래대로 */
body.adm-dark .customer-table,body.adm-dark .pay-history{min-width:0;table-layout:fixed}
body.adm-dark .pay-history td:last-child{white-space:normal}
@media(min-width:1200px){
 body.adm-dark .customer-table{min-width:860px}
 body.adm-dark .pay-history{min-width:880px;table-layout:auto}
 body.adm-dark .pay-history td:last-child{white-space:nowrap}
}
/* flex 라벨 안 체크박스가 36px 로 눌리던 것(담당자 휴무 요일) — 44 를 고정 */
body.adm-dark label>input[type=checkbox],body.adm-dark label>input[type=radio]{flex:0 0 44px;min-width:44px;width:44px}
/* 안내 상자 링크 — 44px 상자가 음수 여백으로 앞 줄 글 위에 겹치던 것: 줄 상자를 키우는 쪽으로 */
body.adm-dark .tip a{display:inline-flex;align-items:center;min-height:44px;margin:0;padding:0 6px;vertical-align:middle}
/* 손님 후기 표 — 900px 최소 폭 · 버튼 nowrap 이 1199px 까지 카드를 넘겼다 */
body.adm-dark .customer-review-table{min-width:0!important}
body.adm-dark .customer-review-action .btn{white-space:normal;min-width:44px;overflow-wrap:anywhere}
body.adm-dark table.t td.n,body.adm-dark table.t th{overflow-wrap:anywhere;word-break:break-all}   /* 황** · 이름 처럼 짧아도 좁은 칸에서 넘치던 값 */
@media(min-width:1200px){
 body.adm-dark .customer-review-table{min-width:900px!important}
 body.adm-dark .customer-review-action .btn{white-space:nowrap}
 body.adm-dark table.t td.n,body.adm-dark table.t th{word-break:keep-all}
}
/* 손님 명단 열 폭 — 좁은 화면은 고정 배치 균등, 1200px 부터 역할별 폭 */
body.adm-dark .customer-table .memo-form{display:flex;flex-wrap:wrap;gap:5px;min-width:0}
body.adm-dark .customer-table .memo-form input[name=memo]{flex:1 1 90px;min-width:0;padding:6px;border:1px solid #DDE2EA;border-radius:6px;font-size:12.5px}
body.adm-dark .customer-table .memo-form .btn{min-width:44px;white-space:nowrap}
@media(min-width:1200px){
 body.adm-dark .customer-table col.cw-ck{width:44px}
 body.adm-dark .customer-table col.cw-tel{width:16%}
 body.adm-dark .customer-table col.cw-n{width:8%}
 body.adm-dark .customer-table col.cw-won{width:12%}
 body.adm-dark .customer-table col.cw-last{width:11%}
 body.adm-dark .customer-table col.cw-addr{width:18%}
 body.adm-dark .customer-table col.cw-act{width:12%}
 body.adm-dark .customer-table col.cw-memo{width:24%}
}
/* 스위치(.ed-sw)의 숨은 체크박스는 위 44px 고정 규칙에서 뺀다 — 상자 전체를 덮는 투명 입력이다 */
body.adm-dark .ed-sw>input[type=checkbox]{flex:none;width:100%;min-width:0}
/* 결제 링크 표 — 980px 최소 폭이 1199px 까지 카드를 넘겼다. 좁을 때는 고정 배치 + 줄바꿈 */
body.adm-dark .paylink-table{min-width:0!important}
body.adm-dark .paylink-table .paylink-address{flex-wrap:wrap}
body.adm-dark .paylink-table .paylink-address code{min-width:0;flex:1 1 100px;white-space:normal;overflow-wrap:anywhere;word-break:break-all;overflow:visible;text-overflow:clip}
body.adm-dark .paylink-table td .badge,body.adm-dark .paylink-table td.n{white-space:normal;overflow-wrap:anywhere}
@media(min-width:1200px){
 body.adm-dark .paylink-table{min-width:980px!important}
}
/* 결제 링크 표 — 관리 버튼 묶음은 좁으면 줄바꿈, 닫힌 팝업은 자리도 차지하지 않게 */
body.adm-dark .paylink-actions{flex-wrap:wrap;min-width:0;gap:4px}
body.adm-dark .paylink-actions .btn{min-width:44px}
body.adm-dark .opmodal:not(.on):not(.open):not([open]){visibility:hidden}
@media(min-width:1200px){ body.adm-dark .paylink-actions{flex-wrap:nowrap} }
/* 안내 글의 굵은 글은 글줄 안에 그대로 — inline-block 이면 두 줄로 꺾인 상자가 다음 굵은 글과 겹친다(320px) */
body.adm-dark .hint b,body.adm-dark .tip b{display:inline-block;max-width:100%;overflow-wrap:anywhere}   /* 짧은 굵은 글은 통째로 다음 줄로 — 긴 문장은 굵게 하지 않는다(pay.php) */
/* 블록 on/off 스위치 — 체크박스 라벨 44px 규칙이 스위치 라벨(40×23)에도 걸려 높이만 44 가 되어 동그란 공처럼 보였다.
   라벨은 44×44 터치 상자, 안의 트랙은 40×24 로 가운데 그린다(전 폭 공통). */
body.adm-dark .ed-sw{display:block;width:44px;height:44px;min-height:44px;padding:0;gap:0;flex:none}
body.adm-dark .ed-sw i{inset:10px 2px;border-radius:20px}
body.adm-dark .ed-sw i::after{top:3px;left:3px;width:17px;height:17px}
body.adm-dark .ed-sw.on i::after{transform:translateX(17px)}
/* ── 줄 정렬(2026-09-08, 사장님 화면) ──
   · 약관 동의 줄: 44px 체크박스와 글이 위·아래로 어긋나 보였다 → 가운데 정렬
   · 한 줄 폼(.flx)의 버튼이 입력칸보다 아래로 내려갔다 → 아래선 맞춤 · 높이 44
   · "이런 질문에 답할 수 있게 됩니다" 칩 줄이 아래 표에 붙어 있었다 → 아래 여백 */
body.adm-dark label.blockrow{align-items:center!important;gap:12px!important;min-height:44px}
body.adm-dark label.blockrow>span{min-width:0}
body.adm-dark label.blockrow .badge{vertical-align:middle}
body.adm-dark form.flx,body.adm-dark .flx{align-items:flex-end}
body.adm-dark .flx>.btn,body.adm-dark .flx>button.btn{min-height:44px;margin-bottom:0;align-self:flex-end}
body.adm-dark .flx>.fld{margin-bottom:0}
body.adm-dark .aeo-qchips{margin:0 0 16px}
body.adm-dark .aeo-qchips+*,body.adm-dark .card>.hint+table.t,body.adm-dark .card>p+table.t,body.adm-dark .card>.tip+table.t{margin-top:14px}
body.adm-dark .card>.hint+form,body.adm-dark .card>p+form{margin-top:14px}
/* 카드 제목 줄(밑선) 아래 여백 — 내용이 선에 붙어 있었다(숏폼 · 카드뉴스 등) */
body.adm-dark .card>h2,body.adm-dark .card>.card-h{margin-bottom:18px}
body.adm-dark .card>h2+*,body.adm-dark .card>.card-h+*{margin-top:0}
/* 짜임새 타일 — 실제 데모 화면 썸네일(assets/lay/*.png · bin/lay_thumbs.js). 색 막대만으로는 어떤 모양인지 감이 안 왔다(사장님 지적) */
body.adm-dark .stylepick{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:9px}
body.adm-dark .stylepick button{padding:6px 6px 8px;gap:6px;overflow:hidden}
body.adm-dark .stylepick button i.lt{width:100%;height:auto;aspect-ratio:39/44;background-size:100% auto;background-position:top center;background-repeat:no-repeat;background-color:#EEF0F4;border-radius:8px;border:1px solid var(--line)}
body.adm-dark .stylepick button.on i.lt{border-color:var(--brand);box-shadow:0 0 0 2px rgba(240,82,43,.25);background-color:#fff}
body.adm-dark .stylepick button:hover i.lt{background-position:center 30%}
body.adm-dark .stylepick button em{top:4px;right:4px}
@media(min-width:1401px){ body.adm-dark .stylepick{grid-template-columns:repeat(6,1fr)} }
/* 블록 목록의 ▲▼ — 세로 격자 대신 가로 한 쌍(항목 표의 row-move 규칙이 여기까지 걸렸다) */
body.adm-dark .eb .row-move{display:flex;flex-direction:row;gap:4px;width:auto;flex:none}
body.adm-dark .eb .row-move .mv{width:44px;min-width:44px;min-height:44px;flex:none}
/* 관리자 폼 — 항목 이름(label)도 44px 터치 상자 · 글은 아래 붙임(손님 화면과 같은 규칙) · 모든 select 44 */
body.adm-dark .fld label{display:flex;align-items:flex-end;min-height:44px;margin:0 0 6px;line-height:1.3}
body.adm-dark .fld label small,body.adm-dark .fld label .badge{margin-left:6px}
body.adm-dark .main select,body.adm-dark .main input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=file]){min-height:44px}
body.adm-dark .main input[type=file]{min-height:44px;padding:9px 0}
body.adm-dark table.t th,body.adm-dark table.t td{white-space:normal;overflow-wrap:anywhere}
/* 짜임새 타일 글자 — 6열(1440px~)에서 '링크 · 카드형' 이 잘렸다 → 줄바꿈 허용, 상자 overflow 는 썸네일에만 */
body.adm-dark .stylepick button{overflow:visible;white-space:normal;overflow-wrap:anywhere;word-break:keep-all;line-height:1.3}
body.adm-dark .stylepick button i.lt{overflow:hidden}
/* 굵은 글(b)이 줄을 넘어가며 다음 굵은 글과 상자가 겹치던 것 — 통째로 다음 줄로. 긴 문장은 굵게 쓰지 않는 게 원칙 */
body.adm-dark p b,body.adm-dark .hint b,body.adm-dark .tip b,body.adm-dark small b,body.adm-dark .card>div>b{display:inline-block;max-width:100%}
/* 숏폼 장면 편집 줄 — 좁은 화면은 한 열로 쌓고 항목 이름을 보인다(900px 아래에서 30px 열에 입력칸이 끼어 18px 로 눌렸다) */
body.adm-dark .cut-row{grid-template-columns:minmax(0,1fr)!important}
body.adm-dark .cut-row .n{grid-row:auto!important;padding-top:0}
body.adm-dark .cut-row.hd{display:none}
body.adm-dark .cut-field>span{display:block;font-size:12px;font-weight:700;color:var(--sub);margin-bottom:4px}
body.adm-dark .cut-row textarea,body.adm-dark .cut-row input{min-height:44px;min-width:0;width:100%}
@media(min-width:901px){
 body.adm-dark .cut-row{grid-template-columns:30px minmax(140px,1fr) minmax(170px,1.15fr) minmax(150px,.9fr) 70px!important;padding:0;border:0}
 body.adm-dark .cut-row.hd{display:grid}
 body.adm-dark .cut-field>span{display:none}
 body.adm-dark .cut-row .n{padding-top:9px}
}
/* 표 머리칸 — admin.css 의 nowrap 이 좁은 고정 배치에서 3px 로 눌린 칸을 잘랐다. 항목 · 값 두 칸 표는 머리칸 40% */
body.adm-dark table.t th{white-space:normal!important}
body.adm-dark table.t tr>th:first-child:nth-last-child(2){width:40%}
/* 폼 항목 이름은 어디서나 44px 터치 상자(.fld 밖의 label 도 — 심사 화면 .ks-fx 등) */
body.adm-dark .main form label:not(.ed-sw):not(.blockrow):not(:has(input)):not(:has(select)):not(:has(textarea)){display:flex;align-items:flex-end;min-height:44px;margin:0 0 6px;line-height:1.3}
/* 숏폼 — 재생 화면(270px) 옆 편집 칸이 좁은 화면에서 10px 로 눌렸다 → 아래로 내려가게 */
body.adm-dark .sh-wrap>.sh-play{flex:0 0 auto;width:100%;max-width:270px}
body.adm-dark .sh-wrap>:not(.sh-play){flex:1 1 280px;min-width:0}
body.adm-dark .ks-hint b{display:inline-block;max-width:100%}
body.adm-dark .sh-wrap>:not(.sh-play){flex-basis:560px}   /* 5열 장면 표(≈560px)가 들어갈 자리가 없으면 재생 화면 아래로 */
/* 블록 목록 줄 — 왼쪽에 작은 ▲▼(손잡이 자리), 글은 남는 폭 전부, 오른쪽에 링크 · 스위치. 글이 세로로 길게 꺾이던 것을 고침 */
body.adm-dark .eb.eb-ord{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px 12px;padding:8px 12px 8px 8px}
body.adm-dark .eb.eb-ord>b{min-width:0;display:block;overflow-wrap:anywhere}
body.adm-dark .eb.eb-ord>b small{display:block;white-space:normal;overflow-wrap:anywhere;margin-top:2px}
body.adm-dark .eb.eb-ord .eb-gr{width:44px;text-align:center;color:#C5CBD6}
body.adm-dark .eb.eb-ord .eb-mv{display:flex;flex-direction:row;gap:2px;width:auto;flex:none}
body.adm-dark .eb.eb-ord .eb-mv .mv{width:22px;min-width:22px;height:44px;min-height:44px;padding:0;border:0;border-radius:8px;background:transparent;color:#98A2B3;font-size:10px;line-height:1;display:grid;place-items:center}
body.adm-dark .eb.eb-ord .eb-mv .mv:hover{background:#F4F6FA;color:var(--ink)}
body.adm-dark .eb.eb-ord .eb-mv .mv:disabled{opacity:.25}
body.adm-dark .eb.eb-ord .eb-side{display:flex;align-items:center;gap:8px;flex:none;justify-content:flex-end}
@media(min-width:1024px){ body.adm-dark .eb.eb-ord .eb-mv .mv{width:24px;min-width:24px} }
/* 블록 ▲▼ — 눌리는 상자는 44 를 지키고(음수 여백으로 겹쳐) 보이는 크기는 작게 */
body.adm-dark .eb.eb-ord .eb-mv{gap:0;margin-left:-8px}
body.adm-dark .eb.eb-ord .eb-mv .mv{width:44px;min-width:44px;margin:0 -9px}
/* 폼 줄 간격 — 항목 이름 상자를 44 로 키우면서 줄 사이가 40px 넘게 벌어졌다(사장님 지적). 항목 자체 여백은 0, 이름 상자 위 여백이 간격을 맡는다 */
body.adm-dark .fld{margin-bottom:0}
body.adm-dark .fld label{min-height:40px;margin:0 0 4px}
body.adm-dark .fld+.fld,body.adm-dark .row2+.fld,body.adm-dark .fld+.row2{margin-top:2px}
body.adm-dark .card>form>.btn,body.adm-dark .card>form>button.btn,body.adm-dark form .fld+.btn{margin-top:14px}
/* 블록 ▲▼ — 세로로 쌓은 작은 네모 버튼(보이는 상자 30px, 누르는 상자 44px), 글은 그만큼 더 넓게(사장님 지적) */
body.adm-dark .eb.eb-ord{grid-template-columns:44px minmax(0,1fr) auto;padding:6px 12px 6px 6px;gap:8px 12px}
body.adm-dark .eb.eb-ord .eb-gr{width:44px}
body.adm-dark .eb.eb-ord .eb-mv{flex-direction:column;gap:0;margin:0;width:44px}
body.adm-dark .eb.eb-ord .eb-mv .mv{position:relative;z-index:0;width:44px;min-width:44px;height:44px;min-height:44px;margin:-5px 0;padding:0;border:0;background:transparent;color:#5A6478;font-size:12px;line-height:1;display:grid;place-items:center;border-radius:0}
body.adm-dark .eb.eb-ord .eb-mv .mv::before{content:"";position:absolute;inset:7px;border:1px solid #D3D9E2;border-radius:7px;background:#fff;z-index:-1}
body.adm-dark .eb.eb-ord .eb-mv .mv:hover{color:var(--ink)}body.adm-dark .eb.eb-ord .eb-mv .mv:hover::before{border-color:var(--ink);background:#F4F6FA}
body.adm-dark .eb.eb-ord .eb-mv .mv:disabled{opacity:.3}
body.adm-dark .eb.eb-ord>b{padding:4px 0}
body.adm-dark .eb.eb-ord .eb-mv .mv{margin:0}   /* 겹치면 상자가 잘림으로 잡힌다 — 44 두 개를 그대로 쌓는다 */
body.adm-dark .eb.eb-ord .eb-mv .mv::before{inset:8px}
/* 폼 줄 간격 — 44px 항목 이름 상자는 터치 화면(태블릿 포함 · 1023px 이하)에만. PC 는 원래 간격(이름 6px 아래 · 항목 12px)으로 */
@media(min-width:1024px){
 body.adm-dark .fld{margin-bottom:12px}
 body.adm-dark .fld label,body.adm-dark .main form label:not(.ed-sw):not(.blockrow):not(:has(input)):not(:has(select)):not(:has(textarea)){min-height:0;display:block;margin:0 0 6px;line-height:1.4}
 body.adm-dark .fld+.fld,body.adm-dark .row2+.fld,body.adm-dark .fld+.row2{margin-top:0}
 body.adm-dark .flx>.fld{margin-bottom:0}
}
/* ▲▼ 사이 간격 — 누르는 상자(44)는 그대로 두고 보이는 네모만 서로 가깝게(위 버튼은 아래로, 아래 버튼은 위로 붙인다) */
body.adm-dark .eb.eb-ord .eb-mv .mv:first-child::before{inset:9px 8px 2px}
body.adm-dark .eb.eb-ord .eb-mv .mv:last-child::before{inset:2px 8px 9px}
body.adm-dark .eb.eb-ord .eb-mv .mv:first-child{padding-top:7px}
body.adm-dark .eb.eb-ord .eb-mv .mv:last-child{padding-bottom:7px}

/* ── 예약 달력(2026-09-08) — 주: 요일 열 × 시간대 줄(넓게 64px · 좁게 34px), 월: 6×7 격자. 모바일 퍼스트 ── */
body.adm-dark .cal-bar{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;justify-content:space-between;margin-bottom:12px}
body.adm-dark .cal-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}body.adm-dark .cal-nav b{font-size:15px;min-width:0;overflow-wrap:anywhere}
body.adm-dark .cal-opts{display:flex;align-items:center;gap:8px;flex-wrap:wrap}body.adm-dark .cal-opts .sel{margin:0}
body.adm-dark .ce{display:flex;align-items:center;gap:5px;min-height:44px;padding:4px 8px;border-radius:8px;font-size:12px;line-height:1.3;text-decoration:none;color:var(--ink);background:#EEF1F6;border-left:3px solid #B8BFCB;min-width:0;overflow-wrap:anywhere;flex-wrap:wrap}
body.adm-dark .ce em{font-style:normal;font-family:var(--mono);font-size:11.5px;color:var(--sub);flex:none}
body.adm-dark .ce b{font-weight:700;min-width:0}body.adm-dark .ce small{flex:1 1 100%;color:var(--sub);font-size:12px}
body.adm-dark .ce.cs-new{background:var(--amber-soft,#FFF4E5);border-left-color:var(--amber,#B25E00)}
body.adm-dark .ce.cs-ok{background:#E9F6EE;border-left-color:#2E8B57}
body.adm-dark .ce.cs-done{background:#F1F3F6;border-left-color:#98A2B3;color:var(--sub)}
body.adm-dark .ce.cs-warn{background:#FDE8E7;border-left-color:#B42318}
body.adm-dark .ce.cs-off{background:#F5F6F8;border-left-color:#D3D9E2;color:var(--mut);text-decoration:line-through}
/* 주 — 좁은 화면은 요일이 세로로 쌓이고 빈 시간대는 감춘다 */
body.adm-dark .cal-week{display:grid;grid-template-columns:1fr;gap:10px}
body.adm-dark .cal-day{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;min-width:0}
body.adm-dark .cal-day.today{border-color:var(--brand)}body.adm-dark .cal-day.off .cd-h{background:#F7F7F5;color:var(--mut)}
body.adm-dark .cd-h{display:flex;align-items:baseline;gap:6px;padding:8px 10px;border-bottom:1px solid var(--line);background:#FAFBFD}
body.adm-dark .cd-h b{font-size:16px}body.adm-dark .cd-h span{font-size:12px;color:var(--sub)}
body.adm-dark .cal-day.today .cd-h b{color:var(--brand)}
body.adm-dark .cd-all{display:grid;gap:4px;padding:6px 8px;border-bottom:1px dashed var(--line)}
body.adm-dark .cd-slot{display:none;position:relative;padding:4px 6px 4px 34px;border-bottom:1px solid #F0F2F5;min-height:44px}
body.adm-dark .cd-slot.has{display:grid;gap:4px;align-content:start}
body.adm-dark .cd-slot i{position:absolute;left:8px;top:6px;font:600 11.5px var(--mono);color:var(--mut)}
body.adm-dark .cal-week.z-tight .ce{min-height:44px;padding:2px 6px}body.adm-dark .cal-week.z-tight .ce small{display:none}
@media(min-width:768px){
 body.adm-dark .cal-week{grid-template-columns:repeat(7,minmax(0,1fr));gap:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
 body.adm-dark .cal-day{border:0;border-right:1px solid var(--line);border-radius:0}body.adm-dark .cal-day:last-child{border-right:0}
 body.adm-dark .cal-day.today{box-shadow:inset 0 3px 0 var(--brand)}
 body.adm-dark .cd-slot{display:grid;gap:3px;align-content:start;min-height:64px;padding:18px 4px 4px 4px;border-bottom:1px solid #F0F2F5}
 body.adm-dark .cal-day:not(:first-child) .cd-slot i{display:none}
 body.adm-dark .cd-slot i{left:4px;top:3px}
 body.adm-dark .cal-week.z-tight .cd-slot{min-height:34px;padding-top:14px}
 body.adm-dark .cal-week.z-wide .ce{min-height:44px}
 body.adm-dark .cal-week.z-tight .ce{min-height:26px;font-size:11.5px;padding:2px 5px;flex-wrap:nowrap;overflow:hidden;text-overflow:ellipsis}
 body.adm-dark .cal-week.z-tight .ce b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 body.adm-dark .cd-all{min-height:30px}
}
/* 월 */
body.adm-dark .cal-month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
body.adm-dark .cm-h{background:#FAFBFD;text-align:center;font-size:12px;font-weight:700;color:var(--sub);padding:8px 0}
body.adm-dark .cm-c{background:#fff;min-height:64px;padding:4px;min-width:0}body.adm-dark .cm-c.dim{background:#FAFAFB}body.adm-dark .cm-c.dim .cm-d b{color:#C5CBD6}
body.adm-dark .cm-d{display:flex;align-items:center;justify-content:space-between;gap:4px;min-height:44px;padding:0 4px;text-decoration:none;color:var(--ink);border-radius:8px}
body.adm-dark .cm-d:hover{background:#F4F6FA}body.adm-dark .cm-c.today .cm-d b{background:var(--brand);color:#fff;border-radius:50%;width:26px;height:26px;display:grid;place-items:center}
body.adm-dark .cm-d em{font-style:normal;font:700 12px var(--mono);background:#EEF1F6;color:var(--sub);border-radius:10px;padding:1px 7px}
body.adm-dark .cm-l{display:none;gap:3px}
body.adm-dark .cm-more{font-size:12px;color:var(--brand);font-weight:700;text-decoration:none;display:inline-flex;align-items:center;min-height:44px;padding:0 6px}
@media(min-width:768px){ body.adm-dark .cm-c{min-height:120px}body.adm-dark .cm-l{display:grid}body.adm-dark .cm-l .ce{min-height:26px;padding:2px 6px;font-size:11.5px}body.adm-dark .cm-l .ce b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} }

/* ── 예약 일정 · 회차권(2026-09-08, 담아 클리닉 일정표 차용) ── */
body.adm-dark .cal-kpi{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:900px){ body.adm-dark .cal-kpi{grid-template-columns:repeat(5,minmax(0,1fr))} }
body.adm-dark .cal-all{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:8px 10px;margin-bottom:10px;border:1px dashed var(--line);border-radius:10px}
body.adm-dark .cal-all-l{font-size:12px;font-weight:700;color:var(--mut);flex:none}
body.adm-dark .cal-dayview{display:grid;grid-template-columns:56px minmax(0,1fr);border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
body.adm-dark .cal-axis{border-right:1px solid var(--line);background:#FAFBFD}
body.adm-dark .cal-hr{position:relative;border-bottom:1px solid #F0F2F5}body.adm-dark .cal-hr span{position:absolute;top:-8px;right:6px;font:600 11.5px var(--mono);color:var(--mut);background:#FAFBFD;padding:0 2px}
body.adm-dark .cal-hr:first-child span{top:2px}
body.adm-dark .cal-body{position:relative;min-width:0}
body.adm-dark .cal-line{position:absolute;left:0;right:0;border-top:1px solid #F0F2F5}
body.adm-dark .cal-body .ce{position:absolute;box-sizing:border-box;margin:1px 0 0 4px;overflow:hidden;align-items:flex-start;padding:4px 8px;box-shadow:0 1px 2px rgba(19,26,46,.06)}
body.adm-dark .cal-body .ce em{font-size:11.5px}
body.adm-dark .cal-now{position:absolute;left:0;right:0;border-top:2px solid #E5484D;z-index:2;pointer-events:none}
body.adm-dark .cal-now i{position:absolute;left:4px;top:-11px;background:#E5484D;color:#fff;font:700 11px var(--mono);padding:2px 7px;border-radius:10px;font-style:normal}
body.adm-dark .cd-h{text-decoration:none;color:inherit}
body.adm-dark .cal-week .cd-slot{min-height:44px}
body.adm-dark .cal-week.z-tight .ce{min-height:26px}
/* 회차권 카드 */
body.adm-dark .pass-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:640px){ body.adm-dark .pass-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(min-width:1200px){ body.adm-dark .pass-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media(min-width:1700px){ body.adm-dark .pass-grid{grid-template-columns:repeat(4,minmax(0,1fr))} }
body.adm-dark .pass-card{min-width:0;padding:16px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(145deg,#fff,#FBFBF8)}
body.adm-dark .pass-card.off{background:#FAFAFB}body.adm-dark .pass-card.off .pc-bal b{color:var(--mut)}
body.adm-dark .pc-h{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
body.adm-dark .pc-hist{margin-left:auto;min-height:44px;padding:0 8px;border:0;background:transparent;color:var(--brand);font:700 12.5px inherit;font-family:inherit;cursor:pointer}
body.adm-dark .pass-card h3{margin:10px 0 2px;font-size:15.5px;overflow-wrap:anywhere}
body.adm-dark .pass-card>p{margin:0;color:var(--mut);font-size:12.5px;overflow-wrap:anywhere}
body.adm-dark .pc-bal{display:flex;align-items:baseline;gap:6px;margin-top:14px}body.adm-dark .pc-bal b{font:700 28px var(--mono);color:var(--brand);font-variant-numeric:tabular-nums}body.adm-dark .pc-bal span{font-size:12.5px;color:var(--mut)}
body.adm-dark .pc-bar{height:7px;margin:7px 0 12px;border-radius:99px;background:#EEF1F6;overflow:hidden}body.adm-dark .pc-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--brand),#F9A07A)}
body.adm-dark .pass-card dl{margin:0 0 12px}body.adm-dark .pass-card dl>div{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid #F0F2F5;font-size:12.5px}
body.adm-dark .pass-card dt{color:var(--mut)}body.adm-dark .pass-card dd{margin:0;font-weight:700}
body.adm-dark .pc-act{display:flex;gap:6px;flex-wrap:wrap}
body.adm-dark .pc-log{margin-top:12px;border-top:1px dashed var(--line);padding-top:8px;display:grid;gap:4px}
body.adm-dark .pc-log>div{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:center;font-size:12.5px;padding:6px 0;border-bottom:1px solid #F4F6FA}
body.adm-dark .pc-log time{font:600 11.5px var(--mono);color:var(--mut)}body.adm-dark .pc-log em{font-style:normal;font:700 12px var(--mono);color:var(--brand)}body.adm-dark .pc-log small{grid-column:1/-1;color:var(--sub)}
body.adm-dark .pc-log[hidden]{display:none}   /* display:grid 가 hidden 속성을 이겨 이력이 항상 펼쳐져 보였다 */
/* 일정표 검사 보정 — 시각 글씨 12px 하한, ‹ › 44px, 현재 시각 선 상자 안에 라벨 */
body.adm-dark .cal-hr span,body.adm-dark .cd-slot i,body.adm-dark .ce em,body.adm-dark .cm-d em,body.adm-dark .cal-body .ce em{font-size:12px}
body.adm-dark .cal-nav .btn.sm{min-width:44px;min-height:44px;padding:0 12px}
body.adm-dark .cal-now{height:24px;margin-top:-12px;border-top:0;overflow:visible}
body.adm-dark .cal-now::after{content:"";position:absolute;left:0;right:0;top:11px;border-top:2px solid #E5484D}
body.adm-dark .cal-now i{top:0;height:24px;line-height:20px;font-size:12px;box-sizing:border-box}
/* 월간 — 559px 이하에서는 7칸(칸당 40px 미만)이 안 되니 예약 있는 날만 한 줄씩. 560px 부터 7열 격자 */
body.adm-dark .cal-month{grid-template-columns:1fr;gap:1px}
body.adm-dark .cm-h{display:none}
body.adm-dark .cm-c:not(.has){display:none}
body.adm-dark .cm-c{min-height:0;padding:6px 10px}
body.adm-dark .cm-d{justify-content:flex-start;gap:10px;min-width:44px}
body.adm-dark .cm-d b{min-width:24px}
body.adm-dark .cm-full{font-size:12.5px;color:var(--sub);flex:1;min-width:0}
body.adm-dark .cm-l{display:grid;gap:3px;padding-left:34px}
@media(min-width:560px){
 body.adm-dark .cal-month{grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}
 body.adm-dark .cm-h{display:block}
 body.adm-dark .cm-c:not(.has){display:block}
 body.adm-dark .cm-c{min-height:64px;padding:4px}
 body.adm-dark .cm-d{justify-content:space-between;gap:4px}
 body.adm-dark .cm-full{display:none}
 body.adm-dark .cm-l{display:none;padding-left:0}
}
@media(min-width:768px){ body.adm-dark .cm-l{display:grid} }
body.adm-dark .cm-l .ce,body.adm-dark .cal-week.z-tight .ce,body.adm-dark .cm-l .ce b{font-size:12px}   /* 12px 하한 */

/* 진열 템플릿 타일(2026-09-08) — 흉내 그림 대신 데모 쇼핑몰 실제 화면. 사진 위 · 글 아래 세로 카드 */
body.adm-dark .tplgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media(min-width:900px){ body.adm-dark .tplgrid{grid-template-columns:repeat(4,minmax(0,1fr))} }
body.adm-dark .tplcard{display:flex;flex-direction:column;padding:0;overflow:hidden;min-width:0;cursor:pointer}
body.adm-dark .tplshot.real{display:block;width:100%;aspect-ratio:39/40;padding:0;gap:0;background:#EEF0F4 top center/100% auto no-repeat;border-bottom:1px solid var(--line);border-radius:0}
body.adm-dark .tplcard:hover .tplshot.real{background-position:center 30%}
body.adm-dark .tplmeta{padding:12px 14px 14px;min-width:0}
body.adm-dark .tplnm{font-weight:800;font-size:14.5px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
body.adm-dark .tplnm em{font-style:normal;font-size:12px;font-weight:800;color:#fff;background:var(--brand);border-radius:10px;padding:2px 8px}
body.adm-dark .tplmeta p{margin:6px 0 8px;font-size:12.5px;line-height:1.6;color:var(--sub);overflow-wrap:anywhere}
body.adm-dark .tplmeta small{font-size:12px;color:var(--mut);border-top:1px solid var(--line);padding-top:8px;display:block}
/* 쇼핑몰 설정 두 판(.split2) — 오른쪽 표가 넓어 왼쪽 판이 65px 로 눌리고 저장 버튼이 잘렸다 → 반반, 각 판 min-width 0 */
body.adm-dark .split2{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
body.adm-dark .split2>.l,body.adm-dark .split2>.r{flex:1 1 320px;min-width:0;max-width:100%}
body.adm-dark .split2 table.t{table-layout:fixed}
/* 카테고리 표 — 좁을 땐 균등, 768px 부터 상품 수 80 · 관리 176 */
@media(min-width:768px){ body.adm-dark .split2 col.cw-cnt{width:80px} body.adm-dark .split2 col.cw-act{width:176px} }
/* 카테고리 관리 칸 — 버튼 둘이 한 줄에 안 들어가는 폭에서는 줄바꿈 */
body.adm-dark .split2 table.t td:last-child{white-space:normal}
body.adm-dark .split2 table.t td:last-child>form{display:inline-flex;margin:2px 4px 2px 0}
@media(min-width:1024px){ body.adm-dark .split2 col.cw-act{width:200px} }
body.adm-dark .split2 table.t td:last-child:has(form){min-width:0}   /* 118px 최소 폭이 고정 배치 3열(320px)에서 칸을 넘겼다 */
body.adm-dark .split2 table.t td:last-child>form .btn{min-width:0;padding-left:8px;padding-right:8px}
@media(min-width:560px){ body.adm-dark .split2 table.t td:last-child>form .btn{min-width:44px} }
/* 559px 이하: 카테고리 관리 버튼은 세로로 쌓고(44px 유지), 상품 수 열은 감춘다 */
body.adm-dark .split2 table.t td:last-child>form .btn{min-width:44px;padding-left:12px;padding-right:12px}
body.adm-dark .split2 table.t td:last-child>form{display:block;margin:0 0 4px}
body.adm-dark .split2 table.t td:last-child>form .btn{width:100%}
body.adm-dark .split2 table.t th:nth-child(2),body.adm-dark .split2 table.t td:nth-child(2),body.adm-dark .split2 col.cw-cnt{display:none}
@media(min-width:560px){   /* 모바일 퍼스트 — 560px 부터 버튼 한 줄 · 상품 수 열 표시 */
 body.adm-dark .split2 table.t td:last-child>form{display:inline-flex;margin:2px 4px 2px 0}
 body.adm-dark .split2 table.t td:last-child>form .btn{width:auto}
 body.adm-dark .split2 table.t th:nth-child(2),body.adm-dark .split2 table.t td:nth-child(2){display:table-cell}
 body.adm-dark .split2 col.cw-cnt{display:table-column}
}
/* 이력 보기 — 글자 링크가 아니라 버튼 모양(사장님 요청) */
body.adm-dark .pc-hist{margin-left:auto;min-height:44px;padding:0 12px;border:1px solid var(--line);background:#fff;color:var(--sub);font:700 12.5px inherit;font-family:inherit;border-radius:9px;cursor:pointer}
body.adm-dark .pc-hist:hover{border-color:var(--ink);color:var(--ink)}
@media(min-width:1024px){ body.adm-dark .pc-hist{min-height:36px} }

/* 상품 · 프로그램 목록 — 사진 크게(72px) · 눌러서 확대, 순서 ▲▼ 는 홈페이지 수정과 같은 네모 버튼 */
body.adm-dark .item-mini{width:72px;height:72px;border-radius:12px;overflow:hidden;background:#F3F5F8;display:grid;place-items:center;border:1px solid var(--line);padding:0;cursor:zoom-in;font:inherit;color:var(--mut);font-size:12px}
body.adm-dark .item-mini.none{cursor:default}
body.adm-dark .item-mini img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .15s ease}
body.adm-dark .item-mini:hover img{transform:scale(1.06)}
body.adm-dark table.t.item-list th:first-child,body.adm-dark table.t.item-list td.n:first-child{width:64px;min-width:64px}
body.adm-dark .item-list .row-move{display:flex;flex-direction:column;gap:0;width:44px;margin:4px 0 0;max-width:none}
body.adm-dark .item-list .row-move form{margin:0}
body.adm-dark .item-list .row-move .mv{position:relative;z-index:0;width:44px;min-width:44px;height:44px;min-height:44px;margin:0;padding:0;border:0;background:transparent;color:#5A6478;font-size:12px;line-height:1;display:grid;place-items:center;border-radius:0}
body.adm-dark .item-list .row-move .mv::before{content:"";position:absolute;inset:8px;border:1px solid #D3D9E2;border-radius:7px;background:#fff;z-index:-1}
body.adm-dark .item-list .row-move form:first-child .mv::before{inset:9px 8px 2px}body.adm-dark .item-list .row-move form:first-child .mv{padding-top:7px}
body.adm-dark .item-list .row-move form:last-child .mv::before{inset:2px 8px 9px}body.adm-dark .item-list .row-move form:last-child .mv{padding-bottom:7px}
body.adm-dark .item-list .row-move .mv:hover:not(:disabled){color:var(--ink);background:transparent}body.adm-dark .item-list .row-move .mv:hover:not(:disabled)::before{border-color:var(--ink);background:#F4F6FA}
body.adm-dark .item-list .row-move .mv:disabled{opacity:.3}
/* 사진 확대 */
body.adm-dark .img-zoom{position:fixed;inset:0;z-index:90;background:rgba(19,26,46,.72);display:flex;align-items:center;justify-content:center;padding:16px;cursor:zoom-out}
body.adm-dark .img-zoom[hidden]{display:none}
body.adm-dark .img-zoom figure{position:relative;margin:0;max-width:min(92vw,900px);max-height:92vh;display:flex;flex-direction:column;gap:8px;cursor:default}
body.adm-dark .img-zoom img{max-width:100%;max-height:82vh;object-fit:contain;border-radius:14px;background:#fff;display:block}
body.adm-dark .img-zoom figcaption{color:#fff;font-size:13.5px;text-align:center;overflow-wrap:anywhere}
body.adm-dark .img-zoom .iz-x{position:absolute;top:-6px;right:-6px;width:44px;height:44px;border:0;border-radius:50%;background:#fff;color:var(--ink);font-size:16px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.3)}
body.adm-dark .item-mini{width:100%;max-width:72px;height:auto;aspect-ratio:1}   /* 좁은 칸에서는 칸 폭에 맞춰 줄어든다 */
body.adm-dark table.t.item-list td:has(.item-mini){min-width:0}
/* 두 판 중 오른쪽이 미리보기(전화기)면 폭을 내용대로 — 반반으로 나누자 프로그램 표가 눌렸다 */
body.adm-dark .split2>.r:has(.phone),body.adm-dark .split2>.r:has(.phone-tag),body.adm-dark .split2>.r:has(iframe){flex:0 0 auto;max-width:380px}
/* 표가 든 왼쪽 판은 680px 은 있어야 열이 안 눌린다 — 그보다 좁으면 미리보기(전화기)가 아래로 내려간다 */
body.adm-dark .split2>.l{flex:1 1 680px}
body.adm-dark .split2>.phone{flex:0 0 auto}
/* 한 줄 폼(.flx) 안의 도움말(.hint)은 칸 높이에 넣지 않는다 — 도움말이 붙은 칸만 높아져 버튼 아래선이 어긋났다(쿠폰 만들기) */
body.adm-dark .flx>.fld{position:relative}
body.adm-dark .flx>.fld>.hint,body.adm-dark .flx>.fld>div.hint,body.adm-dark .flx>.fld>small.hint{position:absolute;left:0;top:100%;margin:4px 0 0;white-space:nowrap}
body.adm-dark .flx:has(>.fld>.hint){padding-bottom:22px}
/* 한 줄 폼(.flx)이 여러 줄 이어질 때 줄 사이 간격 — 칸(.fld) 여백을 0 으로 두면서 줄 사이가 붙어 버렸다(결제 요청 만들기) */
body.adm-dark form .flx{margin-bottom:12px}
body.adm-dark form .flx:last-child,body.adm-dark .flx:has(>.btn:only-child){margin-bottom:0}
body.adm-dark form .flx+.fld,body.adm-dark form .fld+.flx{margin-top:0}
/* 공지 목록 — 관리 칸(수정 · 내리기 · 삭제)이 196px 을 넘어 표가 카드 밖으로 밀렸다 → 폭은 768px 부터, 버튼은 줄바꿈 허용 */
body.adm-dark .notice-table{table-layout:fixed;min-width:0!important}
body.adm-dark .notice-table td:last-child{white-space:normal}
body.adm-dark .notice-table td:last-child>form,body.adm-dark .notice-table td:last-child>a{display:inline-flex;margin:2px 4px 2px 0}
@media(min-width:768px){ body.adm-dark .notice-table col.nc-period{width:150px} body.adm-dark .notice-table col.nc-state{width:84px} body.adm-dark .notice-table col.nc-views{width:70px} body.adm-dark .notice-table col.nc-act{width:150px} }
@media(min-width:1200px){ body.adm-dark .notice-table col.nc-period{width:172px} body.adm-dark .notice-table col.nc-act{width:246px} }
/* ── 처음 설정 안내 (admin/guide.php) — 모바일 퍼스트, min-width 만 ── */
body.adm-dark .gd-hero{background:#fff;border:1px solid var(--line);border-radius:18px;padding:clamp(18px,3vw,28px);display:flex;flex-direction:column;gap:18px;margin-bottom:18px;box-shadow:var(--shadow)}
body.adm-dark .gd-hero-t{min-width:0}
body.adm-dark .gd-hero-t h3{margin:0 0 8px;font-size:clamp(18px,2.4vw,22px);font-weight:800;color:var(--ink);line-height:1.35;word-break:keep-all;overflow-wrap:anywhere}
body.adm-dark .gd-hero-t p{margin:0 0 14px;font-size:14px;line-height:1.8;color:var(--sub);word-break:keep-all;overflow-wrap:anywhere}
body.adm-dark .gd-hero-t .btn{max-width:100%;white-space:normal;text-align:left;line-height:1.4}
body.adm-dark .gd-allok{display:block;font-size:13.5px;color:var(--ok);font-weight:700;line-height:1.6;word-break:keep-all}
body.adm-dark .gd-hero-n{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
body.adm-dark .gd-ring{--p:0;width:92px;height:92px;border-radius:50%;flex:none;display:grid;place-items:center;text-align:center;
  background:conic-gradient(var(--brand) calc(var(--p)*1%),#EEF0F3 0);position:relative}
body.adm-dark .gd-ring::before{content:"";position:absolute;inset:8px;border-radius:50%;background:#fff}
body.adm-dark .gd-ring b,body.adm-dark .gd-ring span{position:relative;display:block}
body.adm-dark .gd-ring b{font-size:22px;font-weight:800;color:var(--ink);line-height:1}
body.adm-dark .gd-ring b small{font-size:12px;color:var(--mut);font-weight:700}
body.adm-dark .gd-ring span{font-size:12px;color:var(--mut);margin-top:3px}
body.adm-dark .gd-hero-n dl{margin:0;display:grid;grid-template-columns:auto auto;gap:4px 12px;font-size:13px;align-content:center}
body.adm-dark .gd-hero-n dt{color:var(--mut)}
body.adm-dark .gd-hero-n dd{margin:0;font-weight:800;color:var(--ink);text-align:right}
body.adm-dark .gd{display:flex;flex-direction:column;gap:16px;min-width:0}
body.adm-dark .gd-body{min-width:0;display:flex;flex-direction:column;gap:14px}
/* 목차: 좁은 화면에서는 가로 칩, 1024px 부터 왼쪽 고정 */
body.adm-dark .gd-toc{display:flex;flex-wrap:wrap;gap:6px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px}
body.adm-dark .gd-toc-g{flex:1 0 100%;font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--mut);margin:6px 0 2px}
body.adm-dark .gd-toc-g:first-child{margin-top:0}
body.adm-dark .gd-toc a{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:6px 10px;border:1px solid var(--line);border-radius:20px;font-size:12.5px;color:var(--sub);text-decoration:none;max-width:100%;min-width:0}
body.adm-dark .gd-toc a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.adm-dark .gd-toc a em{display:none}
body.adm-dark .gd-toc a i{width:8px;height:8px;border-radius:50%;flex:none;background:#D5D9DF}
body.adm-dark .gd-toc a.s-done i{background:var(--ok)}
body.adm-dark .gd-toc a.s-todo i{background:var(--brand)}
body.adm-dark .gd-toc a.s-part i{background:var(--teal)}
body.adm-dark .gd-toc a:hover{border-color:var(--brand);color:var(--ink)}
body.adm-dark .gd-gh{display:flex;flex-direction:column;gap:2px;margin:10px 0 0;padding:0 4px}
body.adm-dark .gd-gh b{font-size:clamp(16px,2vw,19px);font-weight:800;color:var(--ink)}
body.adm-dark .gd-gh span{font-size:13px;color:var(--mut)}
body.adm-dark .gd-topic{background:#fff;border:1px solid var(--line);border-radius:16px;padding:clamp(16px,2.5vw,24px);display:flex;flex-direction:column;gap:16px;min-width:0;scroll-margin-top:72px;box-shadow:var(--shadow)}
body.adm-dark .gd-topic.s-todo{border-color:#F4C9BA}
body.adm-dark .gd-th{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap}
body.adm-dark .gd-no{flex:none;width:36px;height:36px;border-radius:10px;background:var(--brand-soft);color:var(--brand-deep);font-weight:800;font-size:14px;display:grid;place-items:center}
body.adm-dark .gd-no:empty{display:none}
body.adm-dark .gd-tt{flex:1 1 200px;min-width:0}
body.adm-dark .gd-tt h3{margin:0;font-size:clamp(16px,2.2vw,19px);font-weight:800;color:var(--ink);line-height:1.35;word-break:keep-all;overflow-wrap:anywhere}
body.adm-dark .gd-tt p{margin:6px 0 0;font-size:12.5px;color:var(--sub);line-height:1.7;word-break:keep-all;overflow-wrap:anywhere}
body.adm-dark .gd-tt p .badge{vertical-align:middle;margin-right:4px}
body.adm-dark .gd-th>.btn{flex:none;white-space:nowrap}
body.adm-dark .gd-why,body.adm-dark .gd-need,body.adm-dark .gd-steps,body.adm-dark .gd-tips{min-width:0}
body.adm-dark .gd-why>b,body.adm-dark .gd-need>b,body.adm-dark .gd-steps>b,body.adm-dark .gd-tips>b{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.04em;color:var(--brand-deep);background:var(--brand-soft);border-radius:6px;padding:3px 8px;margin-bottom:8px}
body.adm-dark .gd-need>b{color:var(--teal);background:var(--teal-soft)}
body.adm-dark .gd-tips>b{color:#7A5B14;background:var(--amber-soft)}
body.adm-dark .gd-why p{margin:0;font-size:14px;line-height:1.8;color:var(--ink);word-break:keep-all;overflow-wrap:anywhere}
body.adm-dark .gd-need ul,body.adm-dark .gd-tips ul{margin:0;padding:0 0 0 18px;font-size:13.5px;line-height:1.75;color:var(--sub)}
body.adm-dark .gd-need li,body.adm-dark .gd-tips li{word-break:keep-all;overflow-wrap:anywhere;margin:2px 0}
body.adm-dark .gd-tips li b{color:var(--ink)}
body.adm-dark .gd-steps ol{margin:0;padding:0;list-style:none;counter-reset:gd;display:flex;flex-direction:column;gap:10px}
body.adm-dark .gd-steps li{counter-increment:gd;display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px 10px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#FBFCFD;min-width:0}
body.adm-dark .gd-steps li::before{content:counter(gd);grid-row:1/span 2;width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;font-size:13px;font-weight:800;display:grid;place-items:center}
body.adm-dark .gd-steps li strong{display:block;font-size:14px;font-weight:800;color:var(--ink);line-height:1.5;word-break:keep-all;overflow-wrap:anywhere;min-width:0}
body.adm-dark .gd-steps li span{display:block;font-size:13.5px;line-height:1.75;color:var(--sub);word-break:keep-all;overflow-wrap:anywhere;min-width:0}
body.adm-dark .gd-tf{display:flex;gap:8px;flex-wrap:wrap;padding-top:4px;border-top:1px dashed var(--line);padding-top:14px}
body.adm-dark .gd-tf .btn{max-width:100%;white-space:normal;text-align:center;line-height:1.4}
body.adm-dark .gd-end{background:var(--teal-soft);border:1px solid #C6E0E2;border-radius:16px;padding:clamp(16px,2.5vw,22px);color:#2E6167;font-size:14px;line-height:1.8;word-break:keep-all;overflow-wrap:anywhere}
body.adm-dark .gd-end b{display:block;font-size:15px;margin-bottom:6px}
body.adm-dark .gd-end p{margin:0}
body.adm-dark .gd-end a{color:inherit;font-weight:800;text-decoration:underline;text-underline-offset:2px}
body.adm-dark .help-link{white-space:nowrap}
@media(min-width:768px){
  body.adm-dark .gd-hero{flex-direction:row;align-items:center;justify-content:space-between}
  body.adm-dark .gd-hero-t{flex:1 1 0}
  body.adm-dark .gd-hero-n{flex:none}
}
@media(min-width:1024px){
  body.adm-dark .gd{flex-direction:row;align-items:flex-start}
  /* 세로 배치에서 flex-wrap 이 남아 있으면 높이가 넘칠 때 옆 열로 흘러 가로 스크롤이 생긴다 → nowrap · 세로만 스크롤 */
  /* 사장님 요청: 목차 안에 스크롤을 두지 말고 아래로 쭉 흐르게 — 고정(sticky) · 최대 높이 없음 */
  body.adm-dark .gd-toc{flex:0 0 250px;align-self:flex-start;flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:2px;padding:12px 10px;overflow:visible}
  body.adm-dark .gd-toc a{flex:none}
  body.adm-dark .gd-toc-g{margin:10px 6px 4px}
  body.adm-dark .gd-toc a{border:0;border-radius:9px;padding:8px 8px;min-height:40px;font-size:13px}
  body.adm-dark .gd-toc a span{flex:1 1 auto;white-space:normal}
  body.adm-dark .gd-toc a em{display:inline;font-style:normal;font-size:12px;color:var(--mut);flex:none}
  body.adm-dark .gd-toc a:hover{background:var(--bg)}
  body.adm-dark .gd-body{flex:1 1 0;min-width:0}
}
/* ── 왼쪽 메뉴 약식 표시(사장님 요청 2026-09-07): PC 에서는 아이콘 레일(64px)로 접어 오른쪽 화면을 넓게 쓰고,
   마우스를 올리거나 키보드 초점이 들어오면 원래 폭(236px)으로 펼친다. 펼칠 때 본문을 밀지 않도록 음수 여백으로 겹친다. ── */
@media(min-width:961px){
  body.adm-dark .side{
    width:64px; padding:12px 8px; overflow-x:hidden; overflow-y:auto;
    transition:width .18s ease, box-shadow .18s ease; z-index:55; margin-right:0;
  }
  body.adm-dark .side:hover,body.adm-dark .side:focus-within{
    width:236px; padding:16px 12px; margin-right:-172px;           /* 236 - 64 = 172 → 본문 폭은 그대로 */
    box-shadow:18px 0 40px rgba(49,53,47,.14); border-right-color:var(--line);
  }
  /* 접힌 상태: 글자는 숨기고 아이콘만 가운데 */
  body.adm-dark .side>a{justify-content:center;padding:11px 0;position:relative;min-height:44px}
  body.adm-dark .side>a>span,body.adm-dark .side .grp,body.adm-dark .side-shop>div,body.adm-dark .side-account{display:none}
  body.adm-dark .side>a .nav-ico{font-size:17px;width:auto}
  body.adm-dark .side>a .nav-dot{position:absolute;top:8px;right:10px}
  body.adm-dark .side-shop{justify-content:center;padding:6px 0 10px;margin-bottom:6px}
  body.adm-dark .side>a+a{margin-top:2px}
  body.adm-dark .side .grp+a::before{                                /* 묶음 사이를 가는 선으로 표시 */
    content:""; position:absolute; top:-5px; left:14px; right:14px; height:1px; background:var(--line);
  }
  /* 펼친 상태: 원래 모양으로 */
  body.adm-dark .side:hover>a,body.adm-dark .side:focus-within>a{justify-content:flex-start;padding:9px 11px}
  body.adm-dark .side:hover>a>span,body.adm-dark .side:focus-within>a>span,
  body.adm-dark .side:hover .grp,body.adm-dark .side:focus-within .grp{display:block}
  body.adm-dark .side:hover .side-shop>div,body.adm-dark .side:focus-within .side-shop>div{display:block}
  body.adm-dark .side:hover .side-account,body.adm-dark .side:focus-within .side-account{display:flex}
  body.adm-dark .side:hover>a .nav-ico,body.adm-dark .side:focus-within>a .nav-ico{font-size:12.5px;width:16px}
  body.adm-dark .side:hover>a .nav-dot,body.adm-dark .side:focus-within>a .nav-dot{position:static}
  body.adm-dark .side:hover .side-shop,body.adm-dark .side:focus-within .side-shop{justify-content:flex-start;padding:0 0 12px;margin-bottom:0}
  body.adm-dark .side:hover .grp+a::before,body.adm-dark .side:focus-within .grp+a::before{display:none}
  body.adm-dark .side>a+a{margin-top:2px}
}

/* ── 홍보하기(카드뉴스) 화면 보정 (2026-09-07 검사에서 잡힌 것) ── */
body.adm-dark .ps-panel input[type=range]{min-height:44px;margin:0;max-width:100%;box-sizing:border-box}   /* 터치 44 · .fld 를 4px 넘던 기본 여백 */
body.adm-dark .ps-panel .fld{min-width:0}
body.adm-dark .sl .bt button{min-height:44px;padding:8px 14px}                                                 /* PNG 저장 단추 34 → 44 */
body.adm-dark .acstrip{flex-wrap:wrap;overflow:visible}                                                        /* 가로 스크롤 띠는 화면 밖으로 넘친다 → 줄바꿈 */
body.adm-dark .acstrip .ac{min-width:0;flex:1 1 132px;max-width:100%}
body.adm-dark .acstrip .ac b,body.adm-dark .acstrip .ac small{overflow-wrap:anywhere;word-break:keep-all}

/* ── 사이드바 SVG 아이콘 크기 · 색 ── */
body.adm-dark .side>a .nav-ico{width:20px;height:20px;display:grid;place-items:center;color:var(--mut)}
body.adm-dark .side>a .nav-ico svg{width:18px;height:18px;display:block}
body.adm-dark .side>a:hover .nav-ico{color:var(--ink)}
body.adm-dark .side>a.on .nav-ico{color:var(--brand)}
@media(min-width:961px){
  body.adm-dark .side>a .nav-ico{width:44px;height:40px;border-radius:12px;font-size:17px}
  body.adm-dark .side>a .nav-ico svg{width:22px;height:22px}
  body.adm-dark .side>a{padding:2px 0}
  body.adm-dark .side>a:hover .nav-ico{background:var(--bg)}
  body.adm-dark .side>a.on .nav-ico{background:var(--brand-soft)}
  body.adm-dark .side>a.on{background:transparent}
  /* 펼치면 원래 크기로 */
  body.adm-dark .side:hover>a .nav-ico,body.adm-dark .side:focus-within>a .nav-ico{width:20px;height:20px;border-radius:0;background:transparent;font-size:12.5px}
  body.adm-dark .side:hover>a .nav-ico svg,body.adm-dark .side:focus-within>a .nav-ico svg{width:18px;height:18px}
  body.adm-dark .side:hover>a,body.adm-dark .side:focus-within>a{padding:9px 11px}
  body.adm-dark .side:hover>a.on,body.adm-dark .side:focus-within>a.on{background:var(--brand-soft)}
}

/* 간편 모드(045 §2-2 고령층): 본문 18px 이상 · 버튼 56px 이상 · 메뉴 계층 없음. 기능은 그대로, 노출만 */
body.ui-simple{font-size:18px}
body.ui-simple .wrap{font-size:18px;line-height:1.7}
body.ui-simple .side a{min-height:56px;font-size:17px}
body.ui-simple .side .grp{font-size:14px}
body.ui-simple .btn,body.ui-simple button.btn,body.ui-simple .card form button,body.ui-simple .flx>.btn{min-height:56px;font-size:17px;padding-left:20px;padding-right:20px}
body.ui-simple .btn.sm{min-height:48px;font-size:16px}
body.ui-simple .card h2{font-size:20px}
body.ui-simple .fld label,body.ui-simple .ks-fx label{font-size:17px}
body.ui-simple .fld input,body.ui-simple .fld select,body.ui-simple .fld textarea{min-height:56px;font-size:18px}
body.ui-simple .tip,body.ui-simple .hint,body.ui-simple p{font-size:16px}
body.ui-simple .stat .l{font-size:15px}body.ui-simple .stat .v{font-size:32px}
body.ui-simple .ai-fab{display:none}   /* 간편 모드에서는 떠다니는 버튼을 숨겨 한 화면에 시선을 하나만 */
.side-adv{margin:14px 12px 4px;padding:14px;border:1px dashed rgba(255,255,255,.25);border-radius:14px;display:grid;gap:8px}
.side-adv button{min-height:48px;border:0;border-radius:12px;background:rgba(255,255,255,.14);color:#fff;font:inherit;font-size:15px;font-weight:800;cursor:pointer}
.side-adv small{font-size:12px;line-height:1.6;color:rgba(255,255,255,.65)}
.ob-welcome a{font-weight:800;text-decoration:underline;display:inline-flex;align-items:center;min-height:44px}
/* 관리자 미리보기 폰(안쪽 320px)은 뷰포트 기준 미디어쿼리(≤360)가 안 걸려 달력 칸이 34px 로 눌렸다 — 손님 화면의 좁은 폭 규칙을 폰 안에서도 그대로 */
.phone .site .cal{margin-left:calc(-1*var(--pad) + 2px);margin-right:calc(-1*var(--pad) + 2px);gap:0}
/* 관리자 미리보기 폰은 같은 도메인 iframe(/slug?preview=1) — 손님 화면이 실제 손전화 폭(320px)으로 그려지고 관리자 CSS 와 섞이지 않는다 */
.phone iframe{display:block;width:100%;height:100%;border:0;background:#fff}

/* 음성 입력 단추 · 확인 상자 (§6) — 결과는 반드시 글로 보여주고 확인받는다 */
.vc-wrap{margin-top:6px;display:grid;gap:8px}
.vc-btn{justify-self:start;min-height:44px;padding:0 14px;border:1px solid #DDE2EA;border-radius:12px;background:#fff;font:inherit;font-size:13.5px;font-weight:700;color:#344054;cursor:pointer}
.vc-btn:hover{border-color:var(--brand,#F0522B);color:var(--brand,#F0522B)}
.vc-box{border:1px solid #E3E8EF;border-radius:14px;padding:12px 14px;background:#FAFBFD;display:grid;gap:10px;min-width:0}
.vc-msg{font-size:14px;line-height:1.7;display:grid;gap:4px;overflow-wrap:anywhere}.vc-msg b{font-size:16px}.vc-msg small{color:#8A94A5;display:block}.vc-heard{color:#667085;font-size:13px}
.vc-act{display:flex;gap:8px;flex-wrap:wrap}.vc-act button{min-height:44px;padding:0 14px;border-radius:12px;border:1px solid #DDE2EA;background:#fff;font:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.vc-act .vc-p{background:var(--brand,#F0522B);border-color:var(--brand,#F0522B);color:#fff}
body.ui-simple .vc-btn,body.ui-simple .vc-act button{min-height:56px;font-size:16px}
.ocr-tip{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.ocr-tip .btn{margin-left:auto}
/* ▲▼ 네모 단추는 기호 하나만 담는다 — 긴 글이 들어오면 자르고 말줄임(장문 검사) */
.row-move button.mv,.row-move .mv{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
