/* ── Buddy Character — frei schwebend am unteren Rand ── */
#buddy {
  position:fixed; bottom:calc(12px + env(safe-area-inset-bottom, 0px)); left:80px; z-index:9990;
  cursor:pointer; user-select:none; transition:left 0s;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.25));
}
#buddy.first-visit { animation: buddyAttention 1.5s ease-in-out 20; }
@keyframes buddyAttention {
  0%,100% { filter:drop-shadow(0 3px 8px rgba(0,0,0,.25)); }
  50% { filter:drop-shadow(0 0 16px rgba(16,185,129,0.7)) drop-shadow(0 3px 8px rgba(0,0,0,.25)); }
}
#buddy-char {
  font-size:2.8rem; line-height:1;
  transition:transform .3s cubic-bezier(.34,1.56,.64,1);
  display:block;
}
#buddy:hover #buddy-char { transform:scale(1.2); }
#buddy.walk #buddy-char { animation:buddyWalk .4s ease infinite; }
#buddy.idle #buddy-char { animation:buddyIdle 8s ease-in-out infinite; }
#buddy.sleep #buddy-char { animation:buddySleep 2s ease-in-out infinite; opacity:.7; }
#buddy.high #buddy-char  { animation:buddyHigh 3s ease-in-out infinite; }
#buddy.excited #buddy-char { animation:buddyExcited 1s ease infinite; }
#buddy.flip #buddy-char  { animation:buddyFlip .6s ease forwards; }

/* Richtung: Standard = rechts-schauend */
#buddy.face-left #buddy-char { transform:scaleX(-1); }
#buddy.walk.face-left #buddy-char { animation:buddyWalkL .4s ease infinite; }

@keyframes buddyWalk {
  0%,100% { transform:translateY(0) rotate(-3deg); }
  50%     { transform:translateY(-6px) rotate(3deg); }
}
@keyframes buddyWalkL {
  0%,100% { transform:scaleX(-1) translateY(0) rotate(3deg); }
  50%     { transform:scaleX(-1) translateY(-6px) rotate(-3deg); }
}
@keyframes buddyIdle {
  0%,100% { transform:translateY(0) rotate(0); }
  50%     { transform:translateY(-1.5px) rotate(0); }
}
@keyframes buddySleep {
  0%,100% { transform:translateY(0) rotate(-5deg); }
  50%     { transform:translateY(2px) rotate(-8deg); }
}
@keyframes buddyHigh {
  0%,100% { transform:rotate(-2deg) scale(1.02); }
  50%     { transform:rotate(2deg) scale(1.04); }
}
@keyframes buddyExcited {
  0%,100% { transform:translateY(0) scale(1); }
  50%     { transform:translateY(-6px) scale(1.08); }
}
@keyframes buddyFlip {
  0%   { transform:rotate(0deg); }
  100% { transform:rotate(360deg); }
}

/* Mood indicator — kleines Emoji über dem Kopf */
#buddy-mood {
  position:absolute; top:-18px; left:50%; transform:translateX(-50%);
  font-size:.9rem; animation:moodFloat 2s ease-in-out infinite;
}
@keyframes moodFloat { 0%,100%{transform:translateX(-50%) translateY(0);} 50%{transform:translateX(-50%) translateY(-4px);} }

/* Z's für Sleepy */
.buddy-z {
  position:absolute; font-size:.7rem; font-weight:900; color:#6b7280;
  animation:zUp 2s ease-in-out infinite;
}
.buddy-z:nth-child(1) { top:-22px; right:-5px; }
.buddy-z:nth-child(2) { top:-32px; right:-12px; animation-delay:.5s; font-size:.55rem; }
.buddy-z:nth-child(3) { top:-38px; right:-3px; animation-delay:1s; font-size:.45rem; }
@keyframes zUp {
  0%{opacity:0;transform:translateY(0)} 50%{opacity:1;transform:translateY(-8px)} 100%{opacity:0;transform:translateY(-18px)}
}

/* Accessories auf dem Charakter */
#buddy-accs { position:absolute; top:0; left:0; width:100%; height:100%; pointer-events:none; }
.b-acc { position:absolute; font-size:1rem; filter:drop-shadow(0 1px 2px rgba(0,0,0,.3)); }
.b-acc-hat     { top:-14px; left:50%; transform:translateX(-50%); }
.b-acc-glasses { top:6px; left:50%; transform:translateX(-50%); font-size:.85rem; }
.b-acc-chain   { bottom:2px; left:50%; transform:translateX(-50%); font-size:.75rem; }
.b-acc-smoke   { top:4px; right:-12px; font-size:.85rem; }
.b-acc-cosmetic { bottom:-2px; right:-10px; font-size:.85rem; }

/* ── Sprechblase — direkt über dem Buddy ── */
#buddy-speech {
  position:fixed; bottom:calc(105px + env(safe-area-inset-bottom, 0px)); z-index:9991;
  max-width:240px; padding:10px 14px; background:#fff;
  border-radius:16px 16px 16px 4px;
  box-shadow:0 4px 20px rgba(0,0,0,.18);
  font-size:.82rem; color:#1b4332; line-height:1.4;
  opacity:0; transform:translateY(8px) scale(.9);
  transition:all .3s cubic-bezier(.34,1.56,.64,1);
  pointer-events:none;
}
#buddy-speech.show { opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
#buddy-speech::after {
  content:''; position:absolute; bottom:-8px; left:20px;
  border:8px solid transparent; border-top-color:#fff; border-bottom:0;
}

/* Buddy Name-Tag */
#buddy-tag {
  position:absolute; bottom:-16px; left:50%; transform:translateX(-50%);
  font-size:.55rem; font-weight:800; color:#fff;
  background:rgba(27,67,50,.8); padding:1px 6px; border-radius:6px;
  white-space:nowrap; pointer-events:none;
}

/* ── Particle container (fixed, über dem Buddy) ── */
#buddy-fx {
  position:fixed; bottom:12px; z-index:9989;
  width:80px; height:80px; pointer-events:none;
}
.b-particle {
  position:absolute; font-size:1rem; pointer-events:none;
  animation:bParticle 1s ease-out forwards;
}
@keyframes bParticle {
  0%{opacity:1;transform:translate(0,0) scale(1)} 100%{opacity:0;transform:translate(var(--px),var(--py)) scale(.3)}
}
.b-confetti {
  position:absolute; font-size:.8rem; pointer-events:none;
  animation:bConfetti 1.5s ease-out forwards;
}
@keyframes bConfetti {
  0%{opacity:1;transform:translateY(0) rotate(0)} 100%{opacity:0;transform:translateY(80px) rotate(720deg)}
}

/* ── Popover Panel (kompakt, schwebt über Buddy) ── */
#buddy-pop {
  position:fixed; z-index:9993;
  width:300px; background:#fff; border-radius:18px;
  box-shadow:0 10px 50px rgba(0,0,0,.22);
  display:flex; flex-direction:column; overflow:hidden;
  transform:translateY(10px) scale(.9); opacity:0;
  transition:all .3s cubic-bezier(.34,1.56,.64,1);
  pointer-events:none; max-height:70vh; overflow-y:auto;
}
#buddy-pop.open { transform:translateY(0) scale(1); opacity:1; pointer-events:auto; }

