/* === GAEMANSYU THEME CSS === */
@import url('https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/static/pretendard.min.css');

:root, [data-theme="dark"] {
  --bg-primary: #0f1117;
  --bg-secondary: #1a1d27;
  --bg-card: #1e2130;
  --bg-hover: #252838;
  --border: #2a2d3a;
  --border-light: #333750;
  --text-primary: #e8e9ed;
  --text-secondary: #8b8fa3;
  --text-muted: #5c6078;
  --accent: #4f8cff;
  --accent-hover: #6ba0ff;
  --accent-dim: rgba(79,140,255,0.1);
  --hot: #ff4757;
  --new: #2ed573;
  --notice: #ffa502;
  --tag-humor: #ff6b81;
  --tag-issue: #7bed9f;
  --tag-celeb: #ffbe3c;
  --tag-coin: #f7931a;
  --tag-stock: #00c896;
  --tag-tip: #a282ff;
  --tag-humor-bg: rgba(255,107,129,0.15);
  --tag-issue-bg: rgba(123,237,159,0.15);
  --tag-celeb-bg: rgba(255,190,60,0.15);
  --tag-coin-bg: rgba(247,147,26,0.15);
  --tag-stock-bg: rgba(0,200,150,0.15);
  --tag-tip-bg: rgba(162,130,255,0.15);
  --tag-notice-bg: rgba(255,165,2,0.15);
  --badge-hot-bg: rgba(255,71,87,0.2);
  --badge-new-bg: rgba(46,213,115,0.2);
  --liked-bg: rgba(255,107,129,0.1);
  --like-red: #ff6b81;
  --banner-bg: linear-gradient(135deg,#1a1d40,#2a1a40);
  --header-bg: rgba(15,17,23,0.92);
  --mobile-header-bg: rgba(15,17,23,0.95);
  --radius: 8px;
  --radius-lg: 12px;
  --shadow: 0 2px 12px rgba(0,0,0,0.3);
  --header-h: 56px;
  --sidebar-w: 260px;
  --max-w: 1280px;
}

[data-theme="light"] {
  --bg-primary: #f0f2f5;
  --bg-secondary: #e4e6eb;
  --bg-card: #ffffff;
  --bg-hover: #f5f6f8;
  --border: #d8dae0;
  --border-light: #c8cad0;
  --text-primary: #1a1d24;
  --text-secondary: #4a4f5e;
  --text-muted: #8890a0;
  --accent: #2b6fea;
  --accent-hover: #4080f0;
  --accent-dim: rgba(43,111,234,0.08);
  --hot: #e83e4e;
  --new: #1baa55;
  --notice: #e8930b;
  --tag-humor: #d94a5e;
  --tag-issue: #1a9e55;
  --tag-celeb: #b08600;
  --tag-coin: #c07800;
  --tag-stock: #008c6a;
  --tag-tip: #6838dc;
  --tag-humor-bg: rgba(217,74,94,0.1);
  --tag-issue-bg: rgba(26,158,85,0.1);
  --tag-celeb-bg: rgba(200,140,0,0.1);
  --tag-coin-bg: rgba(200,120,10,0.1);
  --tag-stock-bg: rgba(0,160,120,0.1);
  --tag-tip-bg: rgba(120,80,220,0.1);
  --tag-notice-bg: rgba(232,147,11,0.1);
  --badge-hot-bg: rgba(232,62,78,0.12);
  --badge-new-bg: rgba(27,170,85,0.12);
  --liked-bg: rgba(217,74,94,0.08);
  --like-red: #d94a5e;
  --banner-bg: linear-gradient(135deg,#e8eeff,#f3e8ff);
  --header-bg: rgba(255,255,255,0.92);
  --mobile-header-bg: rgba(255,255,255,0.95);
  --shadow: 0 2px 12px rgba(0,0,0,0.08);
}

/* === RESET & BASE === */
* { margin:0; padding:0; box-sizing:border-box; }
*, *::before, *::after { transition: background-color 0.3s, border-color 0.3s, color 0.3s, box-shadow 0.3s; }

body {
  font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif !important;
  background: var(--bg-primary) !important;
  color: var(--text-primary) !important;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--text-secondary); text-decoration: none !important; transition: color 0.15s; }
a:hover { color: var(--accent); text-decoration: none !important; }

/* Hide nariya/gnuboard default elements */
#nt_lnb, #header_pc, #nt_title, #nt_footer,
#nt_sticky, .nt-links, #nt_header, #header_mo,
#search_mo, .breadcrumb { display: none !important; }

html { min-height: 100%; }
body { min-height: 100vh !important; display: flex !important; flex-direction: column !important; }
.wrapper { background: transparent !important; flex: 1 !important; display: flex !important; flex-direction: column !important; max-width: none !important; min-width: 0 !important; }
#nt_body { padding: 0 !important; margin: 0 !important; flex: 1 !important; }
.gms-footer { margin-top: auto !important; }
#nt_body > .nt-container,
#nt_body > .nt-container-wide { max-width: none !important; margin: 0 !important; padding: 0 !important; }

/* Override nariya row/col */
.na-row { margin-left: 0 !important; margin-right: 0 !important; }
.na-col { padding-left: 0 !important; padding-right: 0 !important; }
.row.na-row { display: block !important; }
[class*="col-md-"].na-col { max-width: 100% !important; flex: none !important; padding: 0 !important; width: 100% !important; }

/* Bootstrap dark theme overrides */
.form-control, input[type="text"], input[type="password"], input[type="email"], textarea, select {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border) !important;
  color: var(--text-primary) !important;
}
.form-control:focus, input:focus, textarea:focus, select:focus {
  background-color: var(--bg-secondary) !important;
  border-color: var(--accent) !important;
  color: var(--text-primary) !important;
  box-shadow: 0 0 0 2px var(--accent-dim) !important;
}
.btn-primary { background: var(--accent) !important; border-color: var(--accent) !important; }
.card, .table { background: var(--bg-card) !important; color: var(--text-primary) !important; border-color: var(--border) !important; }
.table th, .table td { border-color: var(--border) !important; color: var(--text-secondary) !important; }
.table thead th { background: var(--bg-secondary) !important; color: var(--text-primary) !important; }

