.visually-hidden,.static-diagram{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}.stage{display:none}.chapter{border-top:1px solid var(--line);padding-block:clamp(2rem,8vh,4rem)}.eyebrow{color:var(--muted);font-size:var(--fs-caption);letter-spacing:.08em;text-transform:uppercase;margin-bottom:.5rem}.chapter-title{max-width:22ch}.caption{color:var(--muted);font-size:var(--fs-caption)}.chapter-body{margin-top:1rem}.pill{margin-block:1.5rem}.pill-ring{display:none}.pill-list{margin:0;padding-left:1.25rem}.pill-list li{margin-block:.25rem}.pill-n{color:var(--muted);font-variant-numeric:tabular-nums lining-nums;margin-right:.5rem}.pill-top{font-size:var(--fs-caption)}.stage-visual{visibility:hidden;color:var(--muted);font-size:var(--fs-caption);place-items:center;display:grid;position:absolute;inset:0}.stage[data-phase="0"] [data-visual=buka],.stage[data-phase="1"] [data-visual=scan],.stage[data-phase="2"] [data-visual=otorisasi],.stage[data-phase="3"] [data-visual=ding],.stage[data-phase="4"] [data-visual=setelmen],.stage[data-phase="5"] [data-visual=biaya],.stage[data-phase="6"] [data-visual=jurang]{visibility:visible}.demo-box,.dummy-visual{border:2px dashed var(--accent-hi);background:color-mix(in srgb, var(--accent-tint) 55%, transparent);border-radius:8px;padding:2rem 3rem}.demo-box{transform:translateY(calc(var(--idle,0) * -12px)) rotate(calc(var(--p,0) * -7deg)) scale(calc(1 - var(--p,0) * .45));will-change:transform}@media screen{:where(html[data-tier=penuh],html[data-tier=hemat]) .story{position:relative}:where(html[data-tier=penuh],html[data-tier=hemat]) .stage{z-index:0;height:100vh;display:block;position:sticky;top:0;overflow:hidden}@supports (height:100svh){:where(html[data-tier=penuh],html[data-tier=hemat]) .stage{height:100svh}}:where(html[data-tier=penuh],html[data-tier=hemat]) .chapters{z-index:1;margin-top:calc(65px - 100vh);position:relative}@supports (height:100svh){:where(html[data-tier=penuh],html[data-tier=hemat]) .chapters{margin-top:calc(65px - 100svh)}}:where(html[data-tier=penuh],html[data-tier=hemat]) .chapter{min-height:calc(var(--budget,100) * 1vh);border-top:0;padding-block:0}@supports (height:100svh){:where(html[data-tier=penuh],html[data-tier=hemat]) .chapter{min-height:calc(var(--budget,100) * 1svh)}}}@media screen and (width>=721px){:where(html[data-tier=penuh],html[data-tier=hemat]) .chapter-copy{max-width:36rem;padding-inline:var(--gutter);margin-left:max(0px, calc((100vw - var(--grid-max)) / 2));position:sticky;top:22svh}}@media screen and (width<=720px){:where(html[data-tier=penuh],html[data-tier=hemat]) .chapter{min-height:calc(var(--budget-m,var(--budget,100)) * 1vh)}@supports (height:100svh){:where(html[data-tier=penuh],html[data-tier=hemat]) .chapter{min-height:calc(var(--budget-m,var(--budget,100)) * 1svh)}}:where(html[data-tier=penuh],html[data-tier=hemat]) .chapter-copy{z-index:20;padding:.75rem var(--gutter) 5.5rem;background:linear-gradient(to top, var(--paper) 60%, transparent);visibility:hidden;position:fixed;bottom:0;left:0;right:0}:where(html[data-tier=penuh],html[data-tier=hemat]) .chapter-body{display:none}:where(html[data-tier=penuh],html[data-tier=hemat]) .chapters[data-active="0"] #buka .chapter-copy,:where(html[data-tier=penuh],html[data-tier=hemat]) .chapters[data-active="1"] #scan .chapter-copy,:where(html[data-tier=penuh],html[data-tier=hemat]) .chapters[data-active="2"] #otorisasi .chapter-copy,:where(html[data-tier=penuh],html[data-tier=hemat]) .chapters[data-active="3"] #ding .chapter-copy,:where(html[data-tier=penuh],html[data-tier=hemat]) .chapters[data-active="4"] #setelmen .chapter-copy,:where(html[data-tier=penuh],html[data-tier=hemat]) .chapters[data-active="5"] #biaya .chapter-copy,:where(html[data-tier=penuh],html[data-tier=hemat]) .chapters[data-active="6"] #jurang .chapter-copy{visibility:visible}}@media screen{:where(html[data-tier=penuh],html[data-tier=hemat]) .story .pill{z-index:40;border:1px solid var(--line);background:var(--paper);transition:opacity var(--dur-base) var(--ease-enter), visibility var(--dur-base) var(--ease-enter);border-radius:999px;align-items:center;gap:.6rem;margin:0;padding:.4rem .8rem;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #1e24461f}:where(html[data-tier=penuh],html[data-tier=hemat]) .story .pill[data-visible=false]{visibility:hidden;opacity:0;pointer-events:none}:where(html[data-tier=penuh],html[data-tier=hemat]) .pill-ring{background:conic-gradient(var(--accent) calc(var(--p,0) * 1turn), var(--track) 0);border-radius:50%;flex:none;width:26px;height:26px;display:block;position:relative}:where(html[data-tier=penuh],html[data-tier=hemat]) .pill-ring:after{content:"";background:var(--paper);border-radius:50%;position:absolute;inset:30%}:where(html[data-tier=penuh],html[data-tier=hemat]) .pill-list{gap:.15rem;margin:0;padding:0;list-style:none;display:flex}:where(html[data-tier=penuh],html[data-tier=hemat]) .pill-list a{min-width:44px;min-height:44px;color:var(--muted);font-size:var(--fs-caption);border-radius:999px;justify-content:center;align-items:center;padding:0 .4rem;text-decoration:none;display:flex}:where(html[data-tier=penuh],html[data-tier=hemat]) .pill-list a[aria-current=true]{background:var(--accent-tint);color:var(--accent-ink);font-weight:700}:where(html[data-tier=penuh],html[data-tier=hemat]) .pill-n{margin-right:0}:where(html[data-tier=penuh],html[data-tier=hemat]) .pill-t{display:none}:where(html[data-tier=penuh],html[data-tier=hemat]) .pill-list a[aria-current=true] .pill-t{margin-left:.35rem;display:inline}:where(html[data-tier=penuh],html[data-tier=hemat]) .pill-top{display:none}}@media screen and (width>=721px){:where(html[data-tier=penuh],html[data-tier=hemat]) .story .pill{inset:24px 24px auto auto;transform:none}}@media print{.story .pill,.pill{display:none}.chapter{break-inside:avoid-page}}