@property --flip-progress{syntax:"<number>";inherits:false;initial-value:0}.book{perspective:1800px;touch-action:pan-y}:root[data-zoom=on] .book{touch-action:pan-x pan-y}.spread__stack{width:100%;transform-style:preserve-3d;display:grid}.spread__stack>*{grid-area:1/1}.flip__reveal{display:grid}.flip__reveal--single{display:none}.flip__leaf{transform-style:preserve-3d;--lengkung:calc(4 * var(--flip-progress) * (1 - var(--flip-progress)));--sapuan:calc((var(--flip-progress) - .5) * 60%);--sudut:calc(var(--flip-progress) * var(--flip-sign,1) * 180deg);--lipat:calc(var(--flip-progress) * (1 - var(--flip-progress)) * (1 - 2 * var(--flip-progress)) * var(--flip-sign,1) * 200deg);display:grid}.flip__seg{transform-style:preserve-3d;grid-area:1/1;display:grid}.flip__seg--dalam{transform:rotateY(var(--sudut))}.flip__seg--luar{transform:rotateY(var(--sudut)) translateX(var(--ke-lipatan)) rotateY(var(--lipat)) translateX(calc(-1 * var(--ke-lipatan)))}.flip__klip{width:100%;height:100%;display:grid}.flip__seg>.flip__face{backface-visibility:hidden;grid-area:1/1;display:grid}.flip__leaf{--leaf-gap:0px}.book[data-flip-mode=double] .flip__leaf{--leaf-gap:calc(var(--hinge) / 2)}.flip__leaf[data-origin=right]{--flip-sign:1;--ke-lipatan:calc(-50% - var(--leaf-gap))}.flip__leaf[data-origin=right] .flip__seg{transform-origin:calc(100% + var(--leaf-gap)) center}.flip__leaf[data-origin=right] .flip__seg--dalam .flip__klip{clip-path:inset(0 0 0 50%)}.flip__leaf[data-origin=right] .flip__seg--luar .flip__klip{clip-path:inset(0 50% 0 0)}.flip__leaf[data-origin=left]{--flip-sign:-1;--ke-lipatan:calc(50% + var(--leaf-gap))}.flip__leaf[data-origin=left] .flip__seg{transform-origin:calc(0px - var(--leaf-gap)) center}.flip__leaf[data-origin=left] .flip__seg--dalam .flip__klip{clip-path:inset(0 50% 0 0)}.flip__leaf[data-origin=left] .flip__seg--luar .flip__klip{clip-path:inset(0 0 0 50%)}.flip__face--back,.flip__face--paper{transform:rotateY(180deg)}.flip__face--paper{visibility:hidden;background:linear-gradient(to left, color-mix(in srgb, var(--ink) 10%, var(--paper)) 0%, var(--paper) 18%, var(--paper) 100%)}.book[data-flipping=forward] .spread__slot--left,.book[data-flipping=backward] .spread__slot--right{z-index:2}.book[data-flip-mode=single] .flip__reveal{display:none}.book[data-flip-mode=single] .flip__reveal--single{display:grid}.book[data-flip-mode=single] .flip__face--back{visibility:hidden}.book[data-flip-mode=single] .flip__face--paper{visibility:visible}.flip__seg:before,.flip__seg:after{content:"";pointer-events:none;opacity:var(--lengkung);position:absolute;top:0;bottom:0}.flip__seg--luar:after,.flip__seg--dalam:before{display:none}.flip__leaf[data-origin=right] .flip__seg--dalam:after{background:linear-gradient(270deg,#00000057 0%,#00000024 22%,#0000 70%);left:50%;right:0}.flip__leaf[data-origin=right] .flip__seg--luar:before{background:linear-gradient(270deg,#0000004d 0%,#0000 26%);left:0;right:50%}.flip__leaf[data-origin=left] .flip__seg--dalam:after{background:linear-gradient(90deg,#00000057 0%,#00000024 22%,#0000 70%);left:0;right:50%}.flip__leaf[data-origin=left] .flip__seg--luar:before{background:linear-gradient(90deg,#0000004d 0%,#0000 26%);left:50%;right:0}@media (prefers-reduced-motion:reduce){.flip__seg{transform:none}.flip__leaf{opacity:calc(1 - var(--flip-progress));transition:opacity .16s linear!important}.flip__seg:before,.flip__seg:after,.flip__seg>.flip__face--back,.flip__seg>.flip__face--paper{display:none}}
.drawer{inset-inline:0;z-index:50;background:var(--paper);border-top:1px solid var(--hairline);touch-action:pan-y;border-start-start-radius:.875rem;border-start-end-radius:.875rem;flex-direction:column;max-height:60dvh;display:flex;position:fixed;bottom:0;box-shadow:0 -8px 28px #0000002e}.drawer__handle{background:var(--hairline);border-radius:999px;width:2.25rem;height:.25rem;margin:.5rem auto .25rem}.drawer__bar{border-bottom:1px solid var(--hairline);align-items:center;gap:.25rem;padding:.25rem .5rem;display:flex}.drawer__judul{text-align:center;min-width:0;color:var(--green);text-overflow:ellipsis;white-space:nowrap;flex:auto;font-size:.8125rem;font-weight:600;overflow:hidden}.drawer__ayat{font-variant-numeric:tabular-nums}.drawer__kunci{color:var(--muted);font-variant-numeric:tabular-nums;font-weight:400}.drawer__nav,.drawer__tutup{min-width:44px;min-height:44px;color:var(--ink);cursor:pointer;background:0 0;border-radius:.5rem;flex:none;place-items:center;font-size:1.125rem;line-height:1;display:grid}.drawer__nav:disabled{opacity:.3;cursor:default}.drawer__nav:focus-visible,.drawer__tutup:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}.drawer__isi{overscroll-behavior:contain;padding:.75rem 1rem calc(1rem + env(safe-area-inset-bottom,0px));overflow-y:auto}.drawer__arab{color:var(--ink);margin-bottom:.625rem;font-size:1.375rem;line-height:2}.drawer__terjemahan{color:var(--ink);font-size:.9375rem;line-height:1.7}.drawer__sup{vertical-align:super;color:var(--gold);margin-inline-start:.1em;font-size:.625em;line-height:0}.drawer__catatan{border-top:1px solid var(--hairline);color:var(--muted);gap:.375rem;margin-top:.75rem;padding-top:.625rem;font-size:.8125rem;line-height:1.6;list-style:none;display:grid}.drawer__supkecil{color:var(--gold);font-weight:600}.drawer__kosong{color:var(--muted);font-size:.875rem}.drawer__kredit{color:var(--muted);margin-top:.75rem;font-size:.6875rem}.mushaf__word[data-terpilih=true],.mushaf__line[data-terpilih=true] .mushaf__word{background-color:color-mix(in srgb, color-mix(in srgb, var(--gold) 45%, var(--ink)) var(--sorot-emas-alpha,44%), transparent);border-radius:.1875rem}
.audio{align-items:center;gap:.25rem;display:inline-flex}.audio__btn{border:1px solid var(--hairline);min-width:44px;min-height:44px;color:var(--ink);cursor:pointer;background:0 0;border-radius:.5rem;place-items:center;font-size:.8125rem;line-height:1;display:grid}.audio__btn--utama{background:var(--green);color:var(--paper);border-color:var(--green)}.audio__btn:disabled{opacity:.35;cursor:default}.audio__btn:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}.audio__status{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums;max-width:9rem;font-size:.6875rem;overflow:hidden}.audio__qari{opacity:.8}.audio__galat{color:var(--ink)}.mushaf__word[data-dibaca=true]{background-color:color-mix(in srgb, color-mix(in srgb, var(--green) 45%, var(--ink)) var(--sorot-hijau-alpha,35%), transparent);border-radius:.1875rem}.book__audio{inset-inline-start:50%;bottom:calc(.5rem + env(safe-area-inset-bottom,0px));z-index:40;border:1px solid var(--hairline);background:var(--paper);border-radius:999px;align-items:center;gap:.25rem;padding:.25rem .5rem;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 2px 12px #0000001f}.spread:has(.drawer) .book__audio{display:none}