/* Pop header */
.bpop-header {
  background:linear-gradient(135deg, #1b4332, #2d6a4f);
  color:#fff; padding:12px 16px;
  display:flex; align-items:center; justify-content:space-between;
  position:sticky; top:0; z-index:1;
}
.bpop-header-info { display:flex; align-items:center; gap:8px; }
.bpop-name { font-weight:800; font-size:.95rem; }
.bpop-stage { font-size:.7rem; opacity:.8; }
.bpop-close {
  background:rgba(255,255,255,.15); border:none; color:#fff;
  width:28px; height:28px; border-radius:50%; cursor:pointer;
  font-size:1rem; display:flex; align-items:center; justify-content:center;
}
.bpop-close:hover { background:rgba(255,255,255,.3); }

/* Stats */
.bpop-stats { padding:10px 16px; }
.bpop-stat { display:flex; align-items:center; gap:6px; margin-bottom:4px; font-size:.75rem; color:#555; }
.bpop-bar { flex:1; height:6px; background:#e5e7eb; border-radius:3px; overflow:hidden; }
.bpop-fill { height:100%; border-radius:3px; transition:width .5s ease; }
.bpop-fill-xp { background:linear-gradient(90deg,#52b788,#40916c); }
.bpop-fill-hunger { background:linear-gradient(90deg,#f59e0b,#d97706); }
.bpop-fill-happy { background:linear-gradient(90deg,#f472b6,#ec4899); }
.bpop-streak {
  display:inline-flex; align-items:center; gap:3px;
  background:#fff7ed; color:#ea580c; font-size:.68rem; font-weight:700;
  padding:2px 7px; border-radius:8px; border:1px solid #fed7aa; margin-top:2px;
}

/* Action buttons */
.bpop-actions { display:flex; gap:4px; padding:8px 16px; flex-wrap:wrap; }
.bpop-btn {
  flex:1; min-width:60px; padding:7px 4px; border:none; border-radius:10px;
  font-size:.72rem; font-weight:600; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; gap:1px;
  transition:all .15s;
}
.bpop-btn:hover { transform:scale(1.06); }
.bpop-btn:disabled { opacity:.5; cursor:not-allowed; transform:none!important; }
.bpop-btn .bi { font-size:1.1rem; }
.bpop-pet  { background:#d1fae5; color:#065f46; }
.bpop-feed { background:#fef3c7; color:#92400e; }
.bpop-drip { background:#ede9fe; color:#5b21b6; }
.bpop-game { background:#fce7f3; color:#9d174d; }
.bpop-char { background:#e0f2fe; color:#0369a1; }
.bpop-name { background:#f3f4f6; color:#374151; }

/* Sub-panels */
.bpop-sub { padding:8px 16px 12px; overflow-y:auto; max-height:240px; scrollbar-width:thin; border-top:1px solid #eee; }
.bpop-sub-item {
  display:flex; align-items:center; gap:8px; padding:6px;
  border-radius:8px; margin-bottom:4px; cursor:pointer;
  border:1px solid transparent; transition:background .15s;
}
.bpop-sub-item:hover { background:#f0fdf4; border-color:#bbf7d0; }
.bpop-sub-item.owned { opacity:.55; }
.bpop-sub-item.locked { opacity:.35; }
.bpop-sub-item.active-char { border:2px solid #40916c; background:#f0fdf4; }
.bpop-sub-emoji { font-size:1.3rem; }
.bpop-sub-info { flex:1; min-width:0; }
.bpop-sub-name { font-weight:700; font-size:.78rem; color:#1b4332; }
.bpop-sub-desc { font-size:.68rem; color:#6b7280; }
.bpop-sub-cost { font-size:.7rem; font-weight:700; color:#92400e; background:#fef3c7; padding:1px 6px; border-radius:6px; }
.bpop-sub-cost.got { background:#d1fae5; color:#065f46; }
.bpop-rarity-rare { border-left:3px solid #3b82f6; }
.bpop-rarity-epic { border-left:3px solid #a855f7; }
.bpop-rarity-legendary { border-left:3px solid #f59e0b; background:#fffbeb; }

/* Game arena */
.bpop-game-arena {
  position:relative; width:100%; height:180px;
  background:linear-gradient(180deg,#d8f3dc,#b7e4c7);
  border-radius:10px; overflow:hidden; cursor:crosshair;
}

/* ── Autonomous action animations ── */
#buddy.trip #buddy-char, #buddy.trip #buddy-css { animation:buddyTrip .3s ease infinite; }
#buddy.dance #buddy-char, #buddy.dance #buddy-css { animation:buddyDance .4s ease infinite; }
#buddy.peek #buddy-char, #buddy.peek #buddy-css { animation:buddyPeek 2s ease forwards; }
#buddy.fallen #buddy-char, #buddy.fallen #buddy-css { animation:buddyFall .5s ease forwards; }
#buddy.pushup #buddy-char, #buddy.pushup #buddy-css { animation:buddyPushup .6s ease infinite; }
#buddy.chase #buddy-char, #buddy.chase #buddy-css { animation:buddyChase .3s ease infinite; }
#buddy.wave #buddy-char, #buddy.wave #buddy-css { animation:buddyWave .5s ease infinite 3; }
#buddy.hide { transform:translateY(30px); transition:transform .5s ease; }
#buddy.hide #buddy-char, #buddy.hide #buddy-css { opacity:.4; }
#buddy.unhide { transform:translateY(0); transition:transform .3s ease; }

/* Drag & Drop */
#buddy.dragging { transform:scale(1.15); z-index:999999 !important; cursor:grabbing; }
#buddy.dragging #buddy-css { filter:drop-shadow(0 8px 16px rgba(0,0,0,.4)); }
#buddy.thrown .css-towlie { animation:thrownTumble .8s ease-out forwards; }
@keyframes thrownTumble {
  0% { transform:rotate(0); }
  100% { transform:rotate(720deg); }
}
#buddy.bounce .css-towlie { animation:landBounce .4s ease; }
@keyframes landBounce {
  0% { transform:translateY(0); }
  40% { transform:translateY(-15px) scaleY(.8); }
  70% { transform:translateY(0) scaleY(1.1) scaleX(.9); }
  100% { transform:translateY(0) scaleY(1) scaleX(1); }
}

/* ── Squash & Stretch ── */
@keyframes squashLand {
  0% { transform:scaleY(1) scaleX(1); }
  40% { transform:scaleY(0.6) scaleX(1.3); }
  70% { transform:scaleY(1.15) scaleX(0.9); }
  100% { transform:scaleY(1) scaleX(1); }
}
@keyframes stretchJump {
  0% { transform:scaleY(1) scaleX(1); }
  30% { transform:scaleY(1.3) scaleX(0.8); }
  60% { transform:scaleY(0.85) scaleX(1.1); }
  100% { transform:scaleY(1) scaleX(1); }
}
@keyframes wobbleSquish {
  0%,100% { transform:scaleY(1) scaleX(1); }
  25% { transform:scaleY(0.92) scaleX(1.06); }
  50% { transform:scaleY(1.04) scaleX(0.97); }
  75% { transform:scaleY(0.97) scaleX(1.03); }
}
#buddy.bounce .css-towlie { animation:squashLand .5s ease !important; }
#buddy.fallen .css-towlie { animation:squashLand .4s ease forwards !important; }
#buddy.excited .css-towlie { animation:stretchJump .5s ease infinite !important; }
#buddy.idle .css-towlie { animation:none; /* removed wobbleSquish — was causing jitter */ }

/* ── Advanced animations ── */
/* Climbing */
#buddy.climbing {
  transition:bottom .8s cubic-bezier(.4,0,.2,1), left .6s ease;
  z-index:99999;
}
#buddy.climbing #buddy-css, #buddy.climbing #buddy-char {
  animation:climbWiggle .3s ease infinite;
}
@keyframes climbWiggle {
  0%,100% { transform:rotate(-5deg); }
  50%     { transform:rotate(5deg); }
}
#buddy.sitting-on-card {
  z-index:99999;
}
#buddy.sitting-on-card #buddy-css, #buddy.sitting-on-card #buddy-char {
  animation:sitDangle 2s ease-in-out infinite;
}
@keyframes sitDangle {
  0%,100% { transform:translateY(0) rotate(-2deg); }
  50%     { transform:translateY(2px) rotate(2deg); }
}

/* Pole vault */
@keyframes poleVault {
  0%   { transform:translateY(0) rotate(0); }
  20%  { transform:translateY(0) rotate(-15deg); }
  40%  { transform:translateY(-120px) rotate(-30deg); }
  60%  { transform:translateY(-150px) rotate(180deg); }
  80%  { transform:translateY(-60px) rotate(300deg); }
  100% { transform:translateY(0) rotate(360deg); }
}
#buddy.pole-vault #buddy-css, #buddy.pole-vault #buddy-char {
  animation:poleVault 1.5s cubic-bezier(.2,.8,.3,1) forwards;
}
/* Pole element */
.buddy-pole {
  position:fixed; bottom:12px; z-index:9988;
  width:3px; height:60px; background:linear-gradient(180deg, #999, #666);
  border-radius:2px; transform-origin:bottom center;
  animation:poleBend 1.5s ease forwards;
}
@keyframes poleBend {
  0% { transform:rotate(0); }
  30% { transform:rotate(-30deg); }
  50% { transform:rotate(-60deg); height:40px; }
  100% { transform:rotate(-80deg); height:20px; opacity:0; }
}

/* Skateboard */
.buddy-skateboard {
  position:fixed; bottom:6px; z-index:9989;
  font-size:1.2rem; pointer-events:none;
}
#buddy.skating #buddy-css, #buddy.skating #buddy-char {
  animation:skateWobble .3s ease infinite;
}
@keyframes skateWobble {
  0%,100% { transform:translateY(-2px) rotate(-2deg); }
  50%     { transform:translateY(-4px) rotate(2deg); }
}

/* Handstand */
@keyframes handstand {
  0%   { transform:rotate(0); }
  30%  { transform:rotate(160deg); }
  40%  { transform:rotate(180deg); }
  60%  { transform:rotate(180deg) translateY(-5px); }
  70%  { transform:rotate(190deg); }
  85%  { transform:rotate(210deg); }
  100% { transform:rotate(360deg); }
}
#buddy.handstand #buddy-css, #buddy.handstand #buddy-char {
  animation:handstand 2s ease forwards;
}

/* Air guitar */
#buddy.airguitar #buddy-css, #buddy.airguitar #buddy-char {
  animation:airGuitar .2s ease infinite;
}
@keyframes airGuitar {
  0%,100% { transform:rotate(-5deg) translateY(0); }
  25%     { transform:rotate(5deg) translateY(-3px); }
  50%     { transform:rotate(-8deg) translateY(-1px); }
  75%     { transform:rotate(8deg) translateY(-4px); }
}

/* Dog companion */
.buddy-dog {
  position:fixed; bottom:12px; z-index:9989;
  font-size:1.3rem; pointer-events:none;
  transition:left .5s ease;
}
.buddy-dog.run {
  animation:dogRun .3s ease infinite;
}
@keyframes dogRun {
  0%,100% { transform:translateY(0); }
  50%     { transform:translateY(-5px); }
}
.buddy-dog.wag {
  animation:dogWag .4s ease infinite;
}
@keyframes dogWag {
  0%,100% { transform:rotate(-5deg); }
  50%     { transform:rotate(5deg); }
}
.buddy-dog.sit {
  animation:none; transform:translateY(2px);
}
/* Stick / Ball */
.buddy-stick {
  position:fixed; bottom:40px; z-index:9988;
  font-size:.8rem; pointer-events:none;
}
@keyframes stickThrow {
  0%   { transform:translate(0,0) rotate(0); }
  50%  { transform:translate(150px,-80px) rotate(360deg); }
  100% { transform:translate(250px,0) rotate(720deg); }
}
.buddy-stick.thrown { animation:stickThrow 1s ease forwards; }

/* Cartwheel (attempt + fail) */
@keyframes cartwheelAttempt {
  0%   { transform:translateX(0) rotate(0); }
  20%  { transform:translateX(10px) rotate(90deg); }
  40%  { transform:translateX(20px) rotate(180deg); }
  50%  { transform:translateX(25px) rotate(220deg); }
  60%  { transform:translateX(30px) rotate(200deg) translateY(5px); }
  100% { transform:translateX(40px) rotate(0) translateY(0); }
}
#buddy.cartwheel #buddy-css, #buddy.cartwheel #buddy-char {
  animation:cartwheelAttempt 1.2s ease forwards;
}

/* Jump rope */
#buddy.jumprope #buddy-css, #buddy.jumprope #buddy-char {
  animation:jumpRope .5s ease infinite;
}
@keyframes jumpRope {
  0%,100% { transform:translateY(0); }
  40%     { transform:translateY(-15px); }
  60%     { transform:translateY(-15px); }
}
.buddy-rope {
  position:fixed; bottom:12px; z-index:9988;
  width:30px; height:20px; pointer-events:none;
  border:2px solid #8B4513; border-top:none;
  border-radius:0 0 15px 15px;
  animation:ropeSwing .5s ease infinite;
}
@keyframes ropeSwing {
  0%,100% { transform:scaleY(1); }
  50%     { transform:scaleY(.3); }
}

@keyframes buddyTrip {
  0%,100%{transform:rotate(0) translateY(0)} 25%{transform:rotate(-15deg) translateY(-5px)}
  50%{transform:rotate(10deg) translateY(3px)} 75%{transform:rotate(-5deg) translateY(-2px)}
}
@keyframes buddyDance {
  0%{transform:translateY(0) rotate(0) scale(1)} 25%{transform:translateY(-10px) rotate(-10deg) scale(1.1)}
  50%{transform:translateY(0) rotate(0) scale(1)} 75%{transform:translateY(-10px) rotate(10deg) scale(1.1)}
}
@keyframes buddyPeek {
  0%{transform:translateY(0)} 20%{transform:translateY(35px)} 80%{transform:translateY(35px)} 100%{transform:translateY(0)}
}
@keyframes buddyFall {
  0%{transform:rotate(0)} 30%{transform:rotate(-20deg) translateY(5px)} 60%{transform:rotate(30deg) translateY(8px)}
  80%{transform:rotate(-10deg) translateY(3px)} 100%{transform:rotate(0) translateY(0)}
}
@keyframes buddyPushup {
  0%,100%{transform:translateY(0) scaleY(1)} 50%{transform:translateY(6px) scaleY(.7)}
}
@keyframes buddyChase {
  0%,100%{transform:translateY(0) rotate(-5deg)} 50%{transform:translateY(-8px) rotate(5deg)}
}
@keyframes buddyWave {
  0%,100%{transform:rotate(0)} 25%{transform:rotate(-15deg)} 75%{transform:rotate(15deg)}
}

/* Butterfly for chase action */
.buddy-butterfly {
  position:fixed; bottom:50px; z-index:9989; font-size:1.2rem;
  pointer-events:none; transition:none;
  animation:butterflyFloat 2s ease-in-out infinite;
}
@keyframes butterflyFloat {
  0%,100%{transform:translateY(0) rotate(-5deg)} 50%{transform:translateY(-15px) rotate(5deg)}
}

/* Smoke puff for joint character */
.buddy-smoke {
  position:absolute; top:-15px; right:-5px; font-size:.7rem;
  color:#999; pointer-events:none;
  animation:smokePuff 2s ease-out forwards;
}
@keyframes smokePuff {
  0%{opacity:.8;transform:translateY(0) scale(1)} 100%{opacity:0;transform:translateY(-30px) scale(2)}
}

/* ══════════════════════════════════════════════════════════════
   CSS CHARACTER ART — Towlie (v2)
   ══════════════════════════════════════════════════════════════ */

/* Hide emoji when CSS char is active */
#buddy.css-mode #buddy-char { display:none; }
#buddy.css-mode #buddy-css { display:block !important; }

/* ── Ground shadow for all CSS chars ──────────────────────── */
#buddy.css-mode::after {
  content:''; position:absolute; bottom:-3px; left:50%; transform:translateX(-50%);
  width:40px; height:6px; background:rgba(0,0,0,.15);
  border-radius:50%; filter:blur(2px);
  animation:shadowPulse 3s ease-in-out infinite;
}
@keyframes shadowPulse {
  0%,100% { width:40px; opacity:.15; }
  50% { width:36px; opacity:.1; }
}

/* ── BLINK animation (shared) ─────────────────────────────── */
@keyframes blink {
  0%,42%,46%,100% { height:10px; }
  44% { height:1px; }
}
@keyframes blinkSmall {
  0%,42%,46%,100% { height:7px; }
  44% { height:1px; }
}

/* ── TALKING mouth (shared) ───────────────────────────────── */
@keyframes talkMouth {
  0%,100% { height:3px; width:8px; }
  25% { height:6px; width:10px; border-radius:0 0 5px 5px; }
  50% { height:2px; width:6px; }
  75% { height:5px; width:9px; border-radius:0 0 4px 4px; }
}

/* ════════════════════════════════════════════════════════════
   TOWLIE — South Park Style (SVG version)
   ════════════════════════════════════════════════════════════ */
.css-towlie { width:70px; height:110px; position:relative; transition:all .3s ease; }

/* SVG base */
.towlie-svg { overflow:visible; display:block; margin:0 auto; }

/* ── Body ── */
#towlie-svg-body { transition:fill .5s ease, filter .5s ease; }
#buddy[data-mood="hungry"] #towlie-svg-body { fill:#a0adc8; filter:saturate(.6); }
#buddy.high #towlie-svg-body { fill:#8ea893; filter:drop-shadow(0 0 8px rgba(74,160,104,.25)); }

/* ── Progressive High (dynamisch via JS, bis Level 100) ── */
@keyframes transcendGlow {
  0%,100% { filter:drop-shadow(0 0 15px rgba(255,100,255,.5)) drop-shadow(0 0 8px rgba(100,255,100,.3)); }
  50% { filter:drop-shadow(0 0 25px rgba(100,200,255,.6)) drop-shadow(0 0 12px rgba(255,200,100,.4)); }
}
@keyframes cosmicPulse {
  0%,100% { filter:drop-shadow(0 0 20px rgba(255,0,255,.6)) drop-shadow(0 0 10px rgba(0,255,255,.4)) hue-rotate(0deg); }
  33% { filter:drop-shadow(0 0 30px rgba(0,255,128,.5)) drop-shadow(0 0 15px rgba(255,128,0,.4)) hue-rotate(120deg); }
  66% { filter:drop-shadow(0 0 25px rgba(128,0,255,.5)) drop-shadow(0 0 12px rgba(255,255,0,.4)) hue-rotate(240deg); }
}

/* ── Blink animation (SVG eyes) ── */
#towlie-svg-eye-l, #towlie-svg-eye-r {
  animation:svgBlink 5s ease-in-out infinite;
  transform-origin:center center;
}
#towlie-svg-eye-r { animation-delay:.15s; }
@keyframes svgBlink {
  0%,42%,46%,100% { transform:scaleY(1); }
  44% { transform:scaleY(0.08); }
}

/* ── Pupils ── */
#towlie-svg-pupil-l, #towlie-svg-pupil-r {
  transition:cx .3s ease, cy .3s ease, r .3s ease;
}

/* ── Brows ── */
#towlie-svg-brow-l, #towlie-svg-brow-r {
  transition:transform .3s ease;
}

/* ── Mouth ── */
#towlie-svg-mouth { transition:transform .3s ease, d .3s ease; }
#buddy.talking #towlie-svg-mouth { animation:svgTalkMouth .4s ease infinite; }
@keyframes svgTalkMouth {
  0%,100% { transform:scaleY(1); }
  25% { transform:scaleY(1.6) scaleX(1.1); }
  50% { transform:scaleY(0.5) scaleX(0.9); }
  75% { transform:scaleY(1.4) scaleX(1.05); }
}

/* ── Arms ── */
#towlie-svg-arm-l { transform-origin:18px 48px; transition:transform .3s ease; }
#towlie-svg-arm-r { transform-origin:52px 48px; transition:transform .3s ease; }
#buddy.wave #towlie-svg-arm-r { animation:svgArmWave .5s ease infinite 3; }
@keyframes svgArmWave {
  0%,100% { transform:rotate(0); }
  50% { transform:rotate(-40deg); }
}
#buddy.talking #towlie-svg-arm-r { animation:svgArmGesture .8s ease infinite; }
@keyframes svgArmGesture {
  0%,100% { transform:rotate(0); }
  30% { transform:rotate(-25deg); }
  60% { transform:rotate(5deg); }
}

/* ── Legs walk cycle ── */
#towlie-svg-leg-l, #towlie-svg-leg-r {
  transition:transform .2s ease;
}
#towlie-svg-leg-l { transform-origin:29px 75px; }
#towlie-svg-leg-r { transform-origin:41px 75px; }
#buddy.walk #towlie-svg-leg-l { animation:svgLegWalkL .4s ease infinite; }
#buddy.walk #towlie-svg-leg-r { animation:svgLegWalkR .4s ease infinite; }
@keyframes svgLegWalkL { 0%,100%{transform:rotate(0)} 50%{transform:rotate(15deg)} }
@keyframes svgLegWalkR { 0%,100%{transform:rotate(0)} 50%{transform:rotate(-15deg)} }

/* ── Cheeks (excited/happy blush) ── */
.towlie-cheek-svg { opacity:0; transition:opacity .5s ease; }
#buddy.excited .towlie-cheek-svg,
#buddy[data-mood="happy"] .towlie-cheek-svg { opacity:.35; }
#buddy.high .towlie-cheek-svg { opacity:.55; }

/* ── Sweat ── */
#towlie-svg-sweat { opacity:0; }
@keyframes svgSweatDrop {
  0%,70%,100% { opacity:0; transform:translateY(0); }
  75% { opacity:1; }
  95% { opacity:0; transform:translateY(6px); }
}
#buddy.excited #towlie-svg-sweat { opacity:1; animation:svgSweatDrop 2s ease-in-out infinite; }

/* ── Mood variants ── */
/* High: redder eyes, smaller pupils, wider mouth */
#buddy.high .towlie-eye-sclera { fill:#ffcccc; }
#buddy.high #towlie-svg-pupil-l,
#buddy.high #towlie-svg-pupil-r { r:1.8; }
#buddy.high #towlie-svg-mouth { transform:scale(1.4); }
#buddy.high .css-towlie { animation:highSway 4s ease-in-out infinite; }
@keyframes highSway {
  0%,100% { transform:rotate(-2deg); }
  50% { transform:rotate(2deg); }
}

/* Sleep: eyes nearly closed, mouth is a line */
#buddy.sleep #towlie-svg-eye-l,
#buddy.sleep #towlie-svg-eye-r {
  animation:none; transform:scaleY(0.15);
}
#buddy.sleep #towlie-svg-pupil-l,
#buddy.sleep #towlie-svg-pupil-r { opacity:0; }
#buddy.sleep #towlie-svg-mouth { transform:scaleY(0.3) scaleX(0.8); }
#buddy.sleep #towlie-svg-teeth { opacity:0; }

/* Hungry: frown (mouth inverted), desaturated */
#buddy[data-mood="hungry"] #towlie-svg-mouth { transform:scaleY(-1) translateY(-2px); }
#buddy[data-mood="hungry"] #towlie-svg-teeth { opacity:0; }

/* Excited: bounce + cheek blush */
#buddy.excited .css-towlie { animation:excitedBounce .5s ease infinite; }
@keyframes excitedBounce {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-4px); }
}
#buddy.excited .towlie-cheek-svg,
#buddy[data-mood="happy"] .towlie-cheek-svg { opacity:1 !important; fill:rgba(255,100,100,.35); }
#buddy.high .towlie-cheek-svg { opacity:1 !important; fill:rgba(255,100,100,.5); }

/* ── Face Expressions ── */
#buddy[data-face] #towlie-svg-expressions { display:block !important; }

/* Angry: V-brows, wider frown */
#buddy[data-face="angry"] #towlie-svg-brow-l { transform:rotate(15deg); transform-origin:22px 27px; }
#buddy[data-face="angry"] #towlie-svg-brow-r { transform:rotate(-15deg); transform-origin:48px 27px; }
#buddy[data-face="angry"] #towlie-svg-mouth { transform:scaleY(-0.8) translateY(-2px); }
#buddy[data-face="angry"] #towlie-svg-teeth { opacity:0; }

/* Crying: tears visible, sad brows */
#buddy[data-face="crying"] .towlie-tear-l, #buddy[data-face="crying"] .towlie-tear-r { display:block; animation:tearFall 1.5s ease-in-out infinite; }
#buddy[data-face="crying"] #towlie-svg-brow-l { transform:rotate(-10deg); transform-origin:22px 27px; }
#buddy[data-face="crying"] #towlie-svg-brow-r { transform:rotate(10deg); transform-origin:48px 27px; }
#buddy[data-face="crying"] #towlie-svg-mouth { transform:scaleY(-0.6) translateY(-2px); }
#buddy[data-face="crying"] #towlie-svg-teeth { opacity:0; }
@keyframes tearFall { 0%{opacity:1;transform:translateY(0)} 80%{opacity:.6;transform:translateY(8px)} 100%{opacity:0;transform:translateY(12px)} }

/* Laughing: squint eyes, big mouth */
#buddy[data-face="laughing"] #towlie-svg-eye-l, #buddy[data-face="laughing"] #towlie-svg-eye-r { transform:scaleY(0.4); }
#buddy[data-face="laughing"] #towlie-svg-mouth { transform:scale(1.6); }
#buddy[data-face="laughing"] .towlie-cheek-svg { opacity:1 !important; fill:rgba(255,100,100,.4); }

/* Confused: asymmetric brows, squiggly mouth */
#buddy[data-face="confused"] #towlie-svg-brow-l { transform:rotate(-15deg) translateY(-3px); transform-origin:22px 27px; }
#buddy[data-face="confused"] #towlie-svg-brow-r { transform:rotate(3deg); transform-origin:48px 27px; }
#buddy[data-face="confused"] #towlie-svg-mouth { transform:scaleX(0.6) translateX(2px); }

/* Shocked: wide eyes, O-mouth */
#buddy[data-face="shocked"] #towlie-svg-eye-l, #buddy[data-face="shocked"] #towlie-svg-eye-r { transform:scale(1.3); }
#buddy[data-face="shocked"] #towlie-svg-pupil-l, #buddy[data-face="shocked"] #towlie-svg-pupil-r { r:4; }
#buddy[data-face="shocked"] #towlie-svg-mouth { display:none; }
#buddy[data-face="shocked"] .towlie-o-mouth { display:block !important; }

/* Scheming: one eye narrowed, smirk */
#buddy[data-face="scheming"] #towlie-svg-eye-l { transform:scaleY(0.5); }
#buddy[data-face="scheming"] #towlie-svg-brow-l { transform:rotate(10deg) translateY(-2px); transform-origin:22px 27px; }
#buddy[data-face="scheming"] #towlie-svg-mouth { transform:translateX(3px) scaleX(0.7); }

/* Love: heart eyes */
#buddy[data-face="love"] .towlie-heart-l, #buddy[data-face="love"] .towlie-heart-r { display:block !important; }
#buddy[data-face="love"] #towlie-svg-pupil-l, #buddy[data-face="love"] #towlie-svg-pupil-r { opacity:0; }
#buddy[data-face="love"] .towlie-cheek-svg { opacity:1 !important; fill:rgba(255,100,100,.5); }

/* Disgusted: tongue out, squint */
#buddy[data-face="disgusted"] .towlie-tongue { display:block !important; }
#buddy[data-face="disgusted"] #towlie-svg-eye-l, #buddy[data-face="disgusted"] #towlie-svg-eye-r { transform:scaleY(0.6) scaleX(0.9); }
#buddy[data-face="disgusted"] #towlie-svg-brow-l { transform:rotate(8deg); transform-origin:22px 27px; }
#buddy[data-face="disgusted"] #towlie-svg-brow-r { transform:rotate(-8deg); transform-origin:48px 27px; }

/* Smug: ein Auge halb zu, Mundwinkel hoch, Augenbraue raised */
#buddy[data-face="smug"] #towlie-svg-eye-r { transform:scaleY(0.5); }
#buddy[data-face="smug"] #towlie-svg-brow-l { transform:rotate(-12deg) translateY(-3px); transform-origin:22px 27px; }
#buddy[data-face="smug"] #towlie-svg-mouth { transform:scaleX(0.7) translateX(3px) scaleY(1.3); }

/* Stoned: Augen fast zu, breites Grinsen, maximaler Chill */
#buddy[data-face="stoned"] #towlie-svg-eye-l, #buddy[data-face="stoned"] #towlie-svg-eye-r { transform:scaleY(0.25); }
#buddy[data-face="stoned"] #towlie-svg-mouth { transform:scale(1.8) translateY(1px); }
#buddy[data-face="stoned"] .towlie-cheek-svg { opacity:1 !important; fill:rgba(255,80,80,.5); }

/* Panicked: Augen riesig, Pupillen winzig, Mund O, Schweiss */
#buddy[data-face="panicked"] #towlie-svg-eye-l, #buddy[data-face="panicked"] #towlie-svg-eye-r { transform:scale(1.4); }
#buddy[data-face="panicked"] #towlie-svg-pupil-l, #buddy[data-face="panicked"] #towlie-svg-pupil-r { r:1.2; }
#buddy[data-face="panicked"] .towlie-o-mouth { display:block !important; }
#buddy[data-face="panicked"] #towlie-svg-mouth { display:none; }
#buddy[data-face="panicked"] #towlie-svg-sweat { opacity:1; animation:svgSweatDrop 1s ease-in-out infinite; }

/* Derp: Augen in verschiedene Richtungen, Zunge raus */
#buddy[data-face="derp"] #towlie-svg-pupil-l { transform:translate(-2px, -1px); }
#buddy[data-face="derp"] #towlie-svg-pupil-r { transform:translate(2px, 1px); }
#buddy[data-face="derp"] .towlie-tongue { display:block !important; }
#buddy[data-face="derp"] #towlie-svg-mouth { transform:translateX(-2px) scaleX(1.3); }

/* Sleepy: Augen halb zu, Mund gähnt, Augenbrauen traurig */
#buddy[data-face="sleepy"] #towlie-svg-eye-l, #buddy[data-face="sleepy"] #towlie-svg-eye-r { transform:scaleY(0.3); }
#buddy[data-face="sleepy"] #towlie-svg-brow-l { transform:rotate(-8deg); transform-origin:22px 27px; }
#buddy[data-face="sleepy"] #towlie-svg-brow-r { transform:rotate(8deg); transform-origin:48px 27px; }
#buddy[data-face="sleepy"] .towlie-o-mouth { display:block !important; transform:scaleX(0.7); }
#buddy[data-face="sleepy"] #towlie-svg-mouth { display:none; }

/* Proud: Augen geschlossen (zufrieden), breites Grinsen, Brust raus */
#buddy[data-face="proud"] #towlie-svg-eye-l, #buddy[data-face="proud"] #towlie-svg-eye-r { transform:scaleY(0.15); }
#buddy[data-face="proud"] #towlie-svg-mouth { transform:scale(1.4) translateY(1px); }
#buddy[data-face="proud"] .towlie-cheek-svg { opacity:1 !important; fill:rgba(255,180,100,.4); }

/* Suspicious: Augen zusammengekniffen, Mund schief */
#buddy[data-face="suspicious"] #towlie-svg-eye-l, #buddy[data-face="suspicious"] #towlie-svg-eye-r { transform:scaleY(0.4) scaleX(0.8); }
#buddy[data-face="suspicious"] #towlie-svg-brow-l { transform:rotate(5deg) translateY(2px); transform-origin:22px 27px; }
#buddy[data-face="suspicious"] #towlie-svg-brow-r { transform:rotate(-5deg) translateY(2px); transform-origin:48px 27px; }
#buddy[data-face="suspicious"] #towlie-svg-mouth { transform:scaleX(0.5) translateX(4px); }

/* Mindblown: Augen riesig, Pupillen riesig, Mund O, Partikel via JS */
#buddy[data-face="mindblown"] #towlie-svg-eye-l, #buddy[data-face="mindblown"] #towlie-svg-eye-r { transform:scale(1.5); }
#buddy[data-face="mindblown"] #towlie-svg-pupil-l, #buddy[data-face="mindblown"] #towlie-svg-pupil-r { r:4.5; }
#buddy[data-face="mindblown"] .towlie-o-mouth { display:block !important; transform:scale(1.3); }
#buddy[data-face="mindblown"] #towlie-svg-mouth { display:none; }

/* Guilty: Augen zur Seite, Mund klein, Schweiss */
#buddy[data-face="guilty"] #towlie-svg-pupil-l, #buddy[data-face="guilty"] #towlie-svg-pupil-r { transform:translate(2px, -1px); }
#buddy[data-face="guilty"] #towlie-svg-mouth { transform:scaleX(0.4) scaleY(0.5); }
#buddy[data-face="guilty"] #towlie-svg-sweat { opacity:1; animation:svgSweatDrop 2s ease-in-out infinite; }
#buddy[data-face="guilty"] #towlie-svg-brow-l { transform:rotate(-8deg); transform-origin:22px 27px; }
#buddy[data-face="guilty"] #towlie-svg-brow-r { transform:rotate(8deg); transform-origin:48px 27px; }

/* Determined: V-Brauen nach unten (entschlossen), Mund zusammengepresst */
#buddy[data-face="determined"] #towlie-svg-brow-l { transform:rotate(12deg) translateY(2px); transform-origin:22px 27px; }
#buddy[data-face="determined"] #towlie-svg-brow-r { transform:rotate(-12deg) translateY(2px); transform-origin:48px 27px; }
#buddy[data-face="determined"] #towlie-svg-mouth { transform:scaleY(0.3) scaleX(1.2); }
#buddy[data-face="determined"] #towlie-svg-eye-l, #buddy[data-face="determined"] #towlie-svg-eye-r { transform:scaleY(0.7); }

/* Bliss: Augen zu, riesiges Grinsen, Wangen glühen, schwebend */
#buddy[data-face="bliss"] #towlie-svg-eye-l, #buddy[data-face="bliss"] #towlie-svg-eye-r { transform:scaleY(0.1); }
#buddy[data-face="bliss"] #towlie-svg-mouth { transform:scale(2) translateY(2px); }
#buddy[data-face="bliss"] .towlie-cheek-svg { opacity:1 !important; fill:rgba(255,150,200,.6); }
#buddy[data-face="bliss"] #towlie-svg-body { filter:drop-shadow(0 0 12px rgba(255,200,100,.4)); }

/* Hide all expression elements by default */
.towlie-tear-l, .towlie-tear-r, .towlie-tongue, .towlie-heart-l, .towlie-heart-r, .towlie-o-mouth { display:none; }

/* ── Visual degradation based on stats ── */
/* Low hunger: desaturated, dull */
#buddy[data-hunger="low"] #towlie-svg-body { filter:saturate(0.35) brightness(0.8); transition:filter 2s ease; }
#buddy[data-hunger="mid"] #towlie-svg-body { filter:saturate(0.7) brightness(0.9); transition:filter 2s ease; }

/* Low happiness: wrinkles visible */
#buddy[data-happiness="low"] #towlie-svg-wrinkles { display:block !important; opacity:.6; }
#buddy[data-happiness="mid"] #towlie-svg-wrinkles { display:block !important; opacity:.3; }

/* Both low: frayed edges + extra degradation */
#buddy[data-hunger="low"][data-happiness="low"] #towlie-svg-body {
  filter:saturate(0.2) brightness(0.7) contrast(1.1);
}
#buddy[data-hunger="low"][data-happiness="low"] .css-towlie {
  animation:desperateShiver 2s ease-in-out infinite;
}
@keyframes desperateShiver {
  0%,100% { transform:rotate(0); }
  25% { transform:rotate(-1deg); }
  75% { transform:rotate(1deg); }
}

#buddy.excited #towlie-svg-body {
  filter:drop-shadow(0 0 10px rgba(255,215,0,.4));
}

/* ── Joint ── */
#towlie-svg-joint { transition:transform .5s ease; }
#towlie-svg-joint.inhale { transform:rotate(5deg) translate(-2px,0); }
#towlie-svg-joint.inhale #towlie-svg-ember { r:3.5; opacity:1; }

/* Ember glow */
#towlie-svg-ember { animation:svgEmberGlow 1s ease-in-out infinite; }
@keyframes svgEmberGlow {
  0%,100% { opacity:.8; r:2; }
  50% { opacity:1; r:2.8; }
}

/* ── Breathing ── */
/* ── Towlie: Kick ── */
#buddy.kick .css-towlie { animation:kickAnim .4s ease forwards; }
@keyframes kickAnim {
  0% { transform:rotate(0); }
  30% { transform:rotate(-15deg) translateX(-5px); }
  60% { transform:rotate(20deg) translateX(8px); }
  100% { transform:rotate(0); }
}

#towlie-svg-body { animation:svgBreathe 4s ease-in-out infinite; transform-origin:35px 40px; }
@keyframes svgBreathe {
  0%,100% { transform:scaleY(1); }
  50% { transform:scaleY(1.012); }
}
#buddy.walk #towlie-svg-body { animation:none; }

/* ── Fabric flutter (subtle path deformation via CSS) ── */
.towlie-body-path { animation:svgFabricFlutter 6s ease-in-out infinite; }
@keyframes svgFabricFlutter {
  0%,100% { filter:none; }
  50% { filter:url(#towlie-flutter-filter); }
}

/* ── Cloth Flutter Physics (CSS-based) ── */
@keyframes clothIdle {
  0%,100% { d:path('M10,5 Q15,3 25,4 Q35,2 45,4 Q55,3 60,5 L58,68 Q50,72 35,73 Q20,72 12,68 Z'); }
  33% { d:path('M10,5 Q15,4 25,3 Q35,5 45,3 Q55,4 60,5 L59,69 Q50,71 35,74 Q20,71 11,69 Z'); }
  66% { d:path('M10,5 Q15,2 25,5 Q35,3 45,5 Q55,2 60,5 L57,68 Q50,73 35,72 Q20,73 13,68 Z'); }
}
@keyframes clothWalk {
  0%,100% { d:path('M10,5 Q15,3 25,4 Q35,2 45,4 Q55,3 60,5 L58,68 Q50,72 35,73 Q20,72 12,68 Z'); }
  25% { d:path('M11,5 Q15,4 25,3 Q35,5 45,3 Q55,5 60,4 L60,69 Q50,71 35,74 Q20,71 10,69 Z'); }
  50% { d:path('M9,5 Q15,2 25,5 Q35,3 45,5 Q55,2 61,5 L57,68 Q50,73 35,72 Q20,73 13,68 Z'); }
  75% { d:path('M11,4 Q15,5 25,3 Q35,4 45,5 Q55,3 59,5 L59,70 Q50,72 35,73 Q20,72 11,70 Z'); }
}
@keyframes clothThrown {
  0% { d:path('M10,5 Q15,3 25,4 Q35,2 45,4 Q55,3 60,5 L58,68 Q50,72 35,73 Q20,72 12,68 Z'); }
  25% { d:path('M8,3 Q15,0 25,6 Q35,-1 45,7 Q55,0 62,3 L63,65 Q50,75 35,76 Q20,75 7,65 Z'); }
  50% { d:path('M12,7 Q15,5 25,2 Q35,6 45,1 Q55,6 58,7 L56,70 Q50,70 35,71 Q20,70 14,70 Z'); }
  75% { d:path('M9,4 Q15,2 25,5 Q35,1 45,5 Q55,2 61,4 L59,69 Q50,73 35,74 Q20,73 11,69 Z'); }
  100% { d:path('M10,5 Q15,3 25,4 Q35,2 45,4 Q55,3 60,5 L58,68 Q50,72 35,73 Q20,72 12,68 Z'); }
}
#buddy.idle #towlie-svg-body { animation:clothIdle 6s ease-in-out infinite; }
#buddy.walk #towlie-svg-body { animation:clothWalk 0.8s ease-in-out infinite; }
#buddy.thrown #towlie-svg-body { animation:clothThrown 0.6s ease-in-out infinite; }

/* ── Rauch (mehr Puffs, grösseres Volumen) ── */
.towlie-smoke {
  position:absolute; right:-8px; top:8px;
  width:30px; height:40px;
  pointer-events:none;
}
.towlie-puff {
  position:absolute; background:rgba(200,200,200,.4); border-radius:50%;
  animation:puffUp 3s ease-out infinite;
}
.towlie-puff:nth-child(1) { width:6px; height:6px; left:4px; animation-delay:0s; }
.towlie-puff:nth-child(2) { width:5px; height:5px; left:12px; animation-delay:.7s; }
.towlie-puff:nth-child(3) { width:4px; height:4px; left:2px; animation-delay:1.4s; }
.towlie-puff:nth-child(4) { width:7px; height:7px; left:8px; animation-delay:2.1s; }
@keyframes puffUp {
  0% { opacity:.5; transform:translateY(0) scale(.4); }
  40% { opacity:.3; transform:translateY(-15px) scale(1); }
  100% { opacity:0; transform:translateY(-35px) scale(2) translateX(8px); }
}
.towlie-smoke.big-puff .towlie-puff {
  width:12px; height:12px; animation:bigPuff 2s ease-out forwards;
}
@keyframes bigPuff {
  0% { opacity:.7; transform:translateY(0) scale(.5); }
  100% { opacity:0; transform:translateY(-45px) scale(3); }
}

/* ── Towlie: Auswringen ── */
#buddy.wringing .css-towlie { animation:wring .4s ease infinite; }
@keyframes wring {
  0%,100% { transform:rotate(0) scaleX(1); }
  25% { transform:rotate(8deg) scaleX(.85); }
  75% { transform:rotate(-8deg) scaleX(.85); }
}

/* ── Towlie: Sich falten ── */
#buddy.folding .css-towlie { animation:tryFold .6s ease infinite; }
@keyframes tryFold {
  0%,100% { transform:scaleY(1) scaleX(1); }
  30% { transform:scaleY(.7) scaleX(1.15); }
  60% { transform:scaleY(1.1) scaleX(.8); }
}
#buddy.crumpled .css-towlie { transform:scaleY(.6) scaleX(1.3) rotate(15deg); transition:transform .5s ease; }

/* ── Towlie: Cape-Modus ── */
#buddy.cape-mode .css-towlie { animation:capeFloat 1s ease-in-out infinite; }
#buddy.cape-mode #towlie-svg-body { filter:drop-shadow(0 0 12px rgba(255,215,0,.5)); }
@keyframes capeFloat {
  0%,100% { transform:translateY(0) rotate(-5deg); }
  50% { transform:translateY(-8px) rotate(5deg); }
}

/* ══════════════════════════════════════════════════════════════
   DYNAMIC APPEARANCE — Tageszeit, Feiertage, Saisons
   ══════════════════════════════════════════════════════════════ */

/* ── Tageszeit: Morgen (6-9) ──────────────────────────────── */
#buddy.time-morning #towlie-svg-body { filter:brightness(1.1) saturate(.85); }
#buddy.time-morning #towlie-svg-joint { opacity:.3; } /* noch nicht richtig wach */
.towlie-coffee { /* Kaffeetasse */
  position:absolute; left:-10px; top:18px;
  font-size:.7rem; display:none;
}
#buddy.time-morning .towlie-coffee { display:block; }

/* ── Tageszeit: Abend (17-21) ─────────────────────────────── */
#buddy.time-evening #towlie-svg-body {
  fill:#5096c0 !important;
}

/* ── Tageszeit: Nacht (21-6) ──────────────────────────────── */
#buddy.time-night #towlie-svg-body {
  fill:#4a7a98 !important;
  filter:brightness(.85);
}
/* Schlafmütze für Towlie */
.towlie-nightcap {
  position:absolute; top:-12px; left:50%; transform:translateX(-50%) rotate(15deg);
  width:0; height:0; border-left:8px solid transparent; border-right:8px solid transparent;
  border-bottom:14px solid #5BA3D9; display:none;
}
.towlie-nightcap::after {
  content:''; position:absolute; top:-3px; left:-2px;
  width:6px; height:6px; background:#fff; border-radius:50%;
}
#buddy.time-night .towlie-nightcap { display:block; }
#buddy.time-night #towlie-svg-eye-l,
#buddy.time-night #towlie-svg-eye-r { transform:scaleY(0.15) !important; animation:none !important; }

/* Big smoke when high */
#buddy.high #towlie-svg-smoke-group { opacity:1; transform:scale(1.5); transform-origin:62px 30px; }
#buddy.high #towlie-svg-smoke-group .smoke-wisp { stroke-width:3; }

/* Time-of-day accessories */
#buddy.time-morning #towlie-svg-coffee { display:block !important; }
#buddy.time-evening #towlie-svg-reading-glasses { display:block !important; }
#buddy.time-night #towlie-svg-sleepcap { display:block !important; }

/* ── 420 Special (20. April) ──────────────────────────────── */
#buddy.holiday-420 #towlie-svg-body {
  fill:#FFA500 !important;
  filter:drop-shadow(0 0 20px rgba(255,165,0,.5)) !important;
}
#buddy.holiday-420 .towlie-eye-sclera { fill:#ffcccc !important; }
#buddy.holiday-420 .towlie-eye-outline { stroke:#cc3333 !important; }

/* ── Weihnachten (24-26. Dez) ─────────────────────────────── */
.buddy-santa-hat {
  position:absolute; top:-14px; left:50%; transform:translateX(-50%) rotate(-8deg);
  width:24px; height:16px; background:#cc0000; border-radius:0 12px 0 0;
  display:none; z-index:10;
}
.buddy-santa-hat::before { /* Pelz-Rand */
  content:''; position:absolute; bottom:-2px; left:-3px;
  width:30px; height:5px; background:#fff; border-radius:3px;
}
.buddy-santa-hat::after { /* Bommel */
  content:''; position:absolute; top:-3px; right:-2px;
  width:7px; height:7px; background:#fff; border-radius:50%;
}
#buddy.holiday-xmas .buddy-santa-hat { display:block; }

/* Schnee-Partikel */
.buddy-snow {
  position:absolute; top:-30px; left:-15px; width:80px; height:40px;
  pointer-events:none; display:none; overflow:visible;
}
#buddy.holiday-xmas .buddy-snow,
#buddy.season-winter .buddy-snow { display:block; }
.snowflake {
  position:absolute; width:4px; height:4px; background:#fff;
  border-radius:50%; opacity:.8;
  animation:snowFall 3s linear infinite;
}
.snowflake:nth-child(2) { left:20px; animation-delay:.5s; width:3px; height:3px; }
.snowflake:nth-child(3) { left:40px; animation-delay:1s; }
.snowflake:nth-child(4) { left:55px; animation-delay:1.8s; width:3px; height:3px; }
.snowflake:nth-child(5) { left:10px; animation-delay:2.2s; width:2px; height:2px; }
@keyframes snowFall {
  0% { transform:translateY(-5px); opacity:.8; }
  100% { transform:translateY(70px) translateX(10px); opacity:0; }
}

/* ── Halloween (31. Okt) ──────────────────────────────────── */
#buddy.holiday-halloween #towlie-svg-body {
  fill:#6a30a0 !important;
}

/* ── Silvester / Neujahr (31.12 / 1.1) ────────────────────── */
.buddy-party-hat {
  position:absolute; top:-16px; left:50%; transform:translateX(-50%) rotate(-5deg);
  width:0; height:0; border-left:10px solid transparent; border-right:10px solid transparent;
  border-bottom:18px solid #ff3366; display:none; z-index:10;
}
.buddy-party-hat::after {
  content:'✨'; position:absolute; top:-8px; left:-3px; font-size:.5rem;
}
#buddy.holiday-nye .buddy-party-hat { display:block; }

/* ── 1. August (Schweizer Nationalfeiertag) ───────────────── */
.buddy-swiss-flag {
  position:absolute; top:-8px; right:-12px;
  font-size:.8rem; display:none;
  animation:flagWave 1s ease-in-out infinite;
}
@keyframes flagWave { 0%,100%{transform:rotate(-5deg)} 50%{transform:rotate(5deg)} }
#buddy.holiday-ch .buddy-swiss-flag { display:block; }
#buddy.holiday-ch #towlie-svg-body {
  filter:drop-shadow(0 0 8px rgba(204,0,0,.3)) !important;
}

/* ── Valentinstag (14. Feb) ───────────────────────────────── */
#buddy.holiday-valentine::before {
  content:'💕'; position:absolute; top:-20px; right:-5px;
  font-size:.7rem; animation:heartFloat 2s ease-in-out infinite;
}
@keyframes heartFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }

/* ── Saisons ──────────────────────────────────────────────── */
/* Winter: Schal */
.buddy-scarf {
  position:absolute; z-index:4; display:none;
}
.towlie-scarf {
  bottom:-2px; left:50%; transform:translateX(-50%);
  width:30px; height:6px; background:#cc3333;
  border-radius:2px; border:1px solid #aa2222;
}
.towlie-scarf::after {
  content:''; position:absolute; right:-6px; top:1px;
  width:6px; height:10px; background:#cc3333;
  border-radius:0 0 2px 2px; border:1px solid #aa2222; border-top:none;
}
#buddy.season-winter .buddy-scarf { display:block; }

/* Sommer: Sonnenbrille für Towlie */
.towlie-sunglasses {
  position:absolute; top:12px; left:50%; transform:translateX(-50%);
  width:26px; height:8px; display:none; z-index:5;
}
.towlie-sunglasses::before, .towlie-sunglasses::after {
  content:''; position:absolute; top:0;
  width:10px; height:7px; background:rgba(0,0,0,.7);
  border-radius:2px; border:1px solid #333;
}
.towlie-sunglasses::before { left:0; }
.towlie-sunglasses::after { right:0; }
#buddy.season-summer .towlie-sunglasses { display:block; }
#buddy.season-summer #towlie-svg-eye-l,
#buddy.season-summer #towlie-svg-eye-r { opacity:.3; }

/* Herbst: Blätter */
.buddy-leaves {
  position:absolute; top:-25px; left:-10px; width:70px; height:30px;
  pointer-events:none; display:none; overflow:visible;
}
#buddy.season-autumn .buddy-leaves { display:block; }
.leaf {
  position:absolute; font-size:.6rem;
  animation:leafFall 4s ease-in-out infinite;
}
.leaf:nth-child(1) { left:10px; content:'🍂'; animation-delay:0s; }
.leaf:nth-child(2) { left:35px; animation-delay:1.5s; }
.leaf:nth-child(3) { left:55px; animation-delay:3s; }
@keyframes leafFall {
  0% { transform:translateY(-5px) rotate(0); opacity:.8; }
  100% { transform:translateY(60px) rotate(180deg) translateX(15px); opacity:0; }
}

/* Frühling: Blumen-Partikel */
#buddy.season-spring::before {
  content:'🌸'; position:absolute; top:-18px; left:-8px;
  font-size:.6rem; animation:springFloat 3s ease-in-out infinite;
}
@keyframes springFloat { 0%,100%{transform:translateY(0) rotate(0)} 50%{transform:translateY(-8px) rotate(20deg)} }

