*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Noto Sans KR', -apple-system, sans-serif;
  background: #eef0f3;
  color: #333;
  font-size: 13px;
  line-height: 1.5;
}
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
button { cursor: pointer; font-family: inherit; }
.hidden { display: none !important; }


:root {
  --sidebar-w: 210px;
  --topnav-h: 50px;
  --primary: #1a73e8;
  --primary-dark: #1557b0;
  --sidebar-bg: #1e2130;
  --sidebar-hover: rgba(255,255,255,0.07);
  --sidebar-text: rgba(255,255,255,0.78);
  --card-shadow: 0 1px 4px rgba(0,0,0,0.08);
  --radius: 6px;
  --border: #e0e0e0;
}


#sidebar {
  position: fixed; top:0; left:0;
  width: var(--sidebar-w);
  height: 100vh;
  background: var(--sidebar-bg);
  overflow-y: auto; overflow-x: hidden;
  z-index: 1100;
  display: flex; flex-direction: column;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.1) transparent;
}
#sidebar::-webkit-scrollbar { width: 3px; }
#sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); }

#topNav {
  position: fixed; top:0; left: var(--sidebar-w); right:0;
  height: var(--topnav-h);
  background: #fff;
  border-bottom: 1px solid var(--border);
  display: flex; align-items: center;
  padding: 0 12px; gap: 0;
  z-index: 1000;
  box-shadow: 0 1px 3px rgba(0,0,0,0.07);
}

#mainContent {
  margin-left: var(--sidebar-w);
  margin-top: var(--topnav-h);
  padding: 14px 16px;
  min-height: calc(100vh - var(--topnav-h));
}

#overlay {
  display: none; position: fixed; inset:0;
  background: rgba(0,0,0,.45); z-index: 1050;
}


