


body:has(.pteam-shell) {
  background: var(--pw-wall, var(--pw-bg));
  color: var(--pw-text);
}
.pteam-shell .pteam-main-area,
.pteam-shell .pteam-content { background: transparent; }


.pteam-shell .pteam-left-nav {
  background: var(--pw-side);
  border-right: 1px solid var(--pw-sideline);
}
.pteam-shell .pteam-sidebar-title,
.pteam-shell .welcome h2 { color: var(--pw-muted); }
.pteam-shell .pteam-sidebar-item { border-radius: 10px; color: var(--pw-menutext); }
.pteam-shell .pteam-sidebar-item:hover { background: var(--pw-chipbg); }
.pteam-shell .pteam-sidebar-item.active {
  background: var(--pw-active-bg);
  color: var(--pw-active-text);
}
.pteam-shell .pteam-sidebar-item-name { color: inherit; font-weight: 700; }
.pteam-shell .pteam-sidebar-empty { color: var(--pw-muted); }
.pteam-shell .pteam-create-btn {
  background: var(--pw-accent);
  border: 0;
  color: #fff;
  border-radius: 9px;
}
.pteam-shell .menu-item { color: var(--pw-menutext); border: 0; }
.pteam-shell .menu-item:hover { background: var(--pw-chipbg); }
.pteam-shell .pteam-nav-toggle-btn {
  background: var(--pw-card);
  border: 1px solid color-mix(in srgb, var(--pw-text) 16%, transparent);
  color: var(--pw-menutext);
  box-shadow: var(--pw-shadow);
}


.pteam-shell .pteam-topbar {
  background: var(--pw-side);
  border-bottom: 1px solid var(--pw-sideline);
}
.pteam-shell .pteam-topbar-logo { color: var(--pw-muted); }
.pteam-shell .pteam-topbar-sep { color: var(--pw-iconmuted); }
.pteam-shell .pteam-topbar-name { color: var(--pw-text); }
.pteam-shell .auth-user-name { color: var(--pw-text); }
.pteam-shell .auth-device-label { color: var(--pw-muted); }
.pteam-shell .auth-logout-btn,
.pteam-shell .pteam-account-toggle {
  background: var(--pw-card);
  border: 1px solid color-mix(in srgb, var(--pw-text) 16%, transparent);
  color: var(--pw-menutext);
}


.pteam-shell .pteam-tabs {
  background: var(--pw-side);
  border-bottom: 1px solid var(--pw-sideline);
}
.pteam-shell .pteam-tab {
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--pw-muted);
  font-weight: 700;
}
.pteam-shell .pteam-tab:hover { color: var(--pw-text); }
.pteam-shell .pteam-tab.active {
  color: var(--pw-accent);
  border-bottom-color: var(--pw-accent);
  font-weight: 900;
}


