/* ── pTEAM Sidebar (index.html) ──────────────────────────────────────── */
.pteam-nav-section {
  margin-top: 2px;
}

.pteam-nav-header-row {
  display: flex;
  align-items: center;
}

/* pTEAM 토글 버튼: menu-item 스타일 그대로 + flex */
.pteam-nav-toggle {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #94a3b8;
}

.pteam-nav-toggle:hover,
.pteam-nav-toggle.open {
  color: var(--yellow);
}

/* 행 전체에 마우스를 올리면 + 버튼도 노랑으로 */
.pteam-nav-header-row:hover .pteam-create-btn {
  color: var(--yellow);
  border-color: var(--yellow);
}

.pteam-nav-arrow {
  display: inline-block;
  font-size: 20px; /* pTEAM 텍스트(18px)·+ 버튼과 한 행 높이로 정렬 — 이전 36px은 line-box가 커서 + 위치가 어긋나 보였음 */
  line-height: 1;
  transition: transform 0.2s;
  margin-left: 6px;
  color: var(--muted);
}

.pteam-nav-toggle:hover .pteam-nav-arrow {
  color: var(--yellow);
}

.pteam-nav-toggle.open .pteam-nav-arrow {
  transform: rotate(90deg);
  color: var(--yellow);
}

.pteam-create-btn {
  background: none;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--muted);
  font-size: 18px; /* pTEAM 토글 텍스트(.menu-item 18px)와 조화 — 이전 33px은 과도하게 큼 */
  line-height: 1;
  padding: 3px 9px 4px;
  margin-left: 6px;
  cursor: pointer;
  flex-shrink: 0;
  transition: color 0.15s, border-color 0.15s;
}

.pteam-create-btn:hover {
  color: var(--text);
  border-color: #3a3f50;
}

/* 팀 서브 목록 */
.pteam-sub-list {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding-left: 8px;
  margin-top: 2px;
}

.pteam-sub-list.hidden {
  display: none;
}

.pteam-sub-item {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  border-radius: 9px;
  cursor: pointer;
  font-size: 18px; /* .pteam-nav-toggle(pTEAM 버튼, .menu-item 상속)과 동일하게 맞춤 */
  font-weight: 500;
  color: #b0b7c9;
  border: none;
  background: none;
  text-align: left;
  width: 100%;
  transition: background 0.12s, color 0.12s;
}

.pteam-sub-item:hover {
  background: #131722;
  color: var(--text);
}

.pteam-sub-item.active {
  background: #141b2a;
  color: var(--text);
}

