/* Sherwood · Corgi companion. Transforms/opacity only; everything scoped under .cpal */
.cpal{position:fixed;left:0;top:0;z-index:9000;width:var(--cw);height:var(--ch);--px:3.6px;--cw:calc(var(--px)*28);--ch:calc(var(--px)*18);
  transform:translate3d(var(--x,-200px),var(--y,-200px),0);will-change:transform;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;
  transition:opacity .4s ease}
.cpal.snap{transition:transform .38s cubic-bezier(.3,1.35,.5,1),opacity .4s ease}
.cpal.walk{transition:transform var(--wd,2s) linear,opacity .4s ease}
.cpal.drag{transition:none;cursor:grabbing}
.intro-on .cpal,body.intro .cpal{opacity:0;pointer-events:none}
.cpal-btn{all:unset;position:absolute;inset:0;cursor:grab;border-radius:10px;outline-offset:3px}
.cpal-btn:focus-visible{outline:2px solid #f2c14e}
.cpal-spr{position:absolute;inset:0;transform:scaleX(var(--face,1));transition:transform .25s ease;filter:drop-shadow(0 2px 0 rgba(0,0,0,.35)) drop-shadow(0 0 10px rgba(242,193,78,.18))}
.cpal svg{width:100%;height:100%;display:block;overflow:visible;shape-rendering:crispEdges}
.cpal svg g{transform-box:fill-box}
/* shadow under the dog */
.cpal-sh{position:absolute;left:12%;right:12%;bottom:-3px;height:5px;border-radius:50%;background:rgba(0,0,0,.35);filter:blur(2px);transform-origin:center}
/* idle: breathing + slow tail */
.cpal .c-body{transform-origin:50% 100%;animation:cpBreath 2.6s ease-in-out infinite}
.cpal .c-head{transform-origin:20% 90%;animation:cpHead 5.2s ease-in-out infinite}
.cpal .c-tail{transform-origin:100% 70%;animation:cpTail 1.6s ease-in-out infinite}
.cpal .c-eye{transform-origin:50% 50%}
.cpal .c-mouth{opacity:0}
.cpal .c-zz{opacity:0}
@keyframes cpBreath{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.045)}}
@keyframes cpHead{0%,100%{transform:translateY(0)}50%{transform:translateY(.25px)}}
@keyframes cpTail{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(14deg)}}
/* blink */
.cpal.blink .c-eye{transform:scaleY(.15)}
/* wag burst / hover */
.cpal.wag .c-tail,.cpal.hover .c-tail{animation:cpWag .18s ease-in-out infinite alternate}
@keyframes cpWag{from{transform:rotate(-24deg)}to{transform:rotate(26deg)}}
.cpal.hover .c-ears{transform:translateY(-.6px)}
.cpal .c-ears{transition:transform .2s}
/* sniff: head down, nose wiggle */
.cpal.sniff .c-head{animation:cpSniff .5s ease-in-out infinite alternate}
@keyframes cpSniff{from{transform:translateY(1.4px) rotate(9deg)}to{transform:translateY(1.9px) rotate(12deg)}}
/* sit: rear lowers, back legs fold */
.cpal.sit .c-rear{transform:translateY(1.6px) rotate(-7deg)}
.cpal .c-rear{transform-origin:85% 100%;transition:transform .45s ease}
.cpal.sit .c-bleg{transform:scaleY(.35)}
.cpal .c-bleg{transform-origin:50% 100%;transition:transform .45s ease}
/* yawn */
.cpal.yawn .c-mouth{opacity:1}.cpal.yawn .c-head{animation:cpYawn 1.6s ease-in-out}.cpal.yawn .c-eye{transform:scaleY(.15)}
@keyframes cpYawn{0%,100%{transform:rotate(0)}40%,70%{transform:rotate(-10deg) translateY(-.4px)}}
/* walk: legs step, body bobs */
.cpal.walk .c-leg{animation:cpStep .32s steps(2) infinite}.cpal.walk .c-leg.b{animation-delay:-.16s}
.cpal.walk .c-body{animation:cpBob .32s steps(2) infinite}
@keyframes cpStep{from{transform:translateY(0)}to{transform:translateY(-1px)}}
@keyframes cpBob{from{transform:translateY(0)}to{transform:translateY(-.5px)}}
/* hover tip */
.cpal-tip{position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%,4px);opacity:0;pointer-events:none;white-space:nowrap;
  font:600 11px/1 "Instrument Sans",system-ui,sans-serif;color:#1b1206;background:#f2c14e;padding:6px 8px;border-radius:8px;box-shadow:0 4px 14px rgba(0,0,0,.35);transition:opacity .2s,transform .2s}
