/* Komponen kedua permainan mengikuti panggung dan warna media. */
.demo-pick{grid-template-columns:repeat(4,1fr)}
.demo-pick button b{font-size:28px}
.adventures{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.adventure{border:3px solid #638077;border-radius:28px;background:var(--ink);padding:28px;text-align:left;display:flex;flex-direction:column;gap:12px;position:relative;min-height:390px;overflow:hidden}
.adventure:hover{border-color:var(--sun);background:var(--ink2)}
.adventure img{position:absolute;right:10px;top:28px;width:260px;height:245px;object-fit:contain;pointer-events:none}
.adventure.horse img{border-radius:24px;object-fit:cover;object-position:50% 42%;width:245px;height:245px;mix-blend-mode:normal}
.adventure>b{font:800 54px/1 var(--display);max-width:6ch;margin-top:24px;color:var(--sun)}
.adventure>p{font-size:21px;line-height:1.5;max-width:35ch;margin:18px 0 0}
.adventure .eyebrow{position:relative;z-index:1}
.adventure-cta{font-size:23px;color:var(--sun);margin-top:auto;font-weight:600}
.learn-table{border-collapse:collapse;width:100%;font-size:21px;line-height:1.5}
.learn-table th,.learn-table td{padding:16px;border-bottom:1px solid #41606a;text-align:left;vertical-align:top}
.learn-table th{background:#1d4652;color:var(--sun)}
.learn-table td:first-child{font-weight:600;min-width:210px}
.lesson-route{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.lesson-route>div{background:#1c4653;border-radius:20px;padding:22px;line-height:1.5}
.lesson-route b{display:block;font:800 29px/1.1 var(--display);color:var(--sun);margin-bottom:12px}
.horse-screen .panel{max-height:990px;overflow:auto;width:1420px;padding:34px 42px;gap:20px}
.horse-screen h2{font-size:58px}.horse-screen p{line-height:1.5;margin:0}
.horse-heading{display:grid;grid-template-columns:1fr 180px;align-items:center;gap:20px}
.horse-heading img{width:180px;height:145px;object-fit:cover;border-radius:22px;object-position:50% 40%}
.horse-mini div{padding:16px}.horse-mini b{font-size:28px}
.horse-setup .note{font-size:20px;line-height:1.5}
#hCalib .calib-grid{grid-template-columns:620px 1fr;gap:32px}
#hCalibCam{width:620px;height:465px;background:#08242e;border-radius:24px;border:3px solid #426775}
.h-calib-copy{display:flex;flex-direction:column;justify-content:center;gap:22px}.h-calib-copy h3{font-size:44px;color:var(--sun);line-height:1.12}.h-calib-copy p{font-size:24px}
.h-progress{height:14px;border-radius:14px;background:#345660;overflow:hidden}.h-progress i{display:block;height:100%;width:0;background:var(--leaf);transition:width .15s}
.horse-brief-art{display:grid;place-items:center;background:#e9e3d8;border-radius:24px;overflow:hidden}.horse-brief-art img{width:100%;max-height:475px;object-fit:contain}
.horse-brief .grid2{grid-template-columns:430px 1fr;align-items:center}.horse-brief li{font-size:23px}.horse-brief .note{font-size:19px;margin-top:18px}
#hCam{width:100%;border-radius:20px;border:4px solid var(--ink);background:#12323d}
.h-tracking-badge,.h-step-meter{padding:12px 16px;background:var(--ink-soft);border-radius:16px;font-size:19px;line-height:1.4}.h-step-meter{display:flex;flex-direction:column;gap:8px}.h-tracking-badge.lost{background:#883f30}
.h-mission{position:absolute;left:34px;top:175px;display:flex;flex-direction:column;gap:10px;background:var(--ink-soft);border-radius:22px;padding:22px 26px;max-width:620px}.h-mission b{font:800 42px/1.1 var(--display);color:var(--sun)}.h-mission #hHint{font-size:25px;line-height:1.4}
.horse-hud .hud-tl{max-width:1440px}.horse-hud .hud-tr{width:340px}.horse-hud .pill b{font-size:46px}.horse-hud .navpill b{font-size:34px}.horse-hud .hud-b{width:1120px}
.horse-screen .h-modal{width:1050px;text-align:center;align-items:center}.h-modal p{font-size:26px;max-width:44ch}
.horse-results{width:1530px!important}.h-result-card{padding:24px}.h-result-card h3{font-size:34px}
.h-reflection{margin-top:16px;padding-top:12px;border-top:1px solid #42636c}.h-reflection>p{margin-bottom:12px;font-size:23px}.h-reflection .fb{margin-top:12px;font-size:20px}
.h-observation{padding:16px 0;border-bottom:1px solid #41606a}.h-observation>b{display:block;color:var(--sun);margin-bottom:10px}.h-observation label{font-size:20px;line-height:1.5;display:flex;align-items:flex-start;gap:12px;margin:8px 0}.h-observation input{width:22px;height:22px;accent-color:var(--sun);flex-shrink:0}
#hCopyBox{width:100%;height:160px;background:#163b48;color:var(--paper);font:18px var(--body);padding:18px}

/* Wallpaper bersama tetap tampil ketika kembali dari peta kota. */
#stage[data-page="home"] #bg,#stage[data-page="pilihGame"] #bg{background-image:url(../img/latar_elang_kuda.webp)!important}
#stage[data-page="home"] #bgShade{background:linear-gradient(90deg,rgba(7,29,36,.62) 0%,rgba(7,29,36,.28) 46%,rgba(7,29,36,.02) 69%)}
.h-lane-guide{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.h-lane-guide>div{border:2px dashed #a5bcae;border-radius:18px;padding:14px 18px;background:#193f4a;text-align:center}
.h-lane-guide>div:nth-child(2){border-style:solid;border-color:var(--sun)}
.h-lane-guide b{display:block;color:var(--sun);font:800 28px/1.2 var(--display)}
.h-lane-guide span{display:block;font-size:18px;margin-top:6px;color:#cfdfd8}

/* Gambar langkah gerak dipakai bersama oleh materi, demonstrasi dan petunjuk. */
.stage img.pose-sheet{width:200%;height:200%;max-width:none;object-fit:fill;transform-origin:top left}
.demo-figure-note{margin:0;text-align:center;font-size:17px;line-height:1.4}
.motion-picture{display:block;position:relative;aspect-ratio:16/10;background:#e6f3ee;border-radius:14px;overflow:hidden;margin-bottom:15px}
.motion-picture>.pose-window{display:block;position:absolute;top:0;bottom:0;width:50%;left:25%;overflow:hidden}
.pose-window img{position:absolute;top:0;left:0;width:200%;height:200%;max-width:none;object-fit:fill}
.motion-picture>img{width:100%;height:100%;object-fit:contain;display:block}
.lesson-demo-link{display:block;margin-top:14px;font-size:17px!important;padding:10px 12px!important}
.running-compare{display:grid;grid-template-columns:1fr 2fr;gap:14px 22px;border-radius:18px;padding:22px;background:#203f49;margin-top:20px}
.running-compare b{color:var(--sun)}
.camera-lesson-figure{margin:22px 0;background:#e6f3ee;border-radius:20px;overflow:hidden}
.camera-lesson-figure img{display:block;width:100%;height:auto;max-height:440px;object-fit:contain}
.camera-lesson-figure figcaption{padding:14px 22px;color:#254b50;font-size:19px;line-height:1.4;text-align:center}
.horse-control-guide img{width:100%;height:auto!important;max-height:430px!important;object-fit:contain!important;border-radius:16px}
.horse-control-guide p{font-size:18px;line-height:1.4;text-align:center;margin:12px 0}
@media(max-width:760px){.running-compare{grid-template-columns:1fr}.motion-picture>.pose-window{width:50%;left:25%}}

.demo>div:first-child{position:sticky;top:16px}
#banner{top:270px;font-size:110px}

.h-calib-readings{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:#193f4a;padding:14px;border-radius:16px}
.h-calib-readings>div{display:flex;flex-direction:column;gap:8px;font-size:18px}
.h-calib-readings b{color:var(--sun);font-size:17px}
.h-calib-readings meter{width:100%;height:20px;accent-color:#84d4a6}
.h-calib-readings>p{grid-column:1/-1;font-size:18px}
.h-calib-sensitivity{display:flex;align-items:center;gap:12px;font-size:20px}
.h-calib-sensitivity select{flex:1;min-width:0}
#hCalib .h-calib-copy{gap:14px}
.h-calib-sensitivity select{background:#204855;color:var(--paper);border:2px solid #709b97;border-radius:14px;font:inherit;padding:12px 14px;min-height:52px}

/* Gold five-point collectible symbol in the horse HUD. */
.star-ico{width:38px;height:38px;flex-shrink:0;background:linear-gradient(135deg,#fff6ba,#ffc646 52%,#d98b1f);clip-path:polygon(50% 0,61% 34%,98% 36%,69% 59%,79% 96%,50% 75%,21% 96%,31% 59%,2% 36%,39% 34%);filter:drop-shadow(0 0 5px #ffdb6d)}