.pteam-sub-item-name {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pteam-sub-item-role {
  font-size: 15px; /* 10px의 1.5배 */
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 2px 5px;
  border-radius: 4px;
  background: #1e2436;
  color: var(--muted);
  flex-shrink: 0;
}

.pteam-sub-item-role.role-leader {
  background: #1a2a1a;
  color: #4caf50;
}

.pteam-sub-item-role.role-admin {
  background: #1a1e2e;
  color: #5c8ee0;
}

/* 구버전 클래스 호환 */
.pteam-sidebar-item {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  border-radius: 9px;
  cursor: pointer;
  font-size: 24px; /* 16px의 1.5배 */
  font-weight: 500;
  color: #b0b7c9;
  border: none;
  background: none;
  text-align: left;
  width: 100%;
  transition: background 0.12s, color 0.12s;
}

.pteam-sidebar-item:hover {
  background: #131722;
  color: var(--text);
}

.pteam-sidebar-item-name {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pteam-sidebar-item-role {
  font-size: 15px; /* 10px의 1.5배 */
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 2px 5px;
  border-radius: 4px;
  background: #1e2436;
  color: var(--muted);
  flex-shrink: 0;
}

.pteam-sidebar-item-role.role-leader {
  background: #1a2a1a;
  color: #4caf50;
}

.pteam-sidebar-item-role.role-admin {
  background: #1a1e2e;
  color: #5c8ee0;
}

/* ── pTEAM Page (pteam.html) ─────────────────────────────────────────── */
.pteam-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 320px 1fr;
  transition: grid-template-columns 0.2s ease;
  position: relative; /* 접기 핸들(.pteam-nav-toggle-btn)을 사이드바/본문 경계선에 절대배치하는 기준 */
}

/* 폰 드로어용 토글·오버레이 — 데스크톱/태블릿에서는 숨김(폰 미디어쿼리에서만 표시) */
.pteam-mobile-nav-toggle { display: none; }
.pteam-nav-overlay { display: none; }
.pteam-account-toggle { display: none; }

/* ChatGPT 스타일 — 접어도 완전히 사라지지 않고 아이콘 레일만 남음 */
.pteam-shell.nav-collapsed {
  grid-template-columns: 60px 1fr;
}

.pteam-left-nav {
  position: relative;
  border-right: 1px solid var(--line);
  padding: 22px 18px;
  background: linear-gradient(180deg, #090b11 0%, #05060a 100%);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: padding 0.2s ease;
}

.pteam-shell.nav-collapsed .pteam-left-nav {
  padding: 22px 10px;
}

.pteam-nav-header-flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.pteam-shell.nav-collapsed .pteam-nav-header-flex {
  justify-content: center;
}

.pteam-shell.nav-collapsed .pteam-nav-header-flex .brand-row {
  display: none;
}

/* ── 왼쪽 패널 로고·텍스트·이모지 크기 통일 (2026-08-15) — PC·태블릿·폰 공통 ──
   기존엔 로고 마크가 없고, 팀프로젝트 28 / 홈으로 18 / 팀이름 24 / "+" 33px로 크기가
   제각각이며 🏷️ 이모지가 이름 텍스트보다 커 보였음. 홈 브랜드 마크(모노그램)를 추가하고
   모든 라벨을 15px(헤딩 18px)로 통일, 이모지도 텍스트에 맞춤. `.pteam-left-nav`로 스코프해
   index.html 홈 사이드바(같은 pteam.css 로드)에는 영향 없음. */
.pteam-brand-link {
  display: flex; /* 폭 전체(width:100%)를 써야 워드마크 max-width 자동 축소가 홈처럼 작동 */
  width: 100%;
  align-items: center;
  gap: 8px;
  min-width: 0;
  text-decoration: none;
  cursor: pointer; /* 모노그램·워드마크 모두 클릭 가능해 보이도록(→ ./index.html 이동) */
}
/* 헤더에서 로고가 폭 전체를 쓰도록(토글은 이미 헤더 밖으로 이동함) */
.pteam-nav-header-flex .brand-row { flex: 1; min-width: 0; }
/* 모노그램은 기본 cursor가 없어 클릭 안 되는 것처럼 보였음 — 링크에서 상속받아 포인터 표시 */
.pteam-left-nav .brand-mark { cursor: pointer; }
/* 접기 핸들을 헤더 밖(경계선)으로 옮긴 덕에 헤더 폭 전체를 로고가 씀 → 홈(index)과 완전히
   동일하게: 마크 42px + 워드마크 height 44px에 max-width로 자동 축소(사이드바가 좁아지면
   워드마크가 홈처럼 함께 줄어듦). styles.css의 .brand-row:has(.brand-mark) 규칙과 동일 값. */
.pteam-left-nav .brand-mark { width: 42px; height: 42px; }
.pteam-left-nav .brand-row:has(.brand-mark) .brand-lockup {
  height: 44px;
  width: auto;
  max-width: calc(100% - 50px);
}
.pteam-left-nav .welcome h2 { font-size: 18px; font-weight: 700; }
.pteam-left-nav .menu-item { font-size: 15px; font-weight: 600; }
.pteam-left-nav .pteam-sidebar-title { font-size: 15px; font-weight: 700; }
.pteam-left-nav .pteam-sidebar-item { font-size: 15px; }
.pteam-left-nav .pteam-sidebar-item-icon { font-size: 15px; line-height: 1; flex-shrink: 0; }
.pteam-left-nav .pteam-sidebar-item-role { font-size: 11px; }
.pteam-left-nav .pteam-create-btn { font-size: 20px; padding: 1px 8px 2px; }

/* 접힌 상태에서는 로고 아래 내용(팀 프로젝트 제목·홈으로·팀 목록) 전체를 숨기고
   토글 버튼이 있는 헤더 행만 남긴다 — ChatGPT의 접힌 사이드바와 동일한 형태 */
.pteam-shell.nav-collapsed .pteam-nav-collapsible {
  display: none;
}

/* 사이드바 접기/펼치기 핸들 — 헤더에서 빼내 사이드바/본문 경계선 세로 중앙에 걸쳐 배치
   (2026-08-15). .pteam-shell 기준 절대배치이고 left=사이드바 폭이라, 핸들이 사이드바 오른쪽
   패딩과 본문 왼쪽 패딩 위에 놓여 팀 목록이 길어져도 겹치지 않음. 로고는 헤더(상단)라 무관.
   left는 사이드바 폭에 맞춰 320(PC)/280(태블릿)/60(접힘)으로 바뀜. */
.pteam-nav-toggle-btn {
  position: absolute;
  top: 50%;
  left: 320px;
  transform: translate(-50%, -50%);
  transition: left 0.2s ease;
  z-index: 50;
  flex-shrink: 0;
  width: 22px;
  height: 46px;
  padding: 0;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #0c0f18;
  color: var(--muted);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pteam-nav-toggle-btn:hover {
  background: #141b2a;
  color: var(--text);
}

/* 접힘(레일) 상태: 핸들을 레일(60px) 경계로 이동 + 화살표 방향 반전(‹ → ›) */
.pteam-shell.nav-collapsed .pteam-nav-toggle-btn { left: 60px; }
.pteam-shell.nav-collapsed .pteam-nav-toggle-btn svg { transform: scaleX(-1); }

.pteam-main-area {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  overflow: hidden;
}

.pteam-topbar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 24px;
  border-bottom: 1px solid var(--line);
  background: #07080f;
  flex-shrink: 0;
}

.pteam-topbar-logo {
  font-size: 23px; /* 15px의 1.5배 */
  font-weight: 700;
  color: var(--text);
  text-decoration: none;
}

.pteam-topbar-sep {
  color: var(--muted);
  font-size: 27px; /* 18px의 1.5배 */
}

.pteam-topbar-name {
  font-size: 23px; /* 15px의 1.5배 */
  font-weight: 600;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pteam-topbar-right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

/* Tabs */
.pteam-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--line);
  padding: 0 24px;
  flex-shrink: 0;
}

.pteam-tab {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  color: var(--muted);
  font-size: 21px; /* 14px의 1.5배 */
  font-weight: 500;
  padding: 14px 18px;
  cursor: pointer;
  transition: color 0.12s, border-color 0.12s;
  margin-bottom: -1px;
}

.pteam-tab:hover {
  color: var(--text);
}

.pteam-tab.active {
  color: var(--text);
  border-bottom-color: #5c8ee0;
}

/* ── 태블릿(터치 기기) — AI 채팅 iframe이 하단 입력창까지 온전히 보이게 (2026-08-15) ──
   #chatIframeWrap의 기본 height:calc(100vh - 220px)는 태블릿에서 100vh가 브라우저 UI를
   포함해 과대 계산되어 iframe이 뷰포트보다 커져 입력창이 잘렸음. 폰 블록(@media 600px)과
   동일하게 페이지를 100dvh로 잠그고(내부 .pteam-content만 스크롤) iframe을 100%로 채워
   상단행 높이와 무관하게 자동으로 딱 맞게 함. 상단 헤더·탭 높이도 줄여 채팅 본문을 넓힘.
   is-touch-device는 pteam.js가 board.js와 동일한 3중 판정으로 부여(폭 기준 미디어쿼리는
   하이브리드 태블릿에서 신뢰 불가). :has(.pteam-shell)로 pTEAM 페이지에만 스코프
   — pteam.css는 index.html에도 로드되므로 스코프 없으면 인덱스 스크롤이 잠김. */
html.is-touch-device:has(.pteam-shell) { height: 100dvh; overflow: hidden; }
html.is-touch-device:has(.pteam-shell) body { height: 100dvh; overflow: hidden; }
html.is-touch-device .pteam-shell { min-height: 0; height: 100dvh; }
html.is-touch-device .pteam-main-area { min-height: 0; height: 100dvh; }
html.is-touch-device .pteam-content { min-height: 0; }
html.is-touch-device #panelChat.pteam-panel.active { height: 100%; }
html.is-touch-device #chatIframeWrap { height: 100% !important; min-height: 0 !important; }
/* 상단 헤더·탭 높이 축소로 채팅 본문 공간 확보(사용자 요청) */
html.is-touch-device .pteam-topbar { padding-top: 10px; padding-bottom: 10px; }
html.is-touch-device .pteam-tab { padding-top: 9px; padding-bottom: 9px; }

/* Content area */
.pteam-content {
  flex: 1;
  overflow-y: auto;
  padding: 24px;
}

/* Section panels */
.pteam-panel {
  display: none;
}

.pteam-panel.active {
  display: block;
}

/* Post list */
.pteam-post-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pteam-post-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px 20px;
  cursor: pointer;
  transition: border-color 0.12s;
}

.pteam-post-card:hover {
  border-color: #3a3f50;
}

.pteam-post-title {
  font-size: 23px; /* 15px의 1.5배 */
  font-weight: 600;
  margin: 0 0 6px;
}