/* ── VIP Glow (Stammkunde) ────────────────────────────────── */
#buddy.vip::after {
  box-shadow:0 0 12px rgba(255,215,0,.4) !important;
  background:rgba(255,215,0,.1) !important;
}
#buddy.vip #towlie-svg-body { filter:drop-shadow(0 0 8px rgba(255,215,0,.3)); }

/* ── Mobile: Buddy above bottom-nav ── */
@media (max-width: 991px) {
  #buddy { bottom: calc(68px + env(safe-area-inset-bottom, 0px)); }
  #buddy-speech { bottom: calc(160px + env(safe-area-inset-bottom, 0px)); }
  #buddy-restore { bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
}

/* ── Mobile ── */
@media(max-width:480px) {
  #buddy-pop { width:calc(100vw - 24px); left:12px!important; }
  #buddy-speech { max-width: min(180px, calc(100vw - 40px)); }
  #buddy-char { font-size:2.2rem; }
  .css-towlie { transform:scale(.85); }
  #buddy-hide-btn { width: 32px; height: 32px; font-size: .8rem; line-height: 32px; }
  .bpop-close { width: 44px; height: 44px; font-size: 1.2rem; }
  #buddy-restore { width: 44px; height: 44px; line-height: 44px; font-size: 1.4rem; }
}
#buddy.four-twenty-active #towlie-svg-body {
  filter:drop-shadow(0 0 15px rgba(255,165,0,.6)) !important;
}
/* ── Towlie Hide/Restore ── */
#buddy-hide-btn {
  position:absolute; top:-6px; right:-6px; z-index:10;
  width:20px; height:20px; border-radius:50%;
  background:rgba(0,0,0,.45); color:#fff; border:none;
  font-size:.65rem; line-height:20px; text-align:center;
  cursor:pointer; opacity:0; transition:opacity .2s;
  padding:0;
}
#buddy:hover #buddy-hide-btn { opacity:.8; }
#buddy-hide-btn:hover { opacity:1 !important; background:rgba(0,0,0,.7); }
#buddy-restore {
  position:fixed; bottom:calc(14px + env(safe-area-inset-bottom, 0px)); left:14px; z-index:9980;
  width:36px; height:36px; border-radius:50%;
  background:rgba(255,255,255,.85); border:1px solid rgba(0,0,0,.1);
  box-shadow:0 2px 8px rgba(0,0,0,.12);
  font-size:1.1rem; line-height:36px; text-align:center;
  cursor:pointer; display:none;
  transition:transform .2s;
}
#buddy-restore:hover { transform:scale(1.15); }
@media (hover: none) {
  #buddy-hide-btn { opacity: .6 !important; }
}
@media (max-width: 480px) {
  .b-particle { font-size: .7rem; animation-duration: .6s; }
  .b-confetti { font-size: .6rem; animation-duration: .5s; }
}
@media (max-height: 400px) {
  #buddy-pop { max-height: 60vh; }
  .css-towlie { transform: scale(.7); }
}

