:root {
    --sd-bg: #fffafc;
    --sd-card: #ffffff;
    --sd-text: #2b2630;
    --sd-sub: #726a76;
    --sd-line: #eee5eb;
    --sd-accent: #ef5f91;
    --sd-accent-soft: #fff0f5;
    --sd-blue: #4b75d8;
    --sd-red: #d94d65;
    --sd-shadow: 0 14px 40px rgba(56, 36, 48, .07);
}

.sd-wrap { max-width: 1480px; margin: 38px auto 70px; padding: 0 20px; color: var(--sd-text); box-sizing: border-box; }
.sd-wrap * { box-sizing: border-box; }
.sd-hero { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; padding:28px 30px; border:1px solid var(--sd-line); border-radius:24px; background:linear-gradient(135deg,#fff,#fff6f9); box-shadow:var(--sd-shadow); }
.sd-eyebrow { margin:0 0 7px; color:var(--sd-accent); font-weight:800; font-size:12px; letter-spacing:.08em; }
.sd-hero h1 { margin:0; font-size:30px; line-height:1.2; letter-spacing:-.04em; }
.sd-desc { margin:10px 0 0; color:var(--sd-sub); font-size:15px; }
.sd-hero-badge { flex:0 0 auto; padding:9px 13px; border-radius:999px; background:var(--sd-accent-soft); color:#bd3f6c; font-weight:800; font-size:12px; }
.sd-alert { margin-top:16px; padding:14px 16px; border-radius:14px; display:flex; gap:8px; flex-wrap:wrap; font-size:13px; }
.sd-alert-error { background:#fff0f1; color:#a5273d; border:1px solid #ffd5dc; }
.sd-alert-warn { background:#fff8e8; color:#8c6515; border:1px solid #ffe4a4; }
.sd-toolbar { display:flex; justify-content:space-between; align-items:center; gap:18px; margin:24px 0 14px; }
.sd-month-nav { display:flex; align-items:center; gap:14px; }
.sd-nav-btn { width:42px; height:42px; display:grid; place-items:center; border:1px solid var(--sd-line); border-radius:13px; background:var(--sd-card); color:var(--sd-text); font-size:25px; text-decoration:none; }
.sd-current-month { min-width:145px; text-align:center; }
.sd-current-month strong { display:block; font-size:20px; letter-spacing:-.03em; }
.sd-current-month span { display:block; margin-top:3px; color:var(--sd-sub); font-size:12px; }
.sd-jump { display:flex; gap:8px; }
.sd-jump select,.sd-jump button { height:40px; border:1px solid var(--sd-line); border-radius:11px; background:var(--sd-card); color:var(--sd-text); padding:0 12px; }
.sd-jump button { background:var(--sd-text); color:#fff; border-color:var(--sd-text); font-weight:700; cursor:pointer; }
.sd-tabs { display:flex; gap:8px; overflow-x:auto; padding:2px 0 14px; scrollbar-width:none; }
.sd-tabs::-webkit-scrollbar { display:none; }
.sd-tabs a { flex:0 0 auto; padding:9px 14px; border:1px solid var(--sd-line); border-radius:999px; background:var(--sd-card); color:var(--sd-sub); text-decoration:none; font-size:13px; font-weight:700; }
.sd-tabs a.is-active { background:var(--sd-accent); color:#fff; border-color:var(--sd-accent); }
.sd-main-layout { position:relative; min-width:0; padding-right:340px; }
.sd-calendar-card,.sd-list-card { min-width:0; border:1px solid var(--sd-line); border-radius:22px; background:var(--sd-card); box-shadow:var(--sd-shadow); overflow:hidden; }
.sd-weekdays,.sd-calendar { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); }
.sd-weekdays { border-bottom:1px solid var(--sd-line); background:#fffafb; }
.sd-weekdays div { padding:12px 8px; text-align:center; font-size:12px; font-weight:800; color:var(--sd-sub); }
.sd-weekdays .sun { color:var(--sd-red); }.sd-weekdays .sat { color:var(--sd-blue); }
.sd-day { min-height:132px; padding:11px; border-right:1px solid var(--sd-line); border-bottom:1px solid var(--sd-line); background:var(--sd-card); }
.sd-day:nth-child(7n) { border-right:0; }
.sd-day.is-empty { background:#fcfafb; }
.sd-day-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.sd-date { width:29px; height:29px; display:grid; place-items:center; border-radius:50%; font-weight:800; font-size:13px; }
.sd-day.is-sun .sd-date,.sd-day.is-holiday .sd-date { color:var(--sd-red); }
.sd-day.is-sat .sd-date { color:var(--sd-blue); }
.sd-day.is-today .sd-date { background:var(--sd-accent); color:#fff; }
.sd-count { min-width:20px; height:20px; padding:0 6px; display:grid; place-items:center; border-radius:999px; background:#f4eff2; color:var(--sd-sub); font-size:10px; font-weight:800; }
.sd-events { display:flex; flex-direction:column; gap:5px; }
.sd-event { min-width:0; display:flex; align-items:center; gap:6px; padding:5px 6px; border-radius:8px; background:#faf7f9; font-size:11px; line-height:1.35; }
.sd-dot { width:6px; height:6px; border-radius:50%; flex:0 0 auto; background:#aaa; }
.sd-event-name { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.type-national .sd-dot,.sd-chip.type-national { background:#f4e6ea; color:#a83a56; }.type-national .sd-dot { background:#d94d65; }
.type-rest .sd-dot,.sd-chip.type-rest { background:#ffe9ef; color:#b83f64; }.type-rest .sd-dot { background:#ef5f91; }
.type-anniversary .sd-dot,.sd-chip.type-anniversary { background:#f0ecff; color:#6d56b4; }.type-anniversary .sd-dot { background:#8d75d6; }
.type-solar .sd-dot,.sd-chip.type-solar { background:#eaf5ff; color:#3e6eaa; }.type-solar .sd-dot { background:#6093d0; }
.type-sundry .sd-dot,.sd-chip.type-sundry { background:#eaf8f1; color:#3e7b5c; }.type-sundry .sd-dot { background:#5ca57c; }
.sd-event.is-off { background:#fff2f5; color:#b23355; font-weight:700; }
.sd-list-card { position:absolute; top:0; right:0; bottom:0; width:320px; margin-top:0; padding:24px; display:flex; flex-direction:column; overflow:hidden; }
.sd-section-title { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:16px; }
.sd-section-title h2 { margin:0; font-size:21px; letter-spacing:-.03em; }
.sd-refresh { color:var(--sd-sub); text-decoration:none; font-size:12px; border-bottom:1px solid currentColor; }
.sd-list { display:flex; flex:0 0 auto; min-height:0; flex-direction:column; overflow:visible; }
.sd-list-item { display:flex; gap:16px; align-items:center; padding:15px 2px; border-top:1px solid var(--sd-line); }
.sd-list-item:first-child { border-top:0; }
.sd-list-date { width:58px; flex:0 0 58px; text-align:center; }
.sd-list-date strong { display:block; font-size:22px; line-height:1; }.sd-list-date span { display:block; margin-top:5px; color:var(--sd-sub); font-size:11px; }
.sd-list-date.is-off strong { color:var(--sd-red); }
.sd-list-main { min-width:0; flex:1; }
.sd-list-main h3 { margin:7px 0 0; font-size:15px; line-height:1.4; }
.sd-list-meta { display:flex; gap:6px; flex-wrap:wrap; }
.sd-chip { display:inline-flex; align-items:center; height:22px; padding:0 8px; border-radius:999px; font-size:10px; font-weight:800; background:#f2eef1; color:#655e64; }
.sd-chip.is-holiday-chip { background:#fff0f3; color:#bd3f5e; }
.sd-empty { padding:40px 15px; text-align:center; color:var(--sd-sub); }
.sd-pagination { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:4px; margin-top:auto; padding-top:16px; border-top:1px solid var(--sd-line); }
.sd-pagination a,.sd-pagination strong { width:26px; height:28px; display:grid; place-items:center; border:1px solid var(--sd-line); border-radius:9px; background:var(--sd-card); color:var(--sd-sub); font-size:12px; font-weight:800; line-height:1; text-decoration:none; }
.sd-pagination a:hover { border-color:var(--sd-accent); color:var(--sd-accent); }
.sd-pagination strong.is-active { border-color:var(--sd-accent); background:var(--sd-accent); color:#fff; }
.sd-source { margin-top:14px; text-align:right; color:var(--sd-sub); font-size:11px; }

@media (max-width: 860px) {
    .sd-main-layout { padding-right:0; }
    .sd-list-card { position:relative; top:auto; right:auto; bottom:auto; width:auto; margin-top:20px; }
}

@media (max-width: 900px) {
    .sd-day { min-height:110px; padding:8px; }
    .sd-event { padding:4px; font-size:10px; }
}

@media (max-width: 640px) {
    .sd-wrap { margin:20px auto 48px; padding:0 10px; }
    .sd-hero { align-items:flex-start; padding:22px 20px; border-radius:18px; }
    .sd-hero h1 { font-size:24px; }.sd-desc { font-size:13px; }.sd-hero-badge { display:none; }
    .sd-toolbar { align-items:stretch; flex-direction:column; }
    .sd-month-nav { justify-content:space-between; }
    .sd-jump { display:grid; grid-template-columns:1fr 1fr 72px; }
    .sd-jump select,.sd-jump button { width:100%; }

    /* v1.0.10: 모바일에서는 달력을 가로 스크롤시키지 않고 화면 폭에 맞춤 */
    .sd-calendar-card { width:100%; max-width:100%; border-radius:16px; overflow:hidden; }
    .sd-weekdays,.sd-calendar { width:100%; min-width:0; grid-template-columns:repeat(7,minmax(0,1fr)); }
    .sd-weekdays div { min-width:0; padding:9px 1px; font-size:10px; }
    .sd-day { min-width:0; min-height:84px; padding:5px 3px; overflow:hidden; }
    .sd-day-top { margin-bottom:4px; }
    .sd-date { width:24px; height:24px; font-size:11px; }
    .sd-count { min-width:16px; height:16px; padding:0 4px; font-size:9px; }
    .sd-events { gap:3px; }
    .sd-event { gap:3px; padding:3px 3px; border-radius:6px; font-size:9px; line-height:1.25; }
    .sd-dot { width:4px; height:4px; }
    .sd-event-name { min-width:0; }

    .sd-list-card { padding:18px 15px; border-radius:16px; }
    .sd-section-title { align-items:flex-start; flex-direction:column; gap:8px; }
    .sd-source { text-align:left; }
}

@media (max-width: 390px) {
    .sd-wrap { padding:0 8px; }
    .sd-weekdays div { padding:8px 0; font-size:9px; }
    .sd-day { min-height:78px; padding:4px 2px; }
    .sd-date { width:22px; height:22px; font-size:10px; }
    .sd-count { min-width:15px; height:15px; padding:0 3px; font-size:8px; }
    .sd-event { gap:2px; padding:3px 2px; font-size:8px; }
    .sd-dot { width:3px; height:3px; }
}

body.dark-mode .sd-wrap,
html[data-theme="dark"] .sd-wrap,
body[data-theme="dark"] .sd-wrap {
    --sd-bg:#171419; --sd-card:#211d23; --sd-text:#f6edf2; --sd-sub:#b9adb5; --sd-line:#3a3138; --sd-accent-soft:#3a202b; --sd-shadow:none;
}
body.dark-mode .sd-hero, body.dark-mode .sd-weekdays, body.dark-mode .sd-day.is-empty,
html[data-theme="dark"] .sd-hero, html[data-theme="dark"] .sd-weekdays, html[data-theme="dark"] .sd-day.is-empty,
body[data-theme="dark"] .sd-hero, body[data-theme="dark"] .sd-weekdays, body[data-theme="dark"] .sd-day.is-empty { background:#211d23; }
body.dark-mode .sd-event, html[data-theme="dark"] .sd-event, body[data-theme="dark"] .sd-event { background:#2a242a; }

/* v1.0.9 - 페이지 내 API 설정 */
.sd-hero-actions { display:flex; align-items:center; gap:9px; flex-wrap:wrap; justify-content:flex-end; }
.sd-settings-btn { display:inline-flex; align-items:center; gap:6px; min-height:36px; padding:0 12px; border:1px solid var(--sd-line); border-radius:999px; background:var(--sd-card); color:var(--sd-text); text-decoration:none; font-size:12px; font-weight:800; white-space:nowrap; }
.sd-settings-btn:hover { border-color:var(--sd-accent); color:var(--sd-accent); }
.sd-settings-card { margin:0 0 18px; padding:22px; border:1px solid var(--sd-line); border-radius:20px; background:var(--sd-card); box-shadow:var(--sd-shadow); }
.sd-settings-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; }
.sd-settings-head h2 { margin:0; font-size:20px; letter-spacing:-.03em; }
.sd-settings-head p:not(.sd-eyebrow) { margin:7px 0 0; color:var(--sd-sub); font-size:12px; line-height:1.6; }
.sd-settings-close { width:34px; height:34px; display:grid; place-items:center; flex:0 0 auto; border:1px solid var(--sd-line); border-radius:50%; color:var(--sd-sub); text-decoration:none; font-size:22px; line-height:1; }
.sd-settings-form { display:grid; grid-template-columns:minmax(160px,.42fr) minmax(280px,1fr); gap:12px; margin-top:18px; }
.sd-settings-field { display:flex; flex-direction:column; justify-content:center; gap:7px; min-width:0; padding:13px 14px; border:1px solid var(--sd-line); border-radius:14px; background:var(--sd-bg); }
.sd-settings-field > span { color:var(--sd-sub); font-size:11px; font-weight:800; }
.sd-settings-field > strong { overflow:hidden; color:var(--sd-text); font-size:13px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.sd-settings-key-field input { width:100%; height:38px; padding:0 11px; border:1px solid var(--sd-line); border-radius:10px; background:var(--sd-card); color:var(--sd-text); font:inherit; font-size:13px; outline:none; box-sizing:border-box; }
.sd-settings-key-field input:focus { border-color:var(--sd-accent); box-shadow:0 0 0 3px var(--sd-accent-soft); }
.sd-settings-actions { grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.sd-settings-actions span { color:var(--sd-sub); font-size:11px; }
.sd-settings-actions button { min-height:38px; padding:0 16px; border:0; border-radius:11px; background:var(--sd-accent); color:#fff; font:inherit; font-size:12px; font-weight:800; cursor:pointer; }
.sd-inline-notice { margin-top:14px; padding:10px 12px; border-radius:11px; font-size:12px; font-weight:700; }
.sd-inline-notice.is-success { background:#edf9f2; color:#28734a; }
.sd-inline-notice.is-error { background:#fff0f3; color:#b53355; }

@media (max-width: 720px) {
    /* v1.0.12: 모바일 상단 제목이 API 설정 영역에 눌려 두 줄로 내려가지 않도록 분리 */
    .sd-hero { flex-direction:column; align-items:flex-start; }
    .sd-hero > div:first-child { width:100%; min-width:0; }
    .sd-hero h1 { max-width:100%; white-space:nowrap; word-break:keep-all; overflow-wrap:normal; }
    .sd-hero-actions { width:100%; justify-content:flex-start; }
    .sd-settings-form { grid-template-columns:1fr; }
    .sd-settings-actions { grid-column:auto; align-items:stretch; flex-direction:column; }
    .sd-settings-actions button { width:100%; }
}