/* gnuboard write form dark */
#bo_w, .write_div, #fwrite, #fwrite_comment { background: transparent !important; }
.write_div textarea { background: var(--bg-secondary) !important; color: var(--text-primary) !important; border-color: var(--border) !important; }

/* 회원가입/로그인/글쓰기 폼 다크 테마 */
.register, .login, .mbskin, .mbskin_wr,
#fregister, #flogin, #fregister_form,
.member_confirm, .password_lost { max-width: 600px; margin: 20px auto !important; }

.register, .login, .mbskin, .mbskin_wr, .member_confirm, .password_lost,
#fregister, #fregister_form, #flogin { color: var(--text-primary) !important; }

.register section, .register fieldset,
.mbskin .form_01, .mbskin .tbl_wrap,
#fregister_form .form_01, .login fieldset,
.tbl_wrap table { background: var(--bg-card) !important; border: 1px solid var(--border) !important; border-radius: var(--radius-lg) !important; overflow: hidden; }

.register h2, .mbskin h2, .mbskin h3,
#fregister_form h2, .login h2 { color: var(--text-primary) !important; }

.register p, .register label, .mbskin label,
.register legend, .register span,
#fregister_form p, #fregister_form label { color: var(--text-secondary) !important; }

.register textarea, .register input[type="text"],
.register input[type="password"], .register input[type="email"],
.register select,
#fregister_form textarea, #fregister_form input[type="text"],
#fregister_form input[type="password"], #fregister_form input[type="email"],
#fregister_form select,
.login input[type="text"], .login input[type="password"],
.mbskin input[type="text"], .mbskin input[type="password"],
.mbskin textarea, .mbskin select {
  background: var(--bg-secondary) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-primary) !important;
  border-radius: var(--radius) !important;
  padding: 8px 12px !important;
}
.register textarea { min-height: 100px; }

.register .btn_submit, .login .btn_submit,
#fregister_form .btn_submit, .mbskin .btn_submit,
.register input[type="submit"], .login input[type="submit"],
#fregister_form input[type="submit"],
.btn_01, .btn01 {
  background: var(--accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--radius) !important;
  padding: 10px 24px !important;
  cursor: pointer;
}

/* Bootstrap dark overrides - global */
.bg-light { background: var(--bg-secondary) !important; }
.bg-white { background: var(--bg-card) !important; }
.text-dark { color: var(--text-primary) !important; }
.text-muted { color: var(--text-muted) !important; }
.border, .border-top, .border-bottom { border-color: var(--border) !important; }
.list-group-item {
  background: var(--bg-card) !important;
  border-color: var(--border) !important;
  color: var(--text-primary) !important;
}
.table-bordered, .table-bordered th, .table-bordered td {
  border-color: var(--border) !important;
}
.table-bordered th, .table thead th, tr.bg-light th {
  background: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
}
.table-bordered td, .table tbody td {
  background: var(--bg-card) !important;
  color: var(--text-secondary) !important;
}
.custom-control-label { color: var(--text-secondary) !important; }
.custom-control-label span, .custom-control-label b { color: var(--text-primary) !important; }
.custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--accent) !important;
  border-color: var(--accent) !important;
}

/* 회원가입/로그인 페이지 */
.register { max-width: 640px !important; }
.register h5 { color: var(--text-primary) !important; }
.register textarea.bg-white,
.register textarea[readonly] {
  background: var(--bg-secondary) !important;
  color: var(--text-muted) !important;
  border: 1px solid var(--border) !important;
}
.register .form-control.border-0.bg-white {
  background: var(--bg-secondary) !important;
  color: var(--text-muted) !important;
  border: 1px solid var(--border) !important;
}
.btn-basic, .btn-outline-secondary, .btn-secondary {
  background: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
  border: 1px solid var(--border) !important;
}
.btn-basic:hover, .btn-outline-secondary:hover {
  background: var(--bg-hover) !important;
  color: var(--text-primary) !important;
}

/* 회원가입 폼 입력 */
.register .form-control,
.login-form .form-control,
.na-member .form-control {
  background: var(--bg-secondary) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-primary) !important;
}
.register .form-control:focus,
.login-form .form-control:focus,
.na-member .form-control:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 2px var(--accent-dim) !important;
}

/* 로그인 페이지 */
.login-form, .login { max-width: 400px; margin: 40px auto !important; }
.login .list-group-item, .login-form .list-group-item {
  background: var(--bg-card) !important;
  border-color: var(--border) !important;
}

/* BS4-Basic member skin overrides */
.na-member, .na-member .card, .na-member .card-body,
.na-member .form-group, .na-member .form-control-label {
  background: transparent !important;
  color: var(--text-primary) !important;
}
.na-member .card { border: 1px solid var(--border) !important; border-radius: var(--radius-lg) !important; }
.na-member .card-header { background: var(--bg-secondary) !important; border-bottom: 1px solid var(--border) !important; color: var(--text-primary) !important; }
.na-member .card-body { background: var(--bg-card) !important; }
.na-member label, .na-member .text-muted { color: var(--text-secondary) !important; }
.na-member a { color: var(--accent) !important; }
.na-member .btn-primary { background: var(--accent) !important; border-color: var(--accent) !important; }
.na-member .btn-secondary, .na-member .btn-outline-secondary {
  background: var(--bg-secondary) !important; color: var(--text-secondary) !important;
  border-color: var(--border) !important;
}

