/* Kerajaan Kaisar — r4-b.css: gaya Ronde 4 Kelompok B (Kehidupan Visual).
   Dipakai overlay 3D (city3d-kakilima/bermain/memancing/pasarpagi.js)
   + kartu & panel R4B. Tanpa skrip inline; semua kelas di sini. */

/* ---- label & gerobak 3D ---- */
.r4b3d-layer{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.r4b3d-layer.hidden{display:none}
.r4b3d-item{position:absolute;pointer-events:auto;cursor:pointer;text-align:center}
.r4b3d-lbl{position:absolute;left:50%;transform:translateX(-50%);top:-18px;white-space:nowrap;background:rgba(20,9,11,.88);color:#ffe9a8;font:600 10px sans-serif;padding:2px 7px;border-radius:8px;border:1px solid #d4af37}
/* R5F: mode gerobak 3D — item hanya label (badan gerobak = mesh 3D di
   scene; pola yang sama seperti .transport3d-v.lbl-only). */
.r4b3d-item.lbl-only{width:0!important;height:0!important;margin:0!important}
.r4b3d-cart{position:relative;width:46px;height:30px;margin:0 auto}
.r4b3d-cart .canopy{position:absolute;left:0;right:0;top:0;height:12px;background:#e67e22;border:2px solid #a04000;border-radius:6px 6px 2px 2px}
.r4b3d-cart .body{position:absolute;left:4px;right:4px;top:12px;height:12px;background:#8a5a2b;border:2px solid #5d3a17;border-radius:3px}
.r4b3d-cart .goods{position:absolute;left:8px;right:8px;top:8px;height:5px}
.r4b3d-cart .goods i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#ffd76a;margin-right:2px}
.r4b3d-cart .wheel{position:absolute;bottom:-4px;width:8px;height:8px;border-radius:50%;background:#222;border:1px solid #555}
.r4b3d-cart .wheel.l{left:6px}
.r4b3d-cart .wheel.r{right:6px}
/* ---- tenda kios 3D ---- */
.r4b3d-tent{position:relative;width:52px;height:34px;margin:0 auto}
.r4b3d-tent .roof{position:absolute;left:0;right:0;top:0;height:0;border-left:26px solid transparent;border-right:26px solid transparent;border-bottom:18px solid #e74c3c}
.r4b3d-tent .table{position:absolute;left:6px;right:6px;top:18px;height:10px;background:#8a5a2b;border:2px solid #5d3a17;border-radius:2px}
.r4b3d-tent .goods{position:absolute;left:10px;right:10px;top:13px;height:6px}
.r4b3d-tent .goods i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#fff;margin-right:2px}
/* ---- cincin area bermain 3D ---- */
.r4b3d-ring{position:absolute;border:3px dashed #9b59b6;border-radius:50%;pointer-events:none;animation:r4b3dSpin 14s linear infinite}
@keyframes r4b3dSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
/* ---- joran + pelampung 3D ---- */
.r4b3d-rod{position:absolute;width:44px;height:4px;background:#7a4a21;border-radius:2px;transform-origin:left center;transform:rotate(-32deg);box-shadow:0 1px 4px rgba(0,0,0,.5)}
.r4b3d-bob{position:absolute;width:10px;height:10px;border-radius:50%;background:#e74c3c;border:2px solid #fff;box-shadow:0 0 8px rgba(231,76,60,.8);animation:r4b3dBob 2.4s ease-in-out infinite alternate}
@keyframes r4b3dBob{from{transform:translateY(0)}to{transform:translateY(-5px)}}
.r4b3d-ripple{position:absolute;border:2px solid rgba(159,216,255,.85);border-radius:50%;pointer-events:none;animation:r4b3dRipple 2.8s ease-out infinite}
@keyframes r4b3dRipple{from{width:8px;height:4px;opacity:.9}to{width:44px;height:20px;opacity:0}}
/* ---- kartu & panel R4B ---- */
.r4b-sec{margin-top:14px;border-top:1px solid #d4af37;padding-top:10px}
.r4b-sec h4{margin:0 0 6px}
.r4b-tag{display:inline-block;background:#2e7d32;color:#e8f5e9;font:700 11px sans-serif;padding:2px 8px;border-radius:8px;margin-right:4px}
.r4b-tag.purple{background:#7d3c98}
.r4b-tag.blue{background:#2471a3}
.r4b-tag.orange{background:#ca6f1e}