
/* ── 채팅 위젯 ── 모서리 16px·알약, 그림자 있음 (2026-09-03 개정)
   ⚠️ 이 스타일은 `fixes.html` 보다 뒤에 실립니다. 전역 규칙이 안 닿으니
   여기 값이 최종입니다. 사이트 전역을 바꿀 때 이 파일도 같이 봐야 합니다. */
/* z-index 주의 — 헤더(`.gnb`)는 **200** 입니다. 원본 HTML 에는 100 으로 적혀 있지만
   빌드 패치가 올려 놓습니다. 120 으로 뒀더니 모바일 전체화면에서 채팅 헤더와 닫기 버튼이
   사이트 헤더에 가려져 창을 닫을 수가 없었습니다. 원본만 보고 정하지 마십시오. */
.gc-l{position:fixed;right:24px;bottom:24px;z-index:300;display:flex;align-items:center;gap:9px;
  padding:13px 18px;border:0;border-radius:999px;color:var(--navy);
  font-family:inherit;font-size:15px;font-weight:700;letter-spacing:-.02em;cursor:pointer;
  background:rgba(255,255,255,.62);color:var(--mint-800,#12459E);
  -webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);
  box-shadow:0 0 0 1px rgba(77,141,255,.55),inset 0 1px 0 rgba(255,255,255,.9),0 12px 28px -18px rgba(16,20,28,.35);
  transition:background .2s ease,transform .2s ease}
.gc-l:hover{background:rgba(255,255,255,.8);transform:translateY(-1px)}
.gc-l i{background:var(--mint)}
.gc-l[hidden]{display:none}
.gc-l i{width:7px;height:7px;border-radius:50%;background:var(--navy);display:block;flex:0 0 auto}
.gc-l.off i{opacity:.42}

/* 사이트 본문 스타일이 새어 들어오는 것을 막습니다.
   위젯을 `<section>` 으로 만들었더니 `section{padding:120px 0}` 이 그대로 먹어
   패널 아래에 빈 공간이 235px 생겼습니다. 태그는 `<div>` 로 바꿨고, 그래도
   본문 규칙이 닿는 자식들(p·form·button)은 여기서 초기화합니다. */
.gc-p,.gc-p *{padding:0;margin:0;box-sizing:border-box}
.gc-p{position:fixed;right:24px;bottom:24px;z-index:1000;width:376px;max-height:min(620px,calc(100vh - 48px));
  display:flex;flex-direction:column;background:var(--navy);border:1px solid var(--border-dark);
  border-radius:16px;overflow:hidden;
  box-shadow:0 0 0 1px rgba(255,255,255,.06),0 30px 60px -24px rgba(0,0,0,.8)}
.gc-p[hidden]{display:none}

.gc-h{padding:18px 20px;border-bottom:1px solid var(--border-dark);flex:0 0 auto}
.gc-h .t{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:700;color:#fff;letter-spacing:-.02em}
.gc-h .t i{width:7px;height:7px;border-radius:50%;background:var(--mint);flex:0 0 auto}
.gc-h.off .t i{background:var(--slate-dark)}
.gc-h .d{margin-top:7px;font-size:12.5px;line-height:1.55;color:var(--slate-dark);word-break:keep-all}
.gc-x{position:absolute;right:14px;top:14px;width:30px;height:30px;border:0;border-radius:50%;background:none;
  color:var(--slate-dark);font-size:19px;line-height:1;cursor:pointer}
.gc-x:hover{color:#fff}

.gc-b{flex:1 1 auto;overflow-y:auto;padding:18px 20px;display:flex;flex-direction:column;gap:14px}
.gc-m{max-width:86%;font-size:14.5px;line-height:1.6;word-break:keep-all;white-space:pre-wrap}
.gc-m.me{align-self:flex-end;background:var(--mint);color:var(--navy);padding:10px 13px;font-weight:500;
  border-radius:16px 16px 4px 16px}
.gc-m.you{align-self:flex-start;background:var(--ghost-dark,#1B2233);color:#fff;padding:10px 13px;
  border-radius:16px 16px 16px 4px}
.gc-m .who{display:block;margin-bottom:5px;font-size:11px;font-weight:800;letter-spacing:.1em;color:var(--mint)}
.gc-m.sys{align-self:stretch;max-width:none;font-size:12.5px;color:var(--slate-dark);
  border-left:2px solid var(--border-dark);padding-left:11px}

.gc-f{flex:0 0 auto;border-top:1px solid var(--border-dark);padding:12px 14px}
.gc-f form{display:flex;gap:8px;align-items:flex-end}
.gc-f textarea,.gc-f input{flex:1 1 auto;background:var(--navy-alt);border:1px solid var(--border-dark);
  color:#fff;font-family:inherit;font-size:16px;line-height:1.5;padding:11px 12px;resize:none;max-height:120px;
  border-radius:16px}
.gc-f textarea:focus,.gc-f input:focus{outline:none;border-color:var(--mint)}
.gc-f button{flex:0 0 auto;border:0;border-radius:999px;background:var(--mint);color:var(--navy);
  font-family:inherit;font-size:14px;font-weight:700;padding:12px 18px;cursor:pointer}
.gc-f button:disabled{opacity:.45;cursor:default}
.gc-n{margin-top:9px;font-size:11.5px;line-height:1.55;color:var(--slate-dark)}
.gc-n a{color:var(--slate-dark);text-decoration:underline}

@media (max-width:640px){
  .gc-l{right:16px;bottom:16px;padding:12px 16px;font-size:14px}
  .gc-p{right:0;bottom:0;left:0;top:0;width:auto;max-height:none;border:0;border-radius:0;box-shadow:none}
}
@media (prefers-reduced-motion:reduce){.gc-l{transition:none}}