/* 약관 textarea */
.register textarea[readonly], #fregister textarea[readonly] {
  background: var(--bg-secondary) !important; color: var(--text-muted) !important;
  border: 1px solid var(--border) !important;
}

/* 그누보드 기본 폼 테이블 */
.tbl_wrap, .tbl_head01, .form_01 {
  background: var(--bg-card) !important; color: var(--text-primary) !important;
}
.tbl_head01 th { background: var(--bg-secondary) !important; color: var(--text-primary) !important; border-color: var(--border) !important; }
.tbl_head01 td { background: var(--bg-card) !important; color: var(--text-secondary) !important; border-color: var(--border) !important; }
.form_01 li { border-bottom: 1px solid var(--border) !important; }
.form_01 label, .form_01 .frm_info { color: var(--text-secondary) !important; }

/* 글쓰기 폼 */
#bo_w { max-width: var(--max-w); margin: 0 auto; padding: 20px 24px; }
.write_div { background: var(--bg-card) !important; border: 1px solid var(--border) !important; border-radius: var(--radius-lg) !important; padding: 20px !important; }
.write_div label, .write_div span { color: var(--text-secondary) !important; }
.write_div .btn-primary, .write_div input[type="submit"] { background: var(--accent) !important; border-color: var(--accent) !important; }

/* === PC HEADER === */
.gms-header {
  position: sticky; top: 0; z-index: 100;
  background: var(--header-bg); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border); height: var(--header-h);
}
.gms-header-inner {
  max-width: var(--max-w); margin: 0 auto; padding: 0 24px;
  display: flex; align-items: center; height: 100%; gap: 24px;
}
.gms-logo { font-size: 22px; font-weight: 800; letter-spacing: -0.5px; color: var(--accent); flex-shrink: 0; }
.gms-logo span { color: var(--text-primary); }
.gms-logo a { color: inherit; text-decoration: none; }
.gms-logo a:hover { color: inherit; }

.gms-nav { display: flex; gap: 4px; flex: 1; align-items: center; }
.gms-nav a, .gms-nav-dropdown > span {
  text-decoration: none; color: var(--text-secondary); font-size: 14px; font-weight: 500;
  padding: 6px 12px; border-radius: 6px; transition: all 0.15s; cursor: pointer;
}
.gms-nav a:hover, .gms-nav a.active, .gms-nav-dropdown:hover > span {
  color: var(--text-primary); background: var(--bg-hover);
}
.gms-nav a.active { color: var(--accent); }
.gms-nav-dropdown { position: relative; }
.gms-nav-dropdown > span::after { content: ' \25BE'; font-size: 10px; opacity: 0.5; }
.gms-nav-dropdown-menu {
  display: none; position: absolute; top: 100%; left: 0; margin-top: 6px;
  background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius);
  min-width: 140px; padding: 6px 0; box-shadow: var(--shadow); z-index: 200;
}
.gms-nav-dropdown:hover .gms-nav-dropdown-menu { display: block; }
.gms-nav-dropdown-menu a {
  display: block; padding: 7px 16px; font-size: 13px; color: var(--text-secondary);
  text-decoration: none; transition: all 0.12s;
}
.gms-nav-dropdown-menu a:hover { background: var(--bg-hover); color: var(--text-primary); }

.gms-search {
  display: flex; align-items: center; gap: 8px; background: var(--bg-secondary);
  border: 1px solid var(--border); border-radius: 24px; padding: 6px 14px; width: 220px; flex-shrink: 0;
}
.gms-search svg { color: var(--text-muted); flex-shrink: 0; }
.gms-search input {
  border: none; background: transparent; color: var(--text-primary); font-size: 13px;
  outline: none; width: 100%; font-family: inherit;
}
.gms-search input::placeholder { color: var(--text-muted); }

.gms-header-actions { display: flex; gap: 8px; align-items: center; flex-shrink: 0; }
.gms-btn-login {
  padding: 6px 16px; border-radius: 6px; font-size: 13px; font-weight: 600;
  border: 1px solid var(--border); background: transparent; color: var(--text-secondary);
  cursor: pointer; font-family: inherit; transition: all 0.15s;
}
.gms-btn-login:hover { border-color: var(--accent); color: var(--accent); }
.gms-btn-signup {
  padding: 6px 16px; border-radius: 6px; font-size: 13px; font-weight: 600;
  border: none; background: var(--accent); color: #fff; cursor: pointer; font-family: inherit;
}
.gms-btn-signup:hover { background: var(--accent-hover); }

.gms-theme-toggle {
  width: 36px; height: 36px; border-radius: 8px; border: 1px solid var(--border);
  background: var(--bg-secondary); color: var(--text-secondary); cursor: pointer;
  display: flex; align-items: center; justify-content: center; font-size: 16px;
  transition: all 0.15s;
}
.gms-theme-toggle:hover { border-color: var(--accent); color: var(--accent); }

/* === BODY LAYOUT === */
.gms-body {
  max-width: var(--max-w); margin: 0 auto; padding: 20px 24px;
  display: grid; grid-template-columns: 1fr var(--sidebar-w); gap: 20px;
}
.gms-body-full {
  max-width: var(--max-w); margin: 0 auto; padding: 20px 24px;
}

