/* ══════════════════════════════════════════════════════════════════════
   원고도우미 디자인2 — 「1안 토스 소프트」 운영 반영 (2026-09-17, WONGO-V391-UPGRADE-20260917)
   대표 선택: 시안 3안 중 1안. 기준 = 눈이 편하고 조화롭게. 기능·입력칸·배치 순서는 그대로, 보이는 것만 바뀜.
   출처: 인수인계/시안/WONGO-DESIGN-V3-20260915/v4.css 를 1안만 남겨 자동 생성 (build_design2.py). 손으로 고칠 땐 시안 파일도 같이.
   구조: 디자인.css(옛 미니멀 스킨) 뒤에 읽혀 덮어쓴다. 되돌리려면 각 HTML 의 <link 디자인2.css> 한 줄만 빼면 된다.
   깔끔 모드(html[data-깔끔]) = 도움말 문구 숨김 — 개인용은 디자인2.js 가 항상 켬, 판매용은 [사용법 문구] 토글.
   ══════════════════════════════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════════════════════════
   원고도우미 디자인 시안 v4 — 화면 전체 생김새 3안 (2026-09-16 밤)
   대표 지시: "스케줄 색만 바꾸면 뭐하냐, 전체적으로 다 바뀌어야지. 웹서치로 비슷한 기능 사이트 참고해서 다시."
   기준: ① 눈이 편하고 ② 조화롭게 · 기능·입력칸·배치 순서는 그대로, 보이는 것은 전부 바꾼다.
   참고(웹서치 2026-09-16): 2026 SaaS UI 흐름 = 'Calm design'(여백·정보 감추기·타이포 위계, Linear), 단일 CTA(Spotlight UX),
     예약 게시 도구(Buffer=깨끗한 흰 화면+큐, Later=시각 캘린더, Planable=팀 승인 흐름), 토스 디자인 시스템(회색 바탕 #F2F4F6·흰 카드·파랑 CTA 하나·큰 라운드).
   3안은 '형태'가 다르다 (색만 다른 게 아님):
     1 「토스 소프트」  회색 바탕 위 흰 카드(라운드 18) · 알약 탭 · 파랑 CTA 하나 · 상태는 파스텔 칩          — 한국 사용자에게 가장 익숙·편안
     2 「리니어 크리스프」 흰 바탕 · 가는 선으로만 구분 · 작은 라운드 · 글자 위계로 정리 · 상태는 점+글자      — 가장 밀도 높고 조용
     3 「크리에이터 웜」 따뜻한 바탕 · 테두리 카드(라운드 14) · 보라 포인트 · 둥근 버튼 · 상태는 진한 글자 칩  — 친근하고 부드러움
   ⚠️ 운영 파일 아님. 시안 사본에만 얹는다. 글꼴은 Pretendard(시안씨앗.js가 CDN에서 붙임).
   ══════════════════════════════════════════════════════════════════════════ */
/* ───────── 공통 뼈대 (세 안 공통: 변수만 다르게) ───────── */
html:root{
  --f:'Pretendard Variable',Pretendard,'Apple SD Gothic Neo','Noto Sans KR',system-ui,sans-serif;
}
html:root body{ font-family:var(--f) !important; background:var(--바탕) !important; color:var(--글) !important; -webkit-font-smoothing:antialiased; letter-spacing:-.01em; }
html:root *{ font-family:var(--f) !important; }
html:root .card{ background:var(--판) !important; border:var(--카드선) !important; border-radius:var(--r-카드) !important; box-shadow:var(--카드그늘) !important; padding:var(--카드안) !important; }
html:root h1{ font-size:22px !important; font-weight:700 !important; letter-spacing:-.02em !important; color:var(--글) !important; }
html:root h1 span, html:root h1 small{ font-size:12px !important; font-weight:500 !important; background:var(--흐림면) !important; color:var(--글연) !important; border-radius:999px !important; padding:3px 10px !important; }
html:root h2, html:root h3, html:root .묶음머리, html:root b.tit{ color:var(--글) !important; letter-spacing:-.01em; }
html:root p, html:root label, html:root .hint, html:root .도움, html:root .설명, html:root .tip, html:root #msg, html:root #cafeMsg, html:root .note{ color:var(--글연) !important; }
html:root ::selection{ background:var(--주연); }
html:root ::-webkit-scrollbar{ width:10px; height:10px; }
html:root ::-webkit-scrollbar-thumb{ background:var(--선진); border-radius:6px; border:2px solid var(--바탕); }
html:root ::-webkit-scrollbar-track{ background:transparent; }
/* 옅은 회청 면들(인라인 고정색)은 전부 '흐림면' 한 가지로 → 화면마다 다른 회색이 섞여 칙칙하던 것 정리 */
html:root [style*="background:#f4f6f8"], html:root [style*="background:#f7f8fa"], html:root [style*="background:#f7f9fc"], html:root [style*="background:#f8fafc"], html:root [style*="background:#fafbfc"], html:root [style*="background:#fafafa"], html:root [style*="background:#eef1f6"], html:root [style*="background:#eef2f7"], html:root [style*="background:#eceff3"], html:root [style*="background:#eceff2"], html:root [style*="background:#e8edf6"], html:root [style*="background:#f2f5fa"], html:root [style*="background:#f1f5fb"], html:root [style*="background:#e0e3e8"], html:root [style*="background:#f2f2f4"], html:root .pbox, html:root .box{
  background:var(--흐림면) !important; border-color:var(--선) !important; border-radius:var(--r) !important; }