/* ── Happiness visual feedback ── */
#buddy[data-happiness="low"]::after {
  content:'💔'; position:absolute; top:-8px; right:-4px;
  font-size:14px; animation:heartPulse 2s ease-in-out infinite;
  pointer-events:none; z-index:1;
}
@keyframes heartPulse {
  0%,100% { opacity:.4; transform:scale(.8); }
  50% { opacity:1; transform:scale(1.1); }
}
#buddy[data-happiness="low"] #buddy-char { filter:saturate(0.5) brightness(0.85); }
#buddy[data-happiness="ok"]::after {
  content:'💚'; position:absolute; top:-8px; right:-4px;
  font-size:10px; opacity:.6; pointer-events:none; z-index:1;
}
#buddy[data-happiness="high"]::after {
  content:'💚'; position:absolute; top:-8px; right:-4px;
  font-size:12px; animation:heartPulse 2s ease-in-out infinite;
  pointer-events:none; z-index:1;
}
#buddy[data-happiness="high"] #buddy-char { filter:drop-shadow(0 0 8px rgba(52,211,153,0.5)); }

/* ═══════════════════════════════════════════════════ */
/* KNOCHLI (Skull) Character Styles                  */
/* ═══════════════════════════════════════════════════ */

/* Show skull, hide towlie when skull is active */
#buddy[data-char="skull"] .css-towlie,
#buddy[data-char="skull"] #towlie-smoke { display: none !important; }
#buddy[data-char="skull"] .css-skull { display: block !important; }

