/* Robert's Zoo UI refresh (3.33): one palette, two bundled rounded fonts, chunky buttons with a "lip", one icon family.
   Loaded last so it restyles without touching layout logic. Tokens: */
@font-face{font-family:'Baloo 2';font-weight:700;font-display:swap;src:url(assets/fonts/baloo-2-700.woff2) format('woff2')}
@font-face{font-family:'Baloo 2';font-weight:800;font-display:swap;src:url(assets/fonts/baloo-2-800.woff2) format('woff2')}
@font-face{font-family:'Nunito';font-weight:700;font-display:swap;src:url(assets/fonts/nunito-700.woff2) format('woff2')}
@font-face{font-family:'Nunito';font-weight:800;font-display:swap;src:url(assets/fonts/nunito-800.woff2) format('woff2')}
:root{--z-forest:#1E5A45;--z-forest-lip:#0F3A2C;--z-deep:#123A2D;--z-soft:#3E6656;--z-cream:#FFF9EC;--z-cream-lip:#E3D5B0;--z-sand:#F3E7C9;--z-line:#EFE4C8;--z-sun:#FFC53D;--z-sun-lip:#D99A12;--z-coral:#E8573F;--z-coral-lip:#A93522;--z-coral-soft:#FFE6DF;--z-coral-soft-lip:#F2BFB2;--z-sky:#3FA7D6;--z-sky-lip:#2A7EA6;--z-leaf:#6DBE57;--z-leaf-lip:#4A8F37;--z-r1:12px;--z-r2:20px;--z-pill:999px;--z-shadow:0 10px 22px rgba(18,58,45,.24);--z-head:'Baloo 2',Nunito,system-ui,sans-serif;--z-body:Nunito,system-ui,-apple-system,'Segoe UI',sans-serif;--ink:#123A2D;--green:#1E5A45}
html body{font-family:var(--z-body);color:var(--z-deep)}
html body button,html body select{font-family:var(--z-head)!important;font-weight:800}
html body h1,html body h2,html body h3{font-family:var(--z-head);font-weight:800;letter-spacing:0}
.zi .d{fill:currentColor;fill-opacity:.22;stroke:none}
/* Coins */
html body .zoo-wallet{gap:10px;min-height:60px;padding:0 20px 0 9px!important;border:0;border-radius:var(--z-pill)!important;background:var(--z-cream);box-shadow:0 4px 0 var(--z-cream-lip),var(--z-shadow)}
html body .zoo-wallet>svg{width:42px!important;height:42px!important}
html body .zoo-wallet strong{font-family:var(--z-head);font-weight:800;font-size:28px!important;line-height:1;color:var(--z-deep);letter-spacing:0}
html body .zoo-wallet small{display:none}
/* Bottom dock */
html body .zoo-dock{gap:8px!important;padding:8px!important;border:0;border-radius:28px!important;background:var(--z-cream);box-shadow:0 4px 0 var(--z-cream-lip),0 14px 30px rgba(18,58,45,.3)}
html body .zoo-dock button{flex-direction:column;gap:2px!important;min-width:84px;min-height:72px!important;padding:6px 10px!important;border-radius:var(--z-r2)!important;background:transparent;color:var(--z-forest);font-family:var(--z-head);font-weight:800;font-size:15px!important}
html body .zoo-dock svg{width:30px!important;height:30px!important}
html body .zoo-dock button[aria-pressed=true],html body #zoo-open[aria-pressed=true]{background:var(--z-forest);color:#fff;box-shadow:0 4px 0 var(--z-forest-lip)}
html body #zoo-open:not([aria-pressed=true]){background:transparent;color:var(--z-forest)}
html body .zoo-dock .pr-nav-word{font-size:inherit}
/* Habitat signs on the map */
html body .habitat-label{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 15px 0 7px!important;border:0!important;border-radius:var(--z-pill)!important;background:var(--z-cream)!important;color:var(--z-forest)!important;font-family:var(--z-head);font-weight:800;font-size:16px!important;box-shadow:0 3px 0 var(--z-cream-lip),0 8px 18px rgba(18,58,45,.25)}
html body .habitat-label{font-family:var(--z-head)!important}
html body .habitat-label>span:not(.pr-map-art){font:inherit!important;letter-spacing:0}
html body .habitat-label:hover{background:#fff!important}
html body .habitat-label .pr-map-art{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--z-forest);color:var(--z-cream);overflow:hidden}
html body .habitat-label .pr-map-art svg,html body .habitat-label .pr-map-art img{width:20px;height:20px}
html body .habitat-label.petting-label{background:var(--z-coral-soft)!important;color:#A3301F!important;border:0!important;box-shadow:0 3px 0 var(--z-coral-soft-lip),0 8px 18px rgba(18,58,45,.25)}
html body .habitat-label.petting-label>svg{box-sizing:border-box;width:32px;height:32px;padding:6px;border-radius:50%;background:var(--z-coral);color:#fff}
/* Uh-oh and Our family */
html body .family-shortcut{gap:10px;min-height:60px;padding:0 22px 0 12px;border:0;border-radius:var(--z-pill);background:var(--z-cream);color:var(--z-forest);font-family:var(--z-head);font-weight:800;font-size:20px;box-shadow:0 5px 0 var(--z-cream-lip),var(--z-shadow)}
html body .family-shortcut svg{width:30px;height:30px}
html body .family-shortcut[aria-pressed=true]{background:var(--z-forest);color:#fff;box-shadow:0 5px 0 var(--z-forest-lip),var(--z-shadow)}
html body .uhoh-shortcut{background:var(--z-coral)!important;color:#fff!important;box-shadow:0 5px 0 var(--z-coral-lip),var(--z-shadow)!important}
html body .uhoh-shortcut .uhoh-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#fff;color:#C7402F;font-size:26px;line-height:1;font-family:var(--z-head);font-weight:800}
html body .uhoh-shortcut:disabled,html body .uhoh-shortcut[aria-disabled=true]{background:#F0B2A6!important;box-shadow:0 5px 0 #D98C7E,var(--z-shadow)!important}
/* Zoom + minimap */
html body .zoom-group{overflow:hidden;border:0;border-radius:var(--z-r2)!important;background:var(--z-cream);box-shadow:0 4px 0 var(--z-cream-lip),var(--z-shadow)}
html body .zoom-group button{width:56px!important;height:56px!important;color:var(--z-forest)!important;background:transparent!important}
html body .zoom-group button+button{border-top:2px solid var(--z-line)!important}
html body .zoom-group button svg{width:28px;height:28px}
html body .zoom-stack>#hd-fullscreen{border:0;background:var(--z-cream);color:var(--z-forest);border-radius:var(--z-r2);box-shadow:0 4px 0 var(--z-cream-lip),var(--z-shadow)}
html body .minimap{border:4px solid var(--z-cream)!important;border-radius:var(--z-r2)!important;box-shadow:0 4px 0 var(--z-cream-lip),var(--z-shadow)}
html body .minimap-caption{font-family:var(--z-head);font-weight:800;color:var(--z-cream);letter-spacing:1px}
/* Food / coin bubbles over animals */
html body .animal-care:not([data-mode=eating]),html body .exhibit-care{border:0!important;background:var(--z-cream);color:var(--z-forest);box-shadow:0 3px 0 var(--z-cream-lip),0 6px 14px rgba(18,58,45,.25);border-radius:16px}
html body .animal-care:not([data-mode=eating]):after{background:var(--z-cream);border-color:var(--z-cream)}
/* Tapped-animal card */
html body #animal-card{width:min(420px,calc(100% - 28px));box-sizing:border-box;padding:14px!important;border:0!important;border-radius:28px!important;background:var(--z-cream)!important;box-shadow:0 4px 0 var(--z-cream-lip),0 16px 36px rgba(18,58,45,.3)!important}
#animal-card .friend-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
#animal-card .friend-head img{width:64px;height:64px;border-radius:var(--z-r2);background:var(--z-sand);object-fit:contain;flex-shrink:0}
#animal-card .friend-head div{display:flex;flex-direction:column;gap:2px;min-width:0}
#animal-card .friend-head strong{font-family:var(--z-head);font-weight:800;font-size:24px;line-height:1.1;color:var(--z-deep)}
#animal-card .friend-head small{font-size:14px;font-weight:800;color:var(--z-soft)}
html body .friend-actions{gap:10px!important}
html body .friend-actions button{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:84px!important;padding:8px!important;border:0!important;border-radius:var(--z-r2)!important;font-family:var(--z-head);font-weight:800;font-size:16px;color:#fff!important}
html body .friend-actions svg{width:34px!important;height:34px!important}
html body .friend-actions [data-card=snack]{background:var(--z-leaf)!important;box-shadow:0 5px 0 var(--z-leaf-lip)}
html body .friend-actions [data-card=snack]:disabled{background:var(--z-sand)!important;color:var(--z-soft)!important;box-shadow:0 5px 0 var(--z-cream-lip)}
html body .friend-actions [data-card=hear]{background:var(--z-sky)!important;box-shadow:0 5px 0 var(--z-sky-lip)}
html body .friend-actions [data-card=hear][aria-pressed=true]{background:var(--z-forest)!important;box-shadow:0 5px 0 var(--z-forest-lip)}
html body .friend-actions [data-card=learn]{background:var(--z-sun)!important;color:#5A3E00!important;box-shadow:0 5px 0 var(--z-sun-lip)}
html body .friend-actions button:active{transform:translateY(4px)!important;box-shadow:none}
/* Animals / Stickers / Keeper pages */
html body #zoo-panel{border:0;border-radius:32px;background:var(--z-cream);color:var(--z-deep);box-shadow:0 5px 0 var(--z-cream-lip),0 20px 50px rgba(18,58,45,.35)}
html body #zoo-panel:before{background:var(--z-cream-lip)}
html body #zoo-title{font-family:var(--z-head);font-weight:800;font-size:30px;line-height:1.05;color:var(--z-deep)}
html body .panel-eyebrow{font-family:var(--z-body);font-weight:800;color:var(--z-soft);letter-spacing:.5px}
html body #zoo-close{display:grid;place-items:center;width:56px;height:56px;border:0;border-radius:50%;background:var(--z-sand);color:var(--z-forest);font-size:30px;box-shadow:0 4px 0 var(--z-cream-lip)}
html body .habitat-grid button,html body .animal-grid button{gap:8px;padding:12px 12px 14px!important;border:0!important;border-radius:24px!important;background:#fff!important;color:var(--z-deep)!important;box-shadow:0 4px 0 #E8DCBC,0 8px 18px rgba(18,58,45,.08)}
html body .habitat-grid img,html body .animal-grid img,html body .pr-mode .pr-portrait{background:var(--z-sand)!important;border-radius:18px!important}
html body .pr-mode .pr-portrait img{background:none!important}
html body .habitat-grid strong,html body .animal-grid strong{font-family:var(--z-head);font-weight:800;font-size:19px!important;line-height:1.15}
html body .habitat-grid small,html body .animal-grid small{font-weight:800;color:var(--z-soft)}
html body .pr-mode .pr-voice,html body .pr-mode .pr-corner{width:30px!important;height:30px!important;border:0!important;background:var(--z-cream)!important;color:var(--z-sky)!important;box-shadow:0 2px 0 var(--z-cream-lip)!important}
html body .pr-mode .pr-voice svg{width:20px!important;height:20px!important}
html body .pr-intro h3{font-family:var(--z-head);font-size:22px}
html body #zoo-panel button:not(#zoo-close):not(.habitat-grid button):not(.animal-grid button):not([class*=pr-]):not(.sticker-grid button){border-radius:var(--z-r2)}
html body #zoo-save-status{font-family:var(--z-body);font-weight:800;color:var(--z-soft);background:transparent}
/* Welcome card */
html body #zoo-welcome{border:0;border-radius:28px;background:var(--z-cream);box-shadow:0 5px 0 var(--z-cream-lip),0 16px 40px rgba(18,58,45,.3)}
html body #zoo-welcome h2{font-size:30px;font-weight:800;color:var(--z-deep)}
html body #zoo-welcome p{font-family:var(--z-body);font-weight:700;font-size:15px;color:var(--z-soft)}
html body #zoo-welcome #zoo-first{min-height:60px;border-radius:var(--z-r2);background:var(--z-forest);color:#fff;font-size:20px;box-shadow:0 5px 0 var(--z-forest-lip)}
/* Petting Zoo screen */
html body #petting-zoo .pz-back{display:grid;place-items:center;border:0;background:var(--z-cream);color:var(--z-forest);box-shadow:0 5px 0 var(--z-cream-lip),0 10px 22px rgba(18,58,45,.25)}
html body #petting-zoo .pz-title{display:flex;align-items:center;gap:10px;padding:8px 24px 8px 10px;border:0;border-radius:var(--z-pill);background:var(--z-coral-soft);color:#A3301F;font-family:var(--z-head);font-weight:800;font-size:26px;box-shadow:0 4px 0 var(--z-coral-soft-lip),0 10px 22px rgba(18,58,45,.2)}
html body #petting-zoo .pz-title:before{content:'';width:40px;height:40px;border-radius:50%;background:var(--z-coral) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 20s-7.5-4.6-7.5-10.2A4.3 4.3 0 0 1 12 7a4.3 4.3 0 0 1 7.5 2.8C19.5 15.4 12 20 12 20z'/%3E%3C/svg%3E") center/24px no-repeat;flex-shrink:0}
html body #petting-zoo .pz-hint{padding:12px 24px;background:var(--z-cream);color:var(--z-deep);font-family:var(--z-head);font-weight:800;font-size:22px;box-shadow:0 4px 0 var(--z-cream-lip),0 10px 22px rgba(18,58,45,.25)}
html body #petting-zoo .pz-empty{background:var(--z-cream);color:var(--z-deep);box-shadow:0 5px 0 var(--z-cream-lip),0 16px 40px rgba(18,58,45,.3)}
html body #petting-zoo .pz-empty button{background:var(--z-forest);box-shadow:0 5px 0 var(--z-forest-lip);font-family:var(--z-head)}
/* Status note */
html body #hd-care-note{border:0;background:var(--z-cream);color:var(--z-deep);font-family:var(--z-head);font-weight:800;font-size:16px;box-shadow:0 4px 0 var(--z-cream-lip),var(--z-shadow)}
/* Phones */
@media (max-width:650px){
 html body .zoo-dock button{min-width:0;min-height:62px!important;font-size:13px!important}
 html body .zoo-dock svg{width:26px!important;height:26px!important}
 html body .zoo-wallet{min-height:48px;padding:0 14px 0 6px!important}
 html body .zoo-wallet>svg{width:34px!important;height:34px!important}
 html body .zoo-wallet strong{font-size:22px!important}
 html body .habitat-label{font-size:14px!important;min-height:40px}
 html body .family-shortcut{min-height:52px;font-size:16px;padding:0 16px 0 10px}
 html body #animal-card{bottom:calc(100px + env(safe-area-inset-bottom))}
 html body #zoo-title{font-size:24px}
 html body .habitat-grid strong,html body .animal-grid strong{font-size:16px!important}
 html body #petting-zoo .pz-title{font-size:20px}
 html body #petting-zoo .pz-hint{font-size:17px}
}
/* Page buttons and cards inside the panel */
html body #zoo-title{font-size:30px!important}
html body .pr-heading h3,html body .pr-heading strong{font-family:var(--z-head);font-weight:800;font-size:24px}
html body #zoo-panel .pr-action{border:0!important;border-radius:var(--z-r2)!important;background:var(--z-sand)!important;color:var(--z-forest)!important;box-shadow:0 4px 0 var(--z-cream-lip)!important;min-width:56px;min-height:56px}
html body #zoo-panel .pr-action[data-do=habitats]{border-radius:50%!important;width:56px;height:56px;padding:0}
html body #zoo-panel .pr-action:disabled{opacity:.5}
html body #zoo-panel .pr-action:active{transform:translateY(3px)!important;box-shadow:0 1px 0 var(--z-cream-lip)!important}
html body #zoo-panel .garden-card,html body #zoo-panel .keeper-task,html body #zoo-panel .zoo-guide{border:0!important;border-radius:24px!important;background:#fff!important;box-shadow:0 4px 0 #E8DCBC,0 8px 18px rgba(18,58,45,.08)}
html body #zoo-panel .garden-card strong,html body #zoo-panel .garden-card h3{font-family:var(--z-head);font-weight:800;font-size:19px}
html body #zoo-panel .garden-card .pr-action{background:var(--z-sun)!important;color:#5A3E00!important;box-shadow:0 4px 0 var(--z-sun-lip)!important}
html body #petting-zoo .pz-back svg{width:32px;height:32px}
html body .family-shortcut .button-label{font:inherit!important;letter-spacing:0}