html, body {
  height: 100%;
  overflow: hidden !important;
}

body{margin:0;font-family:'Segoe UI','Roboto',sans-serif;background:#fff;}
.hide{display:none!important;}

/* =============================
   STEP 0 (iOS UI) - UI ONLY
   - 기능/로직 변경 없음
   ============================= */
:root{
  --ios-bg:#F2F2F7;
  --ios-card:#FFFFFF;
  --ios-sep:rgba(60,60,67,0.15);
  --ios-secondary:rgba(60,60,67,0.6);
  --ios-primary:#007AFF;
  --ios-radius:18px;
  --ios-shadow:0 6px 20px rgba(0,0,0,0.08);
}

body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  background:var(--ios-bg);
  color:#111;
}

button{
  -webkit-tap-highlight-color: transparent;
}

#topBar{
  position:fixed;top:0;left:0;width:100%;height:60px;
  background:#fff;border-bottom:1px solid #eee;
  display:flex;justify-content:center;align-items:center;
  z-index:100;
}
#topLogo{
  width:min(330px, 82vw);
  height:54px;
  padding:0;
  border:none;
  background:transparent;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
#topLogo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}

#myLoc{
  padding:0!important;
  overflow:visible;
  display:flex!important;
  align-items:center;
  justify-content:center;
}
#myLoc .my-location-pin{
  position:relative;
  display:block;
  width:24px;
  height:24px;
  border-radius:50% 50% 50% 0;
  background:#ef233c;
  transform:rotate(-45deg);
  box-shadow:0 2px 6px rgba(239,35,60,.38);
}
#myLoc .my-location-pin::after{
  content:"";
  position:absolute;
  width:9px;
  height:9px;
  left:7.5px;
  top:7.5px;
  border-radius:50%;
  background:#fff;
}
#nearbyRoomRangeNotice{
  position:fixed;
  left:50%;
  bottom:112px;
  transform:translateX(-50%);
  z-index:74;
  width:max-content;
  max-width:calc(100vw - 32px);
  padding:9px 13px;
  border-radius:999px;
  background:rgba(20,24,31,.86);
  color:#fff;
  font-size:12px;
  font-weight:700;
  text-align:center;
  box-shadow:0 5px 18px rgba(0,0,0,.2);
}
#nearbyRoomRangeNotice.hide{display:none;}

#searchBar{
  position:fixed;top:61px;left:50%;transform:translateX(-50%);
  width:92%;background:#fff;padding:4px 8px;
  display:flex;gap:7px;border-radius:12px;
  box-shadow:0 2px 6px rgba(0,0,0,.12);z-index:90;
}
#searchInput{
  flex:1;padding:6px 9px;font-size:15px;border:1px solid #ccc;border-radius:10px;
}
#searchBtn{
  padding:6px 11px;font-size:15px;background:#000;color:#fff;border:none;border-radius:10px;
}

#categoryBar{
  position:fixed;top:107px;width:100%;background:#fff;
  overflow-x:auto;border-bottom:1px solid #eee;z-index:80;
}
#categoryBar::-webkit-scrollbar{display:none;}
.catWrap{display:flex;gap:10px;padding:8px 10px;}
.catWrap button{
  padding:8px 14px;font-size:15px;
  background:#f5f5f5;border:none;border-radius:22px;flex-shrink:0;
}

#map{
  position: fixed;
  top: 156px;               /* 위쪽 UI 주변 높이 */
  left: 0;
  width: 100%;
  height: calc(100% - 221px);   /* 주변 높이에서 상단156 + 하단65 제거 */
  overflow: hidden;
}


/* shrink floating buttons */
#floatingBtns{
  position:fixed;right:10px;bottom:160px;
  display:flex;flex-direction:column;gap:10px;z-index:95;
}
#floatingBtns button{
  width:52px;height:52px;font-size:18px;
  border:none;border-radius:50%;background:#fff;
  box-shadow:0 2px 5px rgba(0,0,0,.2);
  font-weight:800;
  cursor:pointer;
}
#floatingBtns #profileManageQuickBtn{
  background:#1769e0;
  color:#fff;
  box-shadow:0 8px 22px rgba(23,105,224,0.28);
  font-size:12px;
}
#chatFilterBtn{
  font-size:13px !important;
}
#chatFilterPanel{
  position:fixed;
  right:72px;
  bottom:214px;
  width:188px;
  padding:12px;
  border-radius:18px;
  background:rgba(255,255,255,0.94);
  box-shadow:0 10px 32px rgba(0,0,0,0.18);
  z-index:96;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
#chatFilterPanel.hide{
  display:none;
}
.chat-filter-title{
  font-size:14px;
  font-weight:900;
  margin-bottom:8px;
}
.chat-filter-note{
  margin-top:9px;
  color:rgba(60,60,67,0.64);
  font-size:11px;
  line-height:1.35;
}

/* When category sheet is open, hide floating buttons to prevent overlap */
body.sheet-open #floatingBtns{
  opacity:0;
  pointer-events:none;
  transform:translateY(10px);
  transition:opacity .15s ease, transform .15s ease;
}
body.sheet-open #chatFilterPanel{
  display:none;
}

/* adjust Google map UI buttons size */
.gmnoprint button, .gm-style button{
  transform:scale(0.75); /* shrink 25% */
}
.gm-fullscreen-control,
.gm-svpc{
  display:none !important;
}

#communityCard{
  position:fixed;bottom:85px;left:50%;transform:translateX(-50%);
  background:#fff;padding:20px;border-radius:14px;
  box-shadow:0 2px 8px rgba(0,0,0,.18);z-index:96;font-size:17px;
  max-height:calc(100vh - 170px);
  overflow-y:auto;
  overflow-x:hidden;
  box-sizing:border-box;
}

/* 공식방 채널 선택 모달 */
#officialChannelModal{
  position:fixed;top:0;left:0;width:100%;height:100%;
  background:rgba(0,0,0,0.35);
  display:flex;align-items:flex-end;justify-content:center;
  z-index:120;
}
#officialChannelBox{
  width:100%;
  max-width:520px;
  background:#fff;
  border-top-left-radius:18px;
  border-top-right-radius:18px;
  padding:16px 16px 20px;
  box-shadow:0 -6px 24px rgba(0,0,0,0.18);
  max-height:calc(100vh - 24px);
  overflow-y:auto;
  overflow-x:hidden;
  box-sizing:border-box;
}
#officialChannelTitle{
  font-size:18px;
  font-weight:800;
}
#officialChannelSub{
  margin-top:6px;
  font-size:14px;
  color:#666;
}
#officialChannelList{
  margin-top:14px;
  max-height:46vh;
  overflow-y:auto;
  border-top:1px solid #eee;
  padding-top:10px;
}
.official-channel-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 10px;
  border:1px solid #eee;
  border-radius:12px;
  margin-bottom:10px;
}
.official-channel-row .left{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.official-channel-row .name{
  font-size:16px;
  font-weight:700;
}
.official-channel-row .meta{
  font-size:13px;
  color:#666;
}
.official-channel-row button{
  border:none;
  background:#000;
  color:#fff;
  padding:10px 12px;
  border-radius:10px;
  font-size:14px;
}
.official-channel-row button:disabled{
  opacity:0.45;
}
.official-channel-actions{
  display:flex;
  gap:10px;
  margin-top:12px;
}
#officialChannelAutoBtn{
  flex:1;
  background:#000;
  color:#fff;
  border:none;
  border-radius:12px;
  padding:12px 14px;
  font-size:15px;
  font-weight:700;
}
#officialChannelCloseBtn{
  width:120px;
  background:#f1f1f1;
  color:#111;
  border:none;
  border-radius:12px;
  padding:12px 14px;
  font-size:15px;
  font-weight:700;
}
#officialChannelRejoinBtn{
  margin-top:12px;
  width:100%;
  background:#fff;
  border:1px solid #000;
  color:#000;
  border-radius:12px;
  padding:12px 14px;
  font-size:15px;
  font-weight:800;
}

#chatRoom{
  position:fixed;top:60px;bottom:0;width:100%;height:auto;background:#fff;
  border-top:1px solid #ddd;display:flex;flex-direction:column;z-index:140;
}
#chatHeader{
  padding:10px 12px;
  font-size:16px;
  border-bottom:1px solid #eee;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
#chatMessages{flex:1;overflow-y:auto;padding:10px;font-size:17px;}
#chatInputWrap{display:flex;padding:10px;}
#chatInput{
  flex:1;padding:9px 10px;font-size:16px;border:1px solid #ccc;border-radius:10px;
}
#sendBtn{
  margin-left:10px;padding:12px 16px;font-size:17px;background:#000;color:#fff;border:none;border-radius:10px;
}

#profileModal{
  position:fixed;top:0;left:0;width:100%;height:100%;
  background:rgba(0,0,0,.3);display:flex;justify-content:center;align-items:flex-end;z-index:100002;
}
#profileBox{
  width:100%;
  max-width:460px;
  box-sizing:border-box;
  background:rgba(255,255,255,0.96);
  padding:18px 16px 20px;
  border-radius:22px 22px 0 0;
  font-size:18px;
  box-shadow:0 -12px 34px rgba(0,0,0,0.18);
  max-height:calc(100vh - 24px);
  overflow-y:auto;
  overflow-x:hidden;
}
#profileName{
  font-size:20px;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.profile-user-summary{
  margin-top:8px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(0,0,0,0.04);
  color:#333;
  font-size:13px;
  font-weight:800;
}
.profile-user-trips{
  margin:12px 0;
  display:grid;
  gap:8px;
}
.profile-user-trips-title{
  font-size:13px;
  font-weight:1000;
  color:#111;
}
.profile-user-trips-empty{
  padding:14px 12px;
  border-radius:12px;
  background:rgba(60,60,67,0.08);
  font-size:13px;
  font-weight:800;
  color:#666;
}
.profile-user-trip-item{
  display:grid;
  grid-template-columns:48px 1fr;
  grid-template-rows:auto auto;
  gap:3px 10px;
  align-items:center;
  width:100%;
  border:1px solid rgba(0,0,0,0.08);
  border-radius:12px;
  background:#fff;
  padding:8px;
  text-align:left;
}
.profile-user-trip-item img,
.profile-user-trip-item span{
  grid-row:1 / span 2;
  width:48px;
  height:48px;
  border-radius:10px;
  background:#eef2f7;
  object-fit:cover;
}
.profile-user-trip-item strong{
  font-size:13px;
  font-weight:1000;
  color:#111;
}
.profile-user-trip-item em{
  font-style:normal;
  font-size:12px;
  font-weight:700;
  color:#666;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.profile-user-trips-title button{
  border:0;
  border-radius:999px;
  padding:7px 10px;
  background:#eef6ff;
  color:#007aff;
  font-size:12px;
  font-weight:900;
}
.profile-user-trip-detail{
  display:grid;
  gap:10px;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  overflow:hidden;
}
.profile-user-trip-media{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(0, 100%);
  gap:8px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;
  border-radius:14px;
}
.profile-user-trip-media img{
  width:100%;
  max-width:100%;
  height:auto;
  max-height:260px;
  object-fit:cover;
  border-radius:14px;
  scroll-snap-align:start;
  background:#eef2f7;
}
.profile-user-trip-detail strong{
  font-size:16px;
  font-weight:1000;
  line-height:1.25;
  color:#111;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.profile-user-trip-detail span,
.profile-user-trip-detail p{
  margin:0;
  font-size:13px;
  font-weight:750;
  line-height:1.45;
  color:#444;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
#closeProfile{
  width:100%;
  margin-top:4px;
  border:none;
  border-radius:14px;
  padding:12px 10px;
  background:rgba(60,60,67,0.10);
  font-size:14px;
  font-weight:900;
}
.room-home-notice-editable{
  cursor:pointer;
  outline:2px solid rgba(0,122,255,0.18);
}

#bottomNav{
  position:fixed;bottom:0;width:100%;height:65px;background:#fff;
  border-top:1px solid #ddd;display:flex;justify-content:space-around;align-items:center;z-index:99;
}
#bottomNav button{
  background:none;border:none;font-size:17px;color:#333;
}

#loginOverlay {
  position:fixed; top:0; left:0; right:0; bottom:0;
  background:rgba(0,0,0,0.4);
  z-index:99998;
}
#loginPopup {
  position:fixed; bottom:120px; left:0; right:0;
  margin:auto; width:90%; max-width:400px;
  background:white; padding:20px; border-radius:14px;
  box-shadow:0 5px 20px rgba(0,0,0,0.25);
  z-index:99999;
}
.kakao-btn{
  width:100%; background:#FEE500; border:none;
  padding:12px; font-size:16px; border-radius:8px;
  margin-bottom:10px;
}
.google-btn{
  width:100%; background:white;
  border:1px solid #ccc; padding:12px;
  font-size:16px; border-radius:8px;
  margin-bottom:10px;
}
.login-popup-title{font-size:20px;font-weight:900;text-align:center;margin:2px 0 4px;}
.login-popup-help{font-size:12px;color:#6b7280;text-align:center;margin-bottom:16px;}
.apple-btn,.email-login-btn{width:100%;border:1px solid #d7dbe2;padding:12px;font-size:16px;border-radius:8px;margin-bottom:10px;font-weight:700;}
.apple-btn{background:#111;color:#fff;border-color:#111;}
.email-login-btn{background:#f3f4f6;color:#333;}
.apple-btn span,.email-login-btn span{font-size:11px;opacity:.72;margin-left:5px;}
.login-policy-btn{width:100%;border:0;background:transparent;color:#666;text-decoration:underline;font-size:12px;padding:7px 4px 11px;}
#locationAgreementModal{position:fixed;inset:0;z-index:100001;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;padding:18px;}
#locationAgreementModal.hidden{display:none;}
.location-agreement-card{width:min(520px,100%);max-height:min(760px,calc(100vh - 36px));background:#fff;border-radius:22px;box-shadow:0 18px 55px rgba(0,0,0,.26);display:flex;flex-direction:column;overflow:hidden;}
.location-agreement-head{display:flex;align-items:flex-start;justify-content:space-between;padding:18px 18px 13px;border-bottom:1px solid #eee;}
.location-agreement-head strong{display:block;font-size:19px;}.location-agreement-head span{display:block;color:#777;font-size:11px;margin-top:4px;}
.location-agreement-head button{border:0;background:#f2f3f5;border-radius:50%;width:34px;height:34px;font-size:17px;}
.location-agreement-scroll{overflow:auto;padding:4px 18px 10px;line-height:1.55;color:#34373d;}
.location-agreement-scroll section{padding:10px 0;border-bottom:1px solid #f0f1f2;}.location-agreement-scroll h3{font-size:14px;margin:0 0 5px;}.location-agreement-scroll p{font-size:12px;margin:0;}
.location-agreement-note{font-size:11px!important;color:#9a6700;background:#fff8db;border-radius:10px;padding:9px;margin-top:10px!important;}
.location-agreement-check{display:flex;gap:8px;padding:8px 18px 0;font-size:12px;align-items:flex-start;}.location-agreement-check input{margin-top:2px;}.location-agreement-check b{color:#e5484d;}
.location-agreement-check a{margin-left:4px;color:#1267ba;font-weight:850;text-decoration:none;white-space:nowrap;}
.location-agreement-all{margin:8px 18px 2px;padding:11px 12px;border-radius:12px;background:#f2f7ff;font-size:14px;}
.location-agreement-all b{color:#1267ba;}
.legal-agreement-summary{flex:0 1 auto;padding-top:12px;}
.location-agreement-actions{display:grid;grid-template-columns:1fr 2fr;gap:9px;padding:14px 18px 18px;}.location-agreement-actions button{border:0;border-radius:12px;padding:13px;font-weight:800;}.location-agreement-actions button:first-child{background:#eee;}.location-agreement-actions button:last-child{background:#1677ff;color:#fff;}.location-agreement-actions button:disabled{background:#c9cdd3;color:#fff;}
#emailAuthModal{position:fixed;inset:0;z-index:10030;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;padding:18px;}
#emailAuthModal.hidden{display:none;}
.email-auth-card{width:min(430px,100%);background:#fff;border-radius:22px;box-shadow:0 18px 55px rgba(0,0,0,.26);overflow:hidden;}
.email-auth-head{display:flex;justify-content:space-between;align-items:flex-start;padding:18px;border-bottom:1px solid #eee;}
.email-auth-head strong{display:block;font-size:19px;}.email-auth-head span{display:block;color:#777;font-size:12px;margin-top:4px;}.email-auth-head button{border:0;background:#f2f3f5;border-radius:50%;width:34px;height:34px;font-size:17px;}
.email-auth-tabs{display:grid;grid-template-columns:1fr 1fr;padding:14px 18px 0;}.email-auth-tabs button{border:0;border-bottom:2px solid #e4e7eb;background:#fff;padding:11px;font-weight:800;color:#777;}.email-auth-tabs button.active{border-color:#1677ff;color:#1677ff;}
#emailAuthForm{padding:16px 18px 18px;}#emailAuthForm label{display:block;margin-bottom:12px;}#emailAuthForm label.hidden{display:none;}#emailAuthForm label span{display:block;font-size:12px;font-weight:800;margin-bottom:6px;}#emailAuthForm input{width:100%;box-sizing:border-box;border:1px solid #d8dde5;border-radius:11px;padding:13px;font-size:16px;}#emailAuthForm input:focus{outline:2px solid rgba(22,119,255,.2);border-color:#1677ff;}
.email-auth-message{min-height:18px;margin:2px 0 10px;color:#d93025;font-size:12px;line-height:1.45;}.email-auth-message.success{color:#087f23;}
.email-auth-submit{width:100%;border:0;border-radius:12px;padding:14px;background:#1677ff;color:#fff;font-size:15px;font-weight:800;}.email-auth-submit:disabled{background:#aeb7c5;}.email-password-reset{width:100%;border:0;background:transparent;color:#555;padding:13px 0 2px;font-size:12px;text-decoration:underline;}
.admin-login-btn{
  width:100%;
  background:#111;
  color:#fff;
  border:0;
  padding:12px;
  font-size:16px;
  font-weight:800;
  border-radius:8px;
}
.hidden{display:none;}

#profilePanel{
  position:fixed; top:100%; left:0; right:0;
  background:white; height:100vh;
  z-index:99999; transition:top 0.18s ease-out;
  padding:20px;
  overflow:hidden;
}
#profilePanel.show{
  top:0;
}
#profileHeader{
  font-size:20px; font-weight:bold;
  display:flex; align-items:center;
  margin-bottom:20px;
}
#backProfile{
  cursor:pointer; margin-right:10px;
}
#profileImage{
  width:80px; height:80px; border-radius:50%;
  background:#eee; margin:auto; margin-bottom:15px;
}
#profileNick, #profileLoginType{
  text-align:center; font-size:18px; margin-bottom:10px;
}
.profileStat{
  font-size:17px; margin:10px 0;
}
#logoutBtn{
  width:100%; padding:12px; font-size:16px;
  background:#ff5252; color:white;
  border:none; border-radius:8px;
  margin-top:20px;
}


/* 마커 라벨(방 제목) */
.room-label {
  font-size: 13px;
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 999px;
  white-space: nowrap;
  color: #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,0.35);
}

.room-label-open {
  background: #03C75A;
}

.room-label-private {
  background: #2962FF; /* 파란 비공개 */
}

.room-label-official {
  background: #C2185B; /* 분홍빛 자주색 공식방 */
}

/* 채팅 헤더 버튼 묶음 */
#chatHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.chat-header-right{
  display:flex;
  align-items:center;
  gap:6px;
}
#inviteRoomBtn,
#reportRoomBtn,
#blockRoomBtn,
#roomInfoBtn{
  border:none;
  border-radius:10px;
  padding:7px 8px;
  background:rgba(255,149,0,0.14);
  color:#b06400;
  font-size:12px;
  font-weight:800;
}
#inviteRoomBtn{
  background:rgba(0,122,255,0.12);
  color:#007aff;
}
#blockRoomBtn{
  background:rgba(255,59,48,0.12);
  color:#c52f26;
}
#roomInfoBtn{
  min-width:68px;
  min-height:36px;
  border-radius:14px;
  padding:0 12px;
  background:rgba(0,122,255,0.12);
  color:#007aff;
  font-size:13px;
  font-weight:900;
  white-space:nowrap;
}

.chat-header-buttons {
  display: flex;
  gap: 6px;
}


.chat-header-left,
.chat-header-center,
.chat-header-right{
  display:flex;
  align-items:center;
  min-width:0;
}
.chat-header-left{
  flex:0 0 auto;
  width:62px;
}
.chat-header-center{
  flex:1 1 0;
  flex-direction:column;
  text-align:center;
  gap:2px;
  min-width:0;
  overflow:hidden;
  padding:0 8px;
}
.chat-header-right{
  flex:0 0 auto;
  justify-content:flex-end;
  max-width:226px;
  min-width:0;
  gap:5px;
}
#chatRoomName{
  font-size:16px;
  font-weight:600;
  width:100%;
  min-width:0;
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  word-break:normal;
}
#chatRoomUsers{
  font-size:13px;
  color:#666;
  width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#deleteRoomInChat{
  padding:6px 8px;
  font-size:12px;
  border-radius:10px;
  border:1px solid #ddd;
  background:#fff;
  cursor:pointer;
  white-space:nowrap;
}
#roomOwnerIdLabel{
  display:none;
}
/* 채팅 닫기 버튼 - 프로필 뒤로가기 스타일과 통일 */
#closeChat{
  background:#000;
  color:#fff;
  padding:8px 14px;
  font-size:14px;
  font-weight:600;
  border:none;
  border-radius:10px;
  cursor:pointer;
}


/* 방 타입 선택 모달 */
#roomTypeModal {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background: rgba(0,0,0,0.35);
  display: none;
  align-items: flex-end;
  justify-content: center;
  z-index: 120;
}

/* 방 생성 모달 (v1) */
#roomCreateModal{
  position:fixed;
  left:0; right:0; bottom:0; top:0;
  background:rgba(0,0,0,0.35);
  display:none;
  align-items:flex-end;
  justify-content:center;
  padding:0 12px;
  z-index:121;
}
#roomCreateModal.show{display:flex;}
.room-create-box{
  width:100%;
  max-width:420px;
  box-sizing:border-box;
  background:#fff;
  border-radius:18px 18px 0 0;
  padding:18px 20px 22px;
  box-shadow:0 -4px 12px rgba(0,0,0,0.2);
  max-height:calc(100vh - 24px);
  overflow-y:auto;
  overflow-x:hidden;
}
.room-create-title{
  font-size:17px;
  font-weight:700;
  margin-bottom:12px;
}
.room-create-label{
  display:block;
  font-size:13px;
  color:rgba(60,60,67,0.6);
  margin:10px 0 6px;
}
.room-create-input{
  width:100%;
  min-width:0;
  box-sizing:border-box;
  padding:12px;
  font-size:16px;
  border:1px solid #ddd;
  border-radius:12px;
  background:#fff;
}
.room-create-grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:10px;
}
.room-create-grid > div{
  min-width:0;
}
.room-create-custom{
  margin-top:8px;
}
.official-create-fields{
  margin-top:12px;
  padding:12px;
  border-radius:16px;
  background:rgba(0,122,255,0.06);
  border:1px solid rgba(0,122,255,0.16);
}
.official-create-note{
  color:#0b5cad;
  font-size:13px;
  font-weight:800;
  line-height:1.4;
  margin-bottom:8px;
}
.official-create-locked{
  margin-top:10px;
  padding:12px;
  border-radius:14px;
  background:rgba(255,149,0,0.12);
  color:#7a4a00;
  font-size:13px;
  font-weight:800;
  line-height:1.45;
}
.room-create-box.official-mode{
  max-width:560px;
}
.room-create-box.official-mode .room-create-title::after{
  content:" · 채널";
  color:#007aff;
}
#roomCreateStartAt,
#roomCreateEndAt{
  min-width:0;
}
.room-create-btn{
  margin-top:10px;
  width:100%;
  padding:12px 0;
  border-radius:999px;
  border:0;
  font-size:16px;
  cursor:pointer;
}
.room-create-btn-primary{
  background:#000;
  color:#fff;
}
.room-create-btn-cancel{
  background:#eee;
}
@media (min-width: 720px){
  #roomCreateModal{
    align-items:center;
    padding:24px;
  }
  .room-create-box{
    border-radius:18px;
    max-width:560px;
    box-shadow:0 18px 50px rgba(0,0,0,0.22);
  }
}
@media (max-width: 520px){
  .room-create-grid{
    grid-template-columns:1fr;
  }
}

/* Keep the general-room and channel-room creation cards identical in size. */
#roomCreateModal .room-create-box,
#roomCreateModal .room-create-box.official-mode{
  width:min(100%, 560px);
  max-width:560px;
  height:min(78dvh, calc(100vh - 130px));
  max-height:min(78dvh, calc(100vh - 130px));
}
@media (max-width:640px){
  #roomCreateModal .room-create-box,
  #roomCreateModal .room-create-box.official-mode{
    height:min(72dvh, calc(100vh - 170px));
    max-height:min(72dvh, calc(100vh - 170px));
  }
}

/* Room creation modal service polish */
#roomCreateModal{
  padding:0 12px max(12px, env(safe-area-inset-bottom));
}
.room-create-box{
  max-height:min(78dvh, calc(100vh - 130px));
  overscroll-behavior:contain;
}
.room-create-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.room-create-head .room-create-title{
  margin-bottom:0;
  min-width:0;
}
.room-create-close{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border:0;
  border-radius:50%;
  background:rgba(60,60,67,0.1);
  color:#111;
  font-size:24px;
  line-height:1;
  font-weight:700;
  cursor:pointer;
}
.room-create-input{
  max-width:100%;
  display:block;
}
.room-create-grid{
  min-width:0;
}
.room-create-grid > div{
  max-width:100%;
}
.official-image-picker{
  display:grid;
  grid-template-columns:120px minmax(0,1fr);
  gap:10px;
  align-items:start;
}
.official-image-picker img{
  width:120px;
  aspect-ratio:16/9;
  object-fit:cover;
  border-radius:16px;
  background:#dfe8f3;
  border:1px solid rgba(60,60,67,0.12);
}
.official-url-fallback{
  margin-top:8px;
}
.official-image-help{
  margin-top:6px;
  color:rgba(60,60,67,0.55);
  font-size:12px;
  line-height:1.35;
}
.room-create-mini-btn{
  margin-top:8px;
  border:0;
  border-radius:999px;
  padding:8px 10px;
  background:rgba(60,60,67,0.1);
  color:#111;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}
.room-create-box.official-mode{
  max-width:560px;
}
.room-create-box.official-mode .room-create-title::after{
  content:" · 채널";
  color:#007aff;
}
#roomCreateStartAt,
#roomCreateEndAt{
  max-width:100%;
  font-size:14px;
}
@media (max-width: 640px){
  .room-create-box{
    padding:14px 16px 16px;
    max-height:min(72dvh, calc(100vh - 170px));
  }
  .room-create-grid{
    grid-template-columns:1fr;
  }
  .official-image-picker{
    grid-template-columns:1fr;
  }
  .official-image-picker img{
    width:100%;
  }
  .room-create-label{
    margin:8px 0 5px;
  }
  .room-create-input{
    padding:10px 11px;
  }
}
#roomTypeModal.show {
  display: flex;
}
.room-type-box {
  width: 100%;
  max-width: 420px;
  background: #fff;
  border-radius: 18px 18px 0 0;
  padding: 18px 20px 22px;
  box-shadow: 0 -4px 12px rgba(0,0,0,0.2);
  max-height: calc(100vh - 24px);
  overflow-y: auto;
  overflow-x: hidden;
  box-sizing: border-box;
}
.room-type-title {
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 14px;
}
.room-type-buttons {
  display: flex;
  gap: 10px;
}
.room-type-btn {
  flex: 1;
  padding: 12px 0;
  border-radius: 999px;
  border: 0;
  font-size: 16px;
  cursor: pointer;
}
.room-type-btn-open {
  background: #00c853;
  color: #fff;
}
.room-type-btn-private {
  background: #2962ff;
  color: #fff;
}
.room-type-btn-official {
  background: #ff2d55; /* iOS system pink */
  color: #fff;
}
.room-type-btn-cancel {
  margin-top: 10px;
  width: 100%;
  padding: 10px 0;
  border-radius: 999px;
  border: 0;
  font-size: 15px;
  background: #eee;
  cursor: pointer;
}

/* 마커 라벨 가독성 강화 */
.room-label {
  padding: 3px 7px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  background: rgba(255,255,255,0.9);
  color: #111;
  white-space: nowrap;
}
.room-label-open {
  border: 1px solid #00c853;
}
.room-label-private {
  border: 1px solid #2962ff;
}
.room-label-official {
  border: 1px solid #ff4081;
}

/* ===== iOS overrides (kept at end for precedence) ===== */
#topBar{
  background:rgba(255,255,255,0.72);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom:1px solid var(--ios-sep);
}
#topLogo{
  width:min(330px, 82vw);
  height:54px;
}

#searchBar{
  background:rgba(255,255,255,0.72);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border:1px solid var(--ios-sep);
  border-radius:var(--ios-radius);
  box-shadow:var(--ios-shadow);
  padding:4px 8px;
}
#searchInput{
  border:1px solid var(--ios-sep);
  border-radius:14px;
  background:rgba(255,255,255,0.9);
  padding:6px 9px;
  font-size:15px;
}
#searchBtn{
  background:var(--ios-primary);
  border-radius:14px;
  padding:6px 11px;
  font-size:15px;
}

#categoryBar{
  background:rgba(255,255,255,0.72);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom:1px solid var(--ios-sep);
}
.catWrap button{
  background:rgba(255,255,255,0.75);
  border:1px solid var(--ios-sep);
  border-radius:999px;
}
.catWrap button:active{ transform:scale(0.98); }

#floatingBtns button{
  background:rgba(255,255,255,0.8);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border:1px solid var(--ios-sep);
  box-shadow:var(--ios-shadow);
}

#communityCard{
  background:rgba(255,255,255,0.85);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border:1px solid var(--ios-sep);
  border-radius:var(--ios-radius);
  box-shadow:var(--ios-shadow);
}

#chatRoom{
  border-top:1px solid var(--ios-sep);
  border-top-left-radius:22px;
  border-top-right-radius:22px;
  overflow:hidden;
  box-shadow:0 -10px 30px rgba(0,0,0,0.12);
  top:60px;
  height:auto;
  z-index:140;
}
#chatHeader{
  padding:7px 10px;
  background:rgba(255,255,255,0.72);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom:1px solid var(--ios-sep);
}
#chatRoomName{ font-size:18px; font-weight:800; }
#chatRoomUsers{ font-size:13px; color:var(--ios-secondary); }

/* 채팅방 상단 배너: 권장 원본 1200 x 200 (6:1) */
#chatBannerWrap{
  background:rgba(255,255,255,0.62);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom:1px solid var(--ios-sep);
  padding:10px 12px;
}
#chatBannerWrap.hide{
  display:none;
}
#chatBannerTrack{
  width:100%;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(60,60,67,0.12);
  box-shadow:0 6px 18px rgba(0,0,0,0.08);
  touch-action:pan-y;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
}
#chatBannerTrack:active{ cursor:grabbing; }
#chatBannerImg{
  display:block;
  width:100%;
  aspect-ratio:6 / 1;
  height:auto;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
  -webkit-user-drag:none;
}

