.d44-morg { width:100%; --morg-size:190px; }
.d44-morg[hidden], .d44-morg-dock [hidden] { display:none!important; }
body .d44-morg-sticky { position:sticky!important; top:var(--morg-sticky-top,24px)!important; align-self:flex-start; }
.d44-morg-dock { position:fixed; right:12px; bottom:calc(var(--morg-mobile-bottom,80px) + env(safe-area-inset-bottom,0px)); width:var(--morg-mobile-size,100px); z-index:1040; pointer-events:none; }
.d44-morg-dock .d44-morg { --morg-size:var(--morg-mobile-size,100px)!important; }
.d44-morg-dock .d44-morg__character, .d44-morg-dock button { pointer-events:auto; }
.d44-morg-dock button { font:13px/1.2 system-ui,sans-serif; margin:0; min-height:28px; padding:4px 8px; border:1px solid #aaa; border-radius:8px; color:#29252d; background:#fff; cursor:pointer; }
.d44-morg-dock__close { position:absolute; top:0; right:-4px; }
.d44-morg-dock__open { display:block; margin-left:auto!important; }
.d44-morg-dock .d44-morg__speech-slot { position:relative; height:0!important; }
.d44-morg-dock .d44-morg__speech { position:absolute; bottom:12px; right:0; width:min(240px,calc(100vw - 24px)); pointer-events:auto; }
@media(max-width:849px) { .d44-morg-mobile-hidden { display:none!important; } }
.d44-morg__speech-slot { display:none; }
.d44-morg[data-speech="enabled"] .d44-morg__speech-slot { height:96px; display:flex; align-items:center; justify-content:center; }
.d44-morg .d44-morg__speech { position:relative; box-sizing:border-box; width:min(100%,260px); margin:0; padding:10px 12px; color:#27232d; background:#fff; border:1px solid #b9afc5; border-radius:12px; box-shadow:0 3px 10px #0000000b; font:14px/1.4 system-ui,sans-serif; overflow-wrap:anywhere; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.d44-morg__speech[hidden] { display:none!important; }
/* All layers use the same portrait canvas. Only articulated parts move. */
.d44-morg__stage { position:relative; width:100%; height:calc(var(--morg-size,190px) * 1.5 + 5px); display:flex; justify-content:center; align-items:flex-end; overflow:visible; }
.d44-morg__character { position:relative; width:var(--morg-size,190px); max-width:100%; aspect-ratio:2/3; cursor:pointer; isolation:isolate; user-select:none; -webkit-user-select:none; }
.d44-morg__character:focus-visible { outline:2px solid #7952b3; outline-offset:5px; }
.d44-morg__character .d44-morg__layer, .d44-morg__head-rig { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.d44-morg__character .d44-morg__layer { display:block; object-fit:contain; }
.d44-morg__body { z-index:1; clip-path:polygon(0 37%,100% 37%,100% 47%,66% 47%,65% 60%,73% 64%,100% 64%,100% 100%,0 100%); }
.d44-morg__head { clip-path:inset(0 0 62.5% 0); }
.d44-morg__hand-rig { position:absolute; z-index:2; left:54%; top:43.8%; width:22%; height:22%; pointer-events:none; transform-origin:63% 5%; transform:rotate(-11deg); }
.d44-morg__hand-rig img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.d44-morg__hand-tap { opacity:0; }
.d44-morg__character[data-tap="down"] .d44-morg__hand-rest { opacity:0; }
.d44-morg__character[data-tap="down"] .d44-morg__hand-tap { opacity:1; }
.d44-morg__head-rig { z-index:3; transform-origin:52% 39%; transition:transform 260ms ease-in-out; }
.d44-morg__pupils { z-index:2; transition:transform 90ms linear; }
.d44-morg__half-blink { z-index:3; }
.d44-morg__closed { z-index:4; }
.d44-morg__character .d44-morg__hidden { opacity:0; }
.d44-morg[data-assets="failed"] .d44-morg__body { clip-path:none; }
.d44-morg[data-assets="failed"] .d44-morg__head-rig,
.d44-morg[data-assets="failed"] .d44-morg__hand-rig { display:none; }

/* No animation or transform is applied to the complete character or torso. */
.d44-morg__character[data-state="curious"] .d44-morg__head-rig { animation:d44-morg-head-glance 1800ms ease-in-out; }
.d44-morg__character[data-state="nod"] .d44-morg__head-rig { animation:d44-morg-head-nod 850ms ease-in-out; }
.d44-morg__character[data-state="startled"] .d44-morg__head-rig { animation:d44-morg-head-startle 850ms ease-out; }
.d44-morg__character[data-state="bored"] .d44-morg__head-rig { transform:rotate(5deg) translateY(1px); }
.d44-morg__character[data-state="sleeping"] .d44-morg__head-rig { transform:rotate(8deg) translateY(2px); }
.d44-morg__character[data-state="waking"] .d44-morg__head-rig { animation:d44-morg-head-wake 900ms ease-out; }
@keyframes d44-morg-head-glance { 0%,100%{transform:rotate(0)} 25%,65%{transform:rotate(-5deg)} }
@keyframes d44-morg-head-nod { 0%,100%{transform:rotate(0)} 28%,70%{transform:rotate(4deg) translateY(2px)} 48%{transform:rotate(-2deg)} }
@keyframes d44-morg-head-startle { 0%,100%{transform:rotate(0)} 25%{transform:rotate(-6deg) translateY(-2px)} 55%{transform:rotate(2deg)} }
@keyframes d44-morg-head-wake { 0%{transform:rotate(8deg) translateY(2px)} 45%{transform:rotate(-4deg)} 100%{transform:rotate(0)} }
@media(prefers-reduced-motion:reduce) {
    .d44-morg__character:not([data-motion="enabled"]) .d44-morg__head-rig { animation:none!important; transition:none; transform:none; }
    .d44-morg__character:not([data-motion="enabled"]) .d44-morg__pupils { transition:none; }
}

.d44-morg img { margin:0; padding:0; border:0; border-radius:0; box-shadow:none; max-width:none; }
.d44-morg__character:not([role="button"]) { cursor:default; }

/* A small acknowledgement using the existing articulated head. */
.d44-morg__character[data-state="celebrating"] .d44-morg__head-rig { animation:d44-morg-head-nod 750ms ease-in-out 2; }

/* Debug is opt-in; controls travel with their widget and never submit a form. */
.d44-morg__debug { margin-top:12px; padding:8px; border:1px solid #aaa; border-radius:8px; background:#fff; color:#29252d; font:12px/1.4 system-ui,sans-serif; pointer-events:auto; }
.d44-morg__debug summary { cursor:pointer; font-weight:600; }
.d44-morg__debug p { margin:8px 0; font:inherit; }
.d44-morg__debug-controls { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; }
.d44-morg .d44-morg__debug button { font:inherit; min-width:0; min-height:30px; margin:0; padding:4px; border:1px solid #aaa; border-radius:4px; background:#f5f5f5; color:#29252d; cursor:pointer; text-transform:none; letter-spacing:normal; white-space:normal; }
.d44-morg-dock .d44-morg__debug { position:absolute; right:0; bottom:100%; width:min(260px,calc(100vw - 40px)); box-sizing:border-box; max-height:50vh; overflow:auto; }

/* Direction is separate from pose animation and the stationary torso/shirt.
   The neck pivot keeps both head directions attached to the same body. */
.d44-morg__head-facing { position:absolute; inset:0; transform-origin:52% 39%; }
.d44-morg[data-morg-facing="left"] .d44-morg__head-facing { transform:scaleX(-1); }

.d44-morg__debug select { max-width:100%; font:inherit; height:auto; padding:4px; margin:4px 0 0; }
