*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0;padding:0}:root{--bg:#f7f5f0;--surface:#fff;--border:#ddd8cc;--primary:#4a3728;--accent:#8b5e3c;--accent2:#c9956a;--text:#2c2016;--muted:#8a7a6a;--select:#fdf3e8;--mark:#ffe08a;--radius:8px;--font-size-verse:15px}[data-theme=dark]{--bg:#1a1612;--surface:#242018;--border:#3a342a;--primary:#c9a87a;--accent:#c9956a;--accent2:#e0b080;--text:#e8ddd0;--muted:#8a7a6a;--select:#2e2820;--mark:#5a4a00}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:Malgun Gothic,맑은 고딕,sans-serif;font-size:15px;line-height:1.7;transition:background .2s,color .2s}.app{flex-direction:column;max-width:960px;height:100dvh;margin:0 auto;display:flex}.app-header{background:var(--primary);color:#fff;flex-wrap:wrap;flex-shrink:0;align-items:center;gap:10px;padding:8px 14px;display:flex}.app-title{letter-spacing:.5px;white-space:nowrap;font-size:17px;font-weight:700}.quick-nav{flex:1;max-width:160px;position:relative}.quick-nav input{border-radius:var(--radius);color:#fff;background:#ffffff26;border:1px solid #ffffff4d;width:100%;padding:4px 10px;font-size:13px}.quick-nav input::placeholder{color:#fff9}.quick-nav input:focus{border-color:#ffffffb3;outline:none}.quick-nav.error input{border-color:#ff8080}.quick-error{color:#faa;white-space:nowrap;padding-top:2px;font-size:11px;position:absolute;top:100%;left:0}.header-actions{align-items:center;gap:6px;margin-left:auto;display:flex}.version-select{color:#fff;border-radius:var(--radius);cursor:pointer;background:#ffffff26;border:1px solid #ffffff4d;padding:4px 8px;font-size:13px}.version-select option{color:#fff;background:#4a3728}.icon-btn{cursor:pointer;color:inherit;background:0 0;border:none;border-radius:6px;padding:4px 6px;font-size:16px;line-height:1;transition:background .15s}.icon-btn:hover{background:#ffffff26}.header-icon{color:#fffc}.header-icon.active{color:#fff;background:#ffffff40}.tab-nav{background:var(--surface);border-bottom:2px solid var(--border);flex-shrink:0;display:flex}.tab-btn{color:var(--muted);cursor:pointer;background:0 0;border:none;border-bottom:3px solid #0000;flex:1;margin-bottom:-2px;padding:10px;font-size:14px;transition:all .15s}.tab-btn.active{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}.tab-btn:hover:not(.active){background:var(--bg)}.app-main{flex-direction:column;flex:1;display:flex;overflow:hidden}.tab-content{flex-direction:column;flex:1;display:none;overflow:hidden}.tab-content.active{display:flex}.loading-screen{height:100dvh;color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex}.loading-spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.bible-reader{flex-direction:column;flex:1;display:flex;overflow:hidden}.reader-nav{background:var(--surface);border-bottom:1px solid var(--border);flex-wrap:wrap;flex-shrink:0;align-items:center;gap:8px;padding:8px 12px;display:flex}.reader-nav select{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);cursor:pointer;padding:5px 8px;font-size:14px}.nav-btns{gap:4px;display:flex}.nav-btns button{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);cursor:pointer;color:var(--text);padding:5px 10px;font-size:13px;transition:background .1s}.nav-btns button:hover:not(:disabled){background:var(--border)}.nav-btns button:disabled{opacity:.4;cursor:default}.reader-nav-right{align-items:center;gap:6px;margin-left:auto;display:flex}.copy-btn{background:var(--accent);color:#fff;border-radius:var(--radius);cursor:pointer;border:none;padding:5px 12px;font-size:13px;transition:background .15s}.copy-btn:hover{background:var(--primary)}.chapter-title{color:var(--primary);background:var(--select);border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:8px;padding:7px 16px;font-size:15px;font-weight:600;display:flex}.version-badge{background:var(--accent);color:#fff;border-radius:12px;padding:1px 6px;font-size:11px;font-weight:400}.verses{flex:1;padding:4px 0;overflow-y:auto}.verse-block{border-radius:6px;margin:1px 6px}.verse-block.selected{background:var(--select);outline:1px solid var(--accent2)}.verse{cursor:pointer;border-radius:6px;align-items:flex-start;gap:8px;padding:5px 10px;transition:background .1s;display:flex}.verse:hover{background:var(--select)}.verse-block.selected .verse:hover{background:0 0}.verse-num{min-width:24px;color:var(--accent2);text-align:right;flex-shrink:0;padding-top:3px;font-size:11px;font-weight:700}.verse-text{font-size:var(--font-size-verse);flex:1}.verse-actions{opacity:0;flex-shrink:0;gap:2px;transition:opacity .15s;display:flex}.verse:hover .verse-actions,.verse-block.selected .verse-actions{opacity:1}.action-btn{cursor:pointer;color:var(--muted);background:0 0;border:none;border-radius:4px;padding:2px 4px;font-size:14px;line-height:1;transition:color .15s}.action-btn:hover{color:var(--accent)}.action-btn.bookmarked{color:#f5a623}.action-btn.has-note{color:var(--accent)}.verse-note{color:var(--muted);background:var(--bg);border-left:3px solid var(--accent2);cursor:pointer;border-radius:0 4px 4px 0;margin:0 10px 6px 44px;padding:4px 8px;font-size:12px}.verse-note:hover{color:var(--text)}.note-editor{flex-direction:column;gap:6px;margin:0 10px 8px 44px;display:flex}.note-editor textarea{border:1px solid var(--accent2);border-radius:var(--radius);background:var(--bg);width:100%;color:var(--text);resize:vertical;padding:6px 10px;font-family:inherit;font-size:13px}.note-editor textarea:focus{outline:none}.note-editor-btns{gap:6px;display:flex}.note-editor-btns button{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);cursor:pointer;padding:4px 12px;font-size:12px}.note-editor-btns button:first-child{background:var(--accent);color:#fff;border-color:var(--accent)}.note-editor-btns .delete-note{color:#c0392b;border-color:#c0392b}.empty{color:var(--muted);text-align:center;padding:24px}.search-panel{flex-direction:column;flex:1;display:flex;overflow:hidden}.search-controls{border-bottom:1px solid var(--border);background:var(--surface);flex-direction:column;flex-shrink:0;gap:8px;padding:10px 14px;display:flex}.search-input{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);width:100%;color:var(--text);padding:8px 12px;font-size:15px}.search-input:focus{border-color:var(--accent2);outline:none}.search-options{flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;display:flex}.toggle-label{cursor:pointer;align-items:center;gap:4px;display:flex}.info-tip{background:var(--accent);color:#fff;cursor:default;border-radius:50%;justify-content:center;align-items:center;width:16px;height:16px;font-size:11px;font-weight:700;display:inline-flex;position:relative}.info-tip:after{content:attr(data-tip);color:#fff;pointer-events:none;opacity:0;z-index:10;white-space:pre-wrap;background:#333;border-radius:6px;width:240px;padding:6px 10px;font-size:12px;font-weight:400;line-height:1.5;transition:opacity .15s;position:absolute;bottom:calc(100% + 6px);left:0;transform:none;box-shadow:0 2px 8px #0000004d}.info-tip:hover:after{opacity:1}.search-options select{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);padding:4px 6px;font-size:13px}.search-btn{background:var(--accent);color:#fff;border-radius:var(--radius);cursor:pointer;border:none;padding:5px 16px;font-size:13px}.search-btn:hover:not(:disabled){background:var(--primary)}.search-btn:disabled{opacity:.5;cursor:default}.search-results{flex:1;overflow-y:auto}.result-count{color:var(--muted);border-bottom:1px solid var(--border);padding:8px 16px;font-size:13px}.result-item{cursor:pointer;border-bottom:1px solid var(--bg);gap:10px;padding:8px 16px;transition:background .1s;display:flex}.result-item:hover{background:var(--select)}.result-ref{min-width:80px;color:var(--accent);flex-shrink:0;padding-top:2px;font-size:12px;font-weight:700}.result-text{flex:1;font-size:14px}.no-results{color:var(--muted);text-align:center;padding:24px}mark{background:var(--mark);border-radius:2px}.compare-view{flex-direction:column;flex:1;display:flex;overflow:hidden}.compare-nav{background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;gap:8px;padding:10px 14px;display:flex}.compare-nav select{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);padding:5px 8px;font-size:14px}.compare-title{color:var(--primary);background:var(--select);border-bottom:1px solid var(--border);flex-shrink:0;padding:8px 16px;font-size:15px;font-weight:600}.compare-table-wrap{flex:1;overflow:auto}.compare-table{border-collapse:collapse;width:100%;font-size:14px}.compare-table th{background:var(--primary);color:#fff;text-align:left;z-index:1;padding:8px 12px;font-weight:600;position:sticky;top:0}.compare-table td{border-bottom:1px solid var(--border);vertical-align:top;padding:7px 12px;line-height:1.65}.compare-table tr:hover td{background:var(--select)}.compare-table .verse-col{text-align:center;width:40px;color:var(--accent2);font-size:12px;font-weight:700}.modal-overlay{z-index:100;background:#00000080;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border-radius:12px;flex-direction:column;width:100%;max-width:520px;max-height:90vh;display:flex;box-shadow:0 8px 32px #0000004d}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.modal-header h3{color:var(--primary);font-size:16px}.modal-close{cursor:pointer;color:var(--muted);background:0 0;border:none;padding:0 4px;font-size:18px}.modal-options{border-bottom:1px solid var(--border);flex-direction:column;gap:10px;padding:14px 16px;display:flex}.modal-options label{cursor:pointer;align-items:center;gap:8px;font-size:14px;display:flex}.modal-preview{flex:1;padding:12px 16px;overflow-y:auto}.preview-label{color:var(--muted);margin-bottom:6px;font-size:12px}.preview-text{white-space:pre-wrap;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);padding:10px 12px;font-family:Malgun Gothic,sans-serif;font-size:14px;line-height:1.7}.modal-footer{border-top:1px solid var(--border);justify-content:flex-end;padding:12px 16px;display:flex}.copy-confirm-btn{background:var(--accent);color:#fff;border-radius:var(--radius);cursor:pointer;border:none;padding:8px 20px;font-size:14px}.copy-confirm-btn:hover{background:var(--primary)}.copy-confirm-btn.copied{background:#4caf50}.side-panel-overlay{z-index:90;background:#0006;justify-content:flex-end;display:flex;position:fixed;inset:0}.side-panel{background:var(--surface);flex-direction:column;width:300px;max-width:90vw;height:100%;animation:.2s slideIn;display:flex;box-shadow:-4px 0 20px #0003}@keyframes slideIn{0%{transform:translate(100%)}to{transform:translate(0)}}.side-panel-header{border-bottom:1px solid var(--border);background:var(--primary);color:#fff;justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.side-panel-header h2{font-size:15px}.side-panel-header .modal-close{color:#fffc}.side-panel-body{flex:1;padding:8px 0;overflow-y:auto}.side-item{border-bottom:1px solid var(--border);cursor:pointer;align-items:center;gap:8px;padding:10px 14px;transition:background .1s;display:flex}.side-item:hover{background:var(--select)}.side-item-ref{flex-direction:column;flex:1;gap:2px;display:flex}.side-item-ref strong{color:var(--accent);font-size:13px}.side-item-ref span{color:var(--muted);font-size:12px}.side-item-time{color:var(--muted);margin-left:auto;font-size:12px}.remove-btn{cursor:pointer;color:var(--muted);background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:14px}.remove-btn:hover{color:#c0392b;background:#c0392b1a}.settings-list{flex-direction:column;gap:20px;padding:12px 16px;display:flex}.setting-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.setting-row label{font-size:14px}.setting-row input[type=range]{accent-color:var(--accent);flex:1}.toggle-switch{background:var(--border);cursor:pointer;border:none;border-radius:12px;flex-shrink:0;width:44px;height:24px;transition:background .2s;position:relative}.toggle-switch.on{background:var(--accent)}.toggle-switch span{background:#fff;border-radius:50%;width:18px;height:18px;transition:transform .2s;display:block;position:absolute;top:3px;left:3px}.toggle-switch.on span{transform:translate(20px)}.ad-banner{background:var(--select);border-top:1px solid var(--border);color:var(--text);flex-shrink:0;align-items:center;gap:8px;margin:0;padding:12px 16px;font-size:13px;text-decoration:none;transition:background .15s;display:flex}.ad-banner:hover{background:var(--border)}.ad-label{color:#fff;background:var(--muted);letter-spacing:.5px;border-radius:3px;flex-shrink:0;padding:1px 4px;font-size:10px;font-weight:700}.notes-search-wrap{border-bottom:1px solid var(--border);padding:10px 14px}.notes-search-input{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);width:100%;color:var(--text);padding:7px 10px;font-size:13px}.notes-search-input:focus{border-color:var(--accent2);outline:none}.note-item .side-item-ref{flex-direction:column;gap:4px}.note-preview{color:var(--text);white-space:pre-wrap;word-break:break-all;font-size:12px;line-height:1.5}.color-swatches{gap:8px;display:flex}.color-swatch{cursor:pointer;border:2px solid #0000;border-radius:50%;width:28px;height:28px;transition:transform .15s,border-color .15s}.color-swatch:hover{transform:scale(1.15)}.color-swatch.active{border-color:var(--accent);transform:scale(1.15)}.toast{color:#fff;z-index:300;white-space:nowrap;pointer-events:none;background:#333;border-radius:20px;padding:10px 20px;font-size:14px;animation:.2s toastIn,.3s 1.7s forwards toastOut;position:fixed;bottom:80px;left:50%;transform:translate(-50%)}@keyframes toastIn{0%{opacity:0;transform:translate(-50%)translateY(10px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@keyframes toastOut{0%{opacity:1}to{opacity:0}}.pwa-overlay{z-index:200;background:#00000073;justify-content:center;align-items:flex-end;padding:16px;display:flex;position:fixed;inset:0}.pwa-popup{background:var(--surface);border-radius:16px;align-items:flex-start;gap:16px;width:100%;max-width:420px;padding:20px;animation:.25s slideUp;display:flex;box-shadow:0 8px 32px #0000004d}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.pwa-icon{object-fit:cover;border-radius:12px;flex-shrink:0;width:56px;height:56px}.pwa-body{flex-direction:column;flex:1;gap:6px;display:flex}.pwa-body strong{color:var(--primary);font-size:15px}.pwa-body p{color:var(--muted);font-size:13px;line-height:1.5}.pwa-ios-tip{background:var(--bg);border-radius:8px;padding:8px 10px;color:var(--text)!important;font-size:13px!important}.pwa-actions{gap:8px;margin-top:4px;display:flex}.pwa-btn-install{background:var(--accent);color:#fff;border-radius:var(--radius);cursor:pointer;border:none;padding:7px 18px;font-size:13px}.pwa-btn-install:hover{background:var(--primary)}.pwa-btn-cancel{color:var(--muted);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;background:0 0;margin-top:4px;padding:7px 14px;font-size:13px}.pwa-btn-cancel:hover{background:var(--bg)}.pwa-btn-dismiss-forever{cursor:pointer;color:var(--muted);text-underline-offset:2px;text-align:left;background:0 0;border:none;margin-top:2px;padding:2px 0;font-size:12px;text-decoration:underline}.pwa-btn-dismiss-forever:hover{color:var(--text)}@media (width<=600px){.app{max-width:100%}.search-options{flex-direction:column;align-items:flex-start}.app-title{font-size:15px}}@keyframes hlFade{0%{background:var(--hl-color,#ffe08a)}70%{background:var(--hl-color,#ffe08a)}to{background:0 0}}.verse-block.highlighted{animation:hlFade var(--hl-dur,2s) ease forwards;border-radius:6px}