@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600&family=Nunito:wght@400;600;700;800;900&display=swap');
:root{color-scheme:light dark;font:16px/1.5 Nunito,system-ui,sans-serif;color:var(--ink);background:var(--paper);--paper:light-dark(#fff8e8,#232c40);--surface:light-dark(#ffffff,#313e56);--soft:light-dark(#e8edff,#34476b);--ink:light-dark(#253658,#fff0d1);--muted:light-dark(#536080,#b9c7df);--blue:light-dark(#3152d1,#adc4ff);--on-blue:light-dark(#ffffff,#18305b);--camera:light-dark(#dcecff,#304664);--outline:light-dark(#7697d6,#8eaada);--shadow:light-dark(#203780,#758bc3);--line:light-dark(#eee8d5,#3f4e6c);--decor:light-dark(#88cbb2,#598479);--yellow:#ffd759;--game:light-dark(#fff0be,#3e4149)}:root[data-appearance="light"]{color-scheme:light}:root[data-appearance="dark"]{color-scheme:dark}*{box-sizing:border-box}body{margin:0;padding-bottom:calc(100px + env(safe-area-inset-bottom))}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:disabled{cursor:default}a{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #bd5600;outline-offset:5px}[hidden]{display:none!important}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}h1,h2,h3,.brand{font-family:Fredoka,Nunito,sans-serif;font-weight:500;line-height:1.12;margin:0}h1{font-size:clamp(1.9rem,4vw,2.75rem)}h2{font-size:2rem}h3{font-size:1.4rem}.topbar{max-width:1120px;margin:auto;padding:20px 32px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{font-size:1.8rem;display:flex;align-items:center;gap:8px;text-decoration:none;letter-spacing:-.5px}.brand-mark{display:grid;place-items:center;background:var(--yellow);color:var(--ink);width:36px;height:40px;border-radius:14px 14px 11px 11px;font-size:1.8rem;box-shadow:0 3px 0 #e1ae32}.grownups-button{display:flex;gap:7px;align-items:center;border:1.5px solid var(--line);background:var(--soft);border-radius:18px;padding:10px 14px;min-height:44px;font-size:.875rem;font-weight:800}.grownups-button svg{width:18px;height:18px}main{max-width:1056px;padding:0 24px;margin:auto}.eyebrow{display:block;color:var(--blue);font-weight:900;font-size:.75rem;letter-spacing:1.1px;line-height:1.4}.tabs{position:fixed;z-index:10;bottom:16px;left:50%;transform:translateX(-50%);width:380px;max-width:calc(100% - 32px);display:flex;gap:8px;background:var(--surface);border:1px solid var(--line);padding:7px;border-radius:26px;box-shadow:0 6px 30px #25365817;padding-bottom:calc(7px + env(safe-area-inset-bottom))}.tab{flex:1;display:flex;align-items:center;justify-content:center;gap:9px;min-height:54px;border:none;border-radius:19px;background:transparent;color:var(--muted);font-size:1rem;font-weight:900}.tab.active{background:var(--soft);color:var(--blue)}.view{scroll-margin-top:18px}.scan-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:680px;margin:18px auto 22px}.scan-heading h1{margin:6px 0 8px}.scan-heading p{margin:0;color:var(--muted);font-size:1.1rem;font-weight:700}.mascot{width:112px;height:112px;object-fit:contain;flex-shrink:0}.scanner-layout{max-width:680px;margin:auto}.camera-frame{height:clamp(260px,40dvh,380px);position:relative;background:var(--camera);border:4px solid var(--surface);outline:0;box-shadow:0 5px 0 var(--line);border-radius:34px;overflow:hidden}.camera-frame video{width:100%;height:100%;object-fit:contain;display:block;background:#172845;opacity:0}.camera-frame.camera-on video{opacity:1}.scan-idle{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:18px}.example-card{width:152px;padding:8px;background:var(--surface);border-radius:15px;box-shadow:5px 7px 0 #9bb7dd80;transform:rotate(-8deg);margin:0 0 20px}.example-card>img{display:block;width:100%;height:86px;border-radius:9px;object-fit:cover}.example-card>div{display:flex;align-items:center;justify-content:space-between;gap:4px;margin-top:7px}.example-card span{font:500 .875rem/1.15 Fredoka,sans-serif;text-align:left}.example-card>div img{width:37px;height:37px}.scan-idle h2{font-size:1.6rem}.scan-idle p{font-size:1rem;line-height:1.4;color:var(--muted);margin:8px 0 0;font-weight:700}.camera-live{position:absolute;top:12px;left:12px;border-radius:12px;background:var(--surface);padding:7px 12px;color:light-dark(#21613f,#bbdfc2);font-size:.875rem;font-weight:900}.scan-detected{position:absolute;bottom:14px;left:14px;right:14px;width:fit-content;max-width:calc(100% - 28px);display:flex;align-items:center;gap:10px;background:var(--yellow);padding:7px 14px 7px 7px;border-radius:15px;font:500 1.2rem/1.2 Fredoka,sans-serif;box-shadow:0 2px 12px #0002}.scan-detected img{object-fit:cover;border-radius:9px;flex-shrink:0}.camera-controls{display:flex;gap:12px;margin-top:22px}.play-button,.next-button,.download-button{display:flex;align-items:center;justify-content:center;gap:14px;border:0;background:var(--blue);color:var(--on-blue);border-radius:22px;min-height:60px;padding:15px 22px;font:500 1.25rem/1.3 Fredoka,sans-serif;box-shadow:0 5px 0 var(--shadow);text-decoration:none;transition:transform .15s,box-shadow .15s}.play-button{width:100%}.play-button:active,.next-button:active,.download-button:active{transform:translateY(3px);box-shadow:0 2px 0 var(--shadow)}.play-button:disabled{opacity:.7}.outline-button,.name-button{display:flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:12px 17px;border:2px solid var(--outline);background:var(--surface);color:var(--ink);border-radius:18px;font-weight:900;line-height:1.3}.camera-controls .outline-button{flex:1}.scan-status{color:var(--muted);font-size:.875rem;font-weight:700;line-height:1.5;text-align:center;margin:18px 10px 0;min-height:21px}.scan-companion{margin-top:20px}.scan-companion:has(#scan-result[hidden]){display:none}#scan-result{display:grid;grid-template-columns:100px 1fr;align-items:center;gap:16px;background:var(--surface);border:2px solid var(--line);border-radius:26px;padding:16px}#scan-bird-image{width:100px;height:100px;object-fit:cover;border-radius:18px}#scan-bird-name{font-size:1.6rem;margin-top:5px}#scan-audio-status{font-size:.875rem;color:var(--muted);line-height:1.4;margin:8px 0 0}.scan-sound-controls{grid-column:1/-1;display:flex;gap:10px}.scan-sound-controls>*{flex:1;min-height:48px;font-size:1rem;padding:12px}.featured{display:grid;grid-template-columns:1fr 1fr;background:var(--surface);border:3px solid var(--surface);border-radius:30px;overflow:hidden;margin-top:26px;box-shadow:0 5px 0 var(--line)}.bird-portrait{position:relative;min-height:390px;background:#dce7f1}.bird-portrait>img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}.photo-label{position:absolute;left:16px;top:16px;padding:7px 12px;border-radius:12px;background:#ffffffec;font-size:.75rem;font-weight:900}.portrait-sticker{position:absolute;bottom:20px;right:18px;width:76px;height:76px;background:var(--yellow);color:var(--ink);border-radius:50%;display:grid;place-content:center;text-align:center;transform:rotate(10deg);font:500 .9rem/1.2 Fredoka,sans-serif}.bird-info{padding:28px;display:flex;flex-direction:column;align-items:flex-start}.bird-info h2{font-size:2.4rem;margin-top:8px}.scientific{font-style:italic;font-size:.875rem;color:var(--muted);margin:7px 0 0}.bird-prompt{font-size:1rem;line-height:1.5;margin:18px 0}.sound-bars{display:flex;gap:3px;align-items:center;height:22px;margin-left:auto}.sound-bars i{display:block;width:3px;height:9px;border-radius:2px;background:var(--on-blue)}.sound-bars i:nth-child(2){height:19px}.sound-bars i:nth-child(3){height:14px}.sound-bars i:nth-child(4){height:22px}.is-playing .sound-bars i{animation:bounce .6s alternate infinite}.is-playing .sound-bars i:nth-child(2n){animation-delay:.3s}@keyframes bounce{to{height:5px}}.secondary-controls{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;margin-top:18px;color:var(--muted);font-size:.75rem}.name-button{background:var(--soft);border:0;font-size:.875rem;padding:10px 13px}.name-button>span{font-family:Fredoka,sans-serif;font-size:1.1rem}.audio-message{font-size:.875rem;min-height:21px;margin:10px 0;color:var(--blue);line-height:1.5}.listen-tip{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);padding-top:12px;margin-top:auto;width:100%}.listen-tip>span{font-size:1.5rem;color:var(--blue)}.listen-tip p{font-size:.875rem;line-height:1.5;margin:0;color:var(--muted)}.section-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:30px 0 16px}.section-title>span{font-size:.875rem;color:var(--muted)}.bird-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.bird-tile{background:var(--surface);border:3px solid var(--surface);box-shadow:0 4px 0 var(--line);padding:6px 6px 12px;border-radius:20px;text-align:left;position:relative;color:var(--ink)}.bird-tile.selected{border-color:var(--blue);box-shadow:0 4px 0 var(--shadow)}.bird-tile img{display:block;width:100%;height:106px;object-fit:cover;border-radius:12px}.tile-name{font-size:.875rem;font-weight:900;line-height:1.3;display:block;margin:10px 3px 0;min-height:37px}.tile-index{position:absolute;right:12px;top:12px;background:var(--surface);border-radius:50%;width:24px;height:24px;display:grid;place-items:center;font-size:.75rem;font-weight:900}.selected .tile-index{background:var(--blue);color:var(--on-blue)}footer{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.875rem;color:var(--muted);margin:34px 0 0;padding:14px 0;border-top:1px solid var(--line)}.text-button{min-height:44px;padding:8px 0;border:0;background:none;color:var(--muted);font:700 .875rem/1.5 Nunito,sans-serif}.game-surface{background:var(--game);border:4px solid var(--surface);border-radius:32px;padding:32px;text-align:center;margin-top:26px;box-shadow:0 5px 0 var(--line)}.game-surface h2{font-size:2.5rem;margin-top:10px}.game-surface>p{color:var(--muted)}.mystery-button{max-width:350px;margin:24px auto 0}.game-feedback{min-height:27px;font-weight:900;color:var(--blue)!important;margin:25px 0 18px}.game-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:auto}.choice{background:var(--surface);border:3px solid var(--surface);border-radius:23px;padding:7px 7px 15px;text-align:center;color:var(--ink);box-shadow:0 4px 0 var(--line)}.choice img{display:block;width:100%;height:170px;object-fit:cover;border-radius:15px}.choice span{display:block;margin:12px 0 0;font-weight:900;line-height:1.3}.choice.correct{border-color:light-dark(#237342,#8ccc9b);background:light-dark(#dcf4dc,#284b36);box-shadow:0 4px 0 light-dark(#237342,#8ccc9b);animation:found .3s ease-out}.choice.wrong{opacity:.65}.next-button{margin:24px auto 0;width:fit-content}.game-note{font-size:.875rem;margin:24px 0 0}@keyframes found{50%{transform:scale(1.025)}}.print-intro{display:flex;justify-content:space-between;gap:30px;align-items:center;margin:28px 0}.print-intro h2{margin:10px 0}.print-intro p{line-height:1.7;color:var(--muted)}.print-actions{display:flex;flex-direction:column;gap:15px;flex-shrink:0;text-align:center}.download-button{font-size:1.1rem}.print-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.print-card{border:1px dashed #a2acba;padding:12px;border-radius:15px;background:var(--surface);break-inside:avoid}.print-card>img{width:100%;height:175px;object-fit:cover;border-radius:8px}.print-card-bottom{display:flex;gap:10px;justify-content:space-between;align-items:center;margin-top:10px}.print-card h3{font-size:1.4rem}.print-card .card-scientific{font-size:.75rem;font-style:italic;color:var(--muted);margin:7px 0}.print-card .qr{width:85px;height:85px;flex-shrink:0;image-rendering:pixelated}.card-instruction{font-size:.75rem;font-weight:800;margin:6px 0 0;color:var(--blue)}.card-credit{font-size:.75rem;line-height:1.4;color:var(--muted);margin:9px 0 0}.print-note{color:var(--muted)}.print-credit-sheet{display:none}dialog{border:3px solid var(--surface);border-radius:28px;padding:26px;max-width:620px;width:calc(100% - 28px);max-height:85dvh;background:var(--paper);color:var(--ink);box-shadow:0 20px 100px #182a4044}dialog::backdrop{background:#182a4066;backdrop-filter:blur(3px)}.dialog-header{display:flex;justify-content:space-between;align-items:center;gap:15px}.close-button{font-size:1.8rem;line-height:1;width:44px;height:44px;border-radius:16px;border:0;background:var(--soft);flex-shrink:0}dialog h2{font-size:1.9rem;margin:18px 0}dialog p,dialog li{font-size:1rem;line-height:1.7}dialog li{padding-left:5px;margin:10px 0}dialog ol{padding-left:22px}.parent-print{width:100%;margin:20px 0 24px}.camera-help{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:4px 0}.camera-help summary{cursor:pointer;padding:12px 0;font-weight:900;min-height:48px}.note-box{background:var(--soft);padding:17px 20px;border-radius:20px}.note-box p{margin:5px 0 0}.small{font-size:.875rem!important;color:var(--muted)}.credit-entry{border-top:1px solid var(--line);padding:18px 0}.credit-entry p{font-size:.875rem;line-height:1.7;margin:9px 0;overflow-wrap:anywhere}.credit-entry a{color:var(--blue)}
@media(hover:hover){.tab:hover{background:var(--soft)}.bird-tile:hover,.choice:not(:disabled):hover{border-color:#8a9ff0}.play-button:hover,.next-button:hover,.download-button:hover{background:var(--blue);filter:brightness(.94)}}
@media(max-width:850px){.bird-grid{grid-template-columns:repeat(3,1fr)}.bird-tile img{height:140px}.print-grid{grid-template-columns:repeat(2,1fr)}.print-intro{display:block}.print-actions{max-width:360px;margin-top:22px}}
@media(max-width:600px){body{padding-bottom:calc(96px + env(safe-area-inset-bottom))}.topbar{padding:15px 20px 10px}.brand{font-size:1.65rem}.brand-mark{width:32px;height:36px;font-size:1.6rem}.grownups-button{padding:9px 11px}main{padding:0 20px}.tabs{max-width:none;width:100%;bottom:0;border-radius:25px 25px 0 0;border-bottom:0;padding:8px 14px calc(8px + env(safe-area-inset-bottom));gap:10px}.tab{flex-direction:column;gap:3px;min-height:60px;border-radius:18px;font-size:.875rem}.tab svg{width:25px;height:25px}.scan-heading{margin:14px 0 18px;gap:0;min-height:98px}.scan-heading .eyebrow{font-size:.75rem;letter-spacing:.6px}.scan-heading h1{font-size:1.95rem;margin:5px 0 7px}.scan-heading p{font-size:1rem}.mascot{width:84px;height:100px;margin-right:-8px}.camera-frame{height:clamp(270px,39dvh,355px);border-radius:30px}.example-card{width:134px;margin-bottom:16px;padding:7px;border-radius:13px}.example-card>img{height:72px}.example-card>div img{width:32px;height:32px}.example-card span{font-size:.8rem}.scan-idle h2{font-size:1.45rem}.scan-idle p{font-size:.875rem;margin-top:7px}.camera-controls{margin-top:20px}.scan-status{margin:17px 0 0}.scan-companion{margin-top:18px}#scan-result{grid-template-columns:80px 1fr;padding:13px;gap:12px}#scan-bird-image{width:80px;height:86px}#scan-bird-name{font-size:1.5rem}.featured{grid-template-columns:1fr;margin-top:18px;border-radius:26px}.bird-portrait{min-height:230px;height:230px}.bird-info{padding:20px}.bird-info h2{font-size:2rem}.bird-prompt{margin:15px 0}.section-title{display:block;margin:28px 0 16px}.section-title h3{margin-bottom:7px}.bird-grid{grid-template-columns:repeat(2,1fr);gap:14px}.bird-tile img{height:112px}.tile-name{min-height:37px}.secondary-controls{gap:8px}.secondary-controls>span{max-width:104px;text-align:right}.game-surface{padding:24px 14px;margin-top:18px;border-radius:27px}.game-surface h2{font-size:2rem}.game-surface>p{margin:14px 0}.mystery-button{margin-top:22px;font-size:1.15rem}.game-feedback{margin:25px 0 18px!important;min-height:24px}.game-choices{grid-template-columns:1fr;gap:12px}.choice{display:flex;align-items:center;text-align:left;padding:6px;gap:14px;border-radius:19px}.choice img{width:95px;height:75px;flex-shrink:0;border-radius:12px}.choice span{font-size:1rem;margin:0}.next-button{font-size:1.15rem}.print-grid{grid-template-columns:1fr}.print-card>img{height:200px}.print-intro h2{font-size:2rem}.print-actions{max-width:none}footer{flex-direction:column;align-items:center;gap:0;text-align:center;margin-top:27px;padding-top:17px}footer>span{display:none}dialog{padding:20px}dialog h2{font-size:1.75rem}}
@media(max-width:359px){main{padding:0 14px}.topbar{padding-left:14px;padding-right:14px}.brand{font-size:1.4rem}.grownups-button{font-size:.8rem}.mascot{width:65px}.scan-heading h1{font-size:1.7rem}.tile-name{font-size:.8rem}.secondary-controls{flex-wrap:wrap}.secondary-controls>span{max-width:none;text-align:left}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.example-card{background:#fff;color:#253658}.brand-mark,.portrait-sticker,.scan-detected{color:#253658}.photo-label{color:#253658}.print-card{color:#253658;background:#fff}.print-card .card-scientific,.print-card .card-credit{color:#536080}.print-card .card-instruction{color:#3152d1}.appearance-control{display:grid;gap:8px;margin:20px 0;font-weight:800}.appearance-control select{font:inherit;color:var(--ink);background:var(--surface);border:2px solid var(--outline);border-radius:15px;min-height:48px;padding:10px 12px}.appearance-control select:focus-visible{outline:3px solid var(--blue);outline-offset:3px}@media print{@page{size:A4;margin:10mm}body{background:white;color:#111;font-family:Arial,sans-serif;padding:0}.topbar,.tabs,footer,.print-intro,.print-note,dialog,#discover,#game,#scan{display:none!important}main{padding:0;max-width:none}#print{display:block!important}.print-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:5mm}.print-card{height:86mm;border:1px dashed #888;padding:3mm;border-radius:0;overflow:hidden}.print-card>img{height:43mm;width:100%;border-radius:0;object-fit:contain}.print-card-bottom{margin-top:2mm}.print-card h3{font-size:14pt}.print-card .card-scientific{font-size:8pt}.print-card .qr{width:24mm;height:24mm}.card-instruction{font-size:8pt}.card-credit{font-size:6pt;margin-top:1mm}.print-credit-sheet{display:block;break-before:page;font-size:10pt;line-height:1.5}.print-credit-sheet h2{font-size:20pt}.print-credit-sheet p{overflow-wrap:anywhere}.print-credit-sheet a{text-decoration:none}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}}
@media(min-width:601px) and (max-height:800px){.scan-heading{margin-top:4px;margin-bottom:12px}.mascot{width:96px;height:96px}}
/* Keep the code black on white in both Toybox palettes. */
.screen-cards{max-width:400px;margin:18px auto 0}.screen-cards-intro h1{font-size:1.9rem;margin:5px 0 8px}.screen-cards-intro p{font-size:.875rem;color:var(--muted);margin:0 0 16px;line-height:1.5}.screen-card{background:#fff;color:#253658;border:1px solid #e1e5ed;border-radius:24px;padding:16px;box-shadow:0 5px 0 var(--line)}.screen-card-heading{display:flex;align-items:center;gap:12px;min-height:56px}.screen-card-heading>img{border-radius:13px;object-fit:cover;flex-shrink:0}.screen-card-heading h2{font-size:1.3rem;margin-top:3px;overflow-wrap:anywhere}.screen-card-number{font-size:.7rem;letter-spacing:1px;font-weight:900;color:#536080}.screen-code{display:grid;place-items:center;aspect-ratio:1;max-width:320px;margin:10px auto 0;background:#fff}.screen-code>img{display:block;width:100%;height:auto;image-rendering:pixelated}.screen-code>p{color:#536080;font-size:.95rem;text-align:center;line-height:1.7;margin:0}.screen-card-controls{display:flex;gap:12px;margin-top:18px}.screen-card-controls>*{flex:1}.screen-card-tools{display:flex;align-items:end;gap:12px;margin-top:14px}.screen-card-tools label{display:grid;gap:5px;min-width:0;flex:1;color:var(--muted);font-size:.8rem;font-weight:800}.screen-card-tools select{width:100%;min-width:0;min-height:44px;font:700 .875rem Nunito,system-ui,sans-serif;background:var(--surface);color:var(--ink);border:1px solid var(--outline);border-radius:13px;padding:8px}.screen-card-tools select:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.screen-card-tools button{flex-shrink:0;font-size:.8rem}.screen-card-help{font-size:.8rem;line-height:1.5;color:var(--muted);margin:16px 0}.parent-screen-cards{display:block;text-align:center;margin-top:14px}.parent-screen-cards+.parent-print{margin-top:8px}@media(max-width:359px){.screen-card{padding:12px}.screen-card-heading h2{font-size:1.15rem}.screen-card-heading>img{width:44px;height:44px}.screen-card-tools{align-items:stretch;flex-direction:column;gap:0}.screen-card-tools button{align-self:center}}@media print{#cards{display:none!important}}
@media(max-width:600px) and (max-height:749px){.screen-cards{margin-top:10px}.screen-cards-intro p{margin-bottom:10px}.screen-code{max-width:clamp(220px,calc(100dvh - 440px),320px)}.screen-card-controls{margin-top:14px}}
.screen-card-download{margin-top:24px;text-align:center}.screen-card-download .download-button{font-size:1rem}.screen-card-download p{font-size:.8rem;color:var(--muted);margin:14px 0 0}footer{flex-wrap:wrap}