:root{--bg-primary: #faf9f7;--bg-secondary: #ffffff;--bg-tertiary: #f3f1ee;--text-primary: #2c2c2c;--text-secondary: #666666;--text-tertiary: #999999;--accent-primary: #d4a373;--accent-secondary: #8b7355;--border-color: #e5e3df;--shadow: rgba(0, 0, 0, .1);--shadow-md: rgba(0, 0, 0, .15);--shadow-lg: rgba(0, 0, 0, .2);--success: #4caf50;--warning: #ff9800;--error: #f44336}.dark{--bg-primary: #1a1a1a;--bg-secondary: #242424;--bg-tertiary: #2d2d2d;--text-primary: #e8e6e3;--text-secondary: #b8b5b0;--text-tertiary: #888682;--accent-primary: #d4a373;--accent-secondary: #c89968;--border-color: #3a3a3a;--shadow: rgba(0, 0, 0, .3);--shadow-md: rgba(0, 0, 0, .4);--shadow-lg: rgba(0, 0, 0, .5)}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg-primary);color:var(--text-primary);line-height:1.6}.font-small{font-size:14px}.font-medium{font-size:16px}.font-large{font-size:18px}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;background:var(--bg-primary);color:var(--text-primary)}.spinner{border:4px solid var(--border-color);border-top:4px solid var(--accent-primary);border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.app{min-height:100vh;background:var(--bg-primary);color:var(--text-primary);transition:background-color .3s ease,color .3s ease}.app-header{position:sticky;top:0;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);box-shadow:0 2px 8px var(--shadow);z-index:100}.header-content{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;max-width:1400px;margin:0 auto}.header-content h1{font-size:1.8rem;color:var(--accent-primary);cursor:pointer;transition:transform .2s ease}.header-content h1:hover{transform:scale(1.05)}.header-controls{display:flex;align-items:center;gap:1rem}.lang-toggle{display:flex;background:var(--bg-tertiary);border-radius:8px;overflow:hidden}.lang-toggle button{padding:.5rem 1rem;border:none;background:transparent;color:var(--text-secondary);cursor:pointer;transition:all .3s ease;font-weight:500}.lang-toggle button.active{background:var(--accent-primary);color:#fff}.lang-toggle button:hover:not(.active){background:var(--bg-secondary)}.icon-btn{padding:.5rem 1rem;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);border-radius:8px;cursor:pointer;transition:all .3s ease;font-size:1rem}.icon-btn:hover{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary);transform:translateY(-2px)}select{padding:.5rem;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);border-radius:8px;cursor:pointer;font-size:1rem}.search-bar{display:flex;gap:1rem;padding:1rem 2rem;max-width:1400px;margin:0 auto}.search-bar input{flex:1;padding:.75rem 1rem;border:2px solid var(--border-color);background:var(--bg-primary);color:var(--text-primary);border-radius:8px;font-size:1rem;transition:border-color .3s ease}.search-bar input:focus{outline:none;border-color:var(--accent-primary)}.search-bar select{min-width:200px}.search-results{max-width:1400px;margin:0 auto;padding:0 2rem 1rem;max-height:400px;overflow-y:auto}.search-results p{color:var(--text-secondary);margin-bottom:.5rem;font-weight:500}.results-list{display:flex;flex-direction:column;gap:.5rem}.search-result-item{padding:1rem;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;cursor:pointer;transition:all .3s ease}.search-result-item:hover{border-color:var(--accent-primary);transform:translate(4px);box-shadow:0 2px 8px var(--shadow-md)}.result-meta{display:flex;justify-content:space-between;margin-bottom:.5rem;color:var(--text-secondary);font-size:.9rem}.result-text{color:var(--text-primary)}.result-text mark{background:var(--accent-primary);color:#fff;padding:.1rem .3rem;border-radius:3px}.app-main{max-width:1400px;margin:0 auto;padding:2rem;min-height:calc(100vh - 200px)}.chapter-list h2{font-size:2rem;margin-bottom:2rem;color:var(--text-primary)}.chapters-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}.chapter-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;padding:1.5rem;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.chapter-card:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--accent-primary);transform:scaleY(0);transition:transform .3s ease}.chapter-card:hover{transform:translateY(-4px);box-shadow:0 8px 16px var(--shadow-md);border-color:var(--accent-primary)}.chapter-card:hover:before{transform:scaleY(1)}.chapter-number{font-size:2.5rem;font-weight:700;color:var(--accent-primary);opacity:.3;position:absolute;top:10px;right:15px}.chapter-card h3{font-size:1.3rem;margin-bottom:.5rem;color:var(--text-primary);font-family:Georgia,serif}.chapter-meaning{color:var(--text-secondary);font-size:.95rem;font-style:italic;margin-bottom:.5rem}.chapter-verses{color:var(--accent-primary);font-size:.9rem;font-weight:600;margin-bottom:1rem}.chapter-summary{color:var(--text-secondary);font-size:.9rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.progress-bar{margin:1rem 0;height:8px;background:var(--bg-tertiary);border-radius:4px;overflow:hidden;position:relative}.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent-primary),var(--accent-secondary));transition:width .5s ease;border-radius:4px}.progress-bar span{position:absolute;right:8px;top:-20px;font-size:.75rem;color:var(--text-secondary);font-weight:600}.chapter-view{max-width:900px;margin:0 auto}.chapter-header{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;padding:2rem;margin-bottom:2rem}.chapter-header h2{font-size:2rem;margin-bottom:.5rem;color:var(--accent-primary);font-family:Georgia,serif}.chapter-meta{display:flex;justify-content:space-between;align-items:center;margin-top:1rem;color:var(--text-secondary)}.verses-list{display:flex;flex-direction:column;gap:1.5rem}.verse-item{background:var(--bg-secondary);border:1px solid var(--border-color);border-left:4px solid var(--accent-primary);border-radius:8px;padding:1.5rem;transition:all .3s ease}.verse-item.read{opacity:.8;border-left-color:var(--success)}.verse-item:hover{box-shadow:0 4px 12px var(--shadow-md);transform:translate(4px)}.verse-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.verse-number{font-weight:600;color:var(--accent-primary);font-size:1.1rem}.verse-actions{display:flex;gap:.5rem}.verse-actions button{padding:.4rem .8rem;border:1px solid var(--border-color);background:var(--bg-tertiary);color:var(--text-primary);border-radius:6px;cursor:pointer;transition:all .2s ease;font-size:1rem}.verse-actions button:hover{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}.bookmark-btn.active{color:gold}.verse-content{cursor:pointer}.verse-text{font-family:Georgia,serif;font-size:1.1rem;line-height:1.8;color:var(--text-primary);margin-bottom:.5rem;white-space:pre-wrap}.verse-transliteration{font-style:italic;color:var(--text-secondary);font-size:.95rem;margin-bottom:.75rem}.verse-meaning{color:var(--text-primary);line-height:1.7;font-size:1rem}.word-meanings{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border-color)}.expand-btn{background:transparent;border:none;color:var(--accent-primary);cursor:pointer;font-weight:600;font-size:.9rem;display:flex;align-items:center;gap:.5rem;transition:all .2s ease;padding:.5rem 0}.expand-btn:hover{color:var(--accent-secondary)}.word-meanings-content{margin-top:1rem;padding:1rem;background:var(--bg-tertiary);border-radius:6px;color:var(--text-secondary);line-height:1.6;font-size:.95rem}.pagination{display:flex;justify-content:center;align-items:center;gap:1rem;margin-top:2rem;padding:1rem}.pagination button{padding:.75rem 1.5rem;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);border-radius:8px;cursor:pointer;font-weight:600;transition:all .3s ease}.pagination button:hover:not(:disabled){background:var(--accent-primary);color:#fff;border-color:var(--accent-primary);transform:translateY(-2px)}.pagination button:disabled{opacity:.4;cursor:not-allowed}.pagination span{font-weight:600;color:var(--text-secondary)}.bookmarks-view h2{margin-bottom:2rem;color:var(--text-primary)}.empty-state{text-align:center;color:var(--text-secondary);padding:3rem;font-size:1.1rem}.bookmarks-list{display:flex;flex-direction:column;gap:1rem}.bookmark-item{background:var(--bg-secondary);border:1px solid var(--border-color);border-left:4px solid gold;border-radius:8px;padding:1.5rem;cursor:pointer;transition:all .3s ease}.bookmark-item:hover{box-shadow:0 4px 12px var(--shadow-md);transform:translate(4px)}.bookmark-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.remove-bookmark{padding:.3rem .6rem;background:var(--error);color:#fff;border:none;border-radius:4px;cursor:pointer;transition:all .2s ease}.remove-bookmark:hover{background:#d32f2f;transform:scale(1.1)}.bookmark-text{color:var(--text-primary);line-height:1.6}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:var(--bg-secondary);border-radius:16px;max-width:700px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px var(--shadow-lg);animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{display:flex;justify-content:space-between;align-items:flex-start;padding:2rem;border-bottom:1px solid var(--border-color)}.modal-header h3{font-size:1.3rem;color:var(--accent-primary);margin-bottom:.25rem}.modal-header p{color:var(--text-secondary);font-size:.9rem}.close-btn{background:var(--bg-tertiary);border:none;color:var(--text-primary);font-size:1.5rem;width:40px;height:40px;border-radius:50%;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.close-btn:hover{background:var(--error);color:#fff;transform:rotate(90deg)}.modal-body{padding:2rem}.verse-text-large{font-family:Georgia,serif;font-size:1.3rem;line-height:1.8;color:var(--text-primary);margin-bottom:1rem;white-space:pre-wrap}.verse-meaning-large{font-size:1.1rem;line-height:1.7;color:var(--text-primary);margin-top:1rem}.word-meanings-modal{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border-color)}.modal-footer{display:flex;justify-content:space-between;padding:1.5rem 2rem;border-top:1px solid var(--border-color);gap:1rem;flex-wrap:wrap}.modal-actions{display:flex;gap:.5rem}.modal-actions button{padding:.75rem 1.25rem;border:1px solid var(--border-color);background:var(--bg-tertiary);color:var(--text-primary);border-radius:8px;cursor:pointer;font-weight:600;transition:all .3s ease;white-space:nowrap}.modal-actions button:hover{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary);transform:translateY(-2px)}@media (max-width: 768px){.header-content{flex-direction:column;gap:1rem;padding:1rem}.header-content h1{font-size:1.5rem}.header-controls{width:100%;justify-content:space-between;flex-wrap:wrap}.search-bar{flex-direction:column;padding:1rem}.search-bar select{width:100%}.app-main{padding:1rem}.chapters-grid{grid-template-columns:1fr;gap:1rem}.modal-content{margin:1rem;max-height:calc(100vh - 2rem)}.modal-footer{flex-direction:column}.modal-actions{width:100%;justify-content:space-between}.modal-actions button{flex:1;font-size:.9rem;padding:.6rem .8rem}.verse-text-large{font-size:1.1rem}.verse-meaning-large{font-size:1rem}}button:focus,input:focus,select:focus{outline:2px solid var(--accent-primary);outline-offset:2px}html{scroll-behavior:smooth}@media print{.app-header,.verse-actions,.modal-footer,.pagination{display:none}.verse-item{page-break-inside:avoid}}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}