* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: '돋움', Dotum, sans-serif; font-size: 12px; background: #f0f0f0; }
.wrap { max-width: 1024px; margin: 0 auto; background: #f0f0f0; }
.header { background: #1a4a8a; padding: 6px 12px; display: flex; align-items: center; justify-content: space-between; }
.logo { color: white; font-size: 22px; font-weight: bold; font-family: Arial, sans-serif; letter-spacing: -1px; }
.logo span { color: #66ccff; }
.top-nav { background: #1a4a8a; border-top: 1px solid #2a5aaa; display: flex; flex-wrap: wrap; }
.top-nav a { color: white; text-decoration: none; padding: 6px 14px; font-size: 12px; font-weight: bold; border-right: 1px solid #2a5aaa; }
.top-nav a:hover, .top-nav a.active { background: #0d2d5a; color: #66ccff; }
.top-nav a.locked { color: #ffdd44; }
.btn-primary { background: #1a4a8a; color: white; border: none; padding: 5px 14px; font-size: 12px; cursor: pointer; font-family: inherit; }
.btn-danger { background: #e53935; color: white; border: none; padding: 5px 14px; font-size: 12px; cursor: pointer; font-family: inherit; }
.btn-report { background: #f5f5f5; color: #555; border: 1px solid #ccc; padding: 5px 12px; font-size: 12px; cursor: pointer; font-family: inherit; }
input, select, textarea { font-family: '돋움', Dotum, sans-serif; font-size: 12px; border: 1px solid #ccc; padding: 4px 6px; }
.admin-author { color: #7ed957 !important; font-weight: bold; }
.author-profile-link { color: inherit; text-decoration: none; }
.author-profile-link:hover { text-decoration: underline; }

body.dark-mode {
  background: #101826 !important;
  color: #d8e1ee !important;
}

body.dark-mode .wrap {
  background: #162235 !important;
}

body.dark-mode #header,
body.dark-mode .header,
body.dark-mode #top-nav,
body.dark-mode .top-nav,
body.dark-mode .mobile-bottom-bar,
body.dark-mode .bottom-stat-bar,
body.dark-mode .post-title-bar,
body.dark-mode .write-wrap .section-title,
body.dark-mode .section-title,
body.dark-mode .board-table th {
  background: #102846 !important;
  color: #fff !important;
  border-color: #264a78 !important;
}

body.dark-mode #top-nav a,
body.dark-mode .top-nav a,
body.dark-mode .mobile-bottom-bar a {
  color: #b8cbe5 !important;
  border-color: #264a78 !important;
}

body.dark-mode #top-nav a:hover,
body.dark-mode #top-nav a.active,
body.dark-mode .top-nav a:hover,
body.dark-mode .top-nav a.active,
body.dark-mode .mobile-bottom-bar a:hover,
body.dark-mode .mobile-bottom-bar a.active {
  background: #d8e7ff !important;
  color: #102846 !important;
}

body.dark-mode .notice-bar {
  background: #2a2414 !important;
  color: #f1cf73 !important;
  border-color: #66521d !important;
}

body.dark-mode .hot-section,
body.dark-mode .sidebar-box,
body.dark-mode .post-wrap,
body.dark-mode .write-wrap,
body.dark-mode .mypage-wrap,
body.dark-mode .activity-list,
body.dark-mode .benefit-board-wrap,
body.dark-mode .ub-box,
body.dark-mode table,
body.dark-mode .board-table {
  background: #1b2a40 !important;
  border-color: #334866 !important;
  color: #d8e1ee !important;
}

body.dark-mode .hot-section-title,
body.dark-mode .sidebar-box-title,
body.dark-mode .comment-section-title,
body.dark-mode .write-table th,
body.dark-mode .post-meta,
body.dark-mode .profile-tab,
body.dark-mode .activity-card,
body.dark-mode .ub-head {
  background: #22344e !important;
  border-color: #334866 !important;
  color: #d8e1ee !important;
}

body.dark-mode .profile-tab.active {
  background: #1b2a40 !important;
  color: #fff !important;
  border-bottom-color: #7ec8ff !important;
}

body.dark-mode .board-table td,
body.dark-mode .hot-item,
body.dark-mode .ranking-item,
body.dark-mode .activity-item,
body.dark-mode .comment-item,
body.dark-mode .write-table td,
body.dark-mode .info-row {
  border-color: #334866 !important;
  color: #d8e1ee !important;
}

body.dark-mode .board-table tr:hover td,
body.dark-mode .notification-item:hover {
  background: #263a58 !important;
}

body.dark-mode a,
body.dark-mode .board-table .title a,
body.dark-mode .hot-item a,
body.dark-mode .ranking-title,
body.dark-mode .activity-item a {
  color: #d8e7ff !important;
}

body.dark-mode a:hover,
body.dark-mode .board-table .title a:hover,
body.dark-mode .hot-item a:hover,
body.dark-mode .ranking-title:hover {
  color: #7ec8ff !important;
}

body.dark-mode .stat-row .stat-label,
body.dark-mode .info-label,
body.dark-mode .activity-card .label,
body.dark-mode .post-meta,
body.dark-mode .activity-meta,
body.dark-mode .comment-preview,
body.dark-mode .empty-state,
body.dark-mode .empty-list,
body.dark-mode .ranking-empty {
  color: #9fb0c7 !important;
}

body.dark-mode .stat-row .stat-val,
body.dark-mode .activity-card .value,
body.dark-mode .hot-board,
body.dark-mode .comment-item .comment-author,
body.dark-mode .mypage-section h3,
body.dark-mode .bottom-stat-bar .stat-item span {
  color: #7ec8ff !important;
}

body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea,
body.dark-mode .image-preview-list {
  background: #111b2a !important;
  color: #e7edf7 !important;
  border-color: #405878 !important;
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
  color: #7f8fa5 !important;
}

body.dark-mode .reaction-row,
body.dark-mode .post-back-row,
body.dark-mode .comment-form-wrap,
body.dark-mode .write-btn-row {
  background: #172337 !important;
  border-color: #334866 !important;
}

body.dark-mode .reaction-row button,
body.dark-mode .post-actions a,
body.dark-mode .post-actions button,
body.dark-mode .post-back-row a,
body.dark-mode .btn-cancel,
body.dark-mode .reply-form .reply-cancel {
  background: #22344e !important;
  border-color: #405878 !important;
  color: #d8e1ee !important;
}

body.dark-mode .admin-author,
body.dark-mode .admin-author.author-profile-link,
body.dark-mode .comment-item .comment-author.admin-author {
  color: #7ed957 !important;
}

body.dark-mode .notification-panel {
  background: #1b2a40 !important;
  border-color: #4670a5 !important;
  color: #e7edf7 !important;
}

body.dark-mode .notification-title {
  background: #102846 !important;
}

body.dark-mode #header-auth .notification-panel .notification-item,
body.dark-mode #header-auth .notification-panel .notification-message {
  color: #e7edf7 !important;
}

body.dark-mode .theme-toggle {
  color: #f7d56b;
}

.theme-toggle {
  width: 26px;
  height: 24px;
  border: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
  font-size: 13px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.theme-toggle:hover {
  background: transparent;
  filter: brightness(1.2);
}

/* 모바일 하단 탭바 */
.mobile-bottom-bar {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: #1a4a8a;
  border-top: 2px solid #0e3060;
  z-index: 100;
}
.mobile-bottom-bar a {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 5px 2px 3px;
  color: #b0c8e8;
  text-decoration: none;
  font-size: 10px;
  gap: 1px;
}
.mobile-bottom-bar a span {
  font-size: 16px;
  line-height: 1;
}
.mobile-bottom-bar a:hover,
.mobile-bottom-bar a.active {
  color: #fff;
  background: #2a5aaa;
}
.mobile-bottom-bar a.qr { color: #f0c040; }

.report-modal-overlay { position: fixed; inset: 0; z-index: 5000; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0, 0, 0, 0.35); }
.report-modal { width: min(420px, 100%); background: #fff; border: 1px solid #1a4a8a; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22); }
.report-modal-title { padding: 10px 12px; background: #1a4a8a; color: #fff; font-weight: bold; }
.report-reason-list { display: grid; gap: 6px; padding: 12px; }
.report-reason-btn { width: 100%; padding: 9px 10px; background: #fff; color: #222; border: 1px solid #d5dbe5; text-align: left; font-family: inherit; font-size: 12px; cursor: pointer; }
.report-reason-btn:hover, .report-reason-btn.selected { border-color: #1a4a8a; background: #eef5ff; color: #003f8f; font-weight: bold; }
.report-modal-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 10px 12px; border-top: 1px solid #e0e0e0; }
.report-cancel-btn, .report-submit-btn { min-width: 64px; padding: 6px 12px; border: 1px solid #ccc; font-family: inherit; font-size: 12px; cursor: pointer; }
.report-cancel-btn { background: #f5f5f5; color: #333; }
.report-submit-btn { background: #1a4a8a; color: #fff; border-color: #1a4a8a; }
.report-submit-btn:disabled { background: #b9c4d2; border-color: #b9c4d2; cursor: default; }
body.dark-mode .report-modal { background: #1b2a40; border-color: #4b72a8; color: #e7edf7; }
body.dark-mode .report-reason-btn { background: #142238; color: #e7edf7; border-color: #334866; }
body.dark-mode .report-reason-btn:hover, body.dark-mode .report-reason-btn.selected { background: #203b61; color: #fff; border-color: #7eb4ff; }
body.dark-mode .report-modal-actions { border-color: #334866; }

@media (max-width: 640px) {
  .desktop-only { display: none !important; }
  .sidebar { display: none !important; }
  .mobile-bottom-bar { display: flex; }
  body { padding-bottom: 50px; }
  .top-nav { overflow-x: auto; flex-wrap: nowrap; }
  .top-nav::-webkit-scrollbar { display: none; }
  .board-table .writer, .board-table .date { display: none; }
}