:root { 
    --primary: #0A3254; --primary-light: #EBF2F9; --bg: #F8F9FA; 
    --card-bg: #FFFFFF; --text: #222222; --muted: #777777; --header-height: 64px;
}
[data-theme="dark"] {
    --primary: #64B5F6; --primary-light: #1A2A3A; --bg: #121212; 
    --card-bg: #1E1E1E; --text: #E0E0E0; --muted: #AAAAAA;
}
[data-theme="dark"] body { background-color: var(--bg); color: var(--text); }
[data-theme="dark"] .main-header { background: #111111; border-bottom: 1px solid #333; }
[data-theme="dark"] .board-list, [data-theme="dark"] .container, [data-theme="dark"] .worship-sheet-card, 
[data-theme="dark"] .public-groups-section-card, 
[data-theme="dark"] .part-group-container-card, [data-theme="dark"] .prayer-card, [data-theme="dark"] .month-card, 
[data-theme="dark"] .modal-box, [data-theme="dark"] .admin-room-sidebar, [data-theme="dark"] .crm-vertical-form,
[data-theme="dark"] .board-item, [data-theme="dark"] .admin-room-content {
    background-color: var(--card-bg); border-color: #333; color: var(--text);
}
[data-theme="dark"] .input-text, [data-theme="dark"] .input-textarea, [data-theme="dark"] .month-textarea, [data-theme="dark"] select {
    background-color: #2C2C2C; border-color: #444; color: #FFF;
}
[data-theme="dark"] .month-textarea:disabled { background-color: #1A1A1A; color: #777; border-color:#333; }
[data-theme="dark"] .right-sidebar, [data-theme="dark"] .left-sidebar { background-color: #121212; border-color: #333; }
[data-theme="dark"] .sidebar-content, [data-theme="dark"] .public-team-scroll-box { background-color: var(--bg); }
[data-theme="dark"] .card-item, [data-theme="dark"] .matrix-cell-btn { background-color: #2C2C2C; color: #CCC; border: 1px solid #333; }
[data-theme="dark"] .crm-member-node { background-color: #2C2C2C; border-color: #444; }
[data-theme="dark"] .crm-member-node:hover { background-color: #3C3C3C; }
[data-theme="dark"] .header h1, [data-theme="dark"] .room-section-title, [data-theme="dark"] .month-header, [data-theme="dark"] .public-team-scroll-box h3, [data-theme="dark"] h2, [data-theme="dark"] h3 { color: var(--text); }
[data-theme="dark"] .sidebar-header { background-color: var(--card-bg); color: var(--text); border-color: #333; }
[data-theme="dark"] .month-recurring-label { background: #1A2A3A; color: #64B5F6; }
[data-theme="dark"] .month-recurring-label.disabled { background: #333; color: #777; }
[data-theme="dark"] hr, [data-theme="dark"] .matrix-row { border-color: #444; }
[data-theme="dark"] .btn-cancel, [data-theme="dark"] .btn-card-action { background: #333; color: #E0E0E0; }
[data-theme="dark"] .member-select-btn { background: #2C2C2C; color: #E0E0E0; border-color: #444; }
[data-theme="dark"] .member-select-btn:hover { background: #1A2A3A; border-color: #64B5F6; }
[data-theme="dark"] .stat-pill { background: #222; border-color: #333; color: #FFF; }
[data-theme="dark"] .btn-delete-input { background: #3A1A1A; color: #FF5252; }
[data-theme="dark"] .part-member-badge-pill { background: #2C2C2C; border-color: #444; color: #FFF; }
[data-theme="dark"] .prayer-content { border-top-color: #444; }

body { background-color: var(--bg); color: var(--text); font-family: 'Pretendard', -apple-system, sans-serif; margin: 0; padding: 0; height: 100vh; display: flex; flex-direction: column; overflow: hidden; transition: background-color 0.3s, color 0.3s; }

.main-header { height: var(--header-height); background: var(--primary); display: flex; justify-content: space-between; align-items: center; padding: 0 16px; flex-shrink: 0; z-index: 1000; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
.logo-zone { font-size: 14.5px; font-weight: 800; color: #FFFFFF; letter-spacing: -0.5px; white-space: nowrap; }
.nav-menu { display: flex; gap: 2px; }
.nav-item { background: transparent; border: none; padding: 8px 12px; border-radius: 8px; font-size: 12.5px; font-weight: 700; color: #9ABCE0; cursor: pointer; transition: all 0.2s; white-space: nowrap; }
.nav-item:hover { background: rgba(255, 255, 255, 0.1); color: #FFFFFF; }
.nav-item.active { background: #FFFFFF; color: #0A3254; box-shadow: 0 2px 6px rgba(0,0,0,0.1); }
.page-section { display: none; height: calc(100vh - var(--header-height)); width: 100%; box-sizing: border-box; overflow: hidden; }

.navy-panel { background: #2B3A4A !important; border: none !important; box-shadow: 0 6px 16px rgba(0,0,0,0.08) !important; }
.navy-panel .ws-panel-header, .navy-panel .sidebar-header, .navy-panel .ws-panel-header span { color: #FFFFFF !important; border-bottom-color: rgba(255,255,255,0.1) !important; }
.navy-panel .empty-state { color: rgba(255,255,255,0.6) !important; }
.navy-panel .matrix-table { background: #FFFFFF; }
.navy-panel .matrix-th { background: #EBF2F9; color: #0A3254; border-bottom: 2px solid #D1D9E0; }
.navy-panel .matrix-td.part-name { background: #F8F9FA; border-right: 1px solid #F0F0EB; }

.board-container { width: 100%; max-width: 900px; margin: 20px auto; padding: 24px; box-sizing: border-box; height: 100%; overflow-y: auto; border-radius: 20px; }
.notice-card { background: #37475A; border-radius: 12px; padding: 16px 20px; margin-bottom: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); transition: 0.2s; color: #FFF; }
.notice-card.pinned { border-left: 5px solid #FF3B30; }
.notice-card.normal { border-left: 5px solid #64B5F6; }
.notice-title { font-size: 16px; font-weight: 800; color: #FFF; margin-bottom: 8px; line-height: 1.3; display: flex; align-items: center; gap: 8px; }
.notice-meta { font-size: 12px; color: #A0B0C0; font-weight: 600; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px dashed rgba(255,255,255,0.1); padding-bottom: 8px; margin-bottom: 10px; }
.notice-content { font-size: 14px; color: #E0E6ED; line-height: 1.5; white-space: pre-wrap; font-weight: 400; }
.notice-actions { display: flex; gap: 6px; }

#page-prayer .app-layout { display: flex; width: 100%; height: 100%; }
#page-prayer .left-sidebar { width: 480px; background: #161616; display: flex; flex-direction: column; height: 100%; border-right: 1px solid #222; }
#page-prayer .right-sidebar { width: 400px; display: flex; flex-direction: column; height: 100%; border-left: 1px solid #EFEFEA; }
#page-prayer .sidebar-content { flex: 1; padding: 16px; overflow-y: auto; background: transparent; }
#page-prayer .main-content { flex: 1; padding: 24px 20px; overflow-y: auto; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; }
.mini-stats-bar { display: flex; gap: 6px; width: 100%; max-width: 440px; margin-bottom: 12px; }
.stat-pill { background: var(--card-bg); border: 1px solid #EFEFEA; padding: 6px 12px; border-radius: 8px; font-size: 11.5px; font-weight: 700; }
.stat-pill.total { background: var(--primary); color: white; border: none; box-shadow: 0 4px 10px rgba(10,50,84,0.15); }
.container { background: #EAE6DF; border: 1px solid #D4CFC6; border-radius: 20px; width: 100%; max-width: 440px; padding: 20px; box-sizing: border-box; border-bottom: 3px solid #C2BDB3; }
[data-theme="dark"] .container { background-color: #3C3835; border-color: #2D2A27; color: #E0E0E0; }

.header { text-align: center; margin-bottom: 12px; }
.header h1 { font-size: 16px; font-weight: 800; color: var(--text); margin: 4px 0; }
.icon-box { background: #FFF0F0; width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin: 0 auto; color: #FF3B30; font-size: 16px; }
.form-group { margin-bottom: 12px; }
.input-inline { display: flex; gap: 6px; }
.input-text { width: 100%; padding: 10px 12px; border: 1px solid #E4E4DF; border-radius: 10px; box-sizing: border-box; font-size: 13px; outline: none; background-color: #FFFFFF; color: #333; }
.input-text:focus { border-color: var(--primary); }
.input-textarea { width: 100%; height: 140px; padding: 12px; border: 1px solid #E4E4DF; border-radius: 10px; box-sizing: border-box; font-size: 13.5px; outline: none; resize: none; font-family: inherit; background: #FFFFFF; line-height: 1.5; color: #333; }
.btn-add-input { background: none; border: 2px dashed #BAC6D4; color: #556B82; width: 100%; padding: 8px; border-radius: 10px; font-size: 12px; font-weight: 700; cursor: pointer; }
.btn-submit { width: 100%; background: var(--primary); color: white; border: none; padding: 11px; border-radius: 10px; font-size: 13.5px; font-weight: 700; cursor: pointer; text-align: center; display: flex; align-items: center; justify-content: center; gap: 6px; transition: 0.2s; }
.btn-submit:hover { opacity: 0.9; }
.btn-cancel { width: 100%; background: #EFEFEA; color: #333; border: none; padding: 8px; border-radius: 10px; font-size: 12px; font-weight: 600; cursor: pointer; margin-top: 6px; }
.btn-delete-input { background: #FFF0F0; color: #FF3B30; border: none; padding: 4px 8px; border-radius: 6px; font-size: 11px; font-weight: bold; cursor: pointer; }
.sidebar-header { padding: 16px 20px; font-size: 13.5px; font-weight: 700; color: var(--text); border-bottom: 1px solid #F5F5F0; background: var(--card-bg); }
#page-prayer .left-sidebar .sidebar-header { background: #111; color: white; border-bottom: 1px solid #222; }
.share-center-box { padding: 16px; display: flex; flex-direction: column; gap: 12px; height: calc(100% - 50px); overflow-y: auto; box-sizing: border-box; }
.empty-state { text-align: center; color: var(--muted); padding: 40px 0; font-size: 12.5px; }
.prayer-card { background: var(--card-bg); border: 1px solid #EFEFEA; border-radius: 14px; padding: 12px; margin-bottom: 8px; transition: 0.2s; }
.prayer-card:hover { border-color: #D1D9E0; }
.card-header { display: flex; justify-content: space-between; align-items: center; font-size: 13px; }
.card-actions { display: flex; gap: 3px; align-items: center; }
.btn-card-action { background: #F5F5F0; color: #555; border: none; padding: 3px 6px; border-radius: 5px; font-size: 10px; cursor: pointer; font-weight: bold; z-index: 10; position: relative; }
.btn-card-action:hover { background: #E4E4DF; }
.prayer-content { display: none; margin-top: 10px; border-top: 1px dashed #EFEFEA; padding-top: 8px; cursor: default; }
.prayer-card.expanded .prayer-content { display: block; }
.prayer-card.expanded .toggle-hint { transform: rotate(180deg); }
.toggle-hint { font-size: 10px; color: #999; margin-right: 4px; transition: transform 0.2s; display: inline-block; }
.card-item { font-size: 12.5px; color: #333; margin: 4px 0; padding: 8px 10px; background: #FDFDFB; border-radius: 6px; border-left: 3px solid var(--primary); white-space: pre-wrap; word-break: break-all; line-height:1.4; }

.worship-layout-v3 { display: grid; grid-template-columns: 0.8fr 1.2fr 1fr; gap: 16px; height: 100%; padding: 16px 20px; box-sizing: border-box; align-items: stretch; }
.ws-panel { border-radius: 16px; padding: 20px; display: flex; flex-direction: column; overflow: hidden; }
.ws-panel-header { font-size: 15px; font-weight: 800; padding-bottom: 8px; margin-bottom: 12px; display: flex; justify-content: space-between; align-items: center; }
.ws-scroll-area { flex: 1; overflow-y: auto; padding-right: 4px; display: flex; flex-direction: column; gap: 20px; }

.cal-module { background: #FCFCFA; border: 1px solid #E4E4DF; border-radius: 12px; padding: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.05); }
.cal-title { font-size: 13px; font-weight: 800; text-align: center; margin-bottom: 8px; color: #333; }
.calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; text-align: center; }
.cal-header-row { font-size: 11px; font-weight: 800; padding: 4px 0; color: var(--muted); }
.cal-day { font-size: 13px; font-weight: 600; padding: 8px 0; border-radius: 8px; display: flex; align-items: center; justify-content: center; height: 34px; box-sizing: border-box; color: #333; }
.cal-day.sunday { color: #FF3B30; font-weight: 800; cursor: pointer; background: #FFF0F0; border: 1px solid #FFD1D1; transition: 0.2s; }
.cal-day.sunday:hover { background: #FF3B30; color: white; transform: translateY(-1px); }
.cal-day.sunday.active { background: #FF3B30; color: white; border-color: #FF3B30; box-shadow: inset 0 0 10px rgba(0,0,0,0.1); }
.cal-day.muted { color: #DDD; }

.matrix-table { width: 100%; border-collapse: collapse; border-radius: 12px; overflow: hidden; border: 1px solid #E4E4DF; table-layout: fixed; }
.matrix-th { background: var(--primary-light); color: var(--primary); padding: 10px 4px; font-size: 12.5px; font-weight: 800; text-align: center; border-bottom: 2px solid #E4E4DF; }
.matrix-td { padding: 6px; border-bottom: 1px solid #F5F5F0; text-align: center; border-left: 1px solid #F5F5F0; vertical-align: middle; }
.matrix-td.part-name { font-weight: 800; font-size: 12px; color: var(--text); text-align: left; padding-left: 8px; background: #FCFCFA; }
.matrix-td.disabled { background: #F8F9FA; color: #BBB; font-size: 11px; font-weight: 600; }
.matrix-cell-btn { width: 100%; min-height: 38px; padding: 6px 2px; border-radius: 6px; border: 1px dashed #CCC; background: #FFF; color: #999; font-size: 11.5px; font-weight: 700; cursor: pointer; transition: 0.2s; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; align-items: center; }
.matrix-cell-btn:hover { background: #F5F5F0; border-color: var(--primary); color: var(--primary); }
.matrix-cell-btn.occupied.srv-2 { background: #E3F2FD; border: 1px solid #90CAF9; }
.matrix-cell-btn.occupied.srv-3 { background: #F3E5F5; border: 1px solid #CE93D8; }
.name-pill { padding: 3px 8px; border-radius: 6px; margin: 2px; display: inline-block; font-size: 13.5px; font-weight: 800; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.pill-srv-2 { background: #FFFFFF; color: #1976D2; border: 1px solid #BBDEFB; }
.pill-srv-3 { background: #FFFFFF; color: #7B1FA2; border: 1px solid #E1BEE7; }

.setlist-header-2 { background: #E3F2FD; color: #1565C0; padding: 10px 14px; border-radius: 10px; font-size: 15px; font-weight: 900; margin-bottom: 4px; margin-top: 16px; border-left: 4px solid #1976D2; display: flex; align-items: center; gap: 6px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
.setlist-header-3 { background: #F3E5F5; color: #6A1B9A; padding: 10px 14px; border-radius: 10px; font-size: 15px; font-weight: 900; margin-bottom: 4px; margin-top: 24px; border-left: 4px solid #7B1FA2; display: flex; align-items: center; gap: 6px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
.setlist-tree-wrapper { border-left: 2px dashed #CBD5E1; margin-left: 20px; padding-left: 14px; padding-top: 6px; margin-bottom: 12px; }
.setlist-card { position: relative; background: #FFFDFB; border: 1px solid #F0E6D2; border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; border-left: 4px solid #F5A623; width: 100%; box-sizing: border-box; box-shadow: 0 2px 6px rgba(0,0,0,0.02); }
.setlist-card::before { content: ""; position: absolute; left: -16px; top: 18px; width: 12px; border-top: 2px dashed #CBD5E1; }
.setlist-title { font-size: 14px; font-weight: 800; color: #333; margin-bottom: 2px; display: flex; justify-content: space-between; align-items: center; }
.setlist-key { background: #FFE0B2; color: #E65100; font-size: 10px; padding: 2px 6px; border-radius: 4px; margin-left: 6px; }
.setlist-memo { font-size: 11.5px; color: #666; background: #FDFBF7; padding: 6px; border-radius: 6px; margin-top: 4px; }

.admin-only { display: none !important; }
body.is-admin .admin-only { display: inline-block !important; }
body.is-admin .admin-only.flex-container { display: flex !important; }

.public-team-scroll-box { width: 100%; height: 100%; overflow-y: auto; padding: 10px 24px 80px 24px; box-sizing: border-box; display: flex; flex-direction: column; gap: 20px; background: var(--bg); }
.public-org-section-card { background: #2B3A4A; border: none; border-radius: 20px; padding: 24px; box-shadow: 0 6px 16px rgba(0,0,0,0.08); }
.public-org-section-card h3 { font-size: 15px; font-weight: 800; margin: 0 0 20px 0; color: #FFFFFF; border-left: 4px solid #64B5F6; padding-left: 10px; }
.public-groups-section-card { background: var(--card-bg); border: 1px solid #EFEFEA; border-radius: 20px; padding: 20px; box-shadow: 0 4px 12px rgba(0,0,0,0.01); }
.public-groups-section-card h3 { font-size: 14.5px; font-weight: 800; margin: 0 0 16px 0; border-left: 4px solid var(--primary); padding-left: 8px; color: var(--text); }
.modern-org-tree { display: flex; flex-direction: column; align-items: center; width: 100%; margin: 0; transform: scale(0.96); transform-origin: top center; }
.org-level { display: flex; justify-content: center; width: 100%; gap: 12px; }
.org-badge-line { font-size: 11px; color: #788B9E; font-weight: 300; margin: 4px 0; line-height: 1; }
.org-card { background: #FFFFFF; border: 1px solid #D1D9E0; border-radius: 14px; padding: 10px 16px; text-align: center; font-size: 12px; font-weight: 700; box-shadow: 0 4px 15px rgba(0,0,0,0.05); cursor: pointer; transition: all 0.2s; color: #333; }
.org-card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.15); border-color: var(--primary); }
.premium-pastor { border: 2px solid #D4AF37; min-width: 180px; }
.premium-pastor strong { color: #B8860B; font-size: 14.5px; }
.premium-leader { border: 2px solid var(--primary); min-width: 180px; }
.premium-leader strong { color: var(--primary); font-size: 13.5px; }
.base-level-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; width: 100%; max-width: 840px; }
.inner-session { border-top: 3px solid #718096; padding: 12px 6px; font-size: 12px; }
.inner-session:hover { background: #EBF2F9; border-top-color: var(--primary); }

@media (min-width: 901px) { .parts-master-grid-flow { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; } }
.part-group-container-card { background: var(--card-bg); border: 1px solid #EFEFEA; border-radius: 16px; padding: 12px; display: flex; flex-direction: column; gap: 10px; scroll-margin-top: 80px; }

@keyframes highlightFlash { 0% { background-color: rgba(30, 136, 229, 0.2); transform: scale(1.02); border-color: var(--primary); } 100% { background-color: var(--card-bg); transform: scale(1); border-color: #EFEFEA; } }
.highlight-flash { animation: highlightFlash 1.2s ease-out; }

.part-group-title { font-size: 12.5px; font-weight: 800; color: var(--primary); border-bottom: 2px solid var(--primary); padding-bottom: 4px; margin-bottom: 1px; }
.gender-sub-block { display: flex; flex-direction: column; gap: 4px; background: rgba(0,0,0,0.01); padding: 6px; border-radius: 8px; border: 1px dashed #EFEFEA; }
.gender-info-header { font-size: 10.5px; font-weight: 800; display: flex; align-items: center; gap: 3px; }
.gender-info-header.male { color: #1E88E5; }
.gender-info-header.female { color: #E91E63; }
.part-member-badge-pill { display: flex; justify-content: space-between; align-items: center; padding: 6px 8px; background: var(--card-bg); border: 1px solid #F0F0EB; border-radius: 5px; font-size: 11.5px; font-weight: 700; }
.clickable-badge { cursor: pointer; transition: 0.2s; }
.clickable-badge:hover { border-color: var(--primary); box-shadow: 0 2px 6px rgba(0,0,0,0.05); transform: translateY(-1px); }

.secret-admin-fullscreen-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: var(--bg); z-index: 99999; display: none; flex-direction: column; animation: slideUp 0.3s ease-out; }
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
.admin-room-header { height: var(--header-height); background: #111111; display: flex; justify-content: space-between; align-items: center; padding: 0 24px; flex-shrink: 0; }
.admin-room-body { display: flex; flex: 1; height: calc(100% - var(--header-height)); overflow: hidden; }
.admin-room-sidebar { width: 56%; background: var(--card-bg); border-right: 1px solid #EFEFEA; padding: 18px; overflow-y: auto; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between; }
.admin-room-content { width: 44%; padding: 18px 20px; display: flex; flex-direction: column; height: 100%; overflow: hidden; box-sizing: border-box; background: var(--bg); border-left: 1px solid #EFEFEA; }
.admin-fixed-form-block { flex-shrink: 0; margin-bottom: 12px; }
.admin-scrollable-inactive-block { flex: 1; overflow-y: auto; padding-right: 4px; box-sizing: border-box; }
.room-section-title { font-size: 13.5px; font-weight: 800; margin: 0 0 12px 0; border-bottom: 2px solid #111; padding-bottom: 4px; }
.crm-split-gender-deck { display: flex; gap: 12px; flex: 1; margin-bottom: 12px; overflow: hidden; }
.crm-gender-container { flex: 1; display: flex; flex-direction: column; gap: 6px; overflow-y: auto; }
.gender-section-header { font-size: 11.5px; font-weight: 800; padding-bottom: 4px; border-bottom: 2px solid #efefea; }
.gender-section-header.female { color: #E91E63; border-bottom-color: #E91E63; }
.gender-section-header.male { color: #1E88E5; border-bottom-color: #1E88E5; }
.crm-compact-vertical-stack { display: flex; flex-direction: column; gap: 5px; }
.crm-summary-bar-node { background: var(--primary-light); color: var(--primary); padding: 10px; border-radius: 10px; font-size: 12.5px; font-weight: 800; text-align: center; border: 1px solid rgba(10,50,84,0.1); flex-shrink: 0; }
.crm-member-node { display: flex; justify-content: flex-start; align-items: center; gap: 16px; padding: 5px 12px; background: #FCFCFA; border: 1px solid #EFEFEA; border-radius: 8px; cursor: pointer; transition: all 0.12s; width: fit-content; margin-bottom:4px; }
.crm-member-node > div:first-child { flex: 0 0 130px; }
.crm-member-node.pastor { border: 1px solid #D4AF37; }
.crm-member-node.pastor .name-text { color: #B8860B; font-weight: 900 !important; }
.crm-member-node.leader { border: 1px solid var(--primary); background: var(--primary-light); }
.crm-vertical-form { display: flex; flex-direction: column; gap: 6px; background: var(--card-bg); padding: 12px; border-radius: 12px; border: 1px solid #EFEFEA; }
.crm-form-item { display: flex; flex-direction: column; gap: 2px; }
.crm-form-item label { font-size: 10.5px; font-weight: bold; color: var(--muted); }
.switch-box { position: relative; display: inline-block; width: 32px; height: 15px; flex-shrink: 0; margin-top: 2px; }
.switch-box input { opacity: 0; width: 0; height: 0; }
.slider-rail { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #E4E4DF; transition: .2s; border-radius: 20px; }
.slider-rail:before { position: absolute; content: ""; height: 11px; width: 11px; left: 2px; bottom: 2px; background-color: white; transition: .2s; border-radius: 50%; }
input:checked + .slider-rail { background-color: #4CAF50; }
input:checked + .slider-rail:before { transform: translateX(17px); }

.modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); backdrop-filter: blur(3px); display: none; align-items: center; justify-content: center; z-index: 9999; }
.modal-box { background: var(--card-bg); padding: 22px; border-radius: 20px; width: 100%; max-width: 320px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); max-height: 90vh; display: flex; flex-direction: column; }

#monthlyPrayerModal .modal-box { max-width: 860px; width: 95%; background: var(--bg); padding: 24px; }
.year-navigator { display: flex; align-items: center; gap: 12px; }
.year-btn { background: var(--card-bg); border: 1px solid #EFEFEA; border-radius: 8px; width: 32px; height: 32px; font-size: 16px; font-weight: bold; cursor: pointer; color: var(--primary); display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 4px rgba(0,0,0,0.05); }
.month-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; overflow-y: auto; padding-right: 8px; flex: 1; margin-top:12px; }
.month-card { background: var(--card-bg); border: 1px solid #E4E4DF; border-radius: 12px; padding: 16px; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.02); }
.month-header { font-weight: 800; font-size: 14px; color: var(--text); display: flex; justify-content: space-between; align-items: center; border-bottom: 1px dashed #EFEFEA; padding-bottom: 8px; }

#defaultLineupModal .modal-box { max-width: 700px; width: 95%; background: var(--bg); padding: 24px; }
#setlistModal .modal-box { max-width: 600px; width: 95%; background: var(--bg); padding: 24px; }
.member-select-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; overflow-y: auto; max-height: 60vh; margin-top: 10px; padding: 4px; }
.member-select-btn { background: var(--card-bg); border: 1px solid #E4E4DF; padding: 10px 6px; border-radius: 10px; font-size: 12px; font-weight: 700; cursor: pointer; transition: 0.2s; color: var(--text); opacity: 0.6; }
.member-select-btn:hover { border-color: var(--primary); opacity: 0.8; }
.member-select-btn.active { background: #E3F2FD; color: #1E88E5; border-color: #90CAF9; opacity: 1; }
.btn-move-row { background: none; border: 1px solid #CCC; border-radius: 4px; font-size: 10px; padding: 2px 6px; cursor: pointer; color: var(--muted); }
.btn-move-row:hover { background: #EFEFEA; }

[data-theme="dark"] .public-org-section-card { background: #1A222C; }
[data-theme="dark"] .setlist-header-2 { background: rgba(21, 101, 192, 0.2); color: #64B5F6; border-left-color: #64B5F6; }
[data-theme="dark"] .setlist-header-3 { background: rgba(106, 27, 154, 0.2); color: #CE93D8; border-left-color: #CE93D8; }
[data-theme="dark"] .setlist-tree-wrapper { border-left-color: #444; }
[data-theme="dark"] .setlist-card::before { border-top-color: #444; }

#page-tv { background-color: #0A0D14; overflow-y: auto; }
.tv-layout { display: flex; gap: 24px; max-width: 1200px; margin: 0 auto; align-items: stretch; }
.tv-left { flex: 1.8; display: flex; flex-direction: column; }
.tv-video-container { width: 100%; aspect-ratio: 16/9; border-radius: 16px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.5); background: #111; }
.tv-right { flex: 1; display: flex; flex-direction: column; }
.tv-portal-box { flex: 1; background: #1A222C; border-radius: 16px; padding: 32px 24px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; box-shadow: 0 10px 30px rgba(0,0,0,0.3); }

.radio-layout { display: flex; gap: 24px; margin-top: 16px; }
.radio-box { flex: 1; background: #1A222C; border-radius: 16px; padding: 16px; box-shadow: 0 6px 20px rgba(0,0,0,0.4); }

/* 💡 완벽한 모바일 반응형(Media Query) 복구 및 적용 */
@media (max-width: 900px) {
    /* 글로벌 레이아웃 */
    body { overflow-y: auto; height: auto; }
    .page-section { height: auto; min-height: calc(100vh - var(--header-height)); overflow: visible; }
    
    /* 모바일 헤더 스크롤 지원 */
    .main-header { padding: 0 10px; }
    .nav-menu { overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 2px; }
    .nav-menu::-webkit-scrollbar { display: none; }
    
    /* 공지사항 */
    .board-container { padding: 16px; }
    
    /* 중보기도방 모바일 1단 구성 */
    #page-prayer .app-layout { flex-direction: column; }
    #page-prayer .left-sidebar, #page-prayer .right-sidebar { width: 100%; border: none; }
    #page-prayer .left-sidebar { border-bottom: 1px solid #333; height: 380px; }
    
    /* 예배섬김 V3 모바일 1단 구성 */
    .worship-layout-v3 { display: flex; flex-direction: column; padding: 16px 10px; }
    .ws-panel { width: 100%; box-sizing: border-box; padding: 16px; }
    
    /* 예배 라인업 표 모바일 가로 스크롤 허용 */
    .matrix-table { min-width: 500px; }
    .ws-scroll-area { overflow-x: auto; }

    /* 주일찬양TV 모바일 1단 구성 */
    .tv-layout { flex-direction: column; gap: 16px; padding: 0; }
    .tv-left, .tv-right { width: 100%; flex: none; }
    .radio-layout { flex-direction: column; gap: 16px; }

    /* 팀원구성 모바일 정렬 */
    .base-level-grid { grid-template-columns: repeat(2, 1fr); }
    .parts-master-grid-flow { grid-template-columns: repeat(1, 1fr) !important; }
    .public-team-scroll-box { padding: 16px 10px; }

    /* CRM 관리자 스킨 모바일 1단 구성 */
    .admin-room-body { flex-direction: column; overflow-y: auto; height: auto; }
    .admin-room-sidebar, .admin-room-content { width: 100% !important; height: auto !important; }
    .crm-split-gender-deck { flex-direction: column; height: auto; max-height: 400px; }
}