.sidebar-logo {
  padding: 12px 16px;
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.sidebar-logo a { display:flex; align-items:center; justify-content:center; }


.user-panel {
  display: flex; flex-direction: column; align-items: center;
  padding: 20px 14px 16px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  gap: 8px;
}
.up-avatar-wrap { position: relative; }
.up-avatar-wrap img {
  width: 68px; height: 68px; border-radius: 50%;
  border: 2px solid rgba(255,215,0,.45);
  box-shadow: 0 0 0 4px rgba(255,215,0,.08);
  object-fit: cover; display: block;
}
.up-nick {
  font-size: 14px; font-weight: 700; color: #fff;
  max-width: 180px; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; text-align: center;
}
.rank-display { display: flex; justify-content: center; }
.up-guest-row { display: flex; gap: 6px; width: 100%; }
.up-guest-row a {
  flex: 1; text-align: center; padding: 8px 0;
  border-radius: 8px; font-size: 12px; font-weight: 600;
  text-decoration: none; transition: background .15s, transform .12s;
}
.up-guest-row a:hover { transform: translateY(-1px); }
.up-guest-row a:first-child {
  background: rgba(255,215,0,.14); color: #ffd700;
  border: 1px solid rgba(255,215,0,.3);
}
.up-guest-row a:first-child:hover { background: rgba(255,215,0,.24); }
.up-guest-row a:last-child {
  background: rgba(255,255,255,.07); color: rgba(255,255,255,.6);
  border: 1px solid rgba(255,255,255,.12);
}
.up-guest-row a:last-child:hover { background: rgba(255,255,255,.14); color: #fff; }

.up-action-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px; width: 100%; padding: 2px 0;
}
.up-btn {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 4px;
  padding: 10px 6px 9px;
  background: rgba(255,255,255,.06); border-radius: 10px;
  color: rgba(255,255,255,.68); font-size: 11px; font-weight: 500;
  text-decoration: none; transition: background .18s, color .18s, transform .13s;
  border: 1px solid rgba(255,255,255,.05);
}
.up-btn i { font-size: 15px; width: auto; text-align: center; }
.up-btn span { text-align: center; line-height: 1; }
.up-btn:hover { background: rgba(255,255,255,.13); color: #fff; transform: translateY(-1px); border-color: rgba(255,255,255,.1); }
.up-btn-logout { color: rgba(255,120,120,.75); }
.up-btn-logout:hover { background: rgba(255,60,60,.13); color: #ff9090; }
.up-icon-wrap { position: relative; display: inline-flex; flex-shrink: 0; }
.up-icon-wrap i { font-size: 15px; }
.up-icon-wrap em {
  position: absolute; top: -6px; right: -10px;
  background: #e53935; color: #fff; font-size: 9px; font-weight: 700;
  border-radius: 8px; padding: 1px 4px; font-style: normal;
  line-height: 1.2; pointer-events: none; white-space: nowrap;
}


.up-nick-row { display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; }
.up-lv-badge {
  background: rgba(0,188,212,.16); color: #00bcd4;
  border: 1px solid rgba(0,188,212,.3); border-radius: 10px;
  padding: 1px 7px; font-size: 10.5px; white-space: nowrap;
}
.up-lv-badge b { color: #00bcd4; font-size: 11.5px; }


.up-stats-bar {
  border-bottom: 1px solid rgba(255,255,255,.07);
  padding: 9px 14px;
}
.up-point-row { display: flex; flex-direction: column; gap: 5px; }
.up-point-item {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 12px; color: rgba(255,255,255,.65);
}
.up-point-label { display: flex; align-items: center; gap: 5px; }
.up-point-val { font-size: 12.5px; font-weight: 600; color: #ffd700; letter-spacing: 0.3px; }
.up-point-val b { color: inherit; }
.up-point-divider { height: 1px; background: rgba(255,255,255,.07); }


.sidebar-search {
  display: flex; gap: 5px; padding: 8px 10px;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.sidebar-search input {
  flex: 1; min-width: 0; padding: 7px 10px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px; color: #fff; font-size: 12px; outline: none;
  transition: border-color .2s, background .2s;
}
.sidebar-search input:focus {
  background: rgba(255,255,255,.11);
  border-color: rgba(255,255,255,.25);
}
.sidebar-search input::placeholder { color: rgba(255,255,255,.28); }
.sidebar-search button {
  flex-shrink: 0; width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  background: var(--primary);
  border: none; border-radius: 8px; color: #fff; font-size: 14px;
  cursor: pointer; transition: background .15s, transform .12s;
}
.sidebar-search button:hover { background: var(--primary-dark); transform: scale(1.05); }


.sidebar-nav { padding: 4px 0 20px; flex:1; }
.nav-group { margin-bottom: 0; }

.nav-group-title {
  display: flex; align-items: center; justify-content: space-between;
  padding: 9px 12px 9px 14px; font-size: 12px; font-weight: 600;
  color: rgba(255,255,255,.7); cursor: pointer;
  transition: background .15s, color .15s; user-select: none;
}
.nav-group-title span { display:flex; align-items:center; gap:7px; }
.nav-group-title:hover { background: var(--sidebar-hover); color: #fff; }
.arrow { font-size: 10px; transition: transform .22s; flex-shrink:0; opacity:.6; }
.nav-group-title.collapsed .arrow { transform: rotate(-90deg); }

.nav-submenu { overflow: hidden; max-height: 800px; transition: max-height .3s ease; }
.nav-submenu.closed { max-height: 0; }

.nav-submenu li a {
  display: flex; align-items: center; gap: 7px;
  padding: 6px 12px 6px 24px; font-size: 12px;
  color: rgba(255,255,255,.48); transition: background .12s, color .12s;
}
.nav-submenu li a:hover { background: rgba(255,255,255,.06); color: rgba(255,255,255,.85); }
.nav-submenu li a i { font-size: 10px; width:13px; text-align:center; opacity:.6; }


.nav-divider {
  display: flex; align-items: center; gap: 6px;
  padding: 8px 14px 4px;
  font-size: 10px; font-weight: 600;
  color: rgba(255,255,255,.28); letter-spacing: 1px;
  text-transform: uppercase; font-style: normal;
}
.nav-divider::before, .nav-divider::after {
  content: ''; flex: 1; height: 1px;
  background: rgba(255,255,255,.09);
}
.nav-divider::before { margin-right: 2px; }
.nav-divider::after { margin-left: 2px; }

.nav-single {
  display: flex; align-items: center; gap: 7px; padding: 9px 12px;
  font-size: 12.5px; font-weight: 600; color: var(--sidebar-text);
  transition: background .15s, color .15s;
}
.nav-single:hover { background: var(--sidebar-hover); color: #fff; }


#sidebarToggle {
  background: none; border: none; font-size: 23px; color: #555;
  padding: 8px 12px; border-radius: 6px; transition: background .2s; flex-shrink: 0;
  line-height: 1; min-width: 46px;
}
#sidebarToggle:hover { background: #f0f0f0; }
/* 햄버거는 FontAwesome(비동기 로드) 의존 제거 — 시스템 유니코드 ☰로 즉시 표시.
   id 셀렉터라 FA 규칙보다 우선 → 폰트 늦게 떠도 깜빡임/지연 없음. */
#sidebarToggle .fa-bars::before { content: "\2630"; font-family: inherit; font-weight: 700; }

.top-links { display: flex; gap: 0; flex:1; overflow: hidden; align-items: center; }
.top-links a {
  padding: 5px 10px; font-size: 13px; color: #444;
  white-space: nowrap; border-radius: 4px; transition: background .12s, color .12s;
  position: relative;
}
.top-links a:hover { background: #f0f4ff; color: var(--primary); }
.top-links > a.logo-link { padding: 4px 10px 4px 0; }


.top-links .has-drop { position: relative; }
.top-links .has-drop .dropdown {
  display: none; position: absolute; top: 100%; left: 0;
  background: #fff; border: 1px solid var(--border);
  border-radius: 6px; box-shadow: 0 4px 16px rgba(0,0,0,0.12);
  min-width: 130px; z-index: 2000; padding: 4px 0;
}
.top-links .has-drop:hover .dropdown { display: block; }
.top-links .dropdown a {
  display: block; padding: 8px 14px; font-size: 12.5px; color: #444;
  border-radius: 0; white-space: nowrap;
}
.top-links .dropdown a:hover { background: #f0f4ff; color: var(--primary); }

.top-right { display:flex; align-items:center; gap:6px; margin-left:auto; flex-shrink:0; }
.online-count { font-size: 11.5px; color: #666; white-space:nowrap; display:flex; align-items:center; gap:4px; }
.online-dot { color: #34a853; font-size: 8px; }
.top-btn {
  background: none; border: none; font-size: 14px; color: #666;
  padding: 5px 7px; border-radius: 4px; transition: background .15s;
}
.top-btn:hover { background: #f0f0f0; }

#topSearchBar {
  position: absolute; top:0; left:0; right:0; height: var(--topnav-h);
  background: #fff; display: flex; align-items: center;
  padding: 0 12px; gap: 7px; z-index: 10;
}
#topSearchBar input {
  flex:1; padding: 7px 10px; border: 1.5px solid var(--primary);
  border-radius: 5px; font-size: 13px; outline: none;
}
#topSearchBar button {
  padding: 7px 11px; background: var(--primary); color: #fff;
  border: none; border-radius: 5px; font-size: 13px;
}


.main-layout { display: flex; gap: 14px; align-items: flex-start; }
.main-col { flex:1; min-width:0; }
.right-sidebar { width: 220px; flex-shrink: 0; position: sticky; top: calc(var(--topnav-h) + 12px); }


.icon-menu-wrap {
  background: #fff; border-radius: var(--radius);
  padding: 10px 8px; margin-bottom: 12px;
  box-shadow: var(--card-shadow);
  border: 1px solid var(--border);
}
.icon-menu { display: flex; gap: 4px; flex-wrap: wrap; }
.icon-item {
  display: flex; flex-direction: column; align-items: center;
  gap: 4px; padding: 7px 8px; border-radius: 6px;
  min-width: 64px; transition: background .15s; cursor: pointer;
}
.icon-item:hover { background: #f0f4ff; }
.icon-box {
  width: 44px; height: 44px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; color: #fff;
}
.icon-box.blue   { background: linear-gradient(135deg,#1a73e8,#4fc3f7); }
.icon-box.red    { background: linear-gradient(135deg,#e53935,#ef9a9a); }
.icon-box.green  { background: linear-gradient(135deg,#00897b,#80cbc4); }
.icon-box.purple { background: linear-gradient(135deg,#7b1fa2,#ce93d8); }
.icon-box.pink   { background: linear-gradient(135deg,#c2185b,#f48fb1); }
.icon-box.orange { background: linear-gradient(135deg,#f57c00,#ffcc80); }
.icon-box.teal   { background: linear-gradient(135deg,#0097a7,#80deea); }
.icon-box.gold   { background: linear-gradient(135deg,#f9a825,#fff176); color:#333; }
.icon-box.dark   { background: linear-gradient(135deg,#37474f,#78909c); }
.icon-box.shop   { background: linear-gradient(135deg,#00897b,#26a69a); }
.icon-box.reserve { background: linear-gradient(135deg,#1565c0,#42a5f5); }
.icon-box.blue2  { background: linear-gradient(135deg,#0288d1,#81d4fa); }
.icon-box.red2   { background: linear-gradient(135deg,#d32f2f,#ef9a9a); }
.icon-box.green2 { background: linear-gradient(135deg,#388e3c,#a5d6a7); }

.icon-box.vn-svg {
  background: none !important;
  padding: 0;
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(15,23,42,0.12);
}
.icon-box.vn-svg > img { width: 100%; height: 100%; display: block; object-fit: cover; }
.icon-v2-img.vn-svg {
  background: none !important;
  box-shadow: 0 4px 12px rgba(15,23,42,0.18), 0 1px 3px rgba(0,0,0,0.08);
}
.icon-v2-img.vn-svg > img:first-child { object-fit: cover; }

.icon-item.vn-red-label > span,
.icon-item-v2.vn-red-label > span {
  color: #991b1b !important;
  font-weight: 800 !important;
  letter-spacing: -0.2px;
  text-shadow: 0 1px 0 rgba(255,255,255,0.5);
}

.icon-item.vn-black-label > span,
.icon-item-v2.vn-black-label > span {
  color: #18181b !important;
  font-weight: 800 !important;
  letter-spacing: -0.2px;
  text-shadow: 0 1px 0 rgba(255,255,255,0.5);
}
.icon-item span { font-size: 11px; color: #555; font-weight: 500; text-align:center; }


.icon-row {
  display: grid; grid-template-columns: repeat(4,1fr); gap:6px; padding:4px 0;
}
.icon-row + .icon-row { border-top:1px solid #f0f0f0; margin-top:4px; padding-top:8px; }
.icon-item-v2 {
  display:flex; flex-direction:column; align-items:center; gap:5px;
  text-decoration:none; padding:8px 3px; border-radius:12px;
  transition:background .15s,transform .12s; -webkit-tap-highlight-color:transparent;
}
.icon-item-v2:hover { background:#f4f6ff; }
.icon-item-v2:active { transform:scale(0.92); background:#ebebeb; }
.icon-v2-img {
  position:relative; width:62px; height:62px; border-radius:16px;
  overflow:hidden; background:#f0f0f0;
  box-shadow:0 3px 8px rgba(0,0,0,0.14),0 1px 3px rgba(0,0,0,0.08);
  flex-shrink:0;
}
.icon-v2-img > img:first-child { width:100%; height:100%; object-fit:cover; display:block; }
.icon-v2-css {
  display:flex; align-items:center; justify-content:center;
  font-size:26px; width:100%; height:100%;
}
.icon-v2-gold { background:linear-gradient(135deg,#f9a825,#ef6c00) !important; color:#fff !important; }
.icon-v2-trophy { background:linear-gradient(135deg,#37474f,#546e7a) !important; color:#ffd700 !important; }
.icon-v2-shop   { background:linear-gradient(135deg,#00897b,#26a69a) !important; color:#fff !important; }
.icon-v2-reserve { background:linear-gradient(135deg,#1565c0,#42a5f5) !important; color:#fff !important; }
.kakao-badge-v2 {
  position:absolute; bottom:-3px; right:-3px;
  width:22px; height:22px; object-fit:contain;
  filter:drop-shadow(0 1px 3px rgba(0,0,0,0.3));
}
.icon-item-v2 > span {
  font-size:10.5px; color:#333; font-weight:600;
  text-align:center; line-height:1.2; word-break:keep-all; max-width:66px;
}


.mobile-only { display:none; }
.mobile-nav-logo { display:none; }
.top-pts-badge {
  display:none; flex-direction:column; align-items:flex-start; gap:1px;
  font-size:11px; font-weight:700;
  background:#fff7e0; border:1.5px solid #ffe082; border-radius:14px;
  padding:4px 9px; text-decoration:none; flex-shrink:0;
}
.top-pts-badge i { font-size:9px; }
.top-pts-badge span { color:#e65100; }
.nav-pts-row { display:flex; align-items:center; gap:3px; white-space:nowrap; color:#e65100; }
.nav-pts-han2 { color:#b8860b; }
.nav-pts-han2 span { color:#b8860b; }


.infinite-sentinel { min-height:0; padding:8px; text-align:center; }
.load-more-btn {
  width:100%; padding:11px 0; border:1.5px solid #1a73e8;
  border-radius:8px; background:#fff; color:#1a73e8;
  font-size:14px; font-weight:600; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:7px;
  transition:background .15s, color .15s;
}
.load-more-btn:active { background:#1a73e8; color:#fff; }
.more-loading { color:#999; font-size:13px; display:inline-flex; align-items:center; gap:7px; padding:10px 0; }
.more-end { color:#bbb; font-size:12px; display:inline-flex; align-items:center; gap:6px; padding:10px 0; }
.infinite-spinner {
  display:flex; align-items:center; justify-content:center;
  gap:8px; padding:16px; color:#999; font-size:13px;
}
.infinite-end {
  display:flex; align-items:center; justify-content:center;
  gap:6px; padding:14px; color:#bbb; font-size:12px;
  border-top:1px solid #f5f5f5;
}


.posts-pagination {
  display:flex; align-items:center; justify-content:center;
  gap:4px; padding:14px 8px 8px; flex-wrap:wrap;
  border-top:1px solid #f0f0f0; margin-top:4px;
}
.pg-btn {
  min-width:34px; height:34px; padding:0 10px;
  border:1px solid #e0e0e0; border-radius:7px;
  background:#fff; color:#555; font-size:13px;
  cursor:pointer; transition:all .15s; font-weight:500;
}
.pg-btn:hover { border-color:#1a73e8; color:#1a73e8; background:#f0f6ff; }
.pg-btn.active { background:#1a73e8; border-color:#1a73e8; color:#fff; font-weight:700; }
.pg-ellipsis { color:#aaa; font-size:13px; padding:0 4px; line-height:34px; }


.content-card {
  background: #fff; border-radius: var(--radius);
  box-shadow: var(--card-shadow); margin-bottom: 12px;
  border: 1px solid var(--border); overflow: hidden;
}
.content-card.flex1 { flex:1; min-width:0; }
.content-card .post-list { min-height: 360px; }
#allPosts, #bestPosts { min-height: 1200px; }
#noticeList.notice-board-wrap { min-height: 360px; }
.right-sidebar .rs-card { min-height: 80px; }
.content-row { display:flex; gap:12px; margin-bottom:12px; }

.card-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px 9px;
  border-bottom: 2px solid #1a73e8;
  background: #f8f9fa;
}
.card-header h3 { font-size: 13.5px; font-weight: 700; color: #333; display:flex; align-items:center; gap:6px; }
.card-header h3 i { color: var(--primary); font-size: 13px; }
.more-link { font-size: 11.5px; color: var(--primary); display:flex; align-items:center; gap:2px; }
.more-link:hover { text-decoration: underline; }


.tabs { display:flex; gap:0; }
.tab {
  padding: 4px 12px; border: none; background: none;
  font-size: 13px; font-weight: 700; color: #999;
  border-bottom: 2px solid transparent; margin-bottom: -2px;
  transition: all .15s;
}
.tab.active { color: var(--primary); border-bottom-color: var(--primary); }
.tab:hover:not(.active) { color: #555; }


.region-tabs { display:flex; gap:0; border-bottom: 1px solid #f0f0f0; padding: 6px 10px 0; }
.rtab {
  padding: 5px 12px; border: none; background: none;
  font-size: 12.5px; color: #888; border-bottom: 2px solid transparent;
  transition: all .15s;
}
.rtab.active { color: var(--primary); border-bottom-color: var(--primary); font-weight: 700; }
.rtab:hover:not(.active) { color: #333; }


.post-list li {
  display: flex; flex-direction: column;
  padding: 10px 12px; border-bottom: 1px solid #f3f3f3;
  gap: 5px; transition: background .1s; cursor: pointer;
}
.post-list li:last-child { border-bottom: none; }
.post-list li:hover { background: #f8faff; }
.post-list li.notice-row { background: #fffbf0; }
.post-list li.notice-row .post-title { font-weight: 700; color: #b71c1c; }

.post-row1 { display:flex; align-items:center; gap:6px; min-width:0; }
.post-row1-left { flex:1; min-width:0; display:flex; align-items:center; gap:6px; overflow:hidden; }
.post-link { display:flex; align-items:center; gap:6px; flex:1; min-width:0; color:#333; text-decoration:none; }
.post-thumb-sm {
  width: 44px; height: 44px; border-radius: 5px;
  object-fit: cover; flex-shrink: 0;
}
.post-right-block {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.post-cmt-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  padding: 4px 8px;
  background: #f5f6f8;
  border: 1px solid #eaecef;
  border-radius: 6px;
  gap: 0;
  flex-shrink: 0;
}
.post-cmt-box.has-cmt { background: #eef4ff; border-color: #c8d8ff; }
.post-cmt-num { font-size: 14px; font-weight: 800; color: #bbb; line-height: 1.2; }
.post-cmt-box.has-cmt .post-cmt-num { color: var(--primary); }
.post-cmt-lbl { font-size: 9.5px; color: #ccc; white-space: nowrap; }
.post-cmt-box.has-cmt .post-cmt-lbl { color: #7ba8f0; }
.post-title {
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  font-size: 15px; font-weight: 700; color: #111; letter-spacing: -0.2px;
}
.post-preview-line {
  font-size: 11.5px; color: #aaa;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding-left: 2px;
}


.post-list li.post-read .post-title { color: #9aa3b2; font-weight: 400; }
.post-list li.post-read .post-title::before {
  content: "✓ ";
  color: #4caf50;
  font-weight: 700;
  margin-right: 2px;
}
.post-list li.post-read .post-preview-line { color: #bdc3cf; }
.post-list li.post-read:hover .post-title { color: #6b7280; }


.rs-fortune-card {
  cursor: pointer;
  background: linear-gradient(135deg, #fff8f0 0%, #fef3c7 100%);
  border: 1px solid #fde68a;
  transition: transform 0.15s, box-shadow 0.15s;
}
.rs-fortune-card:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(251, 191, 36, 0.2); }
.rs-fortune-head { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.rs-fortune-emoji { font-size: 18px; }
.rs-fortune-title { font-weight: 700; color: #92400e; font-size: 14px; }
.rs-fortune-rank { font-size: 22px; font-weight: 800; text-align: center; margin: 6px 0; letter-spacing: 2px; }
.rs-fortune-msg { font-size: 13px; color: #555; text-align: center; line-height: 1.45; margin-bottom: 10px; padding: 0 4px; }
.rs-fortune-nums { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 0; border-top: 1px dashed #fde68a; }
.rs-fortune-nums-label { font-size: 11px; color: #92400e; font-weight: 600; }
.rs-fortune-nums-val { font-size: 13px; color: #6b3410; font-weight: 700; font-feature-settings: "tnum"; letter-spacing: 0.5px; }
.rs-fortune-more { text-align: right; font-size: 11px; color: #b45309; margin-top: 6px; }


@media (max-width: 960px) {
  #mainContent > #rsFortuneMount { margin: 16px 12px 12px; }
  #mainContent > #rsFortuneMount .rs-fortune-card { box-shadow: 0 2px 10px rgba(0,0,0,0.06); border-radius: 12px; padding: 14px; }
}


.fortune-detail { max-width: 720px; margin: 0 auto; padding: 24px 18px 40px; }
.fortune-date { text-align: center; font-size: 13px; color: #888; margin-bottom: 8px; letter-spacing: 1px; }
.fortune-rank-big { text-align: center; font-size: 48px; font-weight: 800; margin: 8px 0 12px; letter-spacing: 3px; }
.fortune-rank-emoji { display: inline-block; margin-right: 10px; }
.fortune-rank-label { font-family: 'Nanum Myeongjo', 'Noto Serif KR', serif; }
.fortune-total { font-size: 17px; color: #333; text-align: center; line-height: 1.6; margin-bottom: 28px; padding: 16px 12px; background: linear-gradient(135deg, #fff8f0, #fef3c7); border-radius: 12px; border: 1px solid #fde68a; }

.fortune-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 24px; }
.fortune-cat { padding: 14px; background: #fff; border: 1px solid #eaeef5; border-radius: 10px; }
.fortune-cat-head { font-size: 13px; font-weight: 700; color: #444; margin-bottom: 6px; }
.fortune-cat-msg { font-size: 14px; color: #555; line-height: 1.5; }
@media (max-width: 560px) { .fortune-grid { grid-template-columns: 1fr; } }

.fortune-lucky { background: linear-gradient(135deg, #f0f9ff, #e0f2fe); border: 1px solid #bae6fd; border-radius: 12px; padding: 16px 18px; margin-bottom: 16px; }
.fortune-lucky-row { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; border-bottom: 1px dashed #bae6fd; }
.fortune-lucky-row:last-child { border-bottom: none; }
.fortune-lucky-label { font-size: 13px; color: #0c4a6e; font-weight: 600; }
.fortune-lucky-val { font-size: 14px; color: #075985; font-weight: 700; }
.fortune-lucky-nums { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.fortune-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 50%;
  background: #fff; border: 2px solid #38bdf8;
  color: #075985; font-weight: 700; font-size: 13px;
  font-feature-settings: "tnum";
}
.fortune-foot { font-size: 12px; color: #999; text-align: center; margin-top: 16px; }
.post-meta-row { display:flex; align-items:center; gap:4px; margin-top:0; overflow:hidden; }
.author-avatar-live { flex-shrink:0; display:flex; align-items:center; }
.author-avatar-sm {
  width:20px; height:20px; border-radius:50%; object-fit:cover;
  vertical-align:middle; flex-shrink:0; display:inline-block;
}
.author-avatar-default {
  background:#555; color:#ddd; font-size:10px; font-weight:700;
  text-align:center; line-height:20px;
}
.author-title-badge {
  display:inline-flex; align-items:center;
  font-size:10px; font-weight:800; color:#fff;
  background:linear-gradient(135deg,#ffb300,#ff8f00);
  border:1px solid #ffd54f;
  border-radius:10px; padding:1px 8px;
  white-space:nowrap; flex-shrink:0; letter-spacing:0.3px;
  box-shadow:0 1px 3px rgba(255,143,0,.35);
  text-shadow:0 1px 1px rgba(0,0,0,.2);
}
.author-title-emoji {
  display:inline-flex; align-items:center; justify-content:center;
  font-size:14px; line-height:1; height:22px; min-width:22px;
  padding:0 4px; flex-shrink:0; vertical-align:middle;
  background:linear-gradient(135deg,#fff8e1,#ffe0b2);
  border:1px solid #ffcc80; border-radius:11px;
  box-shadow:0 1px 2px rgba(0,0,0,.08);
}
.author-title-img {
  height:22px; width:auto; max-width:60px;
  object-fit:contain; flex-shrink:0;
  vertical-align:middle; display:inline-block;
}

.rank-star-video {
  width: 22px;
  height: 22px;
  object-fit: cover;
  border-radius: 50%;
  background: #0a0a0a;
  vertical-align: middle;
  margin-right: 2px;
  display: inline-block;
  flex-shrink: 0;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.12);
  pointer-events: none;
}

.author-title-video {
  width:22px; height:22px;
  object-fit:cover;
  border-radius:50%;
  flex-shrink:0;
  vertical-align:middle;
  display:inline-block;
  background:#0a0a0a;
  box-shadow:0 0 0 1px rgba(255,255,255,0.1), inset 0 0 0 1px rgba(0,0,0,0.4);
  pointer-events:none;
}
.post-stats {
  margin-left: auto;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: 11px;
  color: #bbb;
  white-space: nowrap;
}
.post-stats .fa { font-size: 10px; }
.badge {
  display: inline-flex; align-items: center; padding: 2px 7px;
  background: #eef2ff; color: #3a5fd9;
  border-radius: 4px; font-size: 10.5px; font-weight: 700;
  white-space: nowrap; flex-shrink: 0; letter-spacing: 0.1px;
}
.badge.notice-badge { background: #fce8e6; color: #c62828; }


.rs-vn-widget {
  padding-bottom: 12px;
  background: #fff;
  border: 1px solid #e0e4ec;
  border-radius: 10px;
  overflow: hidden;
}

@media (max-width: 960px) {
  #mainContent > .rs-vn-widget {
    margin: 16px 12px 24px;
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
  }
}
.vw-clocks { display: flex; gap: 8px; padding: 10px 14px 6px; }
.vw-clock {
  flex: 1; background: linear-gradient(135deg,#1a1d2a,#2c3140);
  border-radius: 8px; padding: 8px 10px; color: #fff;
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  border: 1px solid rgba(255,255,255,.06);
}
.vw-flag { font-size: 18px; line-height: 1; }
.vw-time { font-size: 14px; font-weight: 700; color: #ffd54f; font-variant-numeric: tabular-nums; letter-spacing: 0.5px; }
.vw-label { font-size: 10px; color: rgba(255,255,255,.5); }
.vw-section-title {
  padding: 10px 14px 6px; font-size: 11.5px; font-weight: 700;
  color: #555; letter-spacing: 0.3px;
}
.vw-exchange { padding: 0 14px 6px; }
.vw-ex-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 5px 8px; font-size: 11.5px;
  background: #f8faff; border-radius: 6px; margin-bottom: 4px;
}
.vw-ex-from { color: #555; font-weight: 500; }
.vw-ex-arrow { color: #aaa; font-size: 10px; margin: 0 4px; }
.vw-ex-to { color: #1565c0; font-weight: 700; font-variant-numeric: tabular-nums; }
.vw-ex-to small { font-size: 10px; color: #888; font-weight: 600; margin-left: 1px; }
.vw-ex-updated {
  padding: 2px 4px; font-size: 9.5px; color: #999; text-align: right;
  font-style: italic;
}
.vw-weather { padding: 0 14px 4px; display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.vw-w-city {
  display: flex; align-items: center; gap: 5px;
  padding: 6px 8px; background: linear-gradient(135deg,#fff3e0,#ffe0b2);
  border-radius: 6px; font-size: 11px;
}
.vw-w-name { color: #555; font-weight: 600; flex-shrink: 0; }
.vw-w-icon { font-size: 13px; line-height: 1; }
.vw-w-temp { margin-left: auto; color: #e65100; font-weight: 700; font-variant-numeric: tabular-nums; }


.post-next-list-card {
  background: #fff; border: 1px solid #e0e0e0;
  border-radius: 10px; margin: 12px 0;
  overflow: hidden;
}
.pnl-header {
  padding: 11px 16px; font-size: 13.5px; font-weight: 700; color: #1565c0;
  background: linear-gradient(135deg,#f0f7ff,#e3eefc);
  border-bottom: 1px solid #d0dae8;
  display: flex; align-items: center; gap: 7px;
}
.pnl-header i { color: #1976d2; }
.pnl-header .pnl-sub { font-size: 11.5px; color: #888; font-weight: 500; margin-left: auto; }
.pnl-footer {
  display: flex; justify-content: center; align-items: center;
  padding: 12px; border-top: 1px solid #f0f0f0; background: #fafbfc;
}
.pnl-more-btn {
  padding: 9px 28px; font-size: 13px; font-weight: 700;
  background: #f0f4ff; color: #1565c0;
  border: 1.5px solid #c5d8ff; border-radius: 6px; cursor: pointer;
  transition: background .12s;
}
.pnl-more-btn:hover { background: #e0ecff; }
.pnl-pagination { display: inline-flex; gap: 5px; }
.pnl-page-btn {
  min-width: 32px; height: 32px; padding: 0 10px;
  background: #fff; border: 1px solid #ddd; border-radius: 6px;
  font-size: 13px; font-weight: 700; color: #555; cursor: pointer;
  transition: all .12s;
}
.pnl-page-btn:hover { background: #f0f4ff; border-color: #1565c0; color: #1565c0; }
.pnl-page-btn.pnl-page-on {
  background: #1565c0; color: #fff; border-color: #1565c0;
}
.pnl-page-next { padding: 0 12px; font-size: 16px; line-height: 1; }
@media (max-width: 768px) {
  .pnl-pagination { display: none; }
}
@media (min-width: 769px) {
  .pnl-more-btn { display: none; }
}


.hb-emoji-picker {
  position: fixed; z-index: 9999;
  width: 320px; max-height: 360px;
  background: #fff; border: 1px solid #e0e4ec;
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,.16);
  overflow: hidden; display: flex; flex-direction: column;
  font-family: inherit;
}
.hb-emoji-tabs {
  display: flex; gap: 0; padding: 6px 8px;
  border-bottom: 1px solid #f0f0f0; background: #fafbfc;
}
.hb-emoji-tab {
  flex: 1; padding: 6px 0; border: none; background: none;
  font-size: 19px; cursor: pointer; border-radius: 6px;
  transition: background .12s;
}
.hb-emoji-tab:hover { background: #eef2f8; }
.hb-emoji-tab.on { background: #e3eefc; }
.hb-emoji-grid {
  display: grid; grid-template-columns: repeat(8, 1fr);
  gap: 2px; padding: 8px; overflow-y: auto; flex: 1;
}
.hb-emoji-cell {
  font-size: 22px; line-height: 1; text-align: center;
  padding: 6px 0; cursor: pointer; border-radius: 6px;
  user-select: none; transition: background .1s;
}
.hb-emoji-cell:hover { background: #f0f6ff; }


img.tw-emoji {
  height: 1.2em; width: 1.2em; vertical-align: -0.2em;
  display: inline-block; margin: 0 1px;
}

.hb-emoji-cell img.tw-emoji { height: 22px; width: 22px; vertical-align: middle; }
.comment-count {
  display: inline-flex; align-items: center;
  color: var(--primary); font-size: 12px; margin-left:1px; font-weight: 700;
}
.post-right { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.post-author { font-size: 11px; color: #aaa; white-space:nowrap; }
.post-time { font-size: 11px; color: #c0c0c0; white-space:nowrap; }
.view-count { font-size: 11px; color: #ccc; }
.nametag-tmpl {
  position: relative; display: inline-flex; align-items: center;
  height: 22px; vertical-align: middle;
}
.nametag-tmpl-text {
  
  position: absolute; inset: 0; display: flex; align-items: center;
  justify-content: center; color: #fff; font-size: 10px; font-weight: 700;
  text-shadow: 1px 1px 2px rgba(0,0,0,.8); white-space: nowrap;
  overflow: hidden; padding: 0 8px;
}

.nametag-tmpl-text.is-v2 {
  font-size: 10px; font-weight: 900;
  -webkit-text-stroke: 1px #000;
  paint-order: stroke fill;
  text-shadow: 0 0 3px rgba(0,0,0,.85);
  line-height: 1;
}
.nametag-tmpl-text.is-v2.is-dark {
  color: #111;
  -webkit-text-stroke: 1px #fff;
  text-shadow: 0 0 3px rgba(255,255,255,.85);
}

.nametag-tmpl-text.is-v2.is-large {
  font-size: 20px;
  -webkit-text-stroke: 3px #000;
  text-shadow: 0 0 5px rgba(0,0,0,.85);
}
.nametag-tmpl-text.is-v2.is-large.is-dark {
  -webkit-text-stroke: 3px #fff;
  text-shadow: 0 0 5px rgba(255,255,255,.85);
}


.notice-board-wrap { display: flex; flex-direction: column; }
.notice-board-skel { padding: 11px 14px; border-bottom: 1px solid #f3f4f6; }

.notice-board-item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-bottom: 1px solid #f3f4f6;
  cursor: pointer; transition: background .13s, transform .1s;
  position: relative; overflow: hidden;
}
.notice-board-item:last-child { border-bottom: none; }
.notice-board-item::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0;
  width: 3px; background: var(--nc, #1a73e8);
  opacity: 0; transition: opacity .15s;
}
.notice-board-item:hover { background: #f6f8ff; }
.notice-board-item:hover::before { opacity: 1; }
.notice-board-item:hover .notice-board-title { color: var(--nc, #1a73e8); }

.notice-board-badge {
  flex-shrink: 0; display: inline-flex; align-items: center;
  font-size: 10.5px; font-weight: 700; color: #fff;
  padding: 3px 9px; border-radius: 20px; white-space: nowrap;
  box-shadow: 0 1px 4px rgba(0,0,0,.18);
  letter-spacing: .3px;
}
.notice-board-title {
  flex: 1; min-width: 0;
  font-size: 13px; font-weight: 600; color: #222;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  transition: color .13s;
}
.notice-board-thumb {
  width: 36px; height: 36px; border-radius: 5px;
  object-fit: cover; flex-shrink: 0;
  box-shadow: 0 1px 4px rgba(0,0,0,.12);
}
.notice-board-meta {
  flex-shrink: 0; font-size: 11px; color: #ccc;
  white-space: nowrap; min-width: 36px; text-align: right;
}

.empty-msg { text-align:center; color:#bbb; font-size:12.5px; padding: 20px !important; }
.skeleton-item { pointer-events:none; }
.skeleton {
  height: 13px; margin: 5px 12px;
  background: linear-gradient(90deg,#f0f0f0 25%,#e8e8e8 50%,#f0f0f0 75%);
  background-size: 200% 100%; animation: shimmer 1.2s infinite; border-radius: 3px;
}
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }


.lv-badge {
  display: inline-block; padding: 1px 5px;
  border-radius: 3px; font-size: 10px; font-weight: 700;
  color: #fff; flex-shrink: 0; vertical-align: middle; line-height: 1.4;
}
.lv1  { background: #78909c; }
.lv2  { background: #66bb6a; }
.lv3  { background: #29b6f6; }
.lv4  { background: #ab47bc; }
.lv5  { background: #ffa726; color:#333; }
.lv6  { background: #ef5350; }
.lv7  { background: #e91e63; }
.lv8  { background: #9c27b0; }
.lv9  { background: #ff6f00; }
.lv10 { background: linear-gradient(90deg,#f44336,#e91e63,#9c27b0); }


.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px; padding: 8px;
}
.gallery-item {
  position: relative; border-radius: 4px;
  overflow: hidden; cursor: pointer; display: block;
  aspect-ratio: 16 / 9;
}
.gallery-item img { width:100%; height:100%; object-fit:cover; transition: transform .25s; }
.gallery-item:hover img { transform: scale(1.06); }
.gallery-overlay {
  position: absolute; inset:0;
  background: linear-gradient(to top, rgba(0,0,0,.65) 0%, transparent 50%);
  opacity: 0; transition: opacity .2s;
  display: flex; align-items: flex-end; padding: 6px;
}
.gallery-item:hover .gallery-overlay { opacity: 1; }
.gallery-overlay span { font-size: 11px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; width:100%; }
.gallery-placeholder { grid-column:1/-1; text-align:center; color:#bbb; padding:24px; font-size:12.5px; }


.home-gallery-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px; padding: 10px;
}
.home-gc {
  display: flex; flex-direction: column;
  border-radius: 8px; overflow: hidden;
  border: 1px solid var(--border);
  background: #fff; cursor: pointer;
  transition: transform .18s, box-shadow .18s;
  text-decoration: none; color: inherit;
}
.home-gc:hover { transform: translateY(-3px); box-shadow: 0 6px 18px rgba(0,0,0,0.12); }
.home-gc-img {
  aspect-ratio: 4 / 3; overflow: hidden;
  background: #f0f0f0;
}
.home-gc-img img { width:100%; height:100%; object-fit:cover; transition: transform .25s; display:block; }
.home-gc:hover .home-gc-img img { transform: scale(1.06); }
.home-gc-body { padding: 6px 8px; }
.home-gc-title {
  font-size: 11.5px; color: #333; font-weight: 500;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; line-height: 1.4; margin-bottom: 3px;
}
.home-gc-meta { font-size: 10px; color: #aaa; }
@media (max-width: 900px) { .home-gallery-grid { grid-template-columns: repeat(3,1fr); } }
@media (max-width: 600px) { .home-gallery-grid { grid-template-columns: repeat(2,1fr); gap:6px; padding:8px; } }


.rs-card {
  background: #fff; border-radius: var(--radius);
  box-shadow: var(--card-shadow); margin-bottom: 10px;
  border: 1px solid var(--border); overflow: hidden;
}
.rs-header {
  padding: 8px 11px 7px; font-size: 12.5px; font-weight: 700;
  color: #fff; background: #2c3e50;
  display: flex; align-items: center; gap: 5px;
}
.rs-header i { opacity:.85; font-size:11px; }

.rs-online { padding: 8px 11px 6px; }
.rs-online-item {
  display: flex; align-items: center; gap: 5px;
  font-size: 12.5px; color: #555;
}
.rs-online-item b { color: var(--primary); font-size: 15px; margin-left:auto; }
.rs-dot {
  width: 7px; height: 7px; background: #34a853; border-radius: 50%;
  box-shadow: 0 0 0 2px rgba(52,168,83,.25); animation: pulse 2s infinite;
}
@keyframes pulse { 0%,100%{box-shadow:0 0 0 2px rgba(52,168,83,.25)} 50%{box-shadow:0 0 0 5px rgba(52,168,83,.08)} }

.rs-stats-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:#f0f0f0; border-top:1px solid #f0f0f0; }
.rs-stat { background:#fff; padding:8px 6px; text-align:center; }
.rs-stat-val { font-size:14px; font-weight:700; color:var(--primary); }
.rs-stat-label { font-size:10.5px; color:#999; margin-top:1px; }

.rs-write-btn {
  display:flex; align-items:center; justify-content:center; gap:6px;
  background: var(--primary); color:#fff; border-radius:var(--radius);
  padding: 9px; font-size:13px; font-weight:700; margin-bottom:10px;
  transition: background .15s, transform .12s;
}
.rs-write-btn:hover { background:var(--primary-dark); transform:translateY(-1px); }

.rs-banner-card {}
.rs-banner-list { padding:6px; display:flex; flex-direction:column; gap:5px; }
.rs-banner-item { border-radius:4px; overflow:hidden; cursor:pointer; }
.rs-banner-item img { width:100%; display:block; border-radius:4px; }
.rs-banner-empty {
  height: 52px; background: #f8f9fa; border: 1.5px dashed #ddd;
  border-radius:4px; display:flex; align-items:center; justify-content:center;
  font-size:11.5px; color:#bbb; gap:4px;
}

.rs-game-grid { display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:8px; }
.rs-game-item { display:flex; flex-direction:column; align-items:center; gap:4px; text-decoration:none; color:#555; transition:transform .12s; }
.rs-game-item:hover { transform:translateY(-2px); }
.rs-game-icon { width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:16px; color:#fff; }
.rs-game-item span { font-size:10.5px; font-weight:500; }

.rs-contact-list { padding:4px 0; }
.rs-contact-list li a {
  display:flex; align-items:center; gap:7px; padding:7px 11px;
  font-size:12px; color:#555; transition:background .12s;
}
.rs-contact-list li a:hover { background:#f8f9fa; color:#333; }

.rs-header-kakao-icon { width:13px; height:13px; object-fit:contain; vertical-align:middle; }
.rs-staff-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:10px 8px 12px; }
.rs-staff-item {
  display:flex; flex-direction:column; align-items:center; gap:3px;
  text-decoration:none; color:#333;
  transition:transform .15s;
}
.rs-staff-item:hover { transform:translateY(-3px); }
.rs-staff-photo-wrap { position:relative; width:68px; height:68px; }
.rs-staff-photo {
  width:68px; height:68px; border-radius:14px; object-fit:cover;
  border:2px solid #ffe97a; box-shadow:0 2px 6px rgba(0,0,0,.12);
}
.rs-staff-kakao-badge {
  position:absolute; bottom:-5px; right:-5px;
  width:24px; height:24px; object-fit:contain;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.25));
}
.rs-staff-region { font-size:11px; font-weight:700; color:#2c3e50; margin-top:6px; }
.rs-staff-name { font-size:10.5px; color:#888; }
.rs-kakao-icon {
  width:52px; height:52px;
  display:flex; align-items:center; justify-content:center;
  transition:transform .15s;
}
.rs-kakao-icon img {
  width:52px; height:52px; object-fit:contain;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.15));
}
.rs-staff-item:hover .rs-kakao-icon { transform:translateY(-3px); }


.float-btns { position:fixed; bottom:18px; right:18px; display:flex; flex-direction:column; gap:8px; z-index:500; }
.float-btn {
  width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:16px; box-shadow:0 2px 8px rgba(0,0,0,.2); border:none; transition:transform .2s,box-shadow .2s;
}
.float-btn:hover { transform:scale(1.1); box-shadow:0 4px 12px rgba(0,0,0,.25); }
.float-btn.primary { background:var(--primary); color:#fff; }
.float-btn.white { background:#fff; color:#555; border:1px solid #ddd; }


.site-footer {
  background: #2c3e50; color: rgba(255,255,255,.75);
  border-radius: var(--radius); padding: 14px 18px;
  margin-top: 10px; font-size: 12px;
}
.footer-stats {
  display:flex; gap:16px; flex-wrap:wrap; margin-bottom:10px; padding-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.footer-stats span { display:flex; align-items:center; gap:4px; }
.footer-stats b { color:#fff; }
.footer-company { display:flex; gap:16px; flex-wrap:wrap; font-size:11.5px; color:rgba(255,255,255,.5); margin-bottom:8px; }
.footer-legal { display:flex; gap:6px; flex-wrap:wrap; align-items:center; font-size:11.5px; margin-bottom:6px; }
.footer-legal a { color:rgba(255,255,255,.7); text-decoration:none; font-weight:600; }
.footer-legal a:hover { color:#fff; text-decoration:underline; }
.footer-legal .sep { color:rgba(255,255,255,.25); }
.footer-2257 { font-size:10.5px; line-height:1.7; color:rgba(255,255,255,.4); margin-bottom:8px; padding-bottom:8px; border-bottom:1px solid rgba(255,255,255,.1); }
.footer-2257 a { color:rgba(255,255,255,.6); text-decoration:underline; }
.footer-2257 a:hover { color:#fff; }
.footer-copy { font-size:11px; color:rgba(255,255,255,.35); }


@media (max-width: 960px) { .right-sidebar { display:none; } }
@media (max-width: 900px) { .content-row { flex-direction:column; } .top-links .has-drop .dropdown { display:none !important; } }
@media (max-width: 768px) {
  :root { --sidebar-w: 250px; }
  #sidebar { transform: translateX(-100%); }
  #sidebar.open { transform: translateX(0); }
  #overlay.show { display:block; }
  #topNav { left:0 !important; }
  #mainContent { margin-left:0 !important; padding:10px; }
  .top-links { display:none; }
  .gallery-grid { grid-template-columns: repeat(2,1fr); }
  .site-footer { font-size:11px; }
  
  /* 로고는 화면 정중앙 고정(절대배치) — 좌(햄버거)·우(버튼들) 폭이 달라도 항상 중앙.
     #topNav가 position:fixed라 이 요소의 기준이 됨. 우측영역은 margin-left:auto로 우측 정렬 유지. */
  /* 절대배치 로고는 시각용으로만 — pointer-events:none 로 탭이 항상 아래(햄버거·우측버튼)로 통과.
     (로고가 햄버거/버튼 위에 겹쳐도 클릭을 가로채지 않음. 홈 이동은 하단바 🏠 사용) */
  .mobile-nav-logo { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:flex; align-items:center; pointer-events:none; max-width:55vw; }
  /* 이미지 영역만 클릭 가능 → 로고 누르면 홈 이동. 로고 바깥 빈 영역은 탭 통과(햄버거·버튼 보호) */
  .mobile-nav-logo img { height:26px; object-fit:contain; pointer-events:auto; }
  .top-pts-badge { display:flex !important; }
  .online-count { display:none; }
  
  .icon-v2-img { width:58px; height:58px; }
  .icon-menu-wrap { padding:10px 6px 6px; }
  
  .desktop-only { display:none !important; }
  .mobile-only { display:block !important; }
}
@media (max-width: 480px) {
  .icon-box { width:38px; height:38px; font-size:15px; }
  .icon-item { min-width:54px; padding:5px 4px; }
  .gallery-grid { grid-template-columns: repeat(2,1fr); }
  .icon-v2-img { width:52px; height:52px; border-radius:13px; }
  .icon-item-v2 > span { font-size:9.5px; }
  .kakao-badge-v2 { width:19px; height:19px; }
}


body.sb-ready #sidebar { transition: transform .28s ease; }
body.sb-ready #topNav { transition: left .28s ease; }
body.sb-ready #mainContent { transition: margin-left .28s ease; }


body.sb-closed #sidebar { transform: translateX(-100%); }
body.sb-closed #topNav { left: 0; }
body.sb-closed #mainContent { margin-left: 0; }


#mobileBottomNav {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  height: 56px;
  background: #1a1a1a;
  border-top: 1px solid #2a2a2a;
  z-index: 800;
  flex-direction: row;
  align-items: stretch;
  justify-content: space-around;
}
.mbn-item {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  color: #888; font-size: 11px; gap: 3px;
  text-decoration: none; border: none; background: none;
  cursor: pointer; padding: 0;
}
.mbn-item i { font-size: 18px; }
.mbn-item.active, .mbn-item:active { color: #ffd700; }
@media (max-width: 768px) {
  #mobileBottomNav { display: flex; }
  #mainContent { padding-bottom: 66px !important; }
}


.job-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  vertical-align: middle;
  margin-right: 4px;
}
.job-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px; height: 28px;
  border-radius: 50%;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: -0.5px;
  line-height: 1;
  text-align: center;
  flex-shrink: 0;
}
.job-icon-boss {
  background: radial-gradient(circle at 40% 35%, #ff6f00, #b71c1c);
  border: 2px solid #ffd600;
  color: #ffd600;
  box-shadow: 0 0 6px rgba(255, 213, 0, 0.5);
}
.job-icon-active {
  background: radial-gradient(circle at 40% 35%, #8d6e63, #4e342e);
  border: 2px solid #a1887f;
  color: #ffccbc;
  box-shadow: 0 0 4px rgba(141, 110, 99, 0.4);
}
.job-label {
  display: inline-block;
  font-size: 10px;
  font-weight: 800;
  padding: 1px 7px;
  border-radius: 3px;
  line-height: 1.6;
  vertical-align: middle;
}
.job-label-boss {
  background: linear-gradient(90deg, #b71c1c, #e53935);
  color: #ffd600;
}
.job-label-active {
  background: linear-gradient(90deg, #4e342e, #795548);
  color: #ffccbc;
}