.pteam-shell .pteam-btn,
.pteam-modal-overlay .pteam-btn {
  background: var(--pw-card);
  border: 1px solid color-mix(in srgb, var(--pw-text) 16%, transparent);
  color: var(--pw-text);
  border-radius: 11px;
  font-weight: 800;
}
.pteam-shell .pteam-btn:hover,
.pteam-modal-overlay .pteam-btn:hover { border-color: var(--pw-accent); }
.pteam-shell .pteam-btn.primary,
.pteam-modal-overlay .pteam-btn.primary {
  background: var(--pw-accent);
  border-color: transparent;
  color: #fff;
}
.pteam-shell .pteam-btn.ghost,
.pteam-modal-overlay .pteam-btn.ghost { background: transparent; border-color: transparent; color: var(--pw-menutext); }
.pteam-shell .pteam-btn.danger,
.pteam-modal-overlay .pteam-btn.danger { background: var(--pw-danger); border-color: transparent; color: #fff; }


.pteam-shell .pteam-post-card {
  background: var(--pw-card);
  border: 0;
  border-radius: 14px;
  box-shadow: var(--pw-shadow);
}
.pteam-shell .pteam-post-title { color: var(--pw-text); }
.pteam-shell .pteam-post-meta { color: var(--pw-muted); }
.pteam-shell .pteam-post-preview { color: var(--pw-muted); }
.pteam-shell .pteam-post-detail {
  background: var(--pw-card);
  border: 0;
  border-radius: 16px;
  box-shadow: var(--pw-shadow);
}
.pteam-shell .pteam-post-detail-title { color: var(--pw-text); }
.pteam-shell .pteam-post-detail-meta { color: var(--pw-muted); }
.pteam-shell .pteam-post-detail-body { color: var(--pw-text); }
.pteam-shell .pteam-back-btn { background: transparent; border: 0; color: var(--pw-menutext); }
.pteam-shell .pteam-back-btn:hover { color: var(--pw-accent); }
.pteam-shell .pteam-empty { color: var(--pw-muted); }
.pteam-shell .panel-header-title { color: var(--pw-text); }


.pteam-shell .pteam-compose {
  background: var(--pw-card);
  border: 1px solid var(--pw-panelline);
  border-radius: 14px;
}
.pteam-shell .pteam-compose-title { color: var(--pw-text); }
.pteam-shell .pteam-compose-input,
.pteam-shell .pteam-compose-body,
.pteam-shell .pteam-comment-input,
.pteam-shell .pteam-settings-input,
.pteam-shell .pteam-modal-input,
.pteam-shell .pteam-invite-link-input,
.pteam-modal-overlay .pteam-modal-input,
.pteam-modal-overlay .pteam-invite-link-input {
  background: var(--pw-input);
  border: 1px solid var(--pw-inputline);
  color: var(--pw-text);
  border-radius: 10px;
}
.pteam-shell .pteam-compose-input::placeholder,
.pteam-shell .pteam-compose-body::placeholder,
.pteam-shell .pteam-comment-input::placeholder,
.pteam-shell .pteam-modal-input::placeholder,
.pteam-modal-overlay .pteam-modal-input::placeholder { color: var(--pw-iconmuted); }
.pteam-shell .compose-share-label { color: var(--pw-muted); }


.pteam-shell .pteam-attach-item {
  background: var(--pw-chipbg);
  border: 1px solid var(--pw-divider);
  color: var(--pw-menutext);
  border-radius: 10px;
}
.pteam-shell .pteam-status { color: var(--pw-muted); }


.pteam-shell .pteam-comment-section-title { color: var(--pw-muted); }
.pteam-shell .pteam-comment { border-bottom: 1px solid var(--pw-divider); }
.pteam-shell .pteam-comment-text { color: var(--pw-text); }
.pteam-shell .pteam-comment-meta { color: var(--pw-muted); }
.pteam-shell .pteam-comment-delete { color: var(--pw-danger); }
.pteam-shell .pteam-secret-toggle { color: var(--pw-menutext); }


.pteam-shell .pin-card,
.pteam-shell .atelier-card {
  background: var(--pw-card);
  border: 0;
  border-radius: 14px;
  box-shadow: var(--pw-shadow);
}
.pteam-shell .pin-card-title,
.pteam-shell .atelier-card-title { color: var(--pw-text); }
.pteam-shell .pin-card-meta,
.pteam-shell .atelier-card-meta { color: var(--pw-muted); }


.pteam-shell .pteam-member-row,
.pteam-shell .pteam-request-row,
.pteam-shell .trash-item {
  background: var(--pw-card);
  border: 0;
  border-radius: 13px;
  box-shadow: var(--pw-shadow);
}
.pteam-shell .pteam-member-name,
.pteam-shell .pteam-request-name,
.pteam-shell .trash-item-title { color: var(--pw-text); }
.pteam-shell .pteam-member-email,
.pteam-shell .pteam-request-email,
.pteam-shell .pteam-request-time,
.pteam-shell .trash-item-meta { color: var(--pw-muted); }


.pteam-shell .pteam-invite-section,
.pteam-shell .pteam-settings-section {
  background: var(--pw-card);
  border: 1px solid var(--pw-panelline);
  border-radius: 16px;
  box-shadow: var(--pw-shadow);
}
.pteam-shell .pteam-invite-section-title,
.pteam-shell .pteam-settings-title { color: var(--pw-text); }
.pteam-shell .pteam-settings-label { color: var(--pw-muted); }
.pteam-shell .pteam-panel-close { color: var(--pw-iconmuted); }


.pteam-modal {
  background: var(--pw-card);
  border: 1px solid var(--pw-panelline);
  color: var(--pw-text);
}
.pteam-modal-title { color: var(--pw-text); }
.pteam-modal-label { color: var(--pw-muted); }
.pteam-modal-close { color: var(--pw-iconmuted); }
.pteam-delete-warn-box {
  background: var(--pw-chipbg);
  border: 1px solid var(--pw-divider);
  color: var(--pw-text);
}
.pteam-delete-warn-name { color: var(--pw-danger); }


.pteam-shell #chatIframeWrap,
.pteam-shell #quizIframeWrap,
.pteam-shell #wordcloudIframeWrap {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--pw-shadow);
  background: var(--pw-card);
}