/* Skull float animation (no legs, hovers) */
@keyframes skull-float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-4px); }
}
#buddy[data-char="skull"] .css-skull {
    animation: skull-float 4s ease-in-out infinite;
}

/* Eye glow pulse */
@keyframes skull-eye-pulse {
    0%, 100% { opacity: 0.85; }
    50% { opacity: 0.5; }
}
#buddy[data-char="skull"] .css-skull circle[fill*="var(--sk-eye)"],
#buddy[data-char="skull"] .css-skull circle[fill="var(--sk-eye,#FBBF24)"] {
    animation: skull-eye-pulse 3s ease-in-out infinite;
}

/* Jaw talking animation */
@keyframes skull-talk {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(4deg); }
}
#buddy.talking #skull-svg-jaw {
    animation: skull-talk 0.3s ease-in-out infinite;
}

/* Jaw clatter (excited/cold) */
@keyframes skull-clatter {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(3deg); }
    75% { transform: rotate(-2deg); }
}
#buddy[data-char="skull"][data-mood="excited"] #skull-svg-jaw {
    animation: skull-clatter 0.2s ease-in-out infinite;
}

/* Mood-based eye colors via CSS variable */
/* Reto eye colors: amber/gold spectrum */
#buddy[data-char="skull"][data-mood="happy"] .css-skull { --sk-eye: #FCD34D; }    /* bright gold */
#buddy[data-char="skull"][data-mood="chill"] .css-skull { --sk-eye: #FBBF24; }    /* warm amber */
#buddy[data-char="skull"][data-mood="hungry"] .css-skull { --sk-eye: #F59E0B; }   /* deep amber */
#buddy[data-char="skull"][data-mood="sleepy"] .css-skull { --sk-eye: #D97706; }   /* dim amber */
#buddy[data-char="skull"][data-mood="excited"] .css-skull { --sk-eye: #FDE68A; }  /* pale gold flash */
#buddy[data-char="skull"][data-mood="high"] .css-skull { --sk-eye: #F97316; }     /* orange glow */
#buddy[data-char="skull"][data-mood="stoned"] .css-skull { --sk-eye: #EA580C; }   /* deep orange */

