/* A quiet nature expedition: fixed hit targets, moving illustrations. */
body[data-game=bugs]{background:radial-gradient(ellipse at 10% 0,#e8f0e3,transparent 50%),#f6f4eb;color:#294b3e}
body[data-game=bugs] main{max-width:1240px;margin:12px auto;padding:18px 26px}
body[data-game=bugs] .quality-toolbar{margin-bottom:10px}
body[data-game=bugs] h1{margin:12px 0 8px;font-size:clamp(27px,3.4vw,38px);letter-spacing:.045em}
body[data-game=bugs] #instruction{margin:0 0 12px;line-height:1.65;font-size:14px;max-width:850px}
body[data-game=bugs] .bar{margin:10px 0 14px}
body[data-game=bugs] button{transition:background .18s,color .18s;line-height:1.4}
body[data-game=bugs] #status{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);padding:0;margin:0;min-height:0}
body[data-game=bugs] .bug-entry:disabled{opacity:1}
.safari-habitats{gap:12px;margin:12px 0}
.safari-habitats button{grid-template-columns:65px 1fr auto;border-radius:18px!important;min-height:68px}
.safari-habitats img{width:65px;height:65px}
.safari-habitats span{font-size:14px}
.safari-navigation{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:15px 0}
.safari-options,.safari-views{display:flex;gap:7px;margin:0}
.safari-options button,.safari-views button{font-size:13px!important;min-height:46px!important;padding:10px 15px!important}
.safari-views span{margin-left:5px;font-size:12px;font-weight:650}
.safari-play{border-radius:25px;box-shadow:0 12px 40px #344d2410}
.walk-heading{padding:19px 22px 16px}
.walk-heading h2{font-size:22px;margin:5px 0 0}
.walk-counter{font-size:22px;padding:8px 18px}
.safari-expedition{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:16px;padding:0 18px 16px}
.scene-column{min-width:0}
.safari-scene{aspect-ratio:1.5;background-size:cover;background-position:center;min-height:0;margin:0;border-radius:19px;box-shadow:inset 0 0 0 1px #39493130}
.safari-scene:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 -25px 40px #2846231a;pointer-events:none}
.safari-place{width:clamp(76px,10vw,115px);height:clamp(76px,10vw,110px)}
body[data-game=bugs] .safari-bug{animation:none!important;border-radius:50%;touch-action:manipulation}
.safari-bug img{animation-duration:5s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-delay:var(--delay);filter:drop-shadow(0 4px 3px #293d2c55)}
.safari-bug.motion-flutter img{animation-name:expedition-flutter;animation-duration:4.5s}
.safari-bug.motion-hover img{animation-name:expedition-hover;animation-duration:3.8s}
.safari-bug.motion-crawl img{animation-name:expedition-crawl;animation-duration:7s}
.safari-bug.motion-scurry img{animation-name:expedition-scurry;animation-duration:6s}
.safari-bug.motion-hop img{animation-name:expedition-hop;animation-duration:5.5s}
.safari-bug.motion-climb img{animation-name:expedition-climb;animation-duration:8s}
.safari-bug.motion-glow img{animation-name:expedition-glow;animation-duration:4s}
.safari-bug:hover img,.safari-bug:focus-visible img,.net-active .safari-bug img,.motion-off .safari-bug img{animation-play-state:paused!important}
.safari-bug:focus-visible{outline:3px solid #fff2b0!important;outline-offset:3px!important}
.safari-cover{transform:none;border-radius:50%!important;transform-origin:20% 80%;transition:transform .45s,opacity .35s}
.safari-cover img{transform:rotate(var(--tilt))}
.cover-clover img{filter:drop-shadow(0 5px 3px #33452b55)}
.safari-cover span{width:27px;height:27px;line-height:27px;font-size:20px;right:4%;bottom:0;border:1px solid #fff5cd}
.safari-cover:hover img{filter:drop-shadow(0 5px 3px #30452b55) brightness(1.06)}
.is-revealed .cover-leaf{transform:rotate(-75deg) translate(-25%,-25%);opacity:0}
.is-revealed .cover-log{transform:translate(45%,18%) rotate(28deg);opacity:0}
.is-revealed .cover-clover{transform:translate(-20%,20%) scaleX(.65);opacity:0}
.is-caught .safari-bug{opacity:0;pointer-events:none}
body[data-game=bugs] .is-revealed .safari-cover,body[data-game=bugs] .is-caught .safari-bug{opacity:0}
.found-mark{width:29px;height:29px;font-size:15px;background:#fffbeaee;left:calc(50% - 14px);top:calc(50% - 14px)}
.hinted:before{inset:-4px;box-shadow:0 0 0 4px #62875470}
.net-dock{padding:12px 3px 8px;gap:12px}
.net-tool{width:76px;height:80px;background:#f7edd6!important;border:1px solid #d7caa5!important;box-shadow:0 3px 0 #d7caa5!important}
.net-dock p{font-size:12px;line-height:1.6;margin:0}
.net-dock p strong{font-size:15px;margin-bottom:3px}
body[data-game=bugs] #bugHint{display:flex;align-items:center;gap:5px;font-size:13px;padding:10px 12px;flex-shrink:0}
#bugHint svg{width:18px;height:18px}
.walk-message{min-height:28px;line-height:1.65;font-size:13px;margin:6px 1px 0;color:#486c51}
.walk-notebook{background:linear-gradient(100deg,#eee9d7,#fffcf0 8%,#fbf7e8);border:1px solid #ddd9c4;border-radius:18px;padding:19px 14px;box-shadow:inset 5px 0 #e9e1c7;min-width:0}
.walk-notebook h3{font-size:17px;line-height:1.5;margin:10px 0 15px}
.walk-list{display:grid;gap:7px}
.walk-list.bug-targets{padding:0;display:grid;margin:0}
.walk-friend{display:grid;grid-template-columns:45px minmax(0,1fr) 18px;align-items:center;gap:6px;min-height:49px;border-bottom:1px dashed #dbd8c6;padding:3px 0}
.walk-friend img{width:45px;height:42px;object-fit:contain}
.walk-friend>span{font-size:12px;line-height:1.5}
.walk-friend b{color:#a5ad98;font-size:17px}
.walk-friend.found b{color:#447455}
.walk-friend.found>span{font-weight:700}
.friend-hidden{display:grid;place-items:center;height:42px;font:italic 28px Georgia;color:#b1ba9e}
.walk-dots{padding:17px 0 7px;gap:10px;font-size:15px}
.notebook-tip{font-size:12px;color:#778166;line-height:1.8;margin:10px 0 14px}
body[data-game=bugs] #openGuide{width:100%;font-size:13px;padding:11px 8px}
#openGuide small{margin-left:5px}
.badge-notice{display:flex;align-items:center;gap:8px;background:#fff2c6;border:1px solid #dbc888;border-radius:12px;padding:5px;margin:12px 0}
.badge-notice img{width:57px;height:66px;object-fit:contain}
.badge-notice strong,.badge-notice span{display:block;font-size:12px;line-height:1.7}
.badge-notice span{font-size:11px}
.walk-complete{padding:20px;gap:15px;background:#eaf0df;border-top:1px solid #d9e1ca}
.walk-complete>img{width:70px;height:78px;object-fit:contain}
.walk-complete>div{min-width:170px}
.walk-complete h2{font-size:20px}
.walk-complete .safari-primary{font-size:15px;padding:13px 20px}
.field-guide{margin:0;background:linear-gradient(100deg,#eee8d5,#fffdf3 3%,#fffdf3);padding:26px;border-radius:24px;box-shadow:inset 7px 0 #e7dec5}
.guide-heading h2{font-size:25px;margin:8px 0 17px}
.guide-heading>strong{white-space:nowrap;flex-shrink:0;margin-left:10px}
.reward-hint{line-height:1.7}
.safari-badges{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:24px 0 27px}
.safari-badge{display:flex;flex-direction:column;align-items:center;gap:7px;color:#466146;min-width:0;text-align:center}
.safari-badge img{width:120px;height:135px;max-width:100%;object-fit:contain}
.safari-badge strong{font-size:13px;line-height:1.5}
.safari-badge small{font-size:11px;line-height:1.5}
.safari-badge.locked{color:#8a9180}
.safari-badge.locked img{filter:grayscale(.85);opacity:.35}
.safari-badge.earned img{filter:drop-shadow(0 4px 3px #65583725)}
.notes-summary{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;background:#eef1e3;border-radius:12px;font-size:14px}
.notes-summary>span{display:flex;align-items:center;gap:8px}
.notes-summary svg{width:20px;height:20px}
.guide-tip{font-size:13px;line-height:1.7;color:#738166;margin:15px 2px}
.bug-book{grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
body[data-game=bugs] .bug-entry{padding:12px 8px;background:linear-gradient(145deg,#fffefa,#f4f1e3);border-color:#dcdcc4;min-height:190px}
.bug-entry img{height:125px;object-fit:contain;filter:drop-shadow(0 3px 2px #34412b15)}
.bug-entry strong{line-height:1.55}
.bug-entry small{line-height:1.6}
.entry-notes{display:flex;gap:8px;margin-top:8px}
.entry-notes i{font-style:normal;font-size:12px;color:#c8cebb}
.entry-notes .noted{color:#4e7a57}
.unknown-bug{height:125px}
#backWalk{display:block;margin:23px auto 0;min-width:200px}
.safari-settings{margin-top:20px}
.safari-settings p{max-width:760px}
.bug-dialog{max-width:820px;width:calc(100% - 30px);padding:25px;max-height:calc(100dvh - 30px);border-radius:24px;overflow:auto;background:linear-gradient(135deg,#fffcf2,#f6f3e5);text-align:left}
.bug-dialog::backdrop{background:#243c2bae;backdrop-filter:blur(4px)}
.observation-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}
.observation-heading h2{font-size:27px;margin:7px 0 15px}
body[data-game=bugs] .observation-heading .safari-close{position:static;width:46px;height:46px;min-height:46px;border:1px solid #dcd9c8;box-shadow:none;background:#fffdf5;padding:0;font-size:28px;align-self:flex-start}
.observation-desk{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:22px}
.specimen{position:relative;width:100%;height:auto;aspect-ratio:1.125;margin:0;background:radial-gradient(ellipse,#e5ecd3,#fdfbf1 72%);border:1px solid #e5e0cb;border-radius:20px}
.specimen>img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 5px #273c2718)}
.specimen-leaders{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.specimen-leaders path{fill:none;stroke:#52795d;stroke-width:.45;stroke-dasharray:1.2 1.2;opacity:.55}
.specimen-leaders circle{fill:#fff6;stroke:#52795d;stroke-width:.6}
.specimen-leaders .is-focused path{stroke:#ad8537;opacity:.9}
.specimen-leaders .is-focused circle{stroke:#ad8537;fill:#ffe59844}
body[data-game=bugs] .specimen-pin{position:absolute;width:46px;height:46px;min-height:46px;border:2px solid #fffdf0;border-radius:50%;padding:10px;background:#376b58e6;color:white;box-shadow:0 2px 9px #304d2c55;transform:translate(-50%,-50%)}
.specimen-pin svg{width:100%;height:100%}
body[data-game=bugs] .specimen-pin[aria-pressed=true]{background:#b88936}
.observe-intro{font-size:14px!important;line-height:1.7!important;margin:0 0 14px}
.feature-buttons{display:grid;gap:8px}
body[data-game=bugs] .feature-buttons button{display:flex;gap:9px;align-items:center;text-align:left;padding:10px 12px;font-size:13px;min-height:49px;border-radius:13px;background:#fffdf3}
.feature-buttons svg{width:19px;height:19px;flex-shrink:0}
.feature-buttons span{flex:1}
.feature-buttons b{color:#6f9067}
body[data-game=bugs] .feature-buttons button[aria-pressed=true]{background:#e5edd9;color:#2e5843;border-color:#93ac7f}
.feature-detail{display:grid;grid-template-columns:94px minmax(0,1fr);gap:12px;align-items:center;margin-top:16px;padding:11px;background:#f1ebd9;border-radius:14px}
.detail-lens{position:relative;overflow:hidden;width:94px;height:94px;border-radius:50%;background:radial-gradient(ellipse,#fffef5,#e3ead4);border:4px solid #c8ab6a;box-shadow:inset 0 2px 7px #50614120}
.detail-lens img{position:absolute;left:var(--lx);top:var(--ly);width:240%;height:auto;max-width:none;object-fit:contain}
.feature-detail strong{font-size:13px}
.feature-detail p{font-size:12px!important;line-height:1.7!important;margin:7px 0 0}
.observe-hint{font-size:13px!important;line-height:1.7!important;color:#647654;margin:15px 0 0}
#observeSaveNotice{font-size:12px;color:#97662c}
.observation-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid #dfddc7;margin-top:22px;padding-top:16px}
.specimen-count{font-size:12px;color:#78816b;line-height:1.6}
.observation-footer .safari-primary{font-size:14px;padding:12px 18px;min-height:50px}
#netGhost{width:140px;height:155px;transform:translate(-50%,-24%);filter:drop-shadow(0 8px 5px #34442244)}
.release-flight{position:absolute;width:100px;height:100px;pointer-events:none;z-index:5;animation:expedition-release 1s ease-out both;transform:translate(-50%,-50%)}
.release-flight img{width:100%;height:100%;object-fit:contain}
@keyframes expedition-flutter{0%,100%{transform:translate(0,1px) rotate(-4deg) scaleX(.97)}35%{transform:translate(4px,-6px) rotate(3deg) scaleX(.88)}70%{transform:translate(-4px,-2px) rotate(-2deg) scaleX(1)}}
@keyframes expedition-hover{0%,100%{transform:translate(-4px,0) rotate(-2deg)}50%{transform:translate(5px,-5px) rotate(3deg)}}
@keyframes expedition-crawl{0%,100%{transform:translate(-3px,2px) rotate(-2deg)}45%{transform:translate(4px,0) rotate(2deg)}}
@keyframes expedition-scurry{0%,40%,100%{transform:translate(-4px,0) rotate(0)}55%,65%{transform:translate(5px,1px) rotate(3deg)}}
@keyframes expedition-hop{0%,55%,100%{transform:translate(0,0)}65%{transform:translate(3px,-9px) rotate(-3deg)}75%{transform:translate(5px,0)}}
@keyframes expedition-climb{0%,100%{transform:translate(0,3px)}50%{transform:translate(-2px,-4px) rotate(-3deg)}}
@keyframes expedition-glow{0%,100%{filter:drop-shadow(0 3px 2px #35412a40)}50%{filter:drop-shadow(0 0 6px #ffe585) drop-shadow(0 3px 2px #35412a30)}}
@keyframes expedition-release{0%{opacity:.95;transform:translate(-50%,-50%) scale(.95)}65%{opacity:.7}100%{opacity:0;transform:translate(-15%,-100%) scale(.5)}}
@media(max-width:850px){.safari-expedition{grid-template-columns:minmax(0,1fr) 190px;gap:12px;padding:0 12px 13px}.walk-notebook{padding:15px 11px}.walk-friend{grid-template-columns:38px minmax(0,1fr) 16px}.walk-friend img{width:38px;height:36px}.walk-friend>span{font-size:11px}.safari-habitats button{gap:7px}.safari-habitats span{font-size:12px}.safari-habitats img{width:55px;height:62px}.safari-habitats button{grid-template-columns:55px 1fr auto}.safari-habitats small{font-size:11px;padding-right:8px}}
@media(max-width:640px){
 body[data-game=bugs] main{padding:12px;margin:5px auto}
 body[data-game=bugs] h1{font-size:28px}
 body[data-game=bugs] #instruction{font-size:12px;line-height:1.8;max-width:100%}
 body[data-game=bugs] .bar{gap:7px;margin-bottom:13px}
 body[data-game=bugs] .bar button{padding:10px 12px;font-size:12px}
 .safari-habitats{gap:7px}
 .safari-habitats button{display:flex;flex-direction:column;padding-bottom:8px!important;gap:5px}
 .safari-habitats img{width:100%;height:56px}
 .safari-habitats span{font-size:11px;padding:0 4px;line-height:1.45;min-height:32px}
 .safari-habitats small{padding:0;font-size:10px}
 .safari-navigation{gap:9px;margin:13px 0}
 .safari-options,.safari-views{width:100%}
 .safari-options button,.safari-views button{flex:1;font-size:12px!important;padding:10px 7px!important}
 .safari-views{gap:0;background:#e8eddf;border-radius:14px;padding:3px}
 body[data-game=bugs] .safari-views button{box-shadow:none;border:0;min-height:44px!important;background:transparent;border-radius:11px}
 body[data-game=bugs] .safari-views button[aria-pressed=true]{background:#fffef3;color:#345e47;box-shadow:0 1px 3px #3d522122}
 .safari-play{border-radius:21px}
 .walk-heading{padding:16px 14px 14px}
 .walk-heading h2{font-size:19px}
 .walk-counter{font-size:19px;padding:8px 13px}
 .safari-expedition{display:flex;flex-direction:column;padding:0 9px 9px;gap:9px}
 .safari-scene{aspect-ratio:.95;background-size:cover;margin:0;border-radius:16px}
 .safari-place{width:72px;height:72px}
 .net-dock{gap:8px;flex-wrap:nowrap;padding:10px 1px 6px}
 .net-tool{width:60px;height:67px;border-radius:16px!important}
 .net-dock p{font-size:10px;min-width:0}
 .net-dock p strong{font-size:12px}
 body[data-game=bugs] #bugHint{font-size:11px;padding:10px 8px}
 #bugHint svg{width:16px;height:16px}
 .walk-message{font-size:11px;margin:6px 3px;min-height:35px}
 .walk-notebook{padding:14px 12px;border-radius:15px}
 .walk-notebook h3{font-size:15px;margin:7px 0 10px}
 .walk-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 10px}
 .walk-list.bug-targets{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
 .walk-list.bug-targets .walk-friend{display:flex;flex-direction:column;text-align:center}
 .walk-list.bug-targets img{width:46px;height:42px}
 .walk-friend{grid-template-columns:31px minmax(0,1fr) 15px;gap:4px;min-height:39px}
 .walk-friend img{width:31px;height:34px}
 .walk-friend>span{font-size:10px}
 .friend-hidden{height:34px;font-size:24px}
 .notebook-tip{font-size:11px;line-height:1.7;margin:5px 0 10px}
 .walk-dots{padding:12px 0 5px}
 .badge-notice img{width:52px;height:58px}
 .walk-complete{gap:10px;padding:16px}
 .walk-complete>img{width:55px;height:65px}
 .walk-complete h2{font-size:17px}
 .walk-complete p{font-size:12px;line-height:1.6}
 .walk-complete .safari-primary{width:100%;font-size:14px}
 .field-guide{padding:20px 12px;border-radius:20px}
 .guide-heading h2{font-size:23px}
 .guide-heading>strong{font-size:22px}
 .reward-hint{font-size:12px}
 .safari-badges{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 8px;margin:20px 0}
 .safari-badge img{width:93px;height:104px}
 .safari-badge strong{font-size:11px}
 .safari-badge small{font-size:10px}
 .notes-summary{padding:12px 10px;font-size:12px}
 .guide-tip{font-size:11px}
 .bug-book{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
 body[data-game=bugs] .bug-entry{min-height:135px;padding:8px 3px}
 .bug-entry img,.unknown-bug{height:77px}
 .bug-entry strong{font-size:10px}
 .bug-entry small{font-size:9px}
 .entry-notes{margin-top:5px;gap:5px}
 #backWalk{min-width:180px}
 .bug-dialog{padding:18px 15px;width:calc(100% - 22px);max-height:calc(100dvh - 22px)}
 .observation-heading h2{font-size:23px;margin:7px 0 13px}
 .observation-desk{grid-template-columns:minmax(0,1fr);gap:14px}
 .specimen{width:230px;max-width:100%;margin:auto}
 .specimen-pin{width:44px!important;height:44px!important;min-height:44px!important}
 .observe-intro{font-size:12px!important;margin-bottom:10px}
 .feature-buttons{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
 body[data-game=bugs] .feature-buttons button{font-size:11px;padding:9px 7px;gap:5px}
 .feature-buttons svg{width:17px;height:17px}
 .feature-detail{grid-template-columns:82px minmax(0,1fr);gap:10px;margin-top:12px;padding:9px}
 .detail-lens{width:82px;height:82px}
 .feature-detail strong{font-size:12px}
 .feature-detail p{font-size:11px!important}
 .observe-hint{font-size:11px!important;margin-top:11px}
 .observation-footer{gap:10px;margin-top:15px;padding-top:13px}
 .specimen-count{font-size:10px}
 .observation-footer .safari-primary{font-size:12px;padding:10px 12px}
 .release-flight{width:72px;height:72px}
}
@media(max-width:350px){.safari-place{width:65px;height:65px}.walk-friend>span{font-size:9px}.safari-habitats span{font-size:10px}.feature-buttons{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.safari-bug img,.release-flight{animation:none!important}.safari-cover{transition:none!important}body[data-game=bugs] button{transition:none}}
