/* MIHO student companion — sprite identity from the approved reference. */
.student-companion{
  position:fixed!important;z-index:2147483000!important;width:265px;height:285px;
  pointer-events:none;user-select:none;isolation:isolate;
  transition:left 2.8s cubic-bezier(.32,.04,.22,1),top 2.8s cubic-bezier(.32,.04,.22,1)
}
.student-companion.is-dragging{transition:none!important}
.student-companion-robot{
  position:absolute;right:6px;bottom:0;width:250px;height:272px;padding:0;border:0;
  background:transparent;cursor:grab;pointer-events:auto;touch-action:none;outline:none;
  transform:translate(var(--miho-look-x,0),var(--miho-look-y,0));
  transition:transform .24s cubic-bezier(.2,.8,.2,1),filter .2s ease
}
.student-companion-robot:hover{filter:brightness(1.06)}
.student-companion-robot::before{content:"";position:absolute;z-index:3;left:50%;top:4px;width:8px;height:8px;border-radius:50%;background:#48efff;box-shadow:0 0 9px #24dfff,0 0 22px rgba(30,217,255,.72);transform:translateX(-50%);animation:mihoAntenna 1.8s ease-in-out infinite}
.student-companion-robot::after{content:"";position:absolute;z-index:-1;left:24%;right:20%;bottom:16px;height:17px;border-radius:50%;background:rgba(0,5,18,.48);filter:blur(8px);animation:mihoShadow 4.4s ease-in-out infinite}
.student-companion-robot:focus-visible{border-radius:42px;box-shadow:0 0 0 3px #38dcff}
.student-companion.is-dragging .student-companion-robot{cursor:grabbing}
.miho-sprite{
  position:absolute;left:6px;top:6px;width:238px;height:238px;
  background-image:url("assets/robot/miho-emotions-v2.png");
  background-repeat:no-repeat;background-size:300% 200%;background-position:0 0;
  filter:drop-shadow(0 19px 16px rgba(0,5,24,.48));
  transform-origin:50% 88%;will-change:transform,filter;
  animation:mihoIdle 4.4s ease-in-out infinite
}

/* The approved MIHO artwork split into independent, pixel-identical body layers. */
.miho-articulated{
  display:none;position:absolute;left:6px;top:6px;width:238px;height:238px;
  filter:drop-shadow(0 19px 16px rgba(0,5,24,.48));transform-origin:50% 88%;
  animation:mihoPartsRoot 3.8s ease-in-out infinite;will-change:transform
}
.miho-piece{
  position:absolute;background-repeat:no-repeat;background-size:contain;background-position:center;
  transform-box:border-box;will-change:transform;filter:drop-shadow(0 3px 3px rgba(0,7,22,.16))
}
.miho-piece-head{z-index:6;left:24px;top:0;width:190px;height:137px;background-image:url("assets/robot/miho-rig-v4/miho-head-v4.png");transform-origin:50% 86%;animation:mihoHeadIndependent 3.4s ease-in-out infinite}
.miho-piece-head::before,.miho-piece-head::after{content:"";position:absolute;top:56%;width:18%;height:7%;border-radius:50%;opacity:0;background:#020811;box-shadow:inset 0 -2px 0 #2be6ff;animation:mihoPartsBlink 5.1s steps(1,end) infinite}
.miho-piece-head::before{left:28%}.miho-piece-head::after{right:28%;animation-delay:.035s}
.miho-piece-torso{z-index:4;left:64px;top:109px;width:110px;height:98px;background-image:url("assets/robot/miho-rig-v4/miho-torso-v4.png");transform-origin:50% 24%;animation:mihoTorsoBreath 3.1s ease-in-out infinite}
.miho-piece-arm-left{z-index:2;left:33px;top:113px;width:52px;height:75px;background-image:url("assets/robot/miho-rig-v4/miho-arm-left-v4.png");transform-origin:92% 7%;animation:mihoArmLeftAlive 3.8s ease-in-out infinite alternate}
.miho-piece-arm-right{z-index:2;left:153px;top:113px;width:51px;height:79px;background-image:url("assets/robot/miho-rig-v4/miho-arm-right-v4.png");transform-origin:8% 7%;animation:mihoArmRightAlive 3.8s ease-in-out infinite alternate}
.miho-piece-leg-left{z-index:1;left:68px;top:181px;width:53px;height:77px;background-image:url("assets/robot/miho-rig-v4/miho-leg-left-v4.png");transform-origin:50% 7%;animation:mihoLegLeftAlive 3.1s ease-in-out infinite alternate}
.miho-piece-leg-right{z-index:1;left:117px;top:181px;width:53px;height:77px;background-image:url("assets/robot/miho-rig-v4/miho-leg-right-v4.png");transform-origin:50% 7%;animation:mihoLegRightAlive 3.1s ease-in-out infinite alternate}
.miho-rig-mouth{display:block;position:absolute;z-index:8;left:110px;top:94px;width:19px;height:9px;border-radius:38% 38% 58% 58%;background:#35eaff;box-shadow:0 0 7px #14dfff,0 2px 0 rgba(3,27,42,.8);opacity:0;transform-origin:50% 35%}
.student-companion:is([data-mood="idle"],[data-mood="learning"],[data-mood="happy"]) .miho-articulated{display:block}
.student-companion:is([data-mood="idle"],[data-mood="learning"],[data-mood="happy"]) .miho-pose-sprite{display:none}
.student-companion[data-voice="error"] .miho-articulated{animation:mihoPartsError .42s ease-in-out 2 alternate}
.student-companion[data-voice="speaking"] .miho-rig-mouth{opacity:1;animation:mihoRigMouthTalk .18s ease-in-out infinite alternate}
.student-companion[data-voice="speaking"] .miho-piece-arm-left{animation:mihoRigTalkLeft .9s ease-in-out infinite alternate}
.student-companion[data-voice="speaking"] .miho-piece-arm-right{animation:mihoRigTalkRight 1.1s ease-in-out infinite alternate}
.student-companion[data-voice="listening"] .miho-piece-head{animation:mihoRigListenHead .72s ease-in-out infinite alternate}
.student-companion[data-voice="listening"] .miho-piece-arm-left{animation:mihoRigListenLeft 1.15s ease-in-out infinite alternate}
.student-companion[data-voice="listening"] .miho-piece-arm-right{animation:mihoRigListenRight 1.15s ease-in-out infinite alternate}
.student-companion[data-voice="thinking"] .miho-piece-head{animation:mihoRigThinkHead 1.4s ease-in-out infinite}
.student-companion[data-voice="thinking"] .miho-piece-torso{animation:mihoRigThinkBody 1.4s ease-in-out infinite}
.student-companion[data-emotion="happy"] .miho-articulated{filter:drop-shadow(0 19px 16px rgba(0,5,24,.48)) drop-shadow(0 0 10px rgba(57,231,255,.22))}

/* Walking and gestures now move limbs around their own joints, not the whole bitmap. */
.student-companion[data-motion="walk"] .miho-articulated{animation:mihoPartsWalkRoot .34s ease-in-out infinite alternate}
.student-companion[data-motion="walk"] .miho-piece-head{animation:mihoPartsWalkHead .58s ease-in-out infinite alternate}
.student-companion[data-motion="walk"] .miho-piece-arm-left{animation:mihoPartsArmForward .58s ease-in-out infinite alternate}
.student-companion[data-motion="walk"] .miho-piece-arm-right{animation:mihoPartsArmBack .58s ease-in-out infinite alternate}
.student-companion[data-motion="walk"] .miho-piece-leg-left{animation:mihoPartsLegBack .58s ease-in-out infinite alternate}
.student-companion[data-motion="walk"] .miho-piece-leg-right{animation:mihoPartsLegForward .58s ease-in-out infinite alternate}
.student-companion:is([data-motion="hello"],[data-motion="wave"]) .miho-piece-arm-right,
.student-companion.is-curious:not(.is-dragging) .miho-piece-arm-right{animation:mihoPartsWaveRight .48s ease-in-out infinite alternate}
.student-companion:is([data-motion="hello"],[data-motion="wave"]) .miho-piece-head,
.student-companion.is-curious:not(.is-dragging) .miho-piece-head{animation:mihoPartsFriendlyHead .7s ease-in-out infinite alternate}
.student-companion[data-motion="stretch"] .miho-piece-arm-left{animation:mihoPartsStretchLeft .72s ease-in-out 3 alternate}
.student-companion[data-motion="stretch"] .miho-piece-arm-right{animation:mihoPartsStretchRight .72s ease-in-out 3 alternate}
.student-companion[data-motion="clap"] .miho-piece-arm-left{animation:mihoPartsClapLeft .34s ease-in-out 6 alternate}
.student-companion[data-motion="clap"] .miho-piece-arm-right{animation:mihoPartsClapRight .34s ease-in-out 6 alternate}
.student-companion[data-motion="giggle"] .miho-piece-head{animation:mihoPartsGiggleHead .22s ease-in-out 8 alternate}
.student-companion[data-motion="giggle"] .miho-piece-arm-left{animation:mihoPartsGiggleLeft .22s ease-in-out 8 alternate}
.student-companion[data-motion="giggle"] .miho-piece-arm-right{animation:mihoPartsGiggleRight .22s ease-in-out 8 alternate}
.student-companion.is-dragging .miho-articulated{animation:none!important;transform:scale(1.035) rotate(-3deg)}
.student-companion[data-mood="idle"][data-voice="off"] .miho-sprite::before,
.student-companion[data-mood="idle"][data-voice="off"] .miho-sprite::after,
.student-companion[data-mood="learning"][data-voice="off"] .miho-sprite::before,
.student-companion[data-mood="learning"][data-voice="off"] .miho-sprite::after{content:"";position:absolute;z-index:2;top:31%;width:33px;height:13px;border-radius:50%;opacity:0;background:#020c18;box-shadow:inset 0 -2px 0 #2be6ff,0 1px 5px rgba(31,224,255,.5);animation:mihoBlink 5.1s steps(1,end) infinite}
.student-companion[data-mood="idle"][data-voice="off"] .miho-sprite::before,
.student-companion[data-mood="learning"][data-voice="off"] .miho-sprite::before{left:27%}
.student-companion[data-mood="idle"][data-voice="off"] .miho-sprite::after,
.student-companion[data-mood="learning"][data-voice="off"] .miho-sprite::after{right:25%;animation-delay:.035s}

/* Expression map: 3 x 2 exact sprite cells. */
.student-companion[data-mood="idle"] .miho-sprite,
.student-companion[data-mood="learning"] .miho-sprite,
.student-companion[data-mood="happy"] .miho-sprite{background-position:0 0}
.student-companion[data-mood="thinking"] .miho-sprite{background-position:0 100%}
.student-companion[data-mood="worried"] .miho-sprite,
.student-companion[data-mood="sad"] .miho-sprite{background-position:50% 100%}
.student-companion[data-mood="celebrate"] .miho-sprite,
.student-companion[data-mood="love"] .miho-sprite{background-position:100% 100%}
.student-companion[data-mood="gaming"] .miho-sprite{background-position:100% 0}
.student-companion[data-voice="connecting"] .miho-sprite{background-position:0 100%}
.student-companion[data-voice="ready"] .miho-sprite,
.student-companion[data-voice="listening"] .miho-sprite{background-position:50% 0}
.student-companion[data-voice="thinking"] .miho-sprite{background-position:0 100%}
.student-companion[data-voice="speaking"] .miho-sprite{background-position:100% 0}
.student-companion[data-voice="error"] .miho-sprite{background-position:50% 100%}

/* Motion layer — the illustration stays consistent while the body feels alive. */
.student-companion[data-motion="hello"] .miho-sprite{animation:mihoHello 1.15s cubic-bezier(.18,.86,.28,1.28) both}
.student-companion[data-motion="walk"]{animation:mihoTravelLean .7s ease-in-out infinite alternate}
.student-companion[data-motion="walk"] .miho-sprite{animation:mihoWalk .32s ease-in-out infinite alternate}
.student-companion[data-motion="hop"] .miho-sprite{animation:mihoHop .62s cubic-bezier(.2,.8,.3,1) 3}
.student-companion[data-motion="look"] .miho-sprite{animation:mihoLook 1.8s ease-in-out}
.student-companion[data-motion="wave"] .miho-sprite,
.student-companion.is-curious:not(.is-dragging) .miho-sprite{background-position:100% 0;animation:mihoWave .7s ease-in-out infinite alternate}
.student-companion[data-motion="clap"] .miho-sprite{background-position:100% 100%;animation:mihoClap .4s ease-in-out 5 alternate}
.student-companion[data-motion="stretch"] .miho-sprite{background-position:100% 0;animation:mihoStretch .7s ease-in-out 3 alternate}
.student-companion[data-motion="giggle"] .miho-sprite{animation:mihoGiggle .28s ease-in-out 7 alternate}
.student-companion[data-motion="dance"] .miho-sprite,
.student-companion[data-mood="celebrate"][data-motion="idle"] .miho-sprite{background-position:100% 100%;animation:mihoVictory .62s cubic-bezier(.2,.8,.3,1) infinite alternate}
.student-companion[data-motion="heart"] .miho-sprite{background-position:100% 100%;animation:mihoHeartJoy .78s cubic-bezier(.2,.8,.3,1) infinite alternate}
.student-companion[data-motion="sad"] .miho-sprite{background-position:50% 100%;animation:mihoSadBody 1.35s ease-in-out infinite alternate}
.student-companion[data-motion="comfort"] .miho-sprite{background-position:50% 100%;animation:mihoComfortBody 1.15s ease-in-out infinite alternate}
.student-companion[data-voice="listening"] .miho-sprite{animation:mihoListen .72s ease-in-out infinite alternate}
.student-companion[data-voice="thinking"] .miho-sprite{animation:mihoThink 1.5s ease-in-out infinite}
.student-companion[data-voice="speaking"] .miho-sprite{animation:mihoSpeak .34s ease-in-out infinite alternate}
.student-companion[data-voice="error"] .miho-sprite{animation:mihoWorry .34s ease-in-out 5 alternate}
.student-companion.is-dragging .miho-sprite{animation:none!important;transform:scale(1.05) rotate(-3deg)!important}

.miho-listening-waves{display:none;position:absolute;right:14px;top:52px;width:43px;height:58px;align-items:center;justify-content:center;gap:4px;transform:rotate(-12deg)}
.student-companion[data-voice="listening"] .miho-listening-waves,
.student-companion[data-voice="speaking"] .miho-listening-waves{display:flex}
.miho-listening-waves i{display:block;width:4px;border-radius:999px;background:#2ce6ff;box-shadow:0 0 9px #19d9ff;animation:mihoWaveBar .7s ease-in-out infinite alternate}
.miho-listening-waves i:nth-child(1){height:14px}.miho-listening-waves i:nth-child(2){height:30px;animation-delay:.15s}.miho-listening-waves i:nth-child(3){height:20px;animation-delay:.3s}

.student-companion-hearts{display:none;position:absolute;inset:0;pointer-events:none}
.student-companion:is([data-mood="celebrate"],[data-mood="love"]) .student-companion-hearts{display:block}
.student-companion-hearts i{position:absolute;color:#ff62bb;font-size:25px;font-style:normal;text-shadow:0 0 15px #ff3caa;animation:mihoHeart 1.8s ease-out infinite}
.student-companion-hearts i:nth-child(1){left:20px;top:92px}.student-companion-hearts i:nth-child(2){right:13px;top:53px;animation-delay:.4s}.student-companion-hearts i:nth-child(3){left:112px;top:0;animation-delay:.8s}.student-companion-hearts i:nth-child(4){right:70px;top:116px;animation-delay:1.2s}

/* Voice and text panel appears only after a click on MIHO. */
.student-companion-card{
  position:absolute;right:12px;bottom:270px;width:400px;overflow:hidden;
  border:1px solid rgba(56,196,255,.28);border-radius:22px;
  background:linear-gradient(155deg,rgba(10,27,49,.99),rgba(3,12,27,.995));
  box-shadow:0 28px 85px rgba(0,0,0,.58),inset 0 1px rgba(255,255,255,.05);
  color:#eef8ff;cursor:auto;pointer-events:auto;user-select:text;animation:mihoCardIn .24s ease both
}
.student-companion-card[hidden]{display:none}
.student-companion.panel-right .student-companion-card{right:auto;left:16px}
.student-companion.panel-down .student-companion-card{top:250px;bottom:auto}
.miho-card-head{display:flex;align-items:center;gap:11px;padding:14px 15px;border-bottom:1px solid rgba(75,146,207,.2);background:rgba(8,22,40,.78)}
.miho-card-avatar{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border:1px solid rgba(52,221,255,.6);border-radius:13px;background:#061421;color:#35e4ff;font-size:22px;font-weight:900;box-shadow:0 0 18px rgba(39,216,255,.18)}
.miho-card-head>span:nth-child(2){display:grid;min-width:0;gap:2px}.miho-card-head b{font-size:14px;letter-spacing:.3px}.miho-card-head small{overflow:hidden;color:#8aa4ba;font-size:9px;text-overflow:ellipsis;white-space:nowrap}
.miho-settings-toggle,.student-companion-close{width:30px;height:30px;border:0;border-radius:10px;background:#142a42;color:#91a9bd;cursor:pointer}.miho-settings-toggle{margin-left:auto;font-size:14px}.student-companion-close{font-size:20px}.miho-settings-toggle:hover,.miho-settings-toggle[aria-expanded="true"],.student-companion-close:hover{background:#1c3a59;color:#fff}
.miho-context{display:grid;gap:3px;margin:12px 14px 0;padding:10px 12px;border:1px solid rgba(43,158,215,.2);border-radius:12px;background:rgba(11,34,57,.62)}
.miho-context strong{color:#48e4ff;font-size:9px;text-transform:uppercase;letter-spacing:.7px}.miho-context span{color:#9fb2c4;font-size:9px;line-height:1.45}
.miho-voice-settings{position:absolute;z-index:12;left:12px;right:12px;top:66px;max-height:355px;overflow:auto;padding:14px;border:1px solid rgba(57,199,243,.32);border-radius:16px;background:linear-gradient(155deg,#0b2136,#061321);box-shadow:0 18px 46px rgba(0,0,0,.52);scrollbar-width:thin;scrollbar-color:#24506b transparent}.miho-voice-settings[hidden]{display:none}.miho-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.miho-settings-grid label{display:grid;gap:5px;color:#8faabd;font-size:8px}.miho-settings-grid select,.miho-settings-grid input[type="range"]{width:100%;min-width:0}.miho-settings-grid select{height:31px;padding:0 8px;border:1px solid #29455c;border-radius:8px;background:#0c2033;color:#eef9ff;font:600 9px Manrope,system-ui,sans-serif;outline:none}.miho-range{grid-column:1/-1}.miho-range>span{display:flex;justify-content:space-between}.miho-range output{color:#43e8ff}.miho-range input{accent-color:#39e5ff}.miho-check{grid-column:1/-1!important;display:flex!important;align-items:center;gap:8px!important}.miho-check input{accent-color:#9dff36}.miho-voice-settings>small{display:block;margin-top:9px;color:#657e93;font-size:7px;line-height:1.4}
.miho-transcript{display:grid;gap:3px;margin:10px 14px 0;padding:8px 11px;border:1px solid rgba(157,255,54,.23);border-radius:11px;background:rgba(31,65,28,.42)}.miho-transcript[hidden]{display:none}.miho-transcript span{color:#a8ff54;font-size:7px;font-weight:800;text-transform:uppercase;letter-spacing:.6px}.miho-transcript p{margin:0;color:#e9ffda;font-size:10px;line-height:1.45}.miho-transcript:not(.is-final) p::after{content:"";display:inline-block;width:4px;height:10px;margin-left:4px;background:#a8ff54;animation:mihoCursor .7s steps(1) infinite}
.miho-thread{height:238px;overflow:auto;padding:14px;scrollbar-width:thin;scrollbar-color:#214763 transparent}
.miho-message{display:grid;gap:4px;max-width:86%;margin-bottom:11px}.miho-message span{color:#62dff5;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.65px}.miho-message p{margin:0;padding:10px 12px;border:1px solid rgba(66,134,185,.25);border-radius:14px 14px 14px 4px;background:#102238;color:#dbe9f5;font-size:11px;line-height:1.55;white-space:pre-wrap}
.miho-message.user{margin-left:auto}.miho-message.user span{text-align:right;color:#a8ff54}.miho-message.user p{border-color:rgba(136,223,62,.25);border-radius:14px 14px 4px 14px;background:#183321;color:#eaffda}
.miho-message.is-streaming p:after{content:"";display:inline-block;width:5px;height:11px;margin-left:4px;background:#35e4ff;animation:mihoCursor .7s steps(1) infinite;vertical-align:-2px}
.miho-composer{display:grid;grid-template-columns:1fr 42px 42px;gap:7px;margin:0 12px;padding:10px;border:1px solid rgba(62,138,194,.28);border-radius:15px;background:#071525}
.miho-composer input{min-width:0;border:0;outline:0;background:transparent;color:#f0f8ff;font:500 11px Manrope,system-ui,sans-serif}.miho-composer input::placeholder{color:#60768b}
.miho-mic,.miho-send{display:grid;place-items:center;width:42px;height:38px;border:0;border-radius:11px;cursor:pointer;font-weight:900}
.miho-mic{background:#152b40;color:#87a2b8;font-size:16px}.miho-mic.active{background:#0b4553;color:#43ecff;box-shadow:inset 0 0 0 1px rgba(62,226,255,.34),0 0 15px rgba(37,218,255,.18);animation:mihoMicPulse 1.3s ease-in-out infinite}.miho-send{background:linear-gradient(145deg,#c4ff4a,#72e529);color:#10200b;font-size:17px}.miho-send:hover{filter:brightness(1.08)}
.miho-voice-footer{display:flex;align-items:center;gap:7px;padding:10px 15px 13px;color:#71879b;font-size:8px}.miho-live-dot{width:7px;height:7px;border-radius:50%;background:#5c7184}.student-companion[data-voice="ready"] .miho-live-dot,.student-companion[data-voice="listening"] .miho-live-dot{background:#9dff36;box-shadow:0 0 9px #8eff32}.student-companion[data-voice="speaking"] .miho-live-dot{background:#38e5ff;box-shadow:0 0 9px #38e5ff}.student-companion[data-voice="error"] .miho-live-dot{background:#ff668c}.miho-input-level{width:48px;height:4px;margin-left:auto;overflow:hidden;border-radius:4px;background:#172d40}.miho-input-level i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#91ff3f,#2be5ff);transform:scaleX(0);transform-origin:left;transition:transform .08s linear}.miho-voice-footer button{margin-left:0!important}
.miho-voice-footer button{margin-left:auto;border:0;background:transparent;color:#7697b1;font-size:8px;cursor:pointer}.miho-voice-footer button:hover{color:#fff}

html[data-theme="light"] .student-companion-card{border-color:#c6dceb;background:linear-gradient(155deg,#fff,#f1f7fb);box-shadow:0 26px 70px rgba(34,67,94,.25);color:#112438}
html[data-theme="light"] .miho-card-head{background:#f7fbfe}html[data-theme="light"] .miho-context,html[data-theme="light"] .miho-composer,html[data-theme="light"] .miho-voice-settings{background:#edf5fa}html[data-theme="light"] .miho-settings-grid select{border-color:#c4d8e5;background:#fff;color:#183047}html[data-theme="light"] .miho-message p{background:#edf5fb;color:#24384a}html[data-theme="light"] .miho-message.user p{background:#e8f5df;color:#27411a}html[data-theme="light"] .miho-composer input{color:#183047}

@keyframes mihoIdle{0%,100%{transform:translateY(0) rotate(-.8deg) scale(1)}18%{transform:translateY(-4px) rotate(.4deg) scale(1.008)}42%{transform:translateY(-9px) rotate(1.2deg) scale(1.018)}66%{transform:translateY(-5px) rotate(-.4deg) scale(1.006)}84%{transform:translateY(1px) rotate(-1deg) scale(.995,1.008)}}
@keyframes mihoHello{0%{opacity:0;transform:translateY(70px) scale(.55) rotate(-10deg)}55%{opacity:1;transform:translateY(-13px) scale(1.05) rotate(5deg)}75%{transform:translateY(2px) rotate(-3deg)}100%{transform:none}}
@keyframes mihoWalk{from{transform:translateY(4px) rotate(-4deg) scale(.985,1.015)}to{transform:translateY(-10px) rotate(4deg) scale(1.02,.985)}}
@keyframes mihoTravelLean{from{transform:rotate(-1.2deg)}to{transform:rotate(1.2deg)}}
@keyframes mihoHop{0%,100%{transform:translateY(0) scale(1)}18%{transform:translateY(4px) scale(1.03,.96)}48%{transform:translateY(-31px) rotate(3deg) scale(.98,1.04)}72%{transform:translateY(3px) rotate(-2deg) scale(1.04,.96)}}
@keyframes mihoLook{0%,100%{transform:rotate(0) translateY(0)}22%{transform:translateX(-10px) rotate(-6deg) translateY(-4px)}48%{transform:translateX(-10px) rotate(-4deg) translateY(-6px)}72%{transform:translateX(9px) rotate(6deg) translateY(-4px)}}
@keyframes mihoWave{from{transform:translateY(1px) rotate(-3deg) scale(.995)}to{transform:translateY(-12px) rotate(5deg) scale(1.035)}}
@keyframes mihoClap{from{transform:translateY(0) scale(1)}to{transform:translateY(-12px) scale(1.035)}}
@keyframes mihoStretch{from{transform:scaleY(1) translateY(0)}to{transform:scaleY(1.045) translateY(-11px)}}
@keyframes mihoGiggle{from{transform:translateX(-4px) translateY(0) rotate(-1deg)}to{transform:translateX(4px) translateY(-5px) rotate(1deg)}}
@keyframes mihoVictory{0%{transform:translateY(2px) rotate(-4deg) scale(1.02,.97)}55%{transform:translateY(-29px) rotate(4deg) scale(.98,1.04)}100%{transform:translateY(-4px) rotate(-2deg) scale(1.02)}}
@keyframes mihoHeartJoy{from{transform:translateY(1px) rotate(-2deg) scale(.99)}to{transform:translateY(-15px) rotate(3deg) scale(1.045)}}
@keyframes mihoSadBody{from{transform:translateY(3px) rotate(-1deg) scale(.99)}to{transform:translateY(7px) rotate(1deg) scale(.975)}}
@keyframes mihoComfortBody{from{transform:translateX(-3px) translateY(3px) rotate(-1.4deg)}to{transform:translateX(3px) translateY(-3px) rotate(1.4deg)}}
@keyframes mihoListen{from{transform:translateY(0) rotate(-1.5deg)}to{transform:translateY(-7px) rotate(2.5deg)}}
@keyframes mihoThink{0%,100%{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(3deg) translateY(-7px)}}
@keyframes mihoSpeak{from{transform:translateY(1px) rotate(-1.2deg) scale(.995)}to{transform:translateY(-7px) rotate(1.2deg) scale(1.025)}}
@keyframes mihoWorry{from{transform:translateX(-3px) rotate(-1deg)}to{transform:translateX(3px) rotate(1deg)}}
@keyframes mihoWaveBar{from{transform:scaleY(.45);opacity:.45}to{transform:scaleY(1);opacity:1}}
@keyframes mihoHeart{0%{opacity:0;transform:translateY(16px) scale(.45)}30%{opacity:1}100%{opacity:0;transform:translateY(-58px) scale(1.15) rotate(12deg)}}
@keyframes mihoCardIn{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
@keyframes mihoCursor{50%{opacity:0}}
@keyframes mihoMicPulse{50%{box-shadow:inset 0 0 0 1px rgba(62,226,255,.6),0 0 22px rgba(37,218,255,.34)}}
@keyframes mihoBlink{0%,88%,93%,100%{opacity:0}89%,92%{opacity:1}}
@keyframes mihoAntenna{0%,100%{transform:translateX(-50%) scale(.82);opacity:.62}50%{transform:translateX(-50%) scale(1.22);opacity:1}}
@keyframes mihoShadow{0%,100%{transform:scaleX(1);opacity:.58}50%{transform:scaleX(.78);opacity:.32}}

@keyframes mihoPartsRoot{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes mihoHeadIndependent{0%,100%{transform:translate(var(--miho-head-x,0),var(--miho-head-y,0)) rotate(-1deg)}50%{transform:translate(var(--miho-head-x,0),calc(var(--miho-head-y,0px) - 3px)) rotate(1deg)}}
@keyframes mihoTorsoBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.018,1.035) translateY(-2px)}}
@keyframes mihoArmLeftAlive{from{transform:rotate(-1deg)}to{transform:rotate(3deg)}}
@keyframes mihoArmRightAlive{from{transform:rotate(2deg)}to{transform:rotate(-2deg)}}
@keyframes mihoLegLeftAlive{from{transform:translateY(0) rotate(-.6deg)}to{transform:translateY(-2px) rotate(1deg)}}
@keyframes mihoLegRightAlive{from{transform:translateY(-2px) rotate(-1deg)}to{transform:translateY(0) rotate(.6deg)}}
@keyframes mihoPartsWalkRoot{from{transform:translateY(3px) rotate(-1deg)}to{transform:translateY(-8px) rotate(1deg)}}
@keyframes mihoPartsWalkHead{from{transform:translate(var(--miho-head-x,0),var(--miho-head-y,0)) rotate(-2deg)}to{transform:translate(var(--miho-head-x,0),calc(var(--miho-head-y,0px) - 4px)) rotate(2deg)}}
@keyframes mihoPartsArmForward{from{transform:rotate(-16deg)}to{transform:rotate(19deg)}}
@keyframes mihoPartsArmBack{from{transform:rotate(19deg)}to{transform:rotate(-16deg)}}
@keyframes mihoPartsLegForward{from{transform:rotate(-10deg) translateY(2px)}to{transform:rotate(12deg) translateY(-4px)}}
@keyframes mihoPartsLegBack{from{transform:rotate(12deg) translateY(-4px)}to{transform:rotate(-10deg) translateY(2px)}}
@keyframes mihoPartsWaveRight{from{transform:rotate(-24deg) translateY(-2px)}to{transform:rotate(-58deg) translate(2px,-8px)}}
@keyframes mihoPartsFriendlyHead{from{transform:translate(var(--miho-head-x,0),var(--miho-head-y,0)) rotate(-3deg)}to{transform:translate(var(--miho-head-x,0),calc(var(--miho-head-y,0px) - 4px)) rotate(4deg)}}
@keyframes mihoPartsStretchLeft{from{transform:rotate(0)}to{transform:rotate(31deg) translate(-3px,-8px)}}
@keyframes mihoPartsStretchRight{from{transform:rotate(0)}to{transform:rotate(-31deg) translate(3px,-8px)}}
@keyframes mihoPartsClapLeft{from{transform:rotate(0)}to{transform:rotate(-32deg) translate(5px,-3px)}}
@keyframes mihoPartsClapRight{from{transform:rotate(0)}to{transform:rotate(32deg) translate(-5px,-3px)}}
@keyframes mihoPartsGiggleHead{from{transform:translateX(-3px) rotate(-2deg)}to{transform:translateX(3px) rotate(2deg)}}
@keyframes mihoPartsGiggleLeft{from{transform:rotate(-3deg)}to{transform:rotate(7deg)}}
@keyframes mihoPartsGiggleRight{from{transform:rotate(3deg)}to{transform:rotate(-7deg)}}
@keyframes mihoPartsBlink{0%,88%,93%,100%{opacity:0}89%,92%{opacity:1}}
@keyframes mihoRigMouthTalk{from{transform:scale(.76,.24);border-radius:50%}to{transform:scale(1.08,1.35);border-radius:36% 36% 62% 62%}}
@keyframes mihoRigTalkLeft{from{transform:rotate(2deg)}to{transform:rotate(13deg) translateY(-2px)}}
@keyframes mihoRigTalkRight{from{transform:rotate(-2deg)}to{transform:rotate(-12deg) translateY(-3px)}}
@keyframes mihoRigListenHead{from{transform:translate(var(--miho-head-x,0),var(--miho-head-y,0)) rotate(-3deg) translateY(0)}to{transform:translate(var(--miho-head-x,0),calc(var(--miho-head-y,0px) - 5px)) rotate(4deg)}}
@keyframes mihoRigListenLeft{from{transform:rotate(-2deg)}to{transform:rotate(7deg) translateY(-2px)}}
@keyframes mihoRigListenRight{from{transform:rotate(2deg)}to{transform:rotate(-7deg) translateY(-2px)}}
@keyframes mihoRigThinkHead{0%,100%{transform:translate(-3px,-1px) rotate(-4deg)}50%{transform:translate(4px,-5px) rotate(5deg)}}
@keyframes mihoRigThinkBody{0%,100%{transform:scale(1) translateY(0)}50%{transform:scale(1.015,1.03) translateY(-2px)}}
@keyframes mihoPartsError{from{transform:translateX(-2px)}to{transform:translateX(2px)}}

/* MIHO articulated body v4: the same live robot is used in every activity. */
.student-companion .miho-articulated{display:block;width:238px;height:272px;top:-1px}
.student-companion .miho-pose-sprite{display:none!important}
.student-companion .miho-piece-head{
  top:-10px;overflow:visible;transform-origin:50% 91%
}
.student-companion .miho-piece-head::before,
.student-companion .miho-piece-head::after{display:none}
.miho-neck{
  position:absolute;z-index:3;left:101px;top:113px;width:37px;height:32px;
  border:2px solid rgba(70,224,255,.58);border-radius:13px 13px 17px 17px;
  background:linear-gradient(90deg,#11253a 0 16%,#dceaf0 18% 42%,#8ca4b0 48% 57%,#eef6f8 63% 83%,#132c42 85%);
  box-shadow:0 0 9px rgba(38,220,255,.42),inset 0 -7px 8px rgba(3,12,26,.55)
}
.student-companion .miho-piece-torso{top:121px}
.student-companion .miho-piece-arm-left{z-index:5;left:31px;top:126px}
.student-companion .miho-piece-arm-right{z-index:5;left:156px;top:126px}
.student-companion .miho-piece-leg-left{left:57px;top:192px;width:58px;height:84px}
.student-companion .miho-piece-leg-right{left:123px;top:192px;width:58px;height:84px}

/* The dark masks cover the eyes baked into the accepted head artwork. */
.miho-rig-face{position:absolute;z-index:9;inset:0;display:block;pointer-events:none}
.miho-rig-eye{
  position:absolute;top:71px;width:49px;height:36px;border-radius:50%;
  background:radial-gradient(ellipse at center,#020711 0 69%,rgba(2,7,17,.98) 75%,transparent 77%);
  transition:transform .26s ease
}
.miho-rig-eye-left{left:50px}.miho-rig-eye-right{right:25px}
.miho-rig-eye::before{
  content:"";position:absolute;left:50%;top:50%;width:17px;height:25px;border-radius:55% 55% 48% 48%;
  background:linear-gradient(180deg,#a9fbff 0 14%,#25eaff 18% 55%,#079ad8 58% 100%);
  box-shadow:0 0 8px #21e8ff,0 0 17px rgba(16,203,255,.62),inset 0 -6px 0 rgba(0,63,120,.42);
  transform:translate(calc(-50% + var(--miho-eye-x,0px)),calc(-50% + var(--miho-eye-y,0px))) scaleY(1);
  transform-origin:50% 58%;will-change:transform
}
.miho-rig-eye-left::before{animation:mihoBlinkLeft 5.8s ease-in-out infinite}
.miho-rig-eye-right::before{animation:mihoBlinkRight 7.1s ease-in-out 1.2s infinite}
.student-companion[data-emotion="sad"] .miho-rig-eye-left{transform:rotate(11deg)}
.student-companion[data-emotion="sad"] .miho-rig-eye-right{transform:rotate(-11deg)}
.student-companion[data-emotion="confused"] .miho-rig-eye-left{transform:translateY(3px) scale(.9)}
.student-companion[data-emotion="confused"] .miho-rig-eye-right{transform:translateY(-3px) scale(1.08)}
.student-companion[data-emotion="happy"] .miho-rig-eye::before{height:21px;border-radius:50% 50% 42% 42%}
.miho-rig-mouth{
  display:block;position:absolute;z-index:10;left:83px;top:106px;width:25px;height:10px;
  border:0;border-bottom:4px solid #35eaff;border-radius:0 0 22px 22px;background:transparent;
  box-shadow:0 3px 7px rgba(20,223,255,.46);opacity:1;transform-origin:50% 35%;transition:all .2s ease
}
.student-companion[data-emotion="happy"] .miho-rig-mouth{left:80px;width:31px;height:12px}
.student-companion[data-emotion="sad"] .miho-rig-mouth{top:112px;border-bottom:0;border-top:3px solid #35eaff;border-radius:18px 18px 0 0;box-shadow:0 -2px 7px rgba(20,223,255,.35)}
.student-companion[data-voice="speaking"] .miho-rig-mouth{
  top:105px;left:84px;width:23px;height:12px;border:2px solid #78f6ff;border-radius:50%;
  background:#043149;box-shadow:0 0 9px #14dfff,inset 0 -3px 0 #17bfe4;
  animation:mihoRigMouthTalkV4 .2s ease-in-out infinite alternate
}

/* Approaching or hovering raises both hands, never only one. */
.student-companion.is-curious:not(.is-dragging) .miho-piece-arm-left,
.student-companion-robot:hover .miho-piece-arm-left{z-index:8;animation:mihoBothHandsLeft .52s ease-in-out infinite alternate}
.student-companion.is-curious:not(.is-dragging) .miho-piece-arm-right,
.student-companion-robot:hover .miho-piece-arm-right{z-index:8;animation:mihoBothHandsRight .52s ease-in-out infinite alternate}
.student-companion.is-curious:not(.is-dragging) .miho-piece-head,
.student-companion-robot:hover .miho-piece-head{animation:mihoPartsFriendlyHead .7s ease-in-out infinite alternate}

/* Text mode is visibly separate from the microphone action. */
.miho-text-field{min-width:0;display:grid;align-content:center;gap:2px;padding:0 4px}
.miho-text-field span{color:#52dff7;font-size:7px;font-weight:800;letter-spacing:.55px;text-transform:uppercase}
.miho-text-field input{width:100%}
.miho-composer:focus-within{border-color:rgba(71,228,255,.62);box-shadow:0 0 0 3px rgba(46,219,255,.08)}

@keyframes mihoBlinkLeft{
  0%,37%,43%,84%,90%,100%{transform:translate(calc(-50% + var(--miho-eye-x,0px)),calc(-50% + var(--miho-eye-y,0px))) scaleY(1)}
  40%,87%{transform:translate(calc(-50% + var(--miho-eye-x,0px)),calc(-50% + var(--miho-eye-y,0px))) scaleY(.07)}
}
@keyframes mihoBlinkRight{
  0%,18%,24%,67%,73%,100%{transform:translate(calc(-50% + var(--miho-eye-x,0px)),calc(-50% + var(--miho-eye-y,0px))) scaleY(1)}
  21%,70%{transform:translate(calc(-50% + var(--miho-eye-x,0px)),calc(-50% + var(--miho-eye-y,0px))) scaleY(.07)}
}
@keyframes mihoBothHandsLeft{from{transform:rotate(126deg) translate(-3px,-7px)}to{transform:rotate(140deg) translate(-5px,-11px)}}
@keyframes mihoBothHandsRight{from{transform:rotate(-126deg) translate(3px,-7px)}to{transform:rotate(-140deg) translate(5px,-11px)}}
@keyframes mihoRigMouthTalkV4{from{transform:scale(.8,.3)}to{transform:scale(1.08,1.24)}}

/* Cartoon rig v4: blank visor, clean pivots, and softer app-mascot proportions. */
.student-companion .miho-piece-head{left:16px;top:-6px;width:206px;height:157px;transform-origin:50% 88%}
.student-companion .miho-neck{display:block;left:102px;top:130px;width:35px;height:27px;border:3px solid #1fe6ff;border-radius:13px;background:linear-gradient(180deg,#314467,#111c36);box-shadow:0 0 8px rgba(31,230,255,.55),inset 0 4px 5px rgba(255,255,255,.13)}
.student-companion .miho-piece-torso{left:59px;top:128px;width:120px;height:112px}
.student-companion .miho-piece-arm-left{left:38px;top:144px;width:56px;height:84px;transform-origin:50% 12%}
.student-companion .miho-piece-arm-right{left:144px;top:144px;width:56px;height:84px;transform-origin:50% 12%}
.student-companion .miho-piece-leg-left{left:52px;top:205px;width:63px;height:82px;transform-origin:50% 9%}
.student-companion .miho-piece-leg-right{left:123px;top:205px;width:63px;height:82px;transform-origin:50% 9%}
.student-companion .miho-articulated{
  scale:.85;transform-origin:50% 92%;
  filter:drop-shadow(0 14px 10px rgba(0,4,20,.42)) drop-shadow(0 0 5px rgba(38,225,255,.16))
}
.miho-rig-eye{top:70px;width:34px;height:38px;background:none}
.miho-rig-eye-left{left:53px}.miho-rig-eye-right{right:53px}
.miho-rig-eye::before{
  width:25px;height:29px;border:0;border-radius:48% 48% 52% 52%;
  background:radial-gradient(circle at 58% 27%,#eaffff 0 7%,transparent 8%),linear-gradient(180deg,#aafcff 0 17%,#2cecff 20% 62%,#078fd5 65% 100%);
  box-shadow:0 0 7px #25eaff,0 0 15px rgba(16,203,255,.58),inset 0 -5px 0 rgba(0,58,122,.34)
}
.miho-rig-eye::after{content:"";position:absolute;z-index:2;left:56%;top:25%;width:6px;height:6px;border-radius:50%;background:#f4ffff;box-shadow:0 0 5px #fff;transform:translate(var(--miho-eye-x,0px),var(--miho-eye-y,0px))}
.miho-rig-eye-left::after{animation:mihoBlinkGlintLeft 5.8s steps(1,end) infinite}
.miho-rig-eye-right::after{animation:mihoBlinkGlintRight 7.1s steps(1,end) 1.2s infinite}
.student-companion[data-emotion="happy"] .miho-rig-eye::before{width:27px;height:27px;border-radius:50% 50% 44% 44%}
.miho-rig-mouth{left:90px;top:117px;width:27px;height:10px;border-bottom-width:4px}
.student-companion[data-emotion="happy"] .miho-rig-mouth{left:86px;top:115px;width:35px}
.student-companion[data-emotion="sad"] .miho-rig-mouth{left:91px;top:122px}
.student-companion[data-voice="speaking"] .miho-rig-mouth{left:91px;top:114px;width:25px;height:14px}
.student-companion.is-curious:not(.is-dragging) .miho-piece-arm-left,
.student-companion-robot:hover .miho-piece-arm-left{z-index:7;animation:mihoCartoonHandsLeft .55s ease-in-out infinite alternate}
.student-companion.is-curious:not(.is-dragging) .miho-piece-arm-right,
.student-companion-robot:hover .miho-piece-arm-right{z-index:7;animation:mihoCartoonHandsRight .55s ease-in-out infinite alternate}
@keyframes mihoCartoonHandsLeft{from{transform:rotate(128deg) translate(-1px,-5px)}to{transform:rotate(145deg) translate(-3px,-9px)}}
@keyframes mihoCartoonHandsRight{from{transform:rotate(-128deg) translate(1px,-5px)}to{transform:rotate(-145deg) translate(3px,-9px)}}
@keyframes mihoBlinkGlintLeft{0%,37%,43%,84%,90%,100%{opacity:1}40%,87%{opacity:0}}
@keyframes mihoBlinkGlintRight{0%,18%,24%,67%,73%,100%{opacity:1}21%,70%{opacity:0}}

/* 3D MIHO rig v6 — one coherent render, split into independently animated layers. */
.student-companion .miho-articulated{
  scale:.85;transform-origin:50% 92%;
  filter:drop-shadow(0 14px 11px rgba(0,4,20,.46)) drop-shadow(0 0 7px rgba(33,225,255,.18))
}
.student-companion .miho-neck{display:none}
.student-companion .miho-piece{
  background-image:url("assets/robot/miho-3d-rig-v6.png");
  background-repeat:no-repeat;background-color:transparent
}
.student-companion .miho-piece-head{
  left:24px;top:-8px;width:190px;height:180px;
  background-size:437px 437px;background-position:0 -31px;
  transform-origin:50% 88%
}
.student-companion .miho-piece-torso{
  left:58px;top:139px;width:126px;height:105px;
  background-size:328px 328px;background-position:-141px -60px;
  transform-origin:50% 20%
}
.student-companion .miho-piece-arm-left{
  left:32px;top:148px;width:70px;height:91px;
  background-size:241px 241px;background-position:-14px -132px;
  transform-origin:88% 8%
}
.student-companion .miho-piece-arm-right{
  left:151px;top:148px;width:51px;height:91px;
  background-size:290px 290px;background-position:-239px -55px;
  transform-origin:12% 8%
}
.student-companion .miho-piece-leg-left{
  left:55px;top:221px;width:64px;height:87px;
  background-size:224px 224px;background-position:-82px -124px;
  transform-origin:50% 8%
}
.student-companion .miho-piece-leg-right{
  left:121px;top:221px;width:64px;height:87px;
  background-size:224px 224px;background-position:-161px -124px;
  transform-origin:50% 8%
}
.student-companion .miho-rig-eye{top:99px;width:36px;height:38px}
.student-companion .miho-rig-eye-left{left:51px}
.student-companion .miho-rig-eye-right{right:51px}
.student-companion .miho-rig-eye::before{width:25px;height:29px}
.student-companion .miho-rig-mouth{left:81px;top:134px;width:28px;height:10px}
.student-companion[data-emotion="happy"] .miho-rig-mouth{left:77px;top:132px;width:36px}
.student-companion[data-emotion="sad"] .miho-rig-mouth{left:82px;top:139px}
.student-companion[data-voice="speaking"] .miho-rig-mouth{left:82px;top:131px;width:26px;height:14px}

/* 3D rig v7: readable neck, friendly arc eyes, and hands that never cover the face. */
.student-companion .miho-neck{
  display:block;z-index:3;left:99px;top:137px;width:40px;height:30px;
  border:2px solid rgba(76,239,255,.78);border-radius:45% 45% 52% 52%;
  background:linear-gradient(90deg,#071a35 0 17%,#173c61 25% 50%,#071a35 83% 100%);
  box-shadow:0 0 7px rgba(38,226,255,.46),inset 0 4px 7px rgba(89,205,255,.2),inset 0 -5px 7px rgba(0,4,18,.72)
}
.student-companion .miho-rig-eye{top:102px;width:38px;height:24px}
.student-companion .miho-rig-eye-left{left:47px}
.student-companion .miho-rig-eye-right{right:47px}
.student-companion .miho-rig-eye::before{
  box-sizing:border-box;width:31px;height:23px;border:0;border-top:6px solid #67f5ff;
  border-radius:50%;background:transparent;
  box-shadow:0 -2px 5px rgba(76,239,255,.88),0 -5px 12px rgba(23,204,255,.38)
}
.student-companion .miho-rig-eye::after{display:none}
.student-companion[data-emotion="happy"] .miho-rig-eye::before{
  width:33px;height:24px;border:0;border-top:6px solid #7cf8ff;border-radius:50%
}
.student-companion.is-curious:not(.is-dragging) .miho-piece-arm-left,
.student-companion-robot:hover .miho-piece-arm-left{z-index:5;animation:miho3dHandsLeft .55s ease-in-out infinite alternate}
.student-companion.is-curious:not(.is-dragging) .miho-piece-arm-right,
.student-companion-robot:hover .miho-piece-arm-right{z-index:5;animation:miho3dHandsRight .55s ease-in-out infinite alternate}
@keyframes miho3dHandsLeft{from{transform:rotate(62deg) translate(-2px,-3px)}to{transform:rotate(76deg) translate(-3px,-6px)}}
@keyframes miho3dHandsRight{from{transform:rotate(-62deg) translate(2px,-3px)}to{transform:rotate(-76deg) translate(3px,-6px)}}

@media(max-width:700px){
  .student-companion{width:194px;height:218px}.student-companion-robot{right:2px;width:188px;height:210px}.miho-sprite{left:5px;top:4px;width:178px;height:178px}.miho-articulated{left:5px;top:4px;width:238px;height:238px;scale:.63;transform-origin:0 0}.miho-listening-waves{right:3px;top:31px;scale:.7}.student-companion-card{right:0;bottom:205px;width:min(380px,calc(100vw - 24px))}.student-companion.panel-right .student-companion-card{left:0}.student-companion.panel-down .student-companion-card{top:190px}.miho-thread{height:210px}
}
@media(prefers-reduced-motion:reduce){.student-companion,.student-companion *{animation:none!important;transition:none!important}}
