/**
 * copytrade.co.kr — 공통 + 공개 레이아웃 + 대시보드(좌측 메뉴) + 모바일 햄버거
 */
:root {
    --bg: #f5f5f5;
    --panel: #ffffff;
    --line: #dddddd;
    --primary: #d32f2f;
    --primary-dark: #b71c1c;
    --text: #1a1a1a;
    --muted: #616161;
    --ok: #12b76a;
    --warn: #f79009;
    --danger: #f04438;
    /* [유지보수] 사이트 전체(PC) 최대 가로 — 비로그인·로그인·헤더 상한을 이 값 하나로 통일. 변경 시 아래만 수정 */
    --site-max-width: 1440px;
    --sidebar-w: 280px;
    /* 로그인 후 오른쪽 본문 열: 전체 폭에서 좌측 메뉴 폭을 뺀 값(사이드바 폭 변경 시 자동 반영) */
    --content-max: calc(var(--site-max-width) - var(--sidebar-w));
    /* 상단 헤더 안쪽·대시보드 그리드 바깥 상한 = 사이트 전체와 동일 */
    --layout-max: var(--site-max-width);
    /* [작업내용] sticky 상단 헤더 높이 기준 — PC에서 헤더를 키울 때 사이드바 top·100vh 계산·scroll-padding과 동기화 */
    --header-bar-height: 76px;
}

* { box-sizing: border-box; }
html {
    /* [수정] overflow-x:hidden 제거 — 모바일에서 html에 overflow:hidden이 있으면
     * position:fixed 요소의 기준이 viewport 대신 html 요소가 되어
     * 햄버거 버튼 등 고정 위치 요소가 오작동함. clip은 해당 문제 없음. */
    overflow-x: clip;
    scroll-padding-top: var(--header-bar-height);
    /* [레이아웃] 1440px body 바깥 좌우 여백 색상 — 1920px 모니터에서 좌우 240px씩 노출 */
    background: #ffffff;
}
body {
    /* [레이아웃] body 자체를 --site-max-width(1440px) + 가운데 정렬 — 가장 확실한 전체 폭 제한 방법
     * site-root-max와 이중 보호: body 단에서 먼저 폭을 막고, 내부 래퍼도 동일하게 제한
     * html background(#555555)가 body 바깥 좌우에 노출되어 센터 정렬 경계가 명확히 시각화됨 */
    margin: 0 auto;
    max-width: var(--site-max-width);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans KR", sans-serif;
    color: var(--text);
    background: var(--bg);
    line-height: 1.5;
}

