@font-face{font-family:"Newsreader";src:url(/fonts/newsreader-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url(/fonts/newsreader-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Newsreader";src:url(/fonts/newsreader-latin-600-normal.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Bricolage";src:url(/fonts/bricolage-grotesque-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Bricolage";src:url(/fonts/bricolage-grotesque-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Kalam";src:url(/fonts/kalam-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
:root{--paper:#faf3de;--paper2:#f1e4bf;--card:#fffaee;--ink:#1f1a12;--ink2:#5b4f3b;--heath:#4a3f9e;--heath-d:#362c80;--heath2:#e7e3f7;--rust:#9b4a12;--rust2:#f8dcc4;--honey:#f2b632;--honey2:#fbe8b0;--hive:#221c12;--hive2:#33291a;--leaf:#3d6a3a;
--beec:#f2b632;--bees:#1f1a12;--wing:#ffffffd9;--r:14px;--sans:"Bricolage",system-ui,sans-serif;--serif:"Newsreader",Georgia,serif;--hand:"Kalam","Comic Sans MS",cursive;--mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;--shadow:0 1px 0 rgba(31,26,18,.08),0 6px 18px -10px rgba(31,26,18,.4)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.125rem/1.62 var(--serif);
background-image:radial-gradient(rgba(90,70,40,.06) 1px,transparent 1.4px),radial-gradient(rgba(90,70,40,.04) 1px,transparent 1.2px);background-size:23px 23px,37px 37px;background-position:0 0,11px 17px}
img{max-width:100%;height:auto;display:block}
a{color:var(--heath-d);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--rust)}
:focus-visible{outline:3px solid var(--rust);outline-offset:2px;border-radius:4px}
h1,h2,h3{font-family:var(--sans);font-weight:800;line-height:1.12;letter-spacing:-.01em;color:var(--ink)}
h1{font-size:clamp(2.1rem,5vw,3.5rem);margin:.2em 0 .3em}
h2{font-size:clamp(1.4rem,2.6vw,1.9rem);margin:1.8em 0 .5em}
h3{font-size:1.2rem;margin:1.2em 0 .4em}
p,li{max-width:70ch}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.5rem 1rem;z-index:99}
.skip:focus{left:.5rem;top:.5rem}
.wrap{max-width:1180px;margin:0 auto;padding:0 1.25rem}
.narrow{max-width:780px}
.narrowish{max-width:780px}
.small{font-size:.9rem;color:var(--ink2)}
.kicker{font-family:var(--sans);font-weight:600;font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;color:var(--rust)}
.lede{font-size:1.28rem;color:var(--ink2);max-width:60ch}
.hand{font-family:var(--hand)}
/* header */
.top{background:var(--heath);color:#f6f0dc;position:sticky;top:0;z-index:20}
.topin{display:flex;align-items:center;gap:1rem;min-height:64px}
.brand{display:flex;align-items:center;gap:.55rem;color:#f6f0dc;text-decoration:none}
.brand:hover{color:#fff}
.brandbee{width:52px;height:38px;--beec:#8a6a44;--bees:#1d140e;--wing:#f1dfbd;transform:rotate(-4deg)}
.bw{display:flex;flex-direction:column;line-height:1}
.b1{font-family:var(--sans);font-weight:800;font-size:1.45rem;letter-spacing:-.02em}
.b2{font-family:var(--hand);font-size:.95rem;opacity:.85;margin-top:.1rem}
.nav{margin-left:auto}
.nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:.15rem;margin:0;padding:0}
.nav a{display:block;color:#f6f0dc;text-decoration:none;font-family:var(--sans);font-weight:600;font-size:.95rem;padding:.4rem .6rem;border-radius:999px}
.nav a:hover,.nav a[aria-current=page]{background:rgba(246,240,220,.16);color:#fff}
.nav a[aria-current=page]{box-shadow:inset 0 -2px 0 var(--honey)}
.navbtn{display:none;margin-left:auto;background:transparent;color:#f6f0dc;border:2px solid rgba(246,240,220,.6);border-radius:999px;padding:.35rem .9rem;font:600 .95rem var(--sans);cursor:pointer}
.bars{display:inline-block;width:14px;height:2px;background:currentColor;box-shadow:0 -5px 0 currentColor,0 5px 0 currentColor;margin-right:.5rem;vertical-align:middle}
.hedge{display:block;width:100%;height:14px;fill:var(--heath);position:absolute;left:0;bottom:-13px}
@media (max-width:980px){.navbtn{display:inline-block}.nav{display:none;position:absolute;left:0;right:0;top:64px;background:var(--heath-d);padding:.8rem 1.25rem 1.2rem}.nav.open{display:block}.nav ul{flex-direction:column}.nav a{padding:.6rem .4rem;border-radius:6px}}
main{display:block;padding-bottom:3rem}
/* hero */
.hero{padding:3.2rem 0 1.5rem}
.heroin{display:grid;grid-template-columns:1.1fr .9fr;gap:2.5rem;align-items:center}
.hero h1{font-size:clamp(2.6rem,6.5vw,4.6rem);margin:.15em 0 .25em}
.hero h1 em{font-family:var(--hand);font-style:normal;font-weight:400;color:var(--rust);font-size:1.05em}
.heroimg .ph{transform:rotate(1.4deg);margin:0}
.heroimg .ph img{border-radius:6px}
@media (max-width:820px){.heroin{grid-template-columns:1fr}.hero{padding-top:2.2rem}}
.btns{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.2rem 0}
.btn{display:inline-block;background:var(--rust);color:#fff;font:700 1rem var(--sans);padding:.7rem 1.15rem;border-radius:999px;text-decoration:none;border:2px solid var(--rust);box-shadow:0 3px 0 #6e2a17}
.btn:hover{background:#8d3820;color:#fff}
.btn:active{transform:translateY(2px);box-shadow:0 1px 0 #6e2a17}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink);box-shadow:0 3px 0 var(--ink)}
.btn.ghost:hover{background:var(--card);color:var(--ink)}
/* photos */
.ph{margin:1.6rem 0;background:var(--card);padding:.6rem .6rem .5rem;border-radius:8px;box-shadow:var(--shadow);border:1px solid rgba(31,26,18,.08)}
.ph img{border-radius:4px;width:100%}
.ph figcaption{display:flex;flex-direction:column;gap:.15rem;padding:.45rem .2rem 0}
.capt{font-family:var(--hand);font-size:1.05rem;line-height:1.35;color:var(--ink)}
.cred{font-size:.75rem;color:var(--ink2);font-family:var(--sans);font-weight:600}
.cred a{color:var(--ink2)}
.twophoto{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.twophoto .ph{margin:1rem 0}
@media (max-width:600px){.twophoto{grid-template-columns:1fr}}
/* citations */
.cite{font-family:var(--sans);font-weight:600;font-size:.7rem;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;color:var(--heath);background:var(--heath2);padding:.08rem .42rem;border-radius:999px;white-space:nowrap;vertical-align:.12em}
.cite:hover{background:var(--heath);color:#fff}
/* home blocks */
.urgent{background:var(--rust2);border-left:6px solid var(--rust);padding:.85rem 1.1rem;border-radius:0 10px 10px 0;margin:1rem 0 0}
.urgent p{margin:0}
.twocol{display:grid;grid-template-columns:1.2fr .8fr;gap:2.5rem;align-items:start}
@media (max-width:820px){.twocol{grid-template-columns:1fr;gap:1rem}}
.facts-strip{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-top:2.4rem}
.stat{background:var(--card);border-radius:var(--r);padding:1rem;box-shadow:var(--shadow);border-top:5px solid var(--honey)}
.stat:nth-child(2){border-color:var(--heath)}.stat:nth-child(3){border-color:var(--rust)}.stat:nth-child(4){border-color:var(--ink2)}
.stat .n{display:block;font:800 1.7rem/1.1 var(--sans)}
.stat .l{font-size:.95rem;color:var(--ink2)}
.sec{margin-top:2.2rem}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
@media (max-width:820px){.tiles{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.tiles{grid-template-columns:1fr}}
.tile{display:flex;flex-direction:column;background:var(--card);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:transform .15s}
.tile:hover{transform:translateY(-3px) rotate(-.4deg);color:var(--ink)}
.tile img{aspect-ratio:4/3;object-fit:cover;width:100%}
.tt{font:800 1.2rem var(--sans);padding:.8rem 1rem 0}
.td{padding:.2rem 1rem 1rem;color:var(--ink2);font-size:1rem}
.night{background:var(--hive);color:#efe8d3;border-radius:22px;margin:2.5rem 0;padding:2rem;position:relative;overflow:hidden;
background-image:radial-gradient(circle at 12% 20%,rgba(255,255,230,.7) 1px,transparent 2px),radial-gradient(circle at 68% 12%,rgba(255,255,230,.6) 1px,transparent 2px),radial-gradient(circle at 85% 55%,rgba(255,255,230,.5) 1px,transparent 2px),radial-gradient(circle at 40% 70%,rgba(255,255,230,.4) 1px,transparent 2px),radial-gradient(circle at 92% 18%,#f3e7b5 0 18px,transparent 19px)}
.night h2{color:#fff;margin-top:.3rem}.night .kicker{color:var(--honey)}
.night a{color:#f6e8bd}
.nightin{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
@media (max-width:820px){.nightin{grid-template-columns:1fr}.night{padding:1.4rem}}
.games{list-style:none;padding:0;margin:0;display:grid;gap:.6rem}
.games a{display:block;background:var(--hive2);border-radius:12px;padding:.75rem 1rem;text-decoration:none;color:#efe8d3;border:1px solid rgba(255,255,255,.08)}
.games a:hover{background:#344a4a}
.games strong{display:block;font-family:var(--sans);font-size:1.1rem;color:#fff}
.games span{font-size:.95rem;opacity:.85}
.night .useless{background:#f6f0dc;color:var(--ink)}
/* useless */
.useless{display:grid;grid-template-columns:110px 1fr;gap:1rem;align-items:center;background:var(--card);border:2px dashed rgba(31,26,18,.25);border-radius:18px;padding:1rem 1.1rem;margin:2.2rem 0}
.useless .who{background:none;border:0;padding:0;cursor:pointer;transition:transform .2s}
.useless .who:hover{transform:rotate(-6deg) scale(1.05)}
.useless .note{font-family:var(--hand);font-size:1.18rem;line-height:1.45;margin:.3rem 0}
.useless .sig{font-family:var(--hand);color:var(--ink2)}
.tap{font-family:var(--sans);font-size:.75rem}
@media (max-width:520px){.useless{grid-template-columns:72px 1fr}}
/* support */
.support{background:var(--honey2);border-radius:22px;padding:1.6rem 1.8rem;margin:2.5rem 0;border:2px solid var(--honey);display:grid;gap:1.5rem;grid-template-columns:1fr}
.support:has(.poster-slot:not([hidden])){grid-template-columns:300px 1fr}
.support h2{margin:.3rem 0 .4rem}
@media (max-width:700px){.support:has(.poster-slot:not([hidden])){grid-template-columns:1fr}}
/* pages */
.phead{padding:2.4rem 0 .4rem}
.phead h1{margin-bottom:.2em}
.crumbs{margin:1.4rem 0 -1.4rem;font-family:var(--sans);font-size:.9rem}
.callout{border-radius:12px;padding:.9rem 1.15rem;margin:1.6rem 0;border:1px solid rgba(31,26,18,.1)}
.callout p{margin:.25rem 0 0}
.callout.tip{background:var(--heath2)}.callout.tip .kicker{color:var(--heath-d)}
.callout.warn{background:var(--rust2)}
.callout.note{background:var(--honey2)}.callout.note .kicker{color:#7a5a12}
.dodont{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}
.dodont>div{background:var(--card);border-radius:14px;padding:.4rem 1.2rem .8rem;box-shadow:var(--shadow)}
.dodont .do{border-top:6px solid var(--heath)}.dodont .dont{border-top:6px solid var(--rust)}
.dodont h3{margin-top:.8rem}
.dodont li{margin:.5rem 0}
@media (max-width:700px){.dodont{grid-template-columns:1fr}}
.steps{padding-left:0;list-style:none;counter-reset:s}
.steps>li{counter-increment:s;position:relative;padding-left:3.2rem;margin:1.4rem 0}
.steps>li::before{content:counter(s);position:absolute;left:0;top:.1rem;width:2.3rem;height:2.3rem;border-radius:50%;background:var(--heath);color:#fff;font:800 1.1rem/2.3rem var(--sans);text-align:center}
.steps>li h2{margin:.1rem 0 .4rem;font-size:1.45rem}
.small-steps>li{padding-left:2.6rem;margin:.7rem 0}
.small-steps>li::before{width:1.8rem;height:1.8rem;line-height:1.8rem;font-size:.95rem}
.bigphone{background:var(--ink);color:#f6f0dc;border-radius:18px;padding:1.1rem 1.4rem;display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.2rem;margin:1rem 0}
.bigphone a{color:#fff;font:800 clamp(1.7rem,5vw,2.4rem) var(--sans);text-decoration:none}
.bigphone .kicker{color:var(--honey)}.bigphone .small{color:#d6ccb5}
.next{border-top:2px dotted rgba(31,26,18,.3);margin-top:2rem;padding-top:1rem}
.next ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;margin:.4rem 0}
.next a{font-family:var(--sans);font-weight:600}
.tablewrap{overflow-x:auto;margin:1rem 0}
table{border-collapse:collapse;width:100%;background:var(--card);border-radius:12px;overflow:hidden;font-size:1rem}
caption{text-align:left;font:600 .85rem var(--sans);color:var(--ink2);padding:.4rem 0}
th,td{padding:.6rem .8rem;text-align:left;border-bottom:1px solid rgba(31,26,18,.1);vertical-align:top}
th{font-family:var(--sans);background:var(--paper2)}
.myths{display:grid;gap:.9rem}
.myth{background:var(--card);border-radius:14px;padding:.8rem 1.1rem;box-shadow:var(--shadow)}
.myth p{margin:.3rem 0}
.myth .m s{text-decoration-color:var(--rust);text-decoration-thickness:2px;color:var(--ink2)}
.lab{font:800 .72rem var(--sans);text-transform:uppercase;letter-spacing:.08em;padding:.1rem .45rem;border-radius:4px;background:var(--rust);color:#fff;margin-right:.3rem}
.f .lab{background:var(--heath)}
.faq details{background:var(--card);border-radius:12px;margin:.6rem 0;padding:.2rem 1rem;box-shadow:var(--shadow)}
.faq summary{cursor:pointer;font:600 1.08rem var(--sans);padding:.65rem 0}
.faq details[open] summary{color:var(--rust)}
/* species */
.spgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1rem}
.spcard{background:var(--card);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);display:flex;flex-direction:column;transition:transform .15s}
.spcard:hover{transform:translateY(-3px);color:var(--ink)}
.spcard img,.spcard .noimg{aspect-ratio:4/3;object-fit:cover;width:100%}
.spn{font:800 1.05rem var(--sans);padding:.6rem .8rem 0}
.spl{font-style:italic;padding:0 .8rem;color:var(--ink2)}
.spw{font-size:.88rem;padding:.2rem .8rem .8rem;color:var(--ink2)}
.noimg{display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--paper2);gap:.3rem;padding:1rem;text-align:center;font:600 .78rem var(--sans);color:var(--ink2);border-radius:8px}
.noimg .bee{width:90px;opacity:.75}
.spfacts{display:grid;grid-template-columns:auto 1fr;gap:.4rem 1rem;background:var(--card);padding:1rem 1.2rem;border-radius:12px}
.spfacts dt{font:800 .8rem var(--sans);text-transform:uppercase;letter-spacing:.06em;color:var(--rust);padding-top:.25rem}
.spfacts dd{margin:0}
.inline{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.4rem 1rem}
/* facts */
.jump{font-family:var(--sans);font-size:.92rem;line-height:1.9}
.factgroup h2{border-bottom:3px solid var(--honey);padding-bottom:.2rem;display:inline-block}
.facts{list-style:none;padding:0}
.facts li{position:relative;padding:.55rem 0 .55rem 3rem;border-bottom:1px dotted rgba(31,26,18,.22);max-width:none}
.fn{position:absolute;left:0;top:.6rem;font:800 .85rem var(--sans);color:var(--heath);background:var(--heath2);border-radius:6px;padding:.05rem .4rem;min-width:2.2rem;text-align:center}
/* field notes */
.journal{display:grid;grid-template-columns:180px 1fr;gap:1.5rem;align-items:start}
.jimg{position:sticky;top:90px;transform:rotate(-5deg)}
.entries{list-style:none;padding:0;margin:0}
.entry{background:var(--card);margin:0 0 .8rem;padding:.7rem 1rem;border-radius:4px 14px 14px 14px;box-shadow:var(--shadow);background-image:repeating-linear-gradient(transparent 0 30px,rgba(63,90,53,.12) 30px 31px)}
.entry p{font-family:var(--hand);font-size:1.15rem;margin:.1rem 0}
.date{font:800 .75rem var(--sans);color:var(--rust);text-transform:uppercase;letter-spacing:.08em}
@media (max-width:640px){.journal{grid-template-columns:1fr}.jimg{position:static;width:120px}}
/* play */
.gcards{display:grid;grid-template-columns:repeat(2,1fr);gap:1.1rem}
@media (max-width:700px){.gcards{grid-template-columns:1fr}}
.gcard{background:var(--hive);color:#efe8d3;border-radius:18px;padding:1.3rem 1.4rem;text-decoration:none;display:block}
.gcard h2{color:#fff;margin:.3rem 0}.gcard .kicker{color:var(--honey)}
.gcard:hover{background:var(--hive2);color:#fff}
.go{font:700 1rem var(--sans);color:var(--honey)}
.game{background:var(--card);border-radius:18px;padding:1.2rem;box-shadow:var(--shadow);margin:1.2rem 0;min-height:200px}
/* kit */
.kit{list-style:none;padding:0;display:grid;gap:.7rem}
.kit li{background:var(--card);border-radius:12px;padding:.75rem 1rem;box-shadow:var(--shadow);display:flex;flex-direction:column;max-width:none}
.kit strong a{font-family:var(--sans)}
.kit span{color:var(--ink2);font-size:1rem}
.disclose{font-size:.92rem;background:var(--paper2);border-radius:10px;padding:.55rem .85rem;color:var(--ink2)}
.credits{list-style:none;padding:0}
.credits li{display:flex;gap:1rem;align-items:flex-start;padding:.7rem 0;border-bottom:1px dotted rgba(31,26,18,.25);font-size:.98rem;max-width:none}
.credits img{width:120px;flex:none;border-radius:6px}
.srcs li{margin:.3rem 0;word-break:break-word}
.contact{list-style:none;padding:0}.contact li{margin:.5rem 0}
.netlist li{margin:.5rem 0}
.nf{text-align:center;padding-top:3rem}.nf .big{width:200px;margin:0 auto}.nf .btns{justify-content:center}.nf .lede{margin:0 auto}
/* footer */
.foot{background:var(--ink);color:#e3d9c2;margin-top:3rem;padding:2rem 0 2.5rem}
.foot a{color:#f6e8bd}
.foot h2{color:#fff;font-size:1.05rem;margin:.6rem 0 .5rem}
.foot ul{list-style:none;padding:0;margin:0}.foot li{margin:.25rem 0;font-size:.98rem}
.fbee{display:flex;align-items:center;gap:.8rem}.fbee .bee{width:64px;--beec:#8a6a44;--bees:#100b07;--wing:#f1dfbd}.fbee p{margin:0;font-size:1.15rem;color:#f6e8bd}
.cols{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-top:1rem}
@media (max-width:820px){.cols{grid-template-columns:1fr 1fr}}
.pill{font:600 .7rem var(--sans);background:rgba(246,232,189,.18);border-radius:999px;padding:.05rem .45rem}
.fine{font-size:.88rem;color:#c9bea6;margin-top:1.6rem;max-width:none}
/* games shared */
.gbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;font-family:var(--sans);font-weight:600;margin-bottom:.8rem}
.opts{display:grid;gap:.55rem;margin:1rem 0}
.opt{text-align:left;font:600 1.05rem var(--sans);padding:.75rem 1rem;border-radius:12px;border:2px solid rgba(31,26,18,.2);background:#fff;cursor:pointer;color:var(--ink)}
.opt:hover:not(:disabled){border-color:var(--heath)}
.opt.right{background:var(--heath2);border-color:var(--heath)}
.opt.wrong{background:var(--rust2);border-color:var(--rust)}
.why{background:var(--paper2);border-radius:10px;padding:.7rem 1rem}
.qtext{font:800 1.35rem/1.25 var(--sans);margin:.3rem 0}
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;max-width:640px;margin:0 auto}
@media (max-width:520px){.pgrid{grid-template-columns:repeat(3,1fr)}}
.pcard{aspect-ratio:1;border-radius:12px;border:0;cursor:pointer;padding:0;position:relative;background:var(--heath);overflow:hidden;font:700 .85rem/1.2 var(--sans);color:var(--ink)}
.pcard .back{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:var(--heath)}
.pcard .back svg{width:60%;--beec:#8a6a44;--wing:#f1dfbd}
.pcard .face{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:#fff;padding:.4rem;text-align:center}
.pcard .face img{width:100%;height:100%;object-fit:cover}
.pcard.up .face,.pcard.done .face{display:flex}.pcard.up .back,.pcard.done .back{display:none}
.pcard.done{outline:4px solid var(--honey)}
.pcard i{display:block;font-weight:400;font-family:var(--serif)}
.toast{background:var(--ink);color:#fff;border-radius:10px;padding:.6rem .9rem;margin:.6rem 0;font-size:1rem}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* ---- printables (ported from owls.animals.im; .prgrid/.prcard because .pgrid/.pcard belong to Spiny Pairs) ---- */
:root{--amber:#e9a23b;--amber2:#f3bb5c;--amberd:#7a4d0c}
.printables{margin-top:1.4rem;padding:1.1rem 1.2rem 1.3rem;border:2px dashed rgba(163,68,42,.35);border-radius:16px;background:rgba(251,247,236,.6)}
.printables .phd{margin:0;font-family:var(--sans);font-weight:800;font-size:1.35rem;color:var(--ink)}
.printables .psub{margin:.2rem 0 0;color:var(--ink2);font-size:1rem}
.printables .prow{margin:.9rem 0 0;justify-content:flex-start}
.printables ul,.printables ol,.printables li,.pnote ul,.pnote li{list-style:none}
.printables ul{padding-left:0;margin-left:0}
.printables li::marker{content:""}
.printables .prgrid{list-style:none;padding:0;margin:1rem 0 0;display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:600px){.printables .prgrid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:24px}}
@media (min-width:1000px){.printables .prgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}}
.prcard{display:flex;flex-direction:column;background:var(--card);border:1px solid rgba(31,26,18,.14);border-radius:14px;overflow:hidden;box-shadow:var(--shadow);margin:0}
.pmedia{position:relative;aspect-ratio:16/9;background:#14231b;border-bottom:1px solid rgba(31,26,18,.14);padding:8px}
.pmedia .pcov{display:block;width:100%;height:100%;object-fit:cover;border-radius:6px;box-shadow:0 0 0 1px rgba(255,255,255,.18)}
.pbadge{position:absolute;top:16px;left:16px;background:var(--amber);color:#2a1d14;font:800 .74rem/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;padding:.4rem .65rem;border-radius:999px;box-shadow:0 4px 12px -4px rgba(0,0,0,.5)}
.pbody{display:flex;flex-direction:column;flex:1;padding:16px 18px 18px}
.printables .ptitle{margin:0;font-family:var(--sans);font-weight:800;font-size:1.1rem;line-height:1.25;color:var(--heath-d)}
.printables .pdesc{margin:.4rem 0 0;color:var(--ink2);font-size:.98rem;line-height:1.45}
.pfoot{margin-top:auto;padding-top:14px;display:flex;align-items:center;justify-content:flex-start;gap:.6rem;flex-wrap:wrap}
.pbuy{display:inline-flex;align-items:center;gap:.45rem;background:var(--amber);color:#2a1d14;font:800 1.02rem var(--sans);padding:.5rem 1rem;border-radius:10px;text-decoration:none;border:2px solid var(--amber);white-space:nowrap;box-shadow:0 3px 0 var(--amberd)}
a.pbuy:hover{background:var(--amber2);border-color:var(--amber2);color:#2a1d14}
.pbuy span{font-size:.9em}
.pbuy.soon{cursor:default;box-shadow:none}
.pbuy .csoon{font:700 .72rem/1 var(--sans);letter-spacing:.05em;text-transform:uppercase;background:rgba(31,26,18,.12);padding:.28rem .45rem;border-radius:6px}
.pbuy.sm{font-size:.88rem;padding:.15rem .55rem;border-radius:8px;margin-left:.25rem;vertical-align:baseline;box-shadow:none}
.pbuy.sm .csoon{font-size:.66rem;padding:.2rem .35rem}
.pbanner{margin-top:24px;display:grid;grid-template-columns:1fr;background:linear-gradient(135deg,var(--heath2),var(--card));border:2px solid var(--amber);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.pbanner .pbody{padding:20px 22px 22px;justify-content:center}
.pbanner .ptitle{font-size:1.4rem}
.pbanner .pdesc{font-size:1.04rem}
@media (min-width:1000px){.pbanner{margin-top:28px;grid-template-columns:minmax(0,46%) 1fr;align-items:stretch}.pbanner .pmedia{border-bottom:0;border-right:1px solid rgba(31,26,18,.14);aspect-ratio:auto;overflow:hidden}.pbanner .pmedia::before{content:"";display:block;padding-top:56.25%}.pbanner .pmedia .pcov{position:absolute;inset:8px;width:calc(100% - 16px);height:calc(100% - 16px)}.pbanner .pbody{padding:28px 32px}.pbanner .pfoot{margin-top:0;padding-top:18px}}
@media (min-width:1000px){.narrow>.support:has(.printables),.narrow>.printables{width:min(1140px,calc(100vw - 64px));margin-left:calc(50% - min(570px,calc(50vw - 32px)));max-width:none}}
@media (max-width:520px){.support{padding:1.25rem 1rem}.printables{padding:.9rem .75rem}}
/* free sample dropdown */
.freedl{position:relative;display:inline-block}
.freedl summary{list-style:none;cursor:pointer;user-select:none}
.freedl summary::-webkit-details-marker{display:none}
.freedl summary::marker{content:""}
.freedl summary::after{content:"";display:inline-block;margin-left:.5rem;border:5px solid transparent;border-top-color:currentColor;transform:translateY(3px)}
.freedl[open] summary::after{transform:translateY(-2px) rotate(180deg)}
.freemenu{position:absolute;left:0;top:calc(100% + 8px);width:250px;background:var(--card);border:2px solid var(--ink);border-radius:12px;padding:.75rem;box-shadow:0 16px 36px -12px rgba(31,26,18,.55);z-index:30;list-style:none}
.freemenu p{margin:0 0 .45rem;font-size:.9rem;color:var(--ink2);line-height:1.4}
.freemenu a{display:flex;justify-content:space-between;gap:.8rem;padding:.5rem .7rem;margin-top:.35rem;border:1px solid var(--rust);border-radius:8px;color:var(--rust);font:700 .95rem var(--sans);text-decoration:none}
.freemenu a:hover{background:var(--rust2)}
.freemenu a span{font-weight:400;color:var(--ink2)}
/* contextual printable note */
.pnote{display:flex;gap:.8rem;align-items:center;margin:1.6rem 0;padding:.65rem .85rem;border:1px solid rgba(31,26,18,.16);border-radius:12px;background:var(--card)}
.pnote img{width:56px;height:56px;border-radius:6px;flex:none}
.pnote p{margin:0;font-size:1rem;color:var(--ink2);line-height:1.5}
.pnote .kicker{display:block;margin-bottom:.1rem}
.pnote .pn-t{color:var(--ink)}
.pnote .pbuy{white-space:nowrap}
.pnote .pfree{display:block;margin-top:.35rem;font-size:.92rem}
.nav .shoplink{border:1px solid rgba(246,240,220,.45);margin-left:.3rem}
@media (max-width:980px){.nav .shoplink{margin:.4rem 0 0;display:inline-block}}
/* ===== bees.animals.im: honey, hive and specimen-cabinet layer ===== */
body{background-color:var(--paper);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cpath d='M28 0l28 16v32L28 64 0 48V16zM28 64v33M0 48v49M56 48v49' fill='none' stroke='%23b8892a' stroke-opacity='.09' stroke-width='1.2'/%3E%3C/svg%3E");background-size:56px 97px}
a{color:var(--heath-d)}a:hover{color:var(--rust)}
:focus-visible{outline-color:var(--heath)}
.kicker{color:var(--rust)}
.top{background:var(--hive);color:#fbf1d6}
.brand,.nav a,.navbtn{color:#fbf1d6}
.brand:hover{color:var(--honey)}
.brandbee{width:50px;height:36px;--beec:#f2b632;--bees:#0f0c07;--wing:#fff8e6;transform:rotate(-8deg);transition:transform .3s}
.brand:hover .brandbee{transform:rotate(6deg) translateY(-2px)}
.b2{color:var(--honey);opacity:1}
.nav a:hover,.nav a[aria-current=page]{background:rgba(242,182,50,.16);color:#fff}
.nav a[aria-current=page]{box-shadow:inset 0 -2px 0 var(--honey)}
.nav .shoplink{border-color:rgba(242,182,50,.55)}
.navbtn{border-color:rgba(242,182,50,.6)}
.comb{display:block;width:100%;height:12px;fill:var(--honey);position:absolute;left:0;bottom:-11px;background:var(--hive)}
.top{border-bottom:0}
@media (max-width:980px){.nav{background:var(--hive2)}}
.btn{background:var(--ink);color:var(--honey);border-color:var(--ink);box-shadow:0 3px 0 #b07d10}
.btn:hover{background:#3a3022;color:#ffd05e}
.btn:active{box-shadow:0 1px 0 #b07d10}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink);box-shadow:0 3px 0 var(--ink)}
.btn.ghost:hover{background:var(--honey2)}
.hero h1 em{color:var(--rust)}
.hero{position:relative}
.hero .heroimg .ph{transform:rotate(-1.6deg)}
.hexstat{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem;margin-top:2rem}
@media (max-width:820px){.hexstat{grid-template-columns:1fr 1fr}}
.hexstat .stat{clip-path:polygon(8% 0,92% 0,100% 50%,92% 100%,8% 100%,0 50%);border-top:0;padding:1rem 1.6rem;background:var(--honey2);box-shadow:none;text-align:center}
.hexstat .stat:nth-child(2){background:var(--heath2)}.hexstat .stat:nth-child(3){background:#dfead2}.hexstat .stat:nth-child(4){background:#f3dccd}
.stat{border-top-color:var(--honey)}.stat:nth-child(2){border-color:var(--heath)}.stat:nth-child(3){border-color:var(--leaf)}
.cite{color:var(--heath-d);background:var(--heath2)}.cite:hover{background:var(--heath);color:#fff}
.night,.hive{background:var(--hive);color:#f2e7cc;border-radius:22px;margin:2.5rem 0;padding:2rem;position:relative;overflow:hidden;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cpath d='M28 0l28 16v32L28 64 0 48V16zM28 64v33M0 48v49M56 48v49' fill='none' stroke='%23f2b632' stroke-opacity='.14' stroke-width='1.5'/%3E%3C/svg%3E");background-size:42px 73px}
.hive h2{color:#fff;margin-top:.3rem}.hive .kicker{color:var(--honey)}.hive a{color:var(--honey2)}
.hive .useless{background:#fbf1d6;color:var(--ink)}
.games a{color:#f2e7cc}.games a:hover{background:#45381f}
.gcard{color:#f2e7cc;position:relative;overflow:hidden}
.gcard::after{content:"";position:absolute;right:-18px;bottom:-24px;width:110px;height:96px;background:var(--honey);opacity:.12;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.gcard:hover{background:var(--hive2)}
.callout.note .kicker{color:#7a5300}
.bigphone{color:#fbf1d6}
.pmedia{background:var(--hive)}
.printables{border-color:rgba(155,74,18,.35)}
.pbanner{background:linear-gradient(135deg,var(--honey2),var(--card))}
.printables .ptitle{color:var(--ink)}
.fbee .bee{width:64px;--beec:#f2b632;--bees:#0c0905;--wing:#fff8e6}.fbee{display:flex;align-items:center;gap:.8rem}.fbee p{margin:0;font-size:1.15rem;color:var(--honey2)}
.foot{background:var(--hive);border-top:6px solid var(--honey)}
.foot a{color:var(--honey2)}
.entry{background-image:repeating-linear-gradient(transparent 0 30px,rgba(74,63,158,.12) 30px 31px)}
.date{color:var(--rust)}
.fn{color:var(--heath-d);background:var(--heath2)}
.factgroup h2{border-bottom-color:var(--honey)}
.steps>li::before{background:var(--ink);color:var(--honey);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);border-radius:0}
.opt:hover:not(:disabled){border-color:var(--heath)}
.opt.right{background:#dfead2;border-color:var(--leaf)}
/* specimen cabinet: species cards look like pinned museum labels */
.spcard{border:1px solid rgba(31,26,18,.14)}
.spcard .lbl{margin:.6rem .7rem .8rem;border:1px solid rgba(31,26,18,.35);background:#fffdf6;padding:.45rem .6rem .5rem;font-family:var(--mono);font-size:.74rem;line-height:1.35;color:var(--ink2);position:relative}
.spcard .lbl::before{content:"";position:absolute;top:-5px;left:50%;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:#7d6a4a;box-shadow:0 0 0 2px #fffdf6}
.spcard .spn{padding:0;font-size:1rem;display:block;color:var(--ink)}
.spcard .spl{padding:0;display:block;font-family:var(--serif);font-size:.95rem}
.spcard .spw{padding:.15rem 0 0;display:block;font-size:.72rem}
.spcard .no{position:absolute;top:8px;left:8px;background:var(--honey);color:var(--ink);font:800 .72rem var(--sans);padding:.15rem .45rem;border-radius:4px}
.spcard{position:relative}
.label{font-family:var(--mono);font-size:.82rem;border:1px solid rgba(31,26,18,.35);background:#fffdf6;padding:.6rem .8rem;display:inline-block;margin:.4rem 0 1rem;line-height:1.5}
.spfacts dt{color:var(--rust)}
/* anatomy diagram */
.diagram{background:var(--card);border-radius:16px;box-shadow:var(--shadow);padding:1rem;margin:1.5rem 0}
.diagram svg{width:100%;height:auto;display:block}
.diagram text{font-family:var(--sans);font-weight:600;font-size:15px;fill:var(--ink)}
.diagram .ln{stroke:var(--ink2);stroke-width:1.3;fill:none;stroke-dasharray:3 3}
.caste{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1.2rem 0}
.caste>div{background:var(--card);border-radius:14px;padding:.4rem 1.1rem .9rem;box-shadow:var(--shadow);border-top:6px solid var(--honey)}
.caste>div:nth-child(2){border-color:var(--heath)}.caste>div:nth-child(3){border-color:var(--leaf)}
.caste h3{margin-top:.8rem}
@media (max-width:760px){.caste{grid-template-columns:1fr}}
.timeline{list-style:none;padding:0;margin:1rem 0;border-left:4px solid var(--honey);padding-left:1.2rem}
.timeline li{position:relative;margin:.9rem 0}
.timeline li::before{content:"";position:absolute;left:-1.72rem;top:.45rem;width:14px;height:12px;background:var(--ink);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.timeline b{font-family:var(--sans)}
.month{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem;margin:1rem 0}
.month>div{background:var(--card);border-radius:12px;padding:.6rem .9rem;box-shadow:var(--shadow);font-size:1rem}
.month h3{margin:.2rem 0;font-size:1rem}
@media (max-width:760px){.month{grid-template-columns:1fr 1fr}}
.stingbox{background:#fff;border:3px solid var(--rust);border-radius:16px;padding:1rem 1.2rem;margin:1.2rem 0}
.stingbox h2{margin-top:.2rem;color:var(--rust)}
/* games */
.game{border:1px solid rgba(31,26,18,.1)}
.pcard,.pcard .back{background:var(--hive)}
.pcard .back svg{width:62%;--beec:#f2b632;--bees:#0c0905;--wing:#fff8e6}
.pcard.done{outline-color:var(--honey)}
/* waggle decoder */
.wd{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start}
@media (max-width:700px){.wd{grid-template-columns:1fr}}
.wd figure{margin:0;background:var(--hive);border-radius:14px;padding:.5rem;position:relative}
.wd figcaption{font:600 .85rem var(--sans);color:#f2e7cc;text-align:center;padding:.3rem 0 .1rem}
.wd svg{width:100%;height:auto;display:block;touch-action:manipulation}
.wd .field{background:#cfe0ac;border-radius:14px;padding:.5rem}
.wd .field figcaption{color:var(--ink)}
.patch{cursor:pointer}
.patch:hover circle.bg,.patch:focus circle.bg{stroke:var(--ink);stroke-width:4}
.patch:focus{outline:none}
.patch.ok circle.bg{fill:#9fd38a;stroke:var(--leaf);stroke-width:5}
.patch.bad circle.bg{fill:#f2b2a0;stroke:var(--rust);stroke-width:5}
.wdctl{display:flex;flex-wrap:wrap;gap:.5rem;margin:.6rem 0}
.wdctl button,.gbtn{font:700 .95rem var(--sans);padding:.5rem .9rem;border-radius:10px;border:2px solid var(--ink);background:#fff;cursor:pointer;color:var(--ink)}
.wdctl button:hover,.gbtn:hover{background:var(--honey2)}
/* flower constancy */
.meadow{display:grid;grid-template-columns:repeat(5,1fr);gap:.45rem;max-width:520px;margin:.8rem auto;touch-action:manipulation}
.fl{aspect-ratio:1;border-radius:14px;border:2px solid transparent;background:#d9e8bd;cursor:pointer;padding:6px;position:relative;transition:transform .12s}
.fl:hover{transform:scale(1.04)}
.fl svg{width:100%;height:100%;display:block}
.fl.empty{background:#e9e3cf;cursor:not-allowed}
.fl.empty svg{opacity:.35;filter:grayscale(.8)}
.fl.empty::after{content:"👣";position:absolute;right:3px;bottom:1px;font-size:.8rem}
.fl.pop{animation:pop .35s}
@keyframes pop{50%{transform:scale(1.15)}}
.carry{display:inline-flex;align-items:center;gap:.4rem}
.carry i{display:inline-block;width:18px;height:18px;border-radius:50%;border:2px solid var(--ink)}
.bar{height:10px;border-radius:99px;background:var(--paper2);overflow:hidden;margin:.3rem 0 .8rem}
.bar span{display:block;height:100%;background:var(--honey);transition:width .3s linear}

/* network explore bar (animals.im). Same markup on every animal site */
.xbar{background:#15100a;border-bottom:1px solid rgba(255,255,255,.08)}
.xbar .xin{display:flex;align-items:center;min-height:44px}
.xlink{display:inline-flex;align-items:center;gap:.45em;min-height:44px;padding:0 .6rem;margin-left:-.6rem;color:#f3bb5c;font-weight:700;font-size:.92rem;line-height:1.2;letter-spacing:.01em;text-decoration:none;border-radius:6px}
.xlink:hover,.xlink:focus-visible{color:#f3bb5c;text-decoration:underline;text-underline-offset:3px}
.xlink:focus-visible{outline:2px solid #f3bb5c;outline-offset:-2px}
.xlink .xarr{display:inline-block;transition:transform .15s ease}
.xlink:hover .xarr{transform:translateX(-3px)}
@media (prefers-reduced-motion:reduce){.xlink .xarr{transition:none}}
@media print{.xbar{display:none}}

/* jump links: keep targets clear of the sticky header */
html{scroll-padding-top:80px}
/* site rule: no bullets anywhere on the bee site */
main ul{list-style:none;padding-left:0}
main ul:not([class])>li,main ul.srcs>li,main ul.netlist>li{margin:.4rem 0}