#chatMessages{
  background:var(--ios-bg);
  padding:12px 10px 14px;
  overflow-y:auto;
}
.chat-empty-guide{
  width:min(390px,calc(100% - 24px));
  box-sizing:border-box;
  margin:clamp(36px,12vh,110px) auto 24px;
  padding:24px 18px 18px;
  border:1px solid #dce7f5;
  border-radius:22px;
  background:#fff;
  box-shadow:0 10px 30px rgba(31,91,150,.10);
  text-align:center;
}
.chat-empty-guide-icon{
  display:grid;
  width:54px;
  height:54px;
  margin:0 auto 12px;
  place-items:center;
  border-radius:18px;
  background:#eaf4ff;
  font-size:28px;
}
.chat-empty-guide strong{display:block;color:#172033;font-size:17px;line-height:1.4}
.chat-empty-guide p{margin:8px 0 17px;color:#687386;font-size:13px;line-height:1.55}
.chat-empty-guide>div{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.chat-empty-guide button{min-height:42px;border:0;border-radius:12px;font-size:13px;font-weight:850}
.chat-empty-guide [data-empty-invite]{background:#087cff;color:#fff}
.chat-empty-guide [data-empty-message]{background:#edf3f8;color:#243247}
.chat-date-divider{
  width:max-content;
  max-width:80%;
  margin:8px auto 12px;
  padding:5px 10px;
  border-radius:999px;
  background:rgba(60,60,67,0.10);
  color:#666;
  font-size:12px;
  font-weight:700;
}
.chat-message-row{
  display:flex;
  align-items:flex-end;
  margin:7px 0;
}
.chat-message-row.mine{
  justify-content:flex-end;
  align-items:flex-end;
  gap:8px;
}
.chat-message-row.theirs{
  justify-content:flex-start;
  align-items:flex-end;
  gap:8px;
}
.chat-bubble{
  display:inline-block;
  width:fit-content;
  max-width:min(68vw, 320px);
  min-width:70px;
  box-sizing:border-box;
  padding:9px 11px 7px;
  border-radius:18px;
  box-shadow:0 4px 12px rgba(0,0,0,0.05);
  word-break:keep-all;
  overflow-wrap:break-word;
  white-space:pre-wrap;
}
.chat-message-row.mine .chat-bubble{
  background:rgba(0,122,255,0.88);
  color:#fff;
  border-radius:18px;
}
.chat-message-row.mine .chat-bubble.image-bubble,
.chat-message-row.theirs .chat-bubble.image-bubble{
  width:min(280px,calc(100vw - 112px));
  max-width:100%;
  padding:0;
  background:transparent;
  border:none;
  box-shadow:none;
  color:inherit;
  overflow:visible;
}
.chat-message-row.theirs .chat-bubble{
  background:rgba(255,255,255,0.92);
  color:#111;
  border:1px solid rgba(60,60,67,0.10);
  border-radius:18px;
}
.chat-stack{
  width:min(calc(100% - 46px), 360px);
  max-width:min(calc(100% - 46px), 360px);
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.chat-message-row.mine .chat-stack{
  align-items:flex-end;
}
.chat-avatar-btn{
  flex:0 0 auto;
  width:34px;
  height:34px;
  padding:0;
  border:none;
  border-radius:50%;
  overflow:hidden;
  background:linear-gradient(135deg,rgba(0,122,255,0.16),rgba(52,199,89,0.16));
  color:#007aff;
  font-size:14px;
  font-weight:900;
  box-shadow:0 3px 10px rgba(0,0,0,0.08);
  cursor:pointer;
}
.chat-avatar-btn img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.chat-avatar-fallback{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
}
.chat-sender-name{
  max-width:100%;
  margin:0 0 4px;
  padding:0 3px;
  border:none;
  background:transparent;
  color:#4a4a4a;
  font-size:12px;
  font-weight:800;
  text-align:left;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  cursor:pointer;
}
.chat-message-row.mine .chat-sender-name{
  text-align:right;
}
.chat-text{
  display:block;
  font-size:15px;
  line-height:1.38;
  min-width:0;
  word-break:keep-all;
  overflow-wrap:break-word;
  white-space:pre-wrap;
}
.chat-meta{
  margin-top:5px;
  font-size:10px;
  opacity:.68;
  text-align:right;
}
.chat-meta-btn{
  display:block;
  width:100%;
  margin:5px 0 0;
  padding:0;
  border:none;
  background:transparent;
  color:inherit;
  font:inherit;
  opacity:.72;
  text-align:right;
  cursor:pointer;
}
.chat-message-row.theirs .chat-meta-btn{
  text-align:left;
}
.chat-image{
  display:block;
  width:100%;
  max-height:min(420px,55vh);
  object-fit:cover;
  border-radius:16px;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,0.10);
}
.chat-gallery-card{
  display:grid;
  width:100%;
  max-width:280px;
  gap:3px;
  overflow:hidden;
  border-radius:16px;
  background:rgba(60,60,67,0.12);
  box-shadow:0 6px 18px rgba(0,0,0,0.10);
}
.chat-gallery-card.count-1{
  grid-template-columns:1fr;
}
.chat-gallery-card.count-2{
  grid-template-columns:repeat(2,1fr);
}
.chat-gallery-card.count-3,
.chat-gallery-card.count-4{
  grid-template-columns:repeat(2,1fr);
}
.chat-gallery-cell{
  position:relative;
  display:block;
  min-width:0;
  aspect-ratio:1/1;
  padding:0;
  border:none;
  background:#e5e5ea;
  overflow:hidden;
  cursor:pointer;
}
.chat-gallery-card.count-1 .chat-gallery-cell{
  aspect-ratio:4/3;
}
.chat-gallery-card.count-3 .chat-gallery-cell:first-child{
  grid-row:span 2;
  aspect-ratio:auto;
}
.chat-gallery-cell .chat-image{
  width:100%;
  height:100%;
  max-height:none;
  border-radius:0;
  box-shadow:none;
}
.chat-gallery-more{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,0.48);
  color:#fff;
  font-size:22px;
  font-weight:900;
}
.chat-gallery-count{
  margin-top:5px;
  padding:0 3px;
  color:#555;
  font-size:11px;
  font-weight:800;
  text-align:right;
}
.chat-bubble.image-bubble .chat-meta{
  display:block;
  width:100%;
  margin-top:4px;
  padding:0 3px;
  color:#555;
  text-shadow:none;
}
.chat-message-row.mine .chat-bubble.image-bubble .chat-meta{
  color:#555;
}
.profile-action-buttons{
  display:grid;
  gap:8px;
  margin:14px 0 10px;
}
.profile-action-buttons button{
  width:100%;
  border:none;
  border-radius:14px;
  padding:12px 10px;
  background:rgba(0,122,255,0.10);
  color:#007aff;
  font-size:14px;
  font-weight:900;
}
.profile-action-buttons button.danger{
  background:rgba(255,59,48,0.11);
  color:#c52f26;
}
.profile-action-buttons button:disabled{
  opacity:.55;
  cursor:default;
}
.profile-action-buttons button.hide{
  display:none;
}
.friendListItem{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 0;
  border-bottom:1px solid rgba(60,60,67,0.10);
}
.friendListItem:last-child{
  border-bottom:none;
}
.friendListItem strong{
  display:block;
  font-size:15px;
  font-weight:900;
}
.friendListItem span{
  display:block;
  margin-top:4px;
  color:rgba(60,60,67,0.68);
  font-size:13px;
  word-break:break-all;
}
.friendListActions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:6px;
}
.friendListItem button{
  flex:0 0 auto;
  border:none;
  border-radius:999px;
  padding:8px 11px;
  background:rgba(255,59,48,0.10);
  color:#b42318;
  font-size:12px;
  font-weight:900;
}
.friendListActions button:first-child{
  background:rgba(0,122,255,0.10);
  color:#075985;
}
.room-notice-pinned{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:space-between;
  padding:10px 12px;
  background:#fff8e5;
  border-bottom:1px solid rgba(255,149,0,0.24);
  color:#2a2114;
  font-size:13px;
  line-height:1.35;
}
.room-notice-copy{
  min-width:0;
  display:flex;
  gap:8px;
  align-items:flex-start;
  flex:1 1 auto;
}
.room-notice-pinned strong{
  flex:0 0 auto;
  color:#b45f00;
}
.room-notice-pinned span{
  min-width:0;
  word-break:break-word;
}
#editRoomNoticeBtn{
  flex:0 0 auto;
  border:none;
  border-radius:999px;
  padding:7px 10px;
  background:rgba(0,122,255,0.12);
  color:#007aff;
  font-size:12px;
  font-weight:900;
}
#roomInfoSheet{
  position:fixed;
  inset:0;
  z-index:140;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:18px;
  padding-bottom:calc(18px + env(safe-area-inset-bottom));
  background:rgba(0,0,0,0.22);
  box-sizing:border-box;
}
#roomInfoSheet.hide{
  display:none;
}
.room-info-box{
  width:min(440px,100%);
  border-radius:22px;
  padding:14px;
  background:rgba(255,255,255,0.96);
  box-shadow:0 -12px 34px rgba(0,0,0,0.18);
  box-sizing:border-box;
}
.room-info-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.room-info-head strong{
  color:#111;
  font-size:17px;
  font-weight:900;
}
.room-info-created{
  flex:1 1 auto;
  min-width:0;
  color:rgba(60,60,67,0.52);
  font-size:12px;
  font-weight:800;
  text-align:left;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#roomInfoClose{
  flex:0 0 auto;
  border:none;
  border-radius:12px;
  min-width:52px;
  height:34px;
  background:rgba(60,60,67,0.10);
  color:#111;
  font-size:13px;
  font-weight:900;
}
.room-info-title{
  margin:10px 0 12px;
  padding:10px 12px;
  border-radius:14px;
  background:#f6f8fb;
  color:#333;
  font-size:14px;
  font-weight:800;
  line-height:1.35;
  word-break:break-word;
}
.room-info-actions{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.room-info-actions button{
  width:100%;
  min-height:44px;
  border:none;
  border-radius:14px;
  background:rgba(0,122,255,0.12);
  color:#007aff;
  font-size:15px;
  font-weight:900;
}
.room-info-actions button.danger{
  background:rgba(255,59,48,0.12);
  color:#c52f26;
}
.room-info-actions button.leave{
  background:rgba(255,149,0,0.14);
  color:#b45309;
}
.room-info-actions button.hide{
  display:none;
}
#chatRoomUsers{
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
#chatRoomUsers:active{
  opacity:.72;
}
#roomParticipantsSheet{
  position:fixed;
  inset:0;
  z-index:145;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:14px;
  background:rgba(0,0,0,0.22);
  box-sizing:border-box;
}
#roomParticipantsSheet.hide{
  display:none;
}
.room-participants-box{
  width:min(430px, calc(100vw - 28px));
  max-height:min(72dvh, calc(var(--app-height, 100dvh) - 40px));
  overflow:hidden;
  border-radius:22px;
  padding:14px;
  background:rgba(255,255,255,0.97);
  box-shadow:0 -12px 34px rgba(0,0,0,0.18);
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
}
.room-participants-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.room-participants-head strong{
  color:#111;
  font-size:17px;
  font-weight:900;
}
#roomParticipantsClose{
  flex:0 0 auto;
  border:none;
  border-radius:12px;
  min-width:52px;
  height:34px;
  background:rgba(60,60,67,0.10);
  color:#111;
  font-size:13px;
  font-weight:900;
}
.room-participants-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:0;
  width:100%;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
}
.room-participant-row{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  min-width:0;
  min-height:54px;
  border:none;
  border-radius:16px;
  padding:9px 10px;
  background:#f6f8fb;
  text-align:left;
  box-sizing:border-box;
}
.room-participant-profile-btn{
  flex:1 1 auto;
  min-width:0;
  max-width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  border:0;
  padding:0;
  background:transparent;
  text-align:left;
}
.room-participant-kick-btn{
  flex:0 0 70px;
  border:0;
  border-radius:12px;
  min-width:0;
  height:34px;
  padding:0 8px;
  background:rgba(255,59,48,0.12);
  color:#d70015;
  font-size:12px;
  font-weight:900;
}
.room-participant-avatar{
  flex:0 0 auto;
  width:36px;
  height:36px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,122,255,0.12);
  color:#007aff;
  font-size:15px;
  font-weight:900;
}
.room-participant-body{
  display:flex;
  flex-direction:column;
  min-width:0;
  flex:1 1 auto;
}
.room-participant-body strong{
  color:#111;
  font-size:14px;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.room-participant-body em{
  color:rgba(60,60,67,0.62);
  font-size:12px;
  font-style:normal;
  font-weight:800;
}
.room-participant-empty{
  padding:16px 12px;
  border-radius:16px;
  background:#f6f8fb;
  color:rgba(60,60,67,0.68);
  font-size:14px;
  font-weight:800;
  text-align:center;
}
#chatInputWrap{
  background:rgba(255,255,255,0.85);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-top:1px solid var(--ios-sep);
  gap:8px;
  align-items:center;
  padding-bottom:calc(10px + env(safe-area-inset-bottom));
}
#chatPhotoBtn{
  flex:0 0 auto;
  width:38px;
  height:38px;
  border:none;
  border-radius:14px;
  background:rgba(0,122,255,0.12);
  color:var(--ios-primary);
  font-size:24px;
  font-weight:700;
  line-height:1;
}
.chat-plus-menu{
  position:fixed;
  z-index:10030;
  display:flex;
  gap:7px;
  padding:8px;
  border-radius:18px;
  background:rgba(255,255,255,0.96);
  border:1px solid rgba(60,60,67,0.14);
  box-shadow:0 12px 30px rgba(15,23,42,0.18);
}
.chat-plus-menu.hide{
  display:none;
}
.chat-plus-menu button{
  border:0;
  border-radius:13px;
  min-width:58px;
  min-height:38px;
  padding:0 10px;
  background:#f2f4f7;
  color:#101828;
  font-size:13px;
  font-weight:950;
}
#chatInput{
  background:#fff;
  border:1px solid var(--ios-sep);
  border-radius:16px;
  min-width:0;
}
#sendBtn{
  background:var(--ios-primary);
  color:#fff;
  border:none;
  border-radius:16px;
}
.chat-upload-preview{
  align-self:flex-end;
  width:min(230px, 78%);
  margin:6px 0;
  padding:9px;
  border-radius:16px;
  background:#eaf3ff;
  border:1px solid rgba(0,122,255,0.12);
  box-shadow:0 5px 14px rgba(15,23,42,0.08);
}
.chat-upload-title{
  color:#111827;
  font-size:12px;
  font-weight:950;
}
.chat-upload-thumbs{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:5px;
  margin-top:7px;
}
.chat-upload-thumb,
.chat-upload-more{
  overflow:hidden;
  aspect-ratio:1/1;
  border-radius:10px;
  background:#dbeafe;
}
.chat-upload-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.chat-upload-more{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#007AFF;
  font-size:13px;
  font-weight:950;
}
.chat-upload-progress{
  overflow:hidden;
  height:5px;
  margin-top:8px;
  border-radius:999px;
  background:rgba(0,122,255,0.14);
}
.chat-upload-progress span{
  display:block;
  height:100%;
  width:0;
  border-radius:999px;
  background:#007AFF;
  transition:width .18s ease;
}
.chat-upload-status{
  margin-top:5px;
  color:#475467;
  font-size:11px;
  font-weight:850;
}
.chat-upload-preview.done{
  background:#ecfdf3;
  border-color:rgba(18,183,106,0.18);
}
#chatImageModal{
  position:fixed;
  inset:0;
  z-index:180;
  background:rgba(0,0,0,0.84);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
}
#chatImageModal.hide{
  display:none;
}
#chatImageModal img{
  max-width:100%;
  max-height:88vh;
  border-radius:14px;
  object-fit:contain;
  z-index:1;
  cursor:pointer;
}
.chat-image-viewer-btn{
  position:absolute;
  top:50%;
  z-index:2;
  width:44px;
  height:58px;
  transform:translateY(-50%);
  border:none;
  border-radius:16px;
  background:rgba(255,255,255,0.18);
  color:#fff;
  font-size:42px;
  font-weight:700;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.chat-image-viewer-prev{
  left:12px;
}
.chat-image-viewer-next{
  right:12px;
}
.chat-image-viewer-close{
  position:absolute;
  top:calc(12px + env(safe-area-inset-top));
  right:12px;
  z-index:3;
  width:42px;
  height:42px;
  border:none;
  border-radius:50%;
  background:rgba(255,255,255,0.18);
  color:#fff;
  font-size:30px;
  font-weight:700;
  line-height:1;
  cursor:pointer;
}
.chat-image-viewer-count{
  position:absolute;
  left:50%;
  bottom:calc(18px + env(safe-area-inset-bottom));
  z-index:2;
  transform:translateX(-50%);
  min-width:58px;
  padding:7px 11px;
  border-radius:999px;
  background:rgba(0,0,0,0.48);
  color:#fff;
  font-size:13px;
  font-weight:900;
  text-align:center;
}
.chat-image-viewer-btn.hide,
.chat-image-viewer-count.hide{
  display:none;
}

#closeChat{
  background:rgba(255,255,255,0.85);
  color:var(--ios-primary);
  border:1px solid var(--ios-sep);
  border-radius:14px;
}
#deleteRoomInChat{
  border-radius:14px;
  border:1px solid var(--ios-sep);
  background:rgba(255,255,255,0.8);
}

#chatHeader .chat-header-left{
  width:62px;
  flex:0 0 62px;
}
#chatHeader .chat-header-center{
  flex:1 1 0;
  min-width:0;
  overflow:hidden;
}
#chatHeader .chat-header-right{
  flex:0 0 auto;
  max-width:168px;
  min-width:0;
}
#chatHeader #chatRoomName,
#chatHeader #chatRoomUsers{
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  word-break:normal;
}

#bottomNav{
  background:rgba(255,255,255,0.72);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-top:1px solid var(--ios-sep);
  height:72px;
  padding-bottom:env(safe-area-inset-bottom);
}
#bottomNav button{
  font-size:12px;
  color:#111;
  opacity:0.9;
  padding:8px 10px;
  border-radius:14px;
}
#bottomNav button:active{ background:rgba(0,0,0,0.06); }

#loginPopup{
  border-radius:22px;
  box-shadow:var(--ios-shadow);
}
.kakao-btn,.google-btn{ border-radius:16px; }

#profilePanel{
  background:var(--ios-bg) !important;
  padding:0 !important;
  display:flex !important;
  flex-direction:column !important;
  height:100dvh !important;
  max-height:100dvh !important;
  overflow:hidden !important;
}
#profileHeader{
  flex:0 0 auto !important;
  background:rgba(255,255,255,0.72) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border-bottom:1px solid var(--ios-sep) !important;
  padding:14px 14px !important;
  margin:0 !important;
}
#backProfile{
  background:rgba(255,255,255,0.85) !important;
  color:var(--ios-primary) !important;
  border:1px solid var(--ios-sep) !important;
  border-radius:14px !important;
}
#profileContent{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
  overscroll-behavior:contain !important;
  padding:18px 14px calc(40px + env(safe-area-inset-bottom)) !important;
}
#profileImage{ border:1px solid var(--ios-sep) !important; }
.profile-account-card{
  width:min(100%,360px);
  margin:14px auto 0;
  padding:12px;
  border:1px solid var(--ios-sep);
  border-radius:16px;
  background:rgba(255,255,255,0.88);
  box-shadow:0 6px 18px rgba(0,0,0,0.04);
}
.profile-account-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:5px 0;
  font-size:13px;
}
.profile-account-row span{
  flex:0 0 auto;
  color:#777;
  font-weight:800;
}
.profile-account-row strong{
  min-width:0;
  color:#111;
  font-size:13px;
  font-weight:900;
  text-align:right;
  word-break:break-all;
}
#copyProfileUidBtn,
#requestAdminRoleBtn{
  width:100%;
  margin-top:9px;
  border:none;
  border-radius:13px;
  padding:10px 12px;
  background:rgba(0,122,255,0.12);
  color:var(--ios-primary);
  font-size:14px;
  font-weight:900;
}
#requestAdminRoleBtn{
  background:rgba(52,199,89,0.14);
  color:#167a34;
}
#profilePageLogout{width:100%;margin-top:7px;border:0;border-radius:12px;padding:9px 10px;font-weight:900}
#requestAdminRoleBtn.hide{
  display:none !important;
}
#editProfileBtn{
  border:1px solid var(--ios-sep) !important;
  border-radius:14px !important;
  background:rgba(255,255,255,0.9) !important;
  color:var(--ios-primary) !important;
}
#logoutBtn{ border-radius:16px !important; }
.policyActionDanger{
  display:block;
  width:100%;
  min-height:44px;
  margin-top:14px;
  border:none;
  border-radius:14px;
  background:rgba(255,59,48,0.12);
  color:#c52f26;
  font-size:15px;
  font-weight:900;
}


/* Bottom Sheet (Category) */
.backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,0.25);
  z-index:49;
  opacity:0;
  transition:opacity 180ms ease;
  will-change:opacity;
  pointer-events:none;
}
.sheet{
  position:fixed;left:0;right:0;bottom:0;
  display:flex;
  flex-direction:column;
  background:rgba(250,250,252,0.92);
  backdrop-filter: blur(18px);
  border-top-left-radius:24px;border-top-right-radius:24px;
  box-shadow:0 -12px 30px rgba(0,0,0,0.12);
  z-index:50;
  height:min(70vh,560px);
  overflow:hidden;
  padding:10px 14px 18px;
  box-sizing:border-box;
  opacity:0;
  transform:translate3d(0,24px,0);
  transition:
    transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1),
    opacity 180ms ease;
  will-change:transform,opacity;
}
.backdrop.active{
  opacity:1;
  pointer-events:auto;
}
.sheet.active{
  opacity:1;
  transform:translate3d(0,0,0);
}
.sheet.closing{
  opacity:0;
  transform:translate3d(0,20px,0);
}
.backdrop.closing{
  opacity:0;
}
.sheet.hide{display:none;}
.backdrop.hide{display:none;}
.sheetHandle{
  flex:0 0 auto;
  width:72px;height:7px;border-radius:999px;
  background:linear-gradient(90deg,#0a84ff,#58b7ff);
  box-shadow:0 3px 10px rgba(0,122,255,0.24);
  margin:7px auto 11px;
  cursor:grab;
  touch-action:none;
  user-select:none;
}
.sheetHandle:active,
#sheetHandle:active{
  cursor:grabbing;
}
.sheetHeader{
  flex:0 0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:4px 2px 10px;
}
.sheetHeaderActions{
  display:flex;
  align-items:center;
  gap:7px;
}
#sheetTitle{font-size:18px;font-weight:800;}
#categoryRegisterBtn{
  border:none;
  border-radius:12px;
  min-height:34px;
  padding:0 10px;
  background:#007AFF;
  color:#fff;
  font-size:12px;
  font-weight:900;
}
#sheetClose{
  border:none;background:rgba(60,60,67,0.08);
  width:34px;height:34px;border-radius:12px;
  font-size:16px;
}
.sheet.official-image-sheet #sheetClose{
  display:none !important;
}
body.official-image-sheet-open #sheetClose,
body.official-image-sheet-open #bottomSheetClose{
  display:none !important;
}
.sheetSponsor{
  flex:0 0 auto;
  display:flex;gap:10px;align-items:center;
  padding:10px;
  border-radius:18px;
  background:rgba(255,255,255,0.75);
  border:1px solid rgba(60,60,67,0.12);
  margin-bottom:10px;
}
.sheetSponsor img{
  width:56px;height:56px;border-radius:14px;
  object-fit:cover;
  background:#ddd;
}
.sponsorTextWrap{flex:1;min-width:0;}
#sponsorText{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sponsorBadge{
  display:inline-block;margin-top:4px;
  font-size:11px;font-weight:800;
  padding:4px 8px;border-radius:999px;
  background:rgba(255,149,0,0.14);
  color:rgba(255,149,0,1);
}
.sheetList{
  flex:1 1 auto;
  min-height:0;
  display:flex;flex-direction:column;gap:8px;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  padding-bottom:110px;
  box-sizing:border-box;
}
.category-demo-detail{
  padding:13px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,255,255,0.96),rgba(235,248,255,0.92));
  border:1px solid rgba(0,122,255,0.18);
  box-shadow:0 10px 26px rgba(0,0,0,0.08);
}
.demo-detail-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.demo-detail-kicker{
  color:#007AFF;
  font-size:11px;
  font-weight:900;
}
.demo-detail-title{
  margin-top:3px;
  color:#111;
  font-size:17px;
  font-weight:900;
  line-height:1.2;
}
.demo-detail-meta{
  margin-top:4px;
  color:#60646c;
  font-size:12px;
  line-height:1.35;
}
#demoDetailClose{
  border:none;
  border-radius:12px;
  padding:7px 9px;
  background:rgba(60,60,67,0.08);
  color:#444;
  font-size:12px;
  font-weight:800;
  flex:0 0 auto;
}
.demo-flow{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin-top:12px;
}
.demo-flow div{
  min-height:58px;
  padding:9px 8px;
  border-radius:13px;
  background:rgba(255,255,255,0.76);
  border:1px solid rgba(60,60,67,0.08);
}
.demo-flow strong{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  border-radius:999px;
  background:rgba(0,122,255,0.13);
  color:#007AFF;
  font-size:11px;
}
.demo-flow span{
  display:block;
  margin-top:6px;
  color:#222;
  font-size:11px;
  font-weight:800;
  line-height:1.25;
}
.demo-detail-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin-top:10px;
}
.demo-detail-actions button{
  border:none;
  min-height:36px;
  border-radius:12px;
  background:#007AFF;
  color:#fff;
  font-size:12px;
  font-weight:900;
}
.demo-detail-actions button:nth-child(2){
  background:#09a7e8;
}
.demo-detail-actions button:nth-child(3){
  background:#2f855a;
}
.sheetItem{
  display:flex;align-items:center;justify-content:space-between;
  padding:7px 10px;
  border-radius:18px;
  background:rgba(255,255,255,0.72);
  border:1px solid rgba(60,60,67,0.10);
}
.sheetItem .meta{font-size:12px;opacity:0.72;margin-top:2px;}
.sheetItem .left{min-width:0;}
.sheetItem .title{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sheetItemDemo{
  align-items:flex-start;
}
.demoTags{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-top:7px;
}
.demoTags span{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:3px 7px;
  border-radius:999px;
  background:rgba(0,122,255,0.10);
  color:#0066cc;
  font-size:11px;
  font-weight:800;
}
.sheetItem button{
  border:none;border-radius:14px;
  padding:8px 10px;
  background:rgba(0,122,255,0.12);
  color:rgba(0,122,255,1);
  font-weight:800;
}
.catWrap button.active{
  background:rgba(0,122,255,0.14);
  color:rgba(0,122,255,1);
  font-weight:800;
}

#topBar,#searchBar,#categoryBar{pointer-events:auto;}
#bottomNav{
  padding-bottom:env(safe-area-inset-bottom);
  z-index:120;
  backdrop-filter:blur(18px);
}
#bottomNav button.active{font-weight:700;color:#007AFF;}
#map{
  height:calc(100% - 221px);
  z-index:1;
}
#bottomSheet{
  position:fixed;
  left:0;
  bottom:0;
  width:100%;
  height:min(70vh,560px);
  display:flex;
  flex-direction:column;
  background:#fff;
  border-radius:24px 24px 0 0;
  box-shadow:0 -6px 30px rgba(0,0,0,.12);
  transform:translateY(105%);
  transition:transform .22s ease;
  z-index:110;
  pointer-events:auto;
}
#bottomSheet.active{transform:translateY(0);}
#sheetHandle{
 flex:0 0 auto;
 width:72px;height:7px;
 background:linear-gradient(90deg,#0a84ff,#58b7ff);
 box-shadow:0 3px 10px rgba(0,122,255,0.24);
 border-radius:999px;
 margin:12px auto;
 cursor:grab;
 touch-action:none;
 user-select:none;
}
.bottomSheetHeader{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 18px 10px;
}
#bottomSheetTitle{
  font-size:18px;
  font-weight:800;
}
#bottomSheetClose{
  border:none;
  background:rgba(60,60,67,0.08);
  width:34px;
  height:34px;
  border-radius:12px;
  font-size:16px;
}
#sheetContent{
  flex:1 1 auto;
  min-height:0;
  padding:0 20px 110px;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  box-sizing:border-box;
}
#sheetContent h3{margin:4px 0 10px;font-size:24px;}
#sheetContent p{color:#666;line-height:1.5;font-size:15px;}
.miniList{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:10px;
}
.miniRoom{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  width:100%;
  border:1px solid rgba(60,60,67,0.12);
  border-radius:12px;
  background:#f8f9fb;
  padding:10px 12px;
  text-align:left;
}
.miniRoom span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:800;
}
.miniRoom em{
  flex:0 0 auto;
  font-style:normal;
  font-size:12px;
  color:#007AFF;
}
.miniEmpty{
  padding:12px;
  border-radius:12px;
  background:#f8f9fb;
  color:#666;
  font-size:13px;
}
.chatSection{
  margin-bottom:12px;
}
.chatSectionTitle{
  margin:2px 0 7px;
  color:#111;
  font-size:13px;
  font-weight:900;
}
.chatSection .miniList{
  margin-bottom:0;
}
.chatSectionPrimary{
  padding:12px;
  border:1px solid rgba(0,122,255,0.18);
  border-radius:16px;
  background:#f5f9ff;
}
.chatExploreLabel{
  margin:18px 0 10px;
  color:#667085;
  font-size:12px;
  font-weight:900;
}
.profileHeroActions{
  position:absolute;
  top:12px;
  right:4px;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
  z-index:2;
}
.profileHeroActions #profilePageLogout{
  position:static;
  width:auto!important;
  margin:0!important;
}
.profileHeroAdminEntry{
  border:1px solid #b9d5ff;
  border-radius:10px;
  padding:7px 10px;
  background:#eef5ff;
  color:#007aff;
  font-size:11px;
  font-weight:950;
}
.hotDemoList{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}
.hotDemoList button{
  min-height:58px;
  border:1px solid rgba(60,60,67,0.12);
  border-radius:12px;
  background:#f8f9fb;
  padding:10px;
  text-align:left;
}
.hotDemoList span{
  display:block;
  color:#111;
  font-size:13px;
  font-weight:900;
  line-height:1.25;
}
.hotDemoList em{
  display:block;
  margin-top:5px;
  color:#007AFF;
  font-style:normal;
  font-size:11px;
  font-weight:800;
}