/* === SUB TABS === */
.gms-sub-tabs { display: flex; gap: 6px; margin-bottom: 16px; flex-wrap: wrap; }
.gms-sub-tab {
  padding: 5px 14px; border-radius: 20px; font-size: 13px; font-weight: 500;
  border: 1px solid var(--border); background: transparent; color: var(--text-secondary);
  cursor: pointer; font-family: inherit; transition: all 0.15s; text-decoration: none;
}
.gms-sub-tab:hover { border-color: var(--accent); color: var(--accent); }
.gms-sub-tab.active { background: var(--accent); border-color: var(--accent); color: #fff; }

/* === POST LIST === */
.gms-post-list {
  background: var(--bg-card); border-radius: var(--radius-lg);
  border: 1px solid var(--border); overflow: hidden;
}
.gms-post-list-header {
  display: grid; grid-template-columns: 50px 60px 1fr auto 80px 60px 100px;
  align-items: center; padding: 10px 16px; border-bottom: 1px solid var(--border);
  gap: 10px; font-size: 12px; color: var(--text-muted); background: var(--bg-secondary); font-weight: 500;
}
.gms-post-item {
  display: grid; grid-template-columns: 50px 60px 1fr auto 80px 60px 100px;
  align-items: center; padding: 10px 16px; border-bottom: 1px solid var(--border);
  transition: background 0.12s; gap: 10px; font-size: 13px; cursor: pointer;
}
.gms-post-item:hover { background: var(--bg-hover); }
.gms-post-item:last-child { border-bottom: none; }
.gms-post-item a { color: inherit; text-decoration: none; }

.gms-post-num { color: var(--text-muted); font-size: 12px; text-align: center; }
.gms-post-title-area { display: flex; align-items: center; gap: 6px; min-width: 0; }
.gms-post-title {
  color: var(--text-primary); white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; font-weight: 400;
}
.gms-post-title:hover { color: var(--accent); }
.gms-post-comment-count { color: var(--accent); font-size: 12px; font-weight: 600; flex-shrink: 0; }
.gms-post-thumb {
  width: 44px; height: 44px; border-radius: 6px; background: var(--bg-secondary);
  overflow: hidden; flex-shrink: 0;
}
.gms-post-thumb img { width: 100%; height: 100%; object-fit: cover; }
.gms-post-author { color: var(--text-muted); font-size: 12px; text-align: center; }
.gms-post-views { color: var(--text-muted); font-size: 12px; text-align: center; }
.gms-post-date { color: var(--text-muted); font-size: 12px; text-align: right; }

/* === TAGS & BADGES === */
.gms-tag {
  font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 4px;
  text-align: center; white-space: nowrap; display: inline-block;
}
.gms-tag-humor { background: var(--tag-humor-bg); color: var(--tag-humor); }
.gms-tag-issue { background: var(--tag-issue-bg); color: var(--tag-issue); }
.gms-tag-celeb { background: var(--tag-celeb-bg); color: var(--tag-celeb); }
.gms-tag-coin { background: var(--tag-coin-bg); color: var(--tag-coin); }
.gms-tag-stock { background: var(--tag-stock-bg); color: var(--tag-stock); }
.gms-tag-tip { background: var(--tag-tip-bg); color: var(--tag-tip); }
.gms-tag-notice { background: var(--tag-notice-bg); color: var(--notice); }

.gms-badge-hot, .gms-badge-new {
  font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 3px; flex-shrink: 0;
}
.gms-badge-hot { background: var(--badge-hot-bg); color: var(--hot); }
.gms-badge-new { background: var(--badge-new-bg); color: var(--new); }

/* === PAGINATION === */
.gms-pagination { display: flex; justify-content: center; gap: 4px; padding: 20px 0; }
.gms-pagination a, .gms-pagination strong {
  width: 32px; height: 32px; border-radius: 6px; border: 1px solid var(--border);
  background: var(--bg-card); color: var(--text-secondary); font-size: 13px;
  display: flex; align-items: center; justify-content: center; text-decoration: none !important;
}
.gms-pagination strong { background: var(--accent); border-color: var(--accent); color: #fff; }

/* 그누보드 페이지네이션 오버라이드 */
.gms-pagination nav, .gms-pagination .pg_wrap { display: flex; justify-content: center; }
.gms-pagination .pg {
  display: flex !important; flex-wrap: wrap; justify-content: center;
  gap: 4px !important; align-items: center;
}
.gms-pagination .pg .sound_only { display: none !important; }
.gms-pagination .pg_current,
.gms-pagination .pg_page,
.gms-pagination .pg_prev,
.gms-pagination .pg_next,
.gms-pagination .pg_start,
.gms-pagination .pg_end {
  display: inline-flex !important; align-items: center; justify-content: center;
  min-width: 32px; height: 32px; padding: 0 8px;
  border-radius: 6px; border: 1px solid var(--border);
  background: var(--bg-card); color: var(--text-secondary);
  font-size: 13px; font-weight: 500; text-decoration: none !important;
  cursor: pointer; transition: all 0.12s;
}
.gms-pagination .pg_current {
  background: var(--accent) !important; border-color: var(--accent) !important;
  color: #fff !important; font-weight: 700;
}
.gms-pagination .pg_page:hover,
.gms-pagination .pg_prev:hover,
.gms-pagination .pg_next:hover,
.gms-pagination .pg_start:hover,
.gms-pagination .pg_end:hover {
  background: var(--bg-hover); border-color: var(--accent); color: var(--accent);
}

/* === SIDEBAR === */
.gms-sidebar { display: flex; flex-direction: column; gap: 16px; }
.gms-widget {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); overflow: hidden;
}
.gms-widget-header {
  padding: 12px 16px; font-size: 13px; font-weight: 700;
  border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 6px;
}
.gms-widget-body { padding: 8px 0; }

.gms-rank-item {
  display: flex; align-items: center; gap: 10px; padding: 7px 16px;
  font-size: 13px; cursor: pointer; transition: background 0.12s;
}
.gms-rank-item:hover { background: var(--bg-hover); }
.gms-rank-item a { color: inherit; text-decoration: none; display: flex; align-items: center; gap: 10px; width: 100%; }
.gms-rank-num { width: 20px; font-weight: 700; font-size: 12px; color: var(--text-muted); text-align: center; flex-shrink: 0; }
.gms-rank-item:nth-child(-n+3) .gms-rank-num { color: var(--accent); }
.gms-rank-title { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-secondary); }
.gms-rank-item:hover .gms-rank-title { color: var(--text-primary); }
.gms-rank-count { font-size: 11px; color: var(--text-muted); flex-shrink: 0; }

