.hizb-marker{display:inline-block;width:24px;height:24px;background-size:contain;background-repeat:no-repeat;background-position:center;vertical-align:middle;margin:0 5px}.hizb-marker.quarter-1{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23d8ac05"><path d="M12 2L2 12l10 10 10-10L12 2zm0 4.83L17.17 12 12 17.17 6.83 12 12 6.83z"/></svg>')}.hizb-marker.quarter-2{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23d8ac05"><path d="M12 2L2 12l10 10 10-10L12 2zm0 4.83L17.17 12 12 17.17 6.83 12 12 6.83z"/><circle cx="12" cy="12" r="2" fill="%23d8ac05"/></svg>')}.hizb-marker.quarter-3{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23d8ac05"><path d="M12 2L2 12l10 10 10-10L12 2zm0 4.83L17.17 12 12 17.17 6.83 12 12 6.83z"/><circle cx="12" cy="8" r="2" fill="%23d8ac05"/><circle cx="12" cy="16" r="2" fill="%23d8ac05"/></svg>')}.hizb-marker.quarter-4{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23d8ac05"><path d="M12 2L2 12l10 10 10-10L12 2zm0 4.83L17.17 12 12 17.17 6.83 12 12 6.83z"/><circle cx="8" cy="12" r="2" fill="%23d8ac05"/><circle cx="16" cy="12" r="2" fill="%23d8ac05"/><circle cx="12" cy="12" r="2" fill="%23d8ac05"/></svg>')}.sajda-marker{display:inline-block;width:24px;height:24px;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%235c4033"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/><path d="M12 6c-3.31 0-6 2.69-6 6h12c0-3.31-2.69-6-6-6z"/></svg>');background-size:contain;background-repeat:no-repeat;background-position:center;vertical-align:middle;margin:0 5px}.marker-tooltip{position:absolute;background-color:#fff;border:1px solid #ddd;border-radius:4px;padding:8px 12px;box-shadow:0 2px 5px rgba(0,0,0,.2);font-size:12px;z-index:1000;max-width:200px;display:none;color:var(--text-color)}.marker-tooltip h4{margin:0 0 5px 0;color:var(--primary-color);font-size:14px}.marker-tooltip p{margin:0;font-size:12px}.hizb-marker:hover .marker-tooltip,.sajda-marker:hover .marker-tooltip{display:block}.verse-container.has-marker{border-left:3px solid var(--secondary-color);background-color:var(--tertiary-color);padding-left:10px;position:relative}.verse-markers{position:absolute;top:5px;right:5px;display:flex;gap:5px}@media (max-width:768px){.verse-markers{position:relative;top:auto;right:auto;margin-top:5px;justify-content:flex-end}}.marker-settings-container{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);display:none;justify-content:center;align-items:center;z-index:9999}.marker-settings-panel{background-color:var(--page-bg-color,#fff);border-radius:8px;box-shadow:0 5px 15px rgba(0,0,0,.3);padding:20px;width:90%;max-width:400px}.marker-settings-panel h3{margin:0 0 15px 0;color:var(--primary-color,#5c4033);font-size:18px;text-align:center;border-bottom:1px solid var(--border-color,#eee);padding-bottom:10px}.settings-group{margin-bottom:20px}.setting-label{display:flex;align-items:center;margin-bottom:10px;cursor:pointer;font-size:14px;color:var(--text-color,#333)}.setting-label input[type=checkbox]{margin-right:10px;width:16px;height:16px;cursor:pointer}.settings-footer{display:flex;justify-content:flex-end;gap:10px;border-top:1px solid var(--border-color,#eee);padding-top:15px}.settings-button{padding:8px 16px;border-radius:4px;border:none;cursor:pointer;font-size:14px;font-weight:500;transition:background-color .2s}.settings-button:not(.secondary){background-color:var(--secondary-color,#d8ac05);color:var(--white-color,#fff)}.settings-button.secondary{background-color:#f0f0f0;color:#333;border:1px solid #ddd}.settings-button:hover{opacity:.9}.marker-legend{position:fixed;bottom:150px;right:20px;background-color:var(--page-bg-color,#fff);border:1px solid var(--border-color,#eee);border-radius:8px;padding:10px;box-shadow:0 2px 5px rgba(0,0,0,.2);z-index:90;max-width:250px;font-size:12px;display:none}.marker-legend h4{margin:0 0 10px 0;color:var(--primary-color,#5c4033);font-size:14px;text-align:center;border-bottom:1px solid var(--border-color,#eee);padding-bottom:5px}.marker-legend-item{display:flex;align-items:center;margin-bottom:8px}.marker-legend-icon{width:20px;height:20px;margin-right:10px;background-size:contain;background-repeat:no-repeat;background-position:center}.marker-legend-text{flex:1;font-size:12px}.marker-legend-close{position:absolute;top:5px;right:5px;cursor:pointer;font-size:16px;color:#999}