:root{--bj-header-height:76px}
body{padding-top:var(--bj-header-height)!important}
body>header{position:fixed!important;top:0;inset-inline:0;z-index:90;height:var(--bj-header-height);box-sizing:border-box;display:flex!important;align-items:center;gap:12px;padding:12px 24px!important;background:#102e42;border-bottom:1px solid #c8d6dd}
body>header .brand{margin-inline-end:auto;font-size:23px;white-space:nowrap}
body>header select{width:auto;min-width:130px;max-width:210px;min-height:44px;padding:8px 12px;color:#173c50;background:white}
.bj-header-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin:0!important;padding:8px 12px!important;border:1px solid #597184!important;border-radius:10px!important;font:500 15px system-ui,sans-serif!important;color:#fff!important;background:#183f54!important;white-space:nowrap!important}
.bj-audio{display:none!important}
.bj-dialog-header{position:sticky;top:-20px;z-index:10;display:flex;align-items:center;gap:8px;padding:12px 0;background:#fff;border-bottom:1px solid #cad8df;margin-bottom:16px}
.bj-dialog-header select{min-width:100px;min-height:44px;max-width:190px;flex:1;padding:7px;border-radius:9px;background:white;color:#173c50}
.bj-dialog-header #bible-close,.bj-dialog-header>button:last-child:not(.bj-header-button){float:none;margin-inline-start:auto;min-width:40px;min-height:44px;padding:5px;font-size:25px}
.bj-preference-dialog{width:calc(100% - 32px);max-width:500px;max-height:85dvh;box-sizing:border-box;padding:20px;border:1px solid #c8d7df;border-radius:18px;color:#173c50;background:#fff}
.bj-settings-body{display:grid;gap:12px}.bj-settings-body select{width:100%;min-height:48px;padding:10px;border-radius:10px;border:1px solid #becfd9}.bj-settings-body label{font-weight:600}.bj-help-text p{text-align:justify;text-align-last:start;line-height:1.9;font-size:17px}
#content{scroll-margin-top:calc(var(--bj-header-height) + 16px)}
@media(max-width:700px){:root{--bj-header-height:64px}body>header{padding:8px 12px!important;gap:7px}body>header .brand{display:none!important}body>header select{min-width:0;width:auto;flex:1;max-width:none}.bj-header-button{font-size:13px!important;padding:8px 9px!important}.bj-dialog-header{gap:5px}.bj-dialog-header select{min-width:90px}.bj-dialog-header .bj-header-button{font-size:12px!important;padding:7px!important}.bj-dialog-header strong{display:none}.bj-preference-dialog{padding:16px}.bj-dialog-header{top:-16px}}