.pw-theme-btn {
  width: 38px; height: 38px;
  border-radius: 11px;
  border: 1px solid color-mix(in srgb, var(--pw-text) 16%, transparent);
  background: var(--pw-card);
  color: var(--pw-menutext);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0;
}
.pw-theme-btn:hover { border-color: var(--pw-accent); }
.pw-theme-btn .pw-ic-moon { fill: #ffd400; stroke: #ffd400; }
.pw-theme-btn .pw-ic-sun { display: none; }
:root[data-theme="dark"] .pw-theme-btn .pw-ic-sun { display: block; }
:root[data-theme="dark"] .pw-theme-btn .pw-ic-moon { display: none; }


.pteam-shell .pteam-member-role-badge {
  background: var(--pw-chipbg);
  color: var(--pw-chiptext);
  font-weight: 800;
}
.pteam-shell .pteam-member-actions button,
.pteam-shell .trash-item-actions button {
  background: var(--pw-chipbg);
  border: 0;
  color: var(--pw-menutext);
  border-radius: 9px;
  font-weight: 800;
}
.pteam-shell .pteam-member-actions button:hover,
.pteam-shell .trash-item-actions button:hover { background: var(--pw-accent-soft); color: var(--pw-accent); }
.pteam-shell .pteam-member-actions button.danger,
.pteam-shell .trash-item-actions button.danger {
  background: var(--pw-danger);
  color: #fff;
}
.pteam-shell .pteam-member-info,
.pteam-shell .pteam-request-info { min-width: 0; }


.pw-qr-modal { max-width: 380px; text-align: center; }
.pw-qr-modal-canvas {
  margin: 16px auto 14px;
  padding: 12px;
  background: #ffffff;   
  border-radius: 12px;
  display: inline-block;
}
.pw-qr-modal .pteam-invite-link-input { width: 100%; margin-bottom: 12px; font-size: 12px; }
.pw-qr-modal .pteam-modal-actions { justify-content: center; }


.pw-qr-overlay {
  position: fixed;
  inset: 0;
  z-index: 20000;
  background: var(--pw-bg);
  display: flex;
  align-items: center;
  justify-content: center;
}
.pw-qr-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding: 32px;
}
.pw-qr-title {
  font-size: clamp(20px, 3vw, 34px);
  font-weight: 900;
  color: var(--pw-text);
}
.pw-qr-img {
  width: min(62vh, 62vw);
  height: min(62vh, 62vw);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #ffffff;
  padding: 18px;
  border-radius: 18px;
  
  image-rendering: pixelated;
}
.pw-qr-link {
  font-size: clamp(12px, 1.4vw, 18px);
  color: var(--pw-muted);
  word-break: break-all;
  max-width: 70vw;
}
.pw-qr-close {
  padding: 11px 22px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--pw-text) 18%, transparent);
  background: var(--pw-card);
  color: var(--pw-menutext);
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}
.pw-qr-close:hover { border-color: var(--pw-accent); color: var(--pw-accent); }

.pw-qr-img canvas, .pw-qr-img img {
  max-width: 100%;
  max-height: 100%;
  display: block;
  image-rendering: pixelated;
}


.pteam-noteam-topright {
  position: absolute;
  top: 14px;
  right: 18px;
  z-index: 5;
}
#pteamNoTeam { position: relative; }

.pteam-join-topright {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  max-width: 420px;
  margin: 0 auto 10px;
}


.pw-join-legal {
  
  position: fixed;
  left: 0;
  right: 0;
  bottom: 14px;
  margin: 0;
  text-align: center;
  font-size: 12.5px;
  color: var(--pw-muted);
  z-index: 5;
}
.pw-join-legal a { color: var(--pw-muted); }
.pw-join-legal .pw-privacy-link { font-weight: 800; }


.pteam-shell .pteam-content {
  display: flex;
  flex-direction: column;
}

.pteam-shell .pteam-content > * { flex-shrink: 0; }
.pteam-shell .pteam-content > .pw-footnote { margin-top: auto; }


.pteam-shell .pteam-content > #panelChat.active,
.pteam-shell .pteam-content > #panelQuiz.active,
.pteam-shell .pteam-content > #panelWordcloud.active {
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  height: auto !important;
}
.pteam-shell .pteam-content #chatIframeWrap,
.pteam-shell .pteam-content #quizIframeWrap,
.pteam-shell .pteam-content #wordcloudIframeWrap {
  flex: 1 1 auto;
  height: auto !important;
  
  min-height: 320px !important;
}



.pteam-shell .pteam-content > .pw-footnote {
  padding-top: 9px;
  padding-bottom: 0;
}
.pteam-shell .pteam-content { padding-bottom: 12px; }


.pteam-shell .pteam-content > .pteam-panel.active { margin-bottom: 14px; }


.pteam-shell .pteam-content > #panelChat.active {
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 0;
}


.pteam-modal-overlay .pteam-modal-input:focus { border-color: var(--pw-accent); }
.pteam-modal-overlay .create-item-share-row { border-top-color: var(--pw-divider); }
.pteam-modal-overlay .create-item-share-label { color: var(--pw-muted); }
.pteam-modal-close:hover {
  background: color-mix(in srgb, var(--pw-text) 8%, transparent);
  color: var(--pw-text);
}