.cpal-tip::after{content:"";position:absolute;left:50%;top:100%;margin-left:-4px;border:4px solid transparent;border-top-color:#f2c14e}
.cpal.hover .cpal-tip{opacity:1;transform:translate(-50%,0)}
.cpal-x{all:unset;position:absolute;right:-8px;top:-8px;width:20px;height:20px;border-radius:50%;background:rgba(10,18,12,.9);border:1px solid rgba(242,193,78,.45);color:#f2c14e;
  font:700 12px/20px system-ui,sans-serif;text-align:center;cursor:pointer;opacity:0;transform:scale(.8);transition:opacity .2s,transform .2s}
.cpal.hover .cpal-x,.cpal-x:focus-visible{opacity:1;transform:none}
@media (hover:none){.cpal-x{opacity:.85;transform:none}}
/* minimized: tiny round bubble with the head */
.cpal.min{--cw:44px;--ch:44px}
.cpal.min .cpal-spr,.cpal.min .cpal-sh,.cpal.min .cpal-x,.cpal.min .cpal-tip{display:none}
.cpal-bub{display:none;position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#1f3a26,#0b1a10);border:1px solid rgba(242,193,78,.55);box-shadow:0 6px 18px rgba(0,0,0,.45),0 0 0 3px rgba(242,193,78,.08);pointer-events:none}
.cpal-bub svg{position:absolute;left:7px;top:8px;width:30px;height:27px}
.cpal.min .cpal-bub{display:block}
.cpal.min .cpal-btn{border-radius:50%}
.cpal.paused *,.cpal.rm *{animation-play-state:paused!important}
.cpal.rm *{animation:none!important;transition:none!important}
/* ---------------- panel ---------------- */
.cpan{position:fixed;z-index:9001;left:0;top:0;width:min(360px,calc(100vw - 16px));max-height:min(560px,calc(100vh - 24px));display:flex;flex-direction:column;
  background:linear-gradient(180deg,rgba(16,30,20,.97),rgba(8,16,11,.97));border:1px solid rgba(242,193,78,.32);border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.05);
  color:#e9e4d4;font:400 14px/1.45 "Instrument Sans",system-ui,-apple-system,sans-serif;opacity:0;transform:translate3d(var(--px0,0),var(--py0,0),0) scale(.96);transform-origin:var(--to,100% 100%);pointer-events:none;
  transition:opacity .2s ease,transform .22s cubic-bezier(.3,1.2,.5,1);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.cpan.on{opacity:1;transform:translate3d(var(--px0,0),var(--py0,0),0);pointer-events:auto}
.cpan[hidden]{display:none}
.cpan-h{display:flex;align-items:center;gap:10px;padding:12px 12px 10px 14px;border-bottom:1px solid rgba(242,193,78,.14)}
.cpan-h img{width:34px;height:34px;border-radius:50%;background:#1c2a1f;padding:2px}
.cpan-h b{display:block;font:600 15px/1.15 "Instrument Sans",system-ui,sans-serif;color:#fff}
.cpan-h small{display:block;font-size:11.5px;color:#a9b49d;margin-top:2px}
.cpan-h small i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#7be38a;margin-right:5px;vertical-align:1px;font-style:normal}
.cpan-h .sp{flex:1;min-width:0}
.cpan-h a{color:#f2c14e;font-size:12px;text-decoration:none;white-space:nowrap}.cpan-h a:hover{text-decoration:underline}
.cpan-c{all:unset;width:30px;height:30px;border-radius:8px;text-align:center;line-height:30px;cursor:pointer;color:#cfd6c5;font-size:18px}
.cpan-c:hover,.cpan-c:focus-visible{background:rgba(255,255,255,.07);color:#fff}
.cpan-m{flex:1;overflow-y:auto;padding:12px 12px 4px;overscroll-behavior:contain;scrollbar-width:thin}
.cpm{max-width:88%;margin:0 0 10px;padding:9px 11px;border-radius:12px 12px 12px 4px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.06);word-wrap:break-word}
.cpm.me{margin-left:auto;border-radius:12px 12px 4px 12px;background:rgba(242,193,78,.16);border-color:rgba(242,193,78,.25);color:#fff6dc}
.cpm p{margin:0 0 6px}.cpm p:last-child{margin:0}
.cpm a{color:#f2c14e;text-decoration:underline;text-underline-offset:2px}
.cpm .k{display:inline-block;font:600 9.5px/1 ui-monospace,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:#1b1206;background:#f2c14e;border-radius:4px;padding:3px 5px;margin-right:6px;vertical-align:1px}
.cpm .k.system{background:#8fb8a0}.cpm .k.news{background:#9fc3ff}
.cpm .t{color:#93a089;font-size:11.5px}
.cpm ul{margin:4px 0 6px;padding-left:16px}.cpm li{margin:2px 0}
.cpm .note{color:#93a089;font-size:12px}
.cpm.typing{display:inline-flex;gap:4px;padding:12px 13px}
.cpm.typing i{width:6px;height:6px;border-radius:50%;background:#cfd6c5;opacity:.4;animation:cpDot 1s infinite}.cpm.typing i:nth-child(2){animation-delay:.15s}.cpm.typing i:nth-child(3){animation-delay:.3s}
@keyframes cpDot{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}}
.cpan-q{display:flex;flex-wrap:wrap;gap:6px;padding:8px 12px 4px}
.cpan-q button{all:unset;cursor:pointer;font-size:12.5px;line-height:1;padding:7px 10px;border-radius:999px;border:1px solid rgba(242,193,78,.35);color:#f6dc9c;background:rgba(242,193,78,.06);transition:background .15s}
.cpan-q button:hover,.cpan-q button:focus-visible{background:rgba(242,193,78,.18);color:#fff}
.cpan-f{display:flex;gap:8px;padding:8px 12px 12px}
.cpan-f input{flex:1;min-width:0;font:inherit;font-size:16px;color:#fff;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:9px 11px;outline:none}
.cpan-f input:focus{border-color:rgba(242,193,78,.6)}
.cpan-f button{all:unset;cursor:pointer;padding:0 14px;border-radius:10px;background:#f2c14e;color:#1b1206;font-weight:600;font-size:14px}
.cpan-f button:focus-visible{outline:2px solid #fff;outline-offset:2px}
.cpan-ft{padding:0 14px 10px;font-size:10.5px;color:#7d8a74}
@media (max-width:560px){.cpan{left:8px!important;right:8px;width:auto;top:auto!important;bottom:8px;max-height:72vh;--px0:0!important;--py0:0!important;transform-origin:50% 100%}
  .cpal.open-m{opacity:0;pointer-events:none}}
@media (prefers-reduced-motion:reduce){.cpan{transition:opacity .15s}.cpm.typing i{animation:none;opacity:.7}}

/* Arena: smaller, no walking, starts as a bubble */
.cpal.arena{--px:2.6px}.cpal.arena.min{--cw:38px;--ch:38px}.cpal.arena .cpal-bub svg{left:5px;top:6px;width:27px;height:24px}
@media (max-width:560px){.cpal{--px:3px}}