.gms-realtime-item { display: flex; align-items: center; gap: 8px; padding: 6px 16px; font-size: 12px; }
.gms-realtime-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--new);
  animation: gms-pulse 2s infinite; flex-shrink: 0;
}
@keyframes gms-pulse { 0%,100%{opacity:1} 50%{opacity:0.3} }
.gms-realtime-text { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-secondary); }
.gms-realtime-text a { color: var(--text-secondary); text-decoration: none; }
.gms-realtime-text a:hover { color: var(--text-primary); }
.gms-realtime-time { color: var(--text-muted); font-size: 11px; flex-shrink: 0; }

.gms-banner {
  background: var(--banner-bg); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 24px 20px; text-align: center;
}
.gms-banner-emoji { font-size: 32px; margin-bottom: 8px; }
.gms-banner-title { font-size: 15px; font-weight: 700; margin-bottom: 4px; }
.gms-banner-desc { font-size: 12px; color: var(--text-muted); margin-bottom: 12px; }
.gms-banner-btn {
  display: inline-block; padding: 6px 20px; border-radius: 20px;
  font-size: 12px; font-weight: 600; background: var(--accent); color: #fff; text-decoration: none;
}

/* === DETAIL VIEW === */
.gms-detail-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); overflow: hidden;
}
.gms-breadcrumb {
  padding: 14px 24px; font-size: 12px; color: var(--text-muted);
  border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 6px;
}
.gms-breadcrumb a { color: var(--text-muted); text-decoration: none; }
.gms-breadcrumb a:hover { color: var(--accent); }
.gms-breadcrumb .sep { opacity: 0.4; }

.gms-detail-title-section { padding: 24px 28px 16px; }
.gms-detail-tag-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.gms-detail-title { font-size: 22px; font-weight: 700; line-height: 1.4; margin-bottom: 14px; }
.gms-detail-meta {
  display: flex; align-items: center; gap: 16px; font-size: 13px; color: var(--text-muted);
  padding-bottom: 16px; border-bottom: 1px solid var(--border); flex-wrap: wrap;
}
.gms-detail-meta .author-name { color: var(--accent); font-weight: 600; }

.gms-detail-content {
  padding: 28px; font-size: 15px; line-height: 1.85; color: var(--text-secondary);
}
.gms-detail-content p { margin-bottom: 18px; }
.gms-detail-content img { max-width: 100%; height: auto; border-radius: var(--radius); }
.gms-detail-content video {
  max-width: 100%; height: auto; border-radius: var(--radius);
  display: block; margin: 10px 0; background: var(--bg-secondary);
}
.gms-detail-content iframe {
  max-width: 100%; border: none; border-radius: var(--radius);
  display: block; margin: 10px 0;
}
#bo_v_con video { max-width: 100%; height: auto; display: block; margin: 10px 0; }
#bo_v_con iframe { max-width: 100%; border: none; display: block; margin: 10px 0; }

/* 에디터 인라인 스타일 강제 오버라이드 (다크모드) */
[data-theme="dark"] .gms-detail-content span,
[data-theme="dark"] .gms-detail-content p,
[data-theme="dark"] .gms-detail-content div,
[data-theme="dark"] .gms-detail-content li,
[data-theme="dark"] .gms-detail-content td,
[data-theme="dark"] .gms-detail-content a,
[data-theme="dark"] .gms-detail-content font,
[data-theme="dark"] .gms-detail-content b,
[data-theme="dark"] .gms-detail-content strong,
[data-theme="dark"] .gms-detail-content i,
[data-theme="dark"] .gms-detail-content em,
[data-theme="dark"] #bo_v_con span,
[data-theme="dark"] #bo_v_con p,
[data-theme="dark"] #bo_v_con div,
[data-theme="dark"] #bo_v_con font {
  color: var(--text-secondary) !important;
  background-color: transparent !important;
}
[data-theme="dark"] .gms-detail-content a,
[data-theme="dark"] #bo_v_con a { color: var(--accent) !important; }

/* 댓글 본문도 동일 적용 */
[data-theme="dark"] .gms-comment-body span,
[data-theme="dark"] .gms-comment-body font,
[data-theme="dark"] .gms-comment-body p {
  color: var(--text-secondary) !important;
  background-color: transparent !important;
}

.gms-reactions { display: flex; justify-content: center; gap: 12px; padding: 20px 28px 28px; }
.gms-reaction-btn {
  display: flex; align-items: center; gap: 6px; padding: 10px 24px; border-radius: 24px;
  border: 1px solid var(--border); background: var(--bg-secondary); color: var(--text-secondary);
  font-size: 14px; font-weight: 600; cursor: pointer; font-family: inherit; transition: all 0.15s;
}
.gms-reaction-btn:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-dim); }

