@charset "utf-8";

@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

:root {
    --bg: #0a0a14;
    --surface: #13131f;
    --surface2: #1c1c2e;
    --border: rgba(255,255,255,0.07);
    --pink: #e91e8c;
    --pink2: #ff6bb5;
    --purple: #9b59e8;
    --blue: #4facfe;
    --green: #00e676;
    --orange: #ff9800;
    --text: #f0f0f8;
    --text2: #a0a0b8;
    --text3: #606078;
}

/* common.css .search-container 오버라이드 - 테마 색상만 */
.search-container { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; }
.search-container .search-group { width: 100%; margin-bottom: 16px; }
.search-container .search-group input { background: var(--surface2); color: var(--text); border-color: rgba(255,255,255,0.15); }
.search-container .search-group input::placeholder { color: var(--text3); }
.search-container .search-group input:focus { border-color: var(--blue); }

#analyzeBtn { padding: 12px 32px; background: linear-gradient(135deg, var(--purple), var(--pink)); color: #fff; border: none; border-radius: 8px; font-size: 15px; font-weight: 600; cursor: pointer; transition: opacity 0.2s; }
#analyzeBtn:hover { opacity: 0.9; }
#analyzeBtn:disabled { opacity: 0.6; cursor: not-allowed; }
.place-input-section-print { color: var(--text2); }
.place-input-section-print:hover { color: var(--text); }

#loadingSection { display: none; }
.loading-spinner { display: inline-block; width: 48px; height: 48px; border: 4px solid rgba(255,255,255,0.1); border-top-color: var(--blue); border-radius: 50%; animation: spin 1s linear infinite; }
.loading-text { margin-top: 16px; color: var(--text2); }

.rpt_cont { display: none; width: 100%; margin-bottom: 24px; }
.section-title { font-size: 1.1rem; font-weight: 700; margin-bottom: 16px; color: var(--text); display: flex; align-items: center; gap: 8px; }
.place-input-notice-wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; width: 100%; }
.place-input-notice { flex: 1 1 auto; min-width: 0; background: rgba(79,172,254,0.08); border: 1px solid rgba(79,172,254,0.2); border-radius: 8px; padding: 14px 18px; box-sizing: border-box; }
.place-input-notice-wrap .place-input-section-print { flex-shrink: 0; }
.place-input-notice p { margin: 0; color: var(--text2); font-size: 0.9rem; line-height: 1.6; }
.place-input-notice i { color: var(--blue); margin-right: 8px; }

.basic-info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.info-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 18px; text-align: center; }
.info-card-label { font-size: 0.8rem; color: var(--text3); margin-bottom: 8px; }
.info-card-value, .info-card-value-large { font-size: 1.25rem; font-weight: 700; color: var(--text); }
.info-card-value-purple { color: var(--purple); }
.info-card-value-blue { color: var(--blue); }
.info-card-value-orange { color: var(--orange); }

