:root{--primary-blue:#30588c;--text-gray:#555;--border-color:#d1d5db;--bg-light:#fff}body{background-color:var(--bg-light);color:var(--primary-blue);font-family:Poppins,sans-serif}.container{max-width:1200px;margin:0 auto;padding:0 20px}.header{justify-content:space-between;align-items:center;padding:24px 0;display:flex}.logo-text{color:var(--primary-blue);font-size:20px;font-weight:400}.main-content{text-align:center;padding:60px 0}.page-title{margin-bottom:40px;font-size:36px;font-weight:500}.controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;margin-bottom:40px;display:flex}.field-wrapper{justify-content:center;width:100%;max-width:220px;display:flex}.custom-field{border:1px solid var(--border-color);width:100%;height:48px;color:var(--primary-blue);box-sizing:border-box;background-color:#fff;border-radius:6px;outline:none;padding:0 16px;font-family:Poppins,sans-serif;font-size:14px}select.custom-field{cursor:pointer}input.custom-field::placeholder{color:#9ca3af}.custom-select{border:1px solid var(--border-color);width:220px;color:var(--primary-blue);cursor:pointer;background-color:#fff;border-radius:6px;padding:12px 16px}.divider{border:none;border-top:1px solid #e5e7eb;max-width:800px;margin:0 auto 40px}.reading-area{justify-content:center;width:100%;display:flex}.verses-list{text-align:left;flex-direction:column;flex:1;gap:24px;max-width:700px;display:flex}.verse-item{align-items:flex-start;gap:12px;font-size:16px;line-height:1.6;display:flex}.verse-number{font-weight:700}.nav-arrow{z-index:100;color:#fff;border:none;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;transition:all .2s;display:flex;position:fixed;top:50vh;transform:translateY(-50%)}.nav-arrow svg{width:24px;height:24px}.prev-arrow{color:#9ca3af;background-color:#e5e7eb;left:calc(50vw - 480px)}.next-arrow{background-color:var(--primary-blue);right:calc(50vw - 480px);box-shadow:0 4px 6px #0000001a}.next-arrow:hover{background-color:#24446b}.notes-section{border-top:1px solid #e5e7eb;margin-top:80px;margin-bottom:100px;padding-top:20px}.notes-title{margin-bottom:16px;font-size:20px}.note-item{border-radius:4px;padding:8px;font-size:14px;line-height:1.6}.note-number{color:#3b82f6}.areaButtonDownload{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.downloadButton{background:var(--primary-blue);color:#fff;border-radius:8px;justify-content:center;align-items:center;padding:10px 18px;font-size:14px;font-weight:500;text-decoration:none;transition:all .2s;display:inline-flex}.downloadButton:hover{background:#24446b;transform:translateY(-2px)}.downloadButton:active{transform:translateY(0)}@media (max-width:1100px){.prev-arrow{left:20px}.next-arrow{right:20px}}@media (max-width:768px){.header{flex-direction:column;align-items:flex-start;gap:12px}.logo-area{width:100%}.areaButtonDownload{flex-direction:column;gap:10px;width:80%;margin-left:15px;display:flex}.downloadButton{text-align:center;width:100%}.main-content{padding:20px 0}.page-title{margin-bottom:24px;font-size:28px}.controls{flex-direction:column;align-items:center;gap:12px;margin-bottom:30px;padding:0 10px}.field-wrapper{max-width:320px}.custom-select{width:100%;max-width:320px}.nav-arrow{width:40px;height:40px;top:auto;bottom:20px;transform:none}.prev-arrow{left:15px}.next-arrow{right:15px}.verse-item{padding:0 5px;font-size:15px}}.page-title{line-height:1.2}