/* ===== 헤더 — sticky: .site-root-max / .public-outer 안에 있어 뷰포트 fixed 와 달리 --site-max-width 셸을 벗어나지 않음 ===== */
.site-header {
    padding: 0;
    background: transparent;
    box-shadow: none;
    position: sticky;
    top: 0;
    z-index: 1100;
    width: 100%;
    box-sizing: border-box;
}
.header-inner {
    width: 100%;
    max-width: none;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 12px 20px;
    box-sizing: border-box;
    position: relative;
    background: linear-gradient(135deg, #1f1f1f, #424242);
    color: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.12);
}
.logo-link {
    color: #fff;
    text-decoration: none;
    font-size: 22px;
    font-weight: 700;
}
.logo-link:hover { opacity: 0.9; }
.site-logo {
    display: block;
    height: 36px;
    width: auto;
    max-height: 40px;
    vertical-align: middle;
}
/* [작업내용] 관리자 페이지(body.admin-page) 헤더 — 업로드 로고를 정사각 원형으로(가로형도 object-fit:cover로 중앙 크롭) */
body.admin-page .site-logo.site-logo--round {
    width: 40px;
    height: 40px;
    max-height: none;
    border-radius: 50%;
    object-fit: cover;
    object-position: center;
    flex-shrink: 0;
}
.header-nav {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    flex-shrink: 0;
    min-width: 0;
}
.header-nav a {
    color: rgba(255,255,255,0.95);
    text-decoration: none;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
}
.header-nav a:hover { background: rgba(255,255,255,0.2); }
.header-right {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
    min-width: 0;
}
.header-right .btn { padding: 8px 16px; border-radius: 8px; font-size: 14px; text-decoration: none; border: none; cursor: pointer; white-space: nowrap; }
.header-right .btn-outline { background: transparent; border: 1px solid rgba(255,255,255,0.8); color: #fff; }
.header-right .btn-outline:hover { background: rgba(255,255,255,0.2); }
.lang-switch { font-size: 13px; }
.lang-switch a { color: rgba(255,255,255,0.9); text-decoration: none; margin: 0 4px; }
.lang-switch a:hover { text-decoration: underline; }
.user-info, .point-badge { font-size: 14px; color: rgba(255,255,255,0.95); white-space: nowrap; }
.point-badge { background: rgba(255,255,255,0.2); padding: 5px 12px; border-radius: 999px; }
/* [수정] 햄버거 아이콘은 터치 영역 확보를 위해 18px 유지 (11px 통일 정책에서 예외) */
.hamburger { display: none; background: none; border: none; color: #fff; font-size: 18px; cursor: pointer; padding: 4px 6px; }

/* ===== 사이트 가로 셸: 비로그인(.public-outer.site-root-max) + 로그인/관리자(.site-root-max) 공통 ===== */
.site-root-max,
body.public .public-outer {
    width: 100%;
    max-width: var(--site-max-width);
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    position: relative;
    /* [레이아웃] 1440px 박스 내부 배경 + 짧은 페이지 높이 보장
     * overflow-x:clip — 가로 넘침 강제 차단. hidden과 달리 스크롤 컨테이너 생성 없음 → sticky 헤더·dropdown 정상 작동 */
    background: var(--bg);
    min-height: 100vh;
    overflow-x: clip;
}
/* 비로그인: 좌측 메뉴 없음, 본문은 sticky 헤더 아래(별도 margin-top 불필요) */
.public-main {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    padding: 20px 16px 40px;
    min-width: 0;
    min-height: calc(100vh - var(--header-bar-height));
}
body.public .public-main .main-body,
body.public .public-main .content-center { max-width: 100%; margin-left: auto; margin-right: auto; }
body.public .public-main .landing-page { max-width: 100%; }
body.dashboard .main-page .main-content { max-width: none; margin: 0 auto; }
/* 콘텐츠 페이지 가운데 정렬 — 상한은 --site-max-width(로그인 시 본문 폭은 .dashboard-layout 그리드 2열이 한정) */
.content-center { max-width: var(--site-max-width); margin-left: auto; margin-right: auto; }
.content-center-narrow { max-width: 900px; margin-left: auto; margin-right: auto; }
.site-layout .main-body:only-child,
.site-layout > .main-body { max-width: var(--site-max-width); margin-left: auto; margin-right: auto; }
.hero {
    background: linear-gradient(135deg, #2d2d2d 0%, #111 100%);
    background-size: cover;
    background-position: center;
    color: #fff;
    padding: 48px 24px;
    border-radius: 12px;
    margin-bottom: 24px;
    text-align: center;
}
.hero-banner {
    min-height: 280px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    text-align: left;
}
/* 자동매매 페이지 전용 히어로 — 글자 오른쪽 정렬 */
.hero-auto-trading {
    align-items: flex-end;
    text-align: right;
}
.hero-auto-trading .hero-sub-title { margin-left: auto; }
/* 다운로드 페이지 전용 히어로 — 배경 이미지는 페이지에서 인라인으로 설정(image/main4.png) */
.hero-download { }
/* [작업내용] 커뮤니티 페이지 히어로 — 제목·게시판별 최신글 문구 가운데 정렬 */
.hero-bbs { align-items: center; text-align: center; }
.hero-bbs .hero-sub-title { margin-left: auto; margin-right: auto; }
.hero-bbs .hero-cta { justify-content: center; }
.hero-main-title {
    margin: 0 0 16px;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.35;
    text-shadow: 0 1px 3px rgba(0,0,0,0.4);
    /* [반응형] 모바일에서 긴 제목이 한 단어씩 줄바꿈되도록 */
    word-break: keep-all;
    overflow-wrap: break-word;
}
.hero-sub-title {
    margin: 0 0 32px;
    font-size: 16px;
    line-height: 1.7;
    opacity: 0.95;
    max-width: 560px;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}
.hero-cta {
    margin: 0;
    padding-top: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: flex-start;
}
.hero-cta .btn { padding: 12px 20px; font-size: 15px; font-weight: 600; }
.hero-cta-primary { background: var(--primary) !important; color: #fff !important; border-color: var(--primary) !important; }
.hero-cta-primary:hover { filter: brightness(1.1); }
.hero-cta-secondary { border-color: rgba(255,255,255,0.9); color: #fff; background: rgba(255,255,255,0.15); }
.hero-cta-secondary:hover { background: rgba(255,255,255,0.25); color: #fff; }
.hero h1 { margin: 0 0 8px; font-size: 24px; font-weight: 700; }
.hero p { margin: 0; opacity: 0.95; font-size: 15px; }
.landing-page { max-width: var(--site-max-width); margin: 0 auto; padding-bottom: 40px; }

/* ===== 홈 랜딩 (전체 사이트 소개, 라이프업 스타일) ===== */
.home-landing-page { max-width: 100%; padding-bottom: 48px; }
/* [작업내용] 히어로 섹션 이미지를 라운드 처리해 노출 */
.home-hero {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
    color: #fff;
    padding: 64px 24px 72px;
    text-align: center;
    margin: 0 16px 40px;
    border-radius: 20px;
    overflow: hidden;
}
.home-hero-inner { max-width: 800px; margin: 0 auto; }
.home-hero-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.4;
    margin: 0 0 20px;
    text-shadow: 0 1px 3px rgba(0,0,0,0.3);
    word-break: keep-all;
    overflow-wrap: break-word;
}
.home-hero-sub {
    font-size: 16px;
    line-height: 1.7;
    opacity: 0.95;
    margin: 0 0 32px;
}
.home-hero-cta { margin: 0; display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.home-cta-primary { padding: 14px 24px !important; font-size: 16px !important; font-weight: 600 !important; }
.home-cta-secondary { border-color: rgba(255,255,255,0.8) !important; color: #fff !important; background: rgba(255,255,255,0.1) !important; padding: 14px 24px !important; }
.home-cta-secondary:hover { background: rgba(255,255,255,0.2) !important; color: #fff !important; }
.home-section { margin-top: 48px; }
.home-section-title { font-size: 24px; font-weight: 700; color: var(--text); margin: 0 0 12px; text-align: center; line-height: 1.35; }
.home-section-desc { text-align: center; color: var(--muted); margin: 0 0 28px; font-size: 15px; }
.home-services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 16px;
}
.home-service-card {
    display: block;
    text-decoration: none;
    color: inherit;
    padding: 24px;
    transition: box-shadow 0.2s, transform 0.2s;
}
.home-service-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.1); transform: translateY(-2px); }
.home-service-icon { font-size: 36px; display: block; margin-bottom: 16px; }
.home-service-title { font-size: 18px; font-weight: 700; margin: 0 0 10px; color: var(--text); }
.home-service-desc { font-size: 14px; color: var(--muted); line-height: 1.6; margin: 0 0 12px; }
.home-service-link { font-size: 14px; font-weight: 600; color: var(--primary); }
.home-value-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 16px; }
.home-value-card { padding: 24px; text-align: center; }
.home-value-card-title { font-size: 18px; font-weight: 700; margin: 0 0 10px; color: var(--primary); }
.home-value-card-desc { font-size: 14px; color: var(--muted); margin: 0; line-height: 1.6; }
.home-cta-block { text-align: center; padding: 40px 0 20px; }
.home-cta-block .btn { margin: 4px 6px; }
@media (max-width: 900px) {
    .home-services-grid { grid-template-columns: repeat(2, 1fr); }
    .home-value-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .home-hero-title { font-size: 22px; word-break: keep-all; }
    .home-hero-sub { font-size: 14px; word-break: keep-all; }
    /* [수정] 스마트폰: 히어로 좌우 여백 10px 추가 → 배경 이미지가 좁은 카드 형태로 더 잘 보임 */
    .home-hero { padding: 32px 14px 36px; margin: 0 10px 20px; border-radius: 14px; }
    /* [수정] hero-banner(카피매매·자동매매·다운로드 등 서브페이지): 좌우 여백 추가 + 최소 높이 축소 */
    .hero.hero-banner {
        margin-left: 10px;
        margin-right: 10px;
        min-height: 200px;
        padding: 32px 16px;
        border-radius: 14px;
    }
    .home-services-grid { grid-template-columns: 1fr; }
    /* [반응형] 카드·이미지 가로 넘침 방지 */
    .card, .home-service-card, .copy-cta-card, .landing-target-card { max-width: 100%; box-sizing: border-box; }
    img { max-width: 100%; height: auto; }
    /* [반응형] hero 제목 줄바꿈 보정 */
    .hero-main-title { font-size: 22px; word-break: keep-all; }
    .hero-sub-title { font-size: 14px; word-break: keep-all; }
    .landing-headline-main { font-size: 20px; }
}

.landing-section { margin-top: 48px; }
.landing-section-title { font-size: 20px; color: var(--primary); margin: 0 0 8px; }
/* 홈: 서비스 특징·카피트레이딩 경험담 — 제목만 가운데 정렬 */
.landing-features-grid .landing-section-title,
.landing-success-stories .landing-section-title { text-align: center; }
/* 카피트레이딩·자동매매: 누구를 위한 서비스인가요? / 무엇을 원하시나요? — 제목만 가운데 정렬 */
.landing-targets-row .landing-section-title { text-align: center; }
/* 비교 불가능한 알고데이터랩만의 강점 등 — 제목 가운데 정렬 */
.landing-section-title-center .landing-section-title { text-align: center; }
.landing-section-desc { color: var(--muted); margin: 0 0 16px; font-size: 14px; }
/* [반응형] 스마트폰에서 FAQ 섹션·제목·항목이 반드시 보이도록 (index.php 자주 묻는 질문) */
@media (max-width: 768px) {
    .faq-accordion-section { display: block !important; overflow: visible !important; }
    .faq-accordion-section .landing-section-title { display: block !important; font-size: 18px; font-weight: 700; color: var(--primary); margin: 0 0 10px; }
    .faq-accordion-section .landing-section-desc { display: block !important; margin: 0 0 20px; }
    .faq-accordion-section .faq-accordion-category { display: block !important; overflow: visible !important; }
    .faq-accordion-section .faq-accordion-category-toggle { display: flex !important; min-height: 48px; font-size: 15px; }
    .faq-accordion-section .faq-item-question { display: flex !important; min-height: 44px; }
    .faq-accordion-section .faq-item-question-text { display: block !important; }
    body.dashboard .faq-accordion-section { margin-bottom: 32px; padding-bottom: 24px; }
}
.landing-headline { text-align: center; padding: 32px 0 24px; }
.landing-headline-main { font-size: 26px; font-weight: 700; color: var(--text); margin: 0 0 16px; line-height: 1.4; word-break: keep-all; overflow-wrap: break-word; }
.landing-headline-sub { font-size: 16px; color: var(--muted); max-width: 720px; margin: 0 auto; line-height: 1.7; }
.landing-target-card { padding: 24px; }
.landing-targets-row .landing-target-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 28px 24px;
}
.landing-targets-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-top: 16px;
}
@media (max-width: 768px) {
    .landing-targets-grid { grid-template-columns: 1fr; }
    .landing-target-card-full { grid-column: 1 !important; }
}
/* 자동매매 페이지: 강좌 카드 1줄 전체(2칸) */
.landing-auto-trading .landing-target-card-full {
    grid-column: 1 / -1;
}
.landing-card-visual {
    margin-bottom: 16px;
}
/* [작업내용] 카피트레이딩 마스터 EA 카드 — 심플 파스텔 박스 + 아이콘 */
.landing-card-visual-master-ea {
    width: 100%;
    height: 120px;
    border-radius: 14px;
    border: 1px solid rgba(134, 55, 236, 0.18);
    background: linear-gradient(135deg, rgba(8, 182, 204, 0.14) 0%, rgba(134, 55, 236, 0.12) 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 24px;
    overflow: hidden;
}
.landing-master-ea-icon {
    width: 72px;
    height: 72px;
    object-fit: contain;
    filter: drop-shadow(0 3px 6px rgba(90, 108, 170, 0.18));
}
/* [작업내용] 마스터 EA 카드 박스 내부 문구를 강조해 즉시 이해되도록 표시 */
.landing-master-ea-visual-text {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-left: 24px;
    color: #2f267c;
    line-height: 1.35;
    word-break: keep-all;
}
.landing-master-ea-visual-text strong {
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.02em;
}
.landing-master-ea-visual-text span {
    font-size: 15px;
    font-weight: 700;
    color: #483f8b;
}
@media (max-width: 768px) {
    .landing-card-visual-master-ea {
        height: 104px;
        padding-left: 18px;
    }
    .landing-master-ea-icon {
        width: 62px;
        height: 62px;
    }
    .landing-master-ea-visual-text {
        margin-left: 14px;
        gap: 3px;
    }
    .landing-master-ea-visual-text strong {
        font-size: 16px;
    }
    .landing-master-ea-visual-text span {
        font-size: 13px;
    }
}
.landing-icon-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #2d2d2d, #1a1a1a);
    color: #fff;
    border-radius: 12px;
    font-size: 24px;
}
.landing-card-title {
    font-size: 17px;
    font-weight: 700;
    color: var(--text);
    margin: 0 0 10px;
    line-height: 1.4;
}
.landing-highlight { color: var(--primary); }
.landing-hook { font-size: 15px; font-weight: 600; color: var(--primary); margin: 0 0 12px; }
.landing-card-desc {
    font-size: 14px;
    color: var(--muted);
    line-height: 1.65;
    margin: 0 0 20px;
    flex: 1;
}
.landing-card-cta { margin: 0; }
.landing-bullets { margin: 0 0 20px; padding-left: 22px; line-height: 1.8; }
.landing-bullets li { margin-bottom: 8px; }
.landing-table-wrap { overflow-x: auto; }
.landing-compare-table { width: 100%; }
.landing-compare-table td:first-child { min-width: 120px; }
.landing-compare-table td:nth-child(3) { color: var(--primary); font-weight: 500; }
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }

/* [작업내용] 카피트레이딩 선택·충전 유도 — 이미지 스타일 3칸 카드 (젠포트형) */
.copy-cta-cards-headline {
    font-size: 22px;
    font-weight: 700;
    color: var(--text, #1a1a1a);
    margin: 0 0 24px;
    line-height: 1.4;
    text-align: center;
}
.copy-cta-cards-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}
@media (max-width: 1100px) {
    .copy-cta-cards-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .copy-cta-cards-grid { grid-template-columns: 1fr; }
}
.copy-cta-card {
    display: flex;
    flex-direction: column;
    padding: 28px 24px;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    background: #fff;
    border: 1px solid var(--line, #e5e7eb);
}
.copy-cta-card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 16px;
    font-size: 26px;
    background: #fde8e8;
    color: var(--primary, #d32f2f);
    border-radius: 10px;
}
.copy-cta-card-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--text, #1a1a1a);
    margin: 0 0 12px;
    line-height: 1.3;
}
.copy-cta-card-desc {
    font-size: 14px;
    color: var(--muted, #6b7280);
    line-height: 1.6;
    margin: 0 0 24px;
    flex: 1;
}
.copy-cta-card-cta {
    margin: 0;
    text-align: center;
}
.copy-cta-btn {
    display: inline-block;
    padding: 12px 20px;
    font-size: 14px;
    font-weight: 600;
    color: var(--text, #1a1a1a);
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    text-decoration: none;
    transition: background 0.2s, border-color 0.2s;
}
.copy-cta-btn:hover {
    background: #e5e7eb;
    border-color: #d1d5db;
}
.copy-cta-btn-outline {
    margin-left: 8px;
}
.copy-cta-card-cta .btn.btn-primary.copy-cta-btn {
    background: var(--primary, #d32f2f);
    color: #fff;
    border-color: var(--primary, #d32f2f);
}
.copy-cta-card-cta .btn.btn-primary.copy-cta-btn:hover {
    filter: brightness(1.1);
}

/* [작업내용] 매뉴얼 보기 모달 — copy_ea_guide.php iframe */
.copy-manual-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    box-sizing: border-box;
}
.copy-manual-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
}
.copy-manual-modal-box {
    position: relative;
    width: 100%;
    max-width: 900px;
    max-height: 90vh;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.copy-manual-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--line, #e5e7eb);
    flex-shrink: 0;
}
.copy-manual-modal-title {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--text, #1a1a1a);
}
.copy-manual-modal-close {
    width: 36px;
    height: 36px;
    border: none;
    background: transparent;
    font-size: 24px;
    line-height: 1;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
}
.copy-manual-modal-close:hover {
    color: #111;
}
.copy-manual-modal-box iframe {
    width: 100%;
    min-height: 400px;
    height: 75vh;
    border: 0;
    display: block;
    flex: 1;
}

/* [작업내용] 커뮤니티 페이지 — 제목·게시판별 최신글 문구 가운데 정렬 */
.community-head-center { text-align: center; margin-bottom: 16px; }

/* 커뮤니티 인덱스: 2열 2단(PC), 1열 4단(모바일) */
.community-index-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-top: 16px;
}
@media (max-width: 768px) {
    .community-index-grid { grid-template-columns: 1fr; }
}

/* [작업내용] 슬롯관리(bank/slots.php .slot-management-page) — 상단 액션·계좌/API 버튼 강조 색(인라인 제거) */
.slot-management-page .slot-btn-extend-soon {
    border-color: #0d6efd;
    color: #0d6efd;
    background: #e7f1ff;
}
.slot-management-page .slot-btn-copier-full {
    border-color: #dc3545;
    color: #842029;
    background: #f8d7da;
}
.slot-management-page .slot-inline-form-reset {
    display: block;
    margin: 0;
}
/* PC: 저장·복사·API 버튼은 가로로 나란히(모바일에서만 세로 전폭) */
.slot-management-page .slot-stacked-btns {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.slot-management-page .slot-api-btns {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

/* 회원/대시보드·관리자 공통: 모바일에서 테이블·카드·폼 반응형 */
@media (max-width: 768px) {
    /* [수정] 관리자·회원 사이드바 폰트 11px 통일 (강조 제목 제외) */
    .dashboard-sidebar .side-nav a,
    .dashboard-sidebar .side-nav-sublist a,
    .dashboard-sidebar .admin-nav-link {
        font-size: 11px;
        padding: 9px 8px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .dashboard-sidebar .side-nav-icon,
    .dashboard-sidebar .admin-nav-icon {
        font-size: 12px;
        width: 14px;
        margin-right: 4px;
        flex-shrink: 0;
    }
    /* [수정] 상단 메뉴 폰트 축소 후 헤더가 낮아졌으므로 main-content 상단 여백도 축소 */
    .main-content { padding: 12px 12px; }
    body.dashboard .main-content { padding: 12px 12px; }
    .card { padding: 14px; }
    .data-table { font-size: 13px; }
    .data-table th, .data-table td { padding: 8px 10px; }
    .form-group input, .form-group select { max-width: 100%; }
    .main-body .page-title { font-size: 18px; }
    /* [반응형] 슬롯 폼·공유 URL·검색 입력 (site_plan 2.3 기준) */
    .share-url-input { min-width: 0 !important; width: 100%; }
    .slot-form-row { flex-direction: column; align-items: stretch; }
    .slot-form-row .slot-label { min-width: 0 !important; }
    /* [반응형] 슬롯관리 입력란 가로폭 확대 — 모바일에서 카드 전체 폭 사용 */
    .slot-form-row input[type="text"], .slot-form-row code.slot-secret-code, .slot-form-row code.slot-code-inner { min-width: 0 !important; max-width: 100%; width: 100%; box-sizing: border-box; }
    .search-input-mw { min-width: 0 !important; width: 100%; }
    /* [작업내용] 슬롯관리 모바일 — 저장/복사/기간연장 등 버튼 동일 폭·터치 높이로 조화 */
    .slot-management-page .slot-top-actions {
        flex-direction: column;
        align-items: stretch;
    }
    .slot-management-page .slot-top-actions > .slot-product-badge {
        width: 100%;
    }
    .slot-management-page .slot-top-actions .slot-action-btn,
    .slot-management-page .slot-top-actions a.slot-action-btn {
        width: 100%;
        box-sizing: border-box;
        min-height: 44px;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        text-align: center;
        font-weight: 600;
        border-radius: 8px;
    }
    .slot-management-page .slot-stacked-btns {
        display: flex;
        flex-direction: column;
        gap: 8px;
        width: 100%;
        flex: 1 1 100%;
        align-self: stretch;
    }
    .slot-management-page .slot-stacked-btns > .slot-inline-form-reset,
    .slot-management-page .slot-stacked-btns > .btn {
        width: 100%;
    }
    .slot-management-page .slot-stacked-btns .slot-inline-form-reset .btn {
        width: 100%;
        box-sizing: border-box;
    }
    .slot-management-page .slot-account-form .slot-form-submit,
    .slot-management-page .slot-account-form .slot-form-secondary,
    .slot-management-page .slot-api-btns .slot-form-secondary,
    .slot-management-page .slot-api-btns .slot-form-submit {
        min-height: 44px;
        font-weight: 600;
        border-radius: 8px;
    }
    .slot-management-page .slot-api-btns {
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: stretch;
    }
    .slot-management-page .slot-api-btns.slot-stacked-btns > .slot-inline-form-reset,
    .slot-management-page .slot-api-btns.slot-stacked-btns > .btn {
        flex: 1;
        min-width: 0;
        width: auto;
    }
    .slot-management-page .slot-api-row {
        flex-direction: column;
        align-items: stretch !important;
    }
    .slot-management-page .slot-api-heading {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
    }
    .slot-management-page .slot-copier-card-head {
        flex-direction: column;
        align-items: stretch !important;
    }
    .slot-management-page .slot-copier-card-head > span:first-of-type {
        width: 100%;
    }
    .slot-management-page .slot-copier-top-btns {
        margin-left: 0 !important;
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }
    .slot-management-page .slot-copier-top-btns .slot-action-btn {
        width: 100%;
        min-height: 44px;
        justify-content: center;
        border-radius: 8px;
        font-weight: 600;
    }
    .slot-management-page .slot-settings-form {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 10px !important;
    }
    .slot-management-page .slot-settings-form .slot-settings-save {
        width: 100%;
        min-height: 44px;
        margin-top: 4px;
        font-weight: 600;
        border-radius: 8px;
        justify-content: center;
    }
    /* [수정] 햄버거 버튼이 헤더 안으로 이동 → 구 fixed 버튼 회피용 24px 제거, 8px로 축소 */
    body.dashboard .main-content .main-body { padding-top: 8px; }
    body.dashboard .main-content .main-body .page-title { scroll-margin-top: 64px; }
    body.dashboard .main-content .main-body .card h3 { scroll-margin-top: 64px; }
    body.dashboard .main-content .main-body h2 { scroll-margin-top: 64px; }
    /* [반응형] 커뮤니티 전체보기 — 제목 한 줄 + 다음 줄 작성자·날짜·조회 (가로 넘침 방지) */
    /* (bbs-list-table 제거됨 — 리스트 레이아웃으로 대체) */
    /* [작업내용] 게시판 글쓰기(bbs/write.php) — 모바일에서 폼 min-width:560px 제거·뷰포트 맞춤. SmartEditor2 iframe 폭 100% */
    .write-form-card {
        min-width: 0 !important;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    /* [작업내용] 모바일 글쓰기(게시판/1:1문의) — 에디터가 축소되지 않는 경우 가로 스크롤 허용 */
    body.dashboard .main-body.content-center .table-scroll-wrap,
    body.dashboard .main-body.inquiry-write-page .table-scroll-wrap {
        min-width: 0;
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .write-form-card input[name="wr_subject"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
        font-size: 14px;
        word-break: break-word;
    }
    .editor-responsive-wrap {
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    /* [작업내용] 모바일 SmartEditor2 iframe이 내부 고정폭일 때 잘리지 않도록 최소폭을 두고 래퍼 스크롤로 탐색 */
    .editor-responsive-wrap > iframe {
        width: auto !important;
        max-width: none !important;
        min-width: 640px !important;
        box-sizing: border-box;
        display: block;
    }
}
@media (max-width: 480px) {
    .main-content { padding: 12px 10px; }
    body.dashboard .main-content { padding: 12px 10px; }
    .card { padding: 12px; }
    .btn { padding: 8px 12px; font-size: 13px; }
    /* [반응형] 480px 이하 극소형 — 11px 통일 유지, 로고만 추가 축소 */
    .site-logo { height: 18px; max-height: 18px; }
    body.admin-page .site-logo.site-logo--round { width: 20px; height: 20px; max-height: none; }
    .logo-link { font-size: 12px; }
    .header-right .btn { padding: 4px 7px; font-size: 11px; }
}

/* ===== 스마트폰(640px 이하) 폰트 통일 — 큰 글씨 14px / 보통 글씨 11px ===== */
@media (max-width: 640px) {
    /* [수정] 본문 기본 폰트: 브라우저 기본(16px)→11px. 명시적 px 없는 모든 요소가 이 값을 상속 */
    body { font-size: 11px; }

    /* [수정] 큰 글씨 — 페이지·섹션·카드 제목 14px 상한 */
    h1, h2, h3,
    .page-title,
    .main-body .page-title,
    body.dashboard .main-body .page-title,
    .home-section-title,
    .home-hero-title,
    .landing-section-title,
    .landing-headline-main,
    .hero h1,
    .hero-main-title,
    .card h2, .card h3,
    .ea-guide-heading,
    .pricing-section-title { font-size: 14px !important; line-height: 1.4; }

    /* [수정] 중간 소제목(h4/h5) */
    h4, h5 { font-size: 13px !important; }

    /* [수정] 일반 본문: p, li, dd/dt — 11px */
    p, li, dd, dt { font-size: 11px; }

    /* [수정] 부제목·설명 문구 */
    .home-hero-sub,
    .landing-headline-sub,
    .landing-section-desc,
    .landing-hook,
    .hero p,
    .hero-sub-title,
    .card-desc,
    .home-service-desc,
    .home-value-card-desc { font-size: 11px !important; }

    /* [수정] 버튼 폰트 11px 통일 (480px 규칙 13px를 덮어씀) */
    .btn { font-size: 11px !important; }

    /* [수정] 입력 폼 */
    label, .form-group input, .form-group select, .form-group textarea { font-size: 11px; }
    .form-hint, .register-page .form-hint { font-size: 11px; }

    /* [수정] 테이블 — 13px→11px */
    .data-table { font-size: 11px !important; }
    .data-table th, .data-table td { padding: 6px 8px; }

    /* [수정] muted·메시지·알림 */
    .muted, .message, .alert { font-size: 11px; }

    /* [수정] 푸터 링크 12px→11px */
    .global-site-footer { font-size: 11px !important; }

    /* [수정] 카드 본문 서비스명·메타 */
    .home-service-title,
    .home-value-card-title { font-size: 14px !important; }
    .home-service-link { font-size: 11px !important; }
}

/* ===== [반응형] 카드형 테이블 — 768px 이하에서 가로 스크롤 대신 세로 카드 형태로 재배치 ===== */
/* [수정] 카드형 테이블 방식 → 가로 스크롤 방식으로 전환 (site.js와 동일 정책)
 * .table-scroll-wrap: JS가 .data-table 을 자동으로 감싸는 스크롤 래퍼
 * .table-responsive / .data-table-responsive: 기존 수동 래퍼 — 동일 처리 */
.table-scroll-wrap,
.table-responsive,
.data-table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    margin-bottom: 8px;
}

/* [비활성화] 카드형 테이블 CSS — 스크롤 방식으로 대체. 필요 시 복원 가능.
@media (max-width: 768px) {
    .card-table,
    .card-table thead,
    .card-table tbody,
    .card-table th,
    .card-table td,
    .card-table tr { display: block; }
    .card-table thead { display: none; }
    .card-table tbody tr {
        margin-bottom: 12px;
        border: 1px solid #ddd;
        border-radius: 8px;
        padding: 10px;
        background: var(--panel);
        box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    }
    .card-table td {
        text-align: right;
        position: relative;
        padding: 7px 10px 7px 50%;
        min-height: 30px;
        border: none;
        border-bottom: 1px solid #f0f0f0;
        word-break: break-word;
        font-size: 13px;
    }
    .card-table td:last-child { border-bottom: none; }
    .card-table td::before {
        content: attr(data-label);
        position: absolute;
        left: 10px;
        top: 7px;
        font-weight: 600;
        text-align: left;
        color: var(--muted);
        font-size: 12px;
        white-space: nowrap;
        max-width: 46%;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}
*/

@media (max-width: 768px) {
    /* [비활성화] pricing.php 인라인 style 의 16px 좌우 패딩 제거로 아래 override 규칙 불필요 */
    /* .pricing-page { padding-left: 0 !important; padding-right: 0 !important; } */
    /* [추가] .card 안 내용이 넘칠 경우 카드 자체도 스크롤 가능하게 (테이블 미사용 컨텐츠 대비) */
    .card { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

.community-index-block { padding: 16px; }
.community-index-block-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line);
}
.community-index-block-title { margin: 0; font-size: 1.1rem; }
.community-index-more { color: var(--primary); font-size: 14px; text-decoration: none; }
.community-index-more:hover { text-decoration: underline; }
.community-index-list { list-style: none; margin: 0; padding: 0; }
.community-index-list li { padding: 10px 0; border-bottom: 1px solid #eee; }
.community-index-list li:last-child { border-bottom: none; }
.community-index-list a { color: #1a73e8; text-decoration: none; }
.community-index-list a:hover { text-decoration: underline; }
.community-index-meta { display: block; font-size: 12px; color: var(--muted); margin-top: 4px; }

/* [작업내용] 게시판 전체보기 목록 — 제목 한 줄, 다음 줄에 작성자·날짜·조회 (가로 넘침 없음) */
.bbs-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.bbs-list-item { padding: 12px 0; border-bottom: 1px solid #eee; }
.bbs-list-item:last-child { border-bottom: none; }
.bbs-list-title-row { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 6px; }
.bbs-list-num { flex-shrink: 0; width: 36px; text-align: center; font-size: 13px; color: var(--muted); }
.bbs-list-title { flex: 1; min-width: 0; color: var(--primary); text-decoration: none; font-weight: 500; font-size: 15px; line-height: 1.4; word-break: break-word; }
.bbs-list-title:hover { text-decoration: underline; }
/* [작업내용] 게시판 목록·본문·댓글 작성자 — 22×22 아바타(이미지 또는 원형 첫 글자), 참고: 쇼룸/자동매매카드 판매자 행도 동일 규격 클래스 재사용 가능 */
.bbs-author-avatar {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    vertical-align: middle;
    box-sizing: border-box;
}
.bbs-author-avatar--img {
    padding: 0;
    background: #e2e8f0;
}
.bbs-author-avatar--img img {
    width: 22px;
    height: 22px;
    object-fit: cover;
    display: block;
    border-radius: 50%;
}
.bbs-author-avatar--letter {
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    user-select: none;
}
/* [작업내용] 관리자 회원 — 프로필 사진에 보라 링, 무이미지는 그라데이션 원+실드 SVG */
.bbs-author-avatar--admin.bbs-author-avatar--img {
    box-shadow: 0 0 0 2px #fff, 0 0 0 3px #6366f1;
}
.bbs-author-avatar--admin-icon {
    background: linear-gradient(145deg, #4f46e5, #7c3aed);
    color: #fff;
}
.bbs-author-avatar--admin-icon .bbs-admin-shield-svg {
    display: block;
}
.bbs-author-inline {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.bbs-author-name {
    font-size: 12px;
    color: var(--text, #334155);
}
.bbs-list-meta-with-avatar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 8px;
    padding-left: 46px;
    font-size: 12px;
    color: var(--muted);
}
.bbs-list-meta-with-avatar .bbs-meta-sep {
    color: var(--muted);
}
.bbs-view-author-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 10px;
    margin: 0 0 8px;
    font-size: 14px;
    color: var(--muted);
}
.bbs-comment-author-line {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.bbs-list-meta { font-size: 12px; color: var(--muted); padding-left: 46px; }

/* [작업내용] 게시판 전체 목록(bbs/index.php) — 모바일: 2행(제목+메타). PC 769px~: 한 행에 제목·댓글수·new | 작성자 | 상대시각 | 조회 */
.bbs-list--board .bbs-list-item { padding: 14px 0; }
.bbs-list--board .bbs-list-grid {
    display: grid;
    grid-template-columns: 36px 1fr;
    column-gap: 10px;
    row-gap: 8px;
    align-items: start;
}
.bbs-list--board .bbs-list-num {
    grid-column: 1;
    grid-row: 1;
    width: auto;
    text-align: center;
    font-size: 13px;
    color: var(--muted);
}
.bbs-list--board .bbs-list-cell-titles {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
    min-width: 0;
}
.bbs-list--board .bbs-list-cell-titles .bbs-list-title {
    flex: 1 1 auto;
    min-width: 0;
}
.bbs-list--board .bbs-list-cell-author {
    grid-column: 1 / -1;
    grid-row: 2;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 6px;
    padding-left: 46px;
    font-size: 12px;
    color: var(--muted);
}
.bbs-list--board .bbs-list-meta-mobile-inline { color: var(--muted); }
.bbs-list--board .bbs-list-cell-pc-time,
.bbs-list--board .bbs-list-cell-pc-hit { display: none; }
.bbs-list--board .bbs-list-reply-count {
    flex-shrink: 0;
    font-size: 13px;
    font-weight: 600;
    color: #c2410c;
    text-decoration: none;
}
.bbs-list--board .bbs-list-reply-count:hover { text-decoration: underline; color: #9a3412; }
.bbs-list--board .bbs-list-new-pill {
    flex-shrink: 0;
    display: inline-block;
    padding: 2px 7px;
    border-radius: 4px;
    background: #22c55e;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.02em;
    text-transform: lowercase;
}
@media (min-width: 769px) {
    .bbs-list--board .bbs-list-grid {
        grid-template-columns: 44px minmax(0, 1fr) minmax(140px, 220px) 100px 52px;
        grid-template-rows: auto;
        column-gap: 16px;
        row-gap: 0;
        align-items: center;
    }
    .bbs-list--board .bbs-list-num { grid-column: 1; grid-row: 1; }
    .bbs-list--board .bbs-list-cell-titles { grid-column: 2; grid-row: 1; }
    .bbs-list--board .bbs-list-cell-titles .bbs-list-title {
        color: #1e293b;
        font-weight: 500;
        font-size: 15px;
    }
    .bbs-list--board .bbs-list-cell-author {
        grid-column: 3;
        grid-row: 1;
        padding-left: 0;
        justify-content: flex-end;
        font-size: 13px;
        color: #334155;
    }
    .bbs-list--board .bbs-list-meta-mobile-inline { display: none !important; }
    .bbs-list--board .bbs-list-cell-pc-time {
        display: block;
        grid-column: 4;
        grid-row: 1;
        font-size: 13px;
        color: #64748b;
        text-align: right;
        white-space: nowrap;
    }
    .bbs-list--board .bbs-list-cell-pc-hit {
        display: block;
        grid-column: 5;
        grid-row: 1;
        font-size: 13px;
        color: #64748b;
        text-align: right;
        white-space: nowrap;
    }
    .bbs-list--board .bbs-author-name { font-size: 13px; color: #1e293b; }
}

/* [게시글 보기] 본문 영역 가로 최소 너비 + 세로 최소 높이 — 짧은 글일 때도 창이 너무 좁/썰렁해 보이지 않도록 */
.bbs-view-page .card.bbs-content { min-width: min(100%, 560px); min-height: 280px; box-sizing: border-box; }

/* 페이지별 배너 슬롯 — 사각형+라운드, PC/스마트폰 반응형, 가로 최대는 사이트 전체 폭과 동일 */
.banner-slot { margin: 0; text-align: center; padding: 12px 0; box-sizing: border-box; }
.banner-slot-top,
.banner-slot-middle,
.banner-slot-bottom {
    max-width: var(--site-max-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: 16px;
    padding-right: 16px;
}
.banner-slot a { display: block; line-height: 0; }
.banner-slot .banner-img {
    max-width: 100%;
    width: auto;
    height: auto;
    display: block;
    margin: 0 auto;
    vertical-align: top;
    border-radius: 12px;
    object-fit: contain;
}
.main-body .banner-slot-middle { margin: 20px 0; }
@media (max-width: 768px) {
    .banner-slot { padding: 10px 8px; }
    .banner-slot .banner-img { border-radius: 10px; }
}

.faq-list { margin: 0; }
.faq-list dt { font-weight: 600; margin: 14px 0 4px; }
.faq-list dt:first-child { margin-top: 0; }
.faq-list dd { margin: 0 0 0 16px; color: var(--muted); font-size: 14px; }
.card {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 12px;
    background: var(--panel);
}
.card-header { font-weight: 600; margin-bottom: 10px; }

/* ===== 대시보드 홈 (dashboard/index.php) — 공지 + 요약 카드 그리드 ===== */
.dashboard-home .dash-notice-card { margin-bottom: 16px; }
/* [작업내용] 카드 호버 — 배경·테두리·그림자로 구분감(마우스 올릴 때만) */
.dashboard-home .dash-notice-card,
.dashboard-home .dash-tile {
    transition: background-color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.dashboard-home .dash-notice-card:hover,
.dashboard-home .dash-tile:hover {
    background-color: #f1f5f9;
    border-color: #cbd5e1;
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.07);
}
.dashboard-home .dash-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line);
}
.dashboard-home .dash-card-title { margin: 0; font-size: 1rem; font-weight: 700; color: var(--text); }
.dashboard-home .dash-more-link {
    font-size: 13px;
    font-weight: 600;
    color: var(--primary);
    text-decoration: none;
    white-space: nowrap;
}
.dashboard-home .dash-more-link:hover { text-decoration: underline; }
.dashboard-home .dash-stat { margin: 0 0 12px; font-size: 15px; }
.dashboard-home .dash-point-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 12px;
    margin-bottom: 12px;
}
.dashboard-home .dash-stat--compact { margin: 0; }
.dashboard-home .dash-ref-mode-detail { font-weight: 500; color: var(--text); }
.dashboard-home .dash-stat-value { font-size: 1.35rem; font-weight: 700; color: var(--text); }
.dashboard-home .dash-stat-unit { font-weight: 600; color: var(--muted); font-size: 14px; }
.dashboard-home .dash-tile-hint { margin: 0 0 10px; font-size: 13px; line-height: 1.45; }
.dashboard-home .dash-tile-hint a { color: var(--primary); }
.dashboard-home .dash-empty { margin: 8px 0; font-size: 14px; }
.dashboard-home .dash-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
    gap: 14px;
    align-items: stretch;
}
.dashboard-home .dash-tile { margin-bottom: 0; display: flex; flex-direction: column; min-height: 0; }
.dashboard-home .dash-mini-list {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
}
.dashboard-home .dash-mini-item {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 10px;
    padding: 8px 0;
    border-bottom: 1px solid var(--line);
    font-size: 13px;
}
.dashboard-home .dash-mini-item:last-child { border-bottom: none; padding-bottom: 0; }
.dashboard-home .dash-item-main {
    flex: 1 1 140px;
    min-width: 0;
    color: var(--text);
    text-decoration: none;
    font-weight: 500;
    word-break: break-word;
}
.dashboard-home a.dash-item-main:hover { text-decoration: underline; color: var(--primary); }
.dashboard-home .dash-item-label { color: var(--muted); font-size: 12px; }
.dashboard-home .dash-item-meta { color: var(--muted); font-size: 12px; margin-left: auto; }
.dashboard-home .dash-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    background: #ede9fe;
    color: #5b21b6;
    vertical-align: middle;
}
.dashboard-home .dash-unread { color: var(--primary); font-size: 10px; margin-right: 2px; }
.dashboard-home .btn-sm-dash { padding: 6px 12px; font-size: 13px; margin-top: 4px; }
.dashboard-home .dash-subhead {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin: 0 0 8px;
}
.dashboard-home .dash-tiny { font-size: 12px; line-height: 1.45; margin: 0 0 8px; }
.dashboard-home .dash-coupon-block {
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
}
.dashboard-home .dash-code-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
}
.dashboard-home .dash-code-line code {
    font-size: 13px;
    padding: 6px 10px;
    background: #f3f4f6;
    border-radius: 6px;
    word-break: break-all;
    flex: 1 1 160px;
    min-width: 0;
}
.dashboard-home .dash-ref-input {
    flex: 1 1 180px;
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    font-size: 12px;
    background: #fafafa;
}
.dashboard-home .dash-ref-stats {
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 10px;
}
.dashboard-home .dash-ref-stats li {
    padding: 10px 12px;
    background: #f9fafb;
    border-radius: 8px;
    border: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.dashboard-home .dash-ref-stat-label { font-size: 11px; color: var(--muted); }
.dashboard-home .dash-ref-stat-val { font-size: 16px; font-weight: 700; color: var(--text); }
.dashboard-home .dash-ref-stat-highlight { color: var(--primary); }
@media (min-width: 769px) {
    .dashboard-home .dash-grid { gap: 16px; }
}
.btn { padding: 8px 14px; border-radius: 8px; font-size: 14px; cursor: pointer; border: 1px solid var(--line); background: #fff; color: var(--text); text-decoration: none; display: inline-block; }
.btn:hover { background: #f8fbff; }
.btn-primary { background: var(--primary); color: #fff; border-color: var(--primary); }
.btn-primary:hover { background: var(--primary-dark); }

/* ===== 대시보드 레이아웃 (로그인 후: 좌측 메뉴 + 가운데 영역) ===== */
body.dashboard .dashboard-layout {
    display: grid;
    grid-template-columns: var(--sidebar-w) minmax(0, 1fr);
    gap: 0;
    /* 폭은 부모 .site-root-max 가 한정 */
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    min-height: calc(100vh - var(--header-bar-height));
    box-sizing: border-box;
}
.dashboard-sidebar {
    width: var(--sidebar-w);
    min-width: var(--sidebar-w);
    max-width: var(--sidebar-w);
    background: #f0f0f0;
    border-right: 1px solid #ddd;
    padding: 20px 0;
    position: sticky;
    top: var(--header-bar-height);
    height: calc(100vh - var(--header-bar-height));
    overflow-y: auto;
    flex-shrink: 0;
}
.dashboard-sidebar .sidebar-title {
    margin: 4px 0 10px;
    padding: 0 20px;
    font-size: 15px;
    color: #6b7280;
    font-weight: 600;
}
.dashboard-sidebar .side-nav { list-style: none; margin: 0; padding: 0; }
.dashboard-sidebar .side-nav li { margin-bottom: 4px; }
.dashboard-sidebar .side-nav a {
    display: flex;
    align-items: center;
    padding: 12px 20px;
    color: #374151;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    background: #f0f0f0;
    transition: background 0.15s, color 0.15s;
    min-height: 44px;
}
.dashboard-sidebar .side-nav .side-nav-icon {
    width: 26px;
    margin-right: 12px;
    font-size: 1.1em;
    flex-shrink: 0;
    text-align: center;
}
.dashboard-sidebar .side-nav a:hover { background: #e5e7eb; color: #111827; }
.dashboard-sidebar .side-nav a.active { background: #d1d5db; color: #111827; font-weight: 600; }
.dashboard-sidebar .side-nav .side-nav-divider { margin: 12px 0 6px; padding: 6px 20px 0; border-top: 1px solid #ddd; }
.dashboard-sidebar .side-nav .side-nav-divider span { font-size: 11px; color: #6b7280; text-transform: uppercase; }
.dashboard-sidebar .side-nav .side-nav-group { margin-bottom: 4px; }
.dashboard-sidebar .side-nav .side-nav-group-label {
    display: block;
    font-size: 11px;
    color: #6b7280;
    padding: 10px 20px 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.dashboard-sidebar .side-nav .side-nav-sublist {
    list-style: none;
    margin: 0;
    padding: 0 0 0 0;
}
.dashboard-sidebar .side-nav .side-nav-sublist li { margin-bottom: 4px; }
.dashboard-sidebar .side-nav .side-nav-sublist a { padding: 12px 20px; }

/* [작업내용] 관리자 사이드바: admin-nav를 세로 목록으로 표시(기존 side-nav와 동일한 스타일) */
.dashboard-sidebar .admin-nav {
    display: flex;
    flex-direction: column;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0;
}
.dashboard-sidebar .admin-nav .admin-nav-link {
    display: flex;
    align-items: center;
    padding: 12px 20px;
    color: #374151;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    background: #f0f0f0;
    transition: background 0.15s, color 0.15s;
    min-height: 44px;
    margin-bottom: 4px;
    box-sizing: border-box;
}
.dashboard-sidebar .admin-nav .admin-nav-icon {
    width: 26px;
    margin-right: 12px;
    font-size: 1.1em;
    flex-shrink: 0;
    text-align: center;
}
.dashboard-sidebar .admin-nav .admin-nav-link:hover { background: #e5e7eb; color: #111827; }
.dashboard-sidebar .admin-nav .admin-nav-link.active { background: #d1d5db; color: #111827; font-weight: 600; }
.dashboard-sidebar .admin-nav .admin-nav-back { margin-top: 8px; border-top: 1px solid #ddd; padding-top: 12px; }
.dashboard-sidebar > .admin-nav-back {
    display: flex;
    align-items: center;
    padding: 12px 20px;
    margin: 8px 0 0;
    border-top: 1px solid #ddd;
    color: #374151;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    background: #f0f0f0;
}
.dashboard-sidebar > .admin-nav-back .admin-nav-icon { margin-right: 12px; flex-shrink: 0; }
.dashboard-sidebar > .admin-nav-back:hover { background: #e5e7eb; color: #111827; }

/* 대시보드 본문 — 그리드 2열째가 이미 (전체−사이드바) 폭이므로 별도 max-width 없음(이중 합산으로 --site-max-width 초과 방지) */
body.dashboard .main-content {
    width: 100%;
    min-width: 0;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    background: #f5f5f5;
    padding: 24px 20px;
    overflow: auto;
}
/* bbs 커뮤니티·쇼룸 로그인 후 본문 — 폭은 그리드 열이 담당 */
body.dashboard.dashboard-wide .main-content {
    max-width: none;
}
/* 쇼룸 차트 영역: 스마트폰·좁은 화면에서는 세로로 쌓기 */
.show-charts-row {
    width: 100%;
}
/* 쇼룸 페이지(비로그인): 사이드바 없음 → 사이트 전체 최대 폭과 동일 */
.showroom-page {
    max-width: var(--site-max-width);
}
@media (max-width: 900px) {
    .show-charts-row {
        grid-template-columns: 1fr !important;
    }
    .show-chart-cell {
        min-width: 0;
    }
    .show-chart-inner {
        min-height: 280px !important;
        height: 280px !important;
    }
}
body.dashboard .main-content .main-body {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    text-align: left;
}
body.dashboard .main-content .main-body.content-center {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}
/* 대시보드 폼·카드: 가운데가 좁아 보이지 않도록 넉넉한 최대폭 (560px → 960px) */
body.dashboard .charge-box,
body.dashboard .main-body.checkout-page {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}
.dashboard-form-narrow { max-width: 960px; margin-left: auto; margin-right: auto; }
/* [작업내용] 프로필/쿠폰 — 인출 정보 탭 카드: PC에서 960px까지 넓힘, 모바일은 100% */
body.dashboard .profile-withdraw-info-card {
    box-sizing: border-box;
}
@media (min-width: 769px) {
    body.dashboard .profile-withdraw-info-card {
        max-width: 960px;
        width: 100%;
    }
    body.dashboard .profile-withdraw-info-card .profile-withdraw-input {
        max-width: min(520px, 100%);
    }
}
@media (max-width: 768px) {
    body.dashboard .profile-withdraw-info-card .profile-withdraw-input {
        max-width: 100%;
    }
    body.dashboard .profile-withdraw-info-card .profile-withdraw-file {
        max-width: 100%;
    }
}
body.dashboard .profile-withdraw-input {
    width: 100%;
    box-sizing: border-box;
}
.main-content {
    background: var(--bg);
    padding: 20px;
    overflow: auto;
}
/* 메인(홈)만 볼 때: 사이드바 없이 본문만 가운데 */
.main-content-no-sidebar {
    max-width: var(--site-max-width);
    margin-left: auto;
    margin-right: auto;
    min-height: calc(100vh - var(--header-bar-height));
}
body.dashboard .main-body .page-title { margin: 0 0 16px; font-size: 20px; color: #374151; font-weight: 700; }
.main-body .page-title { margin: 0 0 16px; font-size: 20px; color: var(--primary); }
.account-summary-box, .point-summary-box {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 16px;
    background: var(--panel);
}
.notice-list { list-style: none; margin: 0; padding: 0; }
.notice-list li { padding: 10px 0; border-bottom: 1px solid var(--line); }
.notice-list li:last-child { border-bottom: none; }
.notice-list a { color: var(--primary); text-decoration: none; }

/* PC: 상단 블랙 헤더 세로·터치 여유 확대 (768px 이하는 위 블록에서 52px 고정 유지) */
@media (min-width: 769px) {
    .header-inner {
        padding: 16px 24px;
        min-height: 68px;
        gap: 14px;
    }
    .site-logo {
        height: 42px;
        max-height: 44px;
    }
    body.admin-page .site-logo.site-logo--round {
        width: 44px;
        height: 44px;
        max-height: none;
    }
    .logo-link { font-size: 24px; }
    .header-nav a {
        padding: 10px 16px;
        font-size: 15px;
    }
    .header-right .btn {
        padding: 10px 18px;
        font-size: 15px;
    }
    .user-info, .point-badge { font-size: 15px; }
    .lang-switch { font-size: 14px; }
}

/* PC: 상단·사이드 메뉴 가로폭 확보 — 줄바꿈 최소화 */
@media (min-width: 1024px) {
    .header-inner { flex-wrap: nowrap; }
    .header-nav { flex-wrap: nowrap; }
}
/* ===== 모바일: 상단 네비 유지, 햄버거 = 좌측 사이트 메뉴(사이드바) ===== */
@media (max-width: 960px) {
    .hamburger { display: block; }
    .header-nav { display: flex; flex-wrap: wrap; gap: 6px; }
    .header-nav a { padding: 6px 10px; font-size: 13px; }
    body.dashboard .dashboard-layout { grid-template-columns: 1fr; padding: 0; }
    /* [수정] 가로폭 110px, transform 방식으로 숨김 (left 방식 → 어드민 사이드바와 동일하게 통일) */
    /* [수정 이유] left: -Xpx 방식은 grid 컨텍스트에서 초기 렌더 시 사이드바가 보이는 버그 발생 */
    .dashboard-sidebar {
        position: fixed;
        left: 0;
        top: 52px;
        bottom: 0;
        width: 110px;
        max-width: 42vw;
        z-index: 1000;
        transform: translateX(-100%);
        transition: transform 0.25s ease;
        box-shadow: 4px 0 12px rgba(0,0,0,0.15);
        padding-top: 20px;
    }
    .dashboard-sidebar.open { transform: translateX(0); }
    /* 공개 페이지: 좌측 사이드바 제거됨 — 상단 메뉴만 사용 */
    .sidebar-overlay {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.4);
        z-index: 999;
    }
    .sidebar-overlay.open { display: block; }
}

/* 스마트폰: 상단 메뉴 왼쪽 정렬, 네비는 햄버거로 접기 */
@media (max-width: 768px) {
    :root {
        --header-bar-height: 52px;
    }
    /* [수정] 상단 헤더 높이를 하단 네비(52px)와 동일하게 통일 */
    .header-inner {
        justify-content: flex-start;
        gap: 6px;
        padding: 0 10px;
        height: 52px;
        min-height: 52px;
        flex-wrap: nowrap;
    }
    .logo-link { font-size: 14px; }
    .site-logo { max-height: 26px; }
    body.admin-page .site-logo.site-logo--round { width: 26px; height: 26px; max-height: none; }
    .user-info, .point-badge { font-size: 11px; }
    .point-badge { padding: 3px 8px; }
    /* 데스크톱에서는 네비 보임, 768px 이하에서는 숨기고 햄버거로 토글 */
    .header-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        flex-direction: column;
        background: rgba(33, 33, 33, 0.98);
        padding: 8px;
        gap: 0;
        box-shadow: 0 8px 16px rgba(0,0,0,0.2);
        z-index: 100;
    }
    .site-header.menu-open .header-nav { display: flex; }
    .header-nav a {
        display: block;
        padding: 10px 12px;
        font-size: 11px;
        border-radius: 6px;
    }
    .header-nav a:hover { background: rgba(255,255,255,0.15); }
    .header-right { margin-left: auto; }
    /* [수정] 로그아웃 버튼 패딩·폰트 축소 — 11px 통일 */
    .header-right .btn { padding: 5px 8px; font-size: 11px; border-radius: 6px; }
    /* 하단 고정 네비게이션 — 스마트폰에서 상단 메뉴 대신 항상 노출 */
    .bottom-nav {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        height: 52px;
        background: linear-gradient(135deg, #1f1f1f, #424242);
        color: #fff;
        z-index: 1050;
        align-items: center;
        justify-content: space-around;
        padding: 0 4px;
        box-shadow: 0 -2px 12px rgba(0,0,0,0.2);
        border-top: 1px solid rgba(255,255,255,0.08);
    }
    .bottom-nav a {
        color: rgba(255,255,255,0.95);
        text-decoration: none;
        font-size: 11px;
        padding: 6px 4px;
        text-align: center;
        flex: 1;
        max-width: 52px;
        border-radius: 6px;
        white-space: nowrap;
    }
    .bottom-nav a:hover { background: rgba(255,255,255,0.15); color: #fff; }
    body.dashboard .main-content { padding-bottom: 64px; }
    body.dashboard .global-site-footer { padding-bottom: 60px; }
    /* [추가] 관리자 페이지에도 bottom-nav가 생겼으므로 main 영역 하단 여백 추가 */
    body.admin-page .admin-main { padding-bottom: 64px; }
}
@media (min-width: 961px) {
    .sidebar-overlay { display: none !important; }
}

.sidebar-overlay {
    display: none;
    transition: opacity 0.2s;
}
/* [반응형] 하단 고정 네비 — PC에서는 숨김, 768px 이하에서만 표시 (순서 유지) */
@media (min-width: 769px) {
    .bottom-nav { display: none !important; }
}
/* 공개 페이지(회원가입 등)에는 사이드바가 없으므로 오버레이가 켜지지 않도록 */
body.public .sidebar-overlay { display: none !important; }

/* 회원가입/인증 페이지: 본문·카드·입력창이 항상 잘 보이도록 */
body.public .site-layout.register-page { background: #f5f5f5; min-height: 60vh; }
body.public .site-layout.register-page .card { background: #ffffff; color: #1a1a1a; border: 1px solid #ddd; }
body.public .site-layout.register-page .form-group input { background: #fff; color: #1a1a1a; border: 1px solid #ddd; }
/* 회원가입: 아이디+중복확인 1줄, 입력창 짧게 */
body.public .register-page .id-with-check {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: nowrap;
    max-width: 100%;
}
body.public .register-page .id-with-check input {
    flex: 1 1 auto;
    min-width: 180px;
    max-width: 100%;
    width: auto !important;
    box-sizing: border-box;
}
body.public .register-page .id-with-check .btn-check-id {
    flex-shrink: 0;
    background: #2563eb;
    color: #fff;
    border: none;
    padding: 10px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}
body.public .register-page .id-with-check .btn-check-id:hover {
    background: #1d4ed8;
}
/* 회원가입: 이메일 안내 문구 */
.register-page .form-hint { margin: 6px 0 0; font-size: 13px; color: var(--muted); }
/* 회원가입: 약관 동의 박스 — 체크박스·텍스트 깨짐 방지 */
.register-page .agree-box {
    border: 1px solid var(--line);
    padding: 16px 18px;
    border-radius: 8px;
    background: #fafafa;
    overflow: visible;
    width: 100%;
    box-sizing: border-box;
}
.register-page .agree-all-row { margin-bottom: 4px; }
.register-page .agree-divider { border: none; border-top: 1px solid var(--line); margin: 12px 0 14px; }
.register-page .agree-box .checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
    cursor: pointer;
    line-height: 1.6;
    font-size: 15px;
    width: 100%;
}
.register-page .agree-box .checkbox-label:last-of-type { margin-bottom: 0; }
/* 체크박스 크기·스타일 고정 — 깨짐 방지 */
.register-page .agree-box input[type="checkbox"] {
    width: 20px;
    height: 20px;
    min-width: 20px;
    min-height: 20px;
    flex-shrink: 0;
    margin: 2px 0 0;
    cursor: pointer;
    accent-color: #6A7DD8;
}
/* 문구 영역 가로로 넓게 — 세로로 쌓이지 않도록 */
.register-page .agree-box .agree-text {
    flex: 1 1 auto;
    min-width: 200px;
    max-width: 100%;
}
.register-page .agree-link { color: #2563eb; text-decoration: underline; }
.register-page .agree-link:hover { color: #1d4ed8; }
/* 회원가입: 하단 버튼 — 이미지처럼 한 줄, 파란보라(#6A7DD8) 캡슐형 */
.register-page .form-actions { margin-top: 24px; }
.register-page .btn-register {
    display: block;
    width: 100%;
    background: #6A7DD8;
    color: #fff;
    border: none;
    padding: 14px 24px;
    border-radius: 999px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    text-align: center;
    box-sizing: border-box;
}
.register-page .btn-register:hover { background: #5a6bc8; }

.muted { color: var(--muted); font-size: 14px; }
.text-muted { color: var(--muted); }
.text-danger { color: var(--danger); }
.api-key-masked,
.api-key-partial { margin-right: 8px; }
.message { padding: 10px 14px; border-radius: 8px; margin-bottom: 12px; font-size: 14px; }
.message.success { background: #d1fae5; color: #065f46; border: 1px solid var(--ok); }
.message.error { background: #fee2e2; color: #991b1b; border: 1px solid var(--danger); }
.form-group { margin-bottom: 14px; }
.form-group label { display: block; margin-bottom: 6px; font-weight: 500; }
.checkbox-label { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.checkbox-label input { width: auto; max-width: none; }
.form-group input, .form-group select { width: 100%; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; font-size: 14px; max-width: 400px; }
/* [작업내용] 로그인 후 대시보드(회원 메뉴) — form-group 밖 input/select도 통일된 디자인 적용
 * admin.css의 body.admin-page 규칙과 동일한 방식, dashboard 범위로 제한 */
body.dashboard input[type="text"],
body.dashboard input[type="email"],
body.dashboard input[type="password"],
body.dashboard input[type="number"],
body.dashboard input[type="url"],
body.dashboard input[type="search"],
body.dashboard input[type="tel"],
body.dashboard input[type="date"],
body.dashboard input[type="datetime-local"],
body.dashboard input[type="time"],
body.dashboard select,
body.dashboard textarea {
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    font-family: inherit;
    color: var(--text);
    background: #fff;
    box-sizing: border-box;
    transition: border-color 0.15s, box-shadow 0.15s;
    vertical-align: middle;
}
body.dashboard input[type="text"]:focus,
body.dashboard input[type="email"]:focus,
body.dashboard input[type="password"]:focus,
body.dashboard input[type="number"]:focus,
body.dashboard input[type="url"]:focus,
body.dashboard input[type="search"]:focus,
body.dashboard input[type="tel"]:focus,
body.dashboard input[type="date"]:focus,
body.dashboard input[type="datetime-local"]:focus,
body.dashboard input[type="time"]:focus,
body.dashboard select:focus,
body.dashboard textarea:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(211, 47, 47, 0.12);
}
body.dashboard textarea { resize: vertical; min-height: 80px; }
body.dashboard input:disabled,
body.dashboard select:disabled,
body.dashboard textarea:disabled {
    background: #f3f4f6;
    color: #9ca3af;
    cursor: not-allowed;
}
.form-inline { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.data-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.data-table th, .data-table td { padding: 10px 12px; border: 1px solid var(--line); text-align: left; }
.data-table th { background: #f6f6f6; font-weight: 600; }
/* [반응형] 넓은 테이블 감쌈 — 가로 스크롤 (site_plan 2.3) */
/* [비활성화] .table-scroll-wrap 통합 규칙으로 대체 (위에 정의)
.table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 1rem; } */
/* ===== 강좌 가로형 카드 — pricing.php · auto_trading.php 공용 ===== */
.pricing-course-row { display: flex; gap: 24px; margin-bottom: 24px; background: #fff; border-radius: 12px; box-shadow: 0 2px 12px rgba(0,0,0,0.08); border: 1px solid #e5e7eb; overflow: hidden; align-items: stretch; flex-wrap: wrap; }
.pricing-course-img { flex: 0 0 280px; min-height: 200px; background: linear-gradient(135deg, #f0f4f8 0%, #e2e8f0 100%); display: flex; align-items: center; justify-content: center; }
.pricing-course-img img { width: 100%; height: 100%; object-fit: cover; }
.pricing-course-row .pricing-course-img img.pricing-placeholder-img { width: 100%; height: 100%; object-fit: cover; }
.pricing-course-noimg { padding: 0; width: 100%; height: 100%; min-height: 200px; display: flex; align-items: center; justify-content: center; color: #64748b; }
.pricing-course-noimg .pricing-course-placeholder-icon { width: 100%; height: 100%; min-height: 200px; object-fit: cover; display: block; }
.pricing-course-body { flex: 1; min-width: 280px; padding: 24px; display: flex; flex-direction: column; justify-content: center; }
.pricing-course-body h3 { margin: 0 0 12px; font-size: 20px; color: #1a1a1a; }
.pricing-course-body .card-desc { color: #374151; font-size: 14px; line-height: 1.7; margin: 0 0 16px; white-space: pre-line; }
.pricing-course-body .card-price { font-size: 20px; font-weight: 700; color: var(--primary); margin: 0 0 16px; }
/* auto_trading.php 강좌 섹션 — pricing.php #section-course와 동일하게 575px 이미지 폭 적용 */
#section-course-at .pricing-course-img { flex: 0 0 575px; min-height: 200px; }
#section-course-at .pricing-course-noimg .pricing-course-placeholder-icon { width: 575px; max-width: 100%; height: auto; min-height: auto; object-fit: contain; }
@media (max-width: 640px) {
    .pricing-course-img { flex: 0 0 100%; min-height: 160px; }
    /* auto_trading 강좌 이미지도 모바일에서 100% 폭으로 */
    #section-course-at .pricing-course-img {
        flex: 0 0 100%;
        min-height: 180px;
        max-height: 240px;
    }
    #section-course-at .pricing-course-img img,
    #section-course-at .pricing-course-noimg .pricing-course-placeholder-icon {
        width: 100%;
        height: 100%;
        max-width: 100%;
        object-fit: cover;
    }
}

.point-value { font-size: 24px; font-weight: 700; color: var(--primary); margin: 8px 0; }
.page-body { line-height: 1.7; }
.page-body h3 { margin: 1em 0 0.5em; }
.page-body p { margin: 0.5em 0; }
.board-tabs { margin-bottom: 16px; display: flex; gap: 8px; flex-wrap: wrap; }
.board-tabs .btn-outline { border-color: var(--line); color: var(--text); }
.board-tabs .btn.active { background: var(--primary); color: #fff; border-color: var(--primary); }

/* 글쓰기 폼 — 사이즈·하단 옵션/버튼 영역 */
.write-form-card {
    padding: 20px;
    max-width: 960px;
}
/* [작업내용] 1:1 문의 작성(inquiry/write.php) — PC에서 대시보드 본문 가로폭을 최대한 사용(기본 write-form-card 960px 상한 해제) */
@media (min-width: 769px) {
    body.dashboard .main-body.inquiry-write-page .write-form-card {
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
    }
}
/* [반응형] 웹에디터(SmartEditor2) 가로 넘침 방지 — 게시판·1:1문의·FAQ 등 공통, PC/모바일 모두 적용 */
.editor-responsive-wrap {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
}
/* PC에서도 SmartEditor2 컨테이너·툴바가 본문 폭을 넘지 않도록 제한 */
.editor-responsive-wrap #smart_editor2 {
    max-width: 100%;
    box-sizing: border-box;
}
.editor-responsive-wrap #smart_editor2 .se2_tool {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.write-file-row {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 4px;
}
.write-file-row input[type="file"] {
    max-width: 280px;
}
/* [작업내용] 1:1 문의(inquiry/write.php) 이미지 2칸 — 세로 배치 시 좌측·폭 일치(구 image2 margin-left 제거 후 래퍼로 통일) */
.inquiry-write-image-files {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}
.inquiry-write-image-files input[type="file"] {
    width: 100%;
    max-width: 100%;
    margin: 0;
    box-sizing: border-box;
}
.write-form-actions {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.write-form-options {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}
.write-option-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
}
.write-option-label input[type="checkbox"] {
    width: auto;
    margin: 0;
}
.write-form-buttons {
    display: flex;
    gap: 10px;
    align-items: center;
}

.global-site-footer {
    margin-top: 24px;
    background: #e5e7eb;
    color: #1f2937;
    padding: 12px 16px 10px;
    font-size: 12px;
    line-height: 1.4;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
}
.global-site-footer .footer-inner {
    width: 100%;
    max-width: var(--site-max-width);
    box-sizing: border-box;
}
.global-site-footer a {
    color: #1f2937;
    text-decoration: underline;
}
.global-site-footer a:hover {
    color: #111827;
}
.global-site-footer > .banner-slot {
    max-width: var(--site-max-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: 16px;
    padding-right: 16px;
}

/* 회원 아이디 툴팁(드롭다운) — 관리자 목록·1:1문의 등 공통 */
.member-id-cell { position: relative; }
.member-id-trigger { cursor: pointer; color: var(--primary); text-decoration: underline; }
.member-id-trigger:hover { opacity: 0.9; }
/* [작업내용] 회원 아이디 셀 — 로그인 아이디 아래 보조 닉네임(대시보드 등 공통) */
.member-id-nickname { display: block; font-size: 0.88em; color: var(--muted, #64748b); font-weight: 400; text-decoration: none; line-height: 1.3; margin-top: 3px; }
.member-id-menu {
    position: absolute;
    left: 0;
    top: 100%;
    margin-top: 4px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    z-index: 100;
    min-width: 140px;
    padding: 6px 0;
}
.member-id-menu a {
    display: block;
    padding: 8px 14px;
    color: var(--text);
    text-decoration: none;
    font-size: 13px;
    white-space: nowrap;
}
.member-id-menu a:hover { background: #f1f5f9; }

/* ===== 팝업 공지 모달 (중앙, 배경 블러, 하단 오늘하루·닫기) ===== */
.popup-notice-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}
.popup-notice-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    max-height: 100vh;
}
.popup-notice-wrap.popup-notice-center {
    width: 100%;
}
.popup-notice-modal {
    display: none;
    flex-direction: column;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
    max-height: 85vh;
    overflow: hidden;
}
.popup-notice-modal.active {
    display: flex;
}
.popup-notice-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: inherit;
}
.popup-notice-body {
    flex: 1;
    overflow-y: auto;
    padding: 24px;
}
.popup-notice-title {
    margin: 0 0 16px;
    font-size: 1.25rem;
    font-weight: 700;
}
.popup-notice-body-content {
    font-size: 14px;
    line-height: 1.6;
}
.popup-notice-body-content img { max-width: 100%; height: auto; }
.popup-notice-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 14px 20px;
    border-top: 1px solid var(--line);
    background: #fafafa;
}
.popup-notice-hide-today {
    background: none;
    border: none;
    color: var(--muted);
    font-size: 13px;
    cursor: pointer;
    padding: 4px 8px;
}
.popup-notice-hide-today:hover { color: var(--text); }
.popup-notice-close {
    background: none;
    border: none;
    color: var(--primary);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    padding: 4px 12px;
}
.popup-notice-close:hover { text-decoration: underline; }
.popup-notice-pagination {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 auto;
}
.popup-notice-pagination button {
    background: none;
    border: none;
    font-size: 18px;
    cursor: pointer;
    color: var(--text);
    padding: 0 6px;
}
.popup-notice-pagination button:hover { color: var(--primary); }
.popup-notice-page { font-size: 13px; color: var(--muted); }

/* [수정] 전략테스트 통계 툴팁 라벨 — 커스텀 다크 툴팁 트리거 */
.ea-tip {
    cursor: help;
    border-bottom: 1px dotted var(--muted);
    display: inline-block;
}
/* [수정] 커스텀 다크 툴팁 박스 — 이미지 디자인 기준 (어두운 배경·흰 글씨·둥근 모서리) */
#ea-custom-tip {
    display: none;
    position: fixed;
    z-index: 9999;
    background: #1e2029;
    color: #fff;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 12px;
    line-height: 1.7;
    max-width: 280px;
    min-width: 180px;
    box-shadow: 0 4px 18px rgba(0,0,0,.45);
    pointer-events: none;
    word-break: keep-all;
    white-space: pre-line;
}