/* Maskot Robo Labkom beraksi: ekspresi diatur lewat atribut data-e pada <svg class="rm"> */
.rm { display: block; overflow: visible; }
.rm .mu, .rm .mt-s, .rm .al, .rm .kr, .rm .pp { display: none; }
.rm .antena-ujung { fill: #17a2e6; transition: fill .3s; }
.rm .badan-gerak { animation: rm-melayang 4s ease-in-out infinite; }
.rm .mata { transform-box: fill-box; transform-origin: center; animation: rm-kedip 4.5s infinite; transition: transform .25s; }
.rm .lengan-kiri { transform-origin: 118px 290px; transition: transform .35s; }
.rm .kepala-g { transform-origin: 200px 240px; transition: transform .35s; }
.rm .lingkar { transform-box: fill-box; transform-origin: center; animation: rm-denyut 2.4s infinite; fill: none; stroke: #17a2e6; stroke-width: 2; opacity: .35; }

/* netral (bawaan) */
.rm .mu-n { display: inline; }

/* senang */
.rm[data-e="senang"] .mata-n { display: none; }
.rm[data-e="senang"] .mt-s, .rm[data-e="senang"] .pp { display: inline; }
.rm[data-e="senang"] .mu-n { display: none; }
.rm[data-e="senang"] .mu-s { display: inline; }
.rm[data-e="senang"] .lengan-kiri { animation: rm-lambai 1.1s ease-in-out infinite; }

/* serius / menegur sopan */
.rm[data-e="serius"] .antena-ujung { fill: #f59e0b; }
.rm[data-e="serius"] .lingkar { stroke: #f59e0b; }
.rm[data-e="serius"] .mata { transform: scaleY(.55); animation: none; }
.rm[data-e="serius"] .al-turun { display: inline; }
.rm[data-e="serius"] .mu-n { display: none; }
.rm[data-e="serius"] .mu-d { display: inline; }
.rm[data-e="serius"] .lengan-kiri { transform: rotate(38deg); animation: rm-tunjuk 1.2s ease-in-out infinite; }
.rm[data-e="serius"] .kepala-g { transform: rotate(-2deg); }

/* khawatir */
.rm[data-e="khawatir"] .antena-ujung { fill: #ef4444; }
.rm[data-e="khawatir"] .lingkar { stroke: #ef4444; animation-duration: 1s; }
.rm[data-e="khawatir"] .al-naik, .rm[data-e="khawatir"] .kr { display: inline; }
.rm[data-e="khawatir"] .mu-n { display: none; }
.rm[data-e="khawatir"] .mu-k { display: inline; }
.rm[data-e="khawatir"] .kepala-g { animation: rm-gemetar .5s linear infinite; }

/* berpikir */
.rm[data-e="berpikir"] .mata { transform: translate(7px, -7px); animation: none; }
.rm[data-e="berpikir"] .mu-n { display: none; }
.rm[data-e="berpikir"] .mu-d { display: inline; }
.rm[data-e="berpikir"] .lingkar { animation-duration: .8s; }
.rm[data-e="berpikir"] .kepala-g { transform: rotate(4deg); }

/* bicara: mulut membuka-menutup di atas ekspresi apa pun */
.rm[data-bicara="1"] .mu { display: none !important; }
.rm[data-bicara="1"] .mu-b { display: inline !important; transform-box: fill-box; transform-origin: center; animation: rm-mulut .28s ease-in-out infinite alternate; }

@keyframes rm-kedip { 0%, 92%, 100% { transform: scaleY(1); } 95% { transform: scaleY(.1); } }
@keyframes rm-melayang { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@keyframes rm-denyut { 0%, 100% { transform: scale(1); opacity: .4; } 50% { transform: scale(2); opacity: 0; } }
@keyframes rm-lambai { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-22deg); } }
@keyframes rm-tunjuk { 0%, 100% { transform: rotate(38deg); } 50% { transform: rotate(30deg); } }
@keyframes rm-gemetar { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-1.5px); } 75% { transform: translateX(1.5px); } }
@keyframes rm-mulut { from { transform: scaleY(.35); } to { transform: scaleY(1); } }

@media (prefers-reduced-motion: reduce) { .rm *, .rm { animation: none !important; transition: none !important; } }

/* gelembung ucapan Robo (halaman Kepatuhan) */
.rm-sapa { display: flex; align-items: center; gap: 1rem; }
.rm-sapa .rm-gelembung { position: relative; background: #fff; border: 1px solid #c4d6f5; border-radius: 14px; padding: .65rem .9rem; box-shadow: 0 2px 8px rgba(11,94,215,.08); max-width: 620px; }
.rm-sapa .rm-gelembung::before { content: ""; position: absolute; left: -8px; top: 50%; width: 14px; height: 14px; background: #fff; border-left: 1px solid #c4d6f5; border-bottom: 1px solid #c4d6f5; transform: translateY(-50%) rotate(45deg); }