/* Roll animation (skull-specific autonomous action) */
@keyframes skull-roll {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
#buddy[data-char="skull"].rolling .css-skull svg {
    animation: skull-roll 0.8s linear infinite;
}

/* Skull sleep (dim eyes, tilt) */
#buddy[data-char="skull"].sleep .css-skull {
    --sk-eye: #333;
    transform: rotate(-15deg) translateY(5px);
    animation: none;
}

/* Jaw falling off animation */
@keyframes jaw-fall {
    0% { transform: rotate(0deg) translateY(0); }
    30% { transform: rotate(15deg) translateY(5px); }
    60% { transform: rotate(25deg) translateY(15px); }
    100% { transform: rotate(35deg) translateY(30px); opacity: 0.5; }
}
#buddy.jaw-drop #skull-svg-jaw {
    animation: jaw-fall 0.6s ease-in forwards;
}

/* Dying animation */
@keyframes skull-die {
    0% { transform: rotate(0deg); opacity: 1; }
    50% { transform: rotate(45deg); }
    100% { transform: rotate(90deg); opacity: 0.3; }
}
#buddy.dying .css-skull {
    animation: skull-die 1s ease-in forwards;
}

/* Skull visual decay — progressive degradation when neglected */

/* Level 1: 1 day — slight dim, slower float */
#buddy[data-char="skull"][data-decay="1"] .css-skull {
    filter: brightness(0.9);
    animation-duration: 6s;
}