.gms-detail-tags-share {
  padding: 16px 28px; border-top: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between;
}
.gms-hashtags { display: flex; gap: 6px; flex-wrap: wrap; }
.gms-hashtag { font-size: 12px; color: var(--accent); background: var(--accent-dim); padding: 3px 10px; border-radius: 12px; }
.gms-share-btns { display: flex; gap: 6px; }
.gms-share-btn {
  width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--border);
  background: var(--bg-secondary); display: flex; align-items: center; justify-content: center;
  font-size: 14px; cursor: pointer; transition: all 0.15s;
}
.gms-share-btn:hover { border-color: var(--accent); background: var(--accent-dim); }

.gms-post-nav { border-top: 1px solid var(--border); display: flex; }
.gms-post-nav-item {
  flex: 1; padding: 14px 24px; display: flex; flex-direction: column; gap: 2px;
  cursor: pointer; transition: background 0.12s; text-decoration: none;
}
.gms-post-nav-item:first-child { border-right: 1px solid var(--border); }
.gms-post-nav-item:hover { background: var(--bg-hover); }
.gms-post-nav-label { font-size: 11px; color: var(--text-muted); }
.gms-post-nav-title { font-size: 13px; color: var(--text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* === COMMENTS === */
.gms-comment-section {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); overflow: hidden; margin-top: 16px;
}
.gms-comment-header {
  padding: 16px 24px; font-size: 14px; font-weight: 700;
  border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 8px;
}
.gms-comment-count { color: var(--accent); }
.gms-comment-write {
  padding: 16px 24px; border-bottom: 1px solid var(--border);
  display: flex; gap: 12px; align-items: flex-start;
}
.gms-comment-avatar {
  width: 36px; height: 36px; border-radius: 50%; background: var(--bg-secondary);
  display: flex; align-items: center; justify-content: center; font-size: 16px;
  flex-shrink: 0; border: 1px solid var(--border);
}
.gms-comment-textarea {
  width: 100%; min-height: 72px; background: var(--bg-secondary);
  border: 1px solid var(--border); border-radius: var(--radius); padding: 10px 14px;
  color: var(--text-primary); font-size: 13px; font-family: inherit;
  resize: vertical; outline: none; line-height: 1.5;
}
.gms-comment-textarea:focus { border-color: var(--accent); }
.gms-comment-textarea::placeholder { color: var(--text-muted); }
.gms-comment-submit {
  padding: 6px 20px; border-radius: 6px; border: none;
  background: var(--accent); color: #fff; font-size: 13px; font-weight: 600;
  cursor: pointer; font-family: inherit;
}
.gms-comment-item { padding: 16px 24px; border-bottom: 1px solid var(--border); }
.gms-comment-item:last-child { border-bottom: none; }
.gms-comment-top { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.gms-comment-author { font-size: 13px; font-weight: 600; color: var(--text-primary); }
.gms-comment-time { font-size: 11px; color: var(--text-muted); }
.gms-comment-best {
  font-size: 10px; font-weight: 700; color: var(--notice);
  background: var(--tag-notice-bg); padding: 1px 6px; border-radius: 3px;
}
.gms-comment-body { font-size: 14px; color: var(--text-secondary); line-height: 1.6; margin-bottom: 8px; }
.gms-comment-actions { display: flex; gap: 12px; font-size: 12px; color: var(--text-muted); }
.gms-comment-action { cursor: pointer; display: flex; align-items: center; gap: 3px; transition: color 0.12s; }
.gms-comment-action:hover { color: var(--accent); }
.gms-comment-reply {
  margin-left: 46px; padding: 14px 20px; background: var(--bg-secondary);
  border-radius: var(--radius); margin-top: 10px; border-left: 3px solid var(--accent-dim);
}

/* === FOOTER === */
.gms-footer {
  background: var(--bg-card); border-top: 1px solid var(--border); margin-top: 40px;
}
.gms-footer-inner {
  max-width: var(--max-w); margin: 0 auto; padding: 32px 24px 24px;
}
.gms-footer-top {
  display: flex; justify-content: space-between; gap: 40px; padding-bottom: 24px;
  border-bottom: 1px solid var(--border); flex-wrap: wrap;
}
.gms-footer-brand { flex-shrink: 0; }
.gms-footer-logo { font-size: 20px; font-weight: 800; color: var(--accent); margin-bottom: 8px; }
.gms-footer-logo span { color: var(--text-primary); }
.gms-footer-desc { font-size: 12px; color: var(--text-muted); line-height: 1.6; max-width: 280px; }
.gms-footer-links { display: flex; gap: 40px; flex-wrap: wrap; }
.gms-footer-col h4 { font-size: 13px; font-weight: 700; color: var(--text-primary); margin-bottom: 10px; }
.gms-footer-col a {
  display: block; font-size: 12px; color: var(--text-muted); text-decoration: none; padding: 3px 0; transition: color 0.12s;
}
.gms-footer-col a:hover { color: var(--accent); }
.gms-footer-bottom {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 20px; flex-wrap: wrap; gap: 12px;
}
.gms-footer-copy { font-size: 11px; color: var(--text-muted); }
.gms-footer-legal { display: flex; gap: 16px; flex-wrap: wrap; }
.gms-footer-legal a { font-size: 11px; color: var(--text-muted); text-decoration: none; }
.gms-footer-legal a:hover { color: var(--accent); }
.gms-footer-legal a.bold { font-weight: 700; color: var(--text-secondary); }

/* === INFO PAGES === */
.gms-info-page-body {
  max-width: var(--max-w); margin: 0 auto; padding: 20px 24px;
}
.gms-info-page-card {
  background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg);
  overflow: hidden; max-width: 800px; margin: 0 auto;
}
.gms-info-page-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 20px 28px; border-bottom: 1px solid var(--border);
}
.gms-info-page-title { font-size: 18px; font-weight: 700; }
.gms-info-page-back {
  padding: 6px 16px; border-radius: 6px; font-size: 13px; font-weight: 500;
  border: 1px solid var(--border); background: transparent; color: var(--text-secondary);
  cursor: pointer; font-family: inherit; transition: all 0.15s; text-decoration: none;
}
.gms-info-page-back:hover { border-color: var(--accent); color: var(--accent); }
.gms-info-page-content { padding: 28px; font-size: 14px; line-height: 1.8; color: var(--text-secondary); }
.gms-info-page-content h3 { font-size: 15px; font-weight: 700; color: var(--text-primary); margin: 20px 0 8px; }
.gms-info-page-content h3:first-child { margin-top: 0; }
.gms-info-page-content p { margin-bottom: 12px; }
.gms-info-page-content ul { margin: 0 0 12px 20px; }
.gms-info-page-content li { margin-bottom: 4px; font-size: 13px; }
.gms-info-page-content .info-table { width: 100%; border-collapse: collapse; margin: 12px 0; }
.gms-info-page-content .info-table th, .gms-info-page-content .info-table td {
  padding: 10px 14px; border: 1px solid var(--border); font-size: 13px; text-align: left;
}
.gms-info-page-content .info-table th { background: var(--bg-secondary); color: var(--text-primary); font-weight: 600; }
.gms-info-page-content .faq-item { margin-bottom: 16px; }
.gms-info-page-content .faq-q {
  font-size: 14px; font-weight: 600; color: var(--text-primary);
  padding: 10px 14px; background: var(--bg-secondary); border-radius: var(--radius);
  display: flex; align-items: center; gap: 8px;
}
.gms-info-page-content .faq-q::before { content: 'Q.'; color: var(--accent); font-weight: 700; }
.gms-info-page-content .faq-a { padding: 10px 14px 10px 36px; font-size: 13px; line-height: 1.7; }
.gms-info-page-content .contact-card {
  background: var(--bg-secondary); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 24px; margin: 12px 0; text-align: center;
}
.gms-info-page-content .contact-email { color: var(--accent); font-weight: 600; font-size: 16px; }
.gms-info-page-content .notice-item { border-bottom: 1px solid var(--border); padding: 16px 0; }
.gms-info-page-content .notice-item:last-child { border-bottom: none; }
.gms-info-page-content .notice-item-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.gms-info-page-content .notice-item-title { font-size: 14px; font-weight: 600; color: var(--text-primary); }
.gms-info-page-content .notice-item-date { font-size: 12px; color: var(--text-muted); }
.gms-info-page-content .notice-item-desc { font-size: 13px; color: var(--text-secondary); margin-top: 4px; }

