/*! ChewGumi UI Tokens v1 · MedIT
    페이지마다 달랐던 버튼·간격·글자 크기를 한 곳에서 맞춘다 */

:root{
  /* 버튼 높이 — 3단계만 쓴다 */
  --h-lg:52px;   /* 주요 동작 (결제·신청) */
  --h-md:44px;   /* 보조 동작 */
  --h-sm:36px;   /* 작은 조작 */
  /* 글자 */
  --fs-lg:15px;
  --fs-md:13.5px;
  --fs-sm:12px;
  /* 모서리 */
  --r-card:22px;
  --r-pill:999px;
  --ease:cubic-bezier(.32,.72,0,1);
}

/* ── 주요 버튼 ── */
.btn,.plan .go button,.uf-act .go,.bk-b.open{
  display:inline-flex !important;align-items:center !important;justify-content:center !important;
  height:var(--h-lg) !important;padding:0 24px !important;
  border-radius:var(--r-pill) !important;
  font-family:inherit !important;font-size:var(--fs-lg) !important;font-weight:700 !important;
  line-height:1 !important;border:0;cursor:pointer;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease) !important}
.btn:active,.plan .go button:active,.uf-act .go:active{transform:scale(.97) !important}
.btn:disabled{opacity:.45 !important;box-shadow:none !important;cursor:not-allowed;transform:none !important}

/* 폭 100%가 필요한 자리 */
.plan .go button,.form .btn,.uf-act button{width:100% !important}

/* ── 보조 버튼 ── */
.btn.ghost,.mini,.ct-b,.ps-btn,.bk-b,.acts a,.acts button,.fav-edit{
  display:inline-flex !important;align-items:center !important;justify-content:center !important;
  height:var(--h-md) !important;padding:0 18px !important;
  border-radius:var(--r-pill) !important;
  font-family:inherit !important;font-size:var(--fs-md) !important;font-weight:700 !important;
  line-height:1 !important;cursor:pointer;
  transition:transform .35s var(--ease) !important}
.btn.ghost:active,.mini:active,.ct-b:active,.ps-btn:active{transform:scale(.96) !important}

/* ── 작은 버튼 ── */
.chips button,.tabs button,.h-dots button,.bl-tabs button{
  font-family:inherit;line-height:1}
.chips button,.bl-tabs button{
  height:var(--h-sm) !important;padding:0 15px !important;
  font-size:var(--fs-sm) !important;border-radius:var(--r-pill) !important}

/* ── 탭 (구독 페이지 등) ── */
.tabs a{
  display:flex !important;flex-direction:column !important;
  align-items:center !important;justify-content:center !important;
  min-height:56px !important;padding:9px 20px !important;
  border-radius:var(--r-pill) !important;
  font-size:var(--fs-md) !important;font-weight:700 !important;line-height:1.25 !important;
  transition:transform .3s var(--ease),background .3s,color .3s !important}
.tabs a small{font-size:10px !important;font-weight:500 !important;
  margin-top:3px !important;opacity:.72;letter-spacing:.3px}
.tabs a:active{transform:scale(.96) !important}

/* ── 입력 ── */
input,select,textarea{
  min-height:var(--h-md);
  padding:0 14px;border-radius:14px !important;
  font-size:var(--fs-md) !important;font-family:inherit}
textarea{padding:12px 14px;min-height:80px;line-height:1.7}
label{font-size:var(--fs-sm) !important;font-weight:600 !important}

/* ── 카드 · 패널 모서리 통일 ── */
.panel,.card,.plan,.form,.comm-card,.perk,.stat{border-radius:var(--r-card) !important}

/* ── 섹션 여백 통일 ── */
.head,.sec-head{margin-bottom:24px}

/* ── 모바일 ── */
@media(max-width:640px){
  :root{--h-lg:50px;--h-md:42px;--fs-lg:14.5px;--fs-md:13px}
  .tabs a{min-height:52px !important;padding:8px 15px !important}
  .btn,.plan .go button{padding:0 18px !important}
}

/* ── 세그먼트 탭 (게시판·구독 공통) ── */
.bl-tabs,.ptab{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:0 !important;
  border-radius:15px !important;overflow:hidden !important;
  border:.5px solid rgba(255,255,255,.85) !important;
  background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(255,255,255,.68)) !important;
  backdrop-filter:blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter:blur(20px) saturate(180%) !important;
  box-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 22px rgba(0,0,0,.07),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
  margin-bottom:16px !important}

.bl-tabs button,.ptab a{
  position:relative;overflow:hidden;
  display:flex !important;flex-direction:column !important;
  align-items:center !important;justify-content:center !important;gap:2px !important;
  min-height:54px !important;height:auto !important;padding:9px 6px !important;
  border:0 !important;border-radius:0 !important;
  background:transparent !important;box-shadow:none !important;
  font-family:inherit;font-size:12.5px !important;font-weight:700 !important;
  letter-spacing:0 !important;color:#3a3035 !important;line-height:1.25;
  text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:background .3s var(--ease),color .3s var(--ease) !important;
  transform:none !important}