.pteam-post-meta {
  font-size: 18px; /* 12px의 1.5배 */
  color: var(--muted);
  display: flex;
  gap: 12px;
}

.pteam-post-preview {
  font-size: 20px; /* 13px의 1.5배 */
  color: #9aa0b0;
  margin: 8px 0 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Post compose */
.pteam-compose {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px 20px;
  margin-bottom: 20px;
}

.pteam-compose-title {
  font-size: 20px; /* 13px의 1.5배 */
  font-weight: 600;
  color: var(--muted);
  margin: 0 0 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.pteam-compose-input {
  width: 100%;
  background: #0d1018;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  font: inherit;
  font-size: 21px; /* 14px의 1.5배 */
  padding: 10px 14px;
  margin-bottom: 8px;
}

.pteam-compose-input:focus {
  outline: none;
  border-color: #3a4260;
}

.pteam-compose-body {
  width: 100%;
  background: #0d1018;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  font: inherit;
  font-size: 21px; /* 14px의 1.5배 */
  padding: 10px 14px;
  resize: vertical;
  min-height: 80px;
}

.pteam-compose-body:focus {
  outline: none;
  border-color: #3a4260;
}

.pteam-compose-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 10px;
}

/* Buttons */
.pteam-btn {
  background: #1a2236;
  border: 1px solid #2a3350;
  border-radius: 8px;
  color: var(--text);
  font: inherit;
  font-size: 20px; /* 13px의 1.5배 */
  font-weight: 500;
  padding: 7px 16px;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s;
}

.pteam-btn:hover {
  background: #1f2a42;
  border-color: #3a4a6a;
}

.pteam-btn.primary {
  background: #1e3a6e;
  border-color: #2a4f96;
  color: #a8c8ff;
}

.pteam-btn.primary:hover {
  background: #22426e;
  border-color: #3a5fa6;
}

.pteam-btn.danger {
  background: #2a1010;
  border-color: #5a2020;
  color: #ff8080;
}

.pteam-btn.danger:hover {
  background: #341414;
  border-color: #6a2a2a;
}

.pteam-btn.ghost {
  background: none;
  border-color: var(--line);
  color: var(--muted);
}

.pteam-btn.ghost:hover {
  border-color: #3a3f50;
  color: var(--text);
}

.pteam-btn.active {
  background: rgba(239, 68, 68, 0.15);
  border-color: rgba(239, 68, 68, 0.4);
  color: #fca5a5;
}

.pteam-btn.active:hover {
  background: rgba(239, 68, 68, 0.22);
}

.pteam-preview-banned-notice {
  padding: 10px 14px;
  border-radius: 8px;
  background: rgba(239, 68, 68, 0.1);
  color: #fca5a5;
  font-size: 20px; /* 13px의 1.5배 */
  font-weight: 500;
  text-align: center;
}

/* Post detail / comment area */
.pteam-post-detail {
  max-width: 800px;
}

.pteam-back-btn {
  background: none;
  border: none;
  color: var(--muted);
  font: inherit;
  font-size: 20px; /* 13px의 1.5배 */
  cursor: pointer;
  padding: 0;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.pteam-back-btn:hover {
  color: var(--text);
}

.pteam-post-detail-title {
  font-size: 33px; /* 22px의 1.5배 */
  font-weight: 700;
  margin: 0 0 8px;
}

.pteam-post-detail-meta {
  font-size: 18px; /* 12px의 1.5배 */
  color: var(--muted);
  margin-bottom: 16px;
  display: flex;
  gap: 12px;
  align-items: center;
}

.pteam-post-detail-body {
  font-size: 21px; /* 14px의 1.5배 */
  line-height: 1.7;
  white-space: pre-wrap;
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
}

.pteam-post-detail-actions {
  display: flex;
  gap: 8px;
  margin-bottom: 24px;
  align-items: center; /* 2줄짜리 미리보기 버튼과 아이콘 버튼 높이 차이를 중앙 정렬 */
  flex-wrap: wrap;
}
.pteam-post-detail-actions .pteam-btn { text-align: center; }

/* Attachments */
.pteam-attach-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.pteam-attach-item {
  display: flex;
  align-items: center;
  gap: 6px;
  background: #0e1220;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 18px; /* 12px의 1.5배 */
  color: #9aa0b0;
}

.pteam-attach-item a {
  color: #6ea8ff;
}
.attach-del-btn {
  margin-left: 4px;
  background: none;
  border: none;
  color: #666;
  font-size: 17px; /* 11px의 1.5배 */
  line-height: 1;
  padding: 2px 4px;
  border-radius: 4px;
  cursor: pointer;
}
.attach-del-btn:hover {
  background: rgba(248, 113, 113, 0.15);
  color: #f87171;
}

/* Comments */
.pteam-comment-section {
  margin-top: 8px;
}

.pteam-comment-section-title {
  font-size: 20px; /* 13px의 1.5배 */
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 14px;
}

.pteam-comment-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 16px;
}

.pteam-comment {
  display: flex;
  gap: 10px;
}

.pteam-comment-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #1a2236;
  border: 1px solid var(--line);
  flex-shrink: 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px; /* 11px의 1.5배 */
  color: var(--muted);
}

.pteam-comment-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pteam-comment-body {
  flex: 1;
  background: #0d1018;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 14px;
}

.pteam-comment-body.secret {
  border-color: #3a2a10;
  background: #120f08;
}

.pteam-comment-meta {
  font-size: 17px; /* 11px의 1.5배 */
  color: var(--muted);
  margin-bottom: 4px;
  display: flex;
  gap: 8px;
  align-items: center;
}

.pteam-secret-badge {
  font-size: 15px; /* 10px의 1.5배 */
  background: #3a2a10;
  color: #c8922a;
  padding: 1px 5px;
  border-radius: 4px;
  font-weight: 600;
}

.pteam-comment-text {
  font-size: 20px; /* 13px의 1.5배 */
  line-height: 1.55;
  white-space: pre-wrap;
}

.pteam-comment-delete {
  background: none;
  border: none;
  font: inherit;
  font-size: 17px; /* 11px의 1.5배 */
  color: var(--muted);
  cursor: pointer;
  padding: 0;
  margin-left: auto;
}

.pteam-comment-delete:hover {
  color: #ff6060;
}

/* Comment compose */
.pteam-comment-compose {
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: #0d1018;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
}

.pteam-comment-input {
  background: none;
  border: none;
  color: var(--text);
  font: inherit;
  font-size: 20px; /* 13px의 1.5배 */
  resize: none;
  min-height: 60px;
  outline: none;
}

.pteam-comment-compose-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.pteam-secret-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 18px; /* 12px의 1.5배 */
  color: var(--muted);
  cursor: pointer;
  user-select: none;
}