/* Level 2: 2 days — crack more visible, one tooth darker */
#buddy[data-char="skull"][data-decay="2"] .css-skull {
    filter: brightness(0.8) saturate(0.8);
    animation-duration: 8s;
}
#buddy[data-char="skull"][data-decay="2"] #skull-svg-crack-1 { opacity: 1; stroke-width: 1.2; }

/* Level 3: 3 days — cobweb overlay, very slow float, dim eyes */
#buddy[data-char="skull"][data-decay="3"] .css-skull {
    filter: brightness(0.7) saturate(0.6);
    animation-duration: 10s;
    --sk-eye: #666;
}
#buddy[data-char="skull"][data-decay="3"]::after {
    content: '🕸️';
    position: absolute;
    top: -5px;
    right: -5px;
    font-size: 16px;
    opacity: 0.7;
}

/* Level 4: 5 days — very dim, eyes barely glow, sits lower */
#buddy[data-char="skull"][data-decay="4"] .css-skull {
    filter: brightness(0.5) saturate(0.3) grayscale(0.3);
    animation: none;
    transform: translateY(5px);
    --sk-eye: #444;
}
#buddy[data-char="skull"][data-decay="4"]::after {
    content: '🕸️';
    position: absolute;
    top: -8px;
    right: -8px;
    font-size: 20px;
    opacity: 0.8;
}

/* Level 5: 7+ days — almost gone, lying on side, minimal glow */
#buddy[data-char="skull"][data-decay="5"] .css-skull {
    filter: brightness(0.35) saturate(0.1) grayscale(0.5);
    animation: none;
    transform: rotate(-20deg) translateY(10px);
    --sk-eye: #333;
}
#buddy[data-char="skull"][data-decay="5"]::after {
    content: '🕸️💤';
    position: absolute;
    top: -10px;
    right: -10px;
    font-size: 18px;
    opacity: 0.9;
}

/* Skull expression overlays — animate in/out */
#skull-svg-tear, #skull-svg-flame-l, #skull-svg-flame-r,
#skull-svg-question, #skull-svg-blush {
    transition: opacity 0.3s ease;
}

/* Skull eye tracking — smooth glow movement */
#skull-svg-eye-glow-l, #skull-svg-eye-glow-r {
    transition: transform 0.15s ease-out;
}

/* Skull idle eye flicker — smooth opacity transition */
#buddy[data-char="skull"] #skull-svg-eye-glow-l,
#buddy[data-char="skull"] #skull-svg-eye-glow-r {
    transition: opacity 0.1s ease, transform 0.15s ease-out;
}

/* Skull expression: angry/panicked — eye color override to red-orange */
#buddy[data-char="skull"][data-face="angry"] .css-skull { --sk-eye: #FF4500; }
#buddy[data-char="skull"][data-face="panicked"] .css-skull { --sk-eye: #FF6347; }
#buddy[data-char="skull"][data-face="shocked"] .css-skull { --sk-eye: #FF69B4; }

/* Skull expression: crying — dim blue eyes */
#buddy[data-char="skull"][data-face="crying"] .css-skull { --sk-eye: #7DD3FC; }
#buddy[data-char="skull"][data-face="guilty"] .css-skull { --sk-eye: #94A3B8; }

/* Skull expression: love/bliss — warm pink eyes */
#buddy[data-char="skull"][data-face="love"] .css-skull { --sk-eye: #F9A8D4; }
#buddy[data-char="skull"][data-face="bliss"] .css-skull { --sk-eye: #A78BFA; }

/* Skull expression: confused — flickering yellow eyes */
#buddy[data-char="skull"][data-face="confused"] .css-skull { --sk-eye: #FDE68A; }
#buddy[data-char="skull"][data-face="derp"] .css-skull { --sk-eye: #FDE68A; }

/* Skull expression: scheming — one eye brighter (asymmetric) */
#buddy[data-char="skull"][data-face="scheming"] #skull-svg-eye-glow-r { opacity: 0.3; }

/* Skull expression: stoned — slow pulse override */
#buddy[data-char="skull"][data-face="stoned"] #skull-svg-eye-glow-l,
#buddy[data-char="skull"][data-face="stoned"] #skull-svg-eye-glow-r {
    animation: skull-eye-pulse 5s ease-in-out infinite;
}