/* === MOBILE (< 768px) === */
@media (max-width: 768px) {
  .gms-header { display: none; }
  .gms-footer-links { gap: 24px; }
  .gms-footer-top { flex-direction: column; gap: 20px; }
  .gms-footer-bottom { flex-direction: column; text-align: center; }
  .gms-footer-legal { justify-content: center; }

  .gms-body { grid-template-columns: 1fr !important; padding: 0 !important; display: block !important; }
  .gms-body main { display: block !important; width: 100% !important; }
  .gms-sidebar { display: none !important; }
  .gms-body-full { padding: 0; }

  /* Mobile Header */
  .gms-m-header {
    position: sticky; top: 0; z-index: 100;
    background: var(--mobile-header-bg); backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border); padding: 12px 16px;
    display: flex; align-items: center; justify-content: space-between;
  }
  .gms-m-logo { font-size: 18px; font-weight: 800; color: var(--accent); }
  .gms-m-logo span { color: var(--text-primary); }
  .gms-m-header-icons { display: flex; gap: 12px; }
  .gms-m-icon-btn {
    width: 36px; height: 36px; border-radius: 8px; border: 1px solid var(--border);
    background: var(--bg-secondary); color: var(--text-secondary);
    display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 16px;
    text-decoration: none;
  }

  /* Mobile Nav Scroll */
  .gms-m-nav-scroll {
    display: flex; gap: 4px; padding: 10px 16px; overflow-x: auto;
    border-bottom: 1px solid var(--border); scrollbar-width: none;
  }
  .gms-m-nav-scroll::-webkit-scrollbar { display: none; }
  .gms-m-nav-item {
    padding: 5px 14px; border-radius: 20px; font-size: 13px; font-weight: 500;
    white-space: nowrap; border: 1px solid var(--border); background: transparent;
    color: var(--text-secondary); cursor: pointer; font-family: inherit; text-decoration: none;
  }
  .gms-m-nav-item.active { background: var(--accent); border-color: var(--accent); color: #fff; }

  /* Mobile Post Item */
  .gms-m-post-item {
    display: flex; align-items: flex-start; gap: 10px; padding: 12px 16px;
    border-bottom: 1px solid var(--border); cursor: pointer;
  }
  .gms-m-post-item a { color: inherit; text-decoration: none; display: flex; align-items: flex-start; gap: 10px; width: 100%; }
  .gms-m-post-content { flex: 1; min-width: 0; }
  .gms-m-post-tag-row { display: flex; align-items: center; gap: 6px; margin-bottom: 3px; }
  .gms-m-post-tag { font-size: 10px; font-weight: 600; padding: 1px 6px; border-radius: 3px; }
  .gms-m-post-title { font-size: 14px; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 4px; line-height: 1.4; }
  .gms-m-post-meta { font-size: 11px; color: var(--text-muted); display: flex; gap: 10px; align-items: center; }
  .gms-m-post-thumb {
    width: 56px; height: 56px; border-radius: 6px; background: var(--bg-secondary);
    flex-shrink: 0; overflow: hidden; margin-top: 2px;
  }
  .gms-m-post-thumb img { width: 100%; height: 100%; object-fit: cover; }

  /* Mobile Bottom Nav */
  .gms-m-bottom-nav {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 100;
    background: var(--mobile-header-bg); backdrop-filter: blur(12px);
    border-top: 1px solid var(--border); display: flex; justify-content: space-around;
    padding: 8px 0 env(safe-area-inset-bottom, 20px);
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    will-change: transform;
  }
  .gms-m-bottom-item {
    display: flex; flex-direction: column; align-items: center; gap: 2px;
    font-size: 10px; color: var(--text-muted); cursor: pointer; padding: 4px 8px; text-decoration: none;
  }
  .gms-m-bottom-item.active { color: var(--accent); }
  .gms-m-bottom-item svg { width: 22px; height: 22px; }

  /* Mobile FAB */
  .gms-m-fab {
    position: fixed; bottom: 80px; right: 16px; width: 48px; height: 48px;
    border-radius: 50%; background: var(--accent); color: #fff;
    display: flex; align-items: center; justify-content: center; font-size: 24px;
    box-shadow: 0 4px 20px rgba(79,140,255,0.4); cursor: pointer; z-index: 50;
    text-decoration: none;
  }

  /* Mobile Detail Header */
  .gms-m-detail-header {
    position: sticky; top: 0; z-index: 100;
    background: var(--mobile-header-bg); backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border); padding: 12px 16px;
    display: flex; align-items: center; gap: 12px;
  }
  .gms-m-back-btn {
    width: 32px; height: 32px; border-radius: 8px; border: 1px solid var(--border);
    background: var(--bg-secondary); display: flex; align-items: center; justify-content: center;
    font-size: 16px; cursor: pointer; flex-shrink: 0; color: var(--text-primary); text-decoration: none;
  }
  .gms-m-detail-header-title {
    flex: 1; font-size: 14px; font-weight: 600;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }

  .gms-post-list-header { display: none; }
  .gms-post-list { border-radius: 0; border-left: none; border-right: none; }
  .gms-post-item { display: none; }

  /* 모바일: sub-tabs 숨김 (m-nav-scroll이 대체) */
  .gms-sub-tabs { display: none !important; }

  /* 모바일: detail view 정상 표시 */
  .gms-detail-card { border-radius: 0; border-left: none; border-right: none; }
  .gms-detail-title-section { padding: 16px; }
  .gms-detail-title { font-size: 18px; }
  .gms-detail-content { padding: 16px; font-size: 14px; }
  .gms-detail-meta { gap: 10px; font-size: 12px; }
  .gms-reactions { padding: 14px 16px; gap: 8px; }
  .gms-reaction-btn { padding: 8px 16px; font-size: 13px; }
  .gms-detail-tags-share { padding: 12px 16px; }
  .gms-post-nav-item { padding: 12px 16px; }
  .gms-breadcrumb { padding: 10px 16px; }

  /* 모바일: comment */
  .gms-comment-section { border-radius: 0; border-left: none; border-right: none; margin-top: 8px; }
  .gms-comment-write { padding: 12px 16px; }
  .gms-comment-item { padding: 12px 16px; }
  .gms-comment-reply { margin-left: 20px; }

  /* 모바일: 글쓰기 버튼 */
  .gms-btn-signup { font-size: 13px !important; padding: 8px 16px !important; }

  body { padding-bottom: 60px; }
}