.pteam-secret-toggle input {
  accent-color: #c8922a;
}

/* Members panel */
.pteam-member-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.pteam-member-row {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 16px;
}

.pteam-member-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #1a2236;
  border: 1px solid var(--line);
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px; /* 13px의 1.5배 */
  color: var(--muted);
}

.pteam-member-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pteam-member-info {
  flex: 1;
  overflow: hidden;
}

.pteam-member-name {
  font-size: 21px; /* 14px의 1.5배 */
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pteam-member-email {
  font-size: 17px; /* 11px의 1.5배 */
  color: var(--muted);
}

.pteam-member-role-badge {
  font-size: 17px; /* 11px의 1.5배 */
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 3px 8px;
  border-radius: 5px;
  background: #1e2436;
  color: var(--muted);
  flex-shrink: 0;
}

.pteam-member-role-badge.role-leader {
  background: #152515;
  color: #4caf50;
}

.pteam-member-role-badge.role-admin {
  background: #151d30;
  color: #5c8ee0;
}

.pteam-member-role-badge.role-pending {
  background: #28200a;
  color: #c8922a;
}

.pteam-member-actions {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}

/* Invite panel */
.pteam-invite-wrap {
  max-width: 560px;
}

.pteam-invite-section {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 16px;
}

.pteam-invite-section-title {
  font-size: 21px; /* 14px의 1.5배 */
  font-weight: 600;
  margin: 0 0 14px;
}

.pteam-invite-link-row {
  display: flex;
  gap: 8px;
  align-items: center;
}

.pteam-invite-link-input {
  flex: 1;
  background: #0d1018;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  font: inherit;
  font-size: 18px; /* 12px의 1.5배 */
  padding: 9px 12px;
  font-family: monospace;
}

.pteam-invite-link-input:focus {
  outline: none;
}

/* 폰: 초대 링크가 한 행이면 복사·취소 버튼이 화면 밖으로 넘침 → 링크는 전체폭 한 행,
   그 아래에 복사·취소를 나란히 배치(narrowest-last: 위 base 규칙 뒤에 둠). */
@media (max-width: 600px) {
  .pteam-invite-link-row { flex-wrap: wrap; }
  .pteam-invite-link-input { flex: 1 1 100%; font-size: 15px; min-width: 0; }
  .pteam-invite-link-row .pteam-btn { flex: 1; }
}

.pteam-invite-link-meta {
  font-size: 17px; /* 11px의 1.5배 */
  color: var(--muted);
  margin-top: 8px;
}

/* QR code */
.pteam-qr-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin-top: 12px;
}

.pteam-qr-img {
  width: 160px;
  height: 160px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.pteam-qr-img img {
  width: 100%;
  height: 100%;
}

/* Join requests */
.pteam-request-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.pteam-request-row {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 16px;
}

.pteam-request-info {
  flex: 1;
}

.pteam-request-name {
  font-size: 21px; /* 14px의 1.5배 */
  font-weight: 500;
}

.pteam-request-time {
  font-size: 17px; /* 11px의 1.5배 */
  color: var(--muted);
}

/* Settings */
.pteam-settings-section {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 16px;
  max-width: 560px;
}

.pteam-settings-title {
  font-size: 21px; /* 14px의 1.5배 */
  font-weight: 600;
  margin: 0 0 14px;
}

.pteam-settings-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 14px;
}

.pteam-settings-label {
  font-size: 18px; /* 12px의 1.5배 */
  color: var(--muted);
  font-weight: 500;
}

.pteam-settings-input {
  background: #0d1018;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  font: inherit;
  font-size: 21px; /* 14px의 1.5배 */
  padding: 9px 12px;
}

.pteam-settings-input:focus {
  outline: none;
  border-color: #3a4260;
}

/* Empty states */
.pteam-empty {
  text-align: center;
  color: var(--muted);
  padding: 48px 24px;
  font-size: 21px; /* 14px의 1.5배 */
}

/* Create team modal / overlay */
.pteam-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pteam-modal-overlay.hidden {
  display: none;
}

.pteam-modal {
  background: #0e1220;
  border: 1px solid #2a3040;
  border-radius: 16px;
  padding: 28px 32px;
  width: min(480px, 90vw);
  position: relative; /* 우상단 닫기(X) 버튼 기준 */
}

/* 모달 우상단 닫기(X) 버튼 — pTEAM 모달 공통 */
.pteam-modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pteam-modal-close:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--text);
}

/* 초대·설정 탭 패널의 카드(모달 상자) 안 우상단 닫기(X) — 누르면 게시글 탭으로 돌아감 */
.pteam-invite-section, .pteam-settings-section { position: relative; }
.pteam-panel-close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  width: 34px;
  height: 34px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pteam-panel-close:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--text);
}

.pteam-modal-title {
  font-size: 27px; /* 18px의 1.5배 */
  font-weight: 700;
  margin: 0 0 20px;
}

.pteam-modal-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 14px;
}

.pteam-modal-label {
  font-size: 18px; /* 12px의 1.5배 */
  color: var(--muted);
  font-weight: 500;
}

.pteam-modal-input {
  background: #131722;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  font: inherit;
  font-size: 21px; /* 14px의 1.5배 */
  padding: 10px 14px;
}

.pteam-modal-input:focus {
  outline: none;
  border-color: #3a4260;
}

.pteam-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 20px;
}

/* 팀 삭제 확인 모달 */
.pteam-delete-warn-box {
  background: rgba(239, 68, 68, 0.08);
  border: 1px solid rgba(239, 68, 68, 0.3);
  border-radius: 10px;
  padding: 16px 20px;
  margin-bottom: 4px;
}
.pteam-delete-warn-name {
  font-size: 21px; /* 14px의 1.5배 */
  font-weight: 600;
  color: #f87171;
  margin: 0 0 12px;
}
.pteam-delete-warn-list {
  margin: 0;
  padding-left: 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 20px; /* 13px의 1.5배 */
  color: var(--muted);
  line-height: 1.5;
}
.pteam-delete-warn-list strong {
  color: var(--text);
}

/* Join page */
.pteam-join-shell {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.pteam-join-card {
  background: #0e1220;
  border: 1px solid #2a3040;
  border-radius: 20px;
  padding: 36px 40px;
  width: min(420px, 100%);
  text-align: center;
}

.pteam-join-icon {
  font-size: 72px; /* 48px의 1.5배 */
  margin-bottom: 16px;
}

.pteam-join-team-name {
  font-size: 33px; /* 22px의 1.5배 */
  font-weight: 700;
  margin: 0 0 8px;
}

.pteam-join-desc {
  font-size: 21px; /* 14px의 1.5배 */
  color: var(--muted);
  margin: 0 0 28px;
}

.pteam-join-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* 가입 요청 탭 뱃지 */
.pteam-requests-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  margin-left: 5px;
  background: #ef4444;
  border-radius: 9px;
  font-size: 17px; /* 11px의 1.5배 */
  font-weight: 700;
  color: #fff;
  vertical-align: middle;
  line-height: 1;
}
.pteam-requests-badge.hidden {
  display: none !important;
}

