.bible-container{background-color:white;border-radius:12px;padding:24px;box-shadow:0 2px 8px rgba(0,0,0,.05);margin-bottom:24px;position:relative}.bible-navigation{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid #e9ecef}.passage-selector{display:flex;align-items:center;gap:12px}.navigation-info{display:flex;align-items:center;gap:8px;font-weight:500}.verse-count{color:var(--gray);font-size:14px;font-weight:400}.verse{margin-bottom:16px;padding:2px 1px;border-radius:4px;cursor:pointer;transition:all .2s;background-color:#CFCFCF;color:black;width:100%}@media (min-width:640px){.verse{width:200%;margin-left:-50%}}@media (min-width:1024px){.verse{width:220%;margin-left:-60%}}.verse:hover{background-color:#f8f9fa}.verse.selected{background-color:#f0f4ff;border-left:3px solid var(--primary)}.verse-text{line-height:1.6}.verse-number{background-color:#7D7D7D;color:white;border-radius:50%;width:24px;height:24px;display:inline-flex;font-size:12px;font-weight:600;margin-right:8px;flex-shrink:0}.loading-overlay,.verse-number{align-items:center;justify-content:center}.loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(255,255,255,.8);display:flex;border-radius:12px}.loading-spinner{padding:20px;color:var(--primary);font-weight:500}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.notes-scrollable-container{scrollbar-width:thin;scrollbar-color:#888 #f1f1f1;will-change:scroll-position;transform:translateZ(0);backface-visibility:hidden;perspective:1000px}.notes-scrollable-container::-webkit-scrollbar{width:8px}.notes-scrollable-container::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.notes-scrollable-container::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.notes-scrollable-container::-webkit-scrollbar-thumb:hover{background:#555}.notes-grid,.notes-grid>*{contain:layout style paint;will-change:transform}@media (max-width:640px){.notes-scrollable-container{max-height:60vh;overflow-y:auto}}@media (min-width:641px) and (max-width:1024px){.notes-scrollable-container{max-height:70vh;overflow-y:auto}}@media (min-width:1025px){.notes-scrollable-container{max-height:7284px;overflow-y:auto}}.animate-fadeIn{animation:fadeIn .4s cubic-bezier(.4,0,.2,1)}button img{display:inline-block;vertical-align:middle;margin-right:.5rem}.fixed.inset-0.z-50{backdrop-filter:blur(2px)}