/* 차똑 고객센터 (/help) — cs.js 가 그린다. 클래스는 전부 cs- 로 시작해 다른 화면과 안 겹친다.
   토스 문법: 큰 제목 하나, 떠 있는 흰 면, 주버튼 하나 꽉 차게. 버튼·입력 높이 44px+, 입력 글자 16px(아이폰 확대 방지). */
.cs-hero{padding:8px 0 4px;text-align:left}
.cs-hero h1{font:800 26px/1.3 var(--kr);letter-spacing:-.03em;margin:4px 0 16px;color:var(--ink)}
.cs-ddoki{width:84px;height:84px;margin:0 0 4px}
.cs-ddoki img,.cs-ddoki svg{width:100%;height:100%;object-fit:contain}
.cs-done .cs-ddoki{margin:8px auto 4px;width:120px;height:120px}
.cs-search{display:flex;align-items:center;gap:8px;background:var(--surface,#fff);border-radius:16px;padding:0 14px;min-height:54px;
  box-shadow:var(--sh-1),var(--hi,none),inset 0 0 0 1px var(--line)}
.cs-search input{flex:1;border:0;outline:0;background:transparent;font:500 16px/1.4 var(--kr);color:var(--ink);min-width:0;padding:14px 0}
.cs-search:focus-within{box-shadow:var(--sh-1),inset 0 0 0 2px var(--mint,#00C8A8)}

.cs-urgent{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0 8px}
.cs-u{display:flex;flex-direction:column;gap:3px;padding:16px 14px;border-radius:var(--r-lg,18px);background:var(--surface,#fff);text-decoration:none;color:var(--ink);
  box-shadow:var(--sh-1),var(--hi,none);min-height:44px;transition:transform .12s}
.cs-u:active{transform:scale(.98)}
.cs-u-i{font-size:24px;line-height:1;margin-bottom:6px}
.cs-u b{font:700 15px/1.35 var(--kr);letter-spacing:-.02em}
.cs-u em{font:500 12.5px/1.4 var(--kr);font-style:normal;color:var(--stone)}

.cs-sec{margin:22px 0 8px}
.cs-sec h2{font:700 18px/1.3 var(--kr);letter-spacing:-.025em;margin:0 0 12px;color:var(--ink)}
.cs-h1{font:800 24px/1.32 var(--kr);letter-spacing:-.03em;margin:6px 0 14px;color:var(--ink)}
.cs-center{text-align:center}

.cs-tabs{display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -2px 12px;padding:2px;scrollbar-width:none}
.cs-tabs::-webkit-scrollbar{display:none}
.cs-tabs button{flex:none;min-height:38px;padding:0 14px;border-radius:999px;border:0;background:var(--surface,#fff);color:var(--stone);
  font:600 14px/1 var(--kr);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer}
.cs-tabs button.on{background:var(--ink);color:#fff;box-shadow:none}

.cs-faq{background:var(--surface,#fff);border-radius:16px;margin:0 0 8px;box-shadow:var(--sh-1),var(--hi,none);overflow:hidden}
.cs-faq summary{list-style:none;cursor:pointer;padding:16px 44px 16px 16px;font:600 15.5px/1.45 var(--kr);letter-spacing:-.02em;color:var(--ink);position:relative;min-height:44px}
.cs-faq summary::-webkit-details-marker{display:none}
.cs-faq summary::after{content:"";position:absolute;right:16px;top:50%;width:9px;height:9px;border-right:2px solid var(--stone2,#999);border-bottom:2px solid var(--stone2,#999);transform:translateY(-70%) rotate(45deg);transition:transform .15s}
.cs-faq[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.cs-a{padding:0 16px 16px;font:400 14.5px/1.7 var(--kr);color:var(--stone)}
.cs-a p{margin:0}
.cs-a b{color:var(--ink);font-weight:600}
.cs-links{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px!important}
.cs-links a{color:var(--mint-txt,#00806E);font-weight:600;text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
.cs-empty{padding:16px;border-radius:16px;background:var(--inset,#EFFAF6);color:var(--stone);font-size:14.5px}

.cs-btn{display:flex;align-items:center;justify-content:center;text-decoration:none;margin-top:10px;width:100%;box-sizing:border-box}
.cs-info{list-style:none;padding:4px 16px;margin:14px 0 0;background:var(--surface,#fff);border-radius:16px;box-shadow:var(--sh-1),var(--hi,none)}
.cs-info li{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--inset,#eee);font-size:14px}
.cs-info li:last-child{border-bottom:0}
.cs-info span{color:var(--stone);flex:none}
.cs-info b{color:var(--ink);font-weight:600;text-align:right}
.cs-info small{color:var(--stone);font-weight:400}
.cs-info a{color:var(--ink)}

/* 1:1 문의 — 유형 고르기 */
.cs-cats{display:grid;grid-template-columns:1fr;gap:8px}
.cs-cat{display:grid;grid-template-columns:32px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;text-align:left;padding:13px 14px;border-radius:16px;border:0;cursor:pointer;
  background:var(--surface,#fff);box-shadow:var(--sh-1),var(--hi,none);color:var(--ink);min-height:56px}
.cs-cat span{grid-row:span 2;font-size:22px;line-height:1;text-align:center}
.cs-cat b{font:600 15px/1.35 var(--kr);letter-spacing:-.02em}
.cs-cat em{font:400 12.5px/1.4 var(--kr);font-style:normal;color:var(--stone)}
.cs-cat.on{box-shadow:inset 0 0 0 2px var(--mint,#00C8A8),var(--sh-1)}

.cs-form{background:var(--surface,#fff);border-radius:var(--r-lg,18px);padding:18px 16px;box-shadow:var(--sh-1),var(--hi,none)}
.cs-f{display:grid;gap:6px;margin:0 0 14px}
.cs-f>span{font:600 14px/1.3 var(--kr);color:var(--ink)}
.cs-f small{font-weight:400;color:var(--stone)}
.cs-f input,.cs-f textarea,.cs-reply textarea{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:12px;background:var(--page,#fff);
  font:500 16px/1.5 var(--kr);color:var(--ink);padding:13px 14px;min-height:50px;outline:0}
.cs-f textarea,.cs-reply textarea{resize:vertical}
.cs-f input:focus,.cs-f textarea:focus,.cs-reply textarea:focus{border-color:var(--mint,#00C8A8);box-shadow:0 0 0 3px rgba(0,200,168,.18)}
.cs-agree{display:flex;gap:10px;align-items:flex-start;font:400 13px/1.55 var(--kr);color:var(--stone);margin:4px 0 6px;cursor:pointer}
.cs-agree input{width:22px;height:22px;flex:none;margin:1px 0 0;accent-color:var(--mint-dk,#00A88C)}
.cs-agree b{color:var(--ink)}
.cs-err{color:var(--terra,#C8432F);font:600 14px/1.5 var(--kr);margin:8px 0 0}

.cs-done{text-align:center}
.cs-done p{color:var(--stone);line-height:1.7}
.cs-done b{color:var(--ink)}

/* 내 문의 — 대화 */
.cs-tk-head{margin-bottom:4px}
.cs-badge{display:inline-block;padding:5px 10px;border-radius:999px;font:700 12px/1 var(--kr);background:var(--inset,#EFFAF6);color:var(--stone)}
.cs-badge.open{background:#FFF1D6;color:#8E6B00}
.cs-badge.answered{background:#DDF6EE;color:#00806E}
.cs-thread{display:flex;flex-direction:column;gap:10px;margin:14px 0}
.cs-m{max-width:86%;display:flex;flex-direction:column;gap:3px}
.cs-m.me{align-self:flex-end;align-items:flex-end}
.cs-m.staff{align-self:flex-start}
.cs-m-who{font:600 12px/1 var(--kr);color:var(--stone);margin-left:4px}
.cs-m-b{padding:12px 14px;border-radius:18px;font:400 15px/1.6 var(--kr);word-break:keep-all;overflow-wrap:anywhere}
.cs-m.me .cs-m-b{background:var(--mint,#00C8A8);color:var(--on-mint,#04302A);border-radius:18px 18px 6px 18px}
.cs-m.staff .cs-m-b{background:var(--surface,#fff);color:var(--ink);box-shadow:var(--sh-1),inset 0 0 0 1px var(--line);border-radius:18px 18px 18px 6px}
.cs-m time{font:500 11px/1 var(--kr);color:var(--stone2,#999);margin:0 4px}
.cs-sys{align-self:center;font:500 12.5px/1.5 var(--kr);color:var(--stone);background:var(--inset,#EFFAF6);padding:6px 12px;border-radius:999px;text-align:center}
.cs-reply{display:grid;gap:4px}

/* 신고 */
.cs-ev{background:var(--surface,#fff);border-radius:16px;padding:14px 16px;box-shadow:var(--sh-1),var(--hi,none)}
.cs-ev b{display:block;font:700 16px/1.4 var(--kr);color:var(--ink)}
.cs-ev span{font:500 13px/1.4 var(--kr);color:var(--stone)}
.cs-ev p{margin:8px 0 0;font:400 14.5px/1.55 var(--kr);color:var(--ink);background:var(--inset,#EFFAF6);padding:8px 10px;border-radius:10px}
.cs-reasons{display:grid;gap:8px;margin:0 0 14px}
.cs-reason{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 14px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;font:500 15px/1.3 var(--kr);color:var(--ink)}
.cs-reason input{width:20px;height:20px;accent-color:var(--mint-dk,#00A88C)}
.cs-reason:has(input:checked){box-shadow:inset 0 0 0 2px var(--mint,#00C8A8);background:var(--inset,#EFFAF6)}

@media (min-width:420px){.cs-cats{grid-template-columns:1fr 1fr}}
/* 찍은 분(차주가 아닌 분) — 고객이 아니라 셀프 안내만. 한 톤 낮춰 맨 아래 */
.cs-guest{margin-top:34px;padding-top:22px;border-top:1px solid var(--line)}
.cs-guest h2{font-size:16px;color:var(--stone)}
.cs-guest .hint{margin:-6px 0 12px}
.cs-guest .cs-faq{box-shadow:inset 0 0 0 1px var(--line);background:transparent}