/* 가입 요청 행 */
.pteam-request-email {
  font-size: 17px; /* 11px의 1.5배 */
  color: var(--muted);
  margin-top: 2px;
}

/* ── 핀 / Atelier 패널 ─────────────────────────────────────────────────── */
.panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}

.panel-header-title {
  font-size: 24px; /* 16px의 1.5배 */
  font-weight: 600;
}

.pin-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px 20px;
  cursor: pointer;
  transition: border-color 0.12s;
  margin-bottom: 12px;
}

.pin-card:hover {
  border-color: #3a3f50;
}

.pin-card-title {
  font-size: 23px; /* 15px의 1.5배 */
  font-weight: 600;
  margin: 0 0 6px;
}

.pin-card-meta {
  font-size: 18px; /* 12px의 1.5배 */
  color: var(--muted);
}

.atelier-card {
  background: var(--panel);
  border: 1px solid #2a3040;
  border-left: 3px solid #5c8ee0;
  border-radius: 12px;
  padding: 16px 20px;
  cursor: pointer;
  transition: border-color 0.12s, border-left-color 0.12s;
  margin-bottom: 12px;
}

.atelier-card:hover {
  border-color: #3a4050;
  border-left-color: #7aa8f0;
}

.atelier-card-title {
  font-size: 23px; /* 15px의 1.5배 */
  font-weight: 600;
  margin: 0 0 6px;
}

.atelier-card-meta {
  font-size: 18px; /* 12px의 1.5배 */
  color: var(--muted);
}

