/* 가족 성경 읽기 — 화면 스타일 (index.html에서 분리) */
:root{--ink-night:#232C42;--ink-night-deep:#1A2033;--parchment:#F8F2E4;--ink-text:#3A3226;--ink-text-soft:#6B6355;--lamp-gold:#E8A33D;--lamp-gold-deep:#C1652B;--ember:#B54D34;--sage:#6B8F71;--border-soft:rgba(58,50,38,0.12);--cream-rgb:248,242,228;--gold-rgb:232,163,61;--backdrop-rgb:15,18,28;--fg:var(--parchment);--fg-rgb:var(--cream-rgb)}
/* 앱 색상 테마 — 배경(ink-night)·강조색(lamp-gold)·카드(parchment)와 카드 안 글자/테두리색을 함께 바꿉니다. 기본(딥 네이비)은 원래의 크림색 카드 그대로 */
html[data-theme="forest"]{--parchment:#EAF2E5;--cream-rgb:234,242,229;--ink-text:#243528;--ink-text-soft:#5C6E60;--border-soft:rgba(36,53,40,0.14);--ink-night:#2A5A40;--ink-night-deep:#173625;--lamp-gold:#E2B85C;--lamp-gold-deep:#9A6A1A;--sage:#7FA36F;--gold-rgb:226,184,92;--backdrop-rgb:10,22,15}
html[data-theme="charcoal"]{--parchment:#ECECEE;--cream-rgb:236,236,238;--ink-text:#28282C;--ink-text-soft:#65656B;--border-soft:rgba(40,40,44,0.14);--ink-night:#3A3A41;--ink-night-deep:#1F1F23;--lamp-gold:#E8A33D;--lamp-gold-deep:#B5561F;--sage:#7A9A80;--gold-rgb:232,163,61;--backdrop-rgb:10,10,12}
html[data-theme="wine"]{--parchment:#F7EAEB;--cream-rgb:247,234,235;--ink-text:#3A2629;--ink-text-soft:#7A6265;--border-soft:rgba(58,38,41,0.14);--ink-night:#6A2F42;--ink-night-deep:#3A1826;--lamp-gold:#EBB56E;--lamp-gold-deep:#A8482C;--sage:#8AA484;--gold-rgb:235,181,110;--backdrop-rgb:22,8,14}
html[data-theme="teal"]{--parchment:#E3F0F1;--cream-rgb:227,240,241;--ink-text:#20353B;--ink-text-soft:#587178;--border-soft:rgba(32,53,59,0.14);--ink-night:#27606F;--ink-night-deep:#153840;--lamp-gold:#F0B45C;--lamp-gold-deep:#B85A22;--sage:#78A88F;--gold-rgb:240,180,92;--backdrop-rgb:7,20,25}
html[data-theme="jwblue"]{--parchment:#EDF1F8;--cream-rgb:237,241,248;--fg:#FFFFFF;--fg-rgb:255,255,255;--ink-text:#22314F;--ink-text-soft:#52627F;--border-soft:rgba(34,49,79,0.14);--ink-night:#3A5A94;--ink-night-deep:#2A4270;--lamp-gold:#FFF0B8;--lamp-gold-deep:#38568F;--sage:#3F7F69;--gold-rgb:255,240,184;--backdrop-rgb:10,20,42}
/* JW 블루 — 중간 밝기의 파랑 위에서는 옅은 글자의 대비가 낮아서 진하게 보정(카드 안 안내 문구는 카드 글자색 유지) */
html[data-theme="jwblue"] .muted{color:rgba(var(--fg-rgb),0.82)}
html[data-theme="jwblue"] .app-sub{color:rgba(var(--fg-rgb),0.84)}
html[data-theme="jwblue"] .auth-hint{color:rgba(var(--fg-rgb),0.78)}
html[data-theme="jwblue"] .admin-link{color:rgba(var(--fg-rgb),0.71)}
html[data-theme="jwblue"] .text-btn--light{color:rgba(var(--fg-rgb),0.86)}
html[data-theme="jwblue"] .topbar-user{color:rgba(var(--fg-rgb),0.93)}
html[data-theme="jwblue"] .tab{color:rgba(var(--fg-rgb),0.8)}
html[data-theme="jwblue"] .lamp-name{color:rgba(var(--fg-rgb),0.89)}
html[data-theme="jwblue"] .lamp-caption{color:rgba(var(--fg-rgb),0.8)}
html[data-theme="jwblue"] .lamp-best-streak{color:rgba(var(--fg-rgb),0.75)}
html[data-theme="jwblue"] .household-streak-badge{color:rgba(var(--fg-rgb),0.86)}
html[data-theme="jwblue"] .daily-quote{color:rgba(var(--fg-rgb),0.73)}
html[data-theme="jwblue"] .ledger-rank{color:rgba(var(--fg-rgb),0.73)}
html[data-theme="jwblue"] .ledger-value{color:rgba(var(--fg-rgb),0.93)}
html[data-theme="jwblue"] .ledger-note{color:rgba(var(--fg-rgb),0.75)}
html[data-theme="jwblue"] .day-row{color:rgba(var(--fg-rgb),0.8)}
html[data-theme="jwblue"] .day-row-date{color:rgba(var(--fg-rgb),0.91)}
html[data-theme="jwblue"] .day-row--miss .day-row-date{color:rgba(var(--fg-rgb),0.91)}
html[data-theme="jwblue"] :is(.reading-card,.meditation-card,.cheer-card,.progress-card,.admin-card,.admin-section,.annual-card,.trend-card,.steps-articles-card,.jw-feed-card,.modal-card,.photo-viewer-card) .muted{color:var(--ink-text-soft)}
/* 밝은 테마 — 배경이 밝으므로 배경 위 글자색(--fg)을 어둡게 하고, 강조색은 밝은 배경에서 읽히도록 진하게 */
html[data-theme="lavender"]{--ink-night:#EEE9F8;--ink-night-deep:#D9CFEF;--parchment:#FDFCFF;--ink-text:#33284A;--ink-text-soft:#5B4F73;--border-soft:rgba(51,40,74,0.14);--fg:#33284A;--fg-rgb:51,40,74;--lamp-gold:#5B3FA8;--lamp-gold-deep:#5B3FA8;--sage:#557F72;--gold-rgb:91,63,168;--backdrop-rgb:26,18,44}
html[data-theme="sky"]{--ink-night:#E6F0FA;--ink-night-deep:#CADDF0;--parchment:#FBFDFF;--ink-text:#1F3247;--ink-text-soft:#475C71;--border-soft:rgba(31,50,71,0.14);--fg:#1F3247;--fg-rgb:31,50,71;--lamp-gold:#1F5A9C;--lamp-gold-deep:#1F5A9C;--sage:#4C8F86;--gold-rgb:31,90,156;--backdrop-rgb:18,30,46}
html[data-theme="mint"]{--ink-night:#E3F3EA;--ink-night-deep:#C6E3D3;--parchment:#FAFEFB;--ink-text:#1F3B2C;--ink-text-soft:#476552;--border-soft:rgba(31,59,44,0.14);--fg:#1F3B2C;--fg-rgb:31,59,44;--lamp-gold:#22683E;--lamp-gold-deep:#22683E;--sage:#4C9A6A;--gold-rgb:34,104,62;--backdrop-rgb:14,32,22}
html[data-theme="rose"]{--ink-night:#FBE9EB;--ink-night-deep:#F0CDD3;--parchment:#FFFBFB;--ink-text:#4A2A30;--ink-text-soft:#6E545A;--border-soft:rgba(74,42,48,0.14);--fg:#4A2A30;--fg-rgb:74,42,48;--lamp-gold:#A1324A;--lamp-gold-deep:#A1324A;--sage:#6B8F71;--gold-rgb:161,50,74;--backdrop-rgb:38,16,22}
html[data-theme="lavender"] .name-select,html[data-theme="sky"] .name-select,html[data-theme="mint"] .name-select,html[data-theme="rose"] .name-select{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233A3226' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>")}
/* 밝은 테마 보정 — 어두운 배경용으로 만든 반투명 글자/테두리를 밝은 배경에서 또렷하게, 카드에는 테두리 */
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .muted{color:rgba(var(--fg-rgb),0.82)}
/* 카드(밝은 바탕) 안의 안내 문구는 배경 위 글자색이 아니라 카드 글자색으로 — 어두운 테마에서 안 보이던 문제 */
.reading-card .muted,.meditation-card .muted,.cheer-card .muted,.progress-card .muted,.admin-card .muted,.admin-section .muted,.annual-card .muted,.trend-card .muted,.steps-articles-card .muted,.jw-feed-card .muted,.modal-card .muted,.photo-viewer-card .muted{color:var(--ink-text-soft)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .app-sub{color:rgba(var(--fg-rgb),0.84)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .name-select{border:1px solid rgba(var(--fg-rgb),0.3)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .auth-hint{color:rgba(var(--fg-rgb),0.78)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .admin-link{color:rgba(var(--fg-rgb),0.71)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .text-btn--light{color:rgba(var(--fg-rgb),0.86)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .icon-btn{border:1px solid rgba(var(--fg-rgb),0.26)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .tab{color:rgba(var(--fg-rgb),0.8)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .lamp-row-card{border:1px solid rgba(var(--fg-rgb),0.22)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .lamp-name{color:rgba(var(--fg-rgb),0.89)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .lamp-caption{color:rgba(var(--fg-rgb),0.8)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .lamp-best-streak{color:rgba(var(--fg-rgb),0.75)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .household-streak-badge{color:rgba(var(--fg-rgb),0.86)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .daily-quote{color:rgba(var(--fg-rgb),0.73)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .today-avatar{border:2px solid rgba(var(--fg-rgb),0.25)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .ledger-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .history-card{border:1px solid rgba(var(--fg-rgb),0.22)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .ledger-row{border-bottom:1px solid rgba(var(--fg-rgb),0.18)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .ledger-rank{color:rgba(var(--fg-rgb),0.82)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .ledger-value{color:rgba(var(--fg-rgb),0.93)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .ledger-note{color:rgba(var(--fg-rgb),0.75)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .day-detail-list{border:1px solid rgba(var(--fg-rgb),0.2)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .day-row{border-bottom:1px solid rgba(var(--fg-rgb),0.16);color:rgba(var(--fg-rgb),0.8)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .day-row-date{color:rgba(var(--fg-rgb),0.91)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .day-row--miss .day-row-date{color:rgba(var(--fg-rgb),0.91)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .reading-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .meditation-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .cheer-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .progress-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .ledger-table--history,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .admin-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .admin-section,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .annual-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .trend-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .steps-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .steps-articles-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .jw-feed-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .modal-card,html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .photo-viewer-card{border:1px solid rgba(var(--fg-rgb),0.24)}
/* 밝은 테마: 아직 안 읽은 가족 사진이 뿌옇게 죽어 보이지 않게, 맨 위 가족 카드 바탕은 다른 카드처럼 밝게 */
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .today-avatar{opacity:0.9;filter:grayscale(20%)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .today-avatar--lit{opacity:1;filter:none}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .lamp-row-card{background:rgba(255,255,255,0.72);border-color:rgba(var(--fg-rgb),0.24)}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .lamp-name{color:var(--fg);font-weight:500}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .lamp-slot--me .lamp-name{color:var(--lamp-gold);font-weight:700}
*{box-sizing:border-box}
html, body{margin:0;min-height:100vh;background:var(--ink-night-deep);font-family:"Noto Sans KR", -apple-system, sans-serif;color:var(--fg)}
/* 배경은 화면에 고정된 한 겹으로 그려서(긴 화면에서도 테마 색이 그대로 보이게) 위쪽은 테마 색, 아래쪽으로 갈수록 살짝 어둡게 */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg, var(--ink-night) 0%, var(--ink-night) 35%, var(--ink-night-deep) 100%)}
.muted{color:rgba(var(--fg-rgb),0.6);text-align:center}
.boot-trouble{text-align:center;max-width:320px}.boot-trouble .btn-row{display:flex;flex-direction:column;gap:8px;margin-top:8px}.boot-trouble button{padding:12px 16px;border-radius:12px;border:1px solid var(--border,#ccd);background:var(--card,#fff);color:inherit;font:inherit;font-weight:600}.boot-trouble .err{font-size:12px;opacity:.6;word-break:break-all}
.center-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px}
.wrap{width:100%;max-width:1100px;margin:0 auto;padding:24px 20px 60px}
.loading-photo{width:140px;height:140px;object-fit:cover;border-radius:50%;border:2px solid rgba(var(--gold-rgb),0.4);box-shadow:0 0 32px rgba(var(--gold-rgb),0.25), 0 12px 28px rgba(0,0,0,0.35);animation:breathe 2.4s ease-in-out infinite}
.loading-spinner-wrap{position:relative;width:140px;height:140px}
.loading-spinner-ring{position:absolute;inset:-10px;border-radius:50%;border:4px solid rgba(var(--gold-rgb),0.15);border-top-color:var(--lamp-gold);border-right-color:var(--lamp-gold);animation:spin 0.9s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}
}
@media (prefers-reduced-motion:reduce){.loading-photo{animation:none}
.loading-spinner-ring{animation:none}
}
@keyframes breathe{0%,100%{transform:scale(1);opacity:.92}
50%{transform:scale(1.03);opacity:1}
}
.app-hero{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:8px}
.app-title{font-family:"Noto Serif KR", serif;font-weight:900;font-size:26px;margin:4px 0 0;text-align:center}
.app-sub{font-size:13px;color:rgba(var(--fg-rgb),0.65);margin:6px 0 28px;text-align:center}
.name-select{width:100%;appearance:none;-webkit-appearance:none;background:rgba(var(--fg-rgb),0.08) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F8F2E4' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>") no-repeat right 16px center;background-size:18px;border:1px solid rgba(var(--fg-rgb),0.2);border-radius:12px;padding:16px 44px 16px 18px;font-size:16px;font-weight:600;color:var(--fg);font-family:inherit;cursor:pointer}
.name-select option{color:var(--ink-text);background:var(--parchment)}
.auth-hint{margin-top:20px;font-size:12px;color:rgba(var(--fg-rgb),0.5);text-align:center}
.admin-link{display:block;margin:28px auto 0;background:none;border:none;color:rgba(var(--fg-rgb),0.35);font-size:12px;cursor:pointer;text-decoration:underline;font-family:inherit}
html.modal-open, html.modal-open body{overflow:hidden;overscroll-behavior:none}
.modal-backdrop{overscroll-behavior:contain;touch-action:none}
.modal-card{overscroll-behavior:contain;touch-action:pan-y}
.photo-zoom{overscroll-behavior:contain}
.modal-backdrop{position:fixed;inset:0;background:rgba(var(--backdrop-rgb),0.65);display:flex;align-items:center;justify-content:center;padding:20px;z-index:50}
.modal-card{background:var(--parchment);color:var(--ink-text);border-radius:20px;padding:28px 24px;width:100%;max-width:360px;display:flex;flex-direction:column;align-items:center;gap:14px;max-height:88vh;overflow-y:auto}
.modal-title{font-family:"Noto Serif KR", serif;font-size:17px;font-weight:700;text-align:center;margin:0}
.modal-note{font-size:12px;color:var(--ink-text-soft);text-align:center;margin:-4px 0 0}
.text-input{width:100%;border:1px solid var(--border-soft);background:#fff;border-radius:10px;padding:12px 14px;font-size:15px;font-family:inherit;color:var(--ink-text)}
.text-input:focus{outline:2px solid var(--lamp-gold);outline-offset:1px}
.error-text{color:var(--ember);font-size:13px;margin:0;text-align:center}
.saved-text{color:var(--sage);font-size:13px;margin:0;text-align:center}
.primary-btn{width:100%;background:var(--lamp-gold-deep);color:#fff;border:none;border-radius:12px;padding:13px;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit}
.primary-btn:disabled{opacity:0.5}
.text-btn{background:none;border:none;color:var(--ink-text-soft);font-size:13px;cursor:pointer;text-decoration:underline;font-family:inherit}
.text-btn--light{color:rgba(var(--fg-rgb),0.7)}
.pin-dots{display:flex;gap:10px}
.quick-login{display:flex;flex-direction:column;align-items:center;gap:12px;margin:10px 0 6px}
.quick-login .pin-dots{gap:14px}.quick-login .pin-dot{width:16px;height:16px}
.quick-login .pin-dot{border-color:rgba(var(--fg-rgb),0.75)}.quick-login .pin-dot--filled{background:var(--lamp-gold);border-color:var(--lamp-gold)}
.quick-title{margin:0;font-size:15px;font-weight:700;color:var(--fg)}
.quick-login .error-text{margin:0;text-align:center}
.quick-or{font-size:12px;color:rgba(var(--fg-rgb),0.7);margin:12px 0 6px;text-align:center}
.pin-dot{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--ink-text-soft)}
.pin-dot--filled{background:var(--lamp-gold-deep);border-color:var(--lamp-gold-deep)}
.pinpad{display:grid;grid-template-columns:repeat(3, 1fr);gap:8px;width:100%}
.pinpad-key{padding:14px 0;border-radius:10px;border:1px solid var(--border-soft);background:#fff;font-size:17px;font-family:"Noto Sans KR", monospace;color:var(--ink-text);cursor:pointer}
.pinpad-key--sub{font-family:"Noto Sans KR", sans-serif;font-size:12px;color:var(--ink-text-soft)}
.pinpad-key--accent{background:var(--lamp-gold-deep);color:#fff;font-family:"Noto Sans KR", sans-serif;font-weight:700;font-size:13px}
.pinpad-key--accent:disabled{opacity:0.4}
.topbar{display:flex;justify-content:space-between;align-items:flex-start;padding:4px 0 8px}
.topbar-eyebrow{font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:var(--lamp-gold);margin:0 0 4px;font-weight:600}
.topbar-user{color:rgba(var(--fg-rgb),0.85);font-weight:600;letter-spacing:0;text-transform:none}
.topbar-date{font-family:"Noto Serif KR", serif;font-size:19px;font-weight:700;margin:0}
.topbar-actions{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.icon-btn{background:rgba(var(--fg-rgb),0.08);border:1px solid rgba(var(--fg-rgb),0.16);color:var(--fg);border-radius:999px;padding:7px 14px;font-size:12px;cursor:pointer;font-family:inherit;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.tabbar{display:flex;gap:6px;padding:10px 0}
.tab{word-break:keep-all;flex:1;padding:10px;border-radius:10px;border:none;background:transparent;color:rgba(var(--fg-rgb),0.55);font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.round-picker{display:flex;gap:6px;margin:2px 0 4px}
.round-chip{flex:1;padding:9px 6px;border-radius:999px;border:1.5px solid var(--border-soft);background:transparent;color:var(--ink-text-soft);font-size:13px;font-weight:700;font-family:inherit;cursor:pointer}
.round-chip--on{background:var(--ink-text);border-color:var(--ink-text);color:var(--parchment)}
.round-range{font-size:12px;color:var(--ink-text-soft);margin:0 0 6px;text-align:center}
.icon-btn--round{width:44px;height:44px;padding:0;justify-content:center;border-radius:50%}
.icon-btn--round svg{width:22px;height:22px}
.topbar-actions{flex-direction:row!important;align-items:center!important;gap:8px!important}
.wrap--app{padding-top:0;padding-bottom:110px}
.wrap--app .topbar{position:sticky;top:0;z-index:30;margin:0 -20px 8px;padding:calc(14px + env(safe-area-inset-top)) 20px 10px;background:var(--ink-night);border-bottom:1px solid rgba(var(--fg-rgb),0.1)}
.bottom-tabs{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;justify-content:center;gap:2px;padding:6px 8px calc(6px + env(safe-area-inset-bottom));background:var(--ink-night-deep);border-top:1px solid rgba(var(--fg-rgb),0.16);box-shadow:0 -6px 18px rgba(0,0,0,0.18)}
.btab{flex:1;max-width:96px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;border:none;border-radius:12px;background:transparent;color:rgba(var(--fg-rgb),0.62);font-family:inherit;cursor:pointer}
.btab-ico{position:relative;display:inline-flex}
.btab-label{font-size:11px;font-weight:700;white-space:nowrap;word-break:keep-all}
.btab--active{color:var(--lamp-gold);background:rgba(var(--fg-rgb),0.1)}
.btab .tab-badge{top:-6px;right:-10px}
.cheer-new{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:#d93025;color:#fff;font-size:11px;font-weight:800;letter-spacing:0;text-transform:none;vertical-align:1px}
.quick-cheers{display:flex;gap:6px;overflow-x:auto;padding:2px 0 6px;-webkit-overflow-scrolling:touch}
.quick-list{background:#EDEFF2;border-radius:12px;padding:4px 0;margin-bottom:8px;max-height:230px;overflow-y:auto;-webkit-overflow-scrolling:touch}
.quick-list .picker-head{padding:6px 12px}
.quick-cheer{display:block;width:100%;text-align:left;padding:11px 14px;border:none;border-top:1px solid #fff;background:transparent;color:var(--ink-text);font-size:14px;font-weight:500;font-family:inherit;cursor:pointer}
.quick-cheer:disabled{opacity:.5}
.chat-sys-wrap{display:flex;flex-direction:column;align-items:center;gap:4px;margin:6px 0}
.chat-sys{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 8px;padding:8px 12px;border-radius:14px;background:rgba(76,143,134,0.14);color:var(--ink-text);font-size:13px;text-align:center}
.chat-sys-time{font-size:10px;color:var(--ink-text-soft)}
.chat-sys-clap{padding:3px 10px;border-radius:999px;border:1px solid var(--lamp-gold-deep);background:#fff;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;color:var(--ink-text)}
.set-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:14px;color:var(--ink-text);cursor:pointer}
.set-toggle small{display:block;font-size:11px;color:var(--ink-text-soft);margin-top:2px;font-weight:400}
.set-toggle input{width:22px;height:22px;flex-shrink:0}
.cheer-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cheer-more{background:none;border:none;color:var(--ink-text-soft);font-size:13px;font-weight:700;font-family:inherit;cursor:pointer;padding:6px 0 6px 8px}
.chat-compact{display:flex;flex-direction:column;gap:10px;padding:4px 2px}
.chat-sheet{max-width:440px;align-items:stretch;gap:10px;padding:18px 16px;height:calc(84vh / var(--fs-zoom));max-height:none}
.chat-sheet .chat-messages{max-height:none;flex:1 1 auto;min-height:0}
.chat-sheet-head{display:flex;align-items:center;justify-content:space-between}
.chat-sheet-head .modal-title{margin:0;font-size:17px}
.sheet-close{width:40px;height:40px;border-radius:50%;border:1px solid var(--border-soft);background:transparent;color:var(--ink-text);font-size:18px;cursor:pointer;font-family:inherit}
.chat-sticker{line-height:0;padding:2px 0}
.sticker-img{display:block;object-fit:contain}
.sticker-fallback{line-height:1.1}
.sticker-panel{background:#fff;border:1px solid var(--border-soft);border-radius:14px;padding:8px}
.sticker-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px}
.sticker-pick{min-width:0}
.sticker-pick .sticker-img{width:100%;height:auto;max-width:56px;aspect-ratio:1}
.sticker-panel{box-sizing:border-box;max-width:100%;min-width:0}
.cheer-card{min-width:0}
.sticker-pick{display:flex;align-items:center;justify-content:center;padding:4px;border:none;border-radius:10px;background:transparent;cursor:pointer;line-height:0}
.sticker-pick:active{background:rgba(0,0,0,0.08)}
.sticker-tabs{display:flex;gap:4px;margin-bottom:6px;overflow-x:auto}
.sticker-tab{flex:1 0 auto;padding:7px 10px;border-radius:999px;border:1px solid var(--border-soft);background:transparent;color:var(--ink-text-soft);font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;white-space:nowrap}
.sticker-tab--on{background:var(--ink-text);border-color:var(--ink-text);color:var(--parchment)}
.picker-head{display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:600;color:var(--ink-text);padding:2px 2px 6px}
.picker-close{border:1px solid var(--border-soft);background:transparent;color:var(--ink-text);border-radius:999px;font-size:12px;padding:4px 10px;cursor:pointer}
.picker-close:active{background:rgba(0,0,0,0.08)}
.sticker-credit{margin:6px 0 0;font-size:10px;color:var(--ink-text-soft);text-align:center}
.cheer-sticker-toggle--on{background:var(--lamp-gold-deep)!important;color:#fff!important;border-color:var(--lamp-gold-deep)!important}
.avatar-wrap{position:relative;width:45px;height:45px;flex:none}
.avatar-wrap::before{content:"";position:absolute;inset:-4px;border-radius:50%;opacity:0}
.avatar-wrap > .avatar,.avatar-wrap > .avatar-btn{position:relative;z-index:1}
.avatar-wrap--t3::before{opacity:1;background:linear-gradient(135deg,#f6f8fb,#9aa5b8 50%,#e4e9f1)}
.avatar-wrap--t7::before{opacity:1;background:conic-gradient(#ffe29a,#e8a33d,#fff3c4,#e8a33d,#ffe29a);animation:ringSpin 6s linear infinite}
.avatar-wrap--t30::before{opacity:1;background:conic-gradient(#ff5f6d,#ffc371,#f9f871,#6be585,#4dc3ff,#9b6bff,#ff5f6d);animation:ringSpin 4s linear infinite}
.avatar-wrap--t14::before{opacity:1;background:conic-gradient(#b8f5d0,#2e9e5b,#e6fff1,#2e9e5b,#b8f5d0);animation:ringSpin 5s linear infinite}
.avatar-wrap--t60::before{opacity:1;inset:-5px;background:conic-gradient(#4dc3ff,#2b5cff,#9b6bff,#2b5cff,#4dc3ff);animation:ringSpin 3.5s linear infinite;box-shadow:0 0 12px rgba(77,140,255,.65)}
.avatar-wrap--t100::before{opacity:1;inset:-5px;background:conic-gradient(#fff3a0,#ff9d2e,#ff4b2b,#ff9d2e,#fff3a0,#ff4b2b,#fff3a0);animation:ringSpin 2.6s linear infinite;box-shadow:0 0 14px rgba(255,120,40,.75)}
.avatar-wrap--t200::before{opacity:1;inset:-6px;background:conic-gradient(#ff7ad9,#9b6bff,#4dc3ff,#6be585,#f9f871,#ff7ad9,#9b6bff,#4dc3ff,#ff7ad9);animation:ringSpin 2s linear infinite;box-shadow:0 0 16px rgba(190,110,255,.8)}
.avatar-wrap--t365::before{opacity:1;inset:-6px;background:conic-gradient(#ffffff,#9fe8ff,#ffffff,#ffe29a,#ffffff,#d6b8ff,#ffffff);animation:ringSpin 1.6s linear infinite;box-shadow:0 0 10px #fff,0 0 22px rgba(120,220,255,.95),0 0 32px rgba(255,226,154,.8)}
.avatar-wrap--t365::after,.avatar-wrap--t200::after{content:"👑";position:absolute;z-index:4;top:-14px;left:50%;transform:translateX(-50%);font-size:16px;line-height:1}
.avatar-wrap--t200::after{content:"✨"}
.lamp-next{text-align:center;font-size:12px;font-weight:700;color:var(--lamp-gold);margin:8px 0 0}
@keyframes ringSpin{to{transform:rotate(360deg)}}
.lamp-check{position:absolute;z-index:3;right:-4px;bottom:-4px;width:23px;height:23px;border-radius:50%;background:#2e9e5b;color:#fff;font-size:14px;font-weight:800;line-height:23px;text-align:center;box-shadow:0 0 0 2px #fff}
.today-avatar--lit{animation:litGlow 3.2s ease-in-out infinite}
@keyframes litGlow{0%,100%{box-shadow:0 0 0 3px rgba(var(--gold-rgb),0.2),0 0 12px rgba(var(--gold-rgb),0.3)}50%{box-shadow:0 0 0 4px rgba(var(--gold-rgb),0.34),0 0 22px rgba(var(--gold-rgb),0.6)}}
.avatar-wrap--pop{animation:lampPop .85s cubic-bezier(.34,1.56,.64,1) var(--pd,0s) both}
@keyframes lampPop{0%{transform:scale(.7)}45%{transform:scale(1.28)}100%{transform:scale(1)}}
.lamp-spark{position:absolute;z-index:4;left:50%;top:50%;font-size:13px;font-style:normal;pointer-events:none;opacity:0;animation:lampSpark 1.1s ease-out var(--pd,0s) both}
.lamp-spark:nth-of-type(1){--dx:-26px;--dy:-26px}.lamp-spark:nth-of-type(2){--dx:26px;--dy:-24px}.lamp-spark:nth-of-type(3){--dx:-24px;--dy:24px}.lamp-spark:nth-of-type(4){--dx:26px;--dy:26px}
@keyframes lampSpark{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}35%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(1.1)}}
.lamp-tier-hint{font-size:11px;color:rgba(var(--fg-rgb),0.62);text-align:center;margin:2px 0 0}
@media (prefers-reduced-motion:reduce){.today-avatar--lit,.avatar-wrap--pop,.avatar-wrap--t7::before,.avatar-wrap--t14::before,.avatar-wrap--t30::before,.avatar-wrap--t60::before,.avatar-wrap--t100::before,.avatar-wrap--t200::before,.avatar-wrap--t365::before{animation:none}.lamp-spark{display:none}}
.lamp-row-card--all{border-color:rgba(var(--gold-rgb),0.7)!important;box-shadow:0 0 0 2px rgba(var(--gold-rgb),0.35),0 0 26px rgba(var(--gold-rgb),0.35)}
.lamp-row-card--all .today-avatar--lit{box-shadow:0 0 0 4px rgba(var(--gold-rgb),0.4),0 0 22px rgba(var(--gold-rgb),0.7)}
.all-complete-banner--pop{animation:allPop .8s cubic-bezier(.34,1.56,.64,1)}
@keyframes allPop{0%{transform:scale(.6);opacity:0}100%{transform:scale(1);opacity:1}}
.fw-rocket{position:absolute;bottom:0;width:3px;height:14px;margin-left:-1px;border-radius:2px;background:linear-gradient(to top,rgba(255,255,255,0),#fff6c8);opacity:0;animation:fwRise .55s ease-out forwards}
@keyframes fwRise{0%{opacity:1;transform:translateY(0)}85%{opacity:1}100%{opacity:0;transform:translateY(var(--rise))}}
.fw-p{position:absolute;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;opacity:0;animation:fwBurst 1.8s cubic-bezier(.12,.7,.3,1) forwards}
.fw-p--s{width:6px;height:6px;margin:-3px 0 0 -3px;animation-duration:1.5s}
.fw-flash{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:radial-gradient(circle,#fff 0%,var(--fc) 45%,rgba(255,255,255,0) 72%);opacity:0;animation:fwFlash .7s ease-out forwards}
@keyframes fwFlash{0%{opacity:1;transform:scale(.4)}40%{opacity:.95}100%{opacity:0;transform:scale(6)}}
@keyframes fwBurst{0%{opacity:1;transform:translate(0,0) scale(1.3)}65%{opacity:1}100%{opacity:0;transform:translate(var(--dx),calc(var(--dy) + 44px)) scale(.3)}}
.fw-night{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 35%,rgba(22,28,70,.82),rgba(3,5,18,.94));opacity:0;animation:fwNight 22s ease-in-out forwards}
@keyframes fwNight{0%{opacity:0}4%{opacity:1}70%{opacity:1}100%{opacity:0}}
.fw-whiteout{position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,#fff 0%,rgba(255,240,190,.85) 45%,rgba(255,255,255,0) 85%);opacity:0;animation:fwWhite 4s ease-in-out forwards}
@keyframes fwWhite{0%{opacity:0}30%{opacity:.55}100%{opacity:0}}
.all-complete-banner--glow{animation:allGlow 2.4s ease-in-out infinite}
.all-complete-banner--glow.all-complete-banner--pop{animation:allPop .8s cubic-bezier(.34,1.56,.64,1),allGlow 2.4s ease-in-out .8s infinite}
@keyframes allGlow{0%,100%{box-shadow:0 0 0 rgba(var(--gold-rgb),0)}50%{box-shadow:0 0 18px rgba(var(--gold-rgb),0.85)}}
.confetti-layer{position:fixed;inset:0;z-index:45;pointer-events:none;overflow:hidden}
.confetti-layer--tap{pointer-events:auto;cursor:pointer}
.fw-skip-hint{position:absolute;left:0;right:0;bottom:calc(96px + env(safe-area-inset-bottom));margin:0;text-align:center;font-size:13px;color:rgba(255,255,255,0.75);opacity:0;animation:fwHint 13s ease forwards;z-index:47;pointer-events:none}
@keyframes fwHint{0%{opacity:0}8%{opacity:1}85%{opacity:1}100%{opacity:0}}
@keyframes confFall{0%{opacity:1;transform:translateY(0) rotate(0deg)}85%{opacity:1}100%{opacity:0;transform:translateY(105vh) rotate(720deg)}}
@media (prefers-reduced-motion:reduce){.confetti-layer{display:none}.all-complete-banner--pop,.all-complete-banner--glow{animation:none}}
.tab{position:relative}
.tab-badge{position:absolute;top:2px;right:2px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#d93025;color:#fff;font-size:11px;font-weight:800;line-height:18px;text-align:center;box-shadow:0 0 0 2px var(--ink-night-deep)}
.jw-feed-new{display:inline-block;margin-right:6px;padding:1px 6px;border-radius:6px;background:#d93025;color:#fff;font-size:10px;font-weight:800;vertical-align:1px}
.tab--active{background:rgba(var(--fg-rgb),0.1);color:var(--fg)}
.content{display:flex;flex-direction:column;gap:16px}
.lamp-row-card{background:rgba(var(--fg-rgb),0.05);border:1px solid rgba(var(--fg-rgb),0.12);border-radius:18px;padding:18px 12px 14px}
.lamp-row{display:flex;flex-wrap:wrap;justify-content:center;gap:16px 8px}
.lamp-slot{display:flex;flex-direction:column;align-items:center;gap:4px;width:72px}
.lamp-slot--me .lamp-name{color:var(--lamp-gold);font-weight:700}
.lamp-name{font-size:12px;color:rgba(var(--fg-rgb),0.75);text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:72px}
.lamp-caption{text-align:center;font-size:13px;color:rgba(var(--fg-rgb),0.55);margin:12px 0 0}
.lamp-streak{font-size:11px;color:var(--lamp-gold);font-weight:700;margin-top:1px}
.lamp-best-streak{font-size:10px;color:rgba(var(--fg-rgb),0.45);margin-top:0px}
.my-missed-badge{margin:10px auto 0;width:fit-content;background:rgba(var(--gold-rgb),0.14);border:1px solid rgba(var(--gold-rgb),0.4);color:var(--lamp-gold);font-size:13px;padding:7px 16px;border-radius:999px;font-family:"Noto Sans KR", monospace}
.my-missed-badge strong{font-size:14px}
.all-complete-banner{text-align:center;font-size:14px;font-weight:700;color:#fff;background:linear-gradient(135deg, var(--lamp-gold) 0%, var(--sage) 100%);padding:9px 12px;border-radius:10px;margin:12px 0 0}
.household-streak-badge{text-align:center;font-size:13px;color:rgba(var(--fg-rgb),0.7);margin:8px 0 0}
.daily-quote{text-align:center;font-size:11px;color:rgba(var(--fg-rgb),0.4);font-style:italic;margin:10px 0 0;padding:0 6px;line-height:1.5}
.avatar{border-radius:50%;background-color:rgba(var(--fg-rgb),0.12);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;color:var(--fg);font-weight:700;flex-shrink:0;overflow:hidden}
.today-avatar{border:2px solid rgba(var(--fg-rgb),0.15);opacity:0.55;filter:grayscale(35%);transition:opacity .2s, filter .2s, box-shadow .2s, border-color .2s}
.today-avatar--lit{border-color:var(--lamp-gold);opacity:1;filter:none;box-shadow:0 0 0 3px rgba(var(--gold-rgb),0.22), 0 0 16px rgba(var(--gold-rgb),0.35)}
.avatar-btn{background:none;border:none;padding:0;cursor:pointer;border-radius:50%}
.photo-viewer-card{background:var(--parchment);border-radius:20px;padding:16px;display:flex;flex-direction:column;align-items:center;gap:10px;max-width:420px;width:100%}
.photo-zoom{width:100%;max-height:66vh;overflow:auto;border-radius:16px;display:flex;justify-content:center;-webkit-overflow-scrolling:touch;background:rgba(0,0,0,0.06)}
.photo-viewer-img{display:block;width:100%;height:auto;max-height:66vh;object-fit:contain;cursor:zoom-in}
.photo-zoom--on{justify-content:flex-start;align-items:flex-start}
.photo-zoom--on .photo-viewer-img{width:240%;max-width:none;max-height:none;cursor:zoom-out}
.photo-viewer-hint{font-size:11px;color:var(--ink-text-soft);margin:-4px 0 0;min-height:14px;text-align:center}
.photo-viewer-name{font-family:"Noto Serif KR", serif;font-size:16px;font-weight:700;color:var(--ink-text);margin:0}
.reading-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:22px 20px;display:flex;flex-direction:column;gap:10px;box-shadow:0 12px 28px rgba(0,0,0,0.25)}
.reading-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--lamp-gold-deep);font-weight:700;margin:0}
.reading-range{font-family:"Noto Serif KR", serif;font-size:24px;font-weight:700;margin:0 0 6px}
.reading-link-btn{display:inline-block;text-align:center;padding:12px;border-radius:10px;border:1.5px solid var(--ink-text);background:transparent;color:var(--ink-text);text-decoration:none;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;width:100%}
.meditation-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:10px;box-shadow:0 8px 20px rgba(0,0,0,0.2)}
.cheer-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:10px;box-shadow:0 8px 20px rgba(0,0,0,0.2)}
.cheer-preview{display:flex;align-items:center;gap:10px;background:none;border:none;padding:0;margin:0;cursor:pointer;text-align:left;width:100%;font-family:inherit}
.cheer-preview-avatar{flex-shrink:0}
.cheer-preview-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.cheer-preview-name{font-size:12px;font-weight:700;color:var(--lamp-gold-deep)}
.cheer-preview-text{font-size:14px;color:var(--ink-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cheer-preview-time{font-size:11px;color:var(--ink-text-soft);flex-shrink:0}
.cheer-collapse-btn{display:flex;align-items:center;justify-content:space-between;background:none;border:none;padding:0;margin:0;cursor:pointer;width:100%;font-family:inherit}
.cheer-collapse-icon{font-size:11px;color:var(--ink-text-soft);font-weight:600}
.chat-messages{display:flex;flex-direction:column;gap:10px;max-height:250px;overflow-y:auto;padding:4px 2px}
.chat-loading-more{align-self:center;font-size:11px;color:var(--ink-text-soft);margin:0 0 6px;text-align:center}
.chat-msg{display:flex;gap:6px;align-items:flex-start}
.chat-msg--me{flex-direction:row-reverse}
.msg-hover-icons{display:none;gap:4px;align-self:center}
.chat-msg:hover .msg-hover-icons, .msg-hover-icons.icons-visible{display:flex}
.hover-icon-btn{width:26px;height:26px;border-radius:50%;border:1px solid var(--border-soft);background:#fff;color:var(--ink-text-soft);font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.reply-quote{font-size:11px;color:var(--ink-text-soft);background:#EDEFF2;border:none;border-radius:10px;padding:5px 10px;margin:0 4px 3px;max-width:74%}
.reply-preview{display:flex;align-items:center;gap:8px;background:rgba(58,50,38,0.06);border-left:3px solid var(--lamp-gold);border-radius:8px;padding:8px 10px}
.reply-preview-text{flex:1;font-size:12px;color:var(--ink-text-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reply-preview-cancel{width:22px;height:22px;border-radius:50%;border:none;background:#fff;color:var(--ink-text-soft);cursor:pointer;flex-shrink:0}
.chat-avatar{flex-shrink:0}
.chat-bubble-col{display:flex;flex-direction:column;max-width:74%}
.chat-msg--me .chat-bubble-col{align-items:flex-end}
.chat-msg--other .chat-bubble-col{align-items:flex-start}
.chat-sender-name{font-size:11px;color:var(--ink-text-soft);margin:0 4px 2px}
.chat-bubble{padding:9px 13px;border-radius:16px;font-size:14px;line-height:1.4;word-break:break-word;white-space:pre-wrap}
.chat-bubble--me{background:#FEE500;color:#3C1E1E;border-bottom-right-radius:4px}
.chat-bubble--other{background:#EDEFF2;color:var(--ink-text);border:none;border-bottom-left-radius:4px}
.chat-bubble--emoji{background:none;border:none;font-size:40px;padding:0;line-height:1.1}
.chat-time{font-size:10px;color:var(--ink-text-soft);margin:2px 4px 0}
.chat-time-row{display:flex;align-items:center;gap:4px}
.chat-unread-badge{font-size:10px;color:var(--lamp-gold-deep);font-weight:700}
.reaction-row{display:flex;align-items:center;gap:6px;margin:4px 4px 0;flex-wrap:wrap}
.reaction-pill{font-size:15px;padding:3px 10px;border-radius:999px;border:none;background:#EDEFF2;cursor:pointer;line-height:1.4}
.reaction-pill--mine{background:color-mix(in srgb,var(--lamp-gold) 16%,#EDEFF2);color:var(--ink-text)}
.reaction-check{font-size:12px;font-weight:700}
.reaction-add-btn{font-size:11px;width:20px;height:20px;border-radius:50%;border:none;background:#EDEFF2;color:var(--ink-text-soft);cursor:pointer;padding:0;line-height:1}
.reaction-picker{box-sizing:border-box;margin:4px 4px 0;background:#fff;border:1px solid var(--border-soft);border-radius:12px;padding:8px;width:min(320px,calc(100vw - 90px));max-width:calc(100vw - 90px)}
.reaction-picker-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;max-height:200px;overflow-y:auto;justify-items:center}
.reaction-picker-btn{position:relative;font-size:24px;background:none;border:none;cursor:pointer;padding:3px;border-radius:6px}
.reaction-picker-btn--mine{background:color-mix(in srgb,var(--lamp-gold) 24%,#fff);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--lamp-gold) 60%,transparent)}
.reaction-check--picker{position:absolute;bottom:-2px;right:-2px;font-size:10px;background:var(--lamp-gold-deep);color:#fff;border-radius:50%;width:12px;height:12px;line-height:12px;text-align:center}
.reaction-view-btn{width:30px;height:30px;border-radius:50%;border:none;background:#EDEFF2;font-size:15px;cursor:pointer;padding:0;line-height:1;display:flex;align-items:center;justify-content:center}
.reaction-viewer-header{display:flex;align-items:center;justify-content:space-between;width:100%}
.reaction-viewer-header .text-btn{font-size:16px;color:var(--ink-text-soft)}
.reaction-tabs{display:flex;flex-wrap:wrap;gap:6px;width:100%;margin:12px 0}
.reaction-tab{display:flex;align-items:center;gap:4px;font-size:15px;padding:6px 10px;border-radius:999px;border:1px solid var(--border-soft);background:#fff;cursor:pointer}
.reaction-tab--active{background:color-mix(in srgb,var(--lamp-gold) 24%,#fff);border-color:var(--lamp-gold-deep)}
.reaction-tab-count{font-size:12px;color:var(--ink-text-soft)}
.reaction-tab--active .reaction-tab-count{color:var(--ink-text)}
.reaction-viewer-list{display:flex;flex-direction:column;gap:12px;width:100%;max-height:280px;overflow-y:auto}
.reaction-viewer-row{display:flex;align-items:center;gap:10px;font-size:14px}
.chat-msg-actions{display:flex;gap:10px;margin:3px 4px 0}
.chat-msg-actions .text-btn{font-size:11px;padding:0;color:var(--ink-text-soft)}
.chat-msg-confirm{font-size:11px;color:var(--ink-text-soft);margin:4px 4px 0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.chat-msg-confirm .text-btn{font-size:11px;padding:0}
.chat-edit-box{display:flex;flex-direction:column;gap:6px;width:100%;min-width:180px}
.cheer-edit-textarea{font-size:14px;padding:8px 10px;border-radius:12px}
.chat-edit-actions{display:flex;gap:10px;justify-content:flex-end}
.cheer-emoji-row{display:flex;flex-wrap:wrap;gap:6px;max-height:168px;overflow-y:auto;padding:4px 2px}
.cheer-emoji-btn{flex-shrink:0;width:38px;height:38px;border-radius:10px;border:1px solid var(--border-soft);background:#fff;font-size:19px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.cheer-emoji-btn:active{background:rgba(var(--gold-rgb),0.15);transform:scale(0.94)}
.cheer-emoji-btn:disabled{opacity:0.5}
.cheer-input-col{display:flex;flex-direction:column;gap:8px}
.cheer-textarea{resize:none;min-height:44px;font-family:inherit;line-height:1.4}
.cheer-actions-row{display:flex;justify-content:space-between;align-items:center;gap:8px}
html .cheer-actions-row .cheer-emoji-toggle,html .cheer-actions-row .cheer-sticker-toggle{height:42px;flex-shrink:0;box-sizing:border-box;background:#fff;color:var(--ink-text);border:1px solid var(--border-soft);border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;width:48px;padding:0;font-size:22px;font-family:inherit;white-space:nowrap}
.cheer-send-btn{flex:1;width:auto;padding:10px 22px}
.progress-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:14px;box-shadow:0 8px 20px rgba(0,0,0,0.2)}
.cycle-progress-bar{width:100%;height:8px;background:rgba(58,50,38,0.12);border-radius:999px;overflow:hidden}
.cycle-progress-fill{height:100%;background:var(--lamp-gold-deep);border-radius:999px}
.cycle-progress-label{font-size:12px;color:var(--ink-text-soft);margin:6px 0 0;text-align:center}
.meditation-links{display:flex;flex-wrap:wrap;gap:8px}
.meditation-links .reading-link-btn{flex:1;width:auto}
.check-btn{padding:15px;border-radius:12px;border:none;background:var(--sage);color:#fff;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit}
.check-btn--done{background:var(--ink-text)}
.check-btn:disabled{opacity:0.6}
.check-btn--saving{background:var(--ink-text-soft);display:flex;align-items:center;justify-content:center;gap:10px}
.ck-spin{width:16px;height:16px;border:3px solid rgba(255,255,255,0.4);border-top-color:#fff;border-radius:50%;animation:ckspin .8s linear infinite;display:inline-block}
@keyframes ckspin{to{transform:rotate(360deg)}}
.ck-done{text-align:center;padding:16px 12px;border-radius:14px;background:var(--sage);color:#fff}
.ck-big{width:64px;height:64px;line-height:64px;margin:0 auto 6px;border-radius:50%;background:rgba(255,255,255,0.22);font-size:40px;font-weight:800}
.ck-title{font-size:20px;font-weight:800}
.ck-sub{font-size:14px;margin-top:4px;opacity:.95}
.ck-done--pop .ck-big{animation:ckpop .6s cubic-bezier(.34,1.56,.64,1)}
@keyframes ckpop{0%{transform:scale(.2);opacity:0}100%{transform:scale(1);opacity:1}}
.ck-undo{margin:8px auto 0;display:block;background:none;border:none;color:var(--ink-text-soft);font-size:13px;text-decoration:underline;padding:8px;font-family:inherit;cursor:pointer}
.ck-confirm{margin-top:8px;padding:12px;border-radius:12px;border:2px solid var(--ember);background:rgba(var(--fg-rgb),0.06);text-align:center;color:var(--ink-text)}
.ck-confirm p{margin:0 0 10px;font-size:16px;font-weight:700}.ck-confirm span{font-size:12px;font-weight:400;color:var(--ink-text-soft)}
.ck-confirm-btns{display:flex;gap:8px}.ck-confirm-btns button{flex:1;padding:13px 6px;border-radius:10px;border:none;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer}
.ck-keep{background:var(--sage);color:#fff}.ck-cancel{background:transparent;color:var(--ink-text);border:1.5px solid var(--ink-text-soft)!important}
.ck-error{margin:0 0 8px;padding:12px;border-radius:12px;background:#b3261e;color:#fff;display:flex;flex-direction:column;gap:6px;text-align:center;font-size:14px;line-height:1.4}
.ck-error strong{font-size:16px}
.ck-retry{background:#fff;color:#b3261e;border:none;border-radius:10px;padding:13px;font-size:16px;font-weight:800;font-family:inherit;cursor:pointer}
@media (prefers-reduced-motion:reduce){.ck-spin,.ck-done--pop .ck-big{animation:none}}
.countdown-text{font-size:12px;color:var(--ink-text-soft);margin:2px 0 0;text-align:center}
.deadline-warning{font-size:13px;color:#fff;font-weight:700;margin:4px 0 0;text-align:center;background:var(--ember);border-radius:8px;padding:8px 10px}
.celebrate-banner{font-size:15px;font-weight:800;text-align:center;margin:6px 0 0;padding:12px 14px;border-radius:12px;color:#fff;letter-spacing:0.01em;background:linear-gradient(135deg, var(--lamp-gold) 0%, var(--lamp-gold-deep) 55%, var(--sage) 130%);box-shadow:0 0 22px rgba(var(--gold-rgb),0.55), 0 8px 18px rgba(0,0,0,0.25);animation:celebrate-pop 0.55s cubic-bezier(0.34, 1.56, 0.64, 1)}
@keyframes celebrate-pop{0%{transform:scale(0.85);opacity:0}
60%{transform:scale(1.06);opacity:1}
100%{transform:scale(1);opacity:1}
}
@media (prefers-reduced-motion:reduce){.celebrate-banner{animation:none}
}
.ledger-card, .history-card{background:rgba(var(--fg-rgb),0.05);border:1px solid rgba(var(--fg-rgb),0.12);border-radius:18px;padding:18px 18px 14px}
.ledger-title{font-size:13px;font-weight:700;color:var(--fg);margin:0 0 12px}
.ledger-table{display:flex;flex-direction:column}
.ledger-row{display:flex;justify-content:space-between;align-items:center;padding:10px 4px;border-bottom:1px solid rgba(var(--fg-rgb),0.08);font-size:13px}
.ledger-row:last-child{border-bottom:none}
.ledger-row--me{color:var(--lamp-gold);font-weight:700}
.ledger-name{flex:1}
.ledger-rank{font-family:"Noto Sans KR", monospace;font-size:11px;color:rgba(var(--fg-rgb),0.4);width:26px;flex-shrink:0}
.ledger-row--me .ledger-rank{color:var(--lamp-gold)}
.ledger-value{font-family:"Noto Sans KR", monospace;font-size:13px;min-width:64px;text-align:right;color:rgba(var(--fg-rgb),0.85)}
.ledger-row--me .ledger-value{color:var(--lamp-gold)}
.ledger-note{font-size:11px;color:rgba(var(--fg-rgb),0.45);margin:10px 0 0}
/* 이번 달 읽기 순위 카드: 다른 카드들과 같은 밝은 카드 색으로 */
html .ledger-card{background:var(--parchment);color:var(--ink-text);border:none;box-shadow:0 12px 28px rgba(0,0,0,0.25);padding:20px 20px 16px}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .ledger-card{border:1px solid rgba(var(--fg-rgb),0.24);box-shadow:0 12px 28px rgba(0,0,0,0.12)}
html .ledger-card .ledger-title{color:var(--ink-text)}
html .ledger-card .ledger-row{color:var(--ink-text);border-bottom-color:var(--border-soft)}
html .ledger-card .ledger-row--me,html .ledger-card .ledger-row--me .ledger-rank,html .ledger-card .ledger-row--me .ledger-value{color:var(--lamp-gold-deep)}
html .ledger-card .ledger-rank{color:var(--ink-text-soft)}
html .ledger-card .ledger-value{color:var(--ink-text)}
html .ledger-card .ledger-note{color:var(--ink-text-soft)}
/* 정산 탭 바깥 카드: 투명 대신 다른 카드와 같은 불투명 배경 */
html .history-card{background:var(--parchment);color:var(--ink-text);border:none;box-shadow:0 12px 28px rgba(0,0,0,0.25);padding:20px}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .history-card{border:1px solid rgba(var(--fg-rgb),0.24);box-shadow:0 12px 28px rgba(0,0,0,0.12)}
html .history-card .name-select{background-color:#fff;color:var(--ink-text);border:1px solid var(--border-soft);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B6355' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>")}
html .history-card .day-detail-list{background:#fff;border:1px solid var(--border-soft)}
html .history-card .day-row{color:var(--ink-text-soft);border-bottom:1px solid var(--border-soft)}
html .history-card .day-row:last-child{border-bottom:none}
html .history-card .day-row-date,html .history-card .day-row--miss .day-row-date{color:var(--ink-text)}
html .history-card .day-row--miss,html .history-card .day-row--miss .day-row-status{color:var(--ember)}
html .history-card .modal-note{color:var(--ink-text-soft)}
html .history-card .ledger-table--history{background:#fff;border:1px solid var(--border-soft)}
.ledger-table--history{background:var(--parchment);border-radius:14px;padding:12px 14px}
.ledger-table--history .ledger-row{color:var(--ink-text);border-bottom-color:var(--border-soft)}
.ledger-table--history .ledger-value{color:var(--ink-text)}
.ledger-row--head{font-size:11px;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-text-soft);border-bottom:1px solid var(--border-soft)}
.ledger-row--total{border-top:1.5px solid var(--border-soft);font-weight:700;margin-top:4px;padding-top:12px}
.ledger-value--fine{color:var(--lamp-gold-deep)}
.ledger-value--unpaid{color:var(--ember);font-weight:700}
.ledger-table--history .ledger-row--me{color:var(--lamp-gold-deep)}
.ledger-table--history .ledger-rank{color:var(--ink-text-soft)}
.ledger-table--history .ledger-row--me .ledger-rank{color:var(--lamp-gold-deep)}
.day-detail-list{display:flex;flex-direction:column;max-height:320px;overflow-y:auto;border:1px solid rgba(var(--fg-rgb),0.1);border-radius:12px;margin-bottom:16px}
.day-row{display:flex;justify-content:space-between;gap:10px;padding:8px 12px;font-size:12px;border-bottom:1px solid rgba(var(--fg-rgb),0.06);color:rgba(var(--fg-rgb),0.55)}
.day-row:last-child{border-bottom:none}
.day-row-date{flex-shrink:0;font-family:"Noto Sans KR", monospace;color:rgba(var(--fg-rgb),0.8)}
.day-row--miss{color:var(--ember)}
.day-row--miss .day-row-date{color:rgba(var(--fg-rgb),0.8)}
.day-row--miss .day-row-status{color:var(--ember);font-weight:600}
.admin-screen{padding:24px 0 40px}
.admin-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.admin-title{font-family:"Noto Serif KR", serif;font-size:20px;font-weight:700;margin:0}
.admin-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:24px 20px;display:flex;flex-direction:column;align-items:center;gap:12px}
.admin-panel{display:flex;flex-direction:column;gap:20px}
.admin-section{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:10px}
.admin-section-title{font-family:"Noto Serif KR", serif;font-size:15px;font-weight:700;margin:0}
.admin-sec-head{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:44px;margin:-10px 0;padding:0;background:none;border:0;color:inherit;font:inherit;text-align:left;cursor:pointer}
.admin-section.is-open .admin-sec-chev{transform:rotate(180deg)}
.admin-sec-body{display:flex;flex-direction:column;gap:10px;padding-top:14px}
.admin-sec-body[hidden]{display:none}


/* ===== 읽기 도우미 (AI) ===== */
.guide-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:18px 18px 16px;display:flex;flex-direction:column;gap:10px;box-shadow:0 8px 20px rgba(0,0,0,0.2)}
.guide-head{display:flex;align-items:center;gap:8px}
.guide-ai{font-size:10.5px;font-weight:800;letter-spacing:.06em;color:var(--lamp-gold-deep);border:1px solid rgba(var(--gold-rgb),0.6);border-radius:999px;padding:1px 7px}
.guide-sub{margin:2px 0 0;font-size:14px;font-weight:700}
.guide-summary{margin:0;padding:0;list-style:none;counter-reset:gs;display:flex;flex-direction:column;gap:8px}
.guide-summary li{counter-increment:gs;position:relative;padding-left:30px;font-size:16px;line-height:1.6;word-break:keep-all}
.guide-summary li::before{content:counter(gs);position:absolute;left:0;top:2px;width:22px;height:22px;border-radius:50%;background:rgba(var(--gold-rgb),0.28);color:var(--lamp-gold-deep);font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center}
.guide-toggle{display:flex;justify-content:space-between;align-items:center;width:100%;background:none;border:none;border-top:1px solid var(--border-soft);padding:12px 2px 2px;font-size:15px;font-weight:700;color:var(--ink-text);font-family:inherit;cursor:pointer}
.guide-chev{color:var(--lamp-gold-deep);transition:transform .2s}
.guide-chev.is-open{transform:rotate(180deg)}
.guide-bg{display:flex;flex-direction:column;gap:10px;animation:quizIn .35s ease both}
.guide-bg-item{background:#fff;border:1px solid var(--border-soft);border-radius:14px;padding:11px 13px;display:flex;flex-direction:column;gap:5px}
.guide-bg-label{align-self:flex-start;font-size:12px;font-weight:800;color:#fff;background:var(--lamp-gold-deep);border-radius:999px;padding:2px 10px}
.guide-bg-item p{margin:0;font-size:15px;line-height:1.6;word-break:keep-all}
.guide-src{align-self:flex-start;background:rgba(var(--gold-rgb),0.16)}
.guide-sub--sep{border-top:1px solid var(--border-soft);padding-top:12px;margin-top:2px}
.guide-mq{display:flex;flex-direction:column;gap:10px}
.guide-mq-item{background:#fff;border:1px solid var(--border-soft);border-radius:14px;padding:12px 13px;display:flex;flex-direction:column;gap:8px}
.guide-mq-angle{align-self:flex-start;font-size:12px;font-weight:800;color:var(--lamp-gold-deep);background:rgba(var(--gold-rgb),0.18);border-radius:999px;padding:2px 10px}
.guide-mq-q{margin:0;font-size:16px;font-weight:600;line-height:1.6;word-break:keep-all}
.guide-mq-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.guide-hint-btn{border:1px dashed rgba(var(--gold-rgb),0.7);background:none;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700;color:var(--ink-text);font-family:inherit;cursor:pointer}
.guide-hint{background:rgba(var(--gold-rgb),0.1);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:6px;animation:quizIn .3s ease both}
.guide-hint p{margin:0;font-size:14.5px;line-height:1.6;color:var(--ink-text);word-break:keep-all}
.reading-card--done{padding:16px 18px;gap:12px}
.read-done-undo{margin:-4px auto -6px;padding:6px;font-size:12px}
.read-done{display:flex;align-items:center;gap:12px}
.read-done-ok{flex:none;width:42px;height:42px;border-radius:50%;background:var(--sage);color:#fff;font-size:21px;font-weight:800;display:flex;align-items:center;justify-content:center}
.read-done--pop .read-done-ok{animation:ckpop .6s cubic-bezier(.34,1.56,.64,1)}
.read-done-text{flex:1;min-width:0}
.read-done-title{margin:0;font-family:"Noto Serif KR",serif;font-size:17px;font-weight:700}
.read-done-sub{margin:2px 0 0;font-size:12.5px;color:var(--ink-text-soft)}
.read-done-again{flex:none;border:none;background:none;color:var(--lamp-gold-deep);font-size:13.5px;font-weight:700;font-family:inherit;padding:10px 4px;cursor:pointer}
.guide-tabs{display:grid;gap:3px;padding:3px;border-radius:12px;background:color-mix(in srgb,var(--ink-text) 7%,transparent)}
.guide-tab{border:none;background:none;border-radius:10px;padding:10px 4px;font-size:14px;font-weight:700;color:var(--ink-text-soft);font-family:inherit;cursor:pointer}
.guide-tab.is-on{background:#fff;color:var(--lamp-gold-deep);box-shadow:0 1px 3px rgba(0,0,0,0.12)}
.guide-mq-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:0;overscroll-behavior-x:contain}
.guide-mq-track::-webkit-scrollbar{display:none}
.guide-mq-track>.guide-mq-item{flex:0 0 100%;box-sizing:border-box;scroll-snap-align:center;scroll-snap-stop:always}
.guide-mq-angle{display:inline-flex;align-items:center;gap:6px}
.guide-mq-no{font-style:normal;font-weight:700;color:var(--ink-muted,#475C71);font-size:11.5px;margin-left:4px}
.guide-swipe-tip{margin:-4px 0 0;text-align:center;font-size:12px;color:var(--ink-muted,#475C71)}
.guide-subs{display:flex;flex-wrap:wrap;gap:6px}
.guide-sub{border:none;border-radius:999px;padding:7px 12px;font-size:13px;font-weight:700;font-family:inherit;cursor:pointer;background:rgba(31,50,71,0.06);color:var(--ink-muted,#475C71)}
.guide-sub span{opacity:.7;font-weight:600}
.guide-sub.is-on{background:var(--lamp-gold-deep);color:#fff}
.guide-pp-track{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain;padding:2px 0 4px}
.guide-pp-track::-webkit-scrollbar{display:none}
.guide-pp{flex:0 0 min(200px,72%);scroll-snap-align:start;background:#fff;border:1px solid var(--border-soft);border-radius:16px;padding:13px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;font-family:inherit;color:var(--ink-text);cursor:pointer}
.guide-pp-av{width:42px;height:42px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-family:"Noto Serif KR",serif;font-weight:700;font-size:18px;background:rgba(var(--gold-rgb),0.18);color:var(--lamp-gold-deep)}
.guide-pp-av.is-place{background:rgba(46,158,91,0.15);font-size:19px}
.guide-pp-av--lg{width:52px;height:52px;font-size:21px}
.guide-pp-name{font-family:"Noto Serif KR",serif;font-size:18px;font-weight:700}
.guide-pp-rel{margin:0;font-size:12.5px;font-weight:700;color:var(--lamp-gold-deep)}
.guide-pp-desc{font-size:14px;line-height:1.55;word-break:keep-all}
.guide-pp-vs{font-size:12px;font-weight:700;color:var(--ink-muted,#475C71)}
.guide-pp-more{margin-top:auto;font-size:12.5px;font-weight:700;color:var(--lamp-gold-deep)}
.guide-words{display:flex;flex-direction:column}
.guide-word{display:flex;flex-direction:column;gap:5px;padding:11px 0;border-top:1px solid var(--border-soft)}
.guide-word:first-child{border-top:none;padding-top:2px}
.guide-word-head{display:flex;align-items:baseline;gap:8px}
.guide-word-head b{font-family:"Noto Serif KR",serif;font-size:18px}
.guide-word-head span{margin-left:auto;font-size:12px;font-weight:700;color:var(--ink-muted,#475C71)}
.guide-word p{margin:0;font-size:15px;line-height:1.6;word-break:keep-all}
.guide-word .guide-word-quote{font-size:13px;color:var(--ink-muted,#475C71);background:rgba(var(--gold-rgb),0.08);border-radius:10px;padding:7px 10px}
.guide-word-quote b{color:var(--lamp-gold-deep);margin-right:4px}
.guide-person-sheet{display:flex;flex-direction:column;align-items:stretch;gap:14px;text-align:left}
.guide-person-sheet .guide-person-sec,.guide-person-sheet .guide-person-head>div{text-align:left;align-items:flex-start}
.guide-person-sheet .guide-person-sec>p{align-self:stretch;text-align:left}
.guide-person-head{display:flex;align-items:center;gap:12px}
.guide-person-head .modal-title{margin:0;text-align:left}
.guide-person-head .modal-close{margin-left:auto}
.guide-person-sec{display:flex;flex-direction:column;gap:6px}
.guide-person-sec p{margin:0;font-size:15px;line-height:1.6;word-break:keep-all}
.guide-person-sec .guide-person-lb{font-size:11.5px;font-weight:800;letter-spacing:.06em;color:var(--ink-muted,#475C71)}
.serve-card{background:var(--card-bg,#FBFDFF);border-radius:18px;padding:12px 14px;display:flex;flex-direction:column;gap:10px;box-shadow:0 6px 16px rgba(31,50,71,0.12)}
.serve-row{display:flex;align-items:center;gap:12px}
.serve-ico{flex:none;width:40px;height:40px;border-radius:12px;background:rgba(46,158,91,0.14);color:#1d6b40;display:flex;align-items:center;justify-content:center}
.serve-text{flex:1;min-width:0}
.serve-title{margin:0;font-size:16px;font-weight:700;color:var(--ink-text)}
.serve-sub{margin:0;font-size:12.5px;color:var(--ink-muted,#475C71);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.serve-prev{margin:0;font-size:14.5px;line-height:1.6;color:var(--ink-text);background:rgba(46,158,91,0.08);border-radius:12px;padding:10px 12px;word-break:keep-all}
.serve-step{display:flex;gap:10px}
.serve-step p{margin:0;line-height:1.6;word-break:keep-all}
.serve-step .guide-person-lb{font-size:11.5px;font-weight:800;letter-spacing:.06em;color:var(--ink-muted,#475C71);line-height:1.4;margin-top:3px}
.serve-step>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.serve-n{flex:none;width:24px;height:24px;border-radius:50%;background:rgba(46,158,91,0.16);color:#1d6b40;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-top:1px}
.serve-sheet .serve-say{font-size:15.5px;background:#fff;border:1px solid var(--border-soft);border-radius:12px;padding:10px 12px}
.serve-sheet .serve-verse{font-size:14.5px;background:rgba(var(--gold-rgb),0.08);border-radius:12px;padding:10px 12px}
.serve-verse b{color:var(--lamp-gold-deep)}
.serve-acts{display:flex;gap:8px}
.serve-acts button{flex:1}
.serve-sheet .guide-person-head .guide-ask-range{margin-left:2px}
.guide-pl{display:flex;flex-direction:column;border:1px solid var(--border-soft);border-radius:14px;overflow:hidden;background:#fff}
.guide-pl-item+.guide-pl-item{border-top:1px solid var(--border-soft)}
.guide-pl-row{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;min-height:56px;border:none;background:none;font-family:inherit;color:var(--ink-text);text-align:left;cursor:pointer}
.guide-pl-row .guide-pp-av{width:38px;height:38px;font-size:16px}
.guide-pl-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.guide-pl-txt b{font-family:"Noto Serif KR",serif;font-size:17px}
.guide-pl-txt span{font-size:12.5px;font-weight:700;color:var(--lamp-gold-deep)}
.guide-pl-chev{flex:none;font-size:13px;color:var(--ink-muted,#475C71)}
.guide-pl-item.is-open{background:rgba(var(--gold-rgb),0.05)}
.guide-pl-body{padding:0 14px 14px 62px;display:flex;flex-direction:column;gap:8px;animation:quizIn .25s ease both}
.guide-pl-body p{margin:0;font-size:15px;line-height:1.6;word-break:keep-all}
.guide-pl-body .guide-pl-sub{font-size:14px}
.guide-pl-sub b{font-size:12px;color:var(--ink-muted,#475C71);margin-right:4px}
.guide-pl-scenes{font-size:14px}
@media (max-width:360px){.guide-pl-body{padding-left:14px}}
.guide-pane{display:flex;flex-direction:column;gap:10px;touch-action:pan-y}
.guide-pane .guide-mq-track{touch-action:pan-x pan-y}
.guide-pane--next{animation:guideInR .22s ease both}
.guide-pane--prev{animation:guideInL .22s ease both}
@keyframes guideInR{from{opacity:.3;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes guideInL{from{opacity:.3;transform:translateX(-28px)}to{opacity:1;transform:none}}
.stats-seg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:4px;border-radius:14px;background:rgba(31,50,71,0.08);margin-bottom:0}
.stats-seg button{border:none;background:none;border-radius:11px;padding:11px 0;font-size:15px;font-weight:800;color:var(--ink-muted,#475C71);font-family:inherit;cursor:pointer}
.stats-seg button.on{background:#fff;color:var(--lamp-gold-deep);box-shadow:0 1px 4px rgba(31,50,71,0.15)}
.stats-pane{display:flex;flex-direction:column;gap:16px;touch-action:pan-y}
.stats-more-btn{align-self:center;border:none;background:rgba(31,50,71,0.06);border-radius:999px;padding:10px 16px;font-size:13.5px;font-weight:700;color:var(--ink-text);font-family:inherit;cursor:pointer}
.rank-sub{margin:0;font-size:12.5px;color:var(--ink-muted,#475C71)}
.rank-list{display:flex;flex-direction:column}
.rank-row{display:flex;align-items:center;gap:10px;padding:8px 2px;border-top:1px solid var(--border-soft)}
.rank-row:first-child{border-top:none}
.rank-row.is-me{background:rgba(var(--gold-rgb),0.08);border-radius:10px}
.rank-no{flex:none;width:22px;text-align:center;font-weight:800;color:var(--lamp-gold-deep)}
.rank-name{flex:none;width:58px;font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rank-bar{flex:1;height:10px;border-radius:5px;background:rgba(31,50,71,0.08);overflow:hidden}
.rank-bar i{display:block;height:100%;border-radius:5px;background:var(--lamp-gold-deep)}
.rank-val{flex:none;min-width:48px;text-align:right;font-size:13.5px;font-weight:700}
.quiz-hint-btn{align-self:flex-start;border:1px dashed rgba(var(--gold-rgb),0.7);background:none;border-radius:999px;padding:7px 13px;font-size:13.5px;font-weight:700;color:var(--ink-text);font-family:inherit;cursor:pointer;min-height:36px}
.quiz-hint{display:flex;gap:8px;align-items:flex-start;background:rgba(var(--gold-rgb),0.1);border-radius:12px;padding:10px 12px;animation:quizIn .25s ease both}
.quiz-hint p{margin:0;font-size:14.5px;line-height:1.55;word-break:keep-all}
.serve-pick-lb{margin:0 0 -6px;font-size:12px;font-weight:800;letter-spacing:.04em;color:var(--ink-muted,#475C71)}
.serve-verse-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.serve-vtab{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px;min-height:58px;border-radius:14px;border:2px solid var(--border-soft);background:#fff;color:var(--ink-text);font-family:inherit;cursor:pointer}
.serve-vtab b{font-size:16px;font-weight:800}
.serve-vtab-no{font-size:12px;font-weight:700;color:var(--ink-muted,#475C71)}
.serve-vtab.is-on{border-color:var(--lamp-gold-deep);background:var(--lamp-gold-deep);color:#fff;box-shadow:0 4px 10px rgba(31,50,71,0.2)}
.serve-vtab.is-on .serve-vtab-no{color:rgba(255,255,255,0.9)}
.dt-head{display:flex;align-items:center;gap:8px;border-top:1px solid var(--border-soft);padding-top:12px;margin-top:2px}
.dt-head b{font-size:15px;color:var(--ink-text)}
.dt-head span{margin-left:auto;font-size:12.5px;color:var(--ink-muted,#475C71)}
.dt-fold{flex:none;width:36px;height:36px;border:none;border-radius:999px;background:rgba(31,50,71,0.06);color:var(--ink-muted,#475C71);font-family:inherit;cursor:pointer}
.dt-verse{margin:0;font-family:"Noto Serif KR",serif;font-size:17px;line-height:1.65;color:var(--ink-text);background:rgba(var(--gold-rgb),0.08);border-radius:12px;padding:12px 14px;word-break:keep-all}
.dt-ref{display:block;margin-top:6px;font-family:inherit;font-size:13px;font-weight:700;color:var(--lamp-gold-deep)}
.dt-lb{margin:0;font-size:12px;font-weight:800;color:var(--ink-muted,#475C71)}
.serve-body{display:flex;flex-direction:column;gap:12px;animation:quizIn .25s ease both}
.serve-card .serve-say{font-size:15.5px;background:#fff;border:1px solid var(--border-soft);border-radius:12px;padding:10px 12px}
.serve-card .serve-verse{font-size:14.5px;background:rgba(var(--gold-rgb),0.08);border-radius:12px;padding:10px 12px}
.serve-toggle{flex:none;border:1px solid var(--border-soft);background:none;border-radius:999px;padding:8px 14px;min-height:38px;font-size:13.5px;font-weight:700;color:var(--lamp-gold-deep);font-family:inherit;cursor:pointer;white-space:nowrap}
.wc-no{width:38px;height:38px;font-size:15px}
.wc-body{padding-left:62px}
@media (max-width:360px){.wc-body{padding-left:14px}}
.guide-pager{display:flex;align-items:center;justify-content:space-between;gap:8px}
.guide-pg-btn{border:1px solid var(--border-soft);background:#fff;border-radius:999px;padding:8px 14px;font-size:13.5px;font-weight:700;color:var(--ink-text);font-family:inherit;cursor:pointer}
.guide-pg-dots{display:flex;gap:6px}
.guide-pg-dots i{width:8px;height:8px;border-radius:50%;background:var(--border-soft)}
.guide-pg-dots i.is-on{background:var(--lamp-gold-deep)}
.lamp-foot{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:12px}
.lamp-foot .lamp-caption{margin:0}
.lamp-more-btn{border:none;background:rgba(var(--fg-rgb),0.1);color:rgba(var(--fg-rgb),0.8);border-radius:999px;padding:6px 12px;font-size:12px;font-weight:700;font-family:inherit;cursor:pointer}
.lamp-more{display:flex;flex-direction:column;align-items:center}
.guide-ask-btn{display:flex;align-items:center;gap:10px;width:100%;border:1.5px solid rgba(var(--gold-rgb),0.55);background:rgba(var(--gold-rgb),0.1);border-radius:14px;padding:12px 14px;font-size:15.5px;font-weight:700;color:var(--ink-text);font-family:inherit;cursor:pointer;margin-top:4px}
.guide-ask-ico{font-size:18px}
.guide-ask-go{margin-left:auto;color:var(--lamp-gold-deep);font-size:20px;line-height:1}
.guide-note{margin:0;font-size:12px;color:var(--ink-text-soft);line-height:1.5}
.guide-wait .ck-spin,.guide-a--wait .ck-spin{border-color:rgba(var(--gold-rgb),0.3);border-top-color:var(--lamp-gold-deep)}
.guide-wait{margin:0;font-size:14px;color:var(--ink-text-soft);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.guide-ask-sheet{max-width:440px;align-items:stretch;gap:12px;padding:20px 16px 16px;height:min(640px,86vh);overflow:hidden}
.guide-ask-range{font-size:14px;font-weight:600;color:var(--lamp-gold-deep);margin-left:4px}
.guide-ask-list{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:2px}
.guide-q{align-self:flex-end;max-width:85%;background:var(--lamp-gold-deep);color:#fff;border-radius:16px 16px 4px 16px;padding:9px 13px;font-size:15px;line-height:1.5;word-break:keep-all}
.guide-a{align-self:flex-start;max-width:92%;background:#fff;border:1px solid var(--border-soft);border-radius:16px 16px 16px 4px;padding:11px 13px;font-size:15.5px;line-height:1.65;word-break:keep-all}
.guide-a p{margin:0}
.guide-a--none{background:rgba(var(--gold-rgb),0.1)}
.guide-a--wait{color:var(--ink-text-soft);display:flex;align-items:center;gap:8px;font-size:14px}
.guide-a .quiz-ref{background:rgba(var(--gold-rgb),0.16)}
.guide-ask-empty{margin:auto 0;text-align:center;display:flex;flex-direction:column;gap:12px;padding:8px}
.guide-ask-empty p{margin:0;font-size:15.5px;line-height:1.6}
.guide-examples{display:flex;flex-direction:column;gap:8px}
.guide-example{border:1px solid var(--border-soft);background:#fff;border-radius:999px;padding:10px 14px;font-size:14.5px;color:var(--ink-text);font-family:inherit;cursor:pointer}
.guide-ask-compose{display:flex;gap:8px;align-items:flex-end}
.guide-ask-input{flex:1;resize:none;min-height:48px;line-height:1.45;font-size:16px}
.guide-ask-send{width:auto;flex:none;padding:13px 16px}
.guide-ask-send:disabled,.guide-ask-input:disabled{opacity:.6}
/* ===== 오늘의 성경 퀴즈 ===== */
.quiz-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:18px 18px 16px;display:flex;flex-direction:column;gap:14px;box-shadow:0 8px 20px rgba(0,0,0,0.2);border:1.5px solid rgba(var(--gold-rgb),0.55);animation:quizIn .5s cubic-bezier(.2,.8,.2,1) both}
@keyframes quizIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.quiz-card--done{border-color:var(--border-soft)}
.quiz-card--row{flex-direction:row;align-items:center;gap:12px;padding:12px 14px}
.quiz-card--row .quiz-ico{width:40px;height:40px;font-size:20px}
.quiz-card--row .quiz-card-title{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.quiz-card--row .quiz-card-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.quiz-go-btn.quiz-go-btn--sm{flex:none;width:auto;padding:10px 14px;font-size:14px;border-radius:12px;box-shadow:none;white-space:nowrap}
.quiz-card--row .quiz-card-text{flex:1;min-width:0}
.quiz-card--compact{padding:6px 8px;border-color:var(--border-soft)}
.quiz-card-row{display:flex;align-items:center;gap:12px}
.quiz-ico{flex:none;width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:22px;background:rgba(var(--gold-rgb),0.22)}
.quiz-card-text{flex:1;min-width:0}
.quiz-card-title{margin:0;font-family:"Noto Serif KR",serif;font-size:17px;font-weight:700}
.quiz-card-sub{margin:3px 0 0;font-size:13.5px;color:var(--ink-text-soft);line-height:1.5}
.quiz-card-btns{display:flex;gap:8px}
.quiz-go-btn{flex:1;border:none;border-radius:14px;padding:14px;font-size:16px;font-weight:700;font-family:inherit;color:#fff;background:linear-gradient(135deg,var(--lamp-gold-deep),color-mix(in srgb,var(--lamp-gold-deep) 70%,#000));cursor:pointer;box-shadow:0 6px 14px rgba(0,0,0,0.18)}
.quiz-later-btn{border:1px solid var(--border-soft);background:#fff;color:var(--ink-text-soft);border-radius:14px;padding:12px 16px;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer}
.quiz-mini-btn{flex:none;border:1px solid var(--border-soft);background:#fff;color:var(--ink-text);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600;font-family:inherit;cursor:pointer}
.quiz-compact-btn{width:100%;display:flex;justify-content:space-between;align-items:center;background:none;border:none;padding:12px 10px;font-size:15px;font-weight:600;color:var(--ink-text);font-family:inherit;cursor:pointer}
.quiz-compact-btn span:last-child{color:var(--lamp-gold-deep);font-weight:700}
.quiz-bonus-ask{border-top:1px dashed var(--border-soft);padding-top:12px;display:flex;flex-direction:column;gap:10px}
.quiz-bonus-ask p{margin:0;font-size:16px;line-height:1.6}
.quiz-bonus-ask span{font-size:13px;color:var(--ink-text-soft)}
.quiz-more{border-top:1px solid var(--border-soft);padding:12px 2px 0}
.quiz-ask{gap:12px;animation:quizIn .4s cubic-bezier(.2,.8,.2,1) both}
.quiz-ask .modal-title{font-size:19px;line-height:1.5}
.quiz-ask-ico{width:60px;height:60px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:30px;background:rgba(var(--gold-rgb),0.25)}
.quiz-wait{margin:0;padding:10px;font-size:14px;color:var(--ink-text-soft);display:flex;align-items:center;gap:8px}
.lamp-quiz{font-size:10px;font-weight:700;color:var(--ink-text);background:rgba(var(--gold-rgb),0.3);border-radius:999px;padding:1px 7px;margin-top:2px}
.lamp-quiz--full{background:var(--lamp-gold);color:#fff}
.quiz-sheet{max-width:420px;align-items:stretch;gap:14px;padding:20px 18px 18px;overflow-y:auto}
.quiz-head{width:100%}
.quiz-dots{display:flex;align-items:center;gap:6px}
.quiz-dot{width:10px;height:10px;border-radius:50%;background:var(--border-soft)}
.quiz-dot.is-cur{background:var(--lamp-gold-deep);transform:scale(1.25)}
.quiz-dot.is-ok{background:#2e9e5b}.quiz-dot.is-no{background:var(--ember)}
.quiz-count{margin-left:auto;font-size:13px;color:var(--ink-text-soft);font-weight:600}
.quiz-q{margin:0;font-size:19px;font-weight:700;line-height:1.5;word-break:keep-all}
.quiz-choices{display:flex;flex-direction:column;gap:10px}
.quiz-choice{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:12px 14px;border-radius:14px;border:1.5px solid var(--border-soft);background:#fff;color:var(--ink-text);font-size:16.5px;font-weight:500;font-family:inherit;text-align:left;cursor:pointer;word-break:keep-all;transition:transform .08s,border-color .15s,background .15s}
.quiz-choice:active:not(:disabled){transform:scale(.98);border-color:var(--lamp-gold-deep)}
.quiz-choice:disabled{cursor:default}
.quiz-mark{flex:none;font-size:20px;color:var(--lamp-gold-deep)}
.quiz-tick{margin-left:auto;font-weight:800;font-size:18px}
.quiz-choice.is-answer{background:#e6f6ec;border-color:#2e9e5b;color:#1d5e38;font-weight:700}
.quiz-choice.is-answer .quiz-mark{color:#2e9e5b}
.quiz-choice.is-wrong{background:#fbe9e5;border-color:var(--ember);color:#8a2f1d}
.quiz-choice.is-wrong .quiz-mark{color:var(--ember)}
.quiz-choice.is-dim{opacity:.55}
.quiz-feedback{border-radius:14px;padding:12px 14px;font-size:14.5px;line-height:1.6;animation:quizIn .35s ease both}
.quiz-feedback p{margin:0}
.quiz-feedback.is-ok{background:#e6f6ec;color:#1d5e38}.quiz-feedback.is-no{background:#fdf0ec;color:#7a2c1b}
.quiz-fb-title{font-weight:800;font-size:16px;margin-bottom:4px!important}
.quiz-refs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.quiz-ref{border:none;background:rgba(255,255,255,0.75);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700;color:inherit;font-family:inherit;cursor:pointer}
.quiz-nav{display:flex;gap:8px}
.quiz-nav .primary-btn{flex:1}
.quiz-result{display:flex;flex-direction:column;align-items:stretch;gap:12px;text-align:center}
.quiz-result-score{margin:4px 0 0;font-size:22px;color:var(--ink-text-soft)}
.quiz-result-score b{font-size:52px;color:var(--lamp-gold-deep);font-family:"Noto Serif KR",serif}
.quiz-result-msg{margin:0;font-size:16px;font-weight:700}
.quiz-result-list{display:flex;flex-direction:column;gap:6px;text-align:left}
.quiz-result-row{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:12px;border:1px solid var(--border-soft);background:#fff;font-size:14px;color:var(--ink-text);font-family:inherit;text-align:left;cursor:pointer;line-height:1.5}
.quiz-result-row span:first-child{font-weight:800}
.quiz-result-row.is-ok span:first-child{color:#2e9e5b}.quiz-result-row.is-no span:first-child{color:var(--ember)}
@media (prefers-reduced-motion:reduce){.quiz-card,.quiz-feedback{animation:none}}
.admin-quiz-preview{display:flex;flex-direction:column;gap:10px}
.admin-quiz-q{background:rgba(255,255,255,0.7);border:1px solid var(--border-soft);border-radius:12px;padding:10px 12px;font-size:13.5px}
.admin-quiz-q p{margin:0}
.admin-quiz-q ol{margin:6px 0;padding-left:20px}
.admin-quiz-q li.is-answer{color:#1d7a46;font-weight:700}
/* ===== 관리자 설정 화면 다듬기 ===== */
.admin-screen{padding:28px 16px 48px}
.admin-topbar{align-items:flex-end;margin-bottom:22px}
.admin-eyebrow{margin:0 0 4px;font-size:12px;font-weight:600;letter-spacing:.08em;color:rgba(var(--fg-rgb),0.6)}
.admin-title{font-size:26px;letter-spacing:-.01em}
.admin-close{background:rgba(var(--fg-rgb),0.1);border:1px solid rgba(var(--fg-rgb),0.2);color:var(--fg);border-radius:999px;padding:9px 18px;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s}
.admin-close:active{background:rgba(var(--fg-rgb),0.2)}
.admin-panel{gap:14px}
.admin-section{border-radius:20px;padding:6px 16px;gap:0;border:1px solid var(--border-soft);box-shadow:0 8px 24px rgba(var(--backdrop-rgb),0.28);animation:admIn .45s cubic-bezier(.2,.8,.2,1) both}
.admin-panel > .admin-section:nth-child(2){animation-delay:.04s}.admin-panel > .admin-section:nth-child(3){animation-delay:.08s}.admin-panel > .admin-section:nth-child(4){animation-delay:.12s}.admin-panel > .admin-section:nth-child(5){animation-delay:.16s}.admin-panel > .admin-section:nth-child(6){animation-delay:.2s}.admin-panel > .admin-section:nth-child(7){animation-delay:.24s}
@keyframes admIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.admin-section{animation:none}}
.admin-sec-head{gap:12px;min-height:64px;margin:0;padding:8px 0}
.admin-sec-ico{flex:none;width:40px;height:40px;border-radius:13px;display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(135deg,var(--lamp-gold-deep),color-mix(in srgb,var(--lamp-gold-deep) 62%,#000));box-shadow:0 4px 10px rgba(var(--backdrop-rgb),0.25)}
.admin-sec-ico svg{width:20px;height:20px}
.admin-sec-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.admin-section-title{font-size:16px;letter-spacing:-.005em}
.admin-sec-sub{font-size:12px;color:var(--ink-text-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-sec-chev{flex:none;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--border-soft);color:var(--ink-text-soft);font-size:0;transition:transform .2s,background .2s}
.admin-section.is-open .admin-sec-chev{background:var(--lamp-gold-deep);color:#fff}
.admin-sec-body{padding:14px 0 12px;margin-top:2px;border-top:1px solid var(--border-soft);gap:12px}
.admin-sec-body .modal-note{text-align:left;line-height:1.6;font-size:12.5px;margin:0}
.admin-sec-body .error-text{text-align:left}
.admin-screen .text-input,.admin-screen .name-select{border-radius:12px;padding:13px 14px;font-size:15px;background-color:rgba(255,255,255,0.8);border:1px solid var(--border-soft);color:var(--ink-text);transition:border-color .15s,box-shadow .15s}
.admin-screen .name-select{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B6355' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 14px center;background-size:18px;font-weight:500;padding-right:40px}
.admin-screen .text-input:focus,.admin-screen .name-select:focus{outline:none;border-color:var(--lamp-gold-deep);box-shadow:0 0 0 3px rgba(var(--gold-rgb),0.35)}
.admin-screen .primary-btn{border-radius:14px;padding:14px;letter-spacing:.01em;background:linear-gradient(135deg,var(--lamp-gold-deep),color-mix(in srgb,var(--lamp-gold-deep) 68%,#000));box-shadow:0 6px 16px rgba(var(--backdrop-rgb),0.3);transition:transform .1s,box-shadow .1s}
.admin-screen .primary-btn:active:not(:disabled){transform:translateY(1px);box-shadow:0 2px 8px rgba(var(--backdrop-rgb),0.3)}
.admin-screen .small-btn{border-radius:999px;padding:8px 14px;font-size:12.5px;font-weight:600;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.admin-screen .small-btn--go{background:var(--lamp-gold-deep);color:#fff;border-color:var(--lamp-gold-deep)}
.admin-screen .small-btn--danger{background:rgba(181,77,52,0.07)}
.admin-screen .member-list{gap:8px}
.admin-screen .member-row{background:rgba(255,255,255,0.6);border:1px solid var(--border-soft);border-radius:16px;padding:12px 14px;gap:12px}
.admin-screen .member-row:last-child{border-bottom:1px solid var(--border-soft)}
.admin-screen .member-name{font-size:15px}
.admin-screen .member-joined{font-size:11.5px}
.admin-screen .member-add-form{gap:10px;margin-top:6px;padding-top:14px;border-top:1px dashed var(--border-soft)}
.admin-screen .plan-schedule-list{gap:6px;margin:0}
.admin-screen .plan-schedule-row{background:rgba(255,255,255,0.6);border:1px solid var(--border-soft);border-radius:12px;padding:9px 12px;font-size:13px}
.admin-screen .plan-schedule-row:last-child{border-bottom:1px solid var(--border-soft)}
.admin-screen .edit-day-checklist{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:0}
.admin-screen .edit-day-item{background:rgba(255,255,255,0.6);border:1px solid var(--border-soft);border-radius:12px;padding:10px 12px}
.admin-screen .avatar{background-color:rgba(58,50,38,0.1);color:var(--ink-text)}
.admin-chip{display:inline-block;padding:2px 10px;border-radius:999px;background:rgba(var(--gold-rgb),0.25);color:var(--ink-text);font-weight:700;font-size:12px}
.admin-card{border-radius:22px;padding:28px 22px;box-shadow:0 10px 30px rgba(var(--backdrop-rgb),0.35)}
.member-list{display:flex;flex-direction:column}
.member-row{display:flex;flex-direction:column;gap:10px;padding:12px 0;border-bottom:1px solid var(--border-soft)}
.member-row:last-child{border-bottom:none}
.member-row-main{display:flex;align-items:center;gap:10px}
.member-row-actions{display:flex;gap:6px;flex-wrap:wrap}
.member-name{font-size:14px;font-weight:600;margin:0}
.member-joined{font-size:11px;color:var(--ink-text-soft);margin:2px 0 0}
.member-confirm{display:flex;gap:6px}
.small-btn{padding:7px 12px;border-radius:8px;border:1px solid var(--border-soft);background:#fff;color:var(--ink-text-soft);font-size:12px;cursor:pointer;font-family:inherit;white-space:nowrap}
.small-btn--danger{color:var(--ember);border-color:var(--ember)}
/* 로그인 기록 (관리자) */
.login-log-tools{display:flex;gap:8px;flex-wrap:wrap}
.login-log-tools .small-btn.is-on{background:var(--lamp-gold-deep);border-color:var(--lamp-gold-deep);color:#fff}
.login-log-last{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border:1px solid var(--border-soft);border-radius:10px;background:rgba(255,255,255,0.6);font-size:12.5px}
.login-log-last-row{display:flex;justify-content:space-between;gap:8px;padding:3px 0;color:var(--ink-text)}
.login-log-last-row span:last-child{color:var(--ink-text-soft)}
.login-log-list{display:flex;flex-direction:column}
.login-log-row{padding:9px 0;border-bottom:1px solid var(--border-soft)}
.login-log-row:last-child{border-bottom:none}
.login-log-main{display:flex;align-items:center;gap:8px}
.login-log-name{font-weight:700;font-size:14px;color:var(--ink-text)}
.login-log-badge{font-size:11px;font-weight:700;color:var(--ember);border:1px solid var(--ember);border-radius:999px;padding:1px 8px}
.login-log-sub{margin-top:2px;font-size:12px;color:var(--ink-text-soft);line-height:1.5}
.login-log-row.is-fail .login-log-name{color:var(--ember)}
.small-btn:disabled{opacity:.5}
.member-add-form{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.fine-input-row{display:flex;align-items:center;gap:8px}
.fine-input-row .text-input{flex:1}
.fine-unit{font-size:14px;color:var(--ink-text-soft);font-weight:600}
.edit-day-checklist{display:flex;flex-direction:column;gap:6px;margin:4px 0}
.plan-schedule-list{display:flex;flex-direction:column;gap:4px;margin:8px 0}
.plan-schedule-row{display:flex;justify-content:space-between;font-size:13px;color:var(--ink-text-soft);padding:4px 0;border-bottom:1px solid var(--border-soft)}
.plan-schedule-row:last-child{border-bottom:none}
.edit-day-item{display:flex;align-items:center;gap:8px;font-size:14px;padding:4px 0}
.edit-day-item input[type="checkbox"]{width:18px;height:18px;accent-color:var(--sage)}
.profile-photo-actions{display:flex;gap:8px}
.small-btn--upload{display:inline-flex;align-items:center;cursor:pointer}
.theme-group-label{font-size:11px;color:var(--ink-text-soft);align-self:flex-start;margin:2px 0 -2px}
.theme-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:2px 6px;width:100%}
.theme-opt{word-break:keep-all;text-align:center;display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;padding:4px 0;cursor:pointer;font-family:inherit;color:var(--ink-text-soft);font-size:11px;line-height:1.2}
.theme-swatch{width:32px;height:32px;border-radius:50%;border:2px solid transparent;box-shadow:0 0 0 1px var(--border-soft);display:block;position:relative}
.theme-swatch::after{content:"";position:absolute;right:3px;bottom:3px;width:10px;height:10px;border-radius:50%;background:var(--dot);border:1.5px solid #fff}
.theme-opt--on{color:var(--ink-text);font-weight:700}
.theme-opt--on .theme-swatch{border-color:var(--ink-text);box-shadow:0 0 0 2px #fff inset}
.modal-card--set{padding:16px 18px 18px;gap:10px;align-items:stretch}
.modal-head{display:flex;align-items:center;justify-content:space-between;min-height:32px}
.modal-head .modal-title{text-align:left}
.modal-close{width:32px;height:32px;border-radius:50%;border:1px solid var(--border-soft);background:#fff;color:var(--ink-text-soft);font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;font-family:inherit}
.modal-card .avatar{color:var(--ink-text);background-color:rgba(0,0,0,0.07)}
.cal-card{gap:10px}
.cal-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cal-title{margin:0;font-size:14px;font-weight:700;color:var(--ink-text);text-align:center;flex:1}
.cal-nav{width:32px;height:32px;border-radius:50%;border:1px solid var(--border-soft);background:#fff;color:var(--ink-text);font-size:18px;line-height:1;cursor:pointer;padding:0;font-family:inherit}
.cal-nav:disabled{opacity:.3;cursor:default}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-dow{font-size:11px;text-align:center;color:var(--ink-text-soft);padding:2px 0 4px}
.cal-day{aspect-ratio:1;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:12px;line-height:1.1;color:var(--ink-text);background:rgba(0,0,0,0.04)}
.cal-day small{font-size:9px;font-weight:700;margin-top:1px}
.cal-day--read{background:var(--sage);color:#fff;font-weight:700}
.cal-day--miss{background:rgba(181,77,52,0.14);color:var(--ember);font-weight:700}
.cal-day--makeup{background:none;box-shadow:0 0 0 2px var(--sage) inset;color:var(--ink-text);font-weight:700}
.cal-day--tap{cursor:pointer;border:none;font-family:inherit;padding:0}
.cal-day--today{box-shadow:0 0 0 2px var(--lamp-gold-deep) inset;font-weight:700}
.cal-day--future,.cal-day--off{background:none;color:var(--ink-text-soft)}
.cal-day--off{opacity:.55}
.cal-summary{margin:0;text-align:center;font-size:13px;color:var(--ink-text)}
.cal-legend{display:flex;justify-content:center;gap:14px;font-size:11px;color:var(--ink-text-soft)}
.cal-dot{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:4px;vertical-align:-1px}
.cal-dot--read{background:var(--sage)}
.cal-dot--miss{background:rgba(181,77,52,0.35)}
.mystat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0 14px}
.mystat-tile{background:rgba(var(--fg-rgb),0.06);border-radius:12px;padding:10px 12px}
.mystat-tile span{display:block;font-size:12px;color:var(--ink-text-soft)}.mystat-tile b{display:block;font-size:22px;color:var(--ink-text);margin-top:2px}
.mystat-h{font-size:14px;font-weight:700;color:var(--ink-text);margin:14px 0 8px}
.mystat-row{display:flex;align-items:center;gap:8px;font-size:12px;margin-bottom:6px;color:var(--ink-text-soft)}
.mystat-row .lb{width:96px;flex:none}.mystat-row .bar{flex:1;height:14px;border-radius:4px;background:rgba(var(--fg-rgb),0.08);overflow:hidden}
.mystat-row .bar i{display:block;height:100%;background:rgba(var(--fg-rgb),0.35)}.mystat-row.top .bar i{background:var(--lamp-gold-deep)}
.mystat-row .pv{width:34px;text-align:right;color:var(--ink-text)}
.mystat-wd{display:flex;align-items:flex-end;justify-content:space-between;gap:6px;height:112px}
.mystat-wd div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;height:100%;font-size:11px;color:var(--ink-text-soft)}
.mystat-wd i{display:block;width:100%;max-width:30px;border-radius:4px 4px 0 0;background:rgba(var(--fg-rgb),0.35)}.mystat-wd .low i{background:var(--ember)}
.mystat-note{margin:10px 0 0;font-size:13px;color:var(--ink-text-soft);line-height:1.5}
.cal-dot--makeup{box-shadow:0 0 0 2px var(--sage) inset}
.cal-dot--today{box-shadow:0 0 0 2px var(--lamp-gold-deep) inset}
html{--fs-zoom:1}
.wrap,.modal-card,.photo-viewer-card{zoom:var(--fs-zoom)}
.modal-card{max-height:calc(88vh / var(--fs-zoom))}
.photo-zoom,.photo-viewer-img{max-height:calc(66vh / var(--fs-zoom))}
.fs-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.fs-seg{display:flex;gap:4px}
.fs-opt{padding:7px 10px;border-radius:8px;border:1px solid var(--border-soft);background:#fff;color:var(--ink-text-soft);font-size:12px;cursor:pointer;font-family:inherit;white-space:nowrap}
.fs-opt--on{background:var(--ink-text);color:var(--parchment);border-color:var(--ink-text);font-weight:700}
.cal-swipe{touch-action:pan-y}
.cal-anim-next{animation:calNext .28s ease-out}
.cal-anim-prev{animation:calPrev .28s ease-out}
@keyframes calNext{from{opacity:.2;transform:translateX(36px)}to{opacity:1;transform:none}}
@keyframes calPrev{from{opacity:.2;transform:translateX(-36px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.cal-anim-next,.cal-anim-prev{animation:none}}
.cal-hint{margin:0;text-align:center;font-size:10px;color:var(--ink-text-soft);opacity:.85}
.fam-table{display:grid;gap:2px;align-items:stretch}
.fam-name{position:sticky;top:0;z-index:1;background:var(--parchment);font-size:10px;font-weight:700;text-align:center;line-height:1.15;padding:4px 0;color:var(--ink-text);word-break:break-all}
.fam-corner{position:sticky;top:0;z-index:1;background:var(--parchment)}
.fam-date{font-size:12px;color:var(--ink-text);display:flex;align-items:center;gap:2px;padding-left:2px}
.fam-date em{font-style:normal;font-size:9px;color:var(--ink-text-soft)}
.fam-sat{color:#2B6CB0}.fam-sun{color:var(--ember)}
.fam-cell{height:24px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;background:rgba(0,0,0,0.035);color:var(--ink-text-soft)}
.fam-cell--read{background:var(--sage);color:#fff}
.fam-cell--miss{background:rgba(181,77,52,0.14);color:var(--ember)}
.fam-cell--makeup{background:none;box-shadow:0 0 0 1.5px var(--sage) inset;color:var(--ink-text)}
.fam-cell--off,.fam-cell--future{background:none}
.fam-cell--today{background:none;box-shadow:0 0 0 1.5px var(--lamp-gold-deep) inset}
.fam-me.fam-cell--read{box-shadow:0 0 0 2px var(--lamp-gold-deep) inset}
.fam-name.fam-me{color:var(--lamp-gold-deep)}
.fam-today.fam-date{font-weight:700;color:var(--lamp-gold-deep)}
.fam-total{font-weight:700;border-top:1px solid var(--border-soft);margin-top:2px;padding-top:4px;background:none;color:var(--ink-text)}
.fam-cell.fam-total{border-radius:0;font-size:12px}
.set-profile{display:flex;align-items:center;gap:12px}
.set-profile-info{display:flex;flex-direction:column;gap:6px;min-width:0}
.set-name{margin:0;font-size:15px;font-weight:700;color:var(--ink-text)}
.set-row-btn{width:100%;display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--border-soft);border-radius:10px;padding:11px 14px;font-size:14px;font-weight:600;color:var(--ink-text);cursor:pointer;font-family:inherit}
.pin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;width:100%}
.pin-grid .text-input{padding:10px 8px;font-size:13px;text-align:center}
.primary-btn--sm{padding:10px;font-size:14px}
.profile-divider{width:100%;height:1px;background:var(--border-soft);margin:4px 0}
.profile-section-label{font-size:12px;font-weight:700;color:var(--ink-text-soft);align-self:flex-start;margin:0}
.pwa-installed-note{font-size:13px;font-weight:700;color:var(--lamp-gold-deep);padding:4px 0}
.pwa-note{font-size:13px;color:var(--ink-text-soft);line-height:1.6;margin:0;text-align:left}
.pwa-steps{font-size:13px;color:var(--ink-text-soft);line-height:1.8;text-align:left;background:rgba(255,255,255,0.6);border:1px solid var(--border-soft);border-radius:10px;padding:10px 12px}
.pwa-steps b{color:var(--ink-text)}
.notif-form{display:flex;flex-direction:column;gap:10px;padding:2px 0 4px}
.notif-time{display:flex;gap:8px}
.notif-time .name-select{flex:1;min-width:0}
.notif-time.is-off{opacity:.45}
.notif-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.month-dropdown{margin-bottom:14px;padding:12px 40px 12px 14px;font-size:14px}
.annual-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:18px;margin-top:16px;display:flex;flex-direction:column;gap:10px}
.trend-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:18px;margin-top:16px;display:flex;flex-direction:column;gap:10px}
.trend-chart{display:flex;align-items:flex-end;gap:10px;height:120px;overflow-x:auto;padding-top:14px}
.trend-bar-wrap{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;flex-shrink:0;width:32px}
.trend-bar{width:18px;background:var(--ember);border-radius:4px 4px 0 0;min-height:3px}
.trend-bar-label{font-size:10px;color:var(--ink-text-soft);margin-top:4px;white-space:nowrap}
.trend-bar-value{font-size:10px;color:var(--ink-text);font-weight:700;margin-bottom:2px}
.steps-card{background:var(--parchment);border-radius:18px;padding:10px;box-shadow:0 8px 20px rgba(0,0,0,0.2)}
.steps-image{width:100%;height:auto;display:block;border-radius:12px}
.steps-articles-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:10px;box-shadow:0 8px 20px rgba(0,0,0,0.2)}
.steps-articles-list{display:flex;flex-direction:column;gap:8px}
.steps-article-link{text-align:left;padding:12px 14px;border-radius:10px;border:1.5px solid var(--ink-text);background:transparent;color:var(--ink-text);font-size:14px;font-weight:600;font-family:inherit;cursor:pointer}
.steps-article-link:hover{background:var(--ink-text);color:var(--parchment)}
.feed-seg{display:flex;gap:6px;padding:4px;border-radius:12px;background:rgba(var(--fg-rgb),0.07)}
.feed-seg button{flex:1;position:relative;padding:10px 6px;border:none;border-radius:9px;background:transparent;color:var(--ink-text-soft);font-family:inherit;font-size:15px;font-weight:700;cursor:pointer}
.feed-seg button.on{background:var(--parchment);color:var(--ink-text);box-shadow:0 1px 4px rgba(0,0,0,0.12)}
.feed-seg .seg-badge{display:inline-block;min-width:18px;margin-left:6px;padding:0 5px;border-radius:9px;background:#d93025;color:#fff;font-size:11px;line-height:18px;vertical-align:1px}
.vid-thumb{position:relative;width:96px;height:54px;flex-shrink:0;border-radius:8px;overflow:hidden;background:var(--border-soft)}
.vid-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.vid-thumb .vid-dur{position:absolute;right:3px;bottom:3px;padding:0 4px;border-radius:4px;background:rgba(0,0,0,0.72);color:#fff;font-size:10px;line-height:16px}
.vid-thumb .vid-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.vid-thumb .vid-play i{width:24px;height:24px;border-radius:50%;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center}
.vid-thumb .vid-play i:after{content:"";margin-left:2px;border-left:8px solid #fff;border-top:5px solid transparent;border-bottom:5px solid transparent}
.vid-modal .modal-card{max-width:560px;padding:14px;gap:10px}
.vid-modal video{width:100%;border-radius:10px;background:#000;aspect-ratio:16/9}
.vid-modal video::cue{font-size:15px;line-height:1.35;background:rgba(0,0,0,0.72)}
.vid-modal.vid-max video::cue{font-size:22px}
.vid-tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:6px;align-self:stretch}
.vid-tools button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px;border-radius:10px;border:1px solid rgba(var(--fg-rgb),0.22);background:rgba(var(--fg-rgb),0.05);color:var(--ink-text);font-family:inherit;cursor:pointer}
.vid-tools button b{font-size:15px;line-height:20px}.vid-tools button span{font-size:12px;color:var(--ink-text-soft)}
.vid-tools button.on{background:var(--lamp-gold-deep);border-color:var(--lamp-gold-deep);color:#fff}.vid-tools button.on span{color:#fff}
.vid-save{align-self:stretch;display:flex;flex-direction:column;gap:8px;padding:10px;border-radius:12px;background:rgba(var(--fg-rgb),0.05)}
.vid-save[hidden]{display:none}
.vid-save .vs-row{display:flex;align-items:center;gap:8px}
.vid-save .vs-row p{margin:0;flex:0 0 32px;font-size:13px;font-weight:700;color:var(--ink-text)}
.vid-save .vs-chips{display:flex;flex-wrap:wrap;gap:6px}
.vid-save button{display:inline-flex;align-items:center;gap:4px;min-height:36px;padding:6px 10px;border-radius:18px;border:1px solid rgba(var(--fg-rgb),0.22);background:var(--parchment);color:var(--ink-text);font-family:inherit;font-size:13px;font-weight:700;cursor:pointer}
.vid-save button span{color:var(--ink-text-soft);font-size:11px;font-weight:400}
.vid-save button.rec{border-color:var(--lamp-gold-deep);box-shadow:inset 0 0 0 1px var(--lamp-gold-deep)}
.vid-save .vid-save-note{margin:0;font-size:11px;color:var(--ink-text-soft)}
.vid-tools button:disabled{opacity:.5}
.vid-stage{position:relative;width:100%}
.vid-exit{display:none}
.vid-modal.vid-max{padding:0;background:#000}
.vid-modal.vid-max .modal-card{position:fixed;inset:0;zoom:1;max-width:none;width:100vw;height:100vh;height:100dvh;max-height:none;border-radius:0;padding:0;background:#000;overflow:hidden;display:block}
.vid-modal.vid-max .modal-card>*:not(.vid-stage){display:none}
.vid-modal.vid-max .vid-stage{position:absolute;inset:0}
.vid-modal.vid-max video{width:100%;height:100%;border-radius:0;aspect-ratio:auto;object-fit:contain}
.vid-modal.vid-max .vid-exit{display:flex;position:absolute;top:10px;right:10px;z-index:2;width:44px;height:44px;border-radius:50%;border:none;background:rgba(0,0,0,0.55);color:#fff;font-size:20px;align-items:center;justify-content:center;cursor:pointer}
@media (orientation:portrait){
  .vid-modal.vid-max .vid-stage{inset:auto;top:50%;left:50%;width:100vh;width:100dvh;height:100vw;transform:translate(-50%,-50%) rotate(90deg)}
}
.vid-modal .vid-title{font-size:15px;font-weight:700;line-height:1.4;align-self:stretch;margin:0}
.vid-modal .vid-actions{display:flex;gap:8px;align-self:stretch}
.vid-modal .vid-actions button{flex:1;padding:12px 6px;border-radius:10px;border:1.5px solid var(--ink-text-soft);background:transparent;color:var(--ink-text);font-family:inherit;font-size:14px;font-weight:700;cursor:pointer}
.prep-view{display:flex;flex-direction:column;gap:inherit}
.prep-view .reading-eyebrow{font-size:13px}
.prep-view .reading-link-btn{font-size:16px;padding:14px}
.prep-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:20px 16px;display:flex;flex-direction:column;gap:12px;box-shadow:0 8px 20px rgba(0,0,0,0.2)}
.prep-empty{margin:6px 0;font-size:16px;line-height:1.7;color:var(--ink-text-soft);text-align:center}
.prep-top{display:flex;justify-content:flex-end;margin-top:-4px}
.prep-top .small-btn{font-size:14px;padding:8px 14px}
.prep-title{margin:0;font-family:"Noto Serif KR", serif;font-size:17px;font-weight:700;line-height:1.45}
.prep-note{margin:0;font-size:14px;color:var(--ink-text-soft);background:rgba(var(--gold-rgb),0.12);border-radius:10px;padding:10px 12px;line-height:1.55}
html:is([data-theme="lavender"],[data-theme="sky"],[data-theme="mint"],[data-theme="rose"]) .prep-note{background:rgba(var(--fg-rgb),0.06)}
.prep-list{display:flex;flex-direction:column;gap:10px}
.prep-item{border:1px solid var(--border-soft);border-radius:12px;background:#fff;overflow:hidden}
.prep-head{width:100%;display:flex;align-items:flex-start;gap:8px;padding:14px;border:none;background:transparent;color:var(--ink-text);font-family:inherit;text-align:left;cursor:pointer}
div.prep-head{cursor:default}
.prep-head-main{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.prep-label{font-size:13px;font-weight:700;color:#fff;background:var(--lamp-gold-deep);border-radius:6px;padding:2px 8px;white-space:nowrap}
.prep-q{font-size:17px;font-weight:600;line-height:1.55}
.prep-chev{flex:0 0 auto;color:var(--ink-text-soft);font-size:16px;margin-top:2px}
.prep-body{padding:0 14px 14px;display:flex;flex-direction:column;gap:8px}
.prep-sub{margin:6px 0 0;font-size:14px;font-weight:700;color:var(--ink-text-soft)}
.prep-points{margin:0;padding-left:20px;font-size:16px;line-height:1.65;display:flex;flex-direction:column;gap:8px}
.prep-points li span{margin-right:6px}
.prep-points--apply li::marker{color:var(--sage)}
.prep-src{display:inline-block;vertical-align:1px;margin-top:3px;padding:2px 9px;border-radius:999px;border:1px solid var(--border-soft);background:rgba(var(--gold-rgb),0.12);color:var(--ink-text-soft);font-family:inherit;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap}
.prep-src--plain{cursor:default}
.prep-answer{border-radius:10px;background:rgba(var(--gold-rgb),0.14);padding:12px;font-size:16px;line-height:1.65;font-weight:500}
.prep-groups{display:flex;flex-direction:column;gap:8px;margin-top:2px}
.prep-group{border:1px solid var(--border-soft);border-radius:10px;background:rgba(var(--gold-rgb),0.06)}
.prep-group-q{width:100%;display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin:0;padding:12px;border:none;background:transparent;color:var(--ink-text);font-family:inherit;font-size:16px;font-weight:700;line-height:1.5;text-align:left;cursor:pointer}
p.prep-group-q{cursor:default}
.prep-group .prep-points{padding:0 12px 12px 34px}
.prep-group p.prep-group-q{padding-bottom:6px}
.prep-points--num{list-style:decimal}
.prep-ex{position:relative;border-radius:10px;background:rgba(var(--gold-rgb),0.1);padding:10px 56px 10px 10px}
.prep-ex--easy{background:rgba(107,143,113,0.12)}
.prep-ex p{margin:4px 0 0;font-size:15px;line-height:1.65}
.prep-ex-tag{font-size:11px;font-weight:700;color:var(--ink-text-soft)}
.prep-copy{position:absolute;top:8px;right:8px;min-height:32px;padding:0 10px;border-radius:8px;border:1px solid var(--border-soft);background:#fff;color:var(--ink-text-soft);font-family:inherit;font-size:12px;cursor:pointer}
.prep-basis{margin:2px 0 0;font-size:12px;color:var(--ink-text-soft)}
.prep-hidden-note{margin:0;font-size:13px;font-weight:700;color:#fff;background:var(--ember);border-radius:8px;padding:6px 10px}
.prep-range{margin:0;font-family:"Noto Serif KR", serif;font-size:20px;font-weight:700}
.prep-bible-links{flex-wrap:wrap}
.prep-bible-links .reading-link-btn{min-width:calc(50% - 4px);font-size:15px;padding:14px}
.prep-admin-btns{display:flex;flex-wrap:wrap;gap:6px}
.small-btn--go{background:var(--lamp-gold-deep);border-color:var(--lamp-gold-deep);color:#fff}
.prep-admin-part{margin:8px 0 0;font-size:13px;font-weight:700}
/* 상단: 날짜 칸은 남는 폭만 쓰고, 아이콘이 4개 이상이면 아이콘·날짜를 함께 줄임 */
.wrap--app .topbar{align-items:center;gap:8px}
.wrap--app .topbar > div:first-child{min-width:0;flex:1}
.topbar-date{white-space:nowrap;font-size:clamp(15px, 4.9vw, 19px)}
.topbar-actions--4{gap:5px!important;flex-shrink:0}
.topbar-actions--4 .icon-btn--round{width:38px;height:38px}
.topbar-actions--4 .icon-btn--round svg{width:19px;height:19px}
.topbar--4 .topbar-date{font-size:clamp(14px, 4.2vw, 17px)}
@media (max-width:370px){.topbar-actions--4{gap:4px!important}.topbar-actions--4 .icon-btn--round{width:34px;height:34px}.topbar-actions--4 .icon-btn--round svg{width:17px;height:17px}}
.icon-btn--on{color:var(--lamp-gold);border-color:var(--lamp-gold);background:rgba(var(--gold-rgb),0.16)}
.jw-feed-card{background:var(--parchment);color:var(--ink-text);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:10px;box-shadow:0 8px 20px rgba(0,0,0,0.2)}
.jw-feed-list{display:flex;flex-direction:column;gap:4px}
.jw-feed-item{display:flex;align-items:center;gap:12px;text-align:left;padding:10px 6px;border:none;border-bottom:1px solid var(--border-soft);background:transparent;cursor:pointer;font-family:inherit}
.jw-feed-item:last-child{border-bottom:none}
.jw-feed-thumb{width:52px;height:52px;border-radius:8px;object-fit:cover;flex-shrink:0}
.jw-feed-thumb--empty{display:flex;align-items:center;justify-content:center;background:var(--border-soft);font-size:20px}
.jw-feed-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.jw-feed-title{font-size:14px;color:var(--ink-text);line-height:1.4}
.jw-feed-date{font-size:11px;color:var(--ink-text-soft)}
.pay-checkbox{width:20px;height:20px;flex-shrink:0;accent-color:var(--sage);cursor:pointer}
.pay-checkbox--disabled{opacity:0.3;cursor:not-allowed}
.ledger-value--checkbox{display:flex;align-items:center;justify-content:center}
.toast{position:fixed;bottom:calc(84px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:var(--ink-text);color:var(--parchment);padding:10px 20px;border-radius:999px;font-size:13px;box-shadow:0 8px 20px rgba(0,0,0,0.3);z-index:60}
@media (max-width:360px){.reading-range{font-size:20px}
}
.meditation-links .reading-link-btn{flex:1 1 auto;padding-left:8px;padding-right:8px;white-space:nowrap;min-width:0}

.lamp-tier-toggle{display:block;margin:4px auto 0;background:none;border:none;font:inherit;font-size:11px;color:rgba(var(--fg-rgb),0.7);cursor:pointer;padding:4px 8px;border-radius:8px}
.lamp-tier-toggle:hover{background:rgba(var(--fg-rgb),0.08)}
.lamp-tier-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 8px;margin:8px 0 2px;padding:12px 10px;border-radius:14px;background:rgba(var(--fg-rgb),0.06)}
.tier-item{display:flex;align-items:center;gap:8px;font-size:11px;color:rgba(var(--fg-rgb),0.6);min-width:0}
.tier-item--got{color:rgba(var(--fg-rgb),0.95)}
.tier-item b{font-weight:800}
.tier-txt{line-height:1.3;word-break:keep-all}
.tier-dot.avatar-wrap{width:18px;height:18px;flex:none;margin:4px}
.tier-dot.avatar-wrap::after{font-size:9px!important;top:-9px!important}
.tier-dot-in{position:absolute;inset:0;z-index:1;border-radius:50%;background:#dfe7f1}
.tier-item:not(.tier-item--got) .tier-dot{opacity:.55}
.tier-tag{display:inline-block;margin-top:2px;font-style:normal;font-size:9px;font-weight:800;padding:1px 7px;border-radius:999px;background:color-mix(in srgb,var(--lamp-gold) 28%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--lamp-gold) 55%,transparent);color:inherit;flex:none}
.tier-tag--next{background:rgba(var(--fg-rgb),0.08);box-shadow:inset 0 0 0 1px rgba(var(--fg-rgb),0.18)}
.avatar-wrap--t500::before{opacity:1;inset:-6px;background:conic-gradient(#0b1d4d,#3b5bdb,#cfe3ff,#3b5bdb,#0b1d4d,#ffffff,#0b1d4d);animation:ringSpin 1.4s linear infinite;box-shadow:0 0 14px rgba(80,120,255,.9)}
.avatar-wrap--t730::before{opacity:1;inset:-7px;background:conic-gradient(#fff6c9,#ffd23f,#b8860b,#ffd23f,#fff6c9,#b8860b,#fff6c9);animation:ringSpin 1.3s linear infinite;box-shadow:0 0 16px rgba(255,200,40,.95)}
.avatar-wrap--t1000::before{opacity:1;inset:-7px;background:conic-gradient(#fff,#ffb347,#ff6a00,#fff,#ffb347,#ff6a00,#fff);animation:ringSpin 1.2s linear infinite;box-shadow:0 0 18px rgba(255,150,40,1),0 0 30px rgba(255,220,150,.9)}
.avatar-wrap--t1189::before{opacity:1;inset:-8px;background:conic-gradient(#fff,#ffe29a,#9fe8ff,#d6b8ff,#ffb3c7,#fff,#ffe29a,#9fe8ff,#fff);animation:ringSpin 1s linear infinite;box-shadow:0 0 14px #fff,0 0 28px rgba(255,226,154,1),0 0 40px rgba(160,200,255,.9)}
.avatar-wrap--t500::after,.avatar-wrap--t730::after,.avatar-wrap--t1000::after,.avatar-wrap--t1189::after{position:absolute;z-index:4;top:-14px;left:50%;transform:translateX(-50%);font-size:16px;line-height:1}
.avatar-wrap--t500::after{content:"🌟"}.avatar-wrap--t730::after{content:"👑"}.avatar-wrap--t1000::after{content:"🪔"}.avatar-wrap--t1189::after{content:"📖"}
@media (prefers-reduced-motion:reduce){.avatar-wrap--t500::before,.avatar-wrap--t730::before,.avatar-wrap--t1000::before,.avatar-wrap--t1189::before{animation:none}}
/* 왕관·별·등불 잘 보이게: 장식 크게 + 그림자, 흰 테두리는 색 진하게, 링 두껍게 */
.lamp-slot .avatar-wrap[class*="avatar-wrap--t"]{margin-bottom:6px}
.lamp-slot .avatar-wrap--t200::after,.lamp-slot .avatar-wrap--t365::after,.lamp-slot .avatar-wrap--t500::after,.lamp-slot .avatar-wrap--t730::after,.lamp-slot .avatar-wrap--t1000::after,.lamp-slot .avatar-wrap--t1189::after{font-size:26px;top:-24px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.65)) drop-shadow(0 0 6px rgba(255,255,255,.35))}
.avatar-wrap--t100::before{inset:-6px}
.avatar-wrap--t200::before,.avatar-wrap--t365::before{inset:-7px}
.avatar-wrap--t500::before,.avatar-wrap--t730::before,.avatar-wrap--t1000::before,.avatar-wrap--t1189::before{inset:-8px}
.avatar-wrap--t365::before{background:conic-gradient(#6fd6ff,#ffffff,#ffd24d,#ff9ad5,#6fd6ff,#b58cff,#ffd24d,#6fd6ff)}
.avatar-wrap--t1189::before{background:conic-gradient(#ff6ad5,#ffe29a,#52d8ff,#a77bff,#ff8fb0,#ffd24d,#52d8ff,#ff6ad5)}
.avatar-wrap--t500::before{background:conic-gradient(#0b1d4d,#3b7bff,#9fd0ff,#3b7bff,#0b1d4d,#7fb0ff,#0b1d4d)}
.lamp-row-card{padding-top:30px}
.lamp-row{row-gap:34px}
/* 가족 현황: 폭에 따라 한 줄 인원이 자동으로 늘어남 (휴대폰 4명 → 넓을수록 5·6·7·8명), 남는 줄은 가운데 */
.lamp-row{column-gap:6px;container-type:inline-size;--n:4}
.lamp-row .lamp-slot{width:calc((100% - (var(--n) - 1) * 6px) / var(--n))}
.lamp-row .lamp-name{max-width:100%}
.lamp-row .lamp-slot .avatar-wrap{--av:clamp(44px, calc((100cqw - (var(--n) - 1) * 6px) / var(--n) - 12px), 60px);width:var(--av);height:var(--av)}
.lamp-row .lamp-slot .avatar-wrap .avatar-btn{display:block;width:100%;height:100%;padding:0}
.lamp-row .lamp-slot .avatar-wrap .avatar{width:100%!important;height:100%!important}
@container (min-width:390px){.lamp-row .lamp-slot{--n:5}}
@container (min-width:468px){.lamp-row .lamp-slot{--n:6}}
@container (min-width:546px){.lamp-row .lamp-slot{--n:7}}
@container (min-width:624px){.lamp-row .lamp-slot{--n:8}}

/* 링크 버튼: 탭 버튼처럼 아이콘 + 글자, 테두리 대신 부드러운 바탕색 */
.reading-link-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:12px 14px;border-radius:14px;border:none;background:color-mix(in srgb,var(--ink-text) 7%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink-text) 9%,transparent);color:var(--ink-text);font-weight:700;letter-spacing:-0.01em;transition:transform .12s ease,background-color .15s ease,box-shadow .15s ease;-webkit-tap-highlight-color:transparent}
.reading-link-btn:hover{background:color-mix(in srgb,var(--ink-text) 11%,transparent)}
.reading-link-btn:active{transform:scale(.97);background:color-mix(in srgb,var(--ink-text) 15%,transparent)}
.reading-link-btn .lb-ico{width:18px;height:18px;flex:none;color:var(--lamp-gold-deep)}
.reading-link-btn .lb-ext{font-size:.8em;opacity:.45;margin-left:-2px}
.meditation-links .reading-link-btn{gap:5px}
.meditation-links .reading-link-btn .lb-ico{width:16px;height:16px}
/* 봉사 한마디 — 오늘의 묵상 카드 [봉사] 탭 */
.serve-in-guide{gap:12px}
.serve-lead{margin:0;font-size:13.5px;color:var(--ink-muted,#475C71)}
.serve-in-guide .serve-say{font-size:15.5px;background:#fff;border:1px solid var(--border-soft);border-radius:12px;padding:10px 12px}
.serve-in-guide .serve-verse{font-size:14.5px;background:rgba(var(--gold-rgb),0.08);border-radius:12px;padding:10px 12px}
/* 정산 탭: 한 카드 안 [월별 | 전체 누적] 전환 */
.hist-seg{margin-bottom:14px}
html .history-card .hist-pane>.round-picker,html .history-card .hist-pane>.guide-subs{margin-top:0}
/* 나 탭 합친 카드: 전환 버튼 아래 간격이 이중으로 벌어지지 않게 */
.my-swipe{gap:0}
.my-swipe .mystat-grid{margin-top:0}
