#rd-journey{--rj-sky:light-dark(#dce9df,#0d1b2e);--rj-ground:light-dark(#bbc5a0,#354b40);--rj-grass:light-dark(#81976c,#3c5d44);--rj-leaf:light-dark(#627e48,#2d4d3c);--rj-leaf-light:light-dark(#91a367,#4f6d48);--rj-roof:light-dark(#aa7b60,#765c54);--rj-wall:light-dark(#ede6d0,#bfc4b7);--rj-wood:light-dark(#8a785b,#62564c);--rj-path:light-dark(#d9d4ba,#747e70);--rj-water:light-dark(#a0bcb0,#3c625f);--rj-ink:light-dark(#294334,#eff1de);--rj-muted:light-dark(#566950,#c2d0b8);--rj-panel:light-dark(#f6f7ec,#1c302d);--rj-line:light-dark(#c6d1bc,#4f6650);--rj-accent:light-dark(#365f3d,#ccdfb2);--rj-on-accent:light-dark(#fbfbee,#25412e);font:14px/1.6 Inter,ui-sans-serif,system-ui,sans-serif;color:var(--rj-ink)}
#rd-journey *{box-sizing:border-box}#rd-journey [hidden]{display:none!important}#rd-journey button{font:inherit;color:inherit}#rd-journey .rj-window{position:relative;height:740px;overflow:hidden;isolation:isolate;background:var(--rj-sky);border-radius:14px}#rd-journey .rj-landscape{position:absolute;inset:0;z-index:-2;touch-action:pan-y}#rd-journey canvas{display:block;width:100%;height:100%}#rd-journey .rj-soften{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,color-mix(in srgb,var(--rj-panel),transparent 8%),color-mix(in srgb,var(--rj-panel),transparent 35%) 29%,transparent 61%);opacity:1;transition:opacity 400ms}#rd-journey .rj-window[data-view=overview] .rj-soften,#rd-journey .rj-window[data-view=surat] .rj-soften,#rd-journey .rj-window[data-view=warga] .rj-soften,#rd-journey .rj-window[data-view=statistik] .rj-soften,#rd-journey .rj-window[data-view=daftar] .rj-soften{opacity:0}
#rd-journey .rj-nav{height:70px;padding:0 112px 0 28px;display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid color-mix(in srgb,var(--rj-line),transparent 60%);background:color-mix(in srgb,var(--rj-panel),transparent 30%);backdrop-filter:blur(10px);position:relative;z-index:8}#rd-journey .rj-brand{display:flex;align-items:center;gap:9px;font-weight:600;letter-spacing:-.5px;white-space:nowrap;font-size:17px}#rd-journey .rj-brand-mark{background:var(--rj-accent);color:var(--rj-on-accent);border-radius:8px;width:26px;height:26px;display:grid;place-items:center;transform:rotate(-7deg);font-family:Georgia,serif;font-size:19px}#rd-journey .rj-nav-center{font-size:11px;color:var(--rj-muted)}#rd-journey .rj-nav-actions{display:flex;gap:12px;align-items:center}#rd-journey .rj-nav button{border:0;background:transparent;min-height:42px;padding:9px 12px;font-size:12px;border-radius:7px}#rd-journey .rj-nav .rj-register{background:var(--rj-accent);color:var(--rj-on-accent);padding-inline:15px}
#rd-journey .rj-intro{position:absolute;left:36px;top:150px;width:330px;z-index:3}#rd-journey .rj-eyebrow{font-size:11px;letter-spacing:.13em;color:var(--rj-muted);display:block;margin-bottom:17px;font-weight:500}#rd-journey h1{font-size:clamp(36px,4.8vw,52px);line-height:1.07;letter-spacing:-1.7px;margin:0 0 20px;font-family:Georgia,'Times New Roman',serif;font-weight:400;color:var(--rj-ink)}#rd-journey h1 em{font-weight:400;color:var(--rj-accent)}#rd-journey .rj-intro p{font-size:12px;color:var(--rj-muted);max-width:260px;margin:0 0 24px;line-height:1.85}#rd-journey .rj-primary{border:0;display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:46px;padding:11px 17px;background:var(--rj-accent);color:var(--rj-on-accent);font-size:12px;font-weight:500;border-radius:7px;box-shadow:0 6px 15px color-mix(in srgb,var(--rj-ink),transparent 90%)}#rd-journey .rj-primary svg{width:16px;height:16px}#rd-journey .rj-intro small{font-size:11px;color:var(--rj-muted);display:block;margin-top:13px}
#rd-journey .rj-back{position:absolute;top:88px;left:25px;min-height:42px;padding:8px 12px;display:flex;align-items:center;gap:8px;background:var(--rj-panel);color:var(--rj-ink);border:1px solid var(--rj-line);border-radius:7px;z-index:6;font-size:11px}#rd-journey .rj-back svg{width:15px;height:15px}#rd-journey .rj-hotspots{position:absolute;inset:0;pointer-events:none;z-index:4}#rd-journey .rj-place{position:absolute;transform:translate(-50%,-100%);pointer-events:auto;border:1px solid var(--rj-line);border-radius:7px;background:var(--rj-panel);box-shadow:0 4px 12px color-mix(in srgb,var(--rj-ink),transparent 85%);padding:9px 13px;min-height:43px;display:flex;align-items:center;gap:9px;font-size:12px;white-space:nowrap}#rd-journey .rj-place:after{content:'';position:absolute;top:100%;left:50%;width:1px;height:20px;background:var(--rj-accent)}#rd-journey .rj-place svg{width:15px;height:15px}#rd-journey .rj-place:hover{background:var(--rj-accent);color:var(--rj-on-accent)}
#rd-journey .rj-detail{position:absolute;left:28px;top:158px;z-index:5;width:274px;background:var(--rj-panel);padding:23px;border:1px solid var(--rj-line);border-radius:11px;box-shadow:0 15px 40px color-mix(in srgb,var(--rj-ink),transparent 90%)}#rd-journey .rj-detail .rj-eyebrow{font-size:11px;letter-spacing:.08em;margin-bottom:12px}#rd-journey .rj-detail h3{font-size:28px;line-height:1.12;letter-spacing:-.8px;font-family:Georgia,serif;font-weight:400;margin:0 0 14px;color:var(--rj-ink)}#rd-journey .rj-detail p{font-size:12px;color:var(--rj-muted);margin:0;line-height:1.8}#rd-journey .rj-detail-steps{display:grid;gap:8px;margin-top:19px}#rd-journey .rj-step{padding:9px 10px;min-height:42px;background:transparent;border:1px solid var(--rj-line);border-radius:6px;display:flex;gap:9px;align-items:center;text-align:left;font-size:11px}#rd-journey .rj-step>span{font-size:11px;color:var(--rj-muted)}#rd-journey .rj-step[aria-pressed=true]{background:var(--rj-accent);color:var(--rj-on-accent);border-color:var(--rj-accent)}#rd-journey .rj-step[aria-pressed=true]>span{color:inherit}#rd-journey .rj-step-note{border-top:1px solid var(--rj-line);padding-top:13px;margin-top:16px!important;min-height:58px}
#rd-journey .rj-dock{position:absolute;z-index:6;left:50%;bottom:46px;transform:translateX(-50%);display:flex;padding:5px;gap:4px;background:var(--rj-panel);border:1px solid var(--rj-line);border-radius:11px;box-shadow:0 9px 26px color-mix(in srgb,var(--rj-ink),transparent 90%);max-width:calc(100% - 40px)}#rd-journey .rj-dock button{display:flex;align-items:center;gap:8px;min-height:42px;font-size:11px;padding:9px 12px;background:transparent;border:0;border-radius:7px;white-space:nowrap}#rd-journey .rj-dock button[aria-pressed=true]{background:var(--rj-accent);color:var(--rj-on-accent)}#rd-journey .rj-dock svg{width:16px;height:16px}#rd-journey .rj-footer{position:absolute;bottom:15px;left:28px;right:28px;display:flex;justify-content:space-between;gap:16px;color:var(--rj-muted);font-size:11px;z-index:3}#rd-journey .rj-footer>span{background:var(--rj-panel);padding:3px 7px;border-radius:4px;width:fit-content}#rd-journey .rj-status:empty{display:none}#rd-journey .rj-status{background:var(--rj-panel);padding:6px 9px;border-radius:6px;position:absolute;top:93px;left:50%;transform:translateX(-50%);color:var(--rj-muted);font-size:11px;max-width:310px;z-index:2}#rd-journey .rj-error{position:absolute;left:30px;right:30px;bottom:140px;background:var(--rj-panel);padding:15px;border-radius:8px;z-index:9;font-size:12px}
@media(max-width:700px){#rd-journey .rj-window{height:830px;border-radius:11px}#rd-journey .rj-nav{height:66px;padding:0 95px 0 16px;gap:7px}#rd-journey .rj-brand{font-size:14px;gap:6px}#rd-journey .rj-brand-mark{width:23px;height:23px;font-size:17px}#rd-journey .rj-nav-center{display:none}#rd-journey .rj-nav-actions{gap:1px}#rd-journey .rj-nav button{font-size:11px;padding:8px 9px;min-height:44px}#rd-journey .rj-nav .rj-register{display:none}#rd-journey .rj-intro{top:104px;left:22px;width:calc(100% - 44px)}#rd-journey h1{font-size:clamp(35px,10.3vw,41px);max-width:330px;line-height:1.05;margin-bottom:14px}#rd-journey .rj-eyebrow{font-size:11px;margin-bottom:12px}#rd-journey .rj-intro p{font-size:12px;max-width:260px;margin-bottom:18px}#rd-journey .rj-intro small{margin-top:10px}#rd-journey .rj-back{top:78px;left:15px;min-height:44px}#rd-journey .rj-detail{left:16px;right:16px;top:auto;bottom:136px;width:auto;padding:17px}#rd-journey .rj-detail h3{font-size:25px;margin-bottom:8px}#rd-journey .rj-detail .rj-eyebrow{margin-bottom:6px}#rd-journey .rj-detail-steps{grid-template-columns:repeat(3,1fr);gap:5px;margin-top:13px}#rd-journey .rj-step{display:block;font-size:11px;padding:8px;line-height:1.4;min-height:57px}#rd-journey .rj-step>span{display:block;margin-bottom:3px}#rd-journey .rj-step-note{font-size:11px!important;margin-top:11px!important;padding-top:10px;min-height:0}#rd-journey .rj-dock{bottom:63px;width:calc(100% - 30px);max-width:none;gap:2px;justify-content:space-between}#rd-journey .rj-dock button{flex:1;flex-direction:column;gap:3px;padding:5px 4px;font-size:11px;min-height:52px}#rd-journey .rj-place{font-size:11px;padding:9px 10px;min-height:44px;gap:6px}#rd-journey .rj-footer{left:18px;right:18px;bottom:15px;flex-direction:column;gap:2px;font-size:11px}#rd-journey .rj-footer>span{background:var(--rj-panel);padding:3px 7px;border-radius:4px;width:fit-content}#rd-journey .rj-status:empty{display:none}#rd-journey .rj-status{background:var(--rj-panel);padding:6px 9px;border-radius:6px;top:auto;transform:none;left:20px;bottom:148px;max-width:190px}#rd-journey .rj-soften{background:linear-gradient(180deg,var(--rj-panel),color-mix(in srgb,var(--rj-panel),transparent 20%) 33%,transparent 64%)} }
@media(prefers-reduced-motion:reduce){#rd-journey *{transition:none!important;animation:none!important}}

#rd-journey .rj-nav .rj-mode{display:flex;align-items:center;gap:7px;background:var(--rj-panel);border:1px solid var(--rj-line);padding:8px 10px;min-height:42px}#rd-journey .rj-mode span{display:flex;align-items:center}#rd-journey .rj-mode svg{width:18px;height:18px}#rd-journey .rj-mode-label{font-size:11px}#rd-journey .rj-intro-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}#rd-journey .rj-explore{border:0;background:transparent;min-height:46px;padding:10px 6px;display:flex;align-items:center;gap:7px;font-size:12px}#rd-journey .rj-explore svg{width:14px;height:14px}
@media(max-width:900px){#rd-journey .rj-nav-center{display:none}}
@media(max-width:700px){#rd-journey .rj-nav .rj-mode{position:absolute;top:80px;right:16px;width:44px;height:44px;justify-content:center;padding:8px;z-index:8}#rd-journey .rj-mode .rj-mode-label{display:none}#rd-journey .rj-primary{gap:14px;padding:11px 14px}#rd-journey .rj-explore{font-size:11px;gap:5px}#rd-journey .rj-intro-actions{gap:9px}}

#rd-journey .rj-detail{width:292px;padding:22px}#rd-journey .rj-detail h3{font-size:27px}#rd-journey .rj-detail-steps{display:flex;gap:5px;border-top:1px solid var(--rj-line);padding-top:16px}#rd-journey .rj-step{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;flex:1;gap:7px;padding:9px 5px;min-height:66px;font-size:11px;line-height:1.35}#rd-journey .rj-step svg{width:19px;height:19px}#rd-journey .rj-step-note{display:none}#rd-journey .rj-story-navigation{display:flex;justify-content:space-between;gap:8px;margin-top:16px}#rd-journey .rj-story-navigation button{display:flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:6px;min-height:44px;padding:7px 9px;font-size:11px;background:transparent}#rd-journey .rj-story-navigation button svg{width:14px;height:14px}#rd-journey .rj-story-navigation .rj-next{background:var(--rj-accent);color:var(--rj-on-accent)}#rd-journey .rj-previous:disabled{opacity:.35}#rd-journey .rj-stage-tags{position:absolute;inset:0;pointer-events:none;z-index:4}#rd-journey .rj-story-tag{position:absolute;transform:translate(-50%,-100%);display:flex;align-items:center;min-height:40px;width:max-content;max-width:200px;pointer-events:auto;border:1px solid var(--rj-line);border-radius:7px;background:var(--rj-panel);box-shadow:0 5px 20px color-mix(in srgb,var(--rj-ink),transparent 88%);padding:8px 12px;font-size:11px}#rd-journey .rj-story-tag:after{content:'';position:absolute;top:100%;left:50%;height:15px;width:1px;background:var(--rj-accent)}
@media(max-width:700px){#rd-journey .rj-detail{width:auto;padding:15px}#rd-journey .rj-detail h3{font-size:23px}#rd-journey .rj-detail p{font-size:11px;line-height:1.7}#rd-journey .rj-detail-steps{gap:5px;margin-top:13px;padding-top:12px}#rd-journey .rj-step{min-height:56px;padding:7px 4px}#rd-journey .rj-story-navigation{margin-top:10px}#rd-journey .rj-story-tag{min-height:44px;padding:8px 10px}}

body[data-page=landing]{margin:0;padding:0}body[data-page=landing]>.public{max-width:none;margin:0;padding:0}#rd-journey .rj-window{min-height:740px;height:100svh;border-radius:0}#rd-journey .rj-nav{padding-right:28px}#rd-journey button{cursor:pointer}#rd-journey button:disabled{cursor:default;opacity:.6}#rd-journey svg{flex-shrink:0} @media(max-width:700px){#rd-journey .rj-nav{padding-right:16px}#rd-journey .rj-window{min-height:830px}}
@media(prefers-reduced-motion:no-preference){
 @view-transition{navigation:auto}
 /* PR-B UAT (P3): cross-fade dipangkas — 420ms membuat halaman
    lama terlihat menembus dan judul halaman baru pucat sesaat. */
 ::view-transition-old(root){animation-duration:160ms;animation-timing-function:ease-out}
 ::view-transition-new(root){animation-duration:160ms;animation-timing-function:ease-in}
}

/* Koreksi halaman depan (kelas baru berawalan rjx-; tidak ada aturan lama yang diubah): pintu masuk pemilik di bilah navigasi, panel pencarian alamat situs desa, dan baris harga langganan di kaki perjalanan. */
#rd-journey .rjx-owner{display:inline-flex;align-items:center;min-height:42px;padding:9px 12px;font-size:12px;border-radius:7px;border:1px solid var(--rj-line);background:var(--rj-panel);color:var(--rj-ink);text-decoration:none;white-space:nowrap}
#rd-journey .rjx-owner:hover{background:var(--rj-accent);color:var(--rj-on-accent);border-color:var(--rj-accent)}
#rd-journey .rjx-find{position:absolute;left:28px;top:158px;z-index:10;width:344px;max-width:calc(100% - 56px);background:var(--rj-panel);padding:23px;border:1px solid var(--rj-line);border-radius:11px;box-shadow:0 15px 40px color-mix(in srgb,var(--rj-ink),transparent 90%);opacity:0;transform:translateY(8px);transition:opacity 180ms ease,transform 180ms ease}
#rd-journey .rjx-find.rjx-on{opacity:1;transform:none}
#rd-journey .rjx-find .rj-eyebrow{margin-bottom:10px}
#rd-journey .rjx-find h2{font-family:Georgia,serif;font-size:24px;font-weight:400;line-height:1.15;letter-spacing:-.8px;margin:0 0 10px;color:var(--rj-ink)}
#rd-journey .rjx-find-close{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:38px;height:38px;min-height:38px;padding:0;background:transparent;border:0;border-radius:7px;color:var(--rj-muted)}
#rd-journey .rjx-find-close:hover{background:color-mix(in srgb,var(--rj-line),transparent 55%);color:var(--rj-ink)}
#rd-journey .rjx-find-close svg{width:17px;height:17px}
#rd-journey .rjx-find-lede{font-size:12px;color:var(--rj-muted);margin:0 0 16px;line-height:1.8}
#rd-journey .rjx-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#rd-journey .rjx-find-form{display:flex;gap:8px}
#rd-journey .rjx-find-input{flex:1;min-width:0;min-height:44px;padding:10px 12px;font:inherit;font-size:12px;color:var(--rj-ink);background:transparent;border:1px solid var(--rj-line);border-radius:7px}
#rd-journey .rjx-find-input:focus{outline:2px solid var(--rj-accent);outline-offset:1px}
#rd-journey .rjx-find-go{min-height:44px;padding:10px 15px;background:var(--rj-accent);color:var(--rj-on-accent);border:0;border-radius:7px;font-size:12px;font-weight:500}
#rd-journey .rjx-find-results{display:grid;gap:8px;margin-top:14px;max-height:288px;overflow:auto}
#rd-journey .rjx-find-results:empty{margin-top:0}
#rd-journey .rjx-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 12px;border:1px solid var(--rj-line);border-radius:8px;animation:rjx-in 220ms ease both}
#rd-journey .rjx-row-name{font-size:12px;font-weight:600}
#rd-journey .rjx-row-region,#rd-journey .rjx-row-host{font-size:11px;color:var(--rj-muted)}
#rd-journey .rjx-row-host{color:var(--rj-accent)}
#rd-journey .rjx-row-actions{display:flex;gap:6px;flex-shrink:0}
#rd-journey .rjx-row-actions a{display:inline-flex;align-items:center;min-height:38px;padding:7px 10px;font-size:11px;border-radius:6px;text-decoration:none;border:1px solid var(--rj-line);color:var(--rj-ink);white-space:nowrap}
#rd-journey .rjx-row-actions a.rjx-admin{background:var(--rj-accent);color:var(--rj-on-accent);border-color:var(--rj-accent)}
#rd-journey .rjx-find-status{font-size:11px;color:var(--rj-muted);margin:0}
#rd-journey .rjx-find-none{margin-top:14px;border-top:1px solid var(--rj-line);padding-top:13px;font-size:12px;line-height:1.8;color:var(--rj-muted)}
#rd-journey .rjx-find-none p{margin:0 0 8px}
#rd-journey .rjx-find-none strong{color:var(--rj-ink)}
#rd-journey .rjx-find-register{display:inline-flex;align-items:center;min-height:44px;padding:10px 15px;background:var(--rj-accent);color:var(--rj-on-accent);border-radius:7px;font-size:12px;font-weight:500;text-decoration:none}
#rd-journey .rjx-find-alt{font-size:11px;color:var(--rj-muted);margin:14px 0 0}
#rd-journey .rjx-find-alt a{color:inherit;text-decoration:underline}
#rd-journey .rjx-price a{color:inherit;text-decoration:underline}
@keyframes rjx-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(max-width:700px){#rd-journey .rjx-owner{font-size:11px;padding:8px 9px;min-height:44px}#rd-journey .rjx-find{left:16px;right:16px;top:auto;bottom:136px;width:auto;max-width:none;max-height:calc(100% - 230px);overflow:auto;padding:17px}#rd-journey .rjx-find h2{font-size:22px}}
@media(prefers-reduced-motion:reduce){#rd-journey .rjx-find{transition:none}#rd-journey .rjx-row{animation:none}}

/* PR-A gerak (kelas baru berawalan rjx-; tidak ada aturan lama yang diubah): baris kontak pada kaki perjalanan — fakta yang sama dengan kaki halaman masuk/daftar — dan label melayang untuk sorot bangunan pada lapisan gerak 3D. */
#rd-journey .rjx-contact{position:absolute;left:0;bottom:calc(100% + 8px);white-space:nowrap}
#rd-journey .rjx-contact a{color:inherit;text-decoration:underline}
#rd-journey .rjx-hover-label{position:absolute;z-index:7;transform:translate(-50%,-100%);pointer-events:none;background:var(--rj-panel);border:1px solid var(--rj-line);border-radius:7px;box-shadow:0 5px 20px color-mix(in srgb,var(--rj-ink),transparent 88%);padding:6px 10px;font-size:11px;white-space:nowrap}
@media(max-width:700px){#rd-journey .rjx-contact{white-space:normal;max-width:calc(100vw - 36px)}}

/* Amendemen PR-A (kelas rjx-; aturan lama tidak diubah): panel pencarian menjadi modal yang bersih — latar diredupkan di belakang kartu — dan semua tombol pada alur masuk berbentuk tombol yang jelas, termasuk "Cari Situs Desa" di bilah navigasi yang sebelumnya teks polos. */
#rd-journey .rj-nav .rjx-ghost{border:1px solid var(--rj-line);background:var(--rj-panel);color:var(--rj-ink)}
#rd-journey .rj-nav .rjx-ghost:hover{background:var(--rj-accent);color:var(--rj-on-accent);border-color:var(--rj-accent)}
#rd-journey .rjx-backdrop{position:absolute;inset:0;z-index:9;background:rgba(8,18,14,.5);opacity:0;transition:opacity 180ms ease}
#rd-journey .rjx-backdrop.rjx-on{opacity:1}
#rd-journey .rjx-find-go{border:1px solid var(--rj-accent);font-weight:600;box-shadow:0 6px 15px color-mix(in srgb,var(--rj-ink),transparent 88%)}
@media(prefers-reduced-motion:reduce){#rd-journey .rjx-backdrop{transition:none}}

/* PR-B UAT (kelas rjx-; aturan lama tidak diubah): tombol tutup pada panel rincian bab (A4), dan baris hasil pencarian yang membungkus — kedua tombol hasil selalu terlihat penuh, tidak ada lagi gulir menyamping (A2 + C5). */
#rd-journey .rjx-detail-close{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:38px;height:38px;min-height:38px;padding:0;background:transparent;border:0;border-radius:7px;color:var(--rj-muted);z-index:2}
#rd-journey .rjx-detail-close:hover{background:color-mix(in srgb,var(--rj-line),transparent 55%);color:var(--rj-ink)}
#rd-journey .rjx-detail-close svg{width:17px;height:17px}
#rd-journey .rj-detail h3{padding-right:34px}
#rd-journey .rjx-find-results{overflow-x:hidden}
#rd-journey .rjx-row{flex-wrap:wrap}
#rd-journey .rjx-row-main{min-width:0;flex:1 1 132px}
#rd-journey .rjx-row-region{overflow-wrap:break-word}
#rd-journey .rjx-row-host{overflow-wrap:anywhere}
#rd-journey .rjx-row-actions{flex-wrap:wrap;margin-left:auto}

/* Konsep 2 — Panel Panggung (kelas rjx-; aturan lama tidak diubah): panel rincian bab melebar menjadi PANGGUNG di atas adegan yang diredupkan. Satu ketukan = satu elemen pahlawan (judul serif besar, angka, atau harga) + satu kalimat + ubin langkah besar. Bingkai campuran sesuai makna bab: PAPAN INFORMASI desa (rangka kayu, atap kecil, permukaan hijau tua, aksen krem) untuk bab warga — Tentang dan Statistik; LAYAR MONITOR ruang kerja (bezel gelap, titik kamera, LED menyala, kaki penyangga) untuk bab operator — Surat, Penduduk, Daftar, dan Harga. */
#rd-journey .rjx-stage-backdrop{position:absolute;inset:0;z-index:4;background:rgba(6,14,10,.55);opacity:0;transition:opacity 260ms ease;pointer-events:none}
#rd-journey .rjx-stage-backdrop.rjx-on{opacity:1}
#rd-journey .rjx-stage{left:28px;top:128px;width:min(648px,calc(100% - 56px));padding:32px 36px 28px;border-radius:14px}
#rd-journey .rjx-stage:not([hidden]){animation:rjx-stage-in 300ms ease both}
@keyframes rjx-stage-in{from{opacity:0;transform:scale(.965)}to{opacity:1;transform:scale(1)}}
#rd-journey .rjx-stage .rj-eyebrow{font-size:12px;letter-spacing:.16em;margin-bottom:14px;font-weight:600}
#rd-journey .rjx-stage h3{font-size:clamp(34px,4.4vw,46px);line-height:1.08;margin-bottom:12px}
#rd-journey .rjx-stage .rj-description{font-size:16.5px;line-height:1.65}
#rd-journey .rjx-hero:not([hidden]){display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:0 0 8px}
#rd-journey .rjx-hero-value{font-family:Georgia,'Times New Roman',serif;font-size:94px;line-height:.95;letter-spacing:-2px}
#rd-journey .rjx-hero-unit{font-family:Georgia,'Times New Roman',serif;font-size:26px}
#rd-journey .rjx-stage .rj-detail-steps{flex-wrap:wrap;gap:8px;margin-top:24px;padding-top:20px}
#rd-journey .rjx-stage .rj-step{flex:1 1 104px;min-height:74px;padding:11px 8px;border-width:1.5px;border-radius:10px;font-size:13px;line-height:1.35}
#rd-journey .rjx-stage .rj-step svg{width:21px;height:21px}
#rd-journey .rjx-stage .rj-story-navigation{margin-top:24px;align-items:center}
#rd-journey .rjx-stage .rj-story-navigation button{font-size:14px;min-height:52px;padding:11px 14px;border-radius:9px}
#rd-journey .rjx-stage .rj-story-navigation .rj-next{font-size:15.5px;font-weight:600;padding:13px 24px}
#rd-journey .rjx-stage-cta:not([hidden]){display:flex;align-items:center;justify-content:center;margin-top:14px;min-height:54px;border-radius:10px;font-size:15.5px;font-weight:700;text-decoration:none}
/* Bingkai papan informasi desa: permukaan papan hijau tua di kedua mode, seperti papan sungguhan. */
#rd-journey .rjx-stage.rjx-skin-board{background:linear-gradient(160deg,#1e4630,#132e1f);border:10px solid #8a5a33;color:#f2f0df;box-shadow:0 26px 60px rgba(10,24,14,.45)}
#rd-journey .rjx-stage.rjx-skin-board::before{content:'';position:absolute;top:-24px;left:-6px;right:-6px;height:20px;background:linear-gradient(#cf8250,#b96f3f);border-radius:9px 9px 3px 3px;box-shadow:0 3px 8px rgba(10,24,14,.3)}
#rd-journey .rjx-stage.rjx-skin-board .rj-eyebrow{color:#d9c98a}
#rd-journey .rjx-stage.rjx-skin-board h3{color:#f5f2df}
#rd-journey .rjx-stage.rjx-skin-board .rj-description{color:#e3e6cf}
#rd-journey .rjx-stage.rjx-skin-board .rjx-hero-value{color:#f5f2df}
#rd-journey .rjx-stage.rjx-skin-board .rjx-hero-unit{color:#d9c98a}
#rd-journey .rjx-stage.rjx-skin-board .rj-detail-steps{border-top-color:#476b4a}
#rd-journey .rjx-stage.rjx-skin-board .rj-step{border-color:#6c8a5a;color:#dfe5c8}
#rd-journey .rjx-stage.rjx-skin-board .rj-step[aria-pressed=true]{background:#d9c98a;color:#3a2c10;border-color:#d9c98a}
#rd-journey .rjx-stage.rjx-skin-board .rj-story-navigation .rj-next{background:#d9c98a;color:#3a2c10}
#rd-journey .rjx-stage.rjx-skin-board .rjx-detail-close{color:#d9c98a}
#rd-journey .rjx-stage.rjx-skin-board .rjx-stage-cta{background:#d9c98a;color:#3a2c10}
#rd-journey .rjx-skin-board .rjx-ornament{position:absolute;top:100%;margin-top:8px;left:0;right:0;height:46px;background:linear-gradient(90deg,transparent 48px,#7c4f2a 48px,#7c4f2a 68px,transparent 68px,transparent calc(100% - 68px),#7c4f2a calc(100% - 68px),#7c4f2a calc(100% - 48px),transparent calc(100% - 48px))}
/* Bingkai layar monitor: bezel gelap dan layar gelap di kedua mode — benda yang kita kendalikan. */
#rd-journey .rjx-stage.rjx-skin-monitor{background:linear-gradient(150deg,#1b3e25,#122b18);border:14px solid #20242a;border-bottom-width:30px;border-radius:18px;color:#eef3e4;box-shadow:0 26px 60px rgba(6,12,8,.5)}
#rd-journey .rjx-stage.rjx-skin-monitor::before{content:'';position:absolute;top:-11px;left:50%;transform:translateX(-50%);width:8px;height:8px;border-radius:50%;background:#454d57}
#rd-journey .rjx-stage.rjx-skin-monitor::after{content:'';position:absolute;bottom:-22px;right:20px;width:8px;height:8px;border-radius:50%;background:#7dd87d;box-shadow:0 0 7px #7dd87d}
#rd-journey .rjx-stage.rjx-skin-monitor .rj-eyebrow{color:#b9d69f}
#rd-journey .rjx-stage.rjx-skin-monitor h3{color:#f2f7e9}
#rd-journey .rjx-stage.rjx-skin-monitor .rj-description{color:#d7e5cb}
#rd-journey .rjx-stage.rjx-skin-monitor .rjx-hero-value{color:#eaf5d8}
#rd-journey .rjx-stage.rjx-skin-monitor .rjx-hero-unit{color:#b9d69f}
#rd-journey .rjx-stage.rjx-skin-monitor .rj-detail-steps{border-top-color:#3d6a45}
#rd-journey .rjx-stage.rjx-skin-monitor .rj-step{border-color:#3d6a45;color:#cfe0c6}
#rd-journey .rjx-stage.rjx-skin-monitor .rj-step[aria-pressed=true]{background:#cfe8b8;color:#173d22;border-color:#cfe8b8}
#rd-journey .rjx-stage.rjx-skin-monitor .rj-story-navigation .rj-next{background:#cfe8b8;color:#173d22}
#rd-journey .rjx-stage.rjx-skin-monitor .rjx-detail-close{color:#b9d69f}
#rd-journey .rjx-stage.rjx-skin-monitor .rjx-stage-cta{background:#cfe8b8;color:#173d22}
#rd-journey .rjx-skin-monitor .rjx-ornament{position:absolute;top:calc(100% + 30px);left:50%;transform:translateX(-50%);width:132px;height:34px;background:#20242a;clip-path:polygon(22% 0,78% 0,100% 100%,0 100%)}
#rd-journey .rjx-skin-monitor .rjx-ornament::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);width:212px;height:9px;background:#20242a;border-radius:5px}
@media(max-height:780px) and (min-width:701px){#rd-journey .rjx-stage{top:110px;padding:24px 30px 22px}#rd-journey .rjx-hero-value{font-size:70px}#rd-journey .rjx-stage h3{font-size:36px}}
@media(max-width:700px){#rd-journey .rjx-stage{left:10px;right:10px;top:124px;bottom:auto;width:auto;max-height:calc(100% - 300px);overflow:auto;padding:22px 18px 18px}#rd-journey .rjx-stage h3{font-size:31px}#rd-journey .rjx-stage .rj-description{font-size:14.5px}#rd-journey .rjx-hero-value{font-size:58px;letter-spacing:-1px}#rd-journey .rjx-hero-unit{font-size:19px}#rd-journey .rjx-stage .rj-step{flex-basis:30%;min-height:60px;font-size:12px}#rd-journey .rjx-stage.rjx-skin-monitor{border-width:10px;border-bottom-width:22px}#rd-journey .rjx-stage.rjx-skin-monitor::after{bottom:-16px}#rd-journey .rjx-stage.rjx-skin-board{border-width:7px}#rd-journey .rjx-stage.rjx-skin-board::before{top:-19px;height:16px}#rd-journey .rjx-ornament{display:none}}
@media(prefers-reduced-motion:reduce){#rd-journey .rjx-stage-backdrop{transition:none}}

/* Amendemen Panel Panggung — UAT induk di HP (kelas rjx-; aturan lama tidak diubah): panggung tidak pernah lagi memotong navigasinya. Strukturnya kolom fleksibel dengan tinggi maksimum terikat viewport (100dvh dikurangi margin aman atas + kawasan dock di bawah), wilayah tengah .rjx-stage-scroll (eyebrow, pahlawan, judul, deskripsi, ubin langkah) yang menggulir sendiri, dan baris navigasi beserta CTA penutup sebagai kaki flex:0 0 auto yang selalu terlihat penuh. Pemadatan bertingkat mengikuti tinggi viewport (≤780px lalu ≤640px): pahlawan, ubin, padding, dan jarak menyusut bertahap, dan ornamen bingkai (tiang papan, kaki monitor) adalah yang pertama hilang. Eyebrow dan judul panggung mendapat ruang aman kanan 48px agar teks yang membungkus tidak pernah tertutup tombol X. Bingkai papan mendapat strip rumput di bawah tiangnya, sesuai mockup yang disetujui. */
#rd-journey .rjx-stage{display:flex;flex-direction:column;max-height:calc(100vh - 244px);max-height:calc(100dvh - 244px)}
#rd-journey .rjx-stage-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
#rd-journey .rjx-stage .rj-story-navigation{flex:0 0 auto}
#rd-journey .rjx-stage .rjx-stage-cta{flex:0 0 auto}
#rd-journey .rjx-stage .rj-eyebrow{padding-right:48px}
#rd-journey .rjx-stage h3{padding-right:48px}
#rd-journey .rjx-skin-board .rjx-ornament::after{content:'';position:absolute;left:-10px;right:-10px;bottom:0;height:14px;background:linear-gradient(#86ab60,#679a45);border-radius:3px 3px 8px 8px;box-shadow:inset 0 2px 0 rgba(255,255,255,.22)}
@media(max-height:780px) and (min-width:701px){#rd-journey .rjx-stage{padding:24px 30px 20px}#rd-journey .rjx-hero-value{font-size:64px}#rd-journey .rjx-stage h3{font-size:34px}#rd-journey .rjx-stage .rj-description{font-size:15px;line-height:1.6}#rd-journey .rjx-stage .rj-detail-steps{margin-top:16px;padding-top:14px;gap:6px}#rd-journey .rjx-stage .rj-step{min-height:60px}#rd-journey .rjx-stage .rj-story-navigation{margin-top:16px}}
@media(max-height:780px) and (max-width:700px){#rd-journey .rjx-stage .rj-detail-steps{margin-top:12px}#rd-journey .rjx-stage .rj-step{min-height:54px}#rd-journey .rjx-stage .rj-story-navigation{margin-top:12px}}
@media(max-height:640px){#rd-journey .rjx-stage{padding-top:20px;padding-bottom:16px}#rd-journey .rjx-hero-value{font-size:48px;letter-spacing:-1px}#rd-journey .rjx-hero-unit{font-size:20px}#rd-journey .rjx-stage h3{font-size:29px}#rd-journey .rjx-stage .rj-description{font-size:14px;line-height:1.55}#rd-journey .rjx-stage .rj-detail-steps{margin-top:12px;padding-top:12px;gap:6px}#rd-journey .rjx-stage .rj-step{min-height:48px;padding:7px 5px}#rd-journey .rjx-stage .rj-story-navigation{margin-top:12px}#rd-journey .rjx-stage .rj-story-navigation button{min-height:46px}#rd-journey .rjx-stage .rj-story-navigation .rj-next{padding:10px 18px}#rd-journey .rjx-stage-cta:not([hidden]){min-height:46px}#rd-journey .rjx-stage .rjx-ornament{display:none}}
@media(max-width:700px){#rd-journey .rjx-stage{max-height:calc(100vh - 264px);max-height:calc(100dvh - 264px);overflow:visible}}
/* Amendemen Panel Panggung 2 — jangkar viewport: panggung berpindah dari absolut-di-jendela menjadi tetap-di-viewport pada tingkat yang jendelanya lebih tinggi dari viewport. Sebabnya: .rj-window bertinggi minimum 830px (≤700px) / 740px (>700px), jadi pada viewport pendek halaman menggulir dan offset atas absolut panggung (124px / 110px) diukur dari atas jendela, bukan dari atas viewport — sesudah menggulir 190px di 360×640, atas panggung mendarat di -66px dan eyebrow serta tombol X keluar layar. Dengan position:fixed, atas panggung selalu offset aman yang sama (124px di ≤700px; 110px pada tingkat >700px bertinggi ≤780px) dan tinggi maksimumnya yang sudah terikat 100dvh melengkapinya pas: atas + tinggi maks + margin dock bawah = tinggi viewport. Tingkat >700px bertinggi ≥740px tidak berubah: di sana tinggi jendela selalu sama dengan viewport, halaman tidak menggulir, dan absolut setara viewport. */
@media(max-width:700px){#rd-journey .rjx-stage{position:fixed}}
@media(min-width:701px) and (max-height:739px){#rd-journey .rjx-stage{position:fixed}}
/* Amendemen Panel Panggung 3 — landscape layar pendek (aturan tingkat tambahan; aturan lama tidak diubah): pada viewport bertinggi ≤480px (telepon landscape ~360px) panggung menyusut jadi strip 116px karena offset atas 110px dan cadangan bawah 134px (dock bottom:46 + tinggi dock ~54 + strip footer) memakan hampir seluruh layar, menyisakan celah gulir ~50px yang terbaca sebagai bingkai kosong. Tingkat ini mengklaim ulang kawasan bawah khusus layar pendek — strip footer disembunyikan, dock dipadatkan ke bottom:8 (≥701px) / bottom:10 (≤700px) — dan menyetel jangkar atas dari perabot tetap yang sesungguhnya. Pada ≥701px: header 70px, chip kembali berakhir di y=130; atas panggung 100px dan rangka+padding atas menyerap sisanya sehingga eyebrow mendarat di y=132–136, bersih di bawah chip. Aritmetika ≥701px pada tinggi 360: atas 100 + tinggi (100dvh − 166 = 194) + cadangan bawah 66 (panggung berakhir 4px di atas puncak dock vh−62) = 360. Pada ≤700px: chip berakhir di y=122 dan tombol mode melayang berakhir di y=124 di kanan atas, maka atas 116px menempatkan tombol X panggung mulai di y=126 (bersih 2px di bawah tombol mode) dan eyebrow di y=137–140 (bersih di bawah chip); aritmetika pada tinggi 360: atas 116 + tinggi (100dvh − 194 = 166) + cadangan bawah 78 (4px di atas puncak dock vh−74) = 360. Isi dipadatkan lagi di tingkat ini (pahlawan 40px, ubin 46px, dagu monitor 30→18px) agar eyebrow + pahlawan utuh terlihat tanpa menggulir. Tingkat ini tidak pernah cocok pada ukuran yang sudah terverifikasi (360×640, 390×844, 1366×768, 1440×900 — semuanya bertinggi >480), jadi geometri terverifikasi tidak berubah sama sekali. */
@media(max-height:480px){#rd-journey .rj-footer{display:none}#rd-journey .rjx-stage{padding:20px 22px 12px}#rd-journey .rjx-hero-value{font-size:40px}#rd-journey .rjx-hero-unit{font-size:19px}#rd-journey .rjx-stage h3{font-size:26px;margin-bottom:8px}#rd-journey .rjx-stage .rj-eyebrow{margin-bottom:8px}#rd-journey .rjx-stage .rj-description{font-size:14px;line-height:1.5}#rd-journey .rjx-stage .rj-detail-steps{margin-top:12px;padding-top:12px;gap:6px}#rd-journey .rjx-stage .rj-step{min-height:46px;padding:6px 5px}#rd-journey .rjx-stage .rj-story-navigation{margin-top:10px}#rd-journey .rjx-stage .rj-story-navigation button{min-height:42px}#rd-journey .rjx-stage.rjx-skin-monitor{border-bottom-width:18px}#rd-journey .rjx-stage.rjx-skin-monitor::after{bottom:-13px}}
@media(min-width:701px) and (max-height:480px){#rd-journey .rjx-stage{top:100px;padding-top:22px;max-height:calc(100vh - 166px);max-height:calc(100dvh - 166px)}#rd-journey .rj-dock{bottom:8px}}
@media(max-width:700px) and (max-height:480px){#rd-journey .rjx-stage{top:116px;max-height:calc(100vh - 194px);max-height:calc(100dvh - 194px);padding-top:14px}#rd-journey .rj-dock{bottom:10px}#rd-journey .rjx-stage.rjx-skin-monitor{border-bottom-width:14px}#rd-journey .rjx-stage.rjx-skin-monitor::after{bottom:-9px}}