.status-banner-wrap { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; width: 100%; }
.status-banner { display: flex; align-items: center; gap: 12px; padding: 16px 20px; border-radius: 12px; font-size: 0.95rem; font-weight: 600; flex: 1 1 auto; min-width: 0; }
.status-banner-wrap #naverLinkWrap { flex-shrink: 0; margin-left: auto; }
.status-banner.status-found { background: linear-gradient(135deg, rgba(0,230,118,.15), rgba(0,200,83,.08)); border: 1px solid rgba(0,230,118,.35); color: #00e676; }
.status-banner.status-miss { background: linear-gradient(135deg, rgba(255,82,82,.15), rgba(255,82,82,.08)); border: 1px solid rgba(255,82,82,.3); color: #ff7070; }
.status-banner .status-icon { font-size: 1.2rem; }
.status-banner strong { color: #fff; }

.naver-link { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; background: rgba(3,199,90,.15); border: 1px solid rgba(3,199,90,.35); border-radius: 20px; color: #03c75a; font-size: 0.85rem; font-weight: 600; text-decoration: none; }
.naver-link:hover { background: rgba(3,199,90,.25); }

.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 20px; }
.stat-grid:has(.stat-view) { grid-template-columns: repeat(4, 1fr); }
.stat-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 16px 12px; text-align: center; transition: transform 0.2s, border-color 0.2s; }
.stat-card:hover { transform: translateY(-2px); border-color: rgba(255,255,255,.15); }
.stat-card.stat-highlight { background: linear-gradient(135deg, rgba(233,30,140,.15), rgba(155,89,232,.1)); border-color: rgba(233,30,140,.35); }
.stat-card.stat-view { background: linear-gradient(135deg, rgba(79,172,254,.15), rgba(155,89,232,.1)); border-color: rgba(79,172,254,.35); }
.stat-card .stat-icon { font-size: 1.3rem; margin-bottom: 6px; }
.stat-card .stat-val { font-size: 1.35rem; font-weight: 800; color: #fff; margin-bottom: 4px; }
.stat-card .stat-lbl { font-size: 0.7rem; color: var(--text3); letter-spacing: 0.04em; }

.section-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; margin-bottom: 20px; }
.card-head { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--border); font-size: 0.88rem; font-weight: 700; color: var(--text2); }
.card-head-dot { width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(135deg, var(--pink), var(--purple)); flex-shrink: 0; }
.table-wrap { overflow-x: auto; }
#sectionTable { width: 100%; border-collapse: collapse; min-width: 360px; }
#sectionTable th { padding: 11px 14px; text-align: left; font-size: 0.75rem; font-weight: 600; color: var(--text3); background: rgba(0,0,0,.2); border-bottom: 1px solid var(--border); }
#sectionTable td { padding: 12px 14px; font-size: 0.85rem; border-bottom: 1px solid rgba(255,255,255,.04); vertical-align: middle; color: var(--text2); }
#sectionTable tr:last-child td { border-bottom: none; }
#sectionTable tr:hover td { background: rgba(255,255,255,.03); }
.sec-num { color: var(--text3); width: 36px; font-size: 0.78rem; }
.sec-name { font-weight: 500; color: var(--text); }
.sec-total { color: var(--text3); text-align: center; white-space: nowrap; }
.rank-cell { text-align: right; white-space: nowrap; }
.rank-badge { display: inline-block; padding: 4px 10px; border-radius: 20px; font-size: 0.78rem; font-weight: 700; }
.rank-badge.found { background: linear-gradient(135deg, rgba(0,230,118,.25), rgba(0,200,83,.15)); border: 1px solid rgba(0,230,118,.45); color: #00e676; }
.rank-badge.miss { background: rgba(255,255,255,.06); border: 1px solid var(--border); color: var(--text3); }
.rank-badge.view-rank { background: linear-gradient(135deg, rgba(79,172,254,.25), rgba(155,89,232,.2)); border: 1px solid rgba(79,172,254,.45); color: var(--blue); }
.rank-total { font-size: 0.75rem; color: var(--text3); margin-left: 4px; }
.found-row td { background: rgba(0,230,118,.04); }
.view-sum-row td { background: rgba(79,172,254,.06); font-weight: 600; }
.sum-badge { display: inline-block; font-size: 0.68rem; font-weight: 600; padding: 2px 7px; border-radius: 10px; background: rgba(79,172,254,.15); color: var(--blue); border: 1px solid rgba(79,172,254,.3); margin-left: 6px; vertical-align: middle; }

.detail-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; margin-bottom: 12px; }
.detail-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--border); background: rgba(0,0,0,.15); }
.detail-sec { font-weight: 700; font-size: 0.88rem; color: var(--text); }
.detail-rank-badge { font-size: 0.75rem; font-weight: 700; padding: 4px 12px; border-radius: 20px; background: linear-gradient(135deg, var(--pink), var(--purple)); color: #fff; white-space: nowrap; }
.entry-table { width: 100%; border-collapse: collapse; }
.entry-table th { font-size: 0.72rem; padding: 10px 14px; text-align: left; background: rgba(0,0,0,.2); border-bottom: 1px solid var(--border); color: var(--text3); }
.entry-table td { padding: 11px 14px; font-size: 0.85rem; border-bottom: 1px solid rgba(255,255,255,.04); color: var(--text2); }
.e-rank { text-align: center; width: 50px; }
.rank-num { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; font-size: 0.8rem; font-weight: 700; background: var(--surface2); color: var(--text3); border: 1px solid var(--border); }
.rank-num.rank-me { background: linear-gradient(135deg, var(--pink), var(--purple)); color: #fff; border: none; }
.entry-me td { background: rgba(233,30,140,.08); }
.tag { display: inline-block; font-size: 0.72rem; font-weight: 600; border-radius: 6px; padding: 3px 8px; white-space: nowrap; }
.tag-blog { background: rgba(79,172,254,.15); color: var(--blue); border: 1px solid rgba(79,172,254,.3); }
.tag-cafe { background: rgba(255,152,0,.15); color: var(--orange); border: 1px solid rgba(255,152,0,.3); }
.tag-inf { background: rgba(155,89,232,.2); color: #c084fc; border: 1px solid rgba(155,89,232,.35); }
.me-badge { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 10px; font-size: 0.7rem; font-weight: 700; background: linear-gradient(90deg, var(--pink), var(--purple)); color: #fff; vertical-align: middle; }
.e-id a { color: var(--blue); text-decoration: none; }
.e-id a:hover { color: var(--pink2); text-decoration: underline; }

@media (max-width: 600px) { .basic-info-grid { grid-template-columns: 1fr; } .stat-grid { grid-template-columns: repeat(2, 1fr); } }
@media print { .search-container, #analyzeBtn, #loadingSection { display: none !important; } .rpt_cont { display: block !important; } }