/* Desktop: hide mobile elements */
@media (min-width: 769px) {
  .gms-m-header,
  .gms-m-nav-scroll,
  .gms-m-bottom-nav,
  .gms-m-fab,
  .gms-m-detail-header,
  .gms-m-post-list { display: none !important; }
}

/* === MOBILE SLIDE MENU === */
.gms-m-menu-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.5); z-index: 999; display: none;
}
.gms-m-menu-overlay.active { display: block; }
.gms-m-menu {
  position: fixed; top: 0; right: -280px; width: 280px; height: 100%;
  background: var(--bg-card); z-index: 1000; transition: right 0.3s ease;
  overflow-y: auto; border-left: 1px solid var(--border);
}
.gms-m-menu.active { right: 0; }
.gms-m-menu-header {
  padding: 16px 20px; border-bottom: 1px solid var(--border);
  display: flex; justify-content: space-between; align-items: center;
}
.gms-m-menu-close {
  width: 32px; height: 32px; border-radius: 8px; border: 1px solid var(--border);
  background: var(--bg-secondary); display: flex; align-items: center; justify-content: center;
  cursor: pointer; font-size: 16px; color: var(--text-primary);
}
.gms-m-menu-nav { padding: 8px 0; }
.gms-m-menu-nav a {
  display: block; padding: 10px 20px; font-size: 14px; font-weight: 500;
  color: var(--text-secondary); text-decoration: none; transition: all 0.12s;
}
.gms-m-menu-nav a:hover { background: var(--bg-hover); color: var(--text-primary); }
.gms-m-menu-nav .gms-m-menu-sub { padding-left: 36px; font-size: 13px; }
.gms-m-menu-divider { height: 1px; background: var(--border); margin: 8px 0; }

/* Override nariya styles */
.na-row, .na-col { margin: 0 !important; padding: 0 !important; }
#nt_body .nt-container { max-width: none; padding: 0 !important; margin: 0 !important; }