/* Skull expression: laughing — jaw chatter */
#buddy[data-char="skull"][data-face="laughing"] #skull-svg-jaw {
    animation: skull-clatter 0.25s ease-in-out infinite;
}

/* Skull expression: disgusted — jaw drops slightly */
#buddy[data-char="skull"][data-face="disgusted"] #skull-svg-jaw {
    transform: rotate(3deg);
}

/* ═══════════════════════════════════════════════════════════════
   SKULL — Vaporizer, Vapor & Bad Smoke Effects
   ═══════════════════════════════════════════════════════════════ */

/* Vape device — slide-in animation when shown */
#skull-svg-vape {
    transform-origin: 58px 68px;
}
#buddy[data-char="skull"].vaping #skull-svg-vape {
    display: block !important;
    animation: skull-vape-appear 0.4s ease-out forwards;
}
@keyframes skull-vape-appear {
    0%   { opacity: 0; transform: rotate(-25deg) translate(8px, 5px) scale(0.5); }
    60%  { opacity: 1; transform: rotate(-25deg) translate(-1px, 0) scale(1.05); }
    100% { opacity: 1; transform: rotate(-25deg) translate(0, 0) scale(1); }
}

/* Clean vapor — show during vape action */
#buddy[data-char="skull"].vaping #skull-svg-vapor {
    display: block !important;
    animation: skull-vapor-fadein 0.6s ease-in forwards;
}
@keyframes skull-vapor-fadein {
    0%   { opacity: 0; }
    100% { opacity: 1; }
}

/* Happy eye glow when vaping (brighter teal) */
#buddy[data-char="skull"].vaping .css-skull {
    --sk-eye: #5EEAD4;
}
#buddy[data-char="skull"].vaping #skull-svg-eye-glow-l,
#buddy[data-char="skull"].vaping #skull-svg-eye-glow-r {
    animation: skull-vape-glow 1.5s ease-in-out infinite;
}
@keyframes skull-vape-glow {
    0%, 100% { opacity: 1; filter: brightness(1); }
    50%      { opacity: 1; filter: brightness(1.4); }
}

/* Jaw relaxed open slightly when vaping */
#buddy[data-char="skull"].vaping #skull-svg-jaw {
    animation: skull-vape-jaw 4s ease-in-out infinite;
}
@keyframes skull-vape-jaw {
    0%, 100% { transform: rotate(0deg); }
    30%      { transform: rotate(2deg); }
    60%      { transform: rotate(0.5deg); }
}

/* ── Bad Smoke (anti-smoking: harsh, dark, coughing) ── */

#buddy[data-char="skull"].smoking-bad #skull-svg-smoke-bad {
    display: block !important;
    animation: skull-smoke-bad-in 0.3s ease-in forwards;
}
@keyframes skull-smoke-bad-in {
    0%   { opacity: 0; }
    100% { opacity: 1; }
}

/* Cough effect — hide normal eye glows, show X eyes */
#buddy[data-char="skull"].smoking-bad #skull-svg-eye-glow-l,
#buddy[data-char="skull"].smoking-bad #skull-svg-eye-glow-r {
    display: none !important;
}
#buddy[data-char="skull"].smoking-bad #skull-svg-cough-eyes {
    display: block !important;
}

/* Skull shakes when coughing from bad smoke */
#buddy[data-char="skull"].smoking-bad .css-skull svg {
    animation: skull-cough-shake 0.15s ease-in-out infinite;
}
@keyframes skull-cough-shake {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25%      { transform: translate(-2px, 1px) rotate(-2deg); }
    50%      { transform: translate(1px, -1px) rotate(1deg); }
    75%      { transform: translate(-1px, 2px) rotate(-1deg); }
}

/* Jaw chattering during cough */
#buddy[data-char="skull"].smoking-bad #skull-svg-jaw {
    animation: skull-cough-jaw 0.25s ease-in-out infinite;
}
@keyframes skull-cough-jaw {
    0%, 100% { transform: rotate(0deg); }
    30%      { transform: rotate(5deg); }
    60%      { transform: rotate(1deg); }
    80%      { transform: rotate(4deg); }
}

/* Eye color — sickly red when coughing */
#buddy[data-char="skull"].smoking-bad .css-skull {
    --sk-eye: #DC2626;
}

/* Slight discoloration of skull during bad smoke */
#buddy[data-char="skull"].smoking-bad #skull-svg-cranium {
    filter: sepia(0.15) brightness(0.92);
}

/* Transition cleanup — smooth fade out when effects end */
#skull-svg-vape,
#skull-svg-vapor,
#skull-svg-smoke-bad,
#skull-svg-cough-eyes {
    transition: opacity 0.5s ease-out;
}

/* ═══ NEW SKULL ANIMATIONS ═══ */

/* Teeth chatter — rapid jaw oscillation (cold/excited) */
@keyframes teeth-chatter {
    0%   { transform: rotate(0deg); }
    20%  { transform: rotate(2deg); }
    40%  { transform: rotate(-1deg); }
    60%  { transform: rotate(3deg); }
    80%  { transform: rotate(-0.5deg); }
    100% { transform: rotate(0deg); }
}
#buddy[data-char="skull"].teeth-chatter #skull-svg-jaw {
    animation: teeth-chatter 0.15s infinite;
    transform-origin: 35px 68px;
}

/* Skull wink — right eye glow dims and returns */
@keyframes skull-wink-anim {
    0%   { opacity: 0.9; }
    30%  { opacity: 0; }
    50%  { opacity: 0; }
    100% { opacity: 0.9; }
}
#buddy[data-char="skull"].skull-wink #skull-svg-eye-glow-r {
    animation: skull-wink-anim 0.6s ease-in-out;
}

/* Skull nod — subtle vertical agreement bob */
@keyframes skull-nod-anim {
    0%   { transform: translateY(0); }
    25%  { transform: translateY(-3px); }
    50%  { transform: translateY(2px); }
    75%  { transform: translateY(-1px); }
    100% { transform: translateY(0); }
}
#buddy[data-char="skull"].skull-nod .css-skull {
    animation: skull-nod-anim 0.5s ease-in-out;
}

/* Skull shake — horizontal disapproval */
@keyframes skull-shake-anim {
    0%   { transform: translateX(0); }
    20%  { transform: translateX(-3px); }
    40%  { transform: translateX(3px); }
    60%  { transform: translateX(-2px); }
    80%  { transform: translateX(1px); }
    100% { transform: translateX(0); }
}
#buddy[data-char="skull"].skull-shake .css-skull {
    animation: skull-shake-anim 0.4s ease-in-out;
}

/* Skull vibrate — anger/frustration jitter */
@keyframes skull-vibrate-anim {
    0%   { transform: translate(0, 0); }
    25%  { transform: translate(-1px, 1px); }
    50%  { transform: translate(1px, -1px); }
    75%  { transform: translate(-1px, -1px); }
    100% { transform: translate(1px, 1px); }
}
#buddy[data-char="skull"].skull-vibrate .css-skull {
    animation: skull-vibrate-anim 0.1s infinite;
}

/* Skull shrink — scared, gets smaller */
@keyframes skull-shrink-anim {
    0%   { transform: scale(1); }
    100% { transform: scale(0.7); }
}
#buddy[data-char="skull"].skull-shrink .css-skull {
    animation: skull-shrink-anim 0.3s ease-in forwards;
}

/* Skull peek — moves offscreen, peeks back */
@keyframes skull-peek-anim {
    0%   { transform: translateX(0); }
    25%  { transform: translateX(80px); opacity: 0.3; }
    40%  { transform: translateX(80px); opacity: 0.3; }
    55%  { transform: translateX(60px); opacity: 0.7; }
    70%  { transform: translateX(60px); opacity: 0.7; }
    100% { transform: translateX(0); opacity: 1; }
}
#buddy[data-char="skull"].skull-peek .css-skull {
    animation: skull-peek-anim 2s ease-in-out;
}

/* Skull dramatic jaw — slow shock drop */
@keyframes skull-dramatic-jaw-anim {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(12deg); }
}
#buddy[data-char="skull"].skull-dramatic-jaw #skull-svg-jaw {
    animation: skull-dramatic-jaw-anim 1.5s ease-out forwards;
    transform-origin: 35px 68px;
}

/* ═══ NEW EXPRESSION EYE COLORS ═══ */
#buddy[data-char="skull"][data-face="impressed"] { --sk-eye: #FFD700; }
#buddy[data-char="skull"][data-face="amazed"]    { --sk-eye: #FFD700; }
#buddy[data-char="skull"][data-face="nervous"]   { --sk-eye: #94A3B8; }
#buddy[data-char="skull"][data-face="greedy"]    { --sk-eye: #4ADE80; }
#buddy[data-char="skull"][data-face="musical"]   { --sk-eye: #A78BFA; }
#buddy[data-char="skull"][data-face="alert"]     { --sk-eye: #FF4500; }
#buddy[data-char="skull"][data-face="dizzy"]     { --sk-eye: #FBBF24; }
#buddy[data-char="skull"][data-face="in_love"]   { --sk-eye: #FF4D6A; }
#buddy[data-char="skull"][data-face="cold"]      { --sk-eye: #B0E0FF; }
#buddy[data-char="skull"][data-face="frustrated"]{ --sk-eye: #FF6347; }

/* Hide default eye glow when overlay eyes are shown */
#buddy[data-char="skull"][data-face="impressed"] #skull-svg-eye-glow-l,
#buddy[data-char="skull"][data-face="impressed"] #skull-svg-eye-glow-r,
#buddy[data-char="skull"][data-face="amazed"] #skull-svg-eye-glow-l,
#buddy[data-char="skull"][data-face="amazed"] #skull-svg-eye-glow-r,
#buddy[data-char="skull"][data-face="greedy"] #skull-svg-eye-glow-l,
#buddy[data-char="skull"][data-face="greedy"] #skull-svg-eye-glow-r,
#buddy[data-char="skull"][data-face="dizzy"] #skull-svg-eye-glow-l,
#buddy[data-char="skull"][data-face="dizzy"] #skull-svg-eye-glow-r,
#buddy[data-char="skull"][data-face="in_love"] #skull-svg-eye-glow-l,
#buddy[data-char="skull"][data-face="in_love"] #skull-svg-eye-glow-r {
    opacity: 0.15;
}