body{background:#2a2a2a;margin:0;height:100vh;width:100vw;display:flex;flex-direction:column;font-family:Segoe UI,Arial,sans-serif;overflow:hidden;touch-action:none}#toolbar{min-height:50px;background:#111827;color:white;display:flex;justify-content:space-between;align-items:center;padding:6px 12px;gap:8px;z-index:50;flex-wrap:wrap;flex-shrink:0}.btn{background:#334155;color:white;border:1px solid #475569;border-radius:8px;padding:7px 10px;cursor:pointer;font-weight:700}.btn:hover{background:#0f766e}#book-viewport{flex:1;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:#333;touch-action:none}#flipbook{visibility:hidden;transform-origin:center center}.page{background:white;background-size:100% 100%;background-repeat:no-repeat;box-shadow:0 0 20px rgba(0,0,0,.45)}.page.loading{background:#f8fafc;display:flex!important;align-items:center;justify-content:center;color:#64748b;font-weight:800}.page.loading:after{content:"Memuat..."}#hotspotOverlay{position:absolute;inset:0;z-index:220;pointer-events:none;background:transparent!important}.hs-click{position:absolute;background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important;cursor:pointer;pointer-events:auto;touch-action:auto;-webkit-tap-highlight-color:transparent}.hs-click.hs-highlight{background:rgba(20,184,166,.12)!important;border:2px solid rgba(15,118,110,.75)!important;box-shadow:0 0 0 3px rgba(20,184,166,.12)!important;border-radius:8px}.hs-click.hs-highlight:after{content:attr(data-label);position:absolute;left:4px;top:4px;max-width:calc(100% - 8px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:rgba(15,23,42,.82);color:#fff;border-radius:999px;padding:2px 6px;font-size:10px;font-weight:800}.hs-click:active{background:rgba(20,184,166,.06)!important}.nav-overlay{position:absolute;top:0;bottom:0;width:58px;z-index:120;display:flex;align-items:center;justify-content:center;cursor:pointer;pointer-events:auto}.nav-left{left:0}.nav-right{right:0}.nav-icon{font-size:24px;color:rgba(255,255,255,.32);background:rgba(0,0,0,.45);padding:15px 6px;border-radius:8px}.is-zoomed .nav-overlay{display:none}.modal{position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:30000!important;display:none;align-items:center;justify-content:center;padding:16px;pointer-events:auto!important;isolation:isolate}.modal-box{position:relative;z-index:30001!important;background:#fff;border-radius:16px;max-width:820px;width:100%;max-height:90vh;overflow:auto;pointer-events:auto!important;touch-action:auto}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #e5e7eb;font-weight:800;background:#fff;position:sticky;top:0;z-index:2}.modal-body{padding:16px;pointer-events:auto!important}.modal-body *{pointer-events:auto}.modal-open #hotspotOverlay,.modal-open .nav-overlay,.modal-open #book-viewport{pointer-events:none!important}.modal-open #modal,.modal-open #modal *{pointer-events:auto!important}.modal.full{padding:0}.modal.full .modal-box{width:100vw;height:100vh;max-width:none;max-height:none;border-radius:0}.modal.full iframe{width:100%;height:calc(100vh - 56px);border:0}textarea,input,select{width:100%;border:1px solid #cbd5e1;border-radius:12px;padding:10px;font:inherit}textarea{min-height:170px}.savedMark{position:absolute;right:4px;top:4px;background:#16a34a;color:white;border-radius:99px;font-size:10px;padding:2px 5px}.reader-auth-note{margin-top:0;color:#64748b;line-height:1.45}.reader-tabs{display:flex;gap:8px;margin-bottom:12px}.reader-tabs .btn{flex:1;justify-content:center}.reader-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.reader-otp-grid{display:grid;grid-template-columns:1fr 120px;gap:8px;margin-top:8px}.reader-help{color:#64748b;font-size:13px;line-height:1.45}.reader-small{font-size:13px;color:#64748b}.reader-actions{display:flex;gap:8px;flex-wrap:wrap}.reader-actions .btn{flex:1}.auth-primary{background:#0f766e!important;color:#fff!important}.auth-secondary{background:#e2e8f0!important;color:#0f172a!important}.user-chip{max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:#0f172a!important;border-color:#64748b}.account-card{border:1px solid #e5e7eb;border-radius:14px;padding:12px;margin-bottom:12px;background:#f8fafc}.account-card img{max-width:100%;height:auto;border-radius:8px}.account-name{font-size:20px;font-weight:900;color:#0f172a;margin-bottom:4px}.account-meta{color:#64748b;font-size:13px;line-height:1.45}.account-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0}.account-links .btn{text-align:center;justify-content:center}.lkpd-list{display:grid;gap:8px;margin-top:8px}.lkpd-item{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid #e5e7eb;border-radius:12px;padding:10px;background:#fff}.lkpd-item b{color:#0f172a}.lkpd-item small{display:block;color:#64748b;margin-top:3px}.lkpd-item .btn{white-space:nowrap}.account-warn{background:#fef3c7;color:#92400e;border:1px solid #fde68a;border-radius:12px;padding:10px;font-weight:700}@media(max-width:640px){body{height:100dvh}.modal{align-items:flex-end;padding:0}.modal-box{width:100vw;max-width:none;max-height:92dvh;border-radius:18px 18px 0 0}.modal-head{position:sticky;top:0;background:#fff;z-index:2}.modal-body{padding:14px}.reader-grid,.reader-otp-grid{grid-template-columns:1fr}.reader-tabs{position:sticky;top:50px;background:#fff;z-index:1;padding-bottom:8px}.reader-actions{display:grid;grid-template-columns:1fr}.reader-actions .btn,.reader-tabs .btn{width:100%}.account-links{grid-template-columns:1fr}.lkpd-item{align-items:stretch;flex-direction:column}.lkpd-item .btn{width:100%;justify-content:center}.user-chip{max-width:100%;width:100%;justify-content:center}textarea,input,select{font-size:16px}#toolbar{gap:6px;padding:6px}#toolbar>div{width:100%;display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap}.title{display:none}.hide-mobile{display:none}.btn{padding:7px 8px}}

/* Patch 20260613d: show/hide password reader */
.reader-passbox{display:flex;gap:8px;align-items:center}.reader-passbox input{flex:1 1 auto;min-width:0}.reader-showpass{flex:0 0 auto;border:1px solid #cbd5e1;background:#e2e8f0;color:#0f172a;border-radius:10px;padding:10px 12px;font-weight:800;cursor:pointer}.reader-showpass:hover{background:#cbd5e1}