/* ── 공유 설정 패널 ──────────────────────────────────────────────────────── */
.share-panel {
  position: absolute;
  z-index: 9999;
  background: var(--panel);
  border: 1px solid var(--border, #2e2e3e);
  border-radius: 10px;
  padding: 14px;
  width: 244px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}

.share-panel-header {
  font-size: 20px; /* 13px의 1.5배 */
  font-weight: 600;
  color: var(--text);
  margin-bottom: 12px;
}

.share-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  padding: 6px 0;
  border-bottom: 1px solid var(--border, #2e2e3e);
  margin-bottom: 8px;
}

.share-toggle-label {
  font-size: 20px; /* 13px의 1.5배 */
  color: var(--text);
}

.share-toggle-row input[type="checkbox"] {
  accent-color: var(--accent, #5c8ee0);
  width: 16px;
  height: 16px;
  cursor: pointer;
}

.share-member-list {
  max-height: 180px;
  overflow-y: auto;
  margin-bottom: 12px;
}

.share-member-list.hidden {
  display: none;
}

.share-member-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 4px;
  cursor: pointer;
  font-size: 20px; /* 13px의 1.5배 */
  color: var(--text);
  border-radius: 6px;
}

.share-member-row:hover {
  background: rgba(255, 255, 255, 0.05);
}

.share-member-row input[type="checkbox"] {
  accent-color: var(--accent, #5c8ee0);
  width: 14px;
  height: 14px;
  cursor: pointer;
  flex-shrink: 0;
}

.share-panel-loading {
  font-size: 18px; /* 12px의 1.5배 */
  color: var(--muted);
  padding: 8px 4px;
}

.share-panel-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 4px;
}

/* ── 톱니바퀴 버튼 (compose, 모달) ─────────────────────────────────────── */
.share-gear-btn {
  font-size: 26px; /* 17px의 1.5배 */
  padding: 6px 13px !important;
  line-height: 1;
  opacity: 0.8;
  transition: opacity 0.15s;
}

.share-gear-btn:hover {
  opacity: 1;
}

.compose-share-label {
  font-size: 17px; /* 11px의 1.5배 */
  color: var(--muted);
  margin-left: auto;
  margin-right: 2px;
  white-space: nowrap;
  align-self: center;
}

/* ── 카드 우상단 액션 버튼 그룹 ─────────────────────────────────────────── */
.pin-card,
.atelier-card,
.pteam-post-card {
  position: relative;
}

.pin-card .card-actions,
.atelier-card .card-actions,
.pteam-post-card .card-actions {
  position: absolute;
  top: 8px;
  right: 8px;
  display: flex;
  gap: 5px;
  opacity: 0;
  transition: opacity 0.15s;
}

.pin-card:hover .card-actions,
.atelier-card:hover .card-actions,
.pteam-post-card:hover .card-actions {
  opacity: 1;
}

.card-action-btn {
  font-size: 30px; /* 20px의 1.5배 */
  padding: 5px 11px;
  background: var(--panel);
  border: 1px solid var(--border, #2e2e3e);
  border-radius: 7px;
  cursor: pointer;
  line-height: 1;
  color: var(--text);
  transition: background 0.12s, border-color 0.12s, color 0.12s;
  white-space: nowrap;
  /* 이모지(⚙️/🗑)를 박스 정중앙에 배치 — 인라인 텍스트 baseline 배치 시 위/왼쪽으로
     치우쳐 보이던 것 수정 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.card-action-btn:hover {
  background: rgba(255, 255, 255, 0.09);
}

.card-action-btn.danger:hover {
  background: rgba(248, 113, 113, 0.15);
  border-color: #f87171;
  color: #f87171;
}

/* ── pTEAM 휴지통 ────────────────────────────────────────────────────────── */
.trash-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: var(--panel);
  border: 1px solid var(--border, #2e2e3e);
  border-radius: 10px;
  margin-bottom: 8px;
}

.trash-item-badge {
  font-size: 17px; /* 11px의 1.5배 */
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 20px;
  white-space: nowrap;
  flex-shrink: 0;
}

.trash-badge-post    { background: rgba(100, 180, 100, 0.18); color: #6db96d; }
.trash-badge-pin     { background: rgba(92,  142, 224, 0.18); color: #5c8ee0; }
.trash-badge-atelier { background: rgba(200, 140,  90, 0.18); color: #e0a85c; }

.trash-item-info {
  flex: 1;
  min-width: 0;
}

.trash-item-title {
  font-size: 21px; /* 14px의 1.5배 */
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.trash-item-meta {
  font-size: 18px; /* 12px의 1.5배 */
  color: var(--muted);
  margin-top: 2px;
}

.trash-item-actions {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}

/* ── 공유 패널 삭제 구역 ────────────────────────────────────────────────── */
.share-panel-danger {
  border-top: 1px solid var(--border, #2e2e3e);
  margin-top: 12px;
  padding-top: 12px;
}

.share-panel-danger .pteam-btn.danger {
  width: 100%;
  font-size: 20px; /* 13px의 1.5배 */
}

/* ── 생성 모달 공유 행 ──────────────────────────────────────────────────── */
.create-item-share-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0 2px;
  border-top: 1px solid var(--border, #2e2e3e);
  margin-top: 8px;
}

.create-item-share-label {
  font-size: 18px; /* 12px의 1.5배 */
  color: var(--muted);
}

/* Utility */
.hidden {
  display: none !important;
}

.pteam-status {
  font-size: 18px; /* 12px의 1.5배 */
  color: var(--muted);
  padding: 6px 0;
}

/* ── 태블릿(≤1280px): 홈(index)과 동일하게 사이드바 280px로 축소 (2026-08-15) ──
   홈은 @media(max-width:1280px)에서 사이드바를 280px로 줄이고 워드마크도 max-width로 함께
   축소하는데 pteam엔 이 반응형이 없어 태블릿에서 로고가 홈보다 커 보였음. 폭을 홈과 맞추면
   브랜드 max-width 계산이 280px 기준으로 작동해 로고 크기가 홈과 자동으로 일치함. 접기
   핸들의 left도 새 경계(280px)로 이동(접힘 시엔 .nav-collapsed 규칙이 60px로 이김). */
@media (max-width: 1280px) {
  .pteam-shell { grid-template-columns: 280px 1fr; }
  .pteam-nav-toggle-btn { left: 280px; }
}

/* ── 폰(≤600px): 왼쪽 팀 목록을 오프캔버스 드로어로 전환 ──────────────────────
   기존 grid(320px 1fr)는 세로 폰에서 왼쪽 나비가 화면을 거의 다 차지해 콘텐츠가
   안 보였음. 단일 컬럼 + 드로어(햄버거 토글)로 콘텐츠가 전체폭을 쓰게 함. 2026-08-13 */
/* 조건에 "폰 가로"(landscape + 낮은 높이 ≤500px)를 추가 — 폰 가로도 세로와 동일한 모바일
   레이아웃(⋮·초대 삭제·탭 스크롤·드로어)을 받게 함. 태블릿 가로(높이 768px+)는 미해당. 2026-08-13 */
@media (max-width: 600px), (orientation: landscape) and (max-height: 500px) {
  .pteam-shell,
  .pteam-shell.nav-collapsed {
    grid-template-columns: 1fr;
  }

  /* 왼쪽 나비 = 전체화면 슬라이드 드로어 */
  .pteam-left-nav,
  .pteam-shell.nav-collapsed .pteam-left-nav {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    max-width: none;
    z-index: 300;
    transform: translateX(-100%);
    transition: transform 0.25s ease;
    padding: 18px 16px;
  }
  body.pteam-nav-open .pteam-left-nav {
    transform: translateX(0);
  }
  /* 드로어 안의 열기/닫기(접기) 버튼 제거 — 폰에서는 ☰ 하나로만 여닫음(사용자 요청) */
  .pteam-nav-toggle-btn { display: none; }

  /* 접힘 레일 로직(60px)은 폰에서 무시 — 드로어 안에서는 내용 전체를 보여줌 */
  .pteam-shell.nav-collapsed .pteam-nav-collapsible { display: flex; flex-direction: column; }
  .pteam-shell.nav-collapsed .pteam-nav-header-flex .brand-row { display: block; }
  .pteam-shell.nav-collapsed .pteam-nav-header-flex { justify-content: space-between; }

  /* 팀 목록 여닫기 핸들 — ☰ 대신 ‹/› 셰브론.
     닫힘: › 좌상단(상단바)에서 열기 / 열림(전체화면): ‹ 오른쪽 경계 세로중앙에서 닫기.
     열기 버튼을 세로중앙이 아닌 좌상단에 둬서 AI 채팅의 › 핸들과 겹치지 않게 함. */
  .pteam-mobile-nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 310; /* 드로어(300) 위 — 열림 상태에서 닫기 클릭 가능 */
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: rgba(20, 16, 40, 0.92);
    color: var(--text);
    line-height: 1;
    cursor: pointer;
  }
  /* 닫힘 = ☰(햄버거) 표시, 셰브론 숨김 */
  .pteam-nav-ham { font-size: 20px; }
  .pteam-nav-chev { display: none; }
  /* 열림(전체화면 드로어): 토글을 오른쪽 경계 세로중앙으로 이동, ‹(셰브론)로 닫기 */
  body.pteam-nav-open .pteam-mobile-nav-toggle {
    top: 50%;
    left: auto;
    right: 8px;
    transform: translateY(-50%);
    width: 24px;
    height: 48px;
  }
  body.pteam-nav-open .pteam-nav-ham { display: none; }
  body.pteam-nav-open .pteam-nav-chev { display: block; }
  body.pteam-nav-open .pteam-nav-overlay {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 290;
    background: rgba(0, 0, 0, 0.5);
  }

  /* 상단바: 좌측 햄버거(48px) 공간 확보 + 폰 크기로 축소 */
  .pteam-topbar {
    padding: 10px 14px 10px 56px;
    gap: 8px;
  }
  .pteam-topbar-logo { font-size: 18px; }
  .pteam-topbar-sep { font-size: 20px; }
  .pteam-topbar-name { font-size: 17px; }

  /* no-team 빈 상태에서도 햄버거에 안 가리게 상단 여백 */
  #pteamNoTeam { padding-top: 56px; }

  /* "초대 링크 복사" 버튼은 폰에서 숨김(초대 탭이 별도로 있음) */
  .pteam-topbar-right #pteamShareBtn { display: none !important; }

  /* 계정정보·로그아웃을 담는 ⋮ 드롭다운 */
  .pteam-account-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.08);
    color: var(--text);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
  }
  .pteam-topbar-right { position: relative; }
  .pteam-topbar-right .auth-bar {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    min-width: 190px;
    padding: 12px;
    background: #1b1442;
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.55);
    z-index: 40;
  }
  .pteam-topbar-right.account-open .auth-bar { display: flex; }
  .pteam-topbar-right.account-open .auth-user-box {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    gap: 8px;
  }
  .pteam-topbar-right.account-open .auth-logout-btn { flex: 1 1 100%; }

  /* "+ 새 게시글" 버튼·제목 입력창 텍스트를 현재의 70%로 축소(사용자 요청) */
  #pteamPostNewBtn { font-size: 14px; }         /* 20px * 0.7 */
  #pteamPostTitleInput { font-size: 14.7px; }   /* 21px * 0.7 */

  /* 게시글 작성 폼 액션 행: "모든 멤버 공유" 라벨 제거 + 취소·톱니·게시를 1행에 */
  .compose-share-label { display: none; }
  .pteam-compose-actions { flex-wrap: nowrap; }
  /* 게시·취소 텍스트 70%로 축소하고 줄바꿈 방지(취/소 세로 쪼개짐 방지) */
  #pteamPostCancelBtn,
  #pteamPostSubmitBtn {
    font-size: 14px;                             /* 20px * 0.7 */
    white-space: nowrap;
  }

  /* 게시글 상세: 제목·액션 버튼 텍스트 70% 축소.
     수정/삭제는 내용 폭에 맞게 좁게, 미리보기 버튼만 남는 폭을 차지해 넓게(2행 유지). */
  .pteam-post-detail-title { font-size: 23.1px; }        /* 33px * 0.7 */
  .pteam-post-detail-actions .pteam-btn {
    font-size: 14px;                                     /* 20px * 0.7 */
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1.3;
  }
  .pteam-post-detail-actions .preview-ban-btn { flex: 1; }

  /* 카드 액션(공유 톱니바퀴 ⚙️ · 삭제 휴지통 🗑) 아이콘을 현재의 60%로 축소 */
  .card-action-btn {
    font-size: 18px;              /* 30px * 0.6 */
    padding: 3px 7px;
  }

  /* 핀 카드 제목: 70% 축소 + 한 줄 말줄임(…) — 길어도 ⚙️·🗑 아이콘을 침범하지 않게
     오른쪽에 액션 영역만큼 여백 확보 */
  .pin-card-title {
    font-size: 16.1px;            /* 23px * 0.7 */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 66px;
  }

  /* 패널 헤더("팀 핀") · 새 핀/새 항목 버튼 텍스트 70% 축소 */
  .panel-header-title { font-size: 16.8px; }   /* 24px * 0.7 */
  .panel-header .pteam-btn { font-size: 14px; } /* 20px * 0.7 */

  /* ⚙️·🗑 아이콘을 카드 제목 라인 높이에 맞춰 정렬(기존 top:8이라 제목보다 위로 떠 있었음) */
  .pin-card .card-actions { top: 14px; }
  .share-gear-btn {
    font-size: 15.6px;            /* 26px * 0.6 */
    padding: 4px 8px !important;
  }

  /* 탭: 가로 스크롤(9개가 넘쳐 잘리던 것 방지), 폰 크기로 축소 */
  .pteam-tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding: 0 12px;
    scrollbar-width: none;
  }
  .pteam-tabs::-webkit-scrollbar { display: none; }
  .pteam-tab {
    font-size: 15px;
    padding: 12px 12px;
    white-space: nowrap;
    flex: 0 0 auto;
  }

  .pteam-content { padding: 16px 14px; }

  /* AI 채팅 iframe이 모바일 브라우저 컴포지팅 특성상 fixed 팀 드로어(햄버거)를 가려,
     AI 채팅 탭에서 ☰를 눌러도 팀 목록이 안 보이던 문제 — 팀 드로어가 열려 있는 동안
     iframe wrap을 display:none으로 완전히 제거해 드로어가 위에 보이게 함(닫으면 자동 복귀).
     visibility:hidden으로는 iframe 컴포지팅 레이어가 안 사라져서 display:none 사용. 2026-08-13 */
  body.pteam-nav-open #chatIframeWrap { display: none !important; }

  /* ☰ 클릭이 iframe 컴포지팅 레이어에 가로채여 세로에서 팀 드로어가 안 열리던 문제 —
     ☰를 자체 레이어(translateZ)로 승격 + z-index를 iframe 위로 올려 클릭을 확실히 받게 하고,
     드로어·오버레이도 최상단으로. 2026-08-13 */
  .pteam-mobile-nav-toggle {
    z-index: 10002;
    transform: translateZ(0);
    will-change: transform;
  }
  body.pteam-nav-open .pteam-nav-overlay { z-index: 10000; }
  .pteam-left-nav,
  .pteam-shell.nav-collapsed .pteam-left-nav { z-index: 10001; }

  /* 드로어를 이 세대 z-index(10001)로 올렸으므로, 그 위에 떠야 할 모달(.pteam-modal-overlay,
     z-index 1000)도 함께 올린다 — 안 그러면 폰에서 왼쪽 드로어를 연 채 "내 팀 +"로 새 팀
     모달을 열면 전체화면 드로어(10001)가 모달(1000)을 덮어 안 보임. 모든 pteam 모달 공통. */
  .pteam-modal-overlay { z-index: 10003; }

  /* 드로어 배경은 오른쪽(페이지)과 같은 검정, 경계는 회색 선 + 그림자로 구분. */
  .pteam-left-nav,
  .pteam-shell.nav-collapsed .pteam-left-nav {
    background: #07080f !important;
    border-right: 2px solid #3a3f50 !important;
    box-shadow: 12px 0 44px rgba(0, 0, 0, 0.85) !important;
    z-index: 10001 !important;
    padding-top: 16px !important;   /* 열림 시 토글이 오른쪽으로 이동 → 상단 여백 최소화(로고 위로) */
  }
  /* 열림 시 닫기 토글(‹)을 드로어(z 10001) 위로 확실히 */
  body.pteam-nav-open .pteam-mobile-nav-toggle { z-index: 10002 !important; }
  /* 팀 목록의 "팀장" 배지 오른쪽 여백 — 지난(0)과 38px의 중간(19px)으로 조정 */
  body.pteam-nav-open .pteam-nav-collapsible { padding-right: 19px; }
  /* 드로어 안 Pinworks 로고: 이제 유효한 SVG(모노그램+워드마크)이고 드로어에 padding-top:56px가
     있어 고정 ☰(top 8~48) 아래에서 시작하므로 겹치지 않게 표시함(2026-08-15). 예전엔 깨진
     이미지라 숨겼었음. 폰은 인-드로어 토글(1558에서 display:none)이 없어 로고가 전체 폭 사용. */
  .pteam-left-nav .brand-row { display: flex !important; }
  /* ⚠️ 진단으로 확정된 원인: 열림 transform이 닫힘 규칙(.pteam-shell.nav-collapsed
     .pteam-left-nav 등)과 특이도가 겹쳐 translateX(-100%)가 유지돼 드로어가 화면 왼쪽
     밖에 머물렀음(오버레이만 보이고 드로어는 안 보임). !important로 열림을 확정. 2026-08-13 */
  body.pteam-nav-open .pteam-left-nav { transform: translateX(0) !important; }
  body.pteam-nav-open .pteam-nav-overlay { background: rgba(0, 0, 0, 0.6) !important; }

  /* ⚠️ AI 채팅 탭에서 pTEAM 페이지가 세로로 스크롤되던 근본 원인 수정:
     #chatIframeWrap의 고정 높이(calc(100vh-220px)+min-height:480px)가 폰 2행 상단바
     환경에선 콘텐츠를 뷰포트보다 길게 만들어 body가 스크롤됨 → 상단바가 스크롤되며
     fixed 햄버거와 분리되고, 스크롤 시 iframe이 햄버거를 덮어 클릭도 막힘.
     main-area를 100dvh로 묶고(내부 콘텐츠만 스크롤) iframe wrap을 그 안에 꽉 채워
     페이지 스크롤 자체를 없앰. 2026-08-13 */
  /* ⚠️ 핵심: 기본 min-height:100vh가 100dvh보다 커서 페이지가 브라우저 하단바만큼 길어져
     스크롤됨(→ 상단바가 fixed 햄버거와 분리). min-height까지 풀고 페이지 자체를 뷰포트
     높이에 잠가 스크롤을 내부(.pteam-content)로만 보냄. */
  /* ⚠️ 반드시 .pteam-shell 있는 pTEAM 페이지로만 스코프 — pteam.css는 index.html에도 로드되므로
     스코프 없이 두면 인덱스 body까지 overflow:hidden으로 잠겨 메인 화면 터치 스크롤이 막힘
     (2026-08-15 디버그로 실측 확인: 폰 인덱스 body.ovf가 hidden이라 스크롤 불가였음). */
  html:has(.pteam-shell), body:has(.pteam-shell) { height: 100dvh; overflow: hidden; }
  .pteam-shell { min-height: 0; height: 100dvh; }
  .pteam-main-area { min-height: 0; height: 100dvh; }
  .pteam-content { min-height: 0; }        /* flex 아이템이 부모 안에서 줄어들 수 있게 */
  #panelChat.pteam-panel.active { height: 100%; } /* 높이 체인 완성 → iframe 100% 해석됨 */
  #chatIframeWrap {
    height: 100% !important;
    min-height: 0 !important;
  }

  /* ── 전 탭 텍스트를 핀 카드 기준(원래 1.5배 → ×0.7)으로 통일 (2026-08-13) ──
     게시글·Atelier·멤버·휴지통·초대·가입요청·설정 등 모든 패널의 제목·본문·메타·라벨을
     핀 카드 제목(16.1px)과 같은 스케일로 축소해 폰에서 크기가 일관되게. */
  /* 게시글(목록) */
  .pteam-post-title { font-size: 16.1px; }      /* 23 */
  .pteam-post-meta { font-size: 12.6px; }       /* 18 */
  .pteam-post-preview { font-size: 14px; }       /* 20 */
  /* 게시글 작성 폼 */
  .pteam-compose-title { font-size: 14px; }      /* 20 */
  .pteam-compose-body { font-size: 14.7px; }     /* 21 */
  /* 게시글 상세·댓글 */
  .pteam-post-detail-meta { font-size: 12.6px; } /* 18 */
  .pteam-post-detail-body { font-size: 14.7px; } /* 21 */
  .pteam-back-btn { font-size: 14px; }           /* 20 */
  .pteam-preview-banned-notice { font-size: 14px; } /* 20 */
  .pteam-comment-section-title { font-size: 14px; } /* 20 */
  .pteam-comment-input { font-size: 14px; }      /* 20 */
  .pteam-comment-text { font-size: 14px; }       /* 20 */
  .pteam-comment-meta { font-size: 11.9px; }     /* 17 */
  .pteam-secret-badge { font-size: 10.5px; }     /* 15 */
  .pteam-secret-toggle { font-size: 12.6px; }    /* 18 */
  /* Atelier */
  .atelier-card-title { font-size: 16.1px; }     /* 23 */
  .atelier-card-meta { font-size: 12.6px; }      /* 18 */
  /* 멤버 */
  .pteam-member-name { font-size: 14.7px; }      /* 21 */
  .pteam-member-email { font-size: 11.9px; }     /* 17 */
  .pteam-member-role-badge { font-size: 11.9px; } /* 17 */
  /* 휴지통 */
  .trash-item-title { font-size: 14.7px; }       /* 21 */
  .trash-item-meta { font-size: 12.6px; }        /* 18 */
  /* 초대 */
  .pteam-invite-section-title { font-size: 14.7px; } /* 21 */
  .pteam-invite-link-meta { font-size: 11.9px; } /* 17 */
  /* 가입 요청 */
  .pteam-request-name { font-size: 14.7px; }     /* 21 */
  .pteam-request-time { font-size: 11.9px; }     /* 17 */
  /* 설정 */
  .pteam-settings-title { font-size: 14.7px; }   /* 21 */
  .pteam-settings-label { font-size: 12.6px; }   /* 18 */
  /* 공용 모달(공유 설정·삭제 확인 등) */
  .pteam-modal-title { font-size: 18.9px; }      /* 27 */
  .pteam-modal-label { font-size: 12.6px; }      /* 18 */
  .pteam-delete-warn-name { font-size: 14.7px; } /* 21 */
}

/* ── 폰 가로 전용 조정 (2026-08-13) — 모바일 블록 뒤에 둬서 가로에서만 덮어씀 ──
   ① 폭이 넓어 ⋮(계정 드롭다운) 불필요 → 계정 정보를 인라인으로.
   ② AI채팅·멤버 등 탭 내용이 세로보다 짧은 높이에서 넘칠 때 터치 스크롤이 안 되던 문제 —
      iOS는 body가 height 잠김일 때 내부 스크롤 컨테이너에 -webkit-overflow-scrolling:touch가
      있어야 손가락 스크롤이 먹음. */
@media (orientation: landscape) and (max-height: 500px) {
  .pteam-account-toggle { display: none !important; }
  .pteam-topbar-right .auth-bar {
    position: static !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 8px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    min-width: 0 !important;
  }
  .pteam-topbar-right .auth-user-box { flex-flow: row nowrap !important; }
  .pteam-topbar-right .auth-logout-btn { flex: 0 0 auto !important; }

  /* 탭 내용 터치 스크롤 보장 */
  .pteam-content,
  .pteam-member-list,
  #trashListWrap,
  #pteamPostList {
    -webkit-overflow-scrolling: touch;
  }
  .pteam-content { overflow-y: auto !important; touch-action: pan-y; min-height: 0 !important; }

  /* 가로는 세로 공간이 부족 — 상단바·탭 높이를 낮춰 콘텐츠(멤버 목록·채팅 등)가
     스크롤할 실제 영역을 확보 */
  .pteam-topbar { padding-top: 6px !important; padding-bottom: 6px !important; }
  .pteam-tab { padding-top: 9px !important; padding-bottom: 9px !important; }
}