/* 총무랩 공통 외형 — 애플/아이폰 방식(밝은 회색 바탕, 흰 묶음, 파랑 단일 포인트)
   각 페이지 안의 기존 스타일 뒤에 적용되도록 html body 접두와 !important를 씀. 배치와 기능은 건드리지 않음 */

html:root{
  --bg:#f5f5f7!important;--bg-w:#fff!important;--surface:#f5f5f7!important;
  --border:rgba(60,60,67,.13)!important;--border-2:rgba(60,60,67,.2)!important;
  --text:#1d1d1f!important;--text-2:#424245!important;--text-3:#6e6e73!important;--text-4:#86868b!important;
  --green:#0071e3!important;--green-bg:#eef5fd!important;--teal:#0071e3!important;--teal-lt:#2d8cf0!important;--teal-bg:#eef5fd!important;
  --violet:#0071e3!important;--violet-bg:#eef5fd!important;--blue:#0071e3!important;--blue-bg:#eef5fd!important;--indigo:#0071e3!important;--indigo-bg:#eef5fd!important;
  --font-b:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Pretendard Variable",Pretendard,"Malgun Gothic",system-ui,sans-serif!important;
  --font-s:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Pretendard Variable",Pretendard,"Malgun Gothic",system-ui,sans-serif!important;
  --r:10px!important;--r-lg:14px!important;--r-xl:18px!important;--sh:none!important;
  --apple-accent:#0071e3;--apple-accent-hover:#0077ed;--apple-fill:rgba(118,118,128,.12);--apple-sep:rgba(60,60,67,.13);
  color-scheme:light;
}
html body{
  background:#f5f5f7!important;color:#1d1d1f;
  font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Pretendard Variable",Pretendard,"Malgun Gothic",system-ui,sans-serif!important;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:-.012em;
}
html body ::selection{background:rgba(0,113,227,.2)}
html body input,html body textarea{caret-color:#0071e3}
html body :focus-visible{outline:3px solid rgba(0,113,227,.5)!important;outline-offset:2px}
html body .r-main,html body td,html body .result,html body [class*="result"] b,html body [class*="result"] strong{font-variant-numeric:tabular-nums}

/* 상단 바: 반투명 + 얇은 구분선, 로고는 단색 타일 */
html body .topnav{background:rgba(245,245,247,.82)!important;-webkit-backdrop-filter:saturate(180%) blur(20px)!important;backdrop-filter:saturate(180%) blur(20px)!important;border-bottom:1px solid rgba(60,60,67,.13)!important;box-shadow:none!important}
html body .logo-mark{background:#0071e3!important;background-image:none!important;border-radius:7px!important;box-shadow:none!important;width:28px!important;height:28px!important}
html body .logo-name,html body .logo-name .hl{color:#1d1d1f!important;font-weight:700!important;letter-spacing:-.02em!important}
html body .nav-back{background:rgba(118,118,128,.12)!important;border:0!important;color:#1d1d1f!important;border-radius:999px!important}
html body .nav-sep{background:rgba(60,60,67,.13)!important}
html body .nav-action{border:0!important;background:rgba(118,118,128,.12)!important;color:#1d1d1f!important;box-shadow:none!important}

/* 제목: 그라데이션 글자 없이 굵기로 */
html body .tool-title,html body .main h1{color:#1d1d1f!important;letter-spacing:-.03em!important;font-weight:700!important}
html body .tool-title .hl,html body h1 .hl{background:none!important;-webkit-text-fill-color:currentColor!important;color:#1d1d1f!important}
html body .tool-desc{color:#6e6e73!important}

/* 제목 위 작은 라벨(키커)은 숨김 — 제목이 스스로 말하도록 */
html body .seo-eyebrow,html body .eyebrow,html body .aq-label,html body .pd20-kicker,html body .clab-practical22 > .k,html body .deep-kicker{display:none!important}

/* 묶음 카드: 흰 바탕, 큰 모서리, 그림자·테두리 없음 */
html body .card,html body .ai-quick-answer,html body .clab-law-check,html body .seo-section,html body .cl-practical-depth20,html body .clab-practical22,html body .step48-tool-depth,html body .cl-related-tools,html body .cl-source-note{
  background:#fff!important;background-image:none!important;border:0!important;border-radius:18px!important;box-shadow:none!important}
html body .card-title{color:#1d1d1f!important;font-weight:600!important;letter-spacing:-.02em!important}
html body .ai-quick-answer{padding:18px 20px!important}
html body .aq-question{color:#1d1d1f!important;font-weight:600!important}
html body .clab-law-check{font-size:12.5px!important}
html body .clab-law-check a{color:#0066cc!important;text-decoration:none!important}
html body .clab-law-check a:hover{text-decoration:underline!important}

/* 입력칸: iOS 채움형 */
html body .fg input,html body .fg select,html body .fg textarea,html body .card input[type="text"],html body .card input[type="number"],html body .card input[type="date"],html body .card input[type="tel"],html body .card select,html body .card textarea{
  background-color:rgba(118,118,128,.12)!important;border:1px solid transparent!important;border-radius:10px!important;color:#1d1d1f!important;box-shadow:none!important;min-height:44px}
html body .fg input:focus,html body .fg select:focus,html body .fg textarea:focus,html body .card input:focus,html body .card select:focus,html body .card textarea:focus{
  background-color:#fff!important;border-color:transparent!important;box-shadow:0 0 0 3px rgba(0,113,227,.35)!important;outline:none!important}
html body .fg label,html body .card label{color:#424245!important}
html body input[type="checkbox"],html body input[type="radio"]{accent-color:#0071e3}
html body input[type="range"]{accent-color:#0071e3}

/* 주 버튼: 파랑 단색. 직접 지정된 그라데이션 버튼도 단색으로 */
html body .btn-calc,html body .btn-primary,html body .calc-btn,html body #calcBtn,html body .btn.primary,html body .ta-btn.ta-primary,html body .ta-btn.primary,html body .tool-cta,
html body button[style*="linear-gradient"],html body a[style*="linear-gradient"][style*="#fff"]{
  background:#0071e3!important;background-image:none!important;color:#fff!important;border:0!important;box-shadow:none!important;border-radius:12px!important;font-weight:600!important;letter-spacing:-.01em!important;animation:none!important;text-shadow:none!important}
html body .btn-calc:hover,html body .btn-primary:hover,html body .calc-btn:hover,html body #calcBtn:hover,html body button[style*="linear-gradient"]:hover{background:#0077ed!important;transform:none!important;filter:none!important}
html body .btn-calc:active,html body .btn-primary:active,html body #calcBtn:active,html body button[style*="linear-gradient"]:active{background:#006edb!important}
html body .btn-secondary,html body .btn-add,html body .mode-btn,html body .tnav,html body .tab{border-radius:10px!important;box-shadow:none!important}
html body .mode-btn.active,html body .tnav.active,html body .tab.active{background:#0071e3!important;background-image:none!important;color:#fff!important;border-color:#0071e3!important}

/* 해설: 읽기 쉬운 크기와 간격 */
html body .seo-section{padding:28px 26px!important}
html body .seo-title{color:#1d1d1f!important;letter-spacing:-.03em!important;font-weight:700!important}
html body .seo-h3{color:#1d1d1f!important;letter-spacing:-.02em!important;font-weight:600!important}
html body .seo-num{background:rgba(118,118,128,.14)!important;background-image:none!important;color:#1d1d1f!important;box-shadow:none!important}
html body .seo-block p,html body .seo-section p,html body .seo-lead{color:#424245!important;line-height:1.7!important}
html body .seo-box{background:#f5f5f7!important;background-image:none!important;border:0!important;border-radius:12px!important;color:#1d1d1f!important}
html body .seo-box.warn{background:#fff8e8!important}
html body .seo-table{border-collapse:collapse!important}
html body .seo-table th{background:#f5f5f7!important;color:#6e6e73!important;font-weight:600!important;border:0!important;border-bottom:1px solid rgba(60,60,67,.13)!important}
html body .seo-table td{border:0!important;border-bottom:1px solid rgba(60,60,67,.13)!important}
html body details.seo-faq{border:0!important;border-bottom:1px solid rgba(60,60,67,.13)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
html body details.seo-faq summary{color:#1d1d1f!important;font-weight:500!important}

/* 왼쪽 굵은 색 띠 강조는 쓰지 않음 — 옅은 바탕으로 */
html body [style*="border-left:4px"],html body [style*="border-left: 4px"],html body [style*="border-left:3px"],html body [style*="border-left: 3px"]{border-left-width:0!important;border-radius:14px!important}

/* 다음 단계·관련 도구: 목록 행처럼 */
html body .clab-next-step{background:#fff!important;border:0!important;border-radius:18px!important;box-shadow:none!important}
html body .clab-next-step span[style*="background:#ede9fe"],html body .clab-next-step span[style*="background:#e3eefb"]{background:rgba(118,118,128,.12)!important}
html body .related-tools .rt-card,html body .cl-related-tool,html body .cl-step52-link{background:#fff!important;border:0!important;border-radius:14px!important;box-shadow:none!important}
html body .rt-label{color:#6e6e73!important}

/* 광고(쿠팡): 회색 버튼 + '광고' 표시로 계산 버튼과 구분 */
html body .clab-cur-btn,html body .clab-adbtn,html body .promo-btn,html body a.clab-adbtn[style],html body a.clab-cur-btn[style],html body div.promo-btn[style]{
  background:#e8e8ed!important;background-image:none!important;color:#1d1d1f!important;box-shadow:none!important;border:0!important;animation:none!important;border-radius:10px!important;font-weight:600!important}
html body .clab-cur-btn:hover,html body .clab-adbtn:hover,html body .promo-btn:hover{background:#dcdce1!important;filter:none!important;transform:none!important}
html body .clab-cur-btn::after,html body .clab-adbtn::after{display:none!important}
html body .clab-cur-btn .clab-adarr,html body .clab-adbtn .clab-adarr{animation:none!important}
html body .clab-cur-card{border:0!important;background:#f5f5f7!important;box-shadow:none!important;border-radius:14px!important}
html body .clab-cur-card:hover{transform:none!important;box-shadow:none!important;background:#efeff2!important}
html body .card[style*="border:1.5px solid #f5c6d3"]{border:0!important}
html body .card[style*="border:1.5px solid #f5c6d3"] > div:first-child{background:#f5f5f7!important;color:#1d1d1f!important}

/* 기존 id 범위 규칙보다 우선(상단 바) */
html body #clab-nav63-reference .logo-name .hl,html body .topnav .logo-name .hl{color:#1d1d1f!important;-webkit-text-fill-color:#1d1d1f!important;background:none!important}
html body #clab-nav63-reference .logo-mark,html body .topnav .logo-mark{background:#0071e3!important;background-image:none!important;box-shadow:none!important}
html body #clab-nav63-reference .nav-action,html body .topnav .nav-action{border:0!important;background:rgba(118,118,128,.12)!important;color:#1d1d1f!important;box-shadow:none!important}
html body #clab-nav63-reference .nav-back,html body .topnav .nav-back{border:0!important;background:rgba(118,118,128,.12)!important;color:#1d1d1f!important}

html body .topnav button,html body #clab-nav63-reference button{border:0!important;background:rgba(118,118,128,.12)!important;color:#1d1d1f!important;box-shadow:none!important}

/* 제목 앞 세로 막대·왼쪽 색 띠 제거 */
html body .card-title::before,html body .sec-title::before,html body .section-title::before{display:none!important}
html body .highlight,html body .art-section,html body .article-lead,html body .post-summary,html body .tip-box,html body .box.blue,html body .box.amber,html body .box.teal,html body .support-card,html body .action-card,html body .security-banner,html body .benefit-card{border-left-width:0!important;border-radius:14px!important}

/* 카테고리 페이지: 그라데이션 배너 대신 큰 제목, 배지 숨김 */
html body .page-banner{background:transparent!important;background-image:none!important;box-shadow:none!important;color:#1d1d1f!important;padding-left:4px!important;padding-right:4px!important}
html body .page-banner .banner-label{display:none!important}
html body .page-banner .banner-title{color:#1d1d1f!important;letter-spacing:-.035em!important;font-weight:700!important}
html body .page-banner .banner-desc{color:#6e6e73!important}
html body .tc-status{display:none!important}
html body .tool-card::before{display:none!important}
html body .tool-card{background:#fff!important;border:0!important;border-radius:18px!important;box-shadow:none!important}
html body .tool-card:hover{transform:none!important;box-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.06)!important}
html body .sec-label{color:#6e6e73!important}

/* 검토 반영(1차) */
/* 화면 밖 메뉴 서랍의 그림자가 왼쪽 가장자리에 비치던 문제 */
html body #clab-drawer{box-shadow:none!important;border-right:1px solid rgba(60,60,67,.13)!important}
/* 제목 바로 위의 라벨·배지(키커) 숨김 */
html:is(html,#cl-apple) body .badge-law,html:is(html,#cl-apple) body .eyebrow,html:is(html,#cl-apple) body .seo-eyebrow,
html body .badge-law,
html body :is(div,span,p)[class*="label"]:has(+ :is(h1,h2)),html body :is(div,span,p)[class*="kicker"]:has(+ :is(h1,h2)),
html body :is(div,span,p)[class*="badge"]:has(+ :is(h1,h2)),html body :is(div,span,p)[class*="eyebrow"]:has(+ :is(h1,h2,span)){display:none!important}
/* iOS 세그먼트: 회색 트랙 위 흰 손잡이 */
html body .side-tabs{background:rgba(118,118,128,.12)!important;border-radius:10px!important;padding:3px!important;gap:3px!important}
html body .side-btn,html body .mode-btn,html body .tnav,html body .tab{background:transparent!important;background-image:none!important;border:0!important;color:#1d1d1f!important;box-shadow:none!important;border-radius:8px!important}
html body .side-btn span{color:#6e6e73!important}
html body .side-btn.active,html body .mode-btn.active,html body .tnav.active,html body .tab.active{background:#fff!important;color:#1d1d1f!important;box-shadow:0 1px 3px rgba(0,0,0,.12),0 0 0 .5px rgba(0,0,0,.04)!important;border:0!important}
/* 다음 단계 카드: 라벨 숨김, 색은 무채색 + 파랑 화살표 */
html body .clab-next-step > span:nth-child(2) > span:first-child{display:none!important}
html body .clab-next-step > span:first-child{background:rgba(118,118,128,.12)!important}
html body .clab-next-step > span:last-child{background:transparent!important;color:#0071e3!important}
/* 결과 연동 쿠팡 추천(coupang-cta.js): 결과·인쇄 버튼 바로 아래 한 줄 카드. 계산 버튼(파랑)과 구분되는 검정 '보기' */
html:is(html,#cl-apple) body .clab-cta-wrap{margin-top:16px!important;margin-bottom:14px!important}
html:is(html,#cl-apple) body .clab-cta{display:flex!important;align-items:center;gap:12px;padding:14px 16px;background:#fff;border:1px solid rgba(60,60,67,.16);border-radius:14px;text-decoration:none!important;color:#1d1d1f!important;transition:box-shadow .2s,border-color .2s}
html:is(html,#cl-apple) body .clab-cta:hover{border-color:rgba(60,60,67,.28);box-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.06)}
html:is(html,#cl-apple) body .clab-cta-ico{flex:0 0 42px;width:42px;height:42px;border-radius:11px;background:#fff4e5;display:flex;align-items:center;justify-content:center;font-size:22px}
html:is(html,#cl-apple) body .clab-cta-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
html:is(html,#cl-apple) body .clab-cta-txt b{font-size:15px;font-weight:700;line-height:1.35;letter-spacing:-.01em;word-break:keep-all}
html:is(html,#cl-apple) body .clab-cta-txt small{font-size:12.5px;color:#6e6e73;line-height:1.4}
html:is(html,#cl-apple) body .clab-cta-btn{flex-shrink:0;padding:8px 15px;border-radius:999px;background:#1d1d1f;color:#fff;font-size:13px;font-weight:700}
html:is(html,#cl-apple) body .clab-cta-note{margin:6px 2px 0!important;font-size:11px!important;line-height:1.5!important;color:#86868b!important}
html:is(html,#cl-apple) body .clab-cta-note span{display:inline-block;margin-right:4px;padding:0 5px;border:1px solid rgba(60,60,67,.25);border-radius:4px;font-size:10px;font-weight:600;color:#6e6e73}
@media (max-width:640px){html:is(html,#cl-apple) body .clab-cta{padding:12px 13px;gap:10px} html:is(html,#cl-apple) body .clab-cta-txt b{font-size:14px} html:is(html,#cl-apple) body .clab-cta-btn{padding:7px 12px}}
/* 다음 단계 타일: 항상 가로 배치(아이콘·문구·화살표), 계산 전에는 common-features.js가 clab-ns-off로 숨김 */
html:is(html,#cl-apple) body a.clab-next-step{display:flex!important;align-items:center!important}
html:is(html,#cl-apple) body .clab-ns-off{display:none!important}
/* 도구 아이콘(카테고리 카드·관련 도구·다음 단계): 도구마다 대표 이모지 하나 */
html body .clab-ns-icon{width:40px;height:40px;border-radius:10px;display:flex!important;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
html body .clab-ns-arrow{width:32px;flex-shrink:0;text-align:center;font-size:18px;font-weight:700}
html body .related-icon{font-size:20px;flex-shrink:0}
/* 툴 제목 통일: 앱 아이콘처럼 흰 타일 + 굵은 검정 제목 + 회색 설명(회색 바탕에 묻히지 않게) */
html:is(html,#cl-apple) body h1[data-icon]{display:flex!important;align-items:center!important;gap:16px!important;font-size:40px!important;line-height:1.15!important;font-weight:800!important;letter-spacing:-.035em!important;color:#1d1d1f!important;-webkit-text-fill-color:#1d1d1f!important;background:none!important;margin-top:28px!important;margin-bottom:0!important;word-break:keep-all;text-align:left!important}
html:is(html,#cl-apple) body h1[data-icon]::before{content:attr(data-icon);content:attr(data-icon) / "";flex:0 0 auto;width:60px;height:60px;border-radius:15px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.05),0 0 0 1px rgba(0,0,0,.04);display:flex;align-items:center;justify-content:center;font-size:32px;line-height:1;letter-spacing:0}
html:is(html,#cl-apple) body h1[data-icon] + :is(p,div)[class*="tool-"]{font-size:16px!important;line-height:1.65!important;color:#6e6e73!important;margin:14px 0 28px!important;font-weight:400!important;max-width:712px;word-break:keep-all}
/* '2026 기준' 상자: 설명과 계산기 사이에 위아래 여백을 고정(설명 아래 16px, 상자 아래 28px) */
html:is(html,#cl-apple) body h1[data-icon] + [class*="tool-"]:has(+ .cl-fresh){margin-bottom:16px!important}
html:is(html,#cl-apple) body h1[data-icon] + .cl-fresh{margin-top:16px!important}
html:is(html,#cl-apple) body .cl-fresh{margin-top:0!important;margin-bottom:28px!important}
/* 상자가 제목 묶음의 마지막이면 묶음 아래 여백이 더해지므로 그만큼 빼고, 바로 뒤 계산기의 위 여백은 없앰 */
html:is(html,#cl-apple) body :is(.tool-header,.page):has(.cl-fresh) ~ :is(main.main,div.main),html:is(html,#cl-apple) body .cl-fresh ~ :is(main.main,div.main){padding-top:0!important}
html:is(html,#cl-apple) body .tool-header:has(> .cl-fresh:last-child){padding-bottom:0!important}
html:is(html,#cl-apple) body .cl-fresh + :is(div,section,form,main){margin-top:0!important}
@media (max-width:640px){html:is(html,#cl-apple) body .cl-fresh{margin-bottom:20px!important}
  html:is(html,#cl-apple) body h1[data-icon] + .cl-fresh{margin-top:12px!important}
  html:is(html,#cl-apple) body h1[data-icon] + [class*="tool-"]:has(+ .cl-fresh){margin-bottom:12px!important}}
/* 왼쪽 사이드바형 대시보드(17~21)는 좁은 칸에 맞춘 작은 판 */
html:is(html,#cl-apple) body :is(aside,.sb-header,.sidebar) h1[data-icon]{font-size:21px!important;gap:10px!important;margin-top:4px!important;letter-spacing:-.02em!important}
html:is(html,#cl-apple) body :is(aside,.sb-header,.sidebar) h1[data-icon]::before{width:38px;height:38px;border-radius:10px;font-size:20px}
@media (max-width:640px){
  html:is(html,#cl-apple) body h1[data-icon]{font-size:28px!important;gap:12px!important;margin-top:20px!important}
  html:is(html,#cl-apple) body h1[data-icon]::before{width:46px;height:46px;border-radius:12px;font-size:25px}
  html:is(html,#cl-apple) body h1[data-icon] + :is(p,div)[class*="tool-"]{font-size:15px!important;margin:10px 0 22px!important}}
/* 글꼴 하나로: 예전 'Noto Sans KR' 지정이 남은 요소가 시스템 글꼴로 바뀌어 보이던 문제(고정폭 숫자 요소는 제외) */
html:is(html,#cl-apple) body :not(code,pre,kbd,samp,svg,svg *,[class*="mono"],[class*="Mono"],[style*="Mono"],[style*="monospace"]){font-family:inherit!important}
/* 하단 안내(seo-section) 글자 체계 통일: 툴마다 없거나 제각각이던 크기·행간을 한 기준으로 */
html:is(html,#cl-apple) body .seo-section{font-size:14px!important;line-height:1.75!important;color:#1d1d1f}
html:is(html,#cl-apple) body .seo-section h2{font-size:19px!important;line-height:1.35!important;font-weight:700!important;letter-spacing:-.02em!important;margin:0 0 12px!important}
html:is(html,#cl-apple) body .seo-section h3{font-size:15px!important;line-height:1.45!important;font-weight:700!important;margin:22px 0 8px!important}
html:is(html,#cl-apple) body .seo-section :is(p,li){font-size:14px!important;line-height:1.75!important;color:#424245!important}
html:is(html,#cl-apple) body .seo-section p{margin:0 0 10px!important}
html:is(html,#cl-apple) body .seo-section :is(td,th){font-size:13.5px!important;line-height:1.55!important}
/* 자주 묻는 질문: 92번 툴 모양을 전 툴 기준으로(질문 14px/500, 오른쪽 +/−, 얇은 구분선, 답 14px 회색) */
html:is(html,#cl-apple) body details.seo-faq{display:block!important;padding:13px 0!important;margin:0!important;border:0!important;border-bottom:1px solid rgba(60,60,67,.13)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
html:is(html,#cl-apple) body details.seo-faq > summary{display:flex!important;justify-content:space-between!important;align-items:flex-start!important;gap:12px!important;list-style:none!important;cursor:pointer;padding:0!important;margin:0!important;font-size:14px!important;font-weight:500!important;line-height:1.75!important;color:#1d1d1f!important;background:transparent!important}
html:is(html,#cl-apple) body details.seo-faq > summary::-webkit-details-marker{display:none!important}
html:is(html,#cl-apple) body details.seo-faq > summary::marker{content:""!important}
html:is(html,#cl-apple) body details.seo-faq > summary::before{content:none!important;display:none!important}
html:is(html,#cl-apple) body details.seo-faq > summary::after{content:"+"!important;display:block!important;flex-shrink:0;font-size:14px!important;font-weight:700!important;color:#6e6e73!important;margin:0!important;transform:none!important;background:none!important;width:auto!important;height:auto!important;border:0!important}
html:is(html,#cl-apple) body details.seo-faq[open] > summary::after{content:"−"!important}
html:is(html,#cl-apple) body details.seo-faq > :not(summary){font-size:14px!important;line-height:1.75!important;color:#424245!important;margin:8px 0 0!important;padding:0!important;background:transparent!important;border:0!important}
html:is(html,#cl-apple) body details.seo-faq > :not(summary) :is(p,li){font-size:14px!important;line-height:1.75!important;color:#424245!important}
/* 함께 쓰면 좋은 도구: 93번 툴 형식을 전 툴 기준으로(6개, PC 2열·모바일 1열, 간격 14px, 카드 14×16 여백·14px 모서리) */
html:is(html,#cl-apple) body .related-tools{margin-top:32px!important;margin-bottom:20px!important}
html:is(html,#cl-apple) body .related-tools .rt-label{font-size:12px!important;font-weight:800!important;color:#6e6e73!important;margin:0 0 12px!important;padding:0!important;background:none!important;border:0!important}
html:is(html,#cl-apple) body .related-tools .rt-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;margin:0!important;padding:0!important}
html:is(html,#cl-apple) body .related-tools .rt-card{display:flex!important;align-items:center!important;gap:10px!important;padding:14px 16px!important;min-height:70px;margin:0!important;border:0!important;border-radius:14px!important;background:#fff!important;box-shadow:none!important;text-decoration:none!important;box-sizing:border-box!important;transform:none!important}
html:is(html,#cl-apple) body .related-tools .rt-card:hover{box-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.06)!important}
html:is(html,#cl-apple) body .related-tools .rt-icon{width:36px!important;height:36px!important;flex:0 0 36px!important;border-radius:8px!important;background:#f0f2f8!important;font-size:20px!important;display:flex!important;align-items:center!important;justify-content:center!important;margin:0!important}
html:is(html,#cl-apple) body .related-tools .rt-name{font-size:14px!important;font-weight:700!important;line-height:1.5!important;color:#1d1d1f!important;margin:0 0 3px!important}
html:is(html,#cl-apple) body .related-tools .rt-cat{font-size:12px!important;line-height:1.5!important;color:#6e6e73!important;margin:2px 0 0!important}
@media (max-width:640px){html:is(html,#cl-apple) body .related-tools .rt-grid{grid-template-columns:1fr!important;--rw:calc(100vw - 32px);width:var(--rw)!important;max-width:none!important;margin-left:calc(50% - var(--rw)/2)!important;margin-right:calc(50% - var(--rw)/2)!important;box-sizing:border-box!important}
  html:is(html,#cl-apple) body .related-tools .rt-grid > .rt-card{width:auto!important;max-width:none!important;margin:0!important}}
/* 툴 안 상자 폭 통일: cl-rail 표시된 상자는 툴마다 한 폭(기본 712px, 대시보드형 1152px)으로, 부모 안쪽 여백과 관계없이 가운데 정렬 */
:root{--rail:712px}
/* 641px 이상(태블릿 포함)은 PC 레일을 적용 — 예전엔 641~899px에 규칙이 없어 상자 폭이 제각각이었음(2026-11-04) */
@media (min-width:641px){html:is(html,#cl-apple) body :is(.cl-rail-d,.related-tools .rt-grid,a.clab-next-step){--rw:min(var(--rail),calc(100vw - 48px));width:var(--rw)!important;max-width:none!important;margin-left:calc(50% - var(--rw)/2)!important;margin-right:calc(50% - var(--rw)/2)!important;box-sizing:border-box!important}}
@media (max-width:640px){html:is(html,#cl-apple) body :is(.cl-rail-m,a.clab-next-step,#clist,#sectionsContainer,#calGrid,#calcArea,#quotesGrid,#t71list,#checklistWrap,#wreathAd85,.main>.stats-grid,.main>.alert-banner,#summaryContent>*,#overviewContent>*){--rw:calc(100vw - 32px);width:var(--rw)!important;max-width:none!important;margin-left:calc(50% - var(--rw)/2)!important;margin-right:calc(50% - var(--rw)/2)!important;box-sizing:border-box!important}}
/* 검토 반영(2차): 이름이 제각각인 키커·카테고리 알약을 규칙으로 숨김 */
html:is(html,#cl-apple) body [class*="eyebrow"],html:is(html,#cl-apple) body [class*="kicker"],html:is(html,#cl-apple) body .post-cat,
html:is(html,#cl-apple) body :is(div,span)[class]:has(+ h1),html:is(html,#cl-apple) body .main > :is(div,span)[class]:has(+ :is(div,span) + h1){display:none!important}
/* 결과 대기 화면의 큰 이모지 숨김 */
html body #resultPlaceholder > div:first-child[style*="font-size:48px"]{display:none!important}
/* 결과 칸 폭을 입력 카드와 맞춤 */
html body .result-panel{max-width:712px!important;width:100%!important;margin-left:auto!important;margin-right:auto!important}
/* 글자 크기 하한: 카드 제목이 입력 라벨보다 크게, 보조 글씨 12.5px 이상 */
html body .card-title{font-size:17px!important}
html body .fg-label,html body .fg label,html body .hint,html body .fg-hint,html body .sb-label{font-size:13px!important}

/* 하단 */
html body footer,html body .cl-footer-links{color:#86868b!important}
html body footer a,html body .cl-footer-links a{color:#424245!important}

/* 움직임 줄이기: 반짝임·맥박 효과 제거 */
@media (prefers-reduced-motion:reduce){html body *{animation:none!important;transition:none!important}}

/* 641~899px: 다음 단계 타일이 감싼 div 여백(24px) 때문에 카드보다 좁아지던 문제 */
@media (min-width:641px) and (max-width:899px){html:is(html,#cl-apple) body div:has(>a.clab-next-step){max-width:none!important;padding-left:0!important;padding-right:0!important}}

/* 쿠팡 추천 카드: 은은한 빛 지나감 + 보기 버튼 맥박(눈길만, 과하지 않게) */
html:is(html,#cl-apple) body .clab-cta{position:relative;overflow:hidden}
html:is(html,#cl-apple) body .clab-cta::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-18deg);animation:clabCtaShine 4.5s ease-in-out 1s infinite;pointer-events:none}
html:is(html,#cl-apple) body .clab-cta-ico{animation:clabCtaNudge 4.5s ease-in-out 1s infinite}
html:is(html,#cl-apple) body .clab-cta-btn{animation:clabCtaPulse 2.4s ease-out infinite}
html:is(html,#cl-apple) body .clab-cta:hover .clab-cta-btn{animation:none;transform:translateX(2px)}
@keyframes clabCtaShine{0%,62%{left:-40%}100%{left:120%}}
@keyframes clabCtaNudge{0%,70%,100%{transform:none}76%{transform:rotate(-8deg) scale(1.06)}82%{transform:rotate(6deg) scale(1.06)}88%{transform:none}}
@keyframes clabCtaPulse{0%{box-shadow:0 0 0 0 rgba(29,29,31,.35)}70%,100%{box-shadow:0 0 0 9px rgba(29,29,31,0)}}
@media (prefers-reduced-motion:reduce){html:is(html,#cl-apple) body :is(.clab-cta::after,.clab-cta-ico,.clab-cta-btn){animation:none!important}}
html:is(html,#cl-apple) body .clab-cta-note{margin-left:4px!important;text-align:left}

/* 공통 서체 통일 규칙이 덮어쓰던 미리보기 서체 복구: 91 봉투(궁서·명조), 94 내용증명 용지(명조) */
html:is(html,#cl-apple) body :is(.envelope.st-gungseo,.envelope.st-gungseo *){font-family:'JoseonPalace','Gungsuh','GungsuhChe','궁서',Batang,'바탕',serif!important}
html:is(html,#cl-apple) body :is(.envelope.st-serif,.envelope.st-serif *){font-family:'Noto Serif KR','Nanum Myeongjo',Batang,'바탕','AppleMyungjo',serif!important}
html:is(html,#cl-apple) body :is(.envelope.st-sans,.envelope.st-sans *){font-family:'Noto Sans KR','Malgun Gothic','맑은 고딕','Apple SD Gothic Neo',sans-serif!important}
html:is(html,#cl-apple) body :is(.paper,.paper *){font-family:'Noto Serif KR','Noto Serif',Batang,'바탕','AppleMyungjo',serif!important}
/* PC 전용 QR(휴대폰으로 보기): 카드 오른쪽 작은 정사각, 마우스 올리면 크게 */
html:is(html,#cl-apple) body .clab-cta-row{display:flex;gap:10px;align-items:stretch}
html:is(html,#cl-apple) body .clab-cta-row>.clab-cta{flex:1;min-width:0}
html:is(html,#cl-apple) body .clab-cta-qr{position:relative;flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:6px 8px;background:#fff;border:1px solid rgba(60,60,67,.16);border-radius:14px;cursor:zoom-in}
html:is(html,#cl-apple) body .clab-cta-qr-img{display:block;width:52px;height:52px;transition:transform .2s ease;transform-origin:right center;background:#fff;border-radius:6px}
html:is(html,#cl-apple) body .clab-cta-qr-img img,html:is(html,#cl-apple) body .clab-cta-qr-img canvas{display:block;width:100%!important;height:100%!important}
html:is(html,#cl-apple) body .clab-cta-qr small{font-size:10.5px;font-weight:600;color:#6e6e73;white-space:nowrap;line-height:1.2}
html:is(html,#cl-apple) body .clab-cta-qr:hover .clab-cta-qr-img{transform:scale(2.6);position:relative;z-index:5;box-shadow:0 8px 30px rgba(0,0,0,.18);padding:3px}
/* 결과 저장 버튼 묶음을 폭 레일에 올렸을 때 옛 좌우 여백(24px) 제거 → 버튼이 다른 박스와 같은 폭 */
html:is(html,#cl-apple) body #saveResultBtnWrap.cl-rail-d{padding-left:0!important;padding-right:0!important}

/* 기존 쿠팡 버튼·상품 상자 → 결과 연동 카드와 같은 모양(coupang-cta.js unify) */
html:is(html,#cl-apple) body .clab-u-host{display:flex!important;flex-direction:column!important;gap:10px!important;grid-template-columns:none!important}
html:is(html,#cl-apple) body .clab-cta-u{width:100%;box-sizing:border-box;text-align:left}
html:is(html,#cl-apple) body .clab-cta-u + .clab-cta-u{margin-top:10px}
html:is(html,#cl-apple) body .clab-u-host > .clab-cta-u + .clab-cta-u{margin-top:0}
html:is(html,#cl-apple) body .clab-cta-u .clab-cta-txt b{color:#1d1d1f}
html:is(html,#cl-apple) body .clab-cta-note{display:block!important;background:none!important;border:0!important;padding:0!important}
/* 카테고리 페이지: 제목에 아이콘 칸(툴 제목과 같은 형식), 하단 실무 가이드 상자를 위 박스들과 같은 폭으로 */
html:is(html,#cl-apple) body .page-banner h1.banner-title[data-icon]{margin-top:8px!important}
html:is(html,#cl-apple) body .page-banner h1.banner-title[data-icon] + .banner-desc{margin-top:14px!important;font-size:16px!important;line-height:1.65!important;color:#6e6e73!important;word-break:keep-all}
html:is(html,#cl-apple) body .art-wrap{background:transparent!important;border:0!important;box-shadow:none!important;padding-left:0!important;padding-right:0!important}
html:is(html,#cl-apple) body .art-wrap .art-section{background:#fff!important;border:0!important;border-radius:16px!important;padding:20px 22px!important;box-shadow:none!important}
@media (max-width:700px){
  html:is(html,#cl-apple) body .art-wrap{margin-left:0!important;margin-right:0!important}
  html:is(html,#cl-apple) body .art-wrap .art-section{padding:18px 18px!important}
  html:is(html,#cl-apple) body .page-banner h1.banner-title[data-icon] + .banner-desc{font-size:15px!important;margin-top:10px!important}}@media (max-width:700px){
  /* 가이드 카드 묶음: 이중 여백(16+16) 제거 → 위 박스들과 같은 16px 줄 */
  html:is(html,#cl-apple) body div:has(>.guide-cards-grid){padding-left:0!important;padding-right:0!important}
  html:is(html,#cl-apple) body .wrap > div:has(.guide-cards-grid):not(.tools-section){padding-left:16px!important;padding-right:16px!important}
  /* 바깥 여백 없이 화면 끝까지 붙던 실무 체크 상자 */
  html:is(html,#cl-apple) body .wrap > section.cl-step23-depth{margin-left:16px!important;margin-right:16px!important;width:auto!important;max-width:none!important}}@media (max-width:700px){html:is(html,#cl-apple) body .category-guides > .guide-cards-grid{margin-left:14px!important;margin-right:14px!important;width:auto!important}}

/* 다음 단계 타일 통일(2026-11-04): 결과 저장(파란 버튼)과 짝을 이루는 연한 파랑 판 + '다음 단계' 표시 + 파란 원형 화살표.
   광고 카드(흰 판·테두리·검정 '보기')와는 색·모양이 겹치지 않게 */
html:is(html,#cl-apple) body a.clab-next-step{background:#eef5ff!important;border:0!important;border-radius:14px!important;box-shadow:none!important;padding:14px 16px!important;gap:12px!important;margin-top:12px!important;color:#1d1d1f!important;transition:background .15s!important;animation:none!important}
html:is(html,#cl-apple) body a.clab-next-step:hover{background:#e3eefc!important;transform:none!important}
html:is(html,#cl-apple) body a.clab-next-step > .clab-ns-icon,html:is(html,#cl-apple) body a.clab-next-step > span:first-child:not(:only-child){width:40px!important;height:40px!important;border-radius:11px!important;background:#fff!important;box-shadow:none!important;font-size:20px!important}
html:is(html,#cl-apple) body a.clab-next-step > span:nth-child(2) > span:first-child{display:block!important;font-size:11px!important;font-weight:700!important;color:#0071e3!important;margin-bottom:2px!important;letter-spacing:0!important}
html:is(html,#cl-apple) body a.clab-next-step > span:nth-child(2) > span:nth-child(2){font-size:15px!important;font-weight:700!important;color:#1d1d1f!important;letter-spacing:-.01em!important}
html:is(html,#cl-apple) body a.clab-next-step > span:nth-child(2) > span:nth-child(3){font-size:12.5px!important;color:#6e6e73!important}
html:is(html,#cl-apple) body a.clab-next-step > span:last-child{width:32px!important;height:32px!important;border-radius:50%!important;background:#0071e3!important;color:#fff!important;display:flex!important;align-items:center;justify-content:center;font-size:16px!important;font-weight:700!important;flex-shrink:0}
/* 결과 저장 버튼 바로 아래(같은 묶음 안·바로 다음)일 때 간격 10px로 붙여 한 세트처럼 */
html:is(html,#cl-apple) body #saveResultBtnWrap + a.clab-next-step,html:is(html,#cl-apple) body #saveResultBtnWrap a.clab-next-step{margin-top:10px!important}html:is(html,#cl-apple) body .clab-cta-txt small{display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* clab-table-fill: 읽을거리 표 — 모바일에서 표가 블록으로 바뀌며 칸이 끝까지 안 늘어나던 문제. 감싸는 상자가 가로 스크롤을 맡고 표는 폭을 채움 */
html:is(html,#cl-apple) body :is(.clab-table-scroll,.seo-tw){overflow-x:auto!important;-webkit-overflow-scrolling:touch}
html:is(html,#cl-apple) body :is(.clab-table-scroll,.seo-tw)>table{display:table!important;width:100%!important;max-width:none!important}