/* 입력칸 */
html:root input, html:root textarea, html:root select{
  font-family:var(--f) !important; background:var(--입력면) !important; color:var(--글) !important; border:var(--입력선) !important; border-radius:var(--r) !important; caret-color:var(--주); transition:border-color .12s, box-shadow .12s; }
html:root input:focus, html:root textarea:focus, html:root select:focus{ border-color:var(--주) !important; box-shadow:0 0 0 3px var(--주연) !important; outline:none !important; }
html:root ::placeholder{ color:var(--글흐림) !important; }
/* 버튼 공통 */
html:root button, html:root .ppchip, html:root .이동 a{
  font-family:var(--f) !important; font-weight:600 !important; border-radius:var(--r-버튼) !important; letter-spacing:-.01em;
  transition:transform 80ms ease-out, background-color .12s, border-color .12s, filter .12s !important; -webkit-tap-highlight-color:transparent; }
html:root button:not(:disabled):active, html:root .ppchip:active{ transform:translateY(1px) scale(.985) !important; filter:brightness(.95) !important; }
html:root button:focus-visible{ outline:2px solid var(--주) !important; outline-offset:2px !important; }
html:root button:disabled{ opacity:.5; }
/* 기본(회색) 버튼 */
html:root button{ background:var(--버튼면) !important; color:var(--버튼글) !important; border:var(--버튼선) !important; }
/* 주 동작: 검정·파랑·짙은회색 고정색 → 주 색 하나로 */
html:root [style*="background:#111"], html:root [style*="background:#3b62d0"], html:root [style*="background:#39424f"], html:root [style*="background:#44528f"], html:root [style*="background:#37437a"], html:root [style*="background:#2b6cff"], html:root [style*="background:#7d5bb0"], html:root [style*="background:#7b5ea7"], html:root #addBtn, html:root .aiBtn, html:root .box .go, html:root .toolbar button.allcopy, html:root .grid .cwrap button.k-pri:not(.rowcopy), html:root .cal button.on, html:root .calnav button.on, html:root .cald.on, html:root .calall.on, html:root .ppbar .pdate.other, html:root #ktBtn.on, html:root [style*="background:#2f9e6f;color:#fff"]{
  background:var(--주) !important; color:#fff !important; border:1px solid var(--주) !important; }
/* 도구 줄(요약보기·시트 등록 안된것만·완료함·보류함): 눈에 띄되 주 색보다 낮게 */
html:root [style*="background:#64748b"]{ background:var(--도구면) !important; color:var(--도구글) !important; border:var(--도구선) !important; font-weight:600 !important; }
/* 열기: 테두리 주 색 */
html:root .grid .cwrap button.rowcopy.k-pri{ background:var(--판) !important; color:var(--주) !important; border:1px solid var(--주) !important; }
/* 반복 복사·이동(제목·본문·계정·업체명·비고·수정·시트복사·가이드함 버튼): 복사면 */
/* (표 안 버튼은 아래 '표 안 버튼 — 역할별 색' 블록에서 다룬다 — :not() 사슬은 명시도를 부풀려 역할 규칙을 눌러버린다 · 2026-09-16 발견) */
html:root .toolbar button:not(.allcopy):not(.allclear):not(.main), html:root .item .go, html:root .item .write, html:root .item .fold, html:root .b-acc, html:root .b-link, html:root .b-head, html:root .quick button, html:root .src button, html:root .bar button, html:root .작, html:root .주{
  background:var(--복사면) !important; color:var(--복사글) !important; border:var(--복사선) !important; }
/* 상태 버튼 */
html:root .grid .cwrap button.k-good.여기없음, html:root [style*="background:#2f9e6f"], html:root [style*="background:#e6f4ea"], html:root [style*="background:#eef6f1"], html:root [style*="background:#e7f5ee"]{
  background:var(--완연) !important; color:var(--완) !important; border:1px solid transparent !important; }
html:root [style*="background:#c0842a"], html:root [style*="background:#fdf6e6"], html:root [style*="background:#fff8e6"], html:root [style*="background:#fdf6e8"], html:root [style*="background:#f7e6bd"]{
  background:var(--주의연) !important; color:var(--주의) !important; border:1px solid transparent !important; }
