/* THE GOOD MAKER — Capocho animé (généré par DEVS/Capocho-Animation/build-site-component.py) */
.capocho { display: block; aspect-ratio: 2160 / 1980; }
.capocho[data-part="head"] { aspect-ratio: 1600 / 1300; }
/* Tête seule (section formulaire) : oreilles et clignements un peu plus fréquents */
.capocho[data-part="head"] .earR { animation-duration: 4.4s; }
.capocho[data-part="head"] .earL { animation-duration: 5.6s; animation-delay: .8s; }
.capocho[data-part="head"] .eyeR, .capocho[data-part="head"] .eyeL { animation-duration: 3.6s; }
.capocho__svg { display: block; width: 100%; height: auto; overflow: visible; }
.capocho__svg g { transform-box: view-box; }
.capocho[data-capocho]:not([aria-hidden="true"]) { cursor: pointer; }
.capocho--paused .capocho__svg * { animation-play-state: paused !important; }
.capocho__svg .breath { transform-origin: 1700px 2150px; animation: capo-breathe 3.4s ease-in-out infinite; }
@keyframes capo-breathe { 50% { transform: scale(1.008, 1.022); } }
.capocho__svg .tail { transform-origin: 2040px 1800px; animation: capo-wag 2.2s ease-in-out infinite; }
@keyframes capo-wag { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(6deg); } }
.capocho__svg .head { transform-origin: 1450px 1550px; transition: transform .25s ease-out; }
.capocho__svg .earR { transform-origin: 1850px 1050px; animation: capo-twitchR 6.5s infinite; }
.capocho__svg .earL { transform-origin: 1300px 850px; animation: capo-twitchL 8.3s 1.2s infinite; }
@keyframes capo-twitchR { 0%, 88%, 100% { transform: rotate(0); } 91% { transform: rotate(7deg); } 94% { transform: rotate(-4deg); } 97% { transform: rotate(3deg); } }
@keyframes capo-twitchL { 0%, 90%, 100% { transform: rotate(0); } 93% { transform: rotate(-8deg); } 96% { transform: rotate(4deg); } }
.capocho__svg .eyeR { transform-origin: 1704px 1269px; animation: capo-blink 4.6s infinite; }
.capocho__svg .eyeL { transform-origin: 1129px 1115px; animation: capo-blink 4.6s infinite; }
@keyframes capo-blink { 0%, 93%, 98%, 100% { transform: scaleY(1); } 95.5% { transform: scaleY(.06); } }
.capocho__svg .pup { transition: transform .15s ease-out; transform-box: fill-box; transform-origin: center; }
.capocho__svg .eye { transition: opacity .15s, transform .2s; }
.capocho__svg .heartEye { fill: #ff0077; opacity: 0; transition: opacity .15s; }
.capocho__svg .hb { transform-box: view-box; }
.capocho__svg .arcs path { fill: none; stroke: #fcfcfc; stroke-width: 62; stroke-linecap: round; opacity: 0; transition: opacity .15s; }
.capocho__svg .fx { opacity: 0; transition: opacity .2s; pointer-events: none; }
.capocho__svg .fh { fill: #fff; opacity: 0; animation: capo-rise 2.1s ease-out infinite; }
.capocho__svg .st { fill: none; stroke: #fff; stroke-width: 34; stroke-linecap: round; animation: capo-wob 1.5s ease-in-out infinite; }
@keyframes capo-rise { 0% { translate: 0 90px; opacity: 0; scale: .5; } 20% { opacity: 1; } 100% { translate: 0 -240px; opacity: 0; scale: 1.1; } }
@keyframes capo-wob { 0%, 100% { translate: 0 0; opacity: .9; } 50% { translate: 18px -50px; opacity: .3; } }
/* Expressions (data-exp sur le svg) : le blanc de l'oeil est coupé net, aucune paupière posée dessus */
.capocho__svg[data-exp="angry"] .eyeR .white { clip-path: url(#capo-c-angryR); } .capocho__svg[data-exp="angry"] .eyeL .white { clip-path: url(#capo-c-angryL); }
.capocho__svg[data-exp="sad"] .eyeR .white { clip-path: url(#capo-c-sadR); } .capocho__svg[data-exp="sad"] .eyeL .white { clip-path: url(#capo-c-sadL); }
.capocho__svg[data-exp="sleepy"] .eyeR .white { clip-path: url(#capo-c-sleepyR); } .capocho__svg[data-exp="sleepy"] .eyeL .white { clip-path: url(#capo-c-sleepyL); }
.capocho__svg[data-exp="disgust"] .eyeR .white { clip-path: url(#capo-c-disgustR); } .capocho__svg[data-exp="disgust"] .eyeL .white { clip-path: url(#capo-c-disgustL); }
.capocho__svg[data-exp="happy"] .eye { opacity: 0; } .capocho__svg[data-exp="happy"] .arcs path { opacity: 1; }
.capocho__svg[data-exp="happy"] .tail { animation-duration: .5s; }
.capocho__svg[data-exp="angry"] .tail { animation-duration: .35s; }
.capocho__svg[data-exp="angry"] .earR, .capocho__svg[data-exp="angry"] .earL { animation: none; }
.capocho__svg[data-exp="sad"] .tail, .capocho__svg[data-exp="sleepy"] .tail { animation-duration: 5s; }
.capocho__svg[data-exp="surprised"] .eye { transform: scale(1.1); }
.capocho__svg[data-exp="surprised"] .pupR, .capocho__svg[data-exp="surprised"] .pupL { transform: scale(.62); }
.capocho__svg[data-exp="love"] .pup { opacity: 0; }
.capocho__svg[data-exp="love"] .heartEye { opacity: 1; }
.capocho__svg[data-exp="love"] .hb { animation: capo-beat .62s ease-in-out infinite; }
@keyframes capo-beat { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.14); } }
.capocho__svg[data-exp="love"] .fxlove { opacity: 1; }
.capocho__svg[data-exp="love"] .tail { animation-duration: .4s; }
.capocho__svg[data-exp="disgust"] .fxstink { opacity: 1; }
.capocho__svg[data-exp="disgust"] .pupR, .capocho__svg[data-exp="disgust"] .pupL { transform: translate(-26px, 78px) scale(.7) !important; }
.capocho__svg[data-exp="disgust"] .earR { animation: none; transform: rotate(24deg); }
.capocho__svg[data-exp="disgust"] .earL { animation: none; transform: rotate(-24deg); }
.capocho__svg[data-exp="disgust"] .head { transform: rotate(-5deg) translate(30px, 10px) !important; }
.capocho__svg[data-exp="disgust"] .tail { animation-duration: 6s; }
@media (prefers-reduced-motion: reduce) { .capocho__svg * { animation: none !important; } }