.bl-tabs button small,.ptab a small{
  font-family:'Poppins',sans-serif;font-size:9.5px;font-weight:600;letter-spacing:1.5px;
  color:#a09298;transition:color .3s}
.ptab a b{font-size:inherit;font-weight:inherit;color:inherit}

/* 칸 사이 세로선 */
.bl-tabs button:not(:last-child)::before,
.ptab a:not(:last-child)::after{
  content:"";position:absolute;right:0;top:24%;height:52%;width:.5px;
  background:rgba(0,0,0,.07);z-index:1}

.bl-tabs button:hover,.ptab a:hover{background:rgba(255,255,255,.55) !important}
.bl-tabs button:active,.ptab a:active{background:rgba(216,37,88,.06) !important}

.bl-tabs button.on,.ptab a.on{
  background:linear-gradient(135deg,var(--main2),var(--main)) !important;
  color:#fff !important;
  box-shadow:0 6px 18px rgba(216,37,88,.26) !important}
.bl-tabs button.on small,.ptab a.on small{color:rgba(255,255,255,.82)}
.bl-tabs button.on::before,.ptab a.on::after{display:none}

@media(max-width:640px){
  .bl-tabs,.ptab{border-radius:13px !important;margin-bottom:13px !important}
  .bl-tabs button,.ptab a{min-height:48px !important;font-size:11.5px !important}
  .bl-tabs button small,.ptab a small{font-size:8.5px;letter-spacing:1.1px}
}


/* ── select 화살표 ── */
select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  padding-right:38px !important;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:right 13px center !important;
  background-size:16px !important}
select:focus{
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D82558' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important}
select::-ms-expand{display:none}

/* ── 너무 작은 글씨 최소 크기 보장 ── */
body,p,li,td,th,span,div,label,small{font-synthesis-weight:none}
small,.hint,.note,.msg,.ds,.sub,.desc{font-size:max(11.5px,1em) }

/* ── 작은 버튼 터치 영역 확보 ── */
.mini,.bk-grid button,.chips button,.bl-tabs button,
.h-dots button,.bb-dots span,.ar-dots span{
  touch-action:manipulation}
.mini{min-height:38px}

/* ── 아이콘 버튼 정렬 ── */
button svg,a svg{flex:none;vertical-align:middle}

/* ── 링크 터치 하이라이트 통일 ── */
a,button,label,select,input,textarea{-webkit-tap-highlight-color:rgba(216,37,88,.08)}

/* ── 표 가로 넘침 방지 ── */
table{width:100%;border-collapse:collapse}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ── 긴 단어 줄바꿈 ── */
h1,h2,h3,p,li,td{word-break:keep-all;overflow-wrap:anywhere}

/* ── 체크박스 · 라디오 ── */
input[type="checkbox"],input[type="radio"]{
  -webkit-appearance:none;appearance:none;
  width:20px;height:20px;
  min-width:20px;min-height:20px;
  max-width:20px;max-height:20px;
  flex:0 0 20px;
  margin:0;padding:0;box-sizing:border-box;
  border:1.6px solid rgba(0,0,0,.2);
  border-radius:7px;background:#fff;
  position:relative;cursor:pointer;vertical-align:middle;
  transition:background .2s,border-color .2s}
input[type="radio"]{border-radius:50%}

input[type="checkbox"]:checked,input[type="radio"]:checked{
  background:linear-gradient(135deg,var(--main2,#E95073),var(--main,#D82558));
  border-color:transparent}
/* 체크 표시 */
input[type="checkbox"]:checked::after{
  content:"";position:absolute;left:6px;top:2.5px;
  width:5px;height:10px;
  border:solid #fff;border-width:0 2.2px 2.2px 0;
  transform:rotate(45deg)}
input[type="radio"]:checked::after{
  content:"";position:absolute;left:50%;top:50%;
  width:8px;height:8px;border-radius:50%;background:#fff;
  transform:translate(-50%,-50%)}
input[type="checkbox"]:focus-visible,input[type="radio"]:focus-visible{
  outline:2px solid var(--main2,#E95073);outline-offset:2px}
input[type="checkbox"]:disabled,input[type="radio"]:disabled{
  opacity:.4;cursor:not-allowed}

/* 체크박스가 든 줄은 글자와 나란히 */
.ch,.chk,.j-agree,.ntsw,.pit,.all-row,.ag{
  display:flex;align-items:center;gap:10px}
.ch{align-items:flex-start}
.ch input,.chk input{margin-top:1px}