/* k-off 는 아래 역할 블록에서 */
/* 위험: 글자·테두리만 */
html:root .grid button.rowdel, html:root .toolbar button.allclear, html:root .item .del, html:root .b-del, html:root .위험, html:root [style*="background:#d15b5b"], html:root [style*="background:#b3261e"]{ background:var(--판) !important; color:var(--위험) !important; border:1px solid var(--위험연) !important; }
html:root [style*="background:#fdecec"], html:root [style*="background:#fff6f6"], html:root [style*="background:#fff7f0"]{ background:var(--위험연) !important; border-radius:var(--r) !important; }
html:root #delBanner{ background:var(--위험) !important; }
/* 상단 메뉴 — 안마다 형태가 다름(아래 각 안) · 공통은 여기 */
html:root .topnav, html:root .subnav{ gap:var(--탭간격) !important; }
html:root .topnav button, html:root .subnav button, html:root .이동 a{ font-weight:600 !important; }
/* 표 — 세로줄 없이, 가로 가는 선만 */
html:root .grid{ border-collapse:collapse !important; }
/* separate 로 바꾸면 고정 열 머리가 어긋난다 */
html:root .grid th{ background:var(--표머리면) !important; color:var(--글연) !important; font-weight:600 !important; font-size:12px !important; border:0 !important; border-bottom:1px solid var(--선) !important; padding:10px 10px !important; }
html:root .grid td{ border:0 !important; border-bottom:1px solid var(--선) !important; background:var(--판) !important; }
html:root .grid td.col-h{ border-left:0 !important; }
html:root .grid th.num, html:root .grid td.num{ background:var(--판) !important; color:var(--글연) !important; font-weight:700 !important; }
/* 상태별: 넓은 면은 아주 옅게, 번호칸이 상태색 */
html:root .grid tr.mom:not(.moved):not(.sent) td, html:root .grid tr.comm:not(.moved):not(.sent) td{ background:var(--전연) !important; }
html:root .grid tr.mom:not(.moved):not(.sent) td.num, html:root .grid tr.comm:not(.moved):not(.sent) td.num{ background:var(--전) !important; color:#fff !important; }
html:root .grid tr.temp:not(.moved):not(.sent) td{ background:var(--주의연) !important; }
html:root .grid tr.temp:not(.moved):not(.sent) td.num{ background:var(--주의) !important; color:#fff !important; }
html:root .grid tr.wonly:not(.temp):not(.moved):not(.sent) td{ background:var(--원고만연) !important; }
html:root .grid tr.wonly:not(.temp):not(.moved):not(.sent) td.num{ background:var(--원고만) !important; color:#fff !important; }
html:root .grid tr.mom.moved:not(.sent) td{ background:var(--맘연) !important; }
html:root .grid tr.mom.moved:not(.sent) td.num{ background:var(--맘) !important; color:#fff !important; }
html:root .grid tr.comm.moved:not(.sent) td{ background:var(--커뮤연) !important; }
html:root .grid tr.comm.moved:not(.sent) td.num{ background:var(--커뮤) !important; color:#fff !important; }
html:root .grid tr.sent td{ background:var(--게시연) !important; }
html:root .grid tr.sent td.num{ background:var(--게시) !important; color:#fff !important; }
/* 폰 카드 */
html:root .mcard, html:root .sumcard{ background:var(--판) !important; border:1px solid var(--선) !important; border-radius:var(--r-카드) !important; border-left-width:1px !important; }
html:root .mcard.mom:not(.moved):not(.sent), html:root .mcard.comm:not(.moved):not(.sent), html:root .sumcard.mom:not(.moved):not(.sent), html:root .sumcard.comm:not(.moved):not(.sent){ background:var(--전연) !important; border-left:1px solid var(--선) !important; }
html:root .mcard.mom.moved:not(.sent), html:root .sumcard.mom.moved:not(.sent){ background:var(--맘연) !important; border-left-color:var(--선) !important; }
html:root .mcard.comm.moved:not(.sent), html:root .sumcard.comm.moved:not(.sent){ background:var(--커뮤연) !important; border-left-color:var(--선) !important; }
html:root .mcard.sent, html:root .sumcard.sent{ background:var(--게시연) !important; }
/* 범례 네모 */
html:root [style*="background:#4e8f6d"]{ background:var(--전) !important; border-radius:50% !important; }
html:root [style*="background:#f7e6bd"]{ background:var(--주의) !important; border-radius:50% !important; }
html:root [style*="background:#c2758f"]{ background:var(--맘) !important; border-radius:50% !important; }
html:root [style*="background:#5b7aa8"]{ background:var(--커뮤) !important; border-radius:50% !important; }
html:root [style*="background:#9a9aa0"], html:root [style*="background:#8895a6"]{ background:var(--게시) !important; border-radius:50% !important; }
/* 계정제 칩 · 삭제 초읽기 */
html:root .ppbar .ppcafe{ background:var(--흐림면) !important; color:var(--글) !important; border-radius:var(--r) !important; }
html:root .ppbar .ppchip{ background:var(--판) !important; border:1px solid var(--선진) !important; color:var(--글) !important; }
html:root .ppbar .ppchip.okk{ background:var(--완연) !important; border-color:transparent !important; color:var(--완) !important; }
html:root .ppbar .ppchip.wait{ background:var(--주의연) !important; border-color:transparent !important; color:var(--주의) !important; }
html:root .ppbar .ppdel{ background:var(--위험연) !important; border:1px solid transparent !important; color:var(--위험) !important; border-radius:var(--r-카드) !important; }
html:root .ppbar .ppdelt, html:root .ppbar .ppopen{ background:var(--위험) !important; color:#fff !important; border-radius:var(--r) !important; }
html:root .ppbar .ppsub{ border-left-color:var(--선) !important; }
/* 알림 배너(쓰던 원고) */
html:root #draftBanner{ background:var(--판) !important; border:1px solid var(--선) !important; color:var(--글) !important; border-radius:var(--r-카드) !important; box-shadow:0 8px 24px rgba(20,30,50,.10) !important; }
html:root #draftBanner span[style*="background:#eef3fb"]{ background:var(--복사면) !important; color:var(--복사글) !important; border-radius:999px !important; }
html:root #draftBanner a{ color:var(--주) !important; }
html:root button[style*="color:#b0a88f"], html:root button[style*="color:#9aa6bb"]{ color:var(--글연) !important; }
/* 가이드함·완료함·보류함·계정 목록 항목 */
html:root .item, html:root .g, html:root .row, html:root .판, html:root .표{ background:var(--판) !important; border:1px solid var(--선) !important; border-radius:var(--r-카드) !important; }
html:root .k, html:root .st, html:root .who, html:root .mtag, html:root .sbadge{ border-radius:999px !important; font-weight:600 !important; }
/* ═══════════ 1 「토스 소프트」 ═══════════ */
html:root{
  --바탕:#f2f4f6; --판:#ffffff; --흐림면:#f2f4f6; --입력면:#f9fafb; --글:#191f28; --글연:#4e5968; --글흐림:#8b95a1; --선:#eef0f3; --선진:#dfe3e8;
  --주:#3182f6; --주연:#e8f3ff;
  --복사면:#f2f4f6; --복사글:#333d4b; --복사선:1px solid transparent;
  --버튼면:#f2f4f6; --버튼글:#333d4b; --버튼선:1px solid transparent; --입력선:1px solid transparent;
  --도구면:#e8f3ff; --도구글:#1b64da; --도구선:1px solid transparent;
  --완:#0f9d58; --완연:#e6f6ee; --주의:#a86718; --주의연:#fff4e2; --위험:#f04452; --위험연:#ffeef0;
  --맘:#c8617f; --맘연:#fdf1f5; --커뮤:#5183e0; --커뮤연:#eef4fd; --전:#39a06f; --전연:#eef8f2; --원고만:#a8801a; --원고만연:#fef8e7; --게시:#7b8590; --게시연:#f2f4f6;
  --표머리면:#ffffff;
  --r:12px; --r-버튼:12px; --r-카드:20px; --카드선:1px solid transparent; --카드그늘:none; --카드안:28px 30px; --탭간격:4px;
}
html:root .topnav{ background:#e8ebef !important; padding:4px !important; border-radius:14px !important; }
html:root .topnav button{ background:transparent !important; border:1px solid transparent !important; color:#6b7684 !important; border-radius:10px !important; }
html:root .topnav button.navActive{ background:#ffffff !important; color:#191f28 !important; border-color:transparent !important; box-shadow:0 1px 2px rgba(0,0,0,.06) !important; }
html:root .subnav button{ background:transparent !important; border:1px solid transparent !important; color:#6b7684 !important; }
html:root .subnav button.navActive{ background:#e8f3ff !important; color:#1b64da !important; }
html:root .grid th{ background:#ffffff !important; }
/* ═══════════ 2 「리니어 크리스프」 ═══════════ */
/* ═══════════ 3 「크리에이터 웜」 ═══════════ */
/* 접근성: 움직임 줄이기 */
@media (prefers-reduced-motion:reduce){ html:root button, html:root .ppchip{ transition:none !important; } }
/* ═══ 표 안 버튼 — 역할별 색 (2026-09-16 대표: "버튼색 너무 아무것도 없는 거 아냐?" / 예전 반려: "버튼이 배경에 묻힘") ═══
   줄이 상태색으로 옅게 칠해지므로, 표 안 버튼은 '흰 바탕 + 테두리'가 기본 — 어느 줄 위에서도 또렷하다.
   그 위에 역할 색: 열기=주 테두리 · 시트복사=주 옅은 면 · 링크전달=주 채움(그 줄의 끝내는 동작) · 매출체크=완료색 · 보류=주의색 · 취소=위험 테두리 · 사진 저장=주 채움 */
html:root .grid button.cellcopy, html:root .grid .cwrap button.rowcopy{
  background:var(--판) !important; color:var(--글) !important; border:1px solid var(--선진) !important; font-weight:600 !important; }
html:root .grid .cwrap button.rowcopy[onclick^="링크열기"]{ background:var(--판) !important; color:var(--주) !important; border:1px solid var(--주) !important; }
html:root .grid .cwrap button.rowcopy[onclick^="옮김토글"]{ background:var(--주연) !important; color:var(--주) !important; border:1px solid transparent !important; }
html:root .grid .cwrap button.rowcopy[onclick^="옮김토글"].k-good{ background:var(--완연) !important; color:var(--완) !important; }
html:root .grid .cwrap button.rowcopy[onclick^="링크전달창"]{ background:var(--주) !important; color:#fff !important; border:1px solid var(--주) !important; }
html:root .grid .cwrap button.rowcopy[onclick^="링크전달창"].k-good, html:root .grid .cwrap button.rowcopy[onclick^="링크전달창"].k-off{ background:var(--완연) !important; color:var(--완) !important; border-color:transparent !important; }
html:root .grid .cwrap button.rowcopy[onclick^="매출체크"]{ background:var(--완연) !important; color:var(--완) !important; border:1px solid transparent !important; }
html:root .grid .cwrap button.rowcopy[onclick^="매출체크"].k-off{ background:var(--흐림면) !important; color:var(--글연) !important; }
html:root .grid .cwrap button.rowcopy[onclick^="보류하기"], html:root .grid button[onclick^="보류하기"]{ background:var(--주의연) !important; color:var(--주의) !important; border:1px solid transparent !important; }
html:root .grid button[onclick^="행취소"], html:root .grid button.rowdel{ background:var(--판) !important; color:var(--위험) !important; border:1px solid var(--위험연) !important; }
html:root .grid button.cellcopy[onclick^="사진저장하기"]:not([title]), html:root .mbtn.p:not([title]){ background:var(--주) !important; color:#fff !important; border:1px solid var(--주) !important; }
html:root .grid button.cellcopy[onclick^="사진저장하기"][title], html:root .mbtn.p[title]{ background:var(--판) !important; color:var(--위험) !important; border:1px solid var(--위험) !important; }
html:root .grid button.cellcopy[onclick^="사진복사"]{ background:var(--복사면) !important; color:var(--복사글) !important; border:1px solid var(--선진) !important; }
/* 제목·본문·계정·업체명·비고 복사(가장 자주 누르는 것): 주 색 글자로 '눌러도 되는 것'임을 알린다 */
html:root .grid button.cellcopy[onclick^="제목복사"], html:root .grid button.cellcopy[onclick^="본문복사"], html:root .grid button.cellcopy[onclick^="계정복사"], html:root .grid button.cellcopy[onclick^="업체명복사"], html:root .grid button.cellcopy[onclick^="비고복사"]{ color:var(--주) !important; }
/* ═══ 화면별 고유 클래스 — 원래 색이 남아 있던 것 전부 (2026-09-16 대표: "원래 거랑 똑같은 게 있잖아") ═══ */
/* 홈 */
html:root .box{ background:var(--판) !important; border:1px solid var(--선) !important; border-radius:var(--r-카드) !important; }
html:root .box h3{ color:var(--글) !important; }
html:root .box h3 .n{ background:var(--흐림면) !important; color:var(--글연) !important; }
html:root .box h3 .n.hot{ background:var(--위험연) !important; color:var(--위험) !important; }
html:root .box h3 .n.ok{ background:var(--완연) !important; color:var(--완) !important; }
html:root .row{ background:transparent !important; border-radius:var(--r) !important; }
html:root .row:nth-child(odd){ background:var(--흐림면) !important; }
html:root .row .t{ color:var(--주) !important; }
html:root .row .t.now{ color:var(--위험) !important; }
html:root .row .who{ color:var(--글) !important; }
html:root .empty{ color:var(--글흐림) !important; }
html:root .late{ background:var(--주의연) !important; border:1px solid transparent !important; color:var(--주의) !important; border-radius:var(--r) !important; }
html:root .cost, html:root .foot{ color:var(--글연) !important; }
html:root .quick button{ background:var(--주) !important; color:#fff !important; border:1px solid var(--주) !important; }
/* 완료함·보류함 */
html:root .calnav b{ color:var(--글) !important; }
html:root .calnav button, html:root .cal button{ background:var(--흐림면) !important; color:var(--글) !important; border:1px solid transparent !important; }
html:root .calnav button.on, html:root .cal button.on{ background:var(--주) !important; color:#fff !important; }
html:root .calw{ color:var(--글흐림) !important; }
html:root .calw.sun{ color:var(--위험) !important; }
html:root .cald{ border:1px solid var(--선) !important; color:var(--글) !important; border-radius:var(--r) !important; background:var(--판) !important; }
html:root .cald:hover{ background:var(--흐림면) !important; }
html:root .cald.zero{ color:var(--글흐림) !important; }
html:root .cald.today{ border-color:var(--주) !important; }
html:root .cald.on{ background:var(--주) !important; color:#fff !important; border-color:var(--주) !important; }
html:root .cald .n{ background:var(--완) !important; color:#fff !important; }
html:root .cald.on .n{ background:#fff !important; color:var(--주) !important; }
html:root .item{ background:var(--판) !important; border:1px solid var(--선) !important; border-radius:var(--r-카드) !important; }
html:root .item .iarrow{ color:var(--글흐림) !important; }
html:root .ihead{ color:var(--글) !important; }
html:root .idone{ color:var(--글흐림) !important; }
html:root .ibody{ color:var(--글) !important; background:var(--흐림면) !important; border-radius:var(--r) !important; padding:10px 12px !important; }
html:root .ilink{ color:var(--주) !important; }
html:root .b-head{ background:var(--주연) !important; color:var(--주) !important; border:1px solid transparent !important; }
html:root .b-link{ background:var(--완연) !important; color:var(--완) !important; border:1px solid transparent !important; }
html:root .b-acc{ background:var(--복사면) !important; color:var(--복사글) !important; border:var(--복사선) !important; }
html:root .b-del{ background:var(--판) !important; color:var(--위험) !important; border:1px solid var(--위험연) !important; }
html:root .b-restore{ background:var(--주) !important; color:#fff !important; border:1px solid var(--주) !important; }
html:root .hint{ background:var(--주의연) !important; color:var(--주의) !important; border-radius:var(--r) !important; }
/* 가이드함 */
html:root .count{ color:var(--글연) !important; }
html:root .item .prev{ color:var(--글연) !important; }
html:root .item .prev:hover{ color:var(--주) !important; }
html:root .item .write{ background:var(--주) !important; color:#fff !important; border:1px solid var(--주) !important; }
html:root .item .go{ background:var(--복사면) !important; color:var(--복사글) !important; border:var(--복사선) !important; }
html:root .item .fold{ background:var(--흐림면) !important; color:var(--글연) !important; border:1px solid transparent !important; }
html:root .item .del{ background:var(--판) !important; color:var(--위험) !important; border:1px solid var(--위험연) !important; }
html:root .item .full{ border:var(--입력선) !important; border-radius:var(--r) !important; }
html:root hr{ border-top:1px solid var(--선) !important; }
/* 계정 */
html:root .lockbar b, html:root .aibar b, html:root .crow b{ color:var(--주) !important; }
html:root .lockbar .off{ background:var(--게시) !important; color:#fff !important; }
html:root .cafehead{ background:var(--흐림면) !important; color:var(--글) !important; }
html:root .cafehead button, html:root .foldbtn{ background:var(--판) !important; color:var(--글연) !important; border:1px solid var(--선진) !important; }
html:root .set{ background:var(--판) !important; color:var(--글연) !important; border-bottom:1px solid var(--선) !important; }
html:root th{ background:var(--표머리면) !important; color:var(--글연) !important; }
html:root th, html:root td{ border-bottom-color:var(--선) !important; }
html:root .ok{ color:var(--완) !important; }
html:root .no{ color:var(--위험) !important; }
html:root .mid{ color:var(--주의) !important; }
html:root .stop td{ background:var(--위험연) !important; }
html:root .xbtn{ background:var(--판) !important; color:var(--위험) !important; border:1px solid var(--위험연) !important; }
html:root .addbtn{ background:var(--주) !important; color:#fff !important; border:1px solid var(--주) !important; }
html:root .grouphead{ color:var(--글) !important; }
html:root .note{ background:var(--주연) !important; border:1px solid transparent !important; color:var(--글연) !important; border-radius:var(--r) !important; }
html:root .알림{ background:var(--글) !important; color:#fff !important; border-radius:var(--r) !important; }
html:root .알림.실패{ background:var(--위험) !important; }
/* 직접 쓰기 */
html:root .aibar{ background:var(--흐림면) !important; border:1px solid transparent !important; border-radius:var(--r-카드) !important; }
html:root .aibar button, html:root .fmsg button, html:root .big, html:root .heldrow button:not(.hx), html:root .crow1 button:not(.cs), html:root .ckeys .k.eq, html:root .toolbar .add{
  background:var(--주) !important; color:#fff !important; border:1px solid var(--주) !important; }
html:root .gtab button, html:root .guide .gbtn button{ background:var(--흐림면) !important; color:var(--글연) !important; border:1px solid transparent !important; }
html:root .gtab button.on, html:root .guide .gbtn button.on{ background:var(--주) !important; color:#fff !important; }
html:root #gframe{ border:1px solid var(--선) !important; border-radius:var(--r) !important; }
html:root .heldrow{ background:var(--흐림면) !important; border:1px solid transparent !important; border-radius:var(--r) !important; }
html:root .heldrow .hx{ background:var(--판) !important; color:var(--글연) !important; border:1px solid var(--선진) !important; }
html:root .fmsg, html:root .calc, html:root .common, html:root .slotlock{ background:var(--흐림면) !important; border:1px solid var(--선) !important; border-radius:var(--r-카드) !important; }
html:root .slotlock b, html:root .missmsg{ color:var(--위험) !important; }
html:root .glinks a{ background:var(--복사면) !important; border:var(--복사선) !important; color:var(--복사글) !important; border-radius:var(--r) !important; }
html:root .glinks a.sm{ background:var(--판) !important; border:1px solid var(--선진) !important; color:var(--글연) !important; }
html:root .calc .ct, html:root .crow1 .cl, html:root .shead .sum{ color:var(--글연) !important; }
html:root .ckeys .k{ background:var(--판) !important; border:1px solid var(--선) !important; color:var(--글) !important; }
html:root .ckeys .k.f{ background:var(--흐림면) !important; color:var(--글연) !important; }
html:root .crow1 b{ color:var(--완) !important; }
html:root .crow1 .cs{ background:var(--주연) !important; color:var(--주) !important; }
html:root .toolbar button{ background:var(--도구면) !important; color:var(--도구글) !important; border:var(--도구선) !important; }
html:root .toolbar .ghost{ background:var(--흐림면) !important; color:var(--글연) !important; border:1px solid transparent !important; }
html:root .crow .auto, html:root .crow .auto2{ background:var(--복사면) !important; color:var(--복사글) !important; border:var(--복사선) !important; }
html:root .crow .reset{ background:var(--흐림면) !important; color:var(--글연) !important; border:1px solid transparent !important; }
html:root .crow2 button{ background:var(--도구면) !important; color:var(--도구글) !important; border:var(--도구선) !important; }
html:root .cgrid input.miss{ border:1px solid var(--위험) !important; background:var(--위험연) !important; }
html:root .slot{ background:var(--판) !important; border:1px solid var(--선) !important; border-radius:var(--r-카드) !important; }
html:root .slot.맘, html:root .slot.커뮤, html:root .slot.음슴{ border-left:1px solid var(--선) !important; }
html:root .shead{ background:var(--흐림면) !important; border-bottom:1px solid var(--선) !important; }
html:root .shead .no{ color:var(--주) !important; }
html:root .shead .no.fold{ background:var(--주연) !important; }
html:root .shead .tit, html:root .shead .arw{ color:var(--글흐림) !important; }
html:root .bg.bad{ background:var(--위험연) !important; color:var(--위험) !important; }
html:root .bg.todo{ background:var(--흐림면) !important; color:var(--글연) !important; }
html:root .bg.warn{ background:var(--주의연) !important; color:var(--주의) !important; }
html:root .bg.ok{ background:var(--완연) !important; color:var(--완) !important; }
html:root .bg.empty{ background:var(--흐림면) !important; color:var(--글흐림) !important; }
/* ═══ 1안 토스 소프트 — 대표 피드백(2026-09-16 밤): "제일 나은데 버튼 구분·칸 구분이 조금 흐리다" ═══
   · 칸 구분: 세로 선을 되살리고 선을 한 단계 진하게, 표 머리는 옅은 회색 면
   · 버튼 구분: 표 안 버튼은 흰 바탕 + 또렷한 테두리 + 아주 얇은 아래 그늘(1px) — 옅은 줄 색 위에서도 '버튼'으로 읽힘
   · 글자 무게: 버튼 글자 600 → 그대로, 색만 한 단계 진하게 */
html:root{ --선:#e1e5ea; --선진:#c9d0d8; --흐림면:#eef0f3; }
html:root .grid th{ background:#f6f7f9 !important; border-right:1px solid var(--선) !important; color:#4e5968 !important; }
html:root .grid td{ border-right:1px solid var(--선) !important; border-bottom:1px solid var(--선) !important; }
html:root .grid th:last-child, html:root .grid td:last-child{ border-right:0 !important; }
html:root .grid button.cellcopy, html:root .grid .cwrap button.rowcopy, html:root .grid .cwrap button.rowcopy[onclick^="링크열기"], html:root .grid button.cellcopy[onclick^="사진복사"]{
  border-color:#c9d0d8 !important; box-shadow:0 1px 0 rgba(20,30,50,.08) !important; color:#333d4b !important; }
html:root .grid .cwrap button.rowcopy[onclick^="링크열기"]{ color:var(--주) !important; border-color:var(--주) !important; }
html:root .grid button.cellcopy[onclick^="제목복사"], html:root .grid button.cellcopy[onclick^="본문복사"], html:root .grid button.cellcopy[onclick^="계정복사"], html:root .grid button.cellcopy[onclick^="업체명복사"], html:root .grid button.cellcopy[onclick^="비고복사"]{ color:var(--주) !important; }
/* 상태 면 버튼(시트복사·매출체크·보류·옮김완료)도 테두리를 살짝 줘서 면끼리 붙어 보이지 않게 */
html:root .grid .cwrap button.rowcopy[onclick^="옮김토글"]{ border:1px solid #cfe0fb !important; }
html:root .grid .cwrap button.rowcopy[onclick^="옮김토글"].k-good, html:root .grid .cwrap button.rowcopy[onclick^="매출체크"]{ border:1px solid #c6e6d4 !important; }
html:root .grid .cwrap button.rowcopy[onclick^="매출체크"].k-off{ border:1px solid #d9dde3 !important; }
html:root .grid .cwrap button.rowcopy[onclick^="보류하기"], html:root .grid button[onclick^="보류하기"]{ border:1px solid #f0d9b3 !important; }
/* 표 밖 기본 버튼(회색 알약)도 테두리 한 줄 */
html:root button:not(.navActive):not(.topnav button){ border:1px solid transparent !important; }
html:root .cellcopy, html:root .rowcopy{ border-width:1px !important; border-style:solid !important; }
/* 계정·업체명 입력칸 위 라벨 줄이 흐릿하던 것: 라벨 색 진하게 */
html:root .grid .mlab, html:root .grid small, html:root .grid .cwrap label{ color:#6b7684 !important; }
/* 1안 보정 2 — 시트복사는 onclick="행복사" (옮김토글 아님) · 상태 면 색을 한 단계 진하게 해 '흐림' 해소 */
html:root{ --주의연:#fdebd0; --완연:#dcf1e6; --위험연:#ffe4e7; }
html:root .grid .cwrap button.rowcopy[onclick^="행복사"]{ background:var(--주연) !important; color:var(--주) !important; border:1px solid #cfe0fb !important; }
html:root .grid .cwrap button.rowcopy[onclick^="보류하기"], html:root .grid button[onclick^="보류하기"]{ background:#fdebd0 !important; color:#9a5b12 !important; border:1px solid #f3d3a3 !important; }
html:root .grid .cwrap button.rowcopy[onclick^="매출체크"]{ background:#dcf1e6 !important; color:#0f7a45 !important; border:1px solid #bfe3cf !important; }
html:root .grid .cwrap button.rowcopy[onclick^="매출체크"].k-off{ background:#eef0f3 !important; color:#6b7684 !important; border:1px solid #d9dde3 !important; }
html:root .grid .cwrap button.rowcopy[onclick^="옮김토글"].k-good{ background:#dcf1e6 !important; color:#0f7a45 !important; border:1px solid #bfe3cf !important; }
html:root .grid .cwrap .pair button.rowcopy:not(.k-pri){ color:#333d4b !important; border:1px solid #c9d0d8 !important; }
html:root .grid button.rowdel{ border:1px solid #f3b9bf !important; }
/* 1안 보정 3 — 대표가 표시한 부분(2026-09-16 밤): 임시등록·원고만 알약, 제목·본문·비고·계정·업체명 복사 버튼의 테두리와 칸 구분선이 너무 연함 */
html:root{ --선:#d9dee4; --선진:#b9c2cc; }
html:root .grid td, html:root .grid th{ border-right:1px solid #d9dee4 !important; border-bottom:1px solid #d9dee4 !important; }
html:root .grid th:last-child, html:root .grid td:last-child{ border-right:0 !important; }
/* 복사 버튼(제목·본문·비고·계정·업체명·사진): 테두리를 확실히 */
html:root .grid button.cellcopy{ background:#ffffff !important; border:1px solid #b9c2cc !important; box-shadow:0 1px 0 rgba(20,30,50,.10) !important; }
html:root .grid button.cellcopy[onclick^="제목복사"], html:root .grid button.cellcopy[onclick^="본문복사"], html:root .grid button.cellcopy[onclick^="계정복사"], html:root .grid button.cellcopy[onclick^="업체명복사"], html:root .grid button.cellcopy[onclick^="비고복사"]{ color:var(--주) !important; border-color:#9fc0f2 !important; }
/* 왼쪽 머리칸의 상태 알약(임시등록·원고만·임시등록 완료 ✓): 회색 면 → 흰 바탕 + 테두리, 켜지면 색 면 */
html:root .grid .tempbtn, html:root .grid .wonly, html:root .grid td.col-h button{
  background:#ffffff !important; color:#4e5968 !important; border:1px solid #b9c2cc !important; box-shadow:0 1px 0 rgba(20,30,50,.08) !important; }
html:root .grid .tempbtn.on, html:root .grid td.col-h button.on{ background:#fdebd0 !important; color:#9a5b12 !important; border-color:#f0cf9a !important; }
html:root .grid .wonly.on{ background:#fbf1d5 !important; color:#8a6d12 !important; border-color:#ebd591 !important; }
/* 사진 칸 '추가·사진' 버튼과 계정 칸 입력줄 밑선도 같은 진하기 */
html:root .grid .col-p button:not([onclick^="사진저장하기"]){ border:1px solid #b9c2cc !important; background:#fff !important; }
html:root .grid .col-m input{ border-bottom:1px solid #b9c2cc !important; }
/* ═══ 깔끔 모드 — 도움말 문구 숨김 (이모지는 시안씨앗.js 가 글자에서 지운다) · 2026-09-16 대표 요청 ═══
   숨기는 것: 화면 위 설명 문단, 안내 상자(.note/.tip/.hint), 폰 가로 안내, 공통칸 설명, AI 안내 문장, 바닥글
   남기는 것: 기능 상태(저장됨·확인 중·건수), 사진 칸의 '추가 누르거나…'(동작 안내), 범례, 버튼 글자 */
html[data-깔끔] .card > p, html[data-깔끔] .rotatehint, html[data-깔끔] .note, html[data-깔끔] .foot, html[data-깔끔] .common .hint, html[data-깔끔] .lockbar .tip:not(#lockState), html[data-깔끔] .grouphead .tip, html[data-깔끔] .item .hint, html[data-깔끔] .card > .hint, html[data-깔끔] .box .hint{ display:none !important; }
html[data-깔끔] .aibar{ font-size:0 !important; padding:8px 10px !important; background:transparent !important; border:0 !important; }
html[data-깔끔] .aibar button{ font-size:13.5px !important; }
html[data-깔끔] #memoMark{ visibility:hidden; }
/* '적으면 자동 저장돼요' — 저장 상태로 바뀌면 다시 보임 */
html[data-깔끔] #memoMark:not(:empty)[data-status]{ visibility:visible; }
html[data-깔끔] h1 span, html[data-깔끔] h1 small{ display:none !important; }
/* 버전 배지 문구 */

/* 첫 그리기 전 이모지 깜빡임 방지: 디자인2.js 가 첫 정리를 끝낼 때까지만 본문을 가린다 (최대 1.5초, 안전장치 있음) */
html[data-깔끔]:not([data-깔끔완료]) body{ visibility:hidden !important; }