.developer-feedback{position:relative;margin-top:20px;padding:0 0 8px;color:var(--dim);font:inherit;border:0}
.developer-feedback summary{position:relative;display:flex;align-items:center;justify-content:center;width:52px;height:52px;margin-left:auto;cursor:pointer;list-style:none;border:0;border-radius:50%;background:transparent;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.developer-feedback summary::-webkit-details-marker{display:none}
.developer-feedback summary::before{content:none}
.developer-feedback summary:focus-visible{outline:2px solid #e8d6a0;outline-offset:2px}
.feedback-firefly{position:relative;display:block;width:32px;height:32px;pointer-events:none;transform:rotate(-18deg);animation:firefly-float 9s ease-in-out infinite}
.firefly-halo{position:absolute;inset:-14px;border-radius:50%;background:radial-gradient(circle,rgba(246,219,126,.26),rgba(195,207,129,.08) 43%,transparent 70%);animation:firefly-glow 3.8s ease-in-out infinite}
.firefly-body{position:absolute;left:13px;top:12px;width:7px;height:15px;border-radius:55% 55% 48% 48%;background:linear-gradient(#88744d 5%,#d0b66c 32%,#fff3bb 65%,#f4cf76);box-shadow:0 3px 7px #efd781,0 5px 18px #eac87590;animation:firefly-glow 3.8s ease-in-out infinite}
.firefly-body::before{content:'';position:absolute;width:5px;height:5px;left:1px;top:-4px;border-radius:50%;background:#d8c396;box-shadow:0 0 4px #eadbb376}
.firefly-wing{position:absolute;top:7px;width:12px;height:17px;border:1px solid #e6e6c665;background:linear-gradient(145deg,#e6eacf40,#d4dcb00a);box-shadow:inset 0 0 5px #e4dfb82b;border-radius:80% 20% 75% 25%}
.firefly-wing-left{left:2px;transform-origin:100% 80%;transform:rotate(-29deg);animation:firefly-wing-left 2.3s ease-in-out infinite}
.firefly-wing-right{right:1px;transform-origin:0 80%;transform:scaleX(-1) rotate(-29deg);animation:firefly-wing-right 2.3s ease-in-out infinite}
.firefly-spark{position:absolute;left:3px;top:30px;width:2px;height:2px;border-radius:50%;background:#ffedb4;box-shadow:23px -27px 3px #efe0a6,29px -4px 2px #e6d391;animation:firefly-glow 4.7s ease-in-out infinite reverse}
.developer-feedback summary:hover .firefly-halo,.developer-feedback[open] .firefly-halo{background:radial-gradient(circle,#f6db7e55,transparent 70%)}
.developer-feedback[open] .feedback-firefly{animation-play-state:paused}
.developer-feedback[open] form{padding:18px;border:1px solid #d8c69b20;border-radius:18px;background:rgba(32,29,25,.66);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
@keyframes firefly-float{0%,100%{transform:translate(-1px,1px) rotate(-10deg)}50%{transform:translate(1px,-2px) rotate(-4deg)}}
@keyframes firefly-glow{0%,100%{opacity:.48}50%{opacity:1}}
@keyframes firefly-wing-left{0%,100%{transform:rotate(-29deg)}50%{transform:rotate(-42deg)}}
@keyframes firefly-wing-right{0%,100%{transform:scaleX(-1) rotate(-29deg)}50%{transform:scaleX(-1) rotate(-42deg)}}
@media(prefers-reduced-motion:reduce){.feedback-firefly,.feedback-firefly *{animation:none!important}}
.developer-feedback form{display:grid;gap:12px;padding:8px 0}
.developer-feedback label{display:grid;gap:10px;font-size:13px;color:var(--ivory)}
.developer-feedback textarea{box-sizing:border-box;width:100%;min-height:88px;resize:vertical;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--ground);color:var(--ivory);font:inherit;font-size:16px;line-height:1.5}
.developer-feedback textarea:focus{outline:2px solid var(--jade);outline-offset:2px}
.developer-feedback button{justify-self:start;min-height:44px;padding:10px 16px}
.feedback-status{font-size:13px;line-height:1.5;margin:0;overflow-wrap:anywhere}
.feedback-status:empty{display:none}

/* Recognisable beetle silhouette: antennae, six legs, paired wing cases and luminous abdomen. */
.feedback-firefly{width:32px;height:36px}
.firefly-insect{position:relative;display:block;width:100%;height:100%;overflow:visible}
.firefly-halo{inset:10px -10px -14px;background:radial-gradient(ellipse,#f6db7e33,transparent 68%)}
.firefly-lantern{filter:drop-shadow(0 0 3px #ffe18a) drop-shadow(0 0 7px #efcb6877);animation:firefly-glow 3.8s ease-in-out infinite}

/* A quiet pause, then front legs groom the antennae in three small strokes. */
.firefly-wash-left,.firefly-wash-right,.firefly-antenna-left,.firefly-antenna-right{transform-box:view-box;animation-duration:9s;animation-timing-function:ease-in-out;animation-iteration-count:infinite}
.firefly-wash-left{transform-origin:27px 29px;animation-name:firefly-wash-left}
.firefly-wash-right{transform-origin:37px 29px;animation-name:firefly-wash-right}
.firefly-antenna-left{transform-origin:28px 19px;animation-name:firefly-antenna-left}
.firefly-antenna-right{transform-origin:36px 19px;animation-name:firefly-antenna-right}
@keyframes firefly-wash-left{0%,18%,64%,100%{transform:rotate(0deg)}28%,40%,52%{transform:rotate(128deg)}34%,46%,58%{transform:rotate(145deg)}}
@keyframes firefly-wash-right{0%,18%,64%,100%{transform:rotate(0deg)}28%,40%,52%{transform:rotate(-128deg)}34%,46%,58%{transform:rotate(-145deg)}}
@keyframes firefly-antenna-left{0%,20%,64%,100%{transform:rotate(0deg)}28%,40%,52%{transform:rotate(-9deg)}34%,46%,58%{transform:rotate(5deg)}}
@keyframes firefly-antenna-right{0%,20%,64%,100%{transform:rotate(0deg)}28%,40%,52%{transform:rotate(9deg)}34%,46%,58%{transform:rotate(-5deg)}}

/* Approved articulated forelegs follow stationary antennae. */
.firefly-antenna-left,.firefly-antenna-right{animation:none}

body dialog.feedback-dialog{width:min(440px,calc(100vw - 24px));max-height:calc(100dvh - 24px);box-sizing:border-box;padding:20px;overflow-y:auto;overscroll-behavior:contain;color:#f0eae3;border:1px solid #d1bea72b;border-radius:20px;background:linear-gradient(145deg,#483c2bd9,#191c1ced);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);outline:none}
body dialog.feedback-dialog::backdrop{background:#0006}
.feedback-dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}
.feedback-dialog-heading h3{margin:0;font:500 20px/1.3 var(--body)}
body .feedback-form{display:grid;gap:10px;min-width:0}
body .feedback-form label{display:grid;gap:8px;color:#cfc3b7;font:400 13px/1.5 var(--body)}
body .feedback-form textarea{box-sizing:border-box;width:100%;min-height:100px;resize:vertical;padding:10px 11px;border:1px solid #b7a18b2e;border-radius:10px;background:#1b1c2073;color:#f0eae3;font:400 16px/1.5 var(--body)}
body :is(.feedback-form,.feedback-dialog-heading) button{justify-self:start;min-height:44px;width:auto;margin:0;padding:5px 0;border:0;border-radius:0;background:transparent;box-shadow:none;color:#d0ad85;font:400 13px/1.4 var(--body);cursor:pointer}
body :is(.feedback-form,.feedback-dialog-heading) button:disabled{opacity:.45;cursor:default}
body .feedback-form [hidden]{display:none!important}
body :is(.feedback-form,.feedback-dialog-heading) :is(button,textarea):focus-visible{outline:1px solid #d0ad85;outline-offset:2px}
.feedback-attachment-hint{margin:-6px 0 0;color:#b7aca0;font:400 12px/1.5 var(--body)}
.feedback-previews{display:flex;gap:8px;flex-wrap:wrap}
.feedback-previews:empty{display:none}
.feedback-previews figure{position:relative;margin:0;width:calc((100% - 16px)/3);max-width:110px}
.feedback-previews img{display:block;width:100%;height:100px;object-fit:contain;border:1px solid #b7a18b2e;border-radius:8px;background:#191c1c}
body .feedback-previews button{position:absolute;top:0;right:0;width:36px;min-height:36px;padding:0;border-radius:0 8px 0 8px;color:#f0eae3;background:#191c1cee;font-size:22px}
body .feedback-form .feedback-status{font:400 13px/1.5 var(--body);color:#cfc3b7}
