.critter-art {background:radial-gradient(ellipse at 70% 40%,#80452f35,transparent 70%),#100c16}
.critter-moon {position:absolute;left:63%;top:17%;width:88px;height:88px;border-radius:50%;background:#f4cb79;box-shadow:0 0 0 18px #e5a34f09,0 0 55px #d5823333}
.critter-ledge {position:absolute;height:35%;width:68%;bottom:0;background:#3b1e32;clip-path:polygon(0 45%,12% 45%,12% 24%,22% 24%,22% 7%,63% 7%,63% 27%,72% 27%,72% 48%,100% 48%,100% 100%,0 100%)}
.critter-ledge.first {left:-4%}.critter-ledge.second {right:-15%;bottom:-6%;height:53%;background:#251526}
.critter-bird {position:absolute;left:23%;top:66%;width:28px;height:20px;background:var(--gold);clip-path:polygon(0 20%,33% 45%,48% 19%,60% 45%,100% 0,73% 69%,53% 58%,27% 72%);animation:critter-rise 9s cubic-bezier(.2,.6,.4,1) infinite;filter:drop-shadow(0 0 9px #e9bf6533)}
.bird-two {left:36%;animation-delay:.18s;width:24px}.bird-three {left:49%;animation-delay:.37s;width:21px}
.critter-records {position:absolute;bottom:37px;left:13%;color:#b18882;font-size:25px;letter-spacing:8px}
.motion-off .critter-bird,.note-offscreen .critter-bird {animation-play-state:paused}
@keyframes critter-rise {0%,22%{transform:translate(0,0) rotate(0);opacity:1}52%{transform:translate(45px,-92px) rotate(-9deg);opacity:1}72%,80%{transform:translate(135px,-140px) rotate(8deg);opacity:0}81%,89%{transform:translate(0,0);opacity:0}100%{transform:translate(0,0);opacity:1}}
@media(prefers-reduced-motion:reduce){.critter-bird {animation:none}}

.critter-lab {margin-block:28px;border:1px solid #e9bf6533;background:#110d17}
.critter-lab canvas {display:block;width:100%;height:400px;touch-action:pan-y;cursor:crosshair}
.critter-lab canvas:focus-visible {outline:2px solid var(--gold);outline-offset:-3px}
.critter-run {font:10px/1.5 ui-monospace,monospace;color:var(--muted)}
.critter-stats {display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding:16px 20px 0;font-size:12px;color:var(--muted)}
.critter-stats strong,.critter-stats b,.critter-stats output {color:var(--ivory);font-variant-numeric:tabular-nums}
.critter-stats strong {font-size:20px}
.reading-body .critter-overview {display:flex;gap:8px 22px;justify-content:space-between;margin:0!important;padding:0 18px 18px;font:9px/1.6 ui-monospace,monospace;color:var(--gold)}
.critter-overview span {color:var(--muted);max-width:300px}
.critter-counts {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#e9bf6518;border-block:1px solid #e9bf6522}
.critter-counts span {display:flex;justify-content:space-between;gap:8px;background:#18111e;padding:10px 18px;font-size:11px;color:var(--muted)}
.critter-counts b {color:var(--ivory);font-variant-numeric:tabular-nums}
.critter-lab fieldset {min-width:0;border:0;margin:0;padding:20px}
.critter-actions,.critter-settings {display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.critter-lab button,.critter-lab select {border:1px solid #e9bf6544;background:#291b29;color:var(--ivory);padding:11px 12px;min-height:44px;font:inherit;font-size:11px;line-height:1.4;cursor:pointer}
.critter-lab button:hover,.critter-lab select:hover {border-color:var(--gold);background:#3b2831}
.critter-lab button:focus-visible,.critter-lab select:focus-visible,.critter-lab input:focus-visible {outline:2px solid var(--gold);outline-offset:3px}
.critter-lab button:disabled {opacity:.5;cursor:default}
.critter-actions [data-alarm] {border-color:#c78a5d;background:#472b31}
.critter-sliders {display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:22px 0}
.critter-sliders label {font-size:12px;color:var(--ivory)}
.critter-sliders output {float:right;color:var(--gold);font:11px/1.6 ui-monospace,monospace}
.critter-sliders input {display:block;width:100%;margin:14px 0;accent-color:var(--gold);cursor:ew-resize;min-height:24px}
.critter-settings {gap:12px 18px;font-size:11px;color:var(--muted)}
.critter-follow {display:flex;gap:8px;align-items:center;min-height:44px}.critter-follow input {accent-color:var(--gold);width:16px;height:16px}
.critter-settings select {margin-left:6px}.critter-settings [data-play] {margin-left:auto}
.critter-status {font-size:12px!important;color:var(--gold)!important;margin:0!important;padding:0 20px 20px;min-height:64px}
.critter-events {border-top:1px solid #e9bf6522;margin:0!important;padding:16px 20px;font-size:12px}
.critter-events ol {padding-left:18px;margin-bottom:0;color:var(--muted)}
.critter-events li {padding-block:3px}.critter-events li span {display:inline-block;min-width:50px;color:var(--gold);font:10px/1.6 ui-monospace,monospace}
@media(max-width:520px){.critter-lab canvas {height:380px}.critter-lab .lab-head {padding:16px}.critter-stats {padding-inline:16px}.critter-counts span {padding:9px 12px}.reading-body .critter-overview {flex-direction:column;gap:4px}.critter-lab fieldset {padding:16px}.critter-sliders {grid-template-columns:1fr;gap:10px}.critter-actions button {flex:1 1 calc(50% - 10px)}.critter-settings [data-play] {margin-left:0}.critter-settings button {flex:1}.critter-status {padding-inline:16px}.critter-run {font-size:9px}}

.critter-lab .visually-hidden {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

@media(max-width:520px){.critter-settings > label{flex-basis:100%}.critter-settings button{flex:1 1 calc(50% - 10px);min-width:110px}}