.category-results-panel{
  position:fixed;
  top:var(--category-results-top, 136px);
  right:10px;
  bottom:76px;
  left:10px;
  z-index:92;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid rgba(60,60,67,.12);
  border-radius:20px;
  background:rgba(255,255,255,.98);
  box-shadow:0 18px 55px rgba(0,0,0,.18);
  backdrop-filter:blur(20px);
}
.category-results-panel.hide{display:none;}
.category-results-head{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px 16px 12px;
  border-bottom:1px solid rgba(60,60,67,.10);
}
.category-results-head strong,
.category-results-head span{display:block;}
.category-results-head strong{font-size:20px;font-weight:950;color:#111;}
.category-results-head span{margin-top:3px;font-size:12px;color:#6b6b73;}
.category-results-head button{
  width:40px;height:40px;border:0;border-radius:14px;
  background:rgba(60,60,67,.08);font-size:18px;font-weight:800;
}
#categoryResultsContent{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding:14px;
  overscroll-behavior:contain;
}
.commerce-search-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr);
  gap:10px;
  align-items:end;
  margin-bottom:16px;
  padding:14px;
  border-radius:18px;
  background:#f4f6f9;
}
.commerce-search-form label{display:flex;flex-direction:column;gap:6px;min-width:0;}
.commerce-search-form label>span{font-size:12px;font-weight:850;color:#555;}
.commerce-search-form input,
.commerce-search-form select{
  width:100%;min-width:0;height:46px;box-sizing:border-box;
  border:1px solid rgba(60,60,67,.16);border-radius:13px;
  background:#fff;padding:0 12px;font-size:14px;color:#111;
}
.commerce-trip-type{
  grid-column:1/-1;display:flex;gap:16px;padding:0 2px;
  font-size:13px;font-weight:800;color:#333;
}
.commerce-trip-type label{display:flex;flex-direction:row;align-items:center;gap:6px;}
.commerce-trip-type input{width:auto;height:auto;}
.commerce-swap{
  width:42px;height:46px;border:0;border-radius:13px;background:#fff;
  color:#007aff;font-size:22px;font-weight:900;
}
.commerce-search-submit{
  grid-column:1/-1;height:48px;border:0;border-radius:14px;
  background:#111;color:#fff;font-size:15px;font-weight:900;
}
.commerce-hotel-form{grid-template-columns:repeat(3,minmax(0,1fr));}
.commerce-hotel-form .commerce-wide{grid-column:1/-1;}
.commerce-date-grid{
  grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;min-width:0;max-width:100%;
}
.commerce-date-grid label{min-width:0;max-width:100%;overflow:hidden;}
.commerce-date-grid input[type="date"]{
  display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box;
  height:46px;line-height:46px;padding-top:0;padding-bottom:0;text-align:center;
  -webkit-appearance:none;appearance:none;
}
.commerce-date-grid input[type="date"]::-webkit-date-and-time-value{
  display:flex;align-items:center;justify-content:center;
  width:100%;height:46px;min-height:46px;margin:0;
  line-height:46px;text-align:center;
}
.commerce-restaurant-form,
.commerce-place-search-form{grid-template-columns:1fr;}
.commerce-restaurant-form .commerce-wide,
.commerce-place-search-form .commerce-wide{grid-column:1/-1;}
.commerce-card-list{display:flex;flex-direction:column;gap:12px;}
.commerce-card{
  display:grid;grid-template-columns:112px minmax(0,1fr) auto;
  gap:13px;align-items:center;padding:12px;
  border:1px solid rgba(60,60,67,.12);border-radius:18px;background:#fff;
}
.commerce-card-thumb{
  width:112px;height:86px;border-radius:14px;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(145deg,#eef5ff,#e8ebf3);
  font-size:34px;font-weight:900;color:#2477ff;
}
.commerce-card-thumb img{width:100%;height:100%;object-fit:cover;}
.commerce-card-body{min-width:0;}
.commerce-card-body strong{display:block;font-size:15px;font-weight:950;color:#111;line-height:1.3;}
.commerce-card-body p{margin:5px 0;font-size:12px;line-height:1.45;color:#555;}
.commerce-card-body small{display:block;font-size:11px;line-height:1.4;color:#7b7b83;}
.commerce-card>a,
.commerce-card>button{
  min-width:76px;border:0;border-radius:13px;padding:11px 12px;
  background:#111;color:#fff;text-decoration:none;text-align:center;
  font-size:12px;font-weight:900;
}
.commerce-card-actions{
  display:flex;
  flex-direction:column;
  gap:7px;
  min-width:78px;
}
.commerce-card-actions a,
.commerce-card-actions button{
  border:0;border-radius:12px;padding:9px 10px;
  background:#111;color:#fff;text-decoration:none;text-align:center;
  font-size:11px;font-weight:900;font-family:inherit;cursor:pointer;
}
.commerce-card-actions>*+*{background:#edf3ff;color:#1769e0;}
.commerce-badge{
  display:inline-block;margin-bottom:5px;padding:4px 7px;border-radius:999px;
  background:#fff0f1;color:#ee3348;font-size:10px;font-weight:900;
}
.commerce-rating{margin:5px 0;color:#ef9b12;font-size:12px;font-weight:850;}
.commerce-schedule{margin-top:5px;font-size:11px;line-height:1.4;color:#64748b;}
.commerce-contact{margin-top:4px;font-size:11px;font-weight:750;color:#1769e0;}
.guide-panel-actions{display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:11px;border-radius:13px;background:#eef6ff;}
.guide-panel-actions button{border:0;border-radius:11px;padding:10px 12px;background:#1769e0;color:#fff;font:inherit;font-size:12px;font-weight:850;cursor:pointer;}
.guide-panel-actions span{font-size:11px;line-height:1.4;color:#4b6380;}
.guide-register-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;padding:13px;border:1px solid #dbe7f5;border-radius:15px;background:#fff;}
.guide-register-form.hide{display:none;}
.guide-register-head,.guide-register-wide{grid-column:1/-1;}
.guide-register-head{display:flex;align-items:center;justify-content:space-between;}
.guide-register-head strong{font-size:15px;}
.guide-register-head button{border:0;background:transparent;color:#64748b;font:inherit;font-size:12px;font-weight:800;cursor:pointer;}
.guide-register-form label{display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:800;color:#475569;}
.guide-register-form input,.guide-register-form textarea{box-sizing:border-box;width:100%;border:1px solid #d7e1ee;border-radius:11px;padding:10px;background:#fff;font:inherit;font-size:12px;}
.guide-register-form textarea{min-height:78px;resize:vertical;}
.guide-register-message{grid-column:1/-1;min-height:18px;font-size:11px;font-weight:750;color:#1769e0;}
.guide-card-tags{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0;}
.guide-card-tags span{padding:3px 6px;border-radius:999px;background:#edf4ff;color:#1769e0;font-size:10px;font-weight:800;}
.guide-card-intro{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3;font-size:11px;line-height:1.45;color:#64748b;}
@media(max-width:560px){.guide-panel-actions{align-items:flex-start;flex-direction:column}.guide-register-form{grid-template-columns:1fr}.guide-register-head,.guide-register-wide{grid-column:1}}
.commerce-search-note{margin:-2px 0 12px;padding:9px 11px;border-radius:11px;background:#fff8e7;color:#8a5a00;font-size:11px;line-height:1.45;}
.commerce-result-summary{
  display:flex;justify-content:space-between;gap:10px;align-items:center;
  padding:2px 2px 10px;
}
.commerce-result-summary strong{font-size:15px;font-weight:950;}
.commerce-result-summary span{font-size:12px;color:#666;text-align:right;}
.commerce-empty,.commerce-error{
  padding:28px 16px;border-radius:16px;background:#f6f7f9;
  color:#666;text-align:center;font-size:13px;line-height:1.5;
}
.commerce-error{background:#fff2f3;color:#cf2940;}
.hotCommerceHead{margin-bottom:13px;padding:2px 2px 8px;}
.hotCommerceHead strong,.hotCommerceHead span{display:block;}
.hotCommerceHead strong{font-size:18px;font-weight:950;}
.hotCommerceHead span{margin-top:4px;color:#666;font-size:12px;}
.hot-commerce-card{grid-template-columns:76px minmax(0,1fr) auto;}
.hot-commerce-card .commerce-card-thumb{width:76px;height:76px;}

@media (max-width:600px){
  .category-results-panel{
    top:var(--category-results-top, 126px);
    right:0;
    bottom:64px;
    left:0;
    border-radius:20px 20px 0 0;
  }
  .commerce-search-form{grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr);padding:12px;}
  .commerce-hotel-form{grid-template-columns:minmax(0,1fr);}
  .commerce-date-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .commerce-search-form .flight-passengers,
  .commerce-search-form .flight-cabin{grid-column:1/-1;}
  .commerce-card{grid-template-columns:86px minmax(0,1fr);align-items:start;}
  .commerce-card-thumb{width:86px;height:76px;}
  .commerce-card>a,.commerce-card>button{grid-column:1/-1;width:100%;box-sizing:border-box;}
  .commerce-card-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;width:100%;}
  .hot-commerce-card{grid-template-columns:64px minmax(0,1fr);}
  .hot-commerce-card .commerce-card-thumb{width:64px;height:64px;}
}

body.category-results-open #floatingBtns{
  display:none !important;
}
.bottom-demo-detail{
  margin-bottom:10px;
}
.bottom-demo-detail [data-bottom-demo-close]{
  border:none;
  border-radius:12px;
  padding:7px 9px;
  background:rgba(60,60,67,0.08);
  color:#444;
  font-size:12px;
  font-weight:800;
  flex:0 0 auto;
}
.plannerBox{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.plannerBox[data-ai-planner-ready="1"]{
  display:block;
  width:100%;
  min-width:0;
}
.plannerBox[data-ai-planner-ready="1"]>.aiPlannerForm,
.plannerBox[data-ai-planner-ready="1"]>.plannerResult{
  width:100%;
  min-width:0;
  box-sizing:border-box;
}
.ai-panel #sheetContent{
  padding-top:6px;
  scroll-padding-top:70px;
}
.ai-panel .plannerBox input,
.ai-panel .plannerBox select{
  scroll-margin-top:70px;
}
.plannerBox input,
.plannerBox select{
  min-width:0;
  border:1px solid rgba(60,60,67,0.16);
  border-radius:12px;
  padding:10px;
  background:#f8f9fb;
  font-size:14px;
}
.plannerBox button,
.sheetPrimaryBtn{
  border:none;
  border-radius:12px;
  padding:10px 12px;
  background:#007AFF;
  color:#fff;
  font-weight:800;
}
.plannerBox button{
  grid-column:1 / -1;
}
.plannerResult{
  margin-top:10px;
  padding:12px;
  border-radius:12px;
  background:#f5f7fa;
  color:#333;
  font-size:13px;
  line-height:1.5;
}
.aiPlanSummary strong{
  display:block;
  color:#111;
  font-size:15px;
  font-weight:900;
}
.aiPlanSummary span{
  display:block;
  margin-top:4px;
  color:#5f6368;
  font-size:12px;
  line-height:1.35;
}
.aiPlanSources{display:grid;gap:7px;margin-top:10px;padding:12px;border:1px solid #cfe1ff;border-radius:12px;background:#f5f9ff}
.aiPlanSources>b{font-size:13px}
.aiPlanSources>span,.aiPlanSources>em{color:#64748b;font-size:11px;font-style:normal}
.aiPlanSources>div{display:flex;flex-wrap:wrap;gap:6px}
.aiPlanSources a{display:inline-flex;padding:7px 9px;border-radius:9px;background:#fff;color:#1769e0;font-size:11px;font-weight:900;text-decoration:none}
.aiPlanGrid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}
.aiPlanGrid div{
  min-height:66px;
  padding:9px;
  border-radius:12px;
  background:#fff;
  border:1px solid rgba(60,60,67,0.10);
}
.aiPlanGrid b{
  display:block;
  color:#007AFF;
  font-size:12px;
  font-weight:900;
}
.aiPlanGrid span{
  display:block;
  margin-top:5px;
  color:#222;
  font-size:12px;
  line-height:1.32;
}
.aiPlanActions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin-top:10px;
}
.aiPlanActions button{
  min-height:36px;
  border:none;
  border-radius:12px;
  background:#007AFF;
  color:#fff;
  font-size:12px;
  font-weight:900;
}
.aiPlanActions button:nth-child(2){background:#09a7e8;}
.aiPlanActions button:nth-child(3){background:#2f855a;}
.travelHero{padding:12px;border-radius:14px;background:linear-gradient(135deg,#f8fbff,#eef9f3);border:1px solid rgba(60,60,67,.10)}
.travelHero strong,.travelHero span{display:block}.travelHero strong{color:#111;font-size:15px;font-weight:900}.travelHero span{margin-top:4px;color:#5f6368;font-size:12px;line-height:1.35}
.travelFeedStatus{margin-top:10px;padding:12px;border-radius:12px;background:#f7f8fa;color:#64748b;text-align:center;font-size:12px}.travelFeedStatus.hide{display:none}
.travelRankSection{margin-top:14px}.travelRankTitle{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 7px;color:#111}.travelRankTitle b{font-size:14px;font-weight:900}.travelRankTitle span{color:#7b8491;font-size:10.5px;font-weight:700}
.travelCourseList{display:flex;flex-direction:column;gap:8px;margin:0}
.travelCourseList button{width:100%;border:1px solid rgba(60,60,67,.12);border-radius:12px;background:#f8f9fb;padding:11px;text-align:left;color:#111}
.travelFeedTextRow{display:flex;align-items:center;gap:10px}
.travelRankBadge{display:grid!important;flex:0 0 28px;width:28px;height:28px;margin:0!important;border-radius:50%;place-items:center;background:#dfe5ed!important;color:#435064!important;font-size:12px!important;font-weight:950!important;line-height:1!important}.travelRankBadge.rank-1{background:#ffd95a!important;color:#6d4b00!important}.travelRankBadge.rank-2{background:#dce4ed!important;color:#465568!important}.travelRankBadge.rank-3{background:#e9b889!important;color:#6f3b12!important}
.travelRankThumb{flex:0 0 58px;width:58px;height:58px;border-radius:9px;object-fit:cover;background:#e5e7eb}
.travelRankCopy{display:block;min-width:0;flex:1}
.travelCourseList b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#111;font-size:13px;font-weight:900;line-height:1.25}
.travelCourseList span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:5px;color:#5f6368;font-size:12px;line-height:1.35}
.travelCourseList em{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:4px;color:#64748b;font-size:10.5px;font-style:normal}
.travelFeedEmpty{padding:14px 10px;border:1px dashed rgba(60,60,67,.12);border-radius:11px;text-align:center;color:#64748b;font-size:11px}
.chatPanelSwitch{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  padding:5px;
  border-radius:14px;
  background:rgba(60,60,67,0.08);
  margin-bottom:10px;
}
.chatPanelSwitch button{position:relative;}
#chatDirectPane{min-height:260px;}
#chatDirectPane .directThreadList{padding:0;}
.bottom-tab[data-panel="chat"]{position:relative;}
.bottom-tab[data-panel="chat"].direct-active{color:#007aff;}
.bottomChatUnreadBadge{position:absolute;top:7px;right:13px;display:flex;min-width:18px;height:18px;align-items:center;justify-content:center;border-radius:999px;background:#ff3b4e;color:#fff;font-size:9px;font-weight:900;}
.chatPanelSwitch button{
  border:0;
  border-radius:11px;
  min-height:38px;
  background:transparent;
  color:#5f6368;
  font-size:13px;
  font-weight:900;
}
.chatPanelSwitch button.active{
  background:#fff;
  color:#007AFF;
  box-shadow:0 4px 14px rgba(15,23,42,0.10);
}
.chatPane{
  display:none;
}
.chatPane.active{
  display:block;
}
.boardIntro{
  padding:13px;
  border-radius:14px;
  background:linear-gradient(135deg,#f8fbff,#f5fff9);
  border:1px solid rgba(60,60,67,0.10);
}
.boardIntro strong{
  display:block;
  color:#111;
  font-size:15px;
  font-weight:900;
}
.boardIntro span{
  display:block;
  margin-top:0;
  color:#5f6368;
  font-size:12px;
  line-height:1.35;
  font-weight:750;
  word-break:keep-all;
}
.boardCategoryTabs{
  display:flex;
  gap:6px;
  width:100%;
  padding:2px 0 4px;
  overflow-x:auto;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
.boardCategoryTabs::-webkit-scrollbar{
  display:none;
}
.boardCategoryTabs button{
  flex:0 0 auto;
  min-width:48px;
  min-height:34px;
  border:1px solid rgba(60,60,67,0.12);
  border-radius:8px;
  padding:0 11px;
  background:#fff;
  color:#5f6368;
  font-size:12px;
  font-weight:900;
}
.boardCategoryTabs button.active{
  border-color:#111;
  background:#111;
  color:#fff;
}
.boardMenuList{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
  margin-top:10px;
}
.boardMenuList button{
  width:100%;
  min-height:64px;
  border:1px solid rgba(60,60,67,0.12);
  border-radius:14px;
  background:#f8f9fb;
  padding:12px;
  text-align:left;
}
.boardMenuList span{
  display:block;
  color:#111;
  font-size:14px;
  font-weight:900;
}
.boardMenuList em{
  display:block;
  margin-top:5px;
  color:#007AFF;
  font-size:12px;
  font-style:normal;
  font-weight:800;
  line-height:1.35;
}
.boardFrame{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.channel-board-sheet{
  position:fixed;
  inset:0;
  z-index:10040;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  background:rgba(15,23,42,0.32);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.channel-board-sheet.hide{
  display:none;
}
.channel-board-box{
  width:min(560px,100%);
  height:min(86dvh,760px);
  max-height:calc(100dvh - 18px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  box-sizing:border-box;
  padding:8px 14px calc(16px + env(safe-area-inset-bottom));
  border:1px solid rgba(60,60,67,0.12);
  border-radius:22px 22px 0 0;
  background:#fff;
  box-shadow:0 18px 48px rgba(15,23,42,0.24);
}
.channel-board-root{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.channel-board-root .boardFrameHead{
  position:sticky;
  top:0;
  z-index:2;
  padding:4px 0 8px;
  background:#fff;
}
.boardFrameHead{
  display:grid;
  grid-template-columns:40px 1fr auto;
  align-items:center;
  gap:8px;
  min-height:42px;
}
.boardFrameHead button{
  border:0;
  border-radius:12px;
  min-height:36px;
  padding:0 12px;
  background:#f2f4f7;
  color:#111;
  font-size:13px;
  font-weight:900;
}
.boardFrameHead button:first-child{
  padding:0;
  font-size:24px;
}
.boardFrameHead strong{
  min-width:0;
  color:#111;
  font-size:16px;
  font-weight:950;
  text-align:center;
}
.boardFrameHead [data-board-write]{
  background:#007AFF;
  color:#fff;
}
.boardPostList,
.boardCommentList{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.boardPostItem{
  border:1px solid rgba(60,60,67,0.10);
  border-radius:14px;
  background:#f8f9fb;
  overflow:hidden;
}
.boardPostOpen{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  width:100%;
  border:0;
  background:transparent;
  padding:12px;
  text-align:left;
}
.boardPostCopy{
  min-width:0;
}
.boardPostCopy small,
.boardDetailCategory{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  border-radius:7px;
  padding:0 7px;
  margin-bottom:6px;
  background:rgba(0,122,255,0.10);
  color:#007aff;
  font-size:10px;
  font-weight:900;
}
.boardPostThumb{
  width:62px;
  height:62px;
  border-radius:8px;
  object-fit:cover;
  background:#edf0f4;
}
.boardPostOpen strong{
  display:block;
  color:#111;
  font-size:14px;
  font-weight:950;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.boardPostOpen span{
  display:block;
  margin-top:6px;
  color:#475467;
  font-size:12px;
  line-height:1.4;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.boardPostOpen em,
.boardDetail em,
.boardComment em{
  display:block;
  margin-top:7px;
  color:#8a8f98;
  font-size:11px;
  font-style:normal;
  font-weight:800;
}
.boardPostActions,
.boardDetailActions,
.boardComment > div:last-child{
  display:flex;
  justify-content:flex-end;
  gap:6px;
  padding:0 10px 10px;
}
.boardPostActions button,
.boardDetailActions button,
.boardComment > div:last-child button{
  border:0;
  border-radius:10px;
  min-height:30px;
  padding:0 10px;
  background:rgba(60,60,67,0.08);
  color:#5f6368;
  font-size:11px;
  font-weight:900;
}
.boardPostActions button:last-child,
.boardDetailActions button:last-child,
.boardComment > div:last-child button:last-child{
  color:#d70015;
  background:rgba(255,59,48,0.10);
}
.boardDetail{
  padding:13px;
  border-radius:14px;
  background:#f8f9fb;
  border:1px solid rgba(60,60,67,0.10);
}
.boardDetail strong{
  display:block;
  color:#111;
  font-size:16px;
  font-weight:950;
  line-height:1.3;
}
.boardDetail p{
  margin:12px 0;
  color:#202124;
  font-size:14px;
  line-height:1.55;
  font-weight:750;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.boardImageGallery{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
  margin:12px 0;
}
.boardImageGallery button,
.boardCommentImage button,
.boardLocalPreview{
  border:0;
  border-radius:8px;
  padding:0;
  overflow:hidden;
  background:#eef1f5;
}
.boardImageGallery img{
  display:block;
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
}
.boardImageGallery button:only-child img{
  aspect-ratio:auto;
  max-height:420px;
  object-fit:contain;
  background:#f4f5f7;
}
.boardCommentImage{
  width:72px;
  height:72px;
  margin-top:7px;
}
.boardCommentImage button,
.boardCommentImage img{
  display:block;
  width:72px;
  height:72px;
  object-fit:cover;
}
.boardDetailActions{
  padding:0;
}
.boardDetailActions button:first-child{
  background:#007AFF;
  color:#fff;
}
.boardComment{
  padding:11px;
  border-radius:13px;
  background:#fff;
  border:1px solid rgba(60,60,67,0.10);
}
.boardComment p{
  margin:0;
  color:#202124;
  font-size:13px;
  line-height:1.45;
  font-weight:750;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.boardComment > div:last-child{
  padding:8px 0 0;
}
.boardCompose,
.boardCommentCompose{
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
}
.boardCompose label{
  display:flex;
  flex-direction:column;
  gap:7px;
  color:#202124;
  font-size:13px;
  font-weight:900;
}
.boardCompose input,
.boardCompose select,
.boardCompose textarea,
.boardCommentCompose textarea{
  width:100%;
  border:1px solid rgba(60,60,67,0.16);
  border-radius:12px;
  padding:12px;
  background:#fff;
  color:#111;
  font:inherit;
  font-size:14px;
  line-height:1.5;
  letter-spacing:0;
  resize:vertical;
  box-sizing:border-box;
  outline:none;
}
.boardCompose input{
  min-height:46px;
}
.boardCompose select{
  min-height:46px;
}
.boardCompose input[type="file"]{
  min-height:44px;
  padding:8px;
}
.boardCompose textarea{
  min-height:240px;
}
.boardEditorLabel{
  display:block;
  margin-bottom:7px;
  color:#202124;
  font-size:13px;
  font-weight:900;
}
.boardBlockEditor{
  display:flex;
  flex-direction:column;
  gap:0;
  min-height:280px;
  padding:12px;
  border:1px solid rgba(60,60,67,0.13);
  border-radius:12px;
  background:#fff;
}
.boardEditorBlock{
  position:relative;
  border:0;
  border-radius:0;
  padding:0;
  background:#fff;
}
.boardEditorBlock textarea{
  min-height:72px;
  border:0;
  border-radius:6px;
  padding:8px;
  box-shadow:none !important;
}
.boardEditorBlock.image > img{
  display:block;
  width:100%;
  max-height:420px;
  border-radius:8px;
  object-fit:contain;
  background:#f3f5f7;
}
.boardEditorAddImage{
  width:100%;
  min-height:38px;
  margin-top:6px;
  border:1px dashed rgba(0,122,255,0.42);
  border-radius:8px;
  background:#f5f9ff;
  color:#007aff;
  font-size:12px;
  font-weight:900;
}
.boardEditorToolbar,
.room-home-editor-toolbar{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:8px;
}
.boardEditorToolbar button,
.room-home-editor-toolbar button{
  min-height:38px;
  padding:0 14px;
  border:1px solid rgba(0,122,255,0.25);
  border-radius:9px;
  background:#f5f9ff;
  color:#007aff;
  font-size:12px;
  font-weight:900;
}
.boardEditorControls{
  display:flex;
  justify-content:flex-end;
  gap:5px;
  margin-top:6px;
}
.boardEditorControls:empty{
  display:none;
}
.boardEditorControls button{
  min-width:34px;
  min-height:30px;
  border:0;
  border-radius:8px;
  background:#eef1f5;
  color:#40444c;
  font-size:12px;
  font-weight:900;
}
.boardEditorControls button.danger{
  color:#d70015;
  background:rgba(255,59,48,0.10);
}
.boardHiddenFile{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}
.boardContentBlocks{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin:12px 0;
}
.boardContentBlocks p{
  margin:0;
}
.boardInlineImage{
  width:100%;
}
.boardInlineImage button{
  display:block;
  width:100%;
  border:0;
  border-radius:8px;
  padding:0;
  overflow:hidden;
  background:#f3f5f7;
}
.boardInlineImage img{
  display:block;
  width:100%;
  max-height:520px;
  object-fit:contain;
}
.boardCommentCompose{
  padding:12px;
  border:1px solid rgba(60,60,67,0.10);
  border-radius:14px;
  background:#f8f9fb;
  box-sizing:border-box;
}
.boardCommentCompose textarea{
  min-height:96px;
}
.boardCommentFile{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:8px;
  color:#30343b;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}
.boardCommentFile input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.boardCommentFile span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  border-radius:10px;
  padding:0 11px;
  background:rgba(0,122,255,0.11);
  color:#007aff;
}
.boardCommentFile em{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#7a8089;
  font-size:11px;
  font-style:normal;
  font-weight:750;
}
.boardMediaHint{
  color:#747b86;
  font-size:11px;
  font-weight:750;
  line-height:1.4;
}
.boardComposePreview{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
}
.boardComposePreview:empty,
.boardCommentPreview:empty{
  display:none;
}
.boardComposePreview .boardImageGallery{
  display:contents;
}
.boardComposePreview .boardImageGallery button,
.boardLocalPreview{
  width:100%;
}
.boardComposePreview img,
.boardLocalPreview img{
  display:block;
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
}
.boardCommentPreview img{
  display:block;
  width:72px;
  height:72px;
  border-radius:8px;
  object-fit:cover;
}
.boardCompose input:focus,
.boardCompose select:focus,
.boardCompose textarea:focus,
.boardCommentCompose textarea:focus{
  border-color:#007aff;
  box-shadow:0 0 0 3px rgba(0,122,255,0.10);
}
.boardCompose > button,
.boardCommentCompose > button{
  width:100%;
  min-height:46px;
  border:0;
  border-radius:12px;
  padding:0 14px;
  background:#007aff;
  color:#fff;
  font-size:14px;
  font-weight:900;
}
.boardEmpty{
  padding:16px 12px;
  border-radius:14px;
  background:#f8f9fb;
  color:#6b7280;
  font-size:13px;
  font-weight:850;
  text-align:center;
}
.profileDemoTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px;
  border-radius:14px;
  background:linear-gradient(135deg,#f8fbff,#f4f7ff);
  border:1px solid rgba(60,60,67,0.10);
}
.profileDemoTop strong{
  display:block;
  color:#111;
  font-size:15px;
  font-weight:900;
}
.profileDemoTop span{
  display:block;
  margin-top:4px;
  color:#5f6368;
  font-size:12px;
  line-height:1.35;
}
.profileDemoTop button{
  flex:0 0 auto;
  border:none;
  border-radius:12px;
  padding:9px 11px;
  background:#007AFF;
  color:#fff;
  font-size:12px;
  font-weight:900;
}
.profileIdentityEntry{width:100%;appearance:none;-webkit-appearance:none;text-align:left;color:inherit}.profileIdentityEntry>b{color:#007aff;font-size:12px;white-space:nowrap}

/* v10 clean SNS profile page */
.profileDataControl{display:none!important}
.myTripDetailMedia{cursor:pointer}
#profileHeader{justify-content:space-between!important;gap:10px}#profileHeader>strong{flex:1;text-align:center;font-size:17px}#profilePageShare{border:0;background:transparent;color:#007aff;font-weight:900;padding:10px}
.snsProfileHero{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:center;padding:10px 4px 13px;cursor:pointer}.snsProfileAvatar{width:72px!important;height:72px!important;margin:0!important;border-radius:50%;background:#eef1f5 center/cover no-repeat;cursor:pointer}.snsProfileIdentity{min-width:0;padding-right:72px}.snsProfileIdentity #profileNick{margin:0!important;text-align:left!important;font-size:20px!important;font-weight:950}.snsProfileIdentity #profileLoginType{margin:2px 0 0!important;text-align:left!important;color:#7b8190!important;font-size:11px!important}.snsProfileIdentity p{margin:5px 0 0;color:#475569;font-size:12px;line-height:1.35}.profileEditHint{display:block;margin-top:5px;color:#94a3b8;font-size:10px}.profileHeaderSpacer{width:44px}#profilePageLogout{position:absolute;right:4px;bottom:13px;width:auto!important;margin:0!important;border:0;border-radius:9px;padding:6px 8px!important;color:#dc2626!important;background:transparent!important;font-size:11px!important;font-weight:900}.profileBottomAdminEntry{width:100%;margin-top:10px;border:1px solid #cfe1ff;border-radius:13px;background:#f3f7ff;padding:13px;text-align:left}.profileBottomAdminEntry strong,.profileBottomAdminEntry span{display:block}.profileBottomAdminEntry span{margin-top:3px;color:#64748b;font-size:11px}
.snsProfileSocialActions{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb;margin:0 -2px 14px}.snsProfileSocialActions button{border:0;background:transparent;padding:12px 3px;display:flex;flex-direction:column;align-items:center;gap:2px}.snsProfileSocialActions span{font-size:18px}.snsProfileSocialActions b{font-size:16px;color:#111}.snsProfileSocialActions em{font-style:normal;font-size:10px;color:#64748b;font-weight:800}
.snsProfileSocialActions.publicMode{grid-template-columns:repeat(3,1fr)}.snsProfileSocialActions button.active span,.snsProfileSocialActions button[aria-pressed="true"] span{color:#ef4444}.snsProfilePublicActions{grid-template-columns:1fr}.snsProfilePublicActions button{width:100%}
.snsProfilePublicActions{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:14px}.snsProfilePublicActions button{border:1px solid #dce3ee;background:#fff;border-radius:12px;padding:11px 6px;color:#1d4ed8;font-weight:900}.snsProfilePublicActions button:disabled{color:#94a3b8;background:#f8fafc}
.snsProfileTabs{position:sticky;top:-18px;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);background:rgba(248,248,250,.94);backdrop-filter:blur(12px);border-bottom:1px solid #e5e7eb;margin:16px -14px 0;padding:0 14px}.snsProfileTabs button{border:0;background:transparent;padding:14px 4px;color:#64748b;font-size:12px;font-weight:900}.snsProfileTabs button.active{color:#111;border-bottom:2px solid #111}.snsProfilePane{display:none;padding-top:14px}.snsProfilePane.show{display:block}.snsPaneHead{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.snsPaneHead strong{font-size:16px}.snsPaneHead button{border:0;border-radius:10px;padding:8px 10px;background:#eaf2ff;color:#0671e8;font-size:12px;font-weight:900}
.snsTripGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}.snsTripGrid>button{position:relative;aspect-ratio:1/1;border:0;background:#eef2f7;padding:0;overflow:hidden;text-align:left}.snsTripGrid img{width:100%;height:100%;object-fit:cover}.snsTripGrid>button>span{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#94a3b8;font-size:11px;font-weight:900}.snsTripGrid>button>b{position:absolute;left:5px;right:5px;bottom:19px;color:#fff;font-size:11px;text-shadow:0 1px 4px #000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.snsTripGrid>button>em{position:absolute;left:5px;bottom:5px;color:#fff;font-size:9px;font-style:normal;font-weight:900;text-shadow:0 1px 4px #000}.snsProfileEmpty{grid-column:1/-1;padding:28px 12px;text-align:center;color:#8a94a3;background:#f7f8fa;border-radius:12px;font-size:13px}
.snsTripVisibility{position:absolute;right:5px;top:5px;padding:4px 6px;border-radius:999px;background:rgba(17,24,39,.84);color:#fff;font-size:9px;font-style:normal;font-weight:900;box-shadow:0 2px 6px rgba(0,0,0,.18)}.snsTripVisibility.public{background:rgba(0,122,255,.9)}.snsTripVisibility.friends{background:rgba(16,185,129,.92)}.snsTripVisibility.private{background:rgba(75,85,99,.9)}
.snsFriendList{display:grid;gap:8px}.snsFriendRow{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;border:1px solid #e5e7eb;background:#fff;border-radius:13px;padding:8px}.snsFriendRow>[data-sns-friend]{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:10px;border:0;background:transparent;padding:0;text-align:left}.snsFriendRow>[data-sns-friend]>span{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:#eaf2ff;color:#1677e8;font-weight:950}.snsFriendRow strong{font-size:13px}.snsFriendRow em{font-style:normal;color:#007aff;font-size:11px;font-weight:900}.snsFriendRow>div{display:flex;gap:4px}.snsFriendRow>div button{border:0;border-radius:8px;padding:7px;background:#f1f5f9;color:#64748b;font-size:10px;font-weight:900}.snsFriendRow>div button:last-child{color:#dc2626;background:#fff1f2}
.snsMenuGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.snsMenuGrid button{min-height:54px;border:1px solid #e4e8ef;background:#fff;border-radius:12px;padding:10px;font-weight:900;color:#334155}.snsProfilePane .profileTrafficGroup{margin-top:16px;padding:14px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}.snsProfilePane .profileTrafficGroup>strong{font-size:14px}.snsProfilePane #profileTrafficRefresh{width:100%;margin-top:9px;border:0;border-radius:10px;padding:10px;background:#111;color:#fff;font-weight:900}
@media(max-width:520px){.snsTripGrid{grid-template-columns:repeat(3,minmax(0,1fr))}}

.myTripDetailCounts{display:flex!important;flex-wrap:wrap;gap:6px!important}.myTripDetailCounts button,.myTripDetailCounts span{border:0;background:#f1f5f9;border-radius:9px;padding:7px 9px;color:#475569;font-size:11px;font-weight:800}.myTripDetailCounts button.active{color:#e11d48;background:#fff1f2}.myTripDetailCounts button:disabled{opacity:.55}.myTripInteractionBlock{display:block!important}.myTripPublicActions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px!important;margin-top:9px}.myTripPublicActions button{min-width:0!important;padding:10px 5px!important;font-size:11px!important}.myTripPublicActions [data-mytrip-edit],.myTripPublicActions [data-mytrip-delete]{grid-column:auto}.myTripMediaViewer{display:none;position:fixed;inset:0;z-index:100006;background:rgba(0,0,0,.9);padding:20px;overflow:auto}.myTripMediaViewer.show{display:block}.myTripMediaViewer>div{position:relative;display:grid;gap:12px;max-width:760px;margin:auto}.myTripMediaViewer img,.myTripMediaViewer video{width:100%;max-height:82vh;object-fit:contain;background:#000}.myTripMediaViewer [data-gallery-close]{position:sticky;top:0;justify-self:end;z-index:2;border:0;border-radius:50%;width:38px;height:38px;background:#fff;color:#111;font-size:18px}.profileQuickEditor{display:none;position:fixed;inset:0;z-index:10040;background:rgba(15,23,42,.42);align-items:flex-end;justify-content:center}.profileQuickEditor.show{display:flex}.profileQuickEditor>div{width:min(520px,100%);padding:18px;background:#fff;border-radius:22px 22px 0 0}.profileQuickHead{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.profileQuickHead strong{font-size:18px}.profileQuickHead button{border:0;background:#f1f5f9;border-radius:50%;width:36px;height:36px}.profileQuickPhoto{display:block;width:88px;height:88px;margin:0 auto 16px;border:0;border-radius:50%;background:#eaf2ff center/cover no-repeat;color:#1677e8;font-weight:900}.profileQuickEditor label{display:grid;gap:7px;font-weight:900}.profileQuickEditor input{border:1px solid #dbe3ee;border-radius:12px;padding:12px;font-size:16px}.profileQuickActions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.profileQuickActions button{border:0;border-radius:12px;padding:12px;font-weight:900}.profileQuickActions button:last-child{background:#007aff;color:#fff}
.chat-entry-loading{display:flex;align-items:center;justify-content:center;min-height:96px;color:#64748b;font-size:13px;font-weight:800}.myTripDetailMedia img,.myTripDetailMedia video{cursor:zoom-in}
.profileDemoGrid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}
.profileDemoGrid div,
.profileDemoGrid button{
  padding:10px;
  border-radius:12px;
  background:#f8f9fb;
  border:1px solid rgba(60,60,67,0.10);
  text-align:left;
}
.profileDemoGrid button{
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
}
.profileDemoGrid button:active{
  background:#eef6ff;
}
.profileDemoGrid b{
  display:block;
  color:#5f6368;
  font-size:11px;
  font-weight:900;
}
.profileDemoGrid span{
  display:block;
  margin-top:4px;
  color:#111;
  font-size:16px;
  font-weight:900;
}
.profileDemoGroup{
  margin-top:12px;
}
.profileDemoGroupTitle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
  min-height:58px;
  border:1px solid rgba(60,60,67,0.10);
  border-radius:12px;
  background:#fff;
  padding:12px 14px;
  text-align:left;
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
}
.profileDemoGroupTitle:after{
  content:"";
  flex:0 0 auto;
  width:9px;
  height:9px;
  margin-left:2px;
  border-right:2px solid rgba(60,60,67,0.52);
  border-bottom:2px solid rgba(60,60,67,0.52);
  transform:rotate(45deg);
  transition:transform .18s ease;
}
.profileDemoGroupTitle[aria-expanded="true"]{
  background:#f8fbff;
  border-color:rgba(0,122,255,0.20);
}
.profileDemoGroupTitle[aria-expanded="true"]:after{
  transform:rotate(225deg);
}
.profileDemoGroupTitle strong{
  flex:0 0 auto;
  color:#111;
  font-size:14px;
  font-weight:950;
}
.profileDemoGroupTitle span{
  flex:1 1 auto;
  color:#6b7280;
  font-size:11px;
  font-weight:800;
  line-height:1.25;
  text-align:right;
  word-break:keep-all;
}
.profileTrafficGroup.hide{
  display:none;
}
.profileAccordionPanel{
  display:none;
  padding-top:8px;
}
.profileAccordionPanel.show{
  display:block;
}
.profileTrafficGrid{
  margin-top:0;
}
.profileMyTripList{
  margin-top:8px;
}
.profileDemoList{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:0;
}
.profileDemoList button{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  width:100%;
  min-height:78px;
  border:1px solid rgba(60,60,67,0.12);
  border-radius:12px;
  background:#f8f9fb;
  padding:11px 9px;
  text-align:center;
}
.profileDemoList span{
  color:#111;
  font-size:13px;
  font-weight:900;
  line-height:1.25;
}
.profileDemoList em{
  color:#007AFF;
  font-style:normal;
  font-size:11px;
  font-weight:800;
  line-height:1.25;
  word-break:keep-all;
}
.profileDemoList button[data-profile-action="admin"]{
  grid-column:1 / -1;
  margin-top:8px;
  border-style:dashed;
  border-color:rgba(60,60,67,0.22);
  background:rgba(60,60,67,0.04);
  padding:9px 11px;
}
.profileDemoList button[data-profile-action="admin"] span{
  color:rgba(60,60,67,0.74);
  font-size:12px;
}
.profileDemoList button[data-profile-action="admin"] em{
  color:rgba(60,60,67,0.52);
  font-size:11px;
}
#policyModal{
  position:fixed;
  inset:0;
  display:none;
  align-items:flex-end;
  justify-content:center;
  background:rgba(0,0,0,0.28);
  z-index:100003;
}
#policyModal.show{display:flex;}
.accountSettings{display:grid;gap:10px;padding-bottom:calc(8px + env(safe-area-inset-bottom))}
.accountSettings section{display:grid;gap:9px;padding:14px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}
.accountSettings section>strong{font-size:15px}
.accountSettings section>p,.accountSettings section>small{margin:0!important;color:#64748b!important;font-size:12px!important;line-height:1.45}
.accountSettings section>button{width:100%;border:0;border-radius:11px;padding:11px;background:#eef4ff;color:#1769e0;font-weight:900}
.accountSettings label{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #eef1f5;font-size:13px;font-weight:800}
.accountSettings label:last-of-type{border-bottom:0}
.accountSettings input[type="checkbox"]{width:22px;height:22px;accent-color:#1769e0}
.accountSettings .pushPermissionRow{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px;border-radius:12px;background:#f4f8ff}
.accountSettings .pushPermissionRow span{color:#475569;font-size:12px;line-height:1.4}
.accountSettings .pushPermissionRow button{border:0;border-radius:10px;padding:9px 11px;background:#1769e0;color:#fff;font-weight:900;white-space:nowrap}
.accountSettings .pushPermissionRow button:disabled{background:#cbd5e1;color:#64748b}
.accountSettings .accountDanger{border-color:#fee2e2;background:#fffafa}
.accountSettings .accountDanger button{background:#fee2e2;color:#dc2626}
.notificationCenter{display:grid;gap:14px;padding-bottom:calc(8px + env(safe-area-inset-bottom))}
.notificationGroup{display:grid;gap:8px}
.notificationGroup>strong{font-size:13px;color:#475569}
.notificationReadAll{justify-self:end;border:0;border-radius:10px;padding:8px 12px;background:#eef4ff;color:#1769e0;font-size:12px;font-weight:900}
.notificationToolbar{display:flex;justify-content:flex-end;gap:8px}.notificationDeleteAll{border:0;border-radius:10px;padding:8px 12px;background:#fff0f0;color:#d52b2b;font-size:12px;font-weight:900}
.notificationCard{display:grid;gap:5px;padding:13px;border:1px solid #e2e8f0;border-radius:14px;background:#fff;cursor:pointer}
.notificationCard:focus-visible{outline:3px solid rgba(23,105,224,.25);outline-offset:2px}
.notificationCard.is-unread{border-color:#fecaca;background:#fff7f7;box-shadow:inset 3px 0 #ef4444}
.notificationCard b{font-size:14px;color:#0f172a}
.notificationCard p{margin:0!important;color:#64748b!important;font-size:12px!important;line-height:1.5}
.notificationCardAction{margin-top:3px;color:#1769e0;font-size:12px;font-weight:900}
.notificationCardActions{display:flex;align-items:center;justify-content:space-between;gap:10px}.notificationDeleteOne{border:0;border-radius:9px;padding:6px 9px;background:#fff0f0;color:#d52b2b;font-size:11px;font-weight:900}
.notificationEmpty{margin:0!important;padding:24px 14px;border:1px dashed #cbd5e1;border-radius:14px;text-align:center;color:#64748b!important}

#directMessageModal{
  position:fixed;inset:0;z-index:26000;display:none;align-items:stretch;justify-content:stretch;
  padding:0;background:#f6f7fa;box-sizing:border-box;
}
#directMessageModal.show{display:flex;}
.directMessageBox{
  width:100%;height:100dvh;display:flex;flex-direction:column;overflow:hidden;border-radius:0;background:#f6f7fa;
  box-shadow:none;
}
.directMessageBox>header{
  flex:0 0 auto;display:grid;grid-template-columns:44px minmax(0,1fr) 44px;
  align-items:center;min-height:58px;padding:6px 10px;border-bottom:1px solid #e5e7eb;background:#fff;
}
.directMessageBox>header #directMessageTitle{width:auto;background:transparent;color:#111;text-align:center;font-size:17px;font-weight:950;}
.directMessageBox>header button{width:40px;height:40px;border:0;border-radius:12px;background:#f1f3f6;color:#1769e0;font:inherit;font-size:24px;font-weight:900;}
.directMessageBox>header #directMessageTitle{width:100%;height:40px;background:transparent;color:#111;font-size:17px;}
.directThreadList{flex:1;overflow:auto;padding:10px;}
.directThreadRow{width:100%;display:grid;grid-template-columns:minmax(0,1fr) 42px;align-items:center;border-bottom:1px solid #e7e9ed;background:#fff;}
.directThreadOpen{width:100%;display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:11px;align-items:center;padding:12px 10px;border:0;background:transparent;text-align:left;}
.directThreadMore{width:38px;height:38px;border:0;border-radius:11px;background:#f1f4f8;color:#475569;font-size:20px;font-weight:900;}
.directThreadRow:first-child{border-radius:15px 15px 0 0;}
.directThreadRow:last-child{border-bottom:0;border-radius:0 0 15px 15px;}
.directAvatar{
  width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:#dce9ff center/cover no-repeat;color:#1769e0;font-size:18px;font-weight:950;
}
.directAvatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit;}
.directThreadText{min-width:0;display:flex;flex-direction:column;gap:5px;}
.directThreadText strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;}
.directThreadText strong em{padding:3px 5px;border-radius:999px;background:#e8f1ff;color:#1769e0;font-size:9px;font-style:normal;}
.directThreadText small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#687386;font-size:12px;}
.directThreadMeta{display:flex;min-width:34px;flex-direction:column;align-items:flex-end;gap:6px;}
.directThreadMeta time{color:#94a3b8;font-size:10px;}
.directThreadMeta b{min-width:19px;height:19px;display:flex;align-items:center;justify-content:center;border-radius:999px;background:#ff3b4e;color:#fff;font-size:10px;}
.directConversation{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;}
.directMessageList{flex:1;overflow:auto;padding:16px 12px;display:flex;flex-direction:column;gap:9px;}
#directMessageForm{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:8px;padding:10px;background:#fff;border-top:1px solid #e5e7eb;}
#directMessageForm input{height:44px;border:1px solid #dbe1ea;border-radius:13px;padding:0 12px;background:#f8fafc;font:inherit;font-size:14px;}
#directMessageForm button{min-width:64px;border:0;border-radius:13px;background:#1769e0;color:#fff;font:inherit;font-size:13px;font-weight:900;}
#directMessageForm #directPlusButton{min-width:44px;background:#eef3f8;color:#1769e0;font-size:24px;}
.directPlusMenu{position:absolute;z-index:4;left:8px;right:8px;bottom:66px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:8px;border:1px solid #e5e7eb;border-radius:14px;background:#fff;box-shadow:0 10px 28px rgba(15,23,42,.16);}
.directPlusMenu button{min-height:42px;border:0;border-radius:10px;background:#f1f5f9;color:#334155;font:inherit;font-size:12px;font-weight:900;}
.directEmpty{margin:auto;padding:28px 14px;color:#788395;text-align:center;font-size:13px;}
.snsMenuGrid button.direct-active,.snsProfilePublicActions button.direct-active{background:#1769e0;color:#fff;border-color:#1769e0;}
.directMenuBadge{display:inline-flex;min-width:19px;height:19px;margin-left:4px;align-items:center;justify-content:center;border-radius:999px;background:#ff3b4e;color:#fff;font-size:10px;}
#directMessageToast{position:fixed;z-index:28000;top:74px;left:50%;max-width:calc(100% - 28px);transform:translate(-50%,-18px);opacity:0;pointer-events:none;border:0;border-radius:14px;padding:12px 16px;background:#111;color:#fff;font:inherit;font-size:12px;font-weight:850;box-shadow:0 12px 30px rgba(0,0,0,.25);transition:.2s;}
#directMessageToast.show{transform:translate(-50%,0);opacity:1;pointer-events:auto;}
#directThreadActionMenu{position:fixed;inset:0;z-index:29000;display:none;align-items:flex-end;justify-content:center;padding:14px;background:rgba(15,23,42,.42);}
#directThreadActionMenu.show{display:flex;}
#directThreadActionMenu>div{width:min(480px,100%);display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:20px;background:#fff;}
#directThreadActionMenu strong{padding:5px 4px 8px;font-size:15px;}
#directThreadActionMenu button{min-height:46px;border:0;border-radius:13px;background:#f1f4f8;color:#111;font:inherit;font-size:13px;font-weight:850;}
#directThreadActionMenu button.danger{background:#fff0f1;color:#d92d43;}

@media(max-width:600px){
  #directMessageModal{padding:0;}
  .directMessageBox{width:100%;height:100dvh;border-radius:0;}
}
.policyBox{
  width:100%;
  max-width:560px;
  height:min(70vh,560px);
  max-height:min(70vh,560px);
  overflow:auto;
  margin:0;
  padding:16px;
  border-radius:22px 22px 0 0;
  background:#fff;
  box-shadow:0 -12px 30px rgba(0,0,0,0.18);
}

#profileDetailModal{
  position:fixed;
  inset:0;
  display:none;
  align-items:flex-end;
  justify-content:center;
  background:rgba(0,0,0,0.28);
  z-index:100004;
}
#profileDetailModal.show{
  display:flex;
}
.profileDetailBox{
  width:100%;
  max-width:560px;
  height:min(70vh,560px);
  max-height:min(70vh,560px);
  display:flex;
  flex-direction:column;
  border-radius:22px 22px 0 0;
  background:#fff;
  box-shadow:0 -14px 34px rgba(15,23,42,0.18);
  overflow:hidden;
}
.profileDetailHead{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px 10px;
  border-bottom:1px solid rgba(60,60,67,0.10);
}
.profileDetailHead strong{
  min-width:0;
  color:#111;
  font-size:17px;
  font-weight:950;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#profileDetailClose{
  flex:0 0 auto;
  width:34px;
  height:34px;
  border:0;
  border-radius:12px;
  background:rgba(60,60,67,0.08);
  color:#333;
  font-size:15px;
  font-weight:900;
}
.profileDetailBody{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  padding:12px 14px calc(20px + env(safe-area-inset-bottom));
  -webkit-overflow-scrolling:touch;
}
.myTripComposeForm{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.myTripComposeForm label{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:#344054;
  font-size:12px;
  font-weight:900;
}
.myTripComposeForm input,
.myTripComposeForm textarea,
.myTripComposeForm select{
  width:100%;
  min-width:0;
  box-sizing:border-box;
  border:1px solid rgba(60,60,67,0.16);
  border-radius:12px;
  padding:10px;
  background:#f8f9fb;
  color:#111;
  font-size:14px;
}
.myTripComposeForm textarea{
  resize:vertical;
}
.myTripMediaPicker{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:10px;
  border:1px solid rgba(0,122,255,0.14);
  border-radius:14px;
  background:#f8fbff;
}
.myTripMediaPicker input[type="file"]{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.myTripMediaActions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
}
.myTripMediaPicker button{
  width:100%;
  min-height:42px;
  border:0;
  border-radius:12px;
  background:#007AFF;
  color:#fff;
  font-size:13px;
  font-weight:950;
}
#myTripMediaSummary{
  color:#111827;
  font-size:13px;
  font-weight:950;
}
.myTripMediaPreview{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
}
.myTripMediaThumb{
  position:relative;
  overflow:hidden;
  aspect-ratio:1/1;
  border-radius:12px;
  background:#eaf3ff;
  border:1px solid rgba(60,60,67,0.10);
}
.myTripMediaThumb img,
.myTripMediaThumb video{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.myTripMediaThumb span{
  position:absolute;
  right:5px;
  bottom:5px;
  min-width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(17,24,39,0.78);
  color:#fff;
  font-size:11px;
  font-weight:950;
}
.myTripMediaThumb.is-video::before{
  content:"VIDEO";
  position:absolute;
  left:5px;
  top:5px;
  z-index:1;
  padding:2px 5px;
  border-radius:999px;
  background:rgba(0,122,255,0.86);
  color:#fff;
  font-size:9px;
  font-weight:950;
}
.myTripMediaMore{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#007AFF;
  font-size:17px;
  font-weight:950;
}
.myTripUploadStatus{
  min-height:16px;
  color:#007AFF;
  font-size:12px;
  font-weight:900;
}
.myTripComposeHint{
  display:block;
  color:#667085;
  font-size:11px;
  line-height:1.35;
  font-weight:800;
  word-break:keep-all;
}
.myTripComposeGrid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.myTripFootprintBox{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:10px;
  border:1px solid rgba(0,122,255,0.14);
  border-radius:14px;
  background:#f8fbff;
}
.myTripFootprintHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.myTripFootprintHead strong{
  color:#111;
  font-size:13px;
  font-weight:950;
}
.myTripFootprintHead button,
.myTripStopTop button{
  flex:0 0 auto;
  border:0;
  border-radius:11px;
  min-height:32px;
  padding:0 10px;
  background:rgba(0,122,255,0.12);
  color:#007AFF;
  font-size:12px;
  font-weight:950;
}
.myTripStopList{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.myTripStopItem{
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:9px;
  border:1px solid rgba(60,60,67,0.10);
  border-radius:13px;
  background:#fff;
}
.myTripStopTop{
  display:grid;
  grid-template-columns:94px minmax(0,1fr);
  gap:7px;
}
.myTripStopTopWithRemove{
  grid-template-columns:86px minmax(0,1fr) auto;
}
@media (max-width: 420px){
  .myTripMediaPreview{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .myTripStopTop,
  .myTripStopTopWithRemove{
    grid-template-columns:1fr;
  }
}
#myTripSaveBtn{
  width:100%;
  min-height:44px;
  border:0;
  border-radius:13px;
  background:#007AFF;
  color:#fff;
  font-size:14px;
  font-weight:950;
}
#myTripSaveBtn:disabled{
  opacity:.62;
}
.profileDetailList{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.profileDetailCard{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:68px;
  padding:11px;
  border:1px solid rgba(60,60,67,0.11);
  border-radius:14px;
  background:#f8f9fb;
}
.profileDetailCardPlain{
  grid-template-columns:minmax(0,1fr);
}
.profileDetailCard strong{
  display:block;
  min-width:0;
  color:#111;
  font-size:14px;
  font-weight:950;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.profileDetailCard span{
  display:block;
  margin-top:5px;
  color:#667085;
  font-size:12px;
  font-weight:800;
  line-height:1.35;
  word-break:keep-all;
}
.profileDetailCard button{
  flex:0 0 auto;
  border:0;
  border-radius:12px;
  min-height:36px;
  padding:0 11px;
  background:rgba(0,122,255,0.12);
  color:#007AFF;
  font-size:12px;
  font-weight:950;
}
.profileDetailEmpty,
.profileDetailLoading{
  padding:20px 12px;
  border-radius:14px;
  background:#f8f9fb;
  color:#667085;
  font-size:13px;
  font-weight:850;
  text-align:center;
}
.reactionCardList{display:flex;flex-direction:column;gap:7px}
.reactionCard{display:grid;grid-template-columns:42px minmax(0,1fr) 30px;align-items:center;gap:9px;min-height:58px;padding:8px 9px;border:1px solid rgba(60,60,67,.1);border-radius:14px;background:#f8f9fb}
.reactionAvatar{width:42px;height:42px;padding:0;border:0;border-radius:50%;overflow:hidden;background:#dcecff;color:#0877e8;font-weight:950}
.reactionAvatar img{display:block;width:100%;height:100%;object-fit:cover}.reactionAvatar span{display:grid;width:100%;height:100%;place-items:center}
.reactionMain{min-width:0;padding:0;border:0!important;background:transparent!important;text-align:left}
.reactionMain strong,.reactionMain span,.reactionMain small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reactionMain strong{font-size:13px}.reactionMain span{margin-top:2px!important;color:#475569!important;font-size:11px!important}.reactionMain small{margin-top:3px;color:#0877e8;font-size:11px;font-weight:850}
.reactionIcon{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#fff;color:#ff4d5e;font-size:14px;box-shadow:0 1px 5px rgba(15,23,42,.08)}
.profileMyTripGuide{
  display:flex;
  flex-direction:column;
  gap:12px;
  align-items:stretch;
  padding:12px;
  margin-bottom:10px;
  border-radius:14px;
  background:#f8fbff;
  border:1px solid rgba(0,122,255,0.14);
  box-sizing:border-box;
}
.profileMyTripGuide strong{
  display:block;
  color:#111;
  font-size:15px;
  font-weight:950;
}
.profileMyTripGuide span{
  display:block;
  margin-top:5px;
  color:#5f6368;
  font-size:12px;
  line-height:1.38;
  font-weight:800;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.profileMyTripGuide button{
  width:100%;
  border:0;
  border-radius:12px;
  min-height:42px;
  padding:0 12px;
  background:#007AFF;
  color:#fff;
  font-size:12px;
  font-weight:950;
}
.profileMyTripPost{
  display:block;
  width:100%;
  padding:0;
  text-align:left;
  overflow:hidden;
  border:1px solid rgba(60,60,67,0.11);
  border-radius:14px;
  background:#fff;
}
.profileMyTripMedia{
  position:relative;
  width:100%;
  aspect-ratio:16/10;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#eef4ff center/cover no-repeat;
  color:#007AFF;
  font-size:13px;
  font-weight:950;
}
.profileMyTripMedia em{
  position:absolute;
  right:9px;
  bottom:9px;
  min-height:23px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:3px 8px;
  border-radius:999px;
  background:rgba(17,24,39,0.78);
  color:#fff;
  font-size:11px;
  font-style:normal;
  font-weight:950;
}
.profileMyTripMediaEmpty{
  background:linear-gradient(135deg,#eef4ff,#f7fbff);
}
.profileMyTripBody{
  padding:11px;
}
.profileMyTripBody strong{
  display:block;
  color:#111;
  font-size:14px;
  font-weight:950;
  line-height:1.3;
}
.profileMyTripBody span{
  display:block;
  margin-top:5px;
  color:#667085;
  font-size:12px;
  font-weight:850;
}
.profileMyTripBody p{
  margin:9px 0 0;
  color:#30343b;
  font-size:13px;
  line-height:1.45;
  font-weight:750;
  word-break:keep-all;
}
.profileMyTripStops{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:10px;
}
.profileMyTripStops span{
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:24px;
  padding:3px 8px 3px 3px;
  border-radius:999px;
  background:#f2f4f7;
  color:#475467;
  font-size:11px;
  font-weight:900;
}
.profileMyTripStops b{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  border-radius:999px;
  background:#111827;
  color:#fff;
}
.profileMyTripMeta{
  margin-top:9px;
  color:#667085;
  font-size:12px;
  font-weight:850;
}
.profileMyTripTags{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-top:10px;
}
.profileMyTripTags em{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:3px 7px;
  border-radius:999px;
  background:rgba(0,122,255,0.10);
  color:#0066cc;
  font-size:11px;
  font-style:normal;
  font-weight:900;
}
.myTripDetail{
  display:flex;
  flex-direction:column;
  gap:11px;
}
.myTripDetailHead strong{
  display:block;
  color:#111;
  font-size:17px;
  font-weight:950;
}
.myTripDetailHead span,
.myTripDetailCounts{
  display:block;
  margin-top:5px;
  color:#667085;
  font-size:12px;
  font-weight:850;
}
.myTripDetailMedia{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
}
.myTripDetailMedia img,
.myTripDetailMedia video{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:13px;
  background:#eef4ff;
}
.myTripDetailReview{
  margin:0;
  padding:11px;
  border-radius:13px;
  background:#f8f9fb;
  color:#30343b;
  font-size:13px;
  line-height:1.45;
  font-weight:750;
}
.myTripDetailActions{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:7px;
}
.myTripDetailActions button{
  min-height:38px;
  border:0;
  border-radius:12px;
  background:rgba(0,122,255,0.12);
  color:#007AFF;
  font-size:12px;
  font-weight:950;
}
.myTripDetailActions button[data-mytrip-delete]{
  background:rgba(255,59,48,0.12);
  color:#ff3b30;
}
.myTripDetailStops{
  display:flex;
  flex-direction:column;
  gap:7px;
}
.myTripDetailStop{
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  gap:8px;
  padding:10px;
  border-radius:13px;
  background:#f8f9fb;
}
.myTripDetailStop b{
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#111827;
  color:#fff;
  font-size:12px;
}
.myTripDetailStop strong{
  display:block;
  color:#111;
  font-size:13px;
  font-weight:950;
}
.myTripDetailStop span{
  display:block;
  margin-top:3px;
  color:#667085;
  font-size:11px;
  font-weight:850;
}
.myTripDetailStop p{
  margin:5px 0 0;
  color:#475467;
  font-size:12px;
  line-height:1.35;
  font-weight:750;
}
.policyHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.policyHead strong{
  color:#111;
  font-size:18px;
  font-weight:900;
}
.policyHead button{
  border:none;
  width:34px;
  height:34px;
  border-radius:12px;
  background:rgba(60,60,67,0.08);
  font-size:16px;
}
#policyBody p{
  margin:9px 0;
  color:#333;
  font-size:14px;
  line-height:1.45;
}
.featureList{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:12px;
}
.featureList div{
  min-height:34px;
  display:flex;
  align-items:center;
  padding:8px 10px;
  border-radius:10px;
  background:#f5f7fa;
  color:#222;
  font-size:13px;
  font-weight:700;
  line-height:1.25;
}

.official-room-pop{
  position:fixed;
  left:14px;
  right:14px;
  bottom:84px;
  z-index:108;
  pointer-events:auto;
  animation:officialPopIn .34s cubic-bezier(.18,1.28,.36,1) both;
}
.official-room-pop.hide{display:none;}
.official-pop-card{
  position:relative;
  display:flex;
  gap:10px;
  align-items:center;
  max-width:560px;
  margin:0 auto;
  padding:8px 9px;
  border-radius:18px;
  background:rgba(255,255,255,0.86);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 14px 34px rgba(0,0,0,0.18);
  border:1px solid rgba(0,122,255,0.18);
}
.official-pop-close{
  position:absolute;
  right:8px;
  top:8px;
  width:28px;
  height:28px;
  border:none;
  border-radius:999px;
  background:rgba(0,0,0,0.52);
  color:#fff;
  font-size:18px;
  line-height:1;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:2;
}
.official-pop-image-wrap{
  width:66px;
  aspect-ratio:1/1;
  border-radius:16px;
  overflow:hidden;
  background:#dff3ff;
  flex:0 0 auto;
}
.official-pop-image-wrap img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  background:#fff;
}
.official-pop-body{min-width:0;flex:1;}
.official-pop-badge{
  display:inline-flex;
  padding:2px 7px;
  border-radius:999px;
  background:rgba(0,166,255,0.13);
  color:#0077bb;
  font-size:10px;
  font-weight:900;
}
.official-pop-title{
  margin-top:4px;
  font-size:15px;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.official-pop-meta{
  margin-top:2px;
  font-size:12px;
  color:#666;
}
.official-pop-actions{
  display:flex;
  gap:6px;
  margin-top:6px;
}
.official-pop-actions button,
.official-accordion-actions button{
  border:none;
  border-radius:12px;
  padding:7px 9px;
  background:#007AFF;
  color:#fff;
  font-weight:800;
}
.official-pop-actions button:first-child,
.official-accordion-actions button:first-child{
  background:rgba(0,122,255,0.12);
  color:#007AFF;
}
.official-pop-strong .official-pop-card{
  animation:officialWiggle .72s ease both;
}
.official-accordion{
  padding:12px;
  border-radius:18px;
  background:rgba(255,255,255,0.78);
  border:1px solid rgba(60,60,67,0.10);
}
.official-accordion img{
  width:100%;
  aspect-ratio:1/1;
  max-height:420px;
  object-fit:contain;
  border-radius:16px;
  background:#fff;
}
.official-accordion-title{
  margin-top:12px;
  font-size:19px;
  font-weight:900;
}
.official-accordion-date{
  margin-top:4px;
  color:#666;
  font-size:13px;
}
.official-accordion p{
  margin:9px 0 0;
  color:#444;
  font-size:14px;
  line-height:1.45;
}
.official-accordion-actions{
  display:flex;
  gap:8px;
  margin-top:12px;
}
.official-map-overlay{
  position:absolute;
  z-index:7;
  transform:translate(-50%, calc(-100% - 48px));
  pointer-events:auto;
}
.official-map-overlay.hide{
  display:none;
}
.official-map-balloon{
  position:relative;
  width:158px;
  height:158px;
  max-width:46vw;
  max-height:46vw;
  display:grid;
  grid-template-rows:1fr auto;
  gap:6px;
  padding:8px;
  border-radius:17px;
  background:rgba(255,255,255,0.94);
  box-shadow:0 8px 18px rgba(0,0,0,0.11);
  border:1px solid rgba(0,122,255,0.08);
  color:#111;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  text-align:left;
  cursor:pointer;
  box-sizing:border-box;
  animation:officialMapPop .34s cubic-bezier(.18,1.26,.36,1) both;
}
.official-map-image{
  display:block;
  width:100%;
  height:100%;
  min-height:0;
  object-fit:contain;
  border-radius:16px;
  background:#fff;
  margin:0;
}
.official-map-copy{
  min-width:0;
}
.official-map-close{
  position:absolute;
  top:6px;
  right:6px;
  z-index:2;
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:999px;
  background:#007aff;
  color:#fff;
  font-size:19px;
  font-weight:900;
  line-height:1;
  box-shadow:0 5px 12px rgba(0,122,255,0.28);
  cursor:pointer;
  -webkit-tap-highlight-color:rgba(0,0,0,0);
}
.official-map-balloon strong{
  display:block;
  margin-top:0;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.15;
}
.official-map-burst{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:24px;
  padding:0 9px;
  border-radius:999px;
  background:#09a7e8;
  color:#fff;
  font-size:11px;
  font-weight:900;
  animation:officialMapPop .38s cubic-bezier(.18,1.36,.36,1) both;
}
@keyframes officialPopIn{
  from{opacity:0;transform:translateY(18px) scale(.94);}
  to{opacity:1;transform:translateY(0) scale(1);}
}
@keyframes officialWiggle{
  0%,100%{transform:translateY(0) rotate(0);}
  20%{transform:translateY(-5px) rotate(-1.2deg);}
  42%{transform:translateY(2px) rotate(1.2deg);}
  66%{transform:translateY(-2px) rotate(-.6deg);}
}
@keyframes officialMapPop{
  0%{transform:scale(.4);opacity:0;}
  70%{transform:scale(1.18);opacity:1;}
  100%{transform:scale(1);}
}

/* =============================
   GLASS REFRESH
   UI-only polish for iOS/Instagram-style surfaces.
   Keep chat bubble sizing and gallery layout unchanged.
   ============================= */
:root{
  --glass-bg:rgba(255,255,255,0.34);
  --glass-bg-strong:rgba(255,255,255,0.52);
  --glass-line:rgba(255,255,255,0.72);
  --glass-sep:rgba(60,60,67,0.11);
  --glass-shadow:0 18px 44px rgba(15,23,42,0.16);
  --glass-shadow-soft:0 10px 28px rgba(15,23,42,0.12);
  --glass-blur:blur(26px) saturate(1.65);
}

#topBar,
#searchBar,
#categoryBar,
#bottomNav,
#chatHeader,
#chatInputWrap,
#chatFilterPanel,
#communityCard,
#loginPopup,
#profileBox,
.room-create-box,
.room-type-box,
#officialChannelBox,
.room-info-box,
.sheet,
.profile-account-card,
.sheetSponsor,
.official-pop-card,
.official-accordion,
.official-map-balloon{
  background:var(--glass-bg);
  border:1px solid var(--glass-line);
  box-shadow:var(--glass-shadow-soft);
  backdrop-filter:var(--glass-blur);
  -webkit-backdrop-filter:var(--glass-blur);
  isolation:isolate;
}

#topBar{
  top:8px;
  left:50%;
  width:min(360px, calc(100% - 28px));
  height:54px;
  transform:translateX(-50%);
  border-radius:22px;
  border-bottom:1px solid var(--glass-line);
  box-shadow:var(--glass-shadow), inset 0 1px 0 rgba(255,255,255,0.72);
}
#topLogo{
  height:48px;
}

#searchBar{
  top:72px;
  width:min(520px, calc(100% - 28px));
  padding:7px;
  border-radius:20px;
  box-shadow:var(--glass-shadow), inset 0 1px 0 rgba(255,255,255,0.72);
}
#searchInput,
.room-create-input,
#chatInput,
#bannerScope,
#bannerRoomType,
#bannerCategory,
#bannerRegion,
#bannerTitle,
#bannerImageUrl,
#bannerLandingUrl,
#bannerKeywords,
#officialSearchInput,
#officialEditTitle,
#officialEditDescription,
#officialEditCategory,
#officialEditKind,
#officialEditRetention,
#officialEditCustomCategory,
#officialEditImageUrl{
  background:rgba(255,255,255,0.76);
  border:1px solid var(--glass-sep);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.66);
}
#searchBtn,
#sendBtn,
.room-create-btn-primary,
#officialChannelAutoBtn,
#categoryRegisterBtn,
.official-pop-actions button,
.official-accordion-actions button{
  background:linear-gradient(180deg,#0a84ff,#007aff);
  color:#fff;
  box-shadow:0 9px 20px rgba(0,122,255,0.22);
}

#categoryBar{
  top:122px;
  left:50%;
  width:min(720px, calc(100% - 28px));
  transform:translateX(-50%);
  border-radius:19px;
  border-bottom:1px solid var(--glass-line);
  box-shadow:var(--glass-shadow), inset 0 1px 0 rgba(255,255,255,0.72);
}
.catWrap{
  padding:7px;
}
.catWrap button,
.chat-filter-list button,
#bottomNav button,
#roomInfoClose,
#closeChat,
#roomInfoBtn,
#officialChannelCloseBtn,
.room-create-close,
.room-create-btn-cancel,
.room-create-mini-btn,
#sheetClose,
#clearBannerBtn{
  background:rgba(255,255,255,0.56);
  border:1px solid rgba(255,255,255,0.52);
  box-shadow:0 2px 8px rgba(15,23,42,0.05);
  backdrop-filter:blur(14px) saturate(1.35);
  -webkit-backdrop-filter:blur(14px) saturate(1.35);
}
.catWrap button:active,
#bottomNav button:active,
#floatingBtns button:active{
  transform:scale(0.98);
}

#map{
  top:156px;
  height:calc(100% - 221px);
  z-index:1;
}

#floatingBtns button{
  background:var(--glass-bg-strong);
  border:1px solid var(--glass-line);
  box-shadow:var(--glass-shadow-soft);
  backdrop-filter:var(--glass-blur);
  -webkit-backdrop-filter:var(--glass-blur);
}
#floatingBtns #profileManageQuickBtn{
  background:linear-gradient(180deg,#2786ff,#1769e0);
  border-color:rgba(255,255,255,0.42);
}

#communityCard{
  border-radius:24px;
  background:var(--glass-bg-strong);
}
#officialChannelBox,
#profileBox,
.room-create-box,
.room-type-box,
.room-info-box{
  background:rgba(250,250,252,0.82);
  border-color:var(--glass-line);
  box-shadow:0 -18px 42px rgba(15,23,42,0.16);
}

#chatHeader,
#chatInputWrap{
  background:rgba(250,250,252,0.76);
}
#chatInputWrap{
  padding-top:9px;
}
#chatPhotoBtn{
  background:rgba(255,255,255,0.62);
  border:1px solid var(--glass-line);
  box-shadow:0 3px 10px rgba(0,122,255,0.08);
}

#bottomNav{
  left:50%;
  bottom:8px;
  width:min(520px, calc(100% - 20px));
  transform:translateX(-50%);
  border-radius:24px;
  border-top:1px solid var(--glass-line);
  height:64px;
  padding-bottom:0;
  box-shadow:0 14px 38px rgba(15,23,42,0.16), inset 0 1px 0 rgba(255,255,255,0.72);
}

#loginPopup{
  background:rgba(250,250,252,0.86);
  border-radius:24px;
}
.kakao-btn,
.google-btn,
.admin-login-btn,
.profile-action-buttons button,
#copyProfileUidBtn,
#requestAdminRoleBtn,
#editProfileBtn,
#logoutBtn{
  border-radius:16px;
  box-shadow:0 4px 12px rgba(15,23,42,0.06);
}

.sheet{
  background:rgba(250,250,252,0.82);
  border:1px solid var(--glass-line);
}
.sheetHandle{
  background:rgba(60,60,67,0.28);
  box-shadow:none;
}

.room-create-box,
.room-type-box{
  border-radius:26px 26px 0 0;
}
@media (min-width: 720px){
  .room-create-box,
  .room-type-box{
    border-radius:26px;
  }
}

.room-label{
  padding:6px 10px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,0.58) !important;
  color:#111 !important;
  border:1px solid rgba(255,255,255,0.82) !important;
  box-shadow:0 10px 24px rgba(15,23,42,0.18), inset 0 1px 0 rgba(255,255,255,0.82) !important;
  backdrop-filter:blur(18px) saturate(1.65) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.65) !important;
  font-size:14px !important;
  font-weight:900 !important;
  letter-spacing:0 !important;
  text-shadow:none !important;
}
.room-label-open,
.room-label-private{
  background:rgba(255,255,255,0.6) !important;
}
.room-label-open{
  border:1.5px solid rgba(0,122,255,0.9) !important;
  box-shadow:0 10px 26px rgba(0,122,255,0.16), 0 10px 24px rgba(15,23,42,0.16), inset 0 1px 0 rgba(255,255,255,0.82) !important;
}
.room-label-private{
  border:1.5px solid rgba(52,64,84,0.9) !important;
  box-shadow:0 10px 26px rgba(52,64,84,0.15), 0 10px 24px rgba(15,23,42,0.16), inset 0 1px 0 rgba(255,255,255,0.82) !important;
}
.room-label-official{
  background:rgba(255,255,255,0.68) !important;
  border:1.5px solid rgba(255,59,48,0.94) !important;
  box-shadow:0 10px 26px rgba(255,59,48,0.18), 0 10px 24px rgba(15,23,42,0.16), inset 0 1px 0 rgba(255,255,255,0.82) !important;
}

.official-map-balloon,
.official-pop-card{
  background:rgba(255,255,255,0.78);
}

@media (max-width: 520px){
  #topBar{
    width:calc(100% - 20px);
  }
  #searchBar{
    width:calc(100% - 20px);
  }
  #categoryBar{
    width:calc(100% - 20px);
  }
}

/* =============================
   TOP UI RESTORE
   Keep bottom glass nav and map labels; restore the upper controls.
   ============================= */
#topBar{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:60px;
  transform:none;
  border:none;
  border-radius:0;
  border-bottom:1px solid #eee;
  background:#fff;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  display:flex;
  justify-content:center;
  align-items:center;
  z-index:100;
}
#topLogo{
  width:min(330px, 82vw);
  height:54px;
}

#searchBar{
  position:fixed;
  top:61px;
  left:50%;
  width:92%;
  transform:translateX(-50%);
  padding:4px 8px;
  display:flex;
  gap:7px;
  border:none;
  border-radius:12px;
  background:#fff;
  box-shadow:0 2px 6px rgba(0,0,0,.12);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  z-index:90;
}
#searchInput{
  flex:1;
  padding:6px 9px;
  font-size:15px;
  border:1px solid #ccc;
  border-radius:10px;
  background:#fff;
  box-shadow:none;
}
#searchBtn{
  padding:6px 11px;
  font-size:15px;
  background:#000;
  color:#fff;
  border:none;
  border-radius:10px;
  box-shadow:none;
}

#categoryBar{
  position:fixed;
  top:107px;
  left:0;
  width:100%;
  transform:none;
  overflow-x:auto;
  border:none;
  border-radius:0;
  border-bottom:1px solid #eee;
  background:#fff;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  z-index:80;
}
#categoryBar::-webkit-scrollbar{
  display:none;
}
.catWrap{
  display:flex;
  gap:10px;
  padding:8px 10px;
}
.catWrap button{
  padding:8px 14px;
  font-size:15px;
  background:#f5f5f5;
  color:#111;
  border:none;
  border-radius:22px;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  flex-shrink:0;
}

body:not(.admin-page)::before{
  content:"";
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:156px;
  background:#fff;
  z-index:70;
  pointer-events:none;
}

.beta-gate{
  position:fixed;
  inset:0;
  z-index:1000000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:linear-gradient(180deg,#f6f8fc,#fff);
}
.beta-gate.beta-gate-pending{
  display:none !important;
}
.beta-gate-box{
  width:min(360px, 100%);
  padding:24px;
  border-radius:22px;
  background:#fff;
  border:1px solid rgba(60,60,67,0.12);
  box-shadow:0 18px 46px rgba(15,23,42,0.14);
  display:flex;
  flex-direction:column;
  gap:12px;
  text-align:center;
}
.beta-gate-box img{
  width:min(260px, 80%);
  height:auto;
  margin:0 auto 4px;
}
.beta-gate-box strong{
  font-size:22px;
  font-weight:900;
}
.beta-gate-box p{
  margin:0;
  color:#586174;
  font-size:13px;
  line-height:1.55;
}
.beta-gate-label{
  align-self:center;
  padding:6px 10px;
  border-radius:999px;
  color:#075fca;
  background:#eaf3ff;
  font-size:12px;
  font-weight:900;
}
.beta-gate-box input{
  width:100%;
  box-sizing:border-box;
  padding:13px 14px;
  border:1px solid rgba(60,60,67,0.2);
  border-radius:14px;
  font-size:16px;
}
.beta-gate-box button{
  border:none;
  border-radius:14px;
  padding:13px 14px;
  background:#007aff;
  color:#fff;
  font-size:16px;
  font-weight:900;
}
.beta-gate-msg{
  min-height:18px;
  color:#c00;
  font-size:13px;
}
.beta-gate-links{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.beta-gate-links a{color:#697386;font-size:11px;text-decoration:none}.beta-gate-links a:hover{text-decoration:underline}

/* mapps.b3: password gate replaced by authenticated public beta entry. */
body.beta-locked{overflow:hidden}
body.beta-locked #loginOverlay{z-index:1000001}
body.beta-locked #loginPopup{z-index:1000002;bottom:max(24px,env(safe-area-inset-bottom));}
body.beta-locked #locationAgreementModal,
body.beta-locked #emailAuthModal{z-index:1000003}
.beta-status-badge{
  position:fixed;
  top:max(8px,env(safe-area-inset-top));
  right:10px;
  z-index:8500;
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:28px;
  border:1px solid #171717;
  border-radius:999px;
  padding:5px 9px;
  background:#fee500;
  color:#111;
  box-shadow:0 3px 12px rgba(15,23,42,.12);
  font-size:10px;
  font-weight:800;
}
.beta-status-badge b{color:#111;font-size:11px;letter-spacing:.05em}
.beta-status-badge.hide{display:none}
.beta-info-modal{position:fixed;inset:0;z-index:1000200;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(15,23,42,.48)}
.beta-info-modal.hide{display:none}
.beta-info-modal section{position:relative;width:min(390px,100%);box-sizing:border-box;border-radius:22px;padding:24px;background:#fff;box-shadow:0 20px 65px rgba(0,0,0,.28)}
.beta-info-modal section>b{display:inline-block;border-radius:999px;padding:5px 9px;background:#eaf3ff;color:#0877e8;font-size:11px}
.beta-info-modal strong{display:block;margin:12px 0 8px;font-size:20px}.beta-info-modal p{margin:0;color:#596274;font-size:13px;line-height:1.6}
.beta-info-modal small{display:block;margin:-3px 0 9px;color:#0877e8;font-weight:850}
.beta-info-modal section>button:last-child{width:100%;margin-top:16px;border:0;border-radius:13px;padding:13px;background:#0877e8;color:#fff;font-weight:900}
.mapps-tips-modal{position:fixed;inset:0;z-index:1000300;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(15,23,42,.58)}.mapps-tips-modal.hide{display:none}.mapps-tips-modal>section{width:min(620px,100%);max-height:min(820px,calc(100vh - 32px));box-sizing:border-box;overflow:auto;border-radius:22px;padding:20px;background:#fff;box-shadow:0 22px 70px rgba(0,0,0,.32)}.mapps-tips-modal header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.mapps-tips-modal header>div{display:flex;align-items:center;gap:8px}.mapps-tips-modal header b{border-radius:999px;padding:5px 8px;background:#fee500;color:#111;font-size:11px}.mapps-tips-modal header strong{font-size:20px}.mapps-tips-modal header>button{display:grid;place-items:center;width:34px;height:34px;border:0;border-radius:12px;background:#f1f3f5;color:#111;font-size:21px}.mapps-tips-lead{margin:10px 0 15px;color:#667085;font-size:13px;line-height:1.55}
.mapps-tip-poster{display:block;width:100%;height:auto;margin-bottom:14px;border:1px solid #dfe7f0;border-radius:18px;background:#f8fafc;box-shadow:0 8px 24px rgba(15,38,72,.1)}.mapps-tip-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mapps-tip-grid article{overflow:hidden;border:1px solid #e5e7eb;border-radius:14px;background:#fafbfc}.mapps-tip-grid article>strong{display:block;margin:11px 12px 4px;font-size:15px}.mapps-tip-grid article>p{margin:0 12px 13px;color:#5c6677;font-size:12px;line-height:1.5}.mapps-tip-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:15px}.mapps-tip-actions button{margin:0;border:0;border-radius:14px;padding:13px;font-weight:900}.mapps-tip-actions button:first-child{background:#111827;color:#fff}.mapps-tip-actions .mapps-tip-submit{background:#0877e8;color:#fff}
@media(max-width:520px){.mapps-tip-grid{grid-template-columns:1fr 1fr}.mapps-tips-modal>section{padding:15px}.mapps-tip-grid article>strong{margin:10px 10px 3px;font-size:13px}.mapps-tip-grid article>p{margin:0 10px 10px;font-size:11px}.mapps-tip-poster{border-radius:14px}.mapps-tip-actions{grid-template-columns:1fr}}
.beta-info-close{position:absolute;right:12px;top:12px;width:34px;height:34px;border:0;border-radius:50%;background:#f1f3f5;font-size:19px}
.chat-filter-note b{color:#0b67c2}

.onboarding-coach{position:fixed;inset:0;z-index:1000100;background:rgba(11,18,32,.68)}
.onboarding-coach.hide{display:none}
.onboarding-spotlight{position:fixed;z-index:1;box-sizing:border-box;border:3px solid #65b4ff;background:rgba(255,255,255,.08);box-shadow:0 0 0 4px rgba(101,180,255,.22),0 8px 28px rgba(0,0,0,.24);pointer-events:none;transition:left .22s ease,top .22s ease,width .22s ease,height .22s ease}
.onboarding-spotlight.motion-tap::after,.onboarding-spotlight.motion-pan::after{content:"☝︎";position:absolute;left:50%;top:50%;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#fff;color:#111;font-size:29px;box-shadow:0 7px 22px rgba(0,0,0,.3);transform:translate(-50%,-50%);transform-origin:50% 100%}
.onboarding-spotlight.motion-tap::after{animation:onboardingTap 1.35s ease-in-out infinite}.onboarding-spotlight.motion-pan::after{animation:onboardingPan 1.8s ease-in-out infinite}
@keyframes onboardingTap{0%,100%{transform:translate(-50%,-58%) scale(1)}45%{transform:translate(-50%,-44%) scale(.86)}65%{transform:translate(-50%,-44%) scale(.86);box-shadow:0 0 0 12px rgba(101,180,255,.22)}}
@keyframes onboardingPan{0%,100%{transform:translate(-95%,-50%)}50%{transform:translate(-5%,-50%)}}
@media(prefers-reduced-motion:reduce){.onboarding-spotlight.motion-tap::after,.onboarding-spotlight.motion-pan::after{animation:none}}
.onboarding-card{position:fixed;z-index:2;width:min(340px,calc(100vw - 28px));box-sizing:border-box;border-radius:18px;padding:17px;background:#fff;box-shadow:0 20px 60px rgba(0,0,0,.34)}
.onboarding-step{display:block;color:#0877e8;font-size:11px;font-weight:900}.onboarding-card strong{display:block;margin:6px 0;font-size:18px}.onboarding-card p{margin:0;color:#596274;font-size:13px;line-height:1.55}
.onboarding-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;margin-top:15px}.onboarding-actions button{border:0;border-radius:10px;padding:9px 12px;font-weight:850}.onboarding-actions button:first-child{margin-right:auto;background:transparent;color:#777}.onboarding-actions button:nth-child(2){background:#edf0f3;color:#475569}.onboarding-actions button:last-child{background:#0877e8;color:#fff}.onboarding-actions button:disabled{opacity:.35}
@media(max-width:520px){.beta-status-badge span{display:none}.beta-status-badge{right:7px;padding:5px 8px}.onboarding-card{padding:15px}}
.installGuide{padding:2px 0 14px}
.installGuideState{margin-bottom:14px;padding:15px;border:1px solid #cfe2ff;border-radius:16px;background:#eef6ff}
.installGuideState.installed{border-color:#b8e5c8;background:#edfbf2}
.installGuideState b,.installGuideState span{display:block}
.installGuideState b{color:#102a4c;font-size:15px}
.installGuideState span{margin-top:5px;color:#5e6b7d;font-size:12px;line-height:1.55}
.installGuide ol{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.installGuide li{display:flex;gap:11px;padding:13px;border:1px solid #e4e8ee;border-radius:14px;background:#fff}
.installGuide li>b{display:grid;flex:0 0 30px;height:30px;place-items:center;border-radius:50%;background:#087cff;color:#fff}
.installGuide li div{min-width:0}.installGuide li strong,.installGuide li span{display:block}
.installGuide li strong{color:#202b3c;font-size:14px}.installGuide li span{margin-top:4px;color:#687386;font-size:12px;line-height:1.55}
.installGuideActions{display:grid;gap:8px;margin-top:14px}
.installGuideActions button{min-height:46px;border:0;border-radius:13px;background:#087cff;color:#fff;font-weight:850}

/* =============================
   BUBBLE / GUIDE / LOCATION UPDATE
   ============================= */
.usage-guide{
  position:fixed;
  inset:0;
  z-index:999999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(12,18,28,0.34);
  backdrop-filter:blur(16px) saturate(1.35);
  -webkit-backdrop-filter:blur(16px) saturate(1.35);
}
.usage-guide.hide{
  display:none;
}
.usage-guide-box{
  width:min(420px, 100%);
  padding:18px;
  border-radius:22px;
  background:rgba(255,255,255,0.9);
  border:1px solid rgba(255,255,255,0.78);
  box-shadow:0 22px 60px rgba(15,23,42,0.22);
}
.usage-guide-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.usage-guide-head strong{
  font-size:20px;
  font-weight:900;
}
.usage-guide-head button{
  width:36px;
  height:36px;
  border:none;
  border-radius:50%;
  background:rgba(60,60,67,0.1);
  font-size:22px;
  line-height:1;
}
.usage-guide-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.usage-guide-list div{
  padding:12px;
  border-radius:14px;
  background:rgba(247,248,250,0.86);
  border:1px solid rgba(60,60,67,0.08);
}
.usage-guide-list b{
  display:block;
  margin-bottom:4px;
  font-size:14px;
}
.usage-guide-list span{
  display:block;
  color:#475467;
  font-size:13px;
  line-height:1.42;
}
.usage-guide-check{
  display:flex;
  align-items:center;
  gap:8px;
  margin:14px 0 12px;
  color:#475467;
  font-size:13px;
}
#usageGuideClose{
  width:100%;
  padding:13px 16px;
  border:none;
  border-radius:15px;
  background:#0a84ff;
  color:#fff;
  font-size:16px;
  font-weight:900;
}

#profilePanel{
  z-index:300 !important;
}
.admin-page{
  background:#f7f8fb;
}
.admin-page::before{
  display:none !important;
}

.room-label{
  position:relative !important;
  display:inline-flex !important;
  align-items:center !important;
  max-width:148px !important;
  min-height:26px !important;
  padding:5px 10px !important;
  border-radius:7px !important;
  color:#111 !important;
  font-size:14px !important;
  font-weight:900 !important;
  letter-spacing:0 !important;
  line-height:1.15 !important;
  text-shadow:none !important;
  white-space:nowrap !important;
  overflow:visible !important;
  box-shadow:0 5px 12px rgba(15,23,42,0.15) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.room-label::after{
  content:"";
  position:absolute;
  left:12px;
  bottom:-7px;
  width:12px;
  height:10px;
  background:inherit;
  border-left:inherit;
  border-bottom:inherit;
  transform:skew(-26deg);
  transform-origin:top left;
  clip-path:polygon(0 0,100% 0,0 100%);
}
.room-label-open{
  background:#fff2a8 !important;
  border:1px solid #e1b200 !important;
  color:#2f2600 !important;
}
.room-label-private{
  background:#eef1f5 !important;
  border:1px solid #667085 !important;
  color:#101828 !important;
}
.room-label-official{
  background:#ffe3e1 !important;
  border:1px solid #ff3b30 !important;
  color:#3b0b08 !important;
}

.official-room-pop{
  bottom:138px !important;
  z-index:112 !important;
  animation:officialPopBoing .38s cubic-bezier(.2,1.35,.34,1) both !important;
}
.official-pop-card{
  position:relative;
  border-radius:18px;
  border:1px solid rgba(255,59,48,0.22);
  box-shadow:0 18px 42px rgba(15,23,42,0.2);
}
.official-pop-card::after{
  content:"";
  position:absolute;
  left:34px;
  bottom:-10px;
  width:18px;
  height:18px;
  background:rgba(255,255,255,0.86);
  border-left:1px solid rgba(255,59,48,0.18);
  border-bottom:1px solid rgba(255,59,48,0.18);
  transform:rotate(-18deg) skew(-14deg);
  clip-path:polygon(0 0,100% 0,0 100%);
}
@keyframes officialPopBoing{
  0%{transform:translateY(20px) scale(.72);opacity:0;}
  68%{transform:translateY(-3px) scale(1.04);opacity:1;}
  100%{transform:translateY(0) scale(1);opacity:1;}
}

.room-notice-pinned{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.room-notice-copy{
  min-width:0;
  cursor:pointer;
}
.room-notice-copy span{
  overflow-wrap:anywhere;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  line-height:1.32;
  white-space:pre-line;
}
.room-notice-pinned.is-expanded{
  align-items:flex-start;
}
.room-notice-pinned.is-expanded .room-notice-copy span{
  display:block;
  -webkit-line-clamp:unset;
  overflow:visible;
}

.chat-bubble{
  position:relative;
  border-radius:19px 19px 19px 8px;
  box-shadow:0 6px 18px rgba(15,23,42,0.07);
}
.chat-message-row.theirs .chat-bubble{
  background:rgba(255,255,255,0.98);
  border:1px solid rgba(16,24,40,0.08);
  border-radius:18px;
}
.chat-message-row.mine .chat-bubble{
  background:linear-gradient(180deg,#1f8dff 0%,#0a78f0 100%);
  color:#fff;
  border:1px solid rgba(255,255,255,0.22);
  border-radius:18px;
}
.chat-message-row.mine .chat-bubble:not(.image-bubble)::after,
.chat-message-row.theirs .chat-bubble:not(.image-bubble)::after{
  content:none;
  display:none;
}
.chat-message-row.mine .chat-bubble.image-bubble,
.chat-message-row.theirs .chat-bubble.image-bubble{
  background:transparent;
}

#chatMessageActionMenu{
  display:none;
  position:fixed;
  inset:0;
  z-index:100120;
  align-items:flex-end;
  justify-content:center;
  padding:16px 12px max(16px, env(safe-area-inset-bottom));
  background:rgba(15,23,42,.34);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}
#chatMessageActionMenu.show{display:flex;}
.chat-message-action-sheet{
  width:min(430px,100%);
  padding:14px;
  border-radius:20px;
  background:#fff;
  box-shadow:0 18px 48px rgba(15,23,42,.24);
}
.chat-message-action-sheet>strong{display:block;padding:2px 4px 10px;font-size:14px;color:#64748b;}
.chat-message-action-sheet [data-chat-message-actions]{display:grid;gap:8px;}
.chat-message-action-sheet button{width:100%;border:0;border-radius:13px;padding:13px;background:#f2f5f9;color:#111827;font-size:16px;font-weight:900;}
.chat-message-action-sheet button.danger{background:#fff0f0;color:#dc2626;}
.chat-message-action-sheet>[data-chat-message-cancel]{margin-top:9px;background:#fff;border:1px solid #dce2ea;}
.chat-gallery-cell,
.chat-gallery-cell img,
.chat-image{
  -webkit-touch-callout:none !important;
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-user-drag:none !important;
}

/* =============================
   FILTER / MAP THEME POLISH
   ============================= */
.gm-fullscreen-control,
.gm-svpc,
.gm-style-mtc,
.gm-bundled-control,
.gm-bundled-control-on-bottom,
.gm-compass,
button[title="Toggle fullscreen view"],
button[title="Street View"],
button[aria-label="Street View"],
button[aria-label="Keyboard shortcuts"],
button[aria-label="Map camera controls"]{
  display:none !important;
}

#mapThemeToggle{
  position:fixed;
  top:178px;
  left:12px;
  z-index:96;
  width:48px;
  height:48px;
  border:1px solid rgba(255,255,255,0.72);
  border-radius:18px;
  background:rgba(255,255,255,0.72);
  box-shadow:0 10px 26px rgba(15,23,42,0.16), inset 0 1px 0 rgba(255,255,255,0.85);
  backdrop-filter:blur(18px) saturate(1.5);
  -webkit-backdrop-filter:blur(18px) saturate(1.5);
  display:flex;
  align-items:center;
  justify-content:center;
}
.theme-orb{
  position:relative;
  width:27px;
  height:27px;
  display:block;
  transition:transform .28s ease, filter .28s ease;
}
.theme-sun{
  border-radius:50%;
  background:radial-gradient(circle at 35% 32%, #fff8c9 0 20%, #ffd86b 38%, #ff9f2f 72%, #ff7a1a 100%);
  box-shadow:0 0 16px rgba(255,190,76,0.68), 0 0 32px rgba(255,138,61,0.34);
}
.theme-sun::before{
  content:"";
  position:absolute;
  inset:-7px;
  border-radius:50%;
  background:conic-gradient(from 0deg, rgba(255,199,88,0), rgba(255,199,88,.65), rgba(255,199,88,0) 16%, transparent 17% 25%, rgba(255,199,88,.58) 26%, transparent 34%, transparent);
  filter:blur(.2px);
  z-index:-1;
}
.theme-moon{
  border-radius:50%;
  background:radial-gradient(circle at 35% 35%, #f7f0ff 0 18%, #a88dff 42%, #51417f 72%, #201c3b 100%);
  box-shadow:0 0 16px rgba(158,132,255,0.58), 0 0 34px rgba(67,48,126,0.42);
}
.theme-moon::before{
  content:"";
  position:absolute;
  width:21px;
  height:21px;
  top:1px;
  left:8px;
  border-radius:50%;
  background:rgba(255,255,255,0.9);
  box-shadow:-2px 2px 9px rgba(255,255,255,0.35);
}
.theme-moon::after{
  content:"";
  position:absolute;
  right:-3px;
  top:3px;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#fff9d8;
  box-shadow:-13px 18px 0 -1px #fff, -4px 24px 0 -1px rgba(255,255,255,.8);
}
.map-night-mode #mapThemeToggle{
  background:rgba(34,30,56,0.78);
  border-color:rgba(205,195,255,0.34);
}

#chatFilterPanel{
  width:min(330px, calc(100vw - 92px)) !important;
  right:76px !important;
  padding:14px !important;
  border-radius:20px !important;
  background:rgba(255,255,255,0.88) !important;
}
.chat-filter-title{
  font-size:15px !important;
  font-weight:900 !important;
  margin-bottom:10px !important;
}
.chat-filter-section{
  display:none;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:7px;
}
.chat-filter-section.active{
  display:grid;
}
.chat-filter-section button{
  border:1px solid rgba(60,60,67,0.12);
  border-radius:13px;
  padding:9px 8px;
  background:#fff;
  color:#1d2939;
  font-size:13px;
  font-weight:800;
}
.chat-filter-section button.active{
  background:#eaf3ff;
  border-color:#0a84ff;
  color:#0068d9;
}
.chat-filter-note{
  margin-top:9px !important;
  color:#667085 !important;
  font-size:12px !important;
}

.room-label{
  min-height:25px !important;
  padding:5px 10px !important;
  border-radius:8px !important;
  background:rgba(255,255,255,0.96) !important;
  color:#111827 !important;
  border:1px solid rgba(10,132,255,0.9) !important;
  box-shadow:0 5px 12px rgba(15,23,42,0.14) !important;
}
.room-label::after{
  content:"";
  position:absolute;
  left:14px;
  bottom:-5px;
  width:9px;
  height:9px;
  background:rgba(255,255,255,0.96);
  border-left:inherit;
  border-bottom:inherit;
  transform:rotate(-18deg) skew(-8deg);
  clip-path:polygon(0 0,100% 0,0 100%);
}
.room-label-open{
  border-color:#0a84ff !important;
}
.room-label-private{
  border-color:#7c3aed !important;
}
.room-label-official{
  border-color:#ff3b30 !important;
}
.map-night-mode .room-label{
  background:rgba(255,255,255,0.94) !important;
  box-shadow:0 7px 18px rgba(0,0,0,0.28) !important;
}
.map-night-mode .room-label::after{
  background:rgba(255,255,255,0.94);
}

#bottomNav{
  left:8px !important;
  right:8px !important;
  bottom:8px !important;
  width:auto !important;
  height:58px !important;
  background:rgba(255,255,255,0.82) !important;
  border:1px solid rgba(255,255,255,0.72) !important;
  border-radius:22px !important;
  box-shadow:0 10px 26px rgba(15,23,42,0.13) !important;
}

#roomLocationModal{
  position:fixed;
  inset:0;
  z-index:9998;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:0;
  background:rgba(15,23,42,0.28);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
#roomLocationModal.hide{
  display:none;
}
.room-location-box{
  box-sizing:border-box;
  width:min(430px, 100%);
  height:min(86vh, 720px);
  max-height:calc(100dvh - 22px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  padding:8px 16px calc(14px + env(safe-area-inset-bottom));
  border-radius:24px 24px 0 0;
  background:#fff;
  border:1px solid rgba(60,60,67,0.12);
  box-shadow:0 18px 48px rgba(15,23,42,0.22);
}
.room-home-handle{
  width:42px;
  height:5px;
  border-radius:999px;
  background:rgba(60,60,67,0.22);
  margin:0 auto 10px;
  flex:0 0 auto;
}
.room-location-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex:0 0 auto;
  padding-bottom:8px;
  border-bottom:1px solid rgba(60,60,67,0.10);
}
.room-location-head strong{
  font-size:18px;
  font-weight:900;
}
.room-home-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:0 0 14px;
}
.room-home-image{
  touch-action:pan-y;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
  -webkit-user-drag:none;
  display:block;
  width:100%;
  aspect-ratio:2/1;
  object-fit:cover;
  margin-top:12px;
  border-radius:16px;
  background:#f2f4f7;
  cursor:pointer;
}
.room-notice-copy{display:grid;grid-template-columns:minmax(0,1fr);gap:3px;align-items:start;}
.room-notice-copy strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.room-notice-copy span{-webkit-line-clamp:1;}
.room-notice-schedule{display:none;margin-top:6px;color:#007aff;font-size:12px;font-style:normal;font-weight:800;}
.room-notice-image{display:none;width:100%;max-width:600px;max-height:600px;margin-top:8px;border-radius:10px;object-fit:contain;background:#f2f4f7;}
.room-notice-pinned.is-expanded .room-notice-copy span{display:block;-webkit-line-clamp:unset;overflow:visible;}
.room-notice-pinned.is-expanded .room-notice-schedule.has-content{display:block;}
.room-notice-pinned.is-expanded .room-notice-image.has-content{display:block;}
.room-notice-actions{flex:0 0 auto;}
.room-location-btn{border:1px solid rgba(0,122,255,.25);border-radius:999px;padding:6px 10px;background:#fff;color:#0068d9;font-size:12px;font-weight:900;}
.room-notice-editor-box label{display:block;margin-top:10px;color:#667085;font-size:12px;font-weight:800;}
.room-notice-editor-box input,.room-notice-editor-box textarea{box-sizing:border-box;width:100%;margin-top:5px;}
.room-notice-editor-calendar{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.room-home-banner-controls{
  display:block;
  margin-top:8px;
}
.room-home-banner-controls.is-empty{
  display:block;
  margin-top:12px;
}
.room-home-banner-controls button{
  border:0;
  border-radius:999px;
  min-height:28px;
  padding:0 10px;
  background:rgba(0,122,255,0.12);
  color:#007aff;
  font-size:11px;
  font-weight:950;
}
.room-home-banner-manage-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:7px;
}
.room-home-banner-manage-head span{
  color:#667085;
  font-size:11px;
  font-weight:850;
}
.room-home-banner-manage-list{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.room-home-banner-manage-item{
  display:grid;
  grid-template-columns:58px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  border:1px solid rgba(60,60,67,0.10);
  border-radius:8px;
  padding:6px;
  background:#f8f9fb;
}
.room-home-banner-manage-item > img{
  display:block;
  width:58px;
  height:34px;
  border-radius:6px;
  object-fit:cover;
}
.room-home-banner-manage-item > div:nth-child(2){
  min-width:0;
}
.room-home-banner-manage-item strong,
.room-home-banner-manage-item span{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.room-home-banner-manage-item strong{
  color:#202124;
  font-size:11px;
  font-weight:900;
}
.room-home-banner-manage-item span{
  margin-top:3px;
  color:#7a8089;
  font-size:9px;
}
.room-home-banner-manage-item > div:last-child{
  display:flex;
  gap:4px;
}
.room-home-banner-editor-modal{
  position:fixed;
  inset:0;
  z-index:10070;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:16px;
  background:rgba(15,23,42,0.42);
  box-sizing:border-box;
}
.room-home-banner-editor{
  width:min(480px,100%);
  max-height:min(680px,calc(100vh - 32px));
  overflow-y:auto;
  border-radius:12px;
  padding:16px;
  background:#fff;
  box-shadow:0 18px 54px rgba(15,23,42,0.24);
  box-sizing:border-box;
}
.room-home-banner-editor-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:12px;
}
.room-home-banner-editor-head strong{
  font-size:17px;
  font-weight:950;
}
.room-home-banner-editor-head button{
  width:34px;
  height:34px;
  border:0;
  border-radius:50%;
  background:#f1f3f5;
  font-size:20px;
}
.room-home-banner-editor label{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:10px;
  color:#30343b;
  font-size:12px;
  font-weight:900;
}
.room-home-banner-editor input{
  width:100%;
  min-height:44px;
  border:1px solid rgba(60,60,67,0.16);
  border-radius:8px;
  padding:10px;
  font:inherit;
  box-sizing:border-box;
}
.room-home-banner-editor-hint{
  margin-top:8px;
  color:#6b7280;
  font-size:11px;
  font-weight:750;
}
.room-home-banner-editor-preview{
  display:block;
  width:100%;
  aspect-ratio:2/1;
  margin-top:10px;
  border-radius:8px;
  background:#eef1f5;
  object-fit:cover;
}
.room-home-banner-editor > button[type="submit"]{
  width:100%;
  min-height:46px;
  margin-top:12px;
  border:0;
  border-radius:8px;
  background:#007aff;
  color:#fff;
  font-size:14px;
  font-weight:900;
}
.room-home-banner-controls button.danger{
  background:rgba(255,59,48,0.12);
  color:#ff3b30;
}
.room-home-banner-size{
  align-self:center;
  margin-right:auto;
  color:#667085;
  font-size:11px;
  font-weight:850;
  white-space:nowrap;
}
.room-home-banner-controls .room-home-banner-empty{
  width:100%;
  min-height:112px;
  border:1.5px dashed rgba(0,122,255,0.28);
  border-radius:16px;
  background:#f7fbff;
  color:#007aff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:14px;
  text-align:center;
}
.room-home-banner-controls .room-home-banner-empty strong,
.room-home-banner-controls .room-home-banner-empty span{
  display:block;
}
.room-home-banner-controls .room-home-banner-empty strong{
  font-size:14px;
  font-weight:950;
}
.room-home-banner-controls .room-home-banner-empty span{
  color:#667085;
  font-size:11px;
  font-weight:800;
  line-height:1.35;
}
.room-home-avatar{
  width:86px;
  height:86px;
  margin:14px auto 8px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#eaf3ff;
  background-position:center;
  background-size:cover;
  color:#007aff;
  font-size:34px;
  font-weight:950;
  box-shadow:0 10px 26px rgba(15,23,42,0.14);
}
.room-home-type{
  width:fit-content;
  margin:12px auto 0;
  padding:5px 9px;
  border-radius:999px;
  background:#eaf3ff;
  color:#0068d9;
  font-size:12px;
  font-weight:900;
}
#roomLocationModal.channel-home .room-home-type{
  background:rgba(255,149,0,0.14);
  color:#c76a00;
}

/* 채널홈은 채팅창과 같은 프레임으로 표시한다. */
#roomLocationModal.channel-home{
  inset:60px 0 0;
  width:100%;
  height:auto;
  min-height:0;
  max-height:none;
  padding:0;
  box-sizing:border-box;
  align-items:stretch;
  justify-content:stretch;
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
#roomLocationModal.channel-home .room-location-box{
  width:100%;
  max-width:none;
  height:100%;
  max-height:100%;
  min-height:0;
  padding:8px 16px calc(14px + env(safe-area-inset-bottom));
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:22px 22px 0 0;
  border-top:1px solid var(--ios-sep, rgba(60,60,67,0.18));
  box-shadow:0 -10px 30px rgba(0,0,0,0.12);
}
#roomLocationModal.channel-home .room-location-head{
  flex:0 0 auto;
  background:#fff;
}
#roomLocationModal.channel-home .room-home-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
#roomLocationModal.channel-home .room-location-actions{
  flex:0 0 auto;
  padding-bottom:max(14px, env(safe-area-inset-bottom));
  background:#fff;
}
#roomLocationModal.channel-home .room-home-handle{display:none;}
#roomLocationModal.channel-home .room-home-notice{
  background:#fff7ed;
  color:#5f3b16;
}
#roomLocationModal.general-home .room-home-notice{
  background:#eef6ff;
  color:#123b66;
}
.room-location-head button{
  width:34px;
  height:34px;
  border:0;
  border-radius:50%;
  background:#f2f4f7;
  font-size:20px;
}
.room-location-room{
  margin-top:9px;
  padding:10px 12px;
  border:1px solid rgba(60,60,67,0.12);
  border-radius:10px;
  background:#fff;
  color:#101828;
  font-size:18px;
  font-weight:900;
  line-height:1.25;
  text-align:center;
  box-shadow:0 4px 12px rgba(15,23,42,0.05);
}
#roomLocationModal.channel-home .room-location-room{
  border-color:rgba(199,106,0,0.18);
  background:#fffaf2;
}
#roomLocationModal.general-home .room-location-room{
  border-color:rgba(0,122,255,0.16);
  background:#f8fbff;
}
.room-home-summary{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:6px;
  margin-top:9px;
}
.room-home-summary span{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:5px 9px;
  border-radius:999px;
  background:#f2f4f7;
  color:#475467;
  font-size:11px;
  font-weight:900;
  line-height:1;
}
#roomLocationModal.channel-home .room-home-summary span{
  background:#fff3e0;
  color:#9a5a00;
}
.room-home-summary.hide{
  display:none;
}
.room-home-notice{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin-top:10px;
  padding:12px;
  border-radius:14px;
  background:#fff8e5;
  color:#47351b;
  line-height:1.45;
  font-size:14px;
  font-weight:750;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.room-home-notice-icon{
  position:relative;
  flex:0 0 auto;
  width:22px;
  height:22px;
  margin-top:1px;
  border-radius:50%;
  background:rgba(255,59,48,0.12);
}
.room-home-notice-icon::before{
  content:"";
  position:absolute;
  left:5px;
  top:7px;
  width:7px;
  height:8px;
  background:#ff3b30;
  clip-path:polygon(0 27%, 38% 27%, 100% 0, 100% 100%, 38% 73%, 0 73%);
}
.room-home-notice-icon::after{
  content:"";
  position:absolute;
  left:12px;
  top:6px;
  width:6px;
  height:9px;
  border:2px solid #ff3b30;
  border-left:0;
  border-radius:0 999px 999px 0;
}
.room-home-notice-text{
  min-width:0;
  flex:1 1 auto;
  white-space:pre-line;
}
.room-home-notice.is-collapsed{
  max-height:46px;
  overflow:hidden;
}
.room-home-notice-toggle{
  display:block;
  width:100%;
  margin-top:6px;
  border:0;
  border-radius:12px;
  padding:8px 10px;
  background:#fff3e0;
  color:#c76a00;
  font-size:12px;
  font-weight:950;
}
.room-home-notice-toggle.hide{
  display:none;
}
.room-home-quick-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}
.room-home-quick-actions button{
  min-height:42px;
  border:1px solid rgba(0,122,255,0.18);
  border-radius:13px;
  background:#f4f9ff;
  color:#007aff;
  font-size:13px;
  font-weight:900;
}
.room-home-quick-actions button:disabled{
  opacity:.45;
}
.room-home-host-card{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:12px;
  padding:12px;
  border:1px solid rgba(60,60,67,0.10);
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 22px rgba(15,23,42,0.06);
}
#roomLocationModal.channel-home .room-home-host-card{
  background:#fffaf2;
}
.room-home-host-avatar{
  flex:0 0 auto;
  width:54px;
  height:54px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#eaf3ff;
  background-position:center;
  background-size:cover;
  color:#007aff;
  font-size:22px;
  font-weight:950;
}
#roomLocationModal.channel-home .room-home-host-avatar{
  border-radius:16px;
  background:#fff0d8;
  color:#c76a00;
}
.room-home-host-copy{
  min-width:0;
  flex:1 1 auto;
}
.room-home-host-copy b,
.room-home-host-copy strong,
.room-home-host-copy span{
  display:block;
}
.room-home-host-copy b{
  color:#667085;
  font-size:11px;
  font-weight:950;
}
.room-home-host-copy strong{
  margin-top:3px;
  color:#101828;
  font-size:15px;
  font-weight:950;
  line-height:1.25;
}
.room-home-host-copy span{
  margin-top:4px;
  color:#667085;
  font-size:12px;
  font-weight:750;
  line-height:1.35;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.room-home-feature-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
  padding:0;
  border-radius:0;
  background:transparent;
  border:0;
}
.room-home-feature-card{
  display:flex;
  flex-direction:column;
  justify-content:center;
  width:100%;
  min-height:76px;
  padding:11px 10px;
  text-align:center;
  border-radius:12px;
  background:#f8f9fb;
  border:1px solid rgba(60,60,67,0.10);
  appearance:none;
  -webkit-appearance:none;
}
.room-home-feature-grid.channel-feature-grid .room-home-feature-card:nth-child(1),
.room-home-feature-grid.channel-feature-grid .room-home-feature-card:nth-child(2){
  grid-column:1 / -1;
  min-height:68px;
  text-align:left;
  align-items:flex-start;
}
.room-home-feature-card + .room-home-feature-card{
  border-top:1px solid rgba(60,60,67,0.10);
  border-radius:12px;
}
.room-home-feature-card:active{
  transform:translateY(1px);
}
#roomLocationModal.general-home .room-home-feature-card{
  background:#f8fbff;
}
#roomLocationModal.channel-home .room-home-feature-card{
  background:#fffaf2;
}
.room-home-feature-grid.general-course-grid{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.room-home-feature-grid.general-course-grid .room-home-feature-card{
  min-height:78px;
  text-align:left;
  align-items:flex-start;
}
.room-home-feature-card.photo-widget{
  min-height:116px;
  justify-content:flex-end;
  overflow:hidden;
  position:relative;
}
.room-home-feature-card.calendar-widget,
.room-home-feature-card.photo-widget-direct{
  min-height:178px;
  padding:8px;
  justify-content:flex-start;
  overflow:hidden;
}
.room-home-calendar-preview{
  display:block !important;
  width:100%;
  min-height:142px;
  box-sizing:border-box;
  margin:0 !important;
  padding:10px;
  border-radius:10px;
  background:#1f3150;
  color:#eaf3ff !important;
  overflow:visible !important;
  -webkit-line-clamp:unset !important;
}
.room-home-calendar-preview > strong{
  display:block;
  color:#fff;
  font-size:12px;
  font-weight:950;
  text-align:left;
}
.room-home-calendar-preview-weekdays,
.room-home-calendar-preview-grid{
  display:grid !important;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:2px;
  width:100%;
  margin:6px 0 0 !important;
  overflow:visible !important;
  -webkit-line-clamp:unset !important;
}
.room-home-calendar-preview-weekdays b{
  color:rgba(234,243,255,0.6);
  font-size:8px;
  font-weight:900;
  text-align:center;
}
.room-home-calendar-preview-grid i{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  height:16px;
  border-radius:999px;
  color:rgba(234,243,255,0.82);
  font-size:8px;
  font-style:normal;
  font-weight:900;
}
.room-home-calendar-preview-grid i.today{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,0.45);
}
.room-home-calendar-preview-grid i.has-event{
  background:#ff453a;
  color:#fff;
}
.room-home-feature-card .room-home-widget-label{
  display:block;
  width:100%;
  margin:7px 0 0;
  color:#101828;
  font-size:12px;
  font-weight:950;
  line-height:1.2;
  text-align:center;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  -webkit-line-clamp:unset;
}
.room-home-feature-card.photo-widget-direct .room-home-feature-photo{
  width:100%;
  height:142px;
  margin:0;
  border-radius:10px;
  background-position:center;
  background-size:cover;
}
.room-home-feature-card .room-home-photo-empty{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:142px;
  margin:0;
  border-radius:10px;
  background:#f2f4f7;
  color:#667085;
  font-size:11px;
  font-weight:850;
  line-height:1.35;
  text-align:center;
  -webkit-line-clamp:unset;
}
.room-home-feature-photo{
  display:block;
  width:100%;
  height:70px;
  margin:-3px 0 8px;
  border-radius:10px;
  background-size:cover;
  background-position:center;
  border:1px solid rgba(60,60,67,0.10);
}
.room-home-course-card{
  margin-top:0;
  padding:12px 13px;
  border:1px solid rgba(0,122,255,0.12);
  border-radius:14px;
  background:#f8fbff;
}
.room-home-course-actions{
  display:flex;
  justify-content:flex-end;
  gap:6px;
  margin-top:10px;
  padding-top:8px;
  border-top:1px solid rgba(60,60,67,0.08);
}
.room-home-course-actions button{
  border:0;
  border-radius:999px;
  min-height:28px;
  padding:0 9px;
  background:rgba(0,122,255,0.12);
  color:#007aff;
  font-size:11px;
  font-weight:950;
}
.room-home-course-actions button:disabled{
  opacity:.45;
}
.room-home-course-body{
  display:flex;
  flex-direction:column;
  gap:0;
  margin-top:7px;
}
.room-home-course-body div{
  padding:8px 0;
  border-radius:0;
  background:transparent;
  border:0;
}
.room-home-course-body div + div{
  border-top:1px solid rgba(60,60,67,0.1);
}
.room-home-course-body b,
.room-home-course-body span{
  display:block;
}
.room-home-course-body b{
  color:#007aff;
  font-size:12px;
  font-weight:950;
}
.room-home-course-body span{
  margin-top:5px;
  color:#344054;
  font-size:12px;
  font-weight:800;
  line-height:1.38;
  white-space:pre-line;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.room-home-feature-card strong,
.room-home-feature-card span,
.room-home-feature-card em{
  display:block;
}
.room-home-feature-card strong{
  color:#101828;
  font-size:13px;
  font-weight:950;
}
.room-home-feature-card span{
  margin-top:5px;
  color:#475467;
  font-size:11px;
  font-weight:750;
  line-height:1.3;
  word-break:keep-all;
  overflow-wrap:anywhere;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.room-home-feature-card em{
  margin-top:7px;
  color:#007aff;
  font-size:11px;
  font-style:normal;
  font-weight:950;
}
#roomLocationModal.channel-home .room-home-feature-card em{
  color:#c76a00;
}
.room-home-detail-sheet{
  position:fixed;
  inset:0;
  z-index:10020;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  background:rgba(15,23,42,0.30);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.room-home-detail-sheet.hide{
  display:none;
}
.room-home-detail-box{
  width:100%;
  max-width:560px;
  height:min(82vh,680px);
  max-height:min(82vh,680px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:22px 22px 0 0;
  background:#fff;
  border:1px solid rgba(60,60,67,0.12);
  box-shadow:0 18px 48px rgba(15,23,42,0.24);
}
.room-home-detail-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid rgba(60,60,67,0.10);
}
.room-home-detail-head strong{
  color:#101828;
  font-size:17px;
  font-weight:950;
}
.room-home-detail-head button{
  border:0;
  border-radius:999px;
  padding:8px 11px;
  background:#f2f4f7;
  color:#475467;
  font-size:12px;
  font-weight:900;
}
.room-home-detail-body{
  min-height:160px;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:12px 16px calc(18px + env(safe-area-inset-bottom));
}
.room-home-detail-loading,
.room-home-detail-empty{
  padding:20px 12px;
  border-radius:15px;
  background:#f8f9fb;
  color:#667085;
  font-size:13px;
  font-weight:850;
  line-height:1.45;
  text-align:center;
  word-break:keep-all;
}
.room-home-detail-line{
  padding:12px;
  border-radius:15px;
  background:#f8f9fb;
  border:1px solid rgba(60,60,67,0.10);
}
.room-home-detail-line + .room-home-detail-line{
  margin-top:8px;
}
.room-home-detail-line strong,
.room-home-detail-line em,
.room-home-detail-line span{
  display:block;
}
.room-home-detail-line strong{
  color:#101828;
  font-size:14px;
  font-weight:950;
}
.room-home-detail-line em{
  margin-top:4px;
  color:#007aff;
  font-size:11px;
  font-style:normal;
  font-weight:900;
}
.room-home-detail-line span{
  margin-top:6px;
  color:#475467;
  font-size:12px;
  font-weight:750;
  line-height:1.4;
  white-space:pre-line;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.room-home-detail-action{
  width:100%;
  margin-top:10px;
  border:0;
  border-radius:14px;
  padding:12px 10px;
  background:#007aff;
  color:#fff;
  font-size:14px;
  font-weight:900;
}
.room-home-detail-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:10px;
}
.room-home-detail-actions button{
  border:0;
  border-radius:999px;
  min-height:34px;
  padding:0 12px;
  background:#007aff;
  color:#fff;
  font-size:13px;
  font-weight:950;
}
.room-home-detail-actions button.danger{
  background:rgba(255,59,48,0.12);
  color:#d70015;
}
.room-home-compose-form{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.room-home-editor-label{
  color:#202124;
  font-size:14px;
  font-weight:950;
}
.room-home-block-editor,
.room-home-content-blocks{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.room-home-block-editor{
  gap:0;
  min-height:280px;
  padding:12px;
  border:1px solid rgba(60,60,67,0.13);
  border-radius:12px;
  background:#fff;
}
.room-home-editor-block{
  position:relative;
  border:0;
  border-radius:0;
  padding:0;
  background:#fff;
}
.room-home-editor-block textarea{
  min-height:72px;
  border:0 !important;
  border-radius:6px !important;
  padding:8px !important;
  box-shadow:none !important;
}
.room-home-editor-block.image > img{
  display:block;
  width:100%;
  max-height:420px;
  border-radius:8px;
  object-fit:contain;
  background:#f3f5f7;
}
.room-home-editor-add-image{
  width:100%;
  min-height:38px;
  margin-top:6px;
  border:1px dashed rgba(0,122,255,0.42);
  border-radius:8px;
  background:#f5f9ff;
  color:#007aff;
  font-size:12px;
  font-weight:900;
}
.room-home-editor-controls{
  display:flex;
  justify-content:flex-end;
  gap:5px;
  margin-top:6px;
}
.room-home-editor-controls:empty{
  display:none;
}
.room-home-editor-controls button{
  min-width:34px;
  min-height:30px;
  border:0;
  border-radius:8px;
  background:#eef1f5;
  color:#40444c;
  font-size:12px;
  font-weight:900;
}
.room-home-editor-controls button.danger{
  color:#d70015;
  background:rgba(255,59,48,0.10);
}
.room-home-content-blocks{
  width:100%;
}
.room-home-content-blocks p{
  margin:0;
  color:#344054;
  font-size:14px;
  font-weight:750;
  line-height:1.6;
  white-space:pre-line;
  overflow-wrap:anywhere;
}
.room-home-inline-image{
  display:block;
  width:100%;
  border:0;
  border-radius:8px;
  padding:0;
  overflow:hidden;
  background:#f3f5f7;
}
.room-home-inline-image img{
  display:block;
  width:100%;
  max-height:520px;
  object-fit:contain;
}
.room-home-compose-form label{
  display:flex;
  flex-direction:column;
  gap:7px;
  color:#344054;
  font-size:13px;
  font-weight:950;
}
.room-home-compose-form textarea,
.room-home-compose-form input[type="text"],
.room-home-compose-form input[type="datetime-local"]{
  width:100%;
  box-sizing:border-box;
  border:1px solid rgba(60,60,67,0.16);
  border-radius:14px;
  padding:12px;
  background:#fff;
  color:#101828;
  font-size:15px;
  font-weight:750;
}
.room-home-compose-form textarea{
  min-height:180px;
  line-height:1.45;
  resize:vertical;
}
.chat-poll-options{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.chat-poll-options-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:#344054;
  font-size:13px;
  font-weight:950;
}
.chat-poll-options-head span,
.chat-poll-optional{
  color:#98a2b3;
  font-size:12px;
  font-weight:800;
}
[data-poll-options-list]{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.chat-poll-option-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
}
.room-home-compose-form .chat-poll-option-row input[type="text"]{
  min-width:0;
}
.chat-poll-option-row button,
.chat-poll-add-option{
  border:1px solid rgba(60,60,67,0.13);
  border-radius:12px;
  min-height:42px;
  padding:0 13px;
  background:#f8f9fb;
  color:#475467;
  font-size:13px;
  font-weight:900;
}
.chat-poll-option-row button{
  color:#d92d20;
  background:#fff5f4;
}
.chat-poll-add-option{
  width:100%;
  color:#007aff;
  border-style:dashed;
  background:#f5f9ff;
}
.room-home-compose-form input[type="file"]{
  width:100%;
  box-sizing:border-box;
  padding:12px;
  border-radius:14px;
  background:#f8f9fb;
  border:1px dashed rgba(0,122,255,0.28);
  color:#475467;
  font-size:13px;
  font-weight:850;
}
.room-home-compose-form button[type="submit"]{
  border:0;
  border-radius:15px;
  min-height:46px;
  background:#007aff;
  color:#fff;
  font-size:15px;
  font-weight:950;
}
.room-home-compose-hint{
  color:#667085;
  font-size:12px;
  font-weight:800;
  line-height:1.35;
}
.room-home-compose-preview,
.room-home-detail-images{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin-top:10px;
}
.room-home-compose-preview img,
.room-home-detail-images img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:12px;
  border:1px solid rgba(60,60,67,0.10);
}
.room-home-detail-images button{
  border:0;
  padding:0;
  background:transparent;
}
.room-home-calendar-card{
  padding:14px;
  border-radius:16px;
  background:#f8fbff;
  border:1px solid rgba(0,122,255,0.12);
}
.chat-bubble.tool-bubble{
  max-width:min(270px, 82vw);
  padding:8px;
  background:#fff;
}
.chat-tool-card{
  min-width:190px;
  border-radius:16px;
  padding:12px;
  background:#f8f9fb;
  border:1px solid rgba(60,60,67,0.12);
}
.chat-tool-card b,
.chat-tool-card strong,
.chat-tool-card em,
.chat-tool-card p{
  display:block;
}
.chat-tool-card b{
  color:#007aff;
  font-size:11px;
  font-weight:950;
}
.chat-tool-card strong{
  margin-top:4px;
  color:#101828;
  font-size:14px;
  font-weight:950;
}
.chat-tool-card em{
  margin-top:5px;
  color:#667085;
  font-size:12px;
  font-style:normal;
  font-weight:850;
}
.chat-tool-card p{
  margin:8px 0 0;
  color:#475467;
  font-size:12px;
  font-weight:750;
  line-height:1.38;
  white-space:pre-line;
}
.chat-tool-options{
  display:grid;
  gap:6px;
  margin-top:9px;
}
.chat-tool-options button{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  border-radius:999px;
  padding:8px 10px;
  background:#fff;
  color:#344054;
  font-size:12px;
  font-weight:900;
  border:1px solid rgba(60,60,67,0.10);
}
.chat-tool-options button.selected{
  background:#eaf3ff;
  border-color:rgba(0,122,255,0.32);
  color:#007aff;
}
.chat-tool-options button strong,
.chat-tool-options button em{
  display:block;
}
.chat-tool-options button em{
  color:#667085;
  font-size:11px;
  font-style:normal;
  font-weight:850;
}
.chat-tool-summary{
  margin-top:8px;
  color:#667085;
  font-size:11px;
  font-weight:850;
}
.room-home-calendar-card strong,
.room-home-calendar-card span,
.room-home-calendar-card p{
  display:block;
}
.room-home-calendar-card strong{
  color:#101828;
  font-size:16px;
  font-weight:950;
}
.room-home-calendar-card span{
  margin-top:6px;
  color:#007aff;
  font-size:13px;
  font-weight:950;
}
.room-home-calendar-card p{
  margin:8px 0 0;
  color:#475467;
  font-size:13px;
  font-weight:800;
  line-height:1.42;
  white-space:pre-line;
}
.room-home-month-widget{
  padding:14px;
  border-radius:20px;
  background:linear-gradient(180deg,#263553 0%,#12294a 100%);
  color:#dbe7ff;
  box-shadow:0 12px 28px rgba(18,41,74,0.18);
}
.room-home-month-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.room-home-month-head strong{
  color:#f8fbff;
  font-size:18px;
  font-weight:950;
}
.room-home-month-head span{
  flex:0 0 auto;
  border-radius:999px;
  padding:6px 10px;
  background:rgba(255,255,255,0.12);
  color:#eaf3ff;
  font-size:12px;
  font-weight:950;
}
.room-home-month-days,
.room-home-month-grid{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:5px;
}
.room-home-month-days{
  margin-top:13px;
}
.room-home-month-days b{
  color:rgba(234,243,255,0.62);
  font-size:12px;
  font-weight:950;
  text-align:center;
}
.room-home-month-grid{
  margin-top:7px;
}
.room-home-month-grid span.empty{
  min-height:32px;
}
.room-home-month-grid button{
  position:relative;
  min-width:0;
  min-height:32px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:rgba(234,243,255,0.78);
  font-size:14px;
  font-weight:950;
}
.room-home-month-grid button.today{
  color:#fff;
}
.room-home-month-grid button.has-event{
  background:rgba(255,69,58,0.92);
  color:#fff;
  box-shadow:0 0 0 1px rgba(255,255,255,0.08), 0 7px 14px rgba(255,69,58,0.18);
}
.room-home-month-grid button.selected{
  background:#ff453a;
  color:#fff;
  box-shadow:0 0 0 2px rgba(255,255,255,0.2), 0 7px 14px rgba(255,69,58,0.2);
}
.room-home-month-grid button.has-event::after{
  content:none;
  display:none;
}
.room-home-calendar-event{
  margin-top:14px;
  padding:12px;
  border-radius:16px;
  background:rgba(255,255,255,0.10);
  border:1px solid rgba(255,255,255,0.10);
}
.room-home-calendar-event strong,
.room-home-calendar-event span,
.room-home-calendar-event p{
  display:block;
}
.room-home-calendar-event strong{
  color:#fff;
  font-size:15px;
  font-weight:950;
}
.room-home-calendar-event span{
  margin-top:5px;
  color:#bcd3ff;
  font-size:12px;
  font-weight:900;
}
.room-home-calendar-event p{
  margin:7px 0 0;
  color:#eaf3ff;
  font-size:12px;
  font-weight:750;
  line-height:1.42;
  white-space:pre-line;
}
.room-home-section-title{
  margin:13px 2px 7px;
  color:#667085;
  font-size:12px;
  font-weight:950;
}
.room-home-info-list{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
  margin-top:10px;
}
.room-home-info-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:11px 12px;
  border-radius:14px;
  background:#f7f8fb;
  color:#101828;
}
.room-home-info-row b{
  flex:0 0 auto;
  color:#667085;
  font-size:12px;
  font-weight:900;
}
.room-home-info-row span,
.room-home-info-row a,
.room-home-info-row button{
  min-width:0;
  color:#101828;
  font-size:13px;
  font-weight:850;
  line-height:1.35;
  text-align:right;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.room-home-info-row a{
  color:#007aff;
  text-decoration:none;
}
.room-home-info-row button{
  border:0;
  background:transparent;
  color:#007aff;
  padding:0;
  cursor:pointer;
}
.room-location-address{
  margin-top:10px;
  padding:13px;
  border-radius:14px;
  background:#f7f8fb;
  color:#101828;
  line-height:1.45;
  font-size:15px;
  font-weight:800;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.room-home-owner{
  min-height:18px;
  margin-top:10px;
  color:#667085;
  font-size:13px;
  font-weight:800;
  text-align:center;
}
.room-location-actions{
  box-sizing:border-box;
  display:block;
  flex:0 0 auto;
  margin-top:0;
  padding:12px 0 max(14px, env(safe-area-inset-bottom));
  border-top:1px solid rgba(60,60,67,0.10);
  background:#fff;
}
.room-location-subactions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-bottom:8px;
}
.room-location-subactions button{
  background:#f3f6fb !important;
  color:#007aff !important;
}
.room-location-actions button{
  width:100%;
  border:0;
  border-radius:14px;
  padding:12px 10px;
  background:#007aff;
  color:#fff;
  font-size:14px;
  font-weight:900;
}
.room-location-actions button:disabled{
  opacity:.45;
}

.usage-guide-brand{
  min-width:0;
  display:flex;
  align-items:center;
  gap:0;
}
.usage-guide-brand div{
  min-width:0;
}
.usage-guide-brand span{
  display:block;
  margin-top:3px;
  color:#667085;
  font-size:12px;
  font-weight:800;
}

/* =============================
   POPUP / NAV STABILITY
   ============================= */
.official-room-pop{
  bottom:calc(82px + env(safe-area-inset-bottom)) !important;
  left:12px !important;
  right:12px !important;
  z-index:180 !important;
}
.official-pop-card{
  max-width:min(560px, calc(100vw - 24px)) !important;
}
.official-map-overlay{
  z-index:170 !important;
  transform:translate(-50%, calc(-100% - 22px)) !important;
}
.official-map-balloon{
  width:min(154px, 40vw) !important;
  height:min(154px, 40vw) !important;
  box-shadow:0 14px 30px rgba(15,23,42,0.2) !important;
}
#bottomNav{
  left:50% !important;
  right:auto !important;
  bottom:8px !important;
  width:calc(100vw - 16px) !important;
  max-width:620px !important;
  min-width:0 !important;
  transform:translateX(-50%) !important;
  box-sizing:border-box !important;
  z-index:120 !important;
}
#chatImageModal{
  z-index:10020 !important;
  touch-action:pan-y pinch-zoom;
}
#chatImageModal img{
  user-select:none;
  -webkit-user-select:none;
}
.chat-image-viewer-btn,
.chat-image-viewer-close{
  touch-action:manipulation;
}

/* Bottom nav restored: one centered bar, no separated buttons. */
#bottomNav{
  left:50% !important;
  right:auto !important;
  bottom:8px !important;
  width:min(620px, calc(100vw - 16px)) !important;
  height:64px !important;
  padding:0 10px !important;
  transform:translateX(-50%) !important;
  background:rgba(255,255,255,0.72) !important;
  border:1px solid rgba(255,255,255,0.76) !important;
  border-radius:22px !important;
  box-shadow:0 16px 36px rgba(15,23,42,0.16), inset 0 1px 0 rgba(255,255,255,0.72) !important;
  backdrop-filter:blur(22px) saturate(1.55) !important;
  -webkit-backdrop-filter:blur(22px) saturate(1.55) !important;
  display:flex !important;
  justify-content:space-around !important;
  align-items:center !important;
  gap:6px !important;
  box-sizing:border-box !important;
  pointer-events:auto;
}
#bottomNav button,
#profileTab{
  flex:1 1 0 !important;
  height:48px !important;
  min-width:0 !important;
  padding:0 8px !important;
  border:0 !important;
  border-radius:16px !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  color:#111 !important;
  font-size:13px !important;
  font-weight:700 !important;
}

/* Map theme icon image override. */
.theme-orb{
  width:34px !important;
  height:34px !important;
  border-radius:50% !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:contain !important;
  box-shadow:0 0 16px rgba(255,198,78,0.42) !important;
}
.theme-sun{
  background-image:url("../assets/map_theme_sun.png") !important;
  background-color:transparent !important;
}
.theme-moon{
  background-image:url("../assets/map_theme_moon.png") !important;
  background-color:transparent !important;
}
.theme-sun::before,
.theme-sun::after,
.theme-moon::before,
.theme-moon::after{
  display:none !important;
}

/* =============================
   20260619 stable glass restore
   ============================= */
#map{
  height:calc(100% - 156px) !important;
}

#bottomNav{
  left:50% !important;
  right:auto !important;
  bottom:8px !important;
  width:min(620px, calc(100vw - 16px)) !important;
  height:64px !important;
  padding:0 10px !important;
  transform:translateX(-50%) !important;
  background:rgba(255,255,255,0.72) !important;
  border:1px solid rgba(255,255,255,0.76) !important;
  border-radius:22px !important;
  box-shadow:0 16px 36px rgba(15,23,42,0.16), inset 0 1px 0 rgba(255,255,255,0.72) !important;
  backdrop-filter:blur(22px) saturate(1.55) !important;
  -webkit-backdrop-filter:blur(22px) saturate(1.55) !important;
  display:flex !important;
  justify-content:space-around !important;
  align-items:center !important;
  gap:6px !important;
  box-sizing:border-box !important;
  z-index:120 !important;
}
#bottomNav button,
#profileTab{
  flex:1 1 0 !important;
  height:48px !important;
  min-width:0 !important;
  padding:0 8px !important;
  border:1px solid rgba(255,255,255,0.18) !important;
  border-radius:16px !important;
  background:linear-gradient(180deg, rgba(255,255,255,0.28), rgba(255,255,255,0.08)) !important;
  color:#111 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.42), 0 2px 7px rgba(15,23,42,0.04) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  font-size:13px !important;
  font-weight:700 !important;
}
#bottomNav button.active,
#profileTab.active{
  color:#007aff !important;
  background:linear-gradient(180deg, rgba(255,255,255,0.48), rgba(255,255,255,0.16)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.68), 0 4px 10px rgba(10,132,255,0.10) !important;
}
body.filter-sheet-open #bottomNav,
body.official-channel-open #bottomNav{
  display:none !important;
}

#searchBtn,
.catWrap button,
#floatingBtns button,
.chat-filter-section button,
#chatFilterCloseBtn,
#officialChannelAutoBtn,
#officialChannelCloseBtn{
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.62), 0 5px 12px rgba(15,23,42,0.08) !important;
}

#officialChannelModal{
  z-index:260 !important;
  align-items:flex-end !important;
  justify-content:center !important;
  padding:0 !important;
  box-sizing:border-box !important;
}
#officialChannelBox{
  width:min(520px, 100%) !important;
  max-height:calc(100dvh - 18px) !important;
  border-radius:24px 24px 0 0 !important;
  padding:16px 16px calc(22px + env(safe-area-inset-bottom)) !important;
  background:rgba(250,250,252,0.86) !important;
}
#officialChannelList{
  max-height:min(48vh, 380px) !important;
}

.backdrop{
  z-index:220 !important;
}
.sheet,
#bottomSheet{
  z-index:230 !important;
}
.sheetHandle,
#sheetHandle{
  width:96px !important;
  height:30px !important;
  margin:2px auto 8px !important;
  background:transparent !important;
  box-shadow:none !important;
  position:relative !important;
}
.sheetHandle::before,
#sheetHandle::before{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:11px !important;
  width:72px !important;
  height:7px !important;
  transform:translateX(-50%) !important;
  border-radius:999px !important;
  background:rgba(60,60,67,0.30) !important;
}
#sheetClose,
#bottomSheetClose{
  width:44px !important;
  height:44px !important;
  border-radius:16px !important;
  font-size:18px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}

#chatFilterPanel{
  position:fixed !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:min(520px, 100vw) !important;
  max-height:min(70vh, 560px) !important;
  margin:0 auto !important;
  padding:12px 16px calc(18px + env(safe-area-inset-bottom)) !important;
  border-radius:24px 24px 0 0 !important;
  background:rgba(250,250,252,0.88) !important;
  border:1px solid rgba(255,255,255,0.72) !important;
  border-bottom:0 !important;
  box-shadow:0 -18px 44px rgba(15,23,42,0.18), inset 0 1px 0 rgba(255,255,255,0.68) !important;
  backdrop-filter:blur(24px) saturate(1.55) !important;
  -webkit-backdrop-filter:blur(24px) saturate(1.55) !important;
  z-index:240 !important;
  overflow:auto !important;
  box-sizing:border-box !important;
}
#chatFilterPanel.hide{
  display:none !important;
}
.chat-filter-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  min-height:44px !important;
  margin-bottom:8px !important;
}
#chatFilterCloseBtn{
  border:1px solid rgba(60,60,67,0.10) !important;
  border-radius:14px !important;
  padding:9px 12px !important;
  background:rgba(255,255,255,0.62) !important;
  color:#111 !important;
  font-size:13px !important;
  font-weight:900 !important;
}
body.filter-sheet-open #floatingBtns{
  opacity:0 !important;
  pointer-events:none !important;
  transform:translateY(8px) !important;
}
.chat-filter-section{
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:8px !important;
}

.official-room-pop{
  bottom:calc(82px + env(safe-area-inset-bottom)) !important;
  z-index:210 !important;
}
.official-map-overlay{
  z-index:210 !important;
  transform:translate(-50%, calc(-100% - 54px)) !important;
}
.official-map-balloon{
  width:min(154px, 40vw) !important;
  height:min(154px, 40vw) !important;
}

/* =============================
   20260620 TripTalk marker/nav polish
   ============================= */
#bottomNav{
  background:rgba(255,255,255,0.58) !important;
  border:1px solid rgba(255,255,255,0.82) !important;
  box-shadow:0 18px 42px rgba(15,23,42,0.15), inset 0 1px 0 rgba(255,255,255,0.82) !important;
  backdrop-filter:blur(26px) saturate(1.7) !important;
  -webkit-backdrop-filter:blur(26px) saturate(1.7) !important;
}
#bottomNav button,
#profileTab{
  background:linear-gradient(180deg, rgba(255,255,255,0.34), rgba(255,255,255,0.10)) !important;
  border-color:rgba(255,255,255,0.24) !important;
}
#bottomNav .bottom-tab[data-panel="hot"]{
  color:#ff2d2d !important;
  font-weight:900 !important;
}
#bottomNav .bottom-tab[data-panel="hot"].active{
  color:#e60012 !important;
  background:linear-gradient(180deg, rgba(255,80,80,0.20), rgba(255,255,255,0.12)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.70), 0 5px 12px rgba(255,45,45,0.16) !important;
}
.contentReactionActions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.contentReactionActions button{border:1px solid #dbe3ef;background:#fff;color:#334155;border-radius:10px;padding:8px 11px;font-weight:700}.contentReactionActions button.active{border-color:#ff4d6d;color:#e11d48;background:#fff1f4}.miniRoomRow{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.miniRoomRow .contentReactionActions{margin:0}.miniRoomRow .contentReactionActions [data-content-save]{display:none}
.room-home-reaction-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0;padding:10px;border:1px solid #e2e8f0;border-radius:14px;background:#f8fafc}.room-home-reaction-actions .contentReactionActions{margin:0}
.profile-user-reaction-actions{display:flex;gap:9px;margin:12px 0;flex-wrap:wrap}.profile-user-reaction-actions button{flex:1;min-width:130px;border:1px solid #dbe3ef;background:#fff;border-radius:12px;padding:11px;font-weight:800;color:#334155}.profile-user-reaction-actions button.active{border-color:#fb7185;background:#fff1f2;color:#e11d48}
.profileNotificationGroup>button{position:relative;width:100%;display:flex;align-items:center;justify-content:space-between;border:0;background:transparent;padding:14px 12px;text-align:left}.profileNotificationGroup>button span{font-weight:900}.profileNotificationGroup>button em{font-style:normal;color:#64748b;font-size:12px}.profileNotificationGroup>button b{position:absolute;right:8px;top:5px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#ef233c;color:#fff;font-size:11px;line-height:20px;text-align:center}

.room-label{
  --room-accent:#2878d8;
  min-height:30px !important;
  max-width:176px !important;
  padding:7px 13px 8px !important;
  border-radius:10px !important;
  background:#fffefa !important;
  color:#111 !important;
  border:1.25px solid #151515 !important;
  box-shadow:1px 0 0 rgba(0,0,0,.88), -1px 1px 0 rgba(0,0,0,.58), 0 8px 16px rgba(15,23,42,0.14) !important;
  font-size:14px !important;
  font-weight:900 !important;
  line-height:1.15 !important;
}
.room-label::after{
  content:"" !important;
  position:absolute !important;
  left:17px !important;
  bottom:-10px !important;
  width:18px !important;
  height:14px !important;
  background:#fffefa !important;
  border-left:1.4px solid #151515 !important;
  border-bottom:1.4px solid #151515 !important;
  transform:skew(-22deg) !important;
  clip-path:polygon(0 0, 100% 0, 0 100%) !important;
}
.room-label::before{
  pointer-events:none !important;
}
.room-label-open,
.room-label-private,
.room-label-official{
  background:#fffefa !important;
  border-color:#151515 !important;
  color:#111 !important;
}
.room-label-open,
.room-label-private{
  --room-accent:#2878d8;
  box-shadow:0 8px 16px rgba(15,23,42,0.14), inset 0 -3px 0 rgba(40,120,216,0.46) !important;
}
.room-label-open::before,
.room-label-private::before{
  content:"\270B" !important;
  position:absolute !important;
  left:-9px !important;
  top:-17px !important;
  font-size:20px !important;
  line-height:1 !important;
  transform:rotate(-12deg) !important;
  filter:drop-shadow(0 1px 0 #151515) !important;
}
.room-label-open::after,
.room-label-private::after{
  box-shadow:23px -1px 0 -8px var(--room-accent) !important;
}
.room-label-official{
  --room-accent:#f0a400;
  box-shadow:0 8px 16px rgba(15,23,42,0.14), inset 0 -3px 0 rgba(240,164,0,0.52) !important;
}
.room-label-official::before{
  content:"" !important;
  position:absolute !important;
  left:-10px !important;
  top:-15px !important;
  width:17px !important;
  height:17px !important;
  border-radius:50% 50% 50% 0 !important;
  background:radial-gradient(circle at 50% 50%, #fff 0 3px, #151515 3.4px 4.4px, #ef3b2d 4.8px 100%) !important;
  border:2px solid #151515 !important;
  transform:rotate(-45deg) !important;
  box-shadow:0 2px 5px rgba(15,23,42,0.16) !important;
}
.room-label-official::after{
  box-shadow:23px -1px 0 -8px var(--room-accent) !important;
}
.official-map-overlay{
  transform:translate(-50%, calc(-100% - 38px)) !important;
}

/* =============================
   20260620 centered marker tail / type help
   ============================= */
#chatFilterPanel{
  height:auto !important;
  display:flex !important;
  flex-direction:column !important;
}
#chatFilterPanel.hide{
  display:none !important;
}
.chat-filter-section.active{
  min-height:0 !important;
  max-height:none !important;
  overflow:visible !important;
  align-content:start !important;
  padding-right:2px !important;
}

.room-label::after,
.room-label-open::after,
.room-label-private::after,
.room-label-official::after{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  bottom:-7px !important;
  width:14px !important;
  height:14px !important;
  background:#fffefa !important;
  border:0 !important;
  border-right:1.25px solid #151515 !important;
  border-bottom:1.25px solid #151515 !important;
  border-radius:1px !important;
  transform:translateX(-50%) rotate(45deg) !important;
  clip-path:none !important;
  filter:none !important;
  box-shadow:2px 2px 0 rgba(0,0,0,.10) !important;
}
.room-label-open::before{
  content:"\1F44B" !important;
  font-size:15px !important;
  left:7px !important;
  top:7px !important;
  transform:rotate(-10deg) !important;
  filter:saturate(.62) brightness(1.08) drop-shadow(0 1px 0 #151515) !important;
  opacity:.88 !important;
  z-index:2 !important;
}
.room-label-private::before{
  content:"\1F512" !important;
  font-size:14px !important;
  left:8px !important;
  top:7px !important;
  transform:rotate(-6deg) !important;
  filter:grayscale(1) brightness(.76) contrast(1.18) drop-shadow(0 1px 0 #151515) !important;
  opacity:.94 !important;
  z-index:2 !important;
}
.room-label-open{
  --room-accent:#f0a400;
  padding-left:31px !important;
  box-shadow:1px 0 0 rgba(0,0,0,.88), -1px 1px 0 rgba(0,0,0,.58), 0 8px 16px rgba(15,23,42,0.14), inset 0 -3px 0 rgba(240,164,0,0.42) !important;
}
.room-label-private{
  --room-accent:#7b6dff;
  padding-left:31px !important;
  box-shadow:1px 0 0 rgba(0,0,0,.88), -1px 1px 0 rgba(0,0,0,.58), 0 8px 16px rgba(15,23,42,0.14), inset 0 -3px 0 rgba(123,109,255,0.28) !important;
}
.room-label-official{
  --room-accent:#ef3b2d;
  padding-left:31px !important;
  box-shadow:1px 0 0 rgba(0,0,0,.88), -1px 1px 0 rgba(0,0,0,.58), 0 8px 16px rgba(15,23,42,0.14), inset 0 -3px 0 rgba(239,59,45,0.46) !important;
}
.room-label-official::before{
  left:8px !important;
  top:7px !important;
  width:12px !important;
  height:12px !important;
  border-width:1.7px !important;
  transform:rotate(-45deg) !important;
  box-shadow:0 1px 3px rgba(15,23,42,0.18) !important;
  z-index:2 !important;
}

.room-create-type-help{
  margin-top:8px;
  display:grid;
  gap:6px;
}
.room-create-type-help div{
  padding:10px 12px;
  border-radius:13px;
  background:rgba(60,60,67,0.055);
  border:1px solid rgba(60,60,67,0.08);
}
.room-create-type-help strong{
  display:block;
  font-size:13px;
  color:#111;
}
.room-create-type-help span{
  display:block;
  margin-top:3px;
  font-size:12px;
  line-height:1.35;
  color:rgba(60,60,67,0.62);
}
.room-create-inquiry-btn{
  width:100%;
  margin-top:8px;
  padding:11px 12px;
  border:1px dashed rgba(0,122,255,0.35);
  border-radius:14px;
  background:rgba(0,122,255,0.08);
  color:#0068d9;
  font-size:13px;
  font-weight:900;
}
.room-type-btn{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
  text-align:left;
  line-height:1.2;
}
.room-type-btn strong{
  font-size:16px;
}
.room-type-btn span{
  font-size:12px;
  font-weight:700;
  opacity:.68;
}
.policyOpenChatBtn{
  display:block;
  margin-top:12px;
  padding:12px 14px;
  border-radius:14px;
  background:#fee500;
  color:#111;
  font-size:14px;
  font-weight:900;
  text-align:center;
  text-decoration:none;
}
.policyOpenChatBtn.neutral{border:0;background:#eef2f7;color:#334155;}
.policyOpenChatBtn.danger{width:100%;border:0;background:#fff0f1;color:#d92d43;}
.supportCenter{display:grid;gap:14px;}
.supportCenter section{padding:14px;border:1px solid #e2e8f0;border-radius:16px;background:#f8fafc;}
.supportCenter section>strong{font-size:16px;}
.supportCenter section>p{margin:6px 0 12px;color:#64748b;font-size:12px;line-height:1.5;}
.supportQuickQuestions{display:flex;flex-wrap:wrap;gap:6px;}
.supportQuickQuestions button{border:0;border-radius:999px;padding:8px 10px;background:#e8f1ff;color:#1769e0;font-weight:850;}
#supportAiForm{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;margin-top:10px;}
#supportAiForm input,.supportHuman select,.supportHuman textarea{width:100%;box-sizing:border-box;border:1px solid #d8e0ea;border-radius:11px;padding:11px;background:#fff;font:inherit;}
#supportAiForm button{border:0;border-radius:11px;padding:0 14px;background:#111;color:#fff;font-weight:900;}
.supportAiAnswer{margin-top:9px;padding:11px;border-radius:11px;background:#fff;color:#334155;font-size:13px;line-height:1.55;}
.supportHuman{display:grid;gap:8px;}
.supportHuman .policyOpenChatBtn{margin-top:2px;border:0;background:#1769e0;color:#fff;}
.aiPlanLoading,.aiPlanError{padding:18px;border-radius:14px;background:#f8fafc;color:#475569;text-align:center;font-weight:800;}
.aiPlanError{background:#fff1f2;color:#be123c;}
.aiPlanGrid .aiPlanDays{grid-column:1/-1;}
.aiPlanGrid em{color:#1769e0;font-style:normal;font-weight:800;}

/* =============================
   20260620 fixed SVG map bubbles
   ============================= */
.room-label,
.room-label-open,
.room-label-private,
.room-label-official{
  width:204px !important;
  height:68px !important;
  min-height:0 !important;
  max-width:204px !important;
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:10px 20px 18px 46px !important;
  border:0 !important;
  border-radius:0 !important;
  background-color:transparent !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 210 72'%3E%3Cpath d='M18 8H192Q202 8 202 18V44Q202 54 192 54H112L105 67L98 54H18Q8 54 8 44V18Q8 8 18 8Z' fill='%23fffefa' stroke='%23151515' stroke-width='1.7' stroke-linejoin='round'/%3E%3Cpath d='M21 9C61 6 116 10 151 8C176 7 194 10 200 17' fill='none' stroke='%23151515' stroke-width='.9' stroke-linecap='round' opacity='.55'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:100% 100% !important;
  color:#111 !important;
  font-size:13px !important;
  font-weight:900 !important;
  line-height:1.16 !important;
  letter-spacing:0 !important;
  text-align:center !important;
  white-space:normal !important;
  word-break:keep-all !important;
  overflow-wrap:anywhere !important;
  overflow:visible !important;
  text-shadow:none !important;
  box-shadow:none !important;
}
.room-label::before,
.room-label-open::before,
.room-label-private::before,
.room-label-official::before{
  content:"" !important;
  position:absolute !important;
  left:10px !important;
  top:5px !important;
  width:30px !important;
  height:30px !important;
  border:0 !important;
  border-radius:0 !important;
  background-color:transparent !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:contain !important;
  transform:none !important;
  filter:drop-shadow(0 1px 0 rgba(21,21,21,.75)) !important;
  opacity:1 !important;
  pointer-events:none !important;
  z-index:2 !important;
}
.room-label::after,
.room-label-open::after,
.room-label-private::after,
.room-label-official::after{
  content:"" !important;
  position:absolute !important;
  left:54px !important;
  right:24px !important;
  bottom:16px !important;
  width:auto !important;
  height:3px !important;
  background:var(--room-accent) !important;
  border:0 !important;
  border-radius:999px !important;
  transform:none !important;
  clip-path:polygon(0 35%, 72% 0, 100% 42%, 72% 100%, 0 70%) !important;
  filter:none !important;
  box-shadow:none !important;
  opacity:.78 !important;
  pointer-events:none !important;
}
.room-label-open{
  --room-accent:#f0a400 !important;
}
.room-label-open::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M10 25C7 23 6 20 6 16V9c0-1.3 1-2.3 2.2-2.3S10.4 7.7 10.4 9v6.1V6.4c0-1.3 1-2.3 2.2-2.3s2.2 1 2.2 2.3v8.4V7.1c0-1.3 1-2.3 2.2-2.3s2.2 1 2.2 2.3v8l1.6-2.4c.7-1 2.1-1.3 3.1-.6 1 .7 1.3 2 .7 3.1l-3 5.5C19.7 24.4 17 26 13 26h-1.2c-.7 0-1.3-.2-1.8-.6Z' fill='%23ffe47a' stroke='%23151515' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M24 7c1.6.8 2.6 2 3 3.7M25 3c2.2.9 3.7 2.4 4.5 4.5' fill='none' stroke='%23151515' stroke-width='1.4' stroke-linecap='round' opacity='.8'/%3E%3C/svg%3E") !important;
}
.room-label-private{
  --room-accent:#7b6dff !important;
}
.room-label-private::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect x='7' y='14' width='18' height='13' rx='3.2' fill='%2394969c' stroke='%23151515' stroke-width='1.8'/%3E%3Cpath d='M11 14v-3.2C11 7.5 13.2 5 16 5s5 2.5 5 5.8V14' fill='none' stroke='%23151515' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='16' cy='20.5' r='1.6' fill='%23151515'/%3E%3Cpath d='M16 22v2.4' stroke='%23151515' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}
.room-label-official{
  --room-accent:#ef3b2d !important;
}
.room-label-official::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 29C10.6 21.9 7.4 16.8 7.4 12.6 7.4 7.8 11.2 4 16 4s8.6 3.8 8.6 8.6c0 4.2-3.2 9.3-8.6 16.4Z' fill='%23ef3b2d' stroke='%23151515' stroke-width='1.8' stroke-linejoin='round'/%3E%3Ccircle cx='16' cy='12.4' r='3.6' fill='%23fffefa' stroke='%23151515' stroke-width='1.5'/%3E%3C/svg%3E") !important;
}

/* =============================
   20260620 sketch map bubbles
   ============================= */
.room-label,
.room-label-open,
.room-label-private,
.room-label-official{
  width:216px !important;
  height:82px !important;
  min-height:0 !important;
  max-width:216px !important;
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:17px 22px 24px 56px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 84'%3E%3Cpath d='M43 18H198C207 18 212 23 212 32V51C212 59 207 64 198 64H75L48 78L53 64H42C34 64 28 58 28 50V32C28 24 34 18 43 18Z' fill='%23fffefa' stroke='%23151515' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M44 17C82 15 132 20 197 18' fill='none' stroke='%23151515' stroke-width='1' stroke-linecap='round' opacity='.65'/%3E%3Cpath d='M31 31C28 39 29 50 31 56' fill='none' stroke='%23151515' stroke-width='.9' stroke-linecap='round' opacity='.6'/%3E%3Cpath d='M74 65C112 63 158 66 196 64' fill='none' stroke='%23151515' stroke-width='.85' stroke-linecap='round' opacity='.42'/%3E%3Cpath d='M49 77C53 71 56 67 61 64' fill='none' stroke='%23151515' stroke-width='.9' stroke-linecap='round' opacity='.5'/%3E%3C/svg%3E") center/100% 100% no-repeat !important;
  color:#111 !important;
  font-size:15px !important;
  font-weight:900 !important;
  line-height:1.12 !important;
  letter-spacing:0 !important;
  text-align:center !important;
  white-space:normal !important;
  word-break:keep-all !important;
  overflow-wrap:anywhere !important;
  overflow:visible !important;
  text-shadow:0 1px 0 rgba(255,255,255,.85) !important;
  box-shadow:none !important;
}
.room-label::before,
.room-label-open::before,
.room-label-private::before,
.room-label-official::before{
  content:"" !important;
  position:absolute !important;
  left:4px !important;
  top:2px !important;
  width:40px !important;
  height:40px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent none center/contain no-repeat !important;
  transform:none !important;
  clip-path:none !important;
  filter:drop-shadow(0 1px 0 rgba(21,21,21,.82)) !important;
  opacity:1 !important;
  pointer-events:none !important;
  z-index:3 !important;
}
.room-label::after,
.room-label-open::after,
.room-label-private::after,
.room-label-official::after{
  content:"" !important;
  position:absolute !important;
  left:82px !important;
  right:28px !important;
  bottom:14px !important;
  width:auto !important;
  height:5px !important;
  background:var(--room-accent) !important;
  border:0 !important;
  border-radius:999px !important;
  transform:rotate(-1deg) !important;
  clip-path:polygon(0 45%, 15% 15%, 72% 35%, 100% 0, 92% 70%, 44% 100%, 8% 80%) !important;
  filter:none !important;
  box-shadow:0 2px 0 rgba(21,21,21,.10) !important;
  opacity:.86 !important;
  pointer-events:none !important;
  z-index:1 !important;
}
.room-label-open{
  --room-accent:#2f7ec8 !important;
}
.room-label-open::before{
  left:8px !important;
  top:3px !important;
  width:39px !important;
  height:39px !important;
  background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 42'%3E%3Cpath d='M14 33C10 30 9 26 9 21V12c0-1.7 1.2-2.9 2.8-2.9s2.8 1.2 2.8 2.9v8.2V8.8c0-1.7 1.3-3 2.9-3s2.9 1.3 2.9 3v10.9V9.8c0-1.7 1.3-3 2.9-3s2.9 1.3 2.9 3v10.4l1.7-2.9c.9-1.5 2.7-2 4.1-1.2s1.9 2.7 1.1 4.1l-3.7 6.4C27.7 31 24.2 34 18.7 34H16c-.7 0-1.4-.3-2-.7Z' fill='%23ffe680' stroke='%23151515' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M33 10c1.5.8 2.7 2 3.3 3.7M34 5c2.3 1 4 2.6 5 4.9' fill='none' stroke='%23151515' stroke-width='1.7' stroke-linecap='round' opacity='.82'/%3E%3C/svg%3E") center/contain no-repeat !important;
}
.room-label-private{
  --room-accent:#7b6dff !important;
}
.room-label-private::before{
  left:8px !important;
  top:4px !important;
  width:36px !important;
  height:36px !important;
  background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='9' y='17' width='22' height='16' rx='4' fill='%2394969c' stroke='%23151515' stroke-width='2.2'/%3E%3Cpath d='M14 17v-4C14 8.8 16.5 6 20 6s6 2.8 6 7v4' fill='none' stroke='%23151515' stroke-width='2.4' stroke-linecap='round'/%3E%3Ccircle cx='20' cy='24.5' r='1.8' fill='%23151515'/%3E%3Cpath d='M20 26.4v2.9' stroke='%23151515' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat !important;
}
.room-label-official{
  --room-accent:#f0a400 !important;
}
.room-label-official::before{
  left:1px !important;
  top:0 !important;
  width:45px !important;
  height:45px !important;
  background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 46'%3E%3Cpath d='M23 41C15.5 31.5 11 24.7 11 18.7 11 12 16.4 6.8 23 6.8S35 12 35 18.7c0 6-4.5 12.8-12 22.3Z' fill='%23ef5a4d' stroke='%23151515' stroke-width='2.3' stroke-linejoin='round'/%3E%3Ccircle cx='23' cy='18.4' r='5.3' fill='%23fffefa' stroke='%23151515' stroke-width='1.9'/%3E%3Cpath d='M36 15c1.6.8 2.8 2 3.5 3.5M38 11c1.7.6 3 1.6 4 3' fill='none' stroke='%23151515' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat !important;
}

/* =============================
   20260620 sketch bubble refine
   ============================= */
.room-label,
.room-label-open,
.room-label-private,
.room-label-official{
  width:208px !important;
  height:76px !important;
  max-width:208px !important;
  padding:22px 25px 25px 45px !important;
  align-items:center !important;
  justify-content:center !important;
  background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 210 76'%3E%3Cpath d='M37 20H190C198 20 203 25 203 33V49C203 57 198 61 190 61H73L45 72L51 61H38C30 61 25 56 25 48V33C25 25 30 20 37 20Z' fill='%23fffefa' stroke='%23151515' stroke-width='1.9' stroke-linejoin='round'/%3E%3Cpath d='M38 19C72 17 122 21 190 20' fill='none' stroke='%23151515' stroke-width='1.05' stroke-linecap='round' opacity='.72'/%3E%3Cpath d='M27 31C25 38 26 48 28 55' fill='none' stroke='%23151515' stroke-width='.9' stroke-linecap='round' opacity='.58'/%3E%3Cpath d='M74 62C115 60 151 63 188 61' fill='none' stroke='%23151515' stroke-width='.82' stroke-linecap='round' opacity='.48'/%3E%3Cpath d='M45 72C49 67 53 64 59 61' fill='none' stroke='%23151515' stroke-width='.95' stroke-linecap='round' opacity='.55'/%3E%3C/svg%3E") center/100% 100% no-repeat !important;
  background-color:transparent !important;
  font-size:15px !important;
  line-height:1.1 !important;
  overflow:visible !important;
}
.room-label::before,
.room-label-open::before,
.room-label-private::before,
.room-label-official::before{
  left:20px !important;
  top:2px !important;
  width:42px !important;
  height:42px !important;
  background-color:transparent !important;
  z-index:4 !important;
}
.room-label::after,
.room-label-open::after,
.room-label-private::after,
.room-label-official::after{
  left:86px !important;
  right:36px !important;
  bottom:21px !important;
  height:5px !important;
  transform:rotate(-1deg) !important;
  clip-path:polygon(0 44%, 16% 18%, 58% 36%, 100% 12%, 88% 72%, 45% 100%, 8% 78%) !important;
  opacity:.86 !important;
  z-index:2 !important;
}
.room-label-open::before{
  left:22px !important;
  top:3px !important;
  width:39px !important;
  height:39px !important;
}
.room-label-private::before{
  left:23px !important;
  top:4px !important;
  width:36px !important;
  height:36px !important;
}
.room-label-official::before{
  left:17px !important;
  top:0 !important;
  width:46px !important;
  height:46px !important;
}
.room-label-open::before{
  background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44'%3E%3Cpath d='M15 35C11.2 32.1 9.5 28.4 9.5 23.8v-7.1c0-1.5 1.1-2.7 2.6-2.7 1.4 0 2.6 1.2 2.6 2.7v5.1V11.7c0-1.6 1.2-2.8 2.8-2.8s2.8 1.2 2.8 2.8v9.8V10.8c0-1.6 1.2-2.8 2.8-2.8 1.5 0 2.8 1.2 2.8 2.8v10.8V13c0-1.5 1.1-2.7 2.6-2.7s2.6 1.2 2.6 2.7v10.4l1.6-2.6c.8-1.4 2.5-1.9 3.8-1.1 1.3.8 1.8 2.5 1 3.9l-3.7 6.1C31.1 34.2 27.1 37 21.4 37h-3.7c-1 0-1.9-.3-2.7-1Z' fill='%23fffefa' stroke='%23151515' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M34.5 8.2c1.7.7 2.9 1.8 3.7 3.4M36 4.5c2.1.8 3.7 2.2 4.8 4.2' fill='none' stroke='%232f7ec8' stroke-width='2.1' stroke-linecap='round'/%3E%3Cpath d='M9.8 25.8C7.8 24.7 6.5 23.2 6 21.2M10.2 30c-2.1-.5-3.8-1.5-5-3.1' fill='none' stroke='%23151515' stroke-width='1.7' stroke-linecap='round' opacity='.78'/%3E%3C/svg%3E") center/contain no-repeat !important;
}

/* =============================
   20260620 restore stable map labels
   ============================= */
.map-room-label-overlay{
  display:none !important;
}
.room-label,
.room-label-open,
.room-label-private,
.room-label-official{
  --room-accent:#2878d8;
  position:relative !important;
  width:auto !important;
  height:auto !important;
  min-height:24px !important;
  max-width:150px !important;
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:5px 10px 6px 30px !important;
  border:1.1px solid #151515 !important;
  border-radius:8px !important;
  background:#fffefa !important;
  color:#111 !important;
  font-size:13px !important;
  font-weight:900 !important;
  line-height:1.05 !important;
  letter-spacing:0 !important;
  text-align:center !important;
  white-space:nowrap !important;
  word-break:keep-all !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  text-shadow:0 1px 0 rgba(255,255,255,.75) !important;
  box-shadow:1px 0 0 rgba(0,0,0,.88), -1px 1px 0 rgba(0,0,0,.58), 0 8px 16px rgba(15,23,42,.14), inset 0 -3px 0 rgba(40,120,216,.34) !important;
}
.room-label::before,
.room-label-open::before,
.room-label-private::before,
.room-label-official::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:7px !important;
  top:50% !important;
  width:18px !important;
  height:18px !important;
  background-color:transparent !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:contain !important;
  transform:translateY(-50%) !important;
  pointer-events:none !important;
}
.room-label::after,
.room-label-open::after,
.room-label-private::after,
.room-label-official::after{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  bottom:-4px !important;
  width:7px !important;
  height:7px !important;
  background:#fffefa !important;
  border:0 !important;
  border-right:1px solid #151515 !important;
  border-bottom:1px solid #151515 !important;
  border-radius:1px !important;
  transform:translateX(-50%) rotate(45deg) !important;
  clip-path:none !important;
  filter:none !important;
  box-shadow:1px 1px 0 rgba(0,0,0,.06) !important;
  opacity:1 !important;
  pointer-events:none !important;
}
.room-label-open{
  --room-accent:#2878d8 !important;
  box-shadow:1px 0 0 rgba(0,0,0,.88), -1px 1px 0 rgba(0,0,0,.58), 0 8px 16px rgba(15,23,42,.14), inset 0 -3px 0 rgba(40,120,216,.34) !important;
}
.room-label-open::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M9.5 25.5c-2.2-2-3.1-4.4-3.1-7.3v-4.5c0-1.1.8-1.9 1.9-1.9s1.9.8 1.9 1.9v3.6V9.4c0-1.1.8-2 2-2s2 .9 2 2v7.4V8.8c0-1.1.8-2 2-2s2 .9 2 2v8.1V10.5c0-1.1.8-1.9 1.9-1.9s1.9.8 1.9 1.9v7.6l1-1.6c.6-1 1.8-1.3 2.8-.7.9.6 1.2 1.8.6 2.8l-2.5 4.1c-1.8 3.1-4.8 5-8.8 5h-2.7c-.8 0-1.5-.2-2.1-.7Z' fill='%23fffefa' stroke='%23151515' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M24.9 8c1.2.5 2.1 1.3 2.7 2.5M25.8 5.2c1.6.6 2.8 1.6 3.6 3.1' fill='none' stroke='%232878d8' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}
.room-label-private{
  --room-accent:#7b6dff !important;
  box-shadow:1px 0 0 rgba(0,0,0,.88), -1px 1px 0 rgba(0,0,0,.58), 0 8px 16px rgba(15,23,42,.14), inset 0 -3px 0 rgba(123,109,255,.30) !important;
}
.room-label-private::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect x='7.5' y='14' width='17' height='12' rx='3' fill='%239b9ca3' stroke='%23151515' stroke-width='1.8'/%3E%3Cpath d='M11 14v-3c0-3.2 2-5.3 5-5.3s5 2.1 5 5.3v3' fill='none' stroke='%23151515' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='16' cy='20' r='1.4' fill='%23151515'/%3E%3Cpath d='M16 21.5v2.1' stroke='%23151515' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}
.room-label-official{
  --room-accent:#ef3b2d !important;
  box-shadow:1px 0 0 rgba(0,0,0,.88), -1px 1px 0 rgba(0,0,0,.58), 0 8px 16px rgba(15,23,42,.14), inset 0 -3px 0 rgba(239,59,45,.40) !important;
}
.room-label-official::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 29C10.4 21.8 7 16.8 7 12.3 7 7.4 11 3.6 16 3.6s9 3.8 9 8.7c0 4.5-3.4 9.5-9 16.7Z' fill='%23ef3b2d' stroke='%23151515' stroke-width='1.8' stroke-linejoin='round'/%3E%3Ccircle cx='16' cy='12.2' r='3.7' fill='%23fffefa' stroke='%23151515' stroke-width='1.4'/%3E%3C/svg%3E") !important;
}

.map-night-mode .room-label,
.map-night-mode .room-label-open,
.map-night-mode .room-label-private,
.map-night-mode .room-label-official{
  background:#fffefa !important;
  color:#111 !important;
  text-shadow:0 1px 0 rgba(255,255,255,.75) !important;
}
.map-night-mode .room-label::after,
.map-night-mode .room-label-open::after,
.map-night-mode .room-label-private::after,
.map-night-mode .room-label-official::after{
  background:#fffefa !important;
}

/* =============================
   20260620 small image map labels
   ============================= */
.room-label,
.room-label-open,
.room-label-private,
.room-label-official{
  position:relative !important;
  width:200px !important;
  height:72px !important;
  min-width:200px !important;
  max-width:200px !important;
  min-height:72px !important;
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  padding:2px 13px 13px 56px !important;
  border:0 !important;
  border-radius:0 !important;
  background-color:transparent !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:100% 100% !important;
  color:#111 !important;
  font-size:13px !important;
  font-weight:900 !important;
  line-height:17px !important;
  letter-spacing:0 !important;
  text-align:left !important;
  white-space:nowrap !important;
  word-break:keep-all !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  text-shadow:0 1px 0 rgba(255,255,255,.82) !important;
  box-shadow:none !important;
}
.room-label-long{
  padding-left:46px !important;
  padding-right:9px !important;
}
.room-label::before,
.room-label-open::before,
.room-label-private::before,
.room-label-official::before{
  content:none !important;
  display:none !important;
}
.room-label::after,
.room-label-open::after,
.room-label-private::after,
.room-label-official::after{
  content:none !important;
  display:none !important;
}
.room-label-open{
  background-image:url("../assets/map-labels/label-open-small.png?h=8503f2d34bca") !important;
}
.room-label-private{
  background-image:url("../assets/map-labels/label-private-small.png?h=261dfd217437") !important;
}
.room-label-official{
  background-image:url("../assets/map-labels/label-official-small.png?h=9129716ad783") !important;
}
.map-night-mode .room-label,
.map-night-mode .room-label-open,
.map-night-mode .room-label-private,
.map-night-mode .room-label-official{
  background-color:transparent !important;
  color:#111 !important;
}
.map-night-mode .room-label-open{
  background:transparent url("../assets/map-labels/label-open-small.png?h=8503f2d34bca") center/100% 100% no-repeat !important;
}
.map-night-mode .room-label-private{
  background:transparent url("../assets/map-labels/label-private-small.png?h=261dfd217437") center/100% 100% no-repeat !important;
}
.map-night-mode .room-label-official{
  background:transparent url("../assets/map-labels/label-official-small.png?h=9129716ad783") center/100% 100% no-repeat !important;
}

.official-map-overlay{
  transform:translate(-50%, calc(-100% - 66px)) !important;
}

/* triptalk v7 stabilization: official popup only, map label PNGs untouched */
.official-map-overlay{
  transform:translate(-50%, calc(-100% - 35px)) !important;
}
.official-map-balloon{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  padding:7px 6px 8px !important;
}
.official-map-image{
  width:100% !important;
  height:calc(100% - 27px) !important;
  object-fit:cover !important;
  object-position:center center !important;
  margin:0 auto !important;
}
.official-map-copy{
  width:100% !important;
  min-width:0 !important;
  padding:2px 0 0 0 !important;
  text-align:left !important;
  align-self:stretch !important;
}
.official-map-balloon strong{
  width:100% !important;
  text-align:left !important;
  padding-left:0 !important;
}

/* v14: keep map popup anchored so the marker position does not dip during open/close */
.official-map-overlay{
  will-change:left, top !important;
  transform:translate3d(-50%, calc(-100% - 35px), 0) !important;
  contain:layout style paint !important;
}
.official-map-balloon{
  transform-origin:50% 100% !important;
  animation:officialMapPopAnchored .22s ease-out both !important;
}
@keyframes officialMapPopAnchored{
  0%{transform:scale(.96);opacity:0;}
  100%{transform:scale(1);opacity:1;}
}

/* v1: chat avatars sit on the bubble tail, not beside the sender name */
.chat-message-row.mine,
.chat-message-row.theirs{
  align-items:flex-end !important;
}
.chat-message-row.theirs{
  gap:6px !important;
}
.chat-message-row.mine{
  gap:6px !important;
}
.chat-avatar-btn{
  width:32px !important;
  height:32px !important;
  align-self:flex-end !important;
  margin-bottom:0 !important;
  box-shadow:0 2px 8px rgba(15,23,42,0.12) !important;
}
.chat-sender-name{
  margin:0 0 3px 2px !important;
  line-height:1.15 !important;
}
.chat-message-row.mine .chat-sender-name{
  margin:0 2px 3px 0 !important;
}
.chat-message-row.theirs .chat-bubble:not(.image-bubble)::after{
  left:-5px !important;
  bottom:3px !important;
}
.chat-message-row.mine .chat-bubble:not(.image-bubble)::after{
  right:-5px !important;
  bottom:3px !important;
}
.chat-message-row.theirs .chat-stack{
  max-width:calc(100% - 44px) !important;
}
.chat-message-row.mine .chat-stack{
  max-width:calc(100% - 44px) !important;
}

/* v1: map popup fades in without scale/translate movement */
.official-map-balloon{
  animation:officialMapFadeAnchored .16s ease-out both !important;
  transform:none !important;
  transform-origin:50% 100% !important;
}
@keyframes officialMapFadeAnchored{
  0%{opacity:0;}
  100%{opacity:1;}
}

/* v3: large notice editor */
.room-notice-editor-sheet{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(15,23,42,0.34);
  box-sizing:border-box;
}
.room-notice-editor-sheet.hide{
  display:none;
}
.room-notice-editor-box{
  width:min(520px, 100%);
  max-height:min(78vh, 640px);
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:16px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 18px 40px rgba(15,23,42,0.22);
  box-sizing:border-box;
}
.room-notice-editor-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.room-notice-editor-head strong{
  font-size:18px;
  font-weight:950;
}
.room-notice-editor-head button{
  border:0;
  border-radius:999px;
  padding:8px 11px;
  background:rgba(60,60,67,0.1);
  color:#111;
  font-weight:900;
}
.room-notice-editor-box textarea{
  width:100%;
  min-height:260px;
  max-height:48vh;
  box-sizing:border-box;
  padding:13px;
  border:1px solid rgba(60,60,67,0.16);
  border-radius:14px;
  background:#f8f9fb;
  color:#111;
  font:800 15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  resize:vertical;
}
.room-notice-editor-actions{
  display:flex;
  gap:10px;
}
.room-notice-editor-actions button{
  flex:1;
  border:0;
  border-radius:13px;
  padding:12px;
  font-weight:950;
}
.room-notice-editor-actions [data-notice-clear]{
  background:rgba(255,59,48,0.12);
  color:#b42318;
}
.room-notice-editor-actions [data-notice-save]{
  background:#007aff;
  color:#fff;
}

/* v2.6: 내 채팅과 상대 채팅 모두 말풍선 꼬리를 사용하지 않습니다. */
.chat-message-row.mine .chat-bubble:not(.image-bubble)::after,
.chat-message-row.theirs .chat-bubble:not(.image-bubble)::after{
  content:none !important;
  display:none !important;
}
.chat-message-row.theirs .chat-avatar-btn{
  margin-right:0 !important;
  transform:translateY(-1px) !important;
}
.chat-message-row.mine .chat-avatar-btn{
  margin-left:0 !important;
  transform:translateY(-1px) !important;
}

/* v2.9: canonical official popup geometry */
.official-map-overlay{
  z-index:210 !important;
  transform:translate3d(-50%, calc(-100% - 84px), 0) !important;
}
.official-map-balloon{
  width:144px !important;
  height:144px !important;
  max-width:144px !important;
  max-height:144px !important;
  padding:7px 6px 8px !important;
  animation:none !important;
  transform-origin:50% 100% !important;
}
.official-map-balloon::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-9px;
  width:16px;
  height:16px;
  background:#fff;
  border-right:1px solid rgba(0,122,255,.08);
  border-bottom:1px solid rgba(0,122,255,.08);
  transform:translateX(-50%) rotate(45deg);
}
@media (max-width:600px){
  .official-map-overlay{
    transform:translate3d(-50%, calc(-100% - 80px), 0) !important;
  }
  .official-map-balloon{
    width:132px !important;
    height:132px !important;
    max-width:132px !important;
    max-height:132px !important;
  }
}
.profileTripComposeBar{
  gap:12px;
  padding:2px 0 12px;
}
.profileTripComposeBar>div{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}
.profileTripComposeBar span{
  color:#7b8798;
  font-size:11px;
  line-height:1.4;
}
.profileTripComposeBar button{
  flex:0 0 auto;
  padding:9px 12px;
}
#profilePanel.show #profileContent,
#profilePanel.show .snsProfileTabs,
#profilePanel.show .snsProfileTabs button,
#profilePanel.show .snsProfilePane,
#profilePanel.show .snsProfilePane button{
  pointer-events:auto !important;
}
.official-pop-bounce .official-pop-card{
  animation:officialPopImageDoubleBounce .52s cubic-bezier(.2,1.2,.36,1) both !important;
  transform-origin:50% 100% !important;
}
.official-pop-bounce .official-pop-image-wrap,
.official-map-balloon .official-map-image{
  animation:officialPopImageDoubleBounce .5s cubic-bezier(.2,1.2,.36,1) both !important;
  transform-origin:50% 50% !important;
}

@keyframes officialMapSoftBounce{
  0%{opacity:0;transform:scale(.96);}
  72%{opacity:1;transform:scale(1.018);}
  100%{opacity:1;transform:scale(1);}
}
@keyframes officialPopImageBounce{
  0%{opacity:.88;transform:scale(.94);}
  68%{opacity:1;transform:scale(1.045);}
  100%{opacity:1;transform:scale(1);}
}
@keyframes officialPopImageDoubleBounce{
  0%{opacity:.88;transform:scale(.94);}
  36%{opacity:1;transform:scale(1.045);}
  55%{opacity:1;transform:scale(.985);}
  76%{opacity:1;transform:scale(1.025);}
  100%{opacity:1;transform:scale(1);}
}

/* triptalk v7 viewport stabilization: Android/Galaxy Chrome browser chrome height */
html,
body{
  height:var(--app-height, 100dvh) !important;
  min-height:var(--app-height, 100dvh) !important;
  max-height:var(--app-height, 100dvh) !important;
  overflow:hidden !important;
}

#map{
  top:156px !important;
  bottom:0 !important;
  height:calc(var(--app-height, 100dvh) - 156px) !important;
  max-height:calc(var(--app-height, 100dvh) - 156px) !important;
}

#bottomNav{
  bottom:calc(8px + env(safe-area-inset-bottom)) !important;
  max-height:64px !important;
  transform:translateX(-50%) translateZ(0) !important;
}

/* triptalk v7 usage guide stabilization: Galaxy Chrome intro popup */
.usage-guide{
  align-items:center !important;
  justify-content:center !important;
  height:var(--app-height, 100dvh) !important;
  min-height:var(--app-height, 100dvh) !important;
  padding:calc(10px + env(safe-area-inset-top)) 14px calc(10px + env(safe-area-inset-bottom)) !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}

.usage-guide-box{
  width:min(420px, 100%) !important;
  max-height:calc(var(--app-height, 100dvh) - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  min-height:0 !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  padding:16px !important;
  box-sizing:border-box !important;
}

.usage-guide-head{
  flex:0 0 auto !important;
  margin-bottom:10px !important;
}

.usage-guide-head strong{
  font-size:19px !important;
  line-height:1.15 !important;
}

.usage-guide-brand span{
  font-size:12px !important;
  line-height:1.3 !important;
}

.usage-guide-list{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
  overscroll-behavior:contain !important;
  padding-right:2px !important;
  gap:8px !important;
}

.usage-guide-list div{
  padding:10px 11px !important;
}

.usage-guide-check{
  flex:0 0 auto !important;
  margin:10px 0 10px !important;
}

#usageGuideClose{
  flex:0 0 auto !important;
  min-height:48px !important;
  padding:12px 16px !important;
}
.triptalk-map-marker-hit{
  --marker-hit-padding:2px;
  appearance:none;border:0;background:transparent;margin:0;
  padding:var(--marker-hit-padding);cursor:pointer;touch-action:manipulation;
}
.triptalk-map-marker-hit:focus-visible{outline:2px solid #007aff;outline-offset:1px;border-radius:12px}
.triptalk-map-marker-visual{position:relative;display:inline-flex;align-items:center;justify-content:center;filter:drop-shadow(0 2px 3px rgba(0,0,0,.24))}
.triptalk-map-marker-visual img{display:block;object-fit:contain}
.triptalk-map-marker-dot{width:18px;height:18px;border:4px solid #fff;border-radius:50%;background:var(--marker-color,#007aff)}
.triptalk-map-marker-label:not(.room-label){position:absolute;left:50%;top:100%;min-width:max-content;transform:translate(-50%,2px);padding:2px 6px;border-radius:8px;background:#fff;color:#111;font-size:12px;font-weight:800;line-height:1.3;box-shadow:0 1px 4px rgba(0,0,0,.18)}
.triptalk-map-marker-label.room-label{flex:none;transform:none}
.triptalk-map-marker-label.room-label{
  width:220px !important;height:80px !important;
  min-width:220px !important;max-width:220px !important;min-height:80px !important;
  padding:3px 31px 15px 47px !important;
  font-size:15px !important;line-height:19px !important;
  overflow:hidden !important;text-overflow:ellipsis !important;white-space:nowrap !important;
}
.triptalk-map-marker-label.room-label-long{padding-left:47px !important;padding-right:31px !important}
.triptalk-map-cluster{
  position:relative;display:flex;align-items:center;justify-content:center;
  min-width:46px;height:46px;padding:0 12px;box-sizing:border-box;
  border:3px solid #fff;border-radius:50%;
  background:linear-gradient(145deg,#ff684f,#ff334f);color:#fff;
  box-shadow:0 5px 14px rgba(23,42,75,.32);font-family:Arial,sans-serif;
}
.triptalk-map-cluster strong{font-size:18px;font-weight:950;line-height:1}
@media (max-width:600px){
  .triptalk-map-marker-label.room-label{
    width:230px !important;height:83px !important;
    min-width:230px !important;max-width:230px !important;min-height:83px !important;
    padding:3px 33px 16px 50px !important;font-size:15px !important;line-height:19px !important;
    overflow:hidden !important;text-overflow:ellipsis !important;white-space:nowrap !important;
  }
  .triptalk-map-marker-label.room-label-long{
    padding-left:50px !important;
    padding-right:33px !important;
  }
}
.myTripMapPicker{display:grid;gap:8px;padding:10px;border:1px solid rgba(60,60,67,.14);border-radius:12px;background:#f8fafc}
.myTripMapPickerHead{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px}
.myTripMapPickerHead button,.myTripStopTop [data-map-target]{border:0;border-radius:8px;padding:7px 9px;background:#007aff;color:#fff;font-size:11px;font-weight:800}
.myTripMapCanvas{width:100%;height:210px;border-radius:10px;overflow:hidden;background:#e5e7eb}
.myTripScheduleFields{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (max-width:480px){.myTripScheduleFields{grid-template-columns:1fr}}
.tripTalkLocationOverlay{position:fixed;inset:0;z-index:120000;display:flex;align-items:flex-end;justify-content:center;padding:14px;background:rgba(0,0,0,.45);box-sizing:border-box}
.tripTalkNavigationSheet,.tripTalkLocationPicker{width:min(520px,100%);border-radius:20px;background:#fff;box-shadow:0 14px 50px rgba(0,0,0,.28)}
.tripTalkNavigationSheet{display:grid;gap:10px;padding:20px}
.tripTalkNavigationSheet strong{font-size:18px}.tripTalkNavigationSheet span{color:#667085;font-size:13px}
.tripTalkNavigationSheet button,.tripTalkLocationPicker button{min-height:44px;border:0;border-radius:12px;background:#087cff;color:#fff;font-weight:800}
.tripTalkNavigationSheet button.secondary,.tripTalkLocationPicker button.secondary{background:#eef1f5;color:#344054}
.tripTalkLocationPicker{display:grid;gap:10px;max-height:min(760px,92vh);padding:14px;overflow:auto}
.tripTalkLocationPicker header{display:flex;align-items:center;justify-content:space-between}.tripTalkLocationPicker header strong{font-size:18px}
.tripTalkLocationPicker header button{width:40px;min-height:40px;background:#f1f2f4;color:#111;font-size:22px}
.tripTalkLocationSearch{display:grid;grid-template-columns:1fr 72px;gap:8px}.tripTalkLocationSearch input{min-width:0;height:44px;border:1px solid #d0d5dd;border-radius:12px;padding:0 12px;font-size:15px}
.tripTalkCurrentLocation{justify-self:start;padding:0 14px}.tripTalkPickerMap{height:min(380px,43vh);border-radius:14px;overflow:hidden;background:#e8edf3}
.tripTalkSelectedAddress{min-height:20px;margin:0;padding:2px 4px;color:#344054;font-size:13px}.tripTalkLocationPicker footer{display:grid;grid-template-columns:1fr 2fr;gap:8px}
.chat-location-card{display:grid;gap:6px;min-width:210px}.chat-location-card b{font-size:12px;color:#087cff}.chat-location-card strong{font-size:15px}.chat-location-card span{color:#667085;font-size:12px}.chat-location-card button{border:0;border-radius:10px;padding:9px 10px;background:#087cff;color:#fff;font-weight:800}
.chat-bubble.location-bubble{background:#fff!important;color:#172033!important;border:1px solid #d9e6e8!important;box-shadow:0 4px 14px rgba(23,32,51,.08)!important}
.chat-message-row.mine .chat-bubble.location-bubble{background:#f5fbfb!important;color:#172033!important}
.location-bubble .chat-location-card b{color:#147d85}
.location-bubble .chat-location-card strong{color:#172033}
.location-bubble .chat-location-card span{color:#667085}
.location-bubble .chat-location-card button{background:#16858d;color:#fff}

/* a10: 지도 오른쪽 빠른 실행 버튼은 흰 배경과 검은 아이콘으로 통일한다. */
#floatingBtns > button,
#floatingBtns #profileManageQuickBtn,
#floatingBtns #chatFilterBtn,
#floatingBtns #myLoc{
  position:relative;
  display:flex!important;
  align-items:center;
  justify-content:center;
  width:52px!important;
  height:52px!important;
  padding:0!important;
  border:1px solid rgba(17,24,39,.12)!important;
  border-radius:50%!important;
  background:#fff!important;
  color:#111!important;
  box-shadow:0 5px 14px rgba(15,23,42,.16)!important;
}
#floatingBtns #profileManageQuickBtn.has-unread{
  background:#ef3340!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.42),0 6px 16px rgba(239,51,64,.32)!important;
}
.floating-icon{
  display:block;
  width:25px;
  height:25px;
  background-position:center;
  background-repeat:no-repeat;
  background-size:contain;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.2));
}
.floating-bell{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9'/%3E%3Cpath d='M10 21h4'/%3E%3C/svg%3E");
}
.floating-filter{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2.25' stroke-linecap='round'%3E%3Cpath d='M4 6h16M7 12h10M10 18h4'/%3E%3C/svg%3E");
}
#floatingBtns #profileManageQuickBtn.has-unread .floating-bell{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9'/%3E%3Cpath d='M10 21h4'/%3E%3C/svg%3E");
}
.floating-notification-count{
  position:absolute;
  right:-3px;
  top:-4px;
  min-width:18px;
  height:18px;
  padding:0 4px;
  box-sizing:border-box;
  border:2px solid #fff;
  border-radius:999px;
  background:#fff;
  color:#d7192d;
  font-size:10px;
  font-weight:950;
  line-height:14px;
  text-align:center;
}
#floatingBtns #myLoc .my-location-pin::after{
  background:#111!important;
}

/* a9: 가이드 검색은 국가·도시를 같은 폭으로 두고 상세 조건을 다음 줄에 둔다. */
.commerce-guide-search-form{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.commerce-guide-search-form .commerce-wide{
  grid-column:1/-1;
}
@media (max-width:600px){
  .commerce-guide-search-form{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
.myTripInlineLocation,.myTripInlineSchedule{display:grid;gap:7px;padding:12px;border:1px solid #cfe0ff;border-radius:14px;background:#f6f9ff}.myTripInlineLocation b,.myTripInlineSchedule b{color:#087cff}.myTripInlineLocation span{color:#667085;font-size:12px}.myTripInlineLocation textarea,.myTripInlineSchedule textarea{width:100%;box-sizing:border-box;border:1px solid #d0d5dd;border-radius:10px;padding:9px;background:#fff}.myTripInlineLocation button{justify-self:start;border:0;border-radius:9px;padding:8px 10px;background:#087cff;color:#fff;font-weight:800}
.myTripDetailRoutePoint{display:grid;width:100%;gap:3px;margin:8px 0;padding:12px;border:1px solid #cfe0ff;border-radius:14px;background:#f6f9ff;text-align:left}.myTripDetailRoutePoint b,.myTripDetailRoutePoint em{color:#087cff}.myTripDetailRoutePoint span{color:#667085;font-size:12px}.myTripDetailSchedule{display:grid;gap:5px;margin:8px 0;padding:12px;border-radius:14px;background:#f7f7f9}.myTripDetailSchedule p{margin:0;white-space:pre-wrap}

/* 발자취는 채널 글쓰기처럼 하나의 이어진 본문으로 보이게 한다. */
.myTripComposeForm .boardBlockEditor{gap:0;min-height:360px;padding:14px 12px;border:1px solid rgba(60,60,67,.13);border-radius:14px;background:#fff}
.myTripComposeForm .boardEditorBlock{margin:0;padding:0;background:transparent}
.myTripComposeForm .boardEditorBlock.text textarea{display:block;min-height:54px;height:auto;margin:0;padding:8px 4px;border:0;border-radius:0;background:transparent;line-height:1.7;resize:none;overflow:hidden}
.myTripComposeForm .boardEditorBlock.image{padding:8px 0}.myTripComposeForm .boardEditorBlock.image>img{border-radius:4px;background:transparent}
.myTripComposeForm .boardEditorBlock.image>img,.myTripDetailContent img,.myTripDetailMedia img{display:block;width:100%;max-width:100%;height:auto;max-height:520px;object-fit:contain;box-sizing:border-box}
.myTripEditorToolbar{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px!important}
.myTripEditorToolbar button{min-width:0!important;padding:0 3px!important;font-size:10px!important;white-space:nowrap}
.myTripToolbarHint{display:block;margin-top:6px;color:#667085;font-size:11px}
.snsProfilePublicActions{grid-template-columns:repeat(3,minmax(0,1fr))}
.myTripComposeForm .myTripInlineLocation{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:5px 9px;margin:6px 0;padding:10px 4px;border:0;border-top:1px solid rgba(60,60,67,.1);border-bottom:1px solid rgba(60,60,67,.1);border-radius:0;background:#fff}
.myTripComposeForm .myTripInlineLocation b{grid-row:1/3;width:48px;color:#087cff}.myTripComposeForm .myTripInlineLocation strong{min-width:0}.myTripComposeForm .myTripInlineLocation span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.myTripComposeForm .myTripInlineLocation textarea{grid-column:2/4;min-height:42px;padding:6px 0;border:0;border-radius:0;background:transparent;resize:none}.myTripComposeForm .myTripInlineLocation button{grid-column:3;grid-row:1/3;padding:6px 8px;background:transparent;color:#087cff}
.myTripComposeForm .myTripInlineSchedule{margin:6px 0;padding:10px 4px;border:0;border-top:1px solid rgba(60,60,67,.1);border-bottom:1px solid rgba(60,60,67,.1);border-radius:0;background:#fff}.myTripComposeForm .myTripInlineSchedule input,.myTripComposeForm .myTripInlineSchedule textarea{border:0!important;border-radius:0!important;background:transparent!important;padding:6px 0!important}
.myTripComposeForm .boardEditorControls{display:flex;justify-content:flex-end;gap:4px;margin:-2px 0 4px;opacity:.58}.myTripComposeForm .boardEditorControls button{min-width:28px;min-height:26px;padding:2px 7px;border:0;background:transparent;color:#667085}.myTripComposeForm .boardEditorControls button.danger{color:#d92d20}
/* triptalk.a1 course builder */
.commerce-card .commerce-card-actions{
  grid-column:1 / -1 !important;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:7px !important;
  width:100% !important;
}
.commerce-card .commerce-card-actions>a,
.commerce-card .commerce-card-actions>button{
  box-sizing:border-box;
  min-width:0 !important;
  width:100% !important;
  padding-left:4px !important;
  padding-right:4px !important;
  white-space:nowrap;
}
.commerce-card-actions .course-save-button{
  order:99;
  border-color:#087cff !important;
  background:#087cff !important;
  color:#fff !important;
}
.commerce-card-actions .course-save-button.saved{
  border-color:#15945b !important;
  background:#15945b !important;
}
#courseRoot{padding:2px 2px 18px}
.schedule-builder{display:grid;gap:11px;margin:2px 0 12px;padding:15px;border:1px solid #dce6f2;border-radius:18px;background:#fff}.schedule-builder-title{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.schedule-builder-title>div{display:grid;gap:3px}.schedule-builder-title b{font-size:18px}.schedule-builder-title span,.schedule-builder>small{color:#6f7c8e;font-size:12px;line-height:1.45}.schedule-builder-title em{flex:none;padding:5px 8px;border-radius:999px;background:#fff4c2;color:#785800;font-size:10px;font-style:normal;font-weight:950}.schedule-builder label{display:grid;gap:5px;color:#334155;font-size:12px;font-weight:900}.schedule-builder input{min-width:0;border:1px solid #d7e0eb;border-radius:11px;padding:10px 11px;background:#fff;color:#111;font:inherit}.schedule-date-row{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:7px}.schedule-place-add{width:100%;min-height:44px;border:0;border-radius:12px;background:#111;color:#fff;font-weight:950}.schedule-complete-button{width:100%;min-height:46px;margin-top:9px;border:0;border-radius:13px;background:#19a463;color:#fff;font-weight:950}.schedule-footprint-cta{display:grid;gap:6px;margin-top:11px;padding:15px;border:1px solid #a7e3c1;border-radius:16px;background:#effcf4}.schedule-footprint-cta strong{font-size:16px;color:#126c38}.schedule-footprint-cta span{color:#567061;font-size:12px}.schedule-footprint-cta button{min-height:43px;margin-top:4px;border:0;border-radius:11px;background:#19a463;color:#fff;font-weight:950}@media(max-width:520px){.schedule-date-row{grid-template-columns:1fr 1fr}.schedule-date-row label:first-child{grid-column:1/-1}}
.course-empty{display:flex;min-height:310px;align-items:center;justify-content:center;flex-direction:column;text-align:center;color:#64748b}
.course-empty>span{font-size:46px}.course-empty strong{margin-top:14px;color:#111;font-size:19px}.course-empty p{font-size:13px;line-height:1.65}.course-empty b{color:#087cff}
.course-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:10px 4px 16px;border-bottom:1px solid #e8ebef}
.course-head div{display:grid;gap:3px}.course-head span{color:#087cff;font-size:11px;font-weight:900}.course-head strong{font-size:20px}.course-head small{color:#748094}
.course-head button,.course-new-button,.course-navigation-button{border:0;border-radius:11px;padding:10px 12px;background:#eaf3ff;color:#0873df;font-weight:900}
.course-route{padding:12px 0}
.course-stop{position:relative;display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 4px}
.course-stop:not(:last-child):after{content:"";position:absolute;left:19px;top:42px;bottom:-8px;width:2px;background:#bed9ff}
.course-stop>b{display:flex;z-index:1;width:30px;height:30px;align-items:center;justify-content:center;border-radius:50%;background:#087cff;color:#fff}
.course-stop>div:nth-child(2){display:grid;gap:3px;min-width:0}.course-stop strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.course-stop span{color:#7a8493;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.course-stop-actions{display:flex;gap:4px}.course-stop-actions button{border:0;border-radius:8px;padding:7px;background:#f0f2f5;color:#4b5563;font-size:11px;font-weight:800}.course-stop-actions button:disabled{opacity:.3}
.course-navigation-button{width:100%;margin-top:6px;background:#087cff;color:#fff;padding:13px}
.course-new-button{width:100%;margin-top:8px;background:#111;color:#fff;padding:13px}
.course-saved-list{margin:14px 0 0;padding:14px;border:1px solid #e3e8ef;border-radius:18px;background:#fff}
.course-saved-toggle{width:100%;min-height:42px;border:0;border-radius:12px;background:#eef5ff;color:#0873df;font-weight:950}.course-saved-content{margin-top:9px}.course-saved-content.hide{display:none}
.course-save-state{display:inline-flex;margin-left:6px;padding:3px 7px;border-radius:999px;font-size:10px;font-style:normal;font-weight:950}.course-save-state.saved{background:#e8f8ee;color:#16813c}.course-save-state.changed{background:#fff4d6;color:#9a6500}
.course-added-notice{position:fixed;left:50%;bottom:calc(86px + env(safe-area-inset-bottom));z-index:10060;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 28px);padding:11px 12px 11px 15px;border-radius:16px;background:#111827;color:#fff;box-shadow:0 12px 30px rgba(15,23,42,.3);transform:translateX(-50%);font-size:13px;font-weight:850}.course-added-notice span{white-space:nowrap}.course-added-notice button{flex:none;border:0;border-radius:11px;padding:8px 10px;background:#ffe100;color:#111;font-size:12px;font-weight:950}
.course-saved-list>strong{display:block;margin-bottom:9px;font-size:15px}
.course-saved-list>p{margin:0;color:#758195;font-size:13px}
.course-saved-list article{display:flex;gap:8px;align-items:stretch;padding:8px 0;border-top:1px solid #edf0f4}
.course-saved-list article:first-of-type{border-top:0}
.course-saved-list article>button:first-child{display:flex;flex:1;min-width:0;flex-direction:column;align-items:flex-start;gap:3px;padding:9px 11px;border:0;border-radius:12px;background:#f5f8fc;color:#111;text-align:left}
.course-saved-list article>button:first-child span{color:#718096;font-size:12px}
.course-saved-list [data-course-delete]{padding:0 13px;border:0;border-radius:12px;background:#fff1f1;color:#d72f3f;font-weight:800}
.course-source{display:flex;flex-direction:column;gap:3px;margin:10px 0;padding:12px 14px;border:1px solid #cfe2ff;border-radius:14px;background:#f3f8ff;color:#075fb8}
.course-source span{font-size:12px;color:#60738c}
.course-route-group{display:flex;align-items:center;justify-content:space-between;margin:13px 0 6px;padding:7px 10px;border-radius:10px;background:#edf5ff;color:#0876e8;font-size:12px}
.course-follow-complete,.course-follow-rate{width:100%;min-height:46px;margin-top:9px;border:0;border-radius:13px;background:#19a463;color:#fff;font-weight:900}
.footprintReviewModal{position:fixed;inset:0;z-index:100080;display:flex;align-items:flex-end;justify-content:center;background:rgba(15,23,42,.48)}
.footprintReviewBox{display:grid;gap:13px;width:min(520px,100%);max-height:92vh;overflow:auto;padding:18px 18px calc(18px + env(safe-area-inset-bottom));border-radius:22px 22px 0 0;background:#fff}
.footprintReviewBox header{display:flex;align-items:center;justify-content:space-between}
.footprintReviewBox header strong{font-size:18px}.footprintReviewBox header button{width:36px;height:36px;border:0;border-radius:50%;background:#f1f5f9}
.footprintReviewBox>p{margin:0;color:#64748b;font-size:13px;line-height:1.5}
.footprintReviewBox fieldset{margin:0;padding:12px;border:1px solid #e2e8f0;border-radius:14px}.footprintReviewBox legend{padding:0 5px;font-weight:900}
.footprintReviewStars{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.footprintReviewStars input{position:absolute;opacity:0}.footprintReviewStars span{display:grid;place-items:center;min-height:58px;border-radius:10px;background:#f1f5f9;color:#cbd5e1;font-weight:900}.footprintReviewStars input:checked+span{background:#ffe100;color:#111}.singleFootMark{display:inline-block;width:27px;height:42px;color:#cbd5e1;transform:rotate(-4deg);overflow:visible}.singleFootMark .footSole,.singleFootMark circle{fill:currentColor}.singleFootMark.active{color:#111}.footprintReviewCard .singleFootMark{width:13px;height:21px;margin-left:2px}
.footprintRecommend{display:flex!important;align-items:center;gap:9px!important}.footprintRecommend input{width:21px;height:21px;accent-color:#19a463}
.footprintReviewBox label{display:grid;gap:7px;font-size:13px;font-weight:900}.footprintReviewBox textarea{resize:vertical;border:1px solid #dbe3ee;border-radius:12px;padding:11px;font:inherit}
.footprintReviewPhoto input{padding:9px;border:1px solid #e2e8f0;border-radius:11px}.footprintReviewPhoto span{color:#64748b;font-size:11px;font-weight:600}
.footprintReviewPreview{width:100%;max-height:220px;object-fit:cover;border-radius:14px;background:#f1f5f9}
.footprintReviewImageRemove{width:100%;margin-top:8px;border:1px solid #d7dde5;background:#fff;color:#374151;border-radius:10px;padding:10px;font-weight:700}
.footprintReviewActions{display:flex;gap:8px}.footprintReviewActions button{flex:1;min-height:44px;border:0;border-radius:12px;background:#1677e8;color:#fff;font-weight:900}.footprintReviewActions button.danger{background:#fee2e2;color:#dc2626}
.footprintReviewList{display:grid;gap:9px;margin-top:16px;padding-top:14px;border-top:1px solid #e2e8f0}.footprintReviewCard{display:grid;gap:7px;padding:12px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}.footprintReviewCard>div{display:flex;justify-content:space-between;gap:8px}.footprintReviewCard span{color:#d97706;font-size:12px}.footprintReviewCard p{margin:0!important;color:#475569!important;font-size:13px!important;line-height:1.5}.footprintReviewCard img{width:100%;max-height:220px;object-fit:cover;border-radius:11px}.footprintReviewEmpty,.footprintReviewLoading{margin:0!important;color:#64748b!important;font-size:12px!important}
.tripTalkRouteGroups section{display:grid;gap:7px;padding:11px;border:1px solid #e0e6ee;border-radius:14px;background:#f8fafc}
.tripTalkRouteGroups section small{color:#667085;line-height:1.4}
.tripTalkRouteGroups section div{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:6px}
.tripTalkRouteGroups section button{min-height:40px;padding:5px;font-size:12px}
.aiPlannerStart{display:grid;gap:12px;padding:4px}.aiPlannerStart>strong{font-size:20px}.aiPlannerStart>p{margin:0 0 4px;color:#64748b}.aiPlannerStart>button{display:grid;gap:5px;text-align:left;padding:18px;border:1px solid #dbe5f2;border-radius:16px;background:#fff;color:#111827}.aiPlannerStart>button:first-of-type{border-color:#9dcbff;background:#eff7ff}.aiPlannerStart>button b{font-size:16px}.aiPlannerStart>button span{font-size:12px;color:#64748b}
.aiPlannerModeTabs{position:sticky;top:0;z-index:3;display:grid;grid-template-columns:1fr 1fr;gap:0;width:100%;padding:3px;border-radius:13px;background:#edf1f6;box-sizing:border-box}.aiPlannerModeTabs button{min-height:42px;border:0;border-radius:10px;background:transparent;color:#64748b;font-size:14px;font-weight:900}.aiPlannerModeTabs button.active{background:#1677e8;color:#fff;box-shadow:0 2px 8px rgba(22,119,232,.22)}.aiPlannerModeDescription{grid-column:1/-1;margin:0;padding:0 3px;color:#64748b;font-size:14px;line-height:1.55}
.aiPlannerForm{display:grid;gap:12px}.aiPlannerBack{justify-self:start;border:0;background:transparent;color:#1677e8;font-weight:800}.aiPlannerForm h3{margin:0}.aiPlannerFields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.aiPlannerFields label{display:grid;gap:6px;font-size:12px;font-weight:800}.aiPlannerFields input,.aiPlannerFields select{min-width:0;padding:12px;border:1px solid #dbe3ee;border-radius:12px;background:#fff;font:inherit}.aiPlannerFields small{font-size:10px;color:#64748b}.aiOriginCheck{display:flex!important;align-items:center;gap:8px;min-height:44px;padding:10px;border-radius:12px;background:#f1f5f9}.aiOriginCheck input{width:20px;height:20px}.aiPlannerSubmit{min-height:48px;border:0;border-radius:14px;background:#1677e8;color:#fff;font-weight:900}
.aiOptionList{display:grid;gap:10px;margin-top:14px}.aiOptionList h3{margin:0 0 4px}.aiOptionCard>button{display:grid;width:100%;gap:7px;text-align:left;padding:15px;border:1px solid #dbe5f2;border-radius:15px;background:#fff}.aiOptionCard span{color:#1677e8;font-size:11px;font-weight:900}.aiOptionCard strong{font-size:16px}.aiOptionCard p{margin:0;color:#475569;line-height:1.45}.aiOptionCard small{color:#64748b}.aiPlanCautions{margin-top:12px;padding:12px;border-radius:13px;background:#f8fafc;color:#64748b;font-size:12px}.aiPlanCautions summary{cursor:pointer;font-weight:900;color:#334155}
.aiPlanDetail{display:grid;gap:12px}.aiPlanDetail>h3{margin:0}.aiPlanDetail>p{margin:0;color:#475569;line-height:1.5}.aiBudgetCards{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.aiBudgetCards span{display:flex;justify-content:space-between;padding:9px;border-radius:10px;background:#eef6ff;font-size:11px}.aiDayCard{display:grid;gap:9px}.aiDayCard>h4{margin:5px 0 0;padding:9px 11px;border-radius:10px;background:#172033;color:#fff}.aiStopCard{display:grid;gap:9px;padding:12px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}.aiStopCard>div:first-child{display:grid;gap:5px}.aiStopCard time{color:#1677e8;font-weight:900}.aiStopCard p{margin:0;color:#475569;line-height:1.45}.aiStopCard small{color:#64748b}.aiStopActions{display:flex;flex-wrap:wrap;gap:6px}.aiStopActions button,.aiStopActions a{padding:8px 10px;border:1px solid #cfe0f5;border-radius:9px;background:#f7fbff;color:#1267ba;text-decoration:none;font-size:11px;font-weight:800}.aiDayTip{margin:0;padding:9px;border-radius:9px;background:#fff7dc;color:#8a5b00;font-size:12px}.aiPlanRealActions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.aiPlanRealActions button{min-height:46px;border:0;border-radius:12px;background:#1677e8;color:#fff;font-weight:900}.aiPlanRealActions button+button{background:#eaf3ff;color:#1267ba}
.aiGuideSection{display:grid;gap:9px;margin-top:15px}.aiGuideSection h3{margin:0}.aiGuideSection article{display:grid;gap:5px;padding:12px;border:1px solid #e2e8f0;border-radius:13px}.aiGuideSection article>b{justify-self:start;padding:3px 7px;border-radius:999px;background:#fff3cd;color:#9a6700;font-size:10px}.aiGuideSection article span,.aiGuideSection article p{color:#64748b;font-size:12px}.aiGuideSection article p{margin:0}.aiGuideSection article a{color:#1677e8;font-weight:800}.aiGuideSection article button{justify-self:start;padding:8px 11px;border:0;border-radius:9px;background:#eaf3ff;color:#1267ba;font-weight:800}.aiGuideNotice{margin:0;padding:11px;border-radius:11px;background:#fff7ed;color:#9a4b12;font-size:11px;line-height:1.5}
@media(max-width:760px){.ai-panel #sheetContent{padding-left:14px;padding-right:14px;padding-bottom:120px}.aiPlannerForm{gap:10px}.aiPlannerModeTabs button{min-height:38px;font-size:13px}.aiPlannerModeDescription{font-size:13px;line-height:1.45}.aiPlannerFields{grid-template-columns:1fr;gap:9px}.aiPlannerFields label{gap:4px;font-size:13px}.aiPlannerFields input,.aiPlannerFields select{width:100%;min-height:42px;padding:9px 11px;font-size:16px;box-sizing:border-box}.aiPlannerFields small{font-size:11px}.aiOriginCheck{min-height:40px;padding:7px 10px;box-sizing:border-box}.aiOriginCheck input{width:18px;height:18px}.aiPlannerSubmit{position:static;min-height:42px;border-radius:12px;font-size:14px;box-shadow:none}.aiBudgetCards{grid-template-columns:1fr}.aiPlanRealActions{grid-template-columns:1fr}.plannerResult{font-size:14px}}

/* a28: lower sheets open compact, expand by handle, and keep their own scrolling. */
#bottomSheet,
#categorySheet{
  --sheet-compact-height:min(54dvh, 560px);
  --sheet-expanded-height:calc(100dvh - max(12px, env(safe-area-inset-top)));
  height:var(--sheet-compact-height) !important;
  max-height:var(--sheet-expanded-height) !important;
  transition:height .24s ease, transform .22s ease !important;
  will-change:height, transform;
}
#bottomSheet.sheet-expanded,
#categorySheet.sheet-expanded{
  height:var(--sheet-expanded-height) !important;
}
#bottomSheet.sheet-dragging,
#categorySheet.sheet-dragging{
  transition:none !important;
}
.catWrap button:first-child,
.catWrap button:first-child.active{
  color:#ff3b30 !important;
}

/* a27 room discovery search and filters */
.room-search-results{
  display:none;position:fixed;left:12px;right:12px;top:126px;z-index:120;
  max-height:min(62vh,560px);overflow:hidden;border:1px solid #e4e8ee;border-radius:18px;
  background:rgba(255,255,255,.98);box-shadow:0 16px 42px rgba(15,23,42,.2);
}
.room-search-results.show{display:flex;flex-direction:column}
.room-search-header{display:flex;align-items:center;justify-content:space-between;padding:13px 14px 8px}
.room-search-header>div{display:flex;align-items:baseline;gap:8px}.room-search-header strong{font-size:17px}.room-search-header span{color:#64748b;font-size:12px}
.room-search-header>button{width:34px;height:34px;border:0;border-radius:50%;background:#f1f5f9;font-size:21px}
.room-search-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:0 12px 10px}
.room-search-tabs button{min-height:38px;border:0;border-radius:10px;background:#f1f5f9;color:#64748b;font-weight:900}
.room-search-tabs button.active{background:#1677e8;color:#fff}
.room-search-list{display:grid;gap:7px;overflow:auto;padding:0 12px 14px}
.room-search-row{display:flex;align-items:center;gap:9px;width:100%;padding:11px;border:1px solid #e5eaf0;border-radius:13px;background:#fff;text-align:left}
.room-search-kind{flex:0 0 auto;padding:5px 7px;border-radius:999px;font-size:10px;font-weight:900}
.room-search-kind.official{background:#fff1e7;color:#d55a08}.room-search-kind.regular{background:#eaf3ff;color:#1267ba}
.room-search-copy{display:grid;min-width:0;flex:1;gap:4px}.room-search-copy strong,.room-search-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.room-search-copy strong{font-size:14px}.room-search-copy small{color:#64748b;font-size:11px}.room-search-arrow{color:#94a3b8;font-size:24px}
.room-search-empty{padding:28px 12px;text-align:center;color:#64748b;font-size:13px}

#chatFilterPanel{width:min(390px,calc(100vw - 24px));max-height:min(78vh,620px);overflow:auto}
.chat-filter-block{display:grid;gap:7px;margin-top:12px}.chat-filter-block>strong,.chat-filter-block>label,.chat-filter-grid label{color:#334155;font-size:12px;font-weight:900}
.chat-filter-block input,.chat-filter-grid select{width:100%;min-height:42px;box-sizing:border-box;border:1px solid #dbe3ee;border-radius:11px;background:#fff;padding:9px 11px;font-size:14px}
.chat-filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}.chat-filter-grid label{display:grid;gap:7px}
.chat-filter-actions{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:14px}
.chat-filter-actions button{min-height:43px;border:0;border-radius:11px;font-weight:900}
#chatFilterApplyBtn{background:#1677e8;color:#fff}#chatFilterResetBtn{padding:0 15px;background:#f1f5f9;color:#475569}

/* 시·도 이상 축소 단계에서는 개별 말풍선 글자를 감추고 클러스터를 우선한다. */
body.map-province-view .triptalk-map-marker-label.room-label,
body.map-province-view .triptalk-map-marker-label.room-label-open,
body.map-province-view .triptalk-map-marker-label.room-label-private,
body.map-province-view .triptalk-map-marker-label.room-label-official{
  width:18px!important;min-width:18px!important;max-width:18px!important;height:18px!important;min-height:18px!important;
  padding:0!important;border:3px solid #fff!important;border-radius:50%!important;background:var(--room-accent,#2878d8)!important;
  color:transparent!important;font-size:0!important;overflow:visible!important;box-shadow:0 2px 7px rgba(15,23,42,.32)!important;
}
body.map-province-view .triptalk-map-marker-label.room-label::before,
body.map-province-view .triptalk-map-marker-label.room-label::after,
body.map-province-view .triptalk-map-marker-label.room-label-open::before,
body.map-province-view .triptalk-map-marker-label.room-label-open::after,
body.map-province-view .triptalk-map-marker-label.room-label-private::before,
body.map-province-view .triptalk-map-marker-label.room-label-private::after,
body.map-province-view .triptalk-map-marker-label.room-label-official::before,
body.map-province-view .triptalk-map-marker-label.room-label-official::after{display:none!important}
body.map-regional-view .triptalk-map-marker-label.room-label{max-width:98px!important;font-size:11px!important}

@media(max-width:600px){
  .room-search-results{left:8px;right:8px;top:122px;max-height:66vh;border-radius:16px}
  #chatFilterPanel{left:12px!important;right:12px!important;width:auto!important}
}

/* a29: AI 선택은 모바일에서도 한 줄에 정확히 반반 배치합니다. */
.aiPlannerModeTabs{
  display:flex!important;
  flex-direction:row!important;
  align-items:stretch!important;
  flex-wrap:nowrap!important;
  grid-template-columns:none!important;
}
.aiPlannerModeTabs>button{
  flex:1 1 50%!important;
  width:50%!important;
  min-width:0!important;
  margin:0!important;
}

/* a29: 줌 11까지 말풍선 원형을 유지하고, 다음 축소 단계부터 숫자로 표시합니다. */
body.map-cluster-view .triptalk-map-marker-label.room-label,
body.map-cluster-view .triptalk-map-marker-label.room-label-open,
body.map-cluster-view .triptalk-map-marker-label.room-label-private,
body.map-cluster-view .triptalk-map-marker-label.room-label-official{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  width:46px!important;
  min-width:46px!important;
  max-width:46px!important;
  height:46px!important;
  min-height:46px!important;
  padding:0!important;
  border:4px solid #fff!important;
  border-radius:50%!important;
  background:#ff5252!important;
  color:transparent!important;
  font-size:0!important;
  line-height:1!important;
  overflow:visible!important;
  box-shadow:0 4px 12px rgba(15,23,42,.28)!important;
}
body.map-cluster-view .triptalk-map-marker-label.room-label::before,
body.map-cluster-view .triptalk-map-marker-label.room-label-open::before,
body.map-cluster-view .triptalk-map-marker-label.room-label-private::before,
body.map-cluster-view .triptalk-map-marker-label.room-label-official::before{
  content:"1"!important;
  display:grid!important;
  place-items:center!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#fff!important;
  font-size:18px!important;
  font-weight:900!important;
  line-height:1!important;
  text-align:center!important;
  filter:none!important;
  opacity:1!important;
  z-index:1!important;
  transform:none!important;
}
body.map-cluster-view .triptalk-map-marker-label.room-label::after,
body.map-cluster-view .triptalk-map-marker-label.room-label-open::after,
body.map-cluster-view .triptalk-map-marker-label.room-label-private::after,
body.map-cluster-view .triptalk-map-marker-label.room-label-official::after{
  display:none!important;
}

/* a29: 상세 카드는 같은 좌표의 말풍선 바로 위에 붙여 함께 이동합니다. */
.official-map-overlay{
  transform:translate3d(-50%, calc(-100% - 66px), 0)!important;
}
@media(max-width:600px){
  .official-map-overlay{
    transform:translate3d(-50%, calc(-100% - 68px), 0)!important;
  }
}

/* a31: 관리자 트래픽 사용자는 읽기 쉬운 카드와 축약 UID로 표시합니다. */
#policyBody.adminTrafficList{display:grid;gap:5px}
#policyBody.adminTrafficList>p{margin:0}
.adminTrafficUser{display:grid;gap:3px;padding:6px 8px;border:1px solid #e2e8f0;border-radius:9px;background:#f8fafc}
.adminTrafficUserHead,.adminTrafficUserMeta{display:flex;align-items:center;gap:6px;min-width:0}
.adminTrafficUserHead strong{min-width:0;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.adminTrafficUserHead span{flex:0 0 auto;padding:2px 5px;border-radius:999px;background:#eaf3ff;color:#1267ba;font-size:8px;font-weight:900}
.adminTrafficUserHead time{flex:0 0 auto;color:#64748b;font-size:9px}
.adminTrafficUserMeta p{min-width:0;flex:1 1 auto;margin:0!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#475569!important;font-size:10px!important}
.adminTrafficUserMeta button{flex:0 0 auto;min-height:25px;padding:3px 6px;border:1px solid #cfe0f5;border-radius:7px;background:#fff;color:#1267ba;font-size:8px;font-weight:900}

/* a31: 설정의 약관 메뉴는 각 원문으로 바로 이동합니다. */
#policyBody.legalPolicyMenu{display:grid;gap:8px}
#policyBody.legalPolicyMenu .legalPolicyNotice{margin:0 0 4px;padding:10px 11px;border-radius:11px;background:#fff8db;color:#8a6100;font-size:12px;line-height:1.4}
#policyBody.legalPolicyMenu>a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 10px;padding:12px;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc;color:#172033;text-decoration:none}
#policyBody.legalPolicyMenu>a strong{font-size:14px}
#policyBody.legalPolicyMenu>a span{grid-column:1;color:#64748b;font-size:11px;line-height:1.35}
#policyBody.legalPolicyMenu>a em{grid-column:2;grid-row:1/3;align-self:center;color:#1267ba;font-size:11px;font-style:normal;font-weight:900}

/* a31: 내 발자취는 한 줄 4개의 작은 사진 썸네일로 표시합니다. */
#profileSnsTripGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:2px}
#profileSnsTripGrid>button{border-radius:8px}

.room-zoom-guide{position:fixed;left:50%;bottom:calc(92px + env(safe-area-inset-bottom));z-index:12020;display:flex;align-items:center;gap:12px;width:min(430px,calc(100% - 28px));padding:13px 14px;border:1px solid #dce3ec;border-radius:15px;background:#fff;color:#303640;box-shadow:0 12px 34px rgba(0,0,0,.2);transform:translateX(-50%);text-align:left;font:inherit}
.room-zoom-guide span{flex:1;font-size:13px;line-height:1.45}
.room-zoom-guide b{flex:0 0 auto;color:#e24a4a;font-size:12px}
#profileSnsTripGrid>button>b,#profileSnsTripGrid>button>em{display:none}
#profileSnsTripGrid .snsTripVisibility{top:3px;right:3px;padding:2px 4px;font-size:7px}
@media(max-width:520px){#profileSnsTripGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:2px}}