/* v2 additions ONLY (everything else is the live css/style.css + css/game.css). Derived from live tokens/components. */
.returnbox { margin-top:10px; border-top:2px dashed var(--line); padding-top:8px; }
.returnbox h3 { margin:4px 0; font-size:16px; } .lb { margin:4px 0 0 18px; padding:0; } .lb li.me { color: var(--acc2); font-weight:700; }
input.amt { width:110px; } input.amt.small { width:56px; padding:4px 6px; }
.bulkrow { background:#0a0f0b; border:2px solid var(--line); border-radius:6px; padding:6px 8px; }
.bulkrow .btn { font-size:12px; padding:5px 10px; }
.pet.card { position:relative; } .pet.card .pick-cb { position:absolute; top:8px; left:8px; z-index:2; width:20px; height:20px; accent-color: var(--green); }
.pet.card.selected { border-color: var(--acc2) !important; box-shadow: 4px 4px 0 #000, 0 0 0 3px var(--acc2) inset; }
.arenawrap { display:flex; flex-wrap:wrap; gap:12px; align-items:flex-start; }
#arena { width:540px; max-width:100%; height:auto; image-rendering:pixelated; background:#0a0f0b; border:3px solid #3ddc84; border-radius:6px; }
#fightLog { flex:1 1 260px; margin:0; padding-left:22px; }
.bracket { display:flex; gap:10px; overflow-x:auto; padding:6px 0; } .bracket .rcol { display:flex; flex-direction:column; gap:6px; justify-content:space-around; min-width:110px; }
.bracket .chip.win { background:#1d3a24; color: var(--acc2); }
.tree { margin:2px 0 0 14px; padding:0; } .tree li { list-style:'└ '; }
.slottbl { width:100%; font-size:12px; border-collapse:collapse; } .slottbl td { padding:2px 4px; border-bottom:1px solid var(--line); }
/* --- v2 round 3: community sprite size, standalone gear icons, click-to-equip picker, view-by-slot inventory --- */
#shared .sharedwrap { grid-template-columns: minmax(260px, 420px) 1fr; }
/* community pet: crisp integer scale (32px sprite x8 / x6) so it fits its section at every width (Jake 2026-10-14) */
#shared .sharedart canvas#crCanvas { width: 256px; height: 256px; max-width: none; margin: 0 auto; border-radius: 16px; image-rendering: pixelated; display: block; }
@media (max-width: 1100px) { #shared .sharedart canvas#crCanvas { width: 192px; height: 192px; } }
@media (max-width: 640px) { #shared .sharedwrap { grid-template-columns: 1fr; } #shared .sharedart canvas#crCanvas { width: 192px; height: 192px; } }
#communityPanel .cgrid { grid-template-columns: 176px 1fr; }
#communityPanel .cgrid .commsprite { width: 160px; height: 160px; }
@media (max-width: 520px) { #communityPanel .cgrid { grid-template-columns: 112px 1fr; } #communityPanel .cgrid .commsprite { width: 104px; height: 104px; } }
.invtabs { margin-top: 10px; } .slotfilter { margin: 4px 0 6px; } .slotfilter .q.on, .camtseg .q.on { background: #2a3a2e; color: #fff; border-color: var(--acc2); } .camtseg .q.on { box-shadow: inset 0 0 0 2px var(--acc2); }
.invcard.unowned { opacity: .55; } .invcard.unowned:hover { opacity: 1; }
.gpicker { margin: 6px 0 12px; }
.gp-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 6px; }
.gp-slot { font: inherit; text-align: left; cursor: pointer; background: var(--bg2); color: inherit; border: 3px solid #3a4a3e; border-radius: 6px; padding: 6px 8px; box-shadow: 3px 3px 0 #000; }
.gp-slot b { display: block; font-size: 13px; } .gp-slot span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: .8; }
.gp-slot.on { border-color: var(--acc2); background: #2a3a2e; } .gp-slot.locked { opacity: .6; }
.gp-head { margin: 8px 0 4px; }
.gp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(52px, 1fr)); gap: 6px; max-height: 260px; overflow-y: auto; padding: 4px; background: #0a0f0b; border: 2px solid #3a4a3e; border-radius: 6px; }
.gp-item { position: relative; padding: 2px; cursor: pointer; background: var(--bg2); border: 3px solid #9aa3b5; border-radius: 6px; }
.gp-item.t1 { border-color: #4fd18b; } .gp-item.t2 { border-color: #4f9dff; } .gp-item.t3 { border-color: #ffc93c; }
.gp-item canvas { width: 42px; height: 42px; image-rendering: pixelated; display: block; margin: 0 auto; }
.gp-item.no { opacity: .38; filter: grayscale(.7); } .gp-item.no:hover { opacity: .8; }
.gp-item.worn { box-shadow: 0 0 0 3px var(--acc2); }
.gp-item:hover, .gp-item:focus { transform: translateY(-1px); outline: 2px solid #fff; }
.gp-n { position: absolute; bottom: 0; right: 2px; font-size: 9px; color: #fff; text-shadow: 1px 1px 0 #000; }
.gp-star { position: absolute; top: -2px; left: 2px; font-size: 10px; color: #ffc93c; } .gp-on { position: absolute; top: 0; right: 1px; font-size: 8px; background: #1d3a24; color: #c8f7d8; border-radius: 4px; padding: 0 2px; }
.gp-msg { min-height: 1.2em; margin-top: 4px; }
.gicon { width: 42px; height: 42px; image-rendering: pixelated; }
.board tr.me td { background: var(--bg2); } .board tr.me td.rk { color: var(--acc2); font-weight:700; }
.bgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(112px,1fr)); gap:8px; margin:6px 0 12px; }
.bgrid .pet.card { padding:6px; text-align:center; font-size:11px; } .bgrid .pet.card canvas { width:64px; height:64px; image-rendering:pixelated; display:block; margin:0 auto 4px; }
.bgrid .pet.card.sel { border-color:#3ddc84; box-shadow:0 0 0 2px #3ddc84, 3px 3px 0 #000; } .bgrid .pet.card.sel::after { content:'✓ ' attr(data-role); display:block; color:#3ddc84; font-weight:700; }
.bgrid .pet.card.off { opacity:.45; cursor:not-allowed; filter:grayscale(.6); } .bgrid .pet.card.off:hover { transform:none; border-color:var(--pixline); }
#breedArena { width:540px; max-width:100%; height:auto; image-rendering:pixelated; background:#0a0f0b; border:3px solid #3ddc84; border-radius:6px; }
.bgrid .pet.card b { color:var(--ink); }
.chip.hyb { background:#3b2a5a; color:#ffc93c; font-weight:700; letter-spacing:1px; font-size:10px; }

/* animation pop-up (battle / breeding) */
.reveal.anim .box { max-width: 460px; text-align: left; } .reveal.anim .arenawrap { display: block !important; } .reveal.anim canvas { width: 100%; max-width: 400px; height: auto; image-rendering: pixelated; display: block; margin: 0 auto 8px; }
.reveal.anim .logbox { max-height: 160px; overflow: auto; }

/* inscriptions */
.reveal.insc .box { max-width: 720px; text-align: left; } .inscgrid { display: flex; gap: 14px; flex-wrap: wrap; align-items: flex-end; }
.inscgrid figure { margin: 0; } .inscgrid canvas, .inscgrid img { width: 256px; height: 256px; image-rendering: pixelated; border: 2px solid #2a3a2e; background: #0a0f0b; object-fit: contain; }
.insclink { color: #9fd8ff; text-decoration: underline dotted; } .insclink em { color: #ffc93c; font-style: normal; } .stuck { color: #ffc93c; margin: 6px 0; }
.insctable { width: 100%; border-collapse: collapse; font-size: 13px; } .insctable td, .insctable th { border-bottom: 1px solid #2a3a2e; padding: 6px; text-align: left; vertical-align: top; }
.inscthumb { width: 64px; height: 64px; image-rendering: pixelated; } .inscpick { margin: 10px 0; }

/* pet pop-up: prominent 'Open pet page' primary button, right under the name/art (2026-10-14) */
#detail .openpet { display: block; width: 100%; box-sizing: border-box; text-align: center; font-size: 17px; padding: 12px 18px; margin: 12px 0 14px; background: #3ddc84; color: #06210f; border: 2px solid #0b3d20; box-shadow: 0 4px 0 #0b3d20; border-radius: 10px; font-weight: 700; text-decoration: none; }
#detail .openpet:hover, #detail .openpet:focus-visible { background: #5ff0a0; outline: 3px solid #ffd23f; outline-offset: 2px; }
/* persistent 'Inscribing' pet header card */
.inschead { display: flex; gap: 12px; align-items: center; background: #13201a; border: 2px solid #f7931a; border-radius: 10px; padding: 8px 12px; margin: 8px 0 12px; }
.inschead .insctb { width: 64px; height: 64px; image-rendering: pixelated; background: #0b0f0c; border-radius: 6px; flex: none; }
.inschead .ihb { flex: 1; min-width: 0; } .inschead .ihk { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #f7931a; }
.inschead .ihn { font-size: 16px; } .inschead .ihm { font-size: 13px; color: #c9d6cc; } .inschead .ihr.t3 { color: #ffc93c; } .inschead .ihr.t2 { color: #9fd8ff; }
.inschead .ihs { font-weight: bold; white-space: nowrap; padding: 4px 10px; border-radius: 999px; background: #1f2f26; }
.inschead[data-step="stuck"] { border-color: #ffc93c; } .inschead[data-step="done"] { border-color: #3ddc84; }
/* hero grid (2026-10-14): crisp integer scaling of the 32-px sprites (3x, 4x on wide screens) instead of a fractional ~3.6x stretch */
.hero-pets{grid-template-columns:repeat(3,96px);max-width:none;justify-content:center}
.hero-pets canvas{width:96px;height:96px;aspect-ratio:auto;image-rendering:pixelated;image-rendering:crisp-edges}
@media (min-width:900px){.hero-pets{grid-template-columns:repeat(3,128px)}.hero-pets canvas{width:128px;height:128px}}

/* gear-win notification (same .toast look) */
.toast.wintoast{border-color:#ffd23f;max-width:420px}.toast.wintoast .winrow{display:flex;align-items:center;gap:6px;margin-top:4px}.toast.wintoast .winico canvas{width:32px;height:32px;image-rendering:pixelated;vertical-align:middle}.toast.wintoast .winlist{max-height:50vh;overflow:auto}

/* front-page Cold Storage link (Jake 2026-10-14): the whole label + bar links to archive.html, visuals unchanged */
a.returnlink { display: block; color: inherit; text-decoration: none; cursor: pointer; border-radius: 6px; } a.returnlink:hover { color: inherit; text-decoration: none; } a.returnlink:focus-visible { outline: 2px solid #ffc93c; outline-offset: 3px; }
/* Cold Storage button (Jake 2026-10-14: must look clickable): game button style, pixel snowflake, arrow; hover lift, active press, focus ring */
a.returnlink .coldbtn { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border: 3px solid #000; border-radius: 6px; background: #33d6ff; color: #04202a; font-weight: 700; box-shadow: 3px 3px 0 #000; transition: transform .08s, box-shadow .08s, filter .08s; }
a.returnlink .coldico { image-rendering: pixelated; flex: none; } a.returnlink .coldico path { fill: #04202a; }
a.returnlink:hover .coldbtn { filter: brightness(1.12); transform: translate(-1px, -1px); box-shadow: 4px 4px 0 #000; }
a.returnlink:active .coldbtn { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #000; }
a.returnlink:focus-visible { outline: none; } a.returnlink:focus-visible .coldbtn { outline: 3px solid #ffc93c; outline-offset: 3px; }

/* footer Telegram link (Jake 2026-10-14) */
.tgline { margin: 8px 0 0; } a.tglink { color: #33d6ff; font-weight: 700; text-decoration: none; border-bottom: 1px dotted #33d6ff; } a.tglink:hover { color: #8be8ff; }

/* Community pet heading icon (hotfix 2026-10-14): Mythic Nakamoto rendered from pet-core + v2 rework, instead of the generic Pepe pet.png */
.sec[data-ico="naka"]::before { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAACQUlEQVR42uVXXyhDURz+rolpkqu0Gq1JHnhavMmDF+VBUgoPKzzMKy+eJCE18SBP8oAHRUppeVjxsIclybJSVv61tE2jLA/yp+Z6ca673XPvOXeziPOys9852/fd73y/3/ldARJ+dBQA/5xAodEf2ESH6tDiyYiQdwIEeHJuTLU2Ic5I2RIRWCbUA1YRGZ0xrIguAZvokHiAlSMYDMK76eMmwXUE0WhUFQsL6wCAesmVFrdarejsa4dX9Ek8JLg9QADvb57TF+zr8jSTTE4KEPmVT39/84xKe0naPlos0z96Smh6wCY6pPNoSBU3rTYAAFKDZ9xPWWopF7I6glDoUhVr0lnTVLPDoekHXQLh8An2Yp6M6Kfc+72q/TQPJBKJ7E1I8lo5WkZMCCykqHGj4EwPAMDV9Jscqx0vkue0uHu4Pw3cu+ljFiZmGtbNmhXf3mUFaHFIX+lagTauqsishFoyK4+BxOslFw7vVvBw+4KY38JVDZkEBuebcPGZjqQIaeX9Y+INpxsmQ/cBsx84Dh7J80p7iQxOyJBPAh5PRoRvu4yIClWtT4j5LThwtgIAmkN+quuVCvD2CgJPT0hrQmgEaOmZdSnOVKDGWaa7L7CQ0iWlRYLpgXgyIsT8FtRVO39HT8hSQe+I8toVE8CWEZM8Z8mfl7a80exGo9nNBc5tQs/iFHavJzUBAWDRs4SegS4AwNbaDncxYlZC8qcAEH7d/rp6i7tV+wmwkUrI3ZbzjLy8F2A5R1MM5Urgr7+cfgAhGBArHYN0LgAAAABJRU5ErkJggg==); }

/* layout hotfix (2026-10-14): one sticky wrapper (filters + bulk row) under the sticky nav; never over it */
.bulkrow { position:static; }
/* My Pets filter/search + bulk row scroll with the list (2026-10-16): the sticky version glitched (bar stuck while cards slid over/under it). */
.petsticky { position:static; background:#0a0f0b; padding:4px 0; }
/* pending challenges (2026-10-15) */
#fPending { max-height: none; margin: 6px 0 10px; } #fPending .txrow { padding: 6px 8px; margin: 3px 0; border-radius: 6px; background: #17211a; line-height: 1.5; }
#fPending .pend-out { border-left: 3px solid #33d6ff; } #fPending .pend-in { border-left: 3px solid #ffb02e; } #fPending .txrow a { color: #33d6ff; }
/* ===== ux-batch 2026-10-16 (UI only) ===== */
.ctlrow{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:6px 0}.ctlrow .ctlbody{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}.ctltoggle{display:none}
.ctlrow input[type=search]{width:130px}
@media (max-width:640px){.ctltoggle{display:inline-block}.ctlrow .ctlbody{display:none;width:100%}.ctlrow.open .ctlbody{display:flex}}
.bulkrow{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.bulkrow .grow{flex:1}.bulkrow .selall{white-space:nowrap}
.q.danger{color:#ff6b6b;border-color:#ff6b6b}.q.danger:disabled{opacity:.45}
.cost{display:block;font-size:10px;opacity:.85;font-weight:normal}
.selbar{position:sticky;top:var(--navh,56px);z-index:30;display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:8px 10px;margin:8px -4px;background:#14182a;border:3px solid #3ddc84;border-radius:6px;box-shadow:0 -4px 0 rgba(0,0,0,.35)}
.selbar[hidden]{display:none}.selbar .rollgrp{display:inline-flex;gap:4px;align-items:center}.selbar button:disabled{opacity:.45;filter:grayscale(1)}#selWhy{flex-basis:100%}
.pet.card .openbtn{position:absolute;right:6px;bottom:6px;padding:2px 6px;font-size:11px}.pet.card{position:relative;cursor:pointer;user-select:none}
.pet.card.flash,.board tr.flash{outline:3px solid #ffc93c;animation:uxblink .4s steps(2) 4}
@keyframes uxblink{50%{outline-color:transparent}}
.chip.origin a{color:inherit;text-decoration:underline}.chip.origin.hybrid{border-color:#c77dff}.chip.origin.bred{border-color:#ff9fd1}
.statline{margin:6px 0}.tokstat{font:inherit;background:#1d2238;color:#e9ecf5;border:2px dashed #ffc93c;border-radius:6px;padding:6px 10px;cursor:pointer}.tokstat b{font-size:18px;color:#ffc93c}
.toklist{margin:6px 0 10px}
.doll{border:2px solid #2c3352;border-radius:6px;padding:8px;margin:8px 0;background:rgba(0,0,0,.18)}.dollrow{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap}
canvas.sprite.big{width:96px;height:96px;image-rendering:pixelated}
.dollslots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;flex:1;min-width:240px}
.dslot{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;font:inherit;color:inherit;background:#1a1f33;border:2px solid #39405f;border-radius:5px;padding:5px;min-height:62px;cursor:pointer}
.dslot.locked{border-style:dashed;opacity:.75}.dslot.on{outline:2px solid #3ddc84}.dslot .dl{font-size:10px;text-transform:uppercase;letter-spacing:.5px;opacity:.8}
.dslot.t0,.bagitem.t0,.logitem.t0{border-color:#9aa3b5}.dslot.t1,.bagitem.t1,.logitem.t1{border-color:#4fd18b}.dslot.t2,.bagitem.t2,.logitem.t2{border-color:#4f9dff}.dslot.t3,.bagitem.t3,.logitem.t3{border-color:#ffc93c;box-shadow:0 0 0 1px #ffc93c inset}
.gi canvas{width:32px;height:32px;image-rendering:pixelated;vertical-align:middle}
.baggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:6px;margin:6px 0}
.bagitem{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;font:inherit;font-size:11px;color:inherit;background:#1a1f33;border:2px solid #39405f;border-radius:5px;padding:6px 4px;cursor:pointer;text-align:center}
.bagitem .cnt{position:absolute;top:2px;right:4px;font-weight:bold;color:#ffc93c}.bagitem .wn{font-size:10px;opacity:.8}
.loggrid{display:flex;flex-wrap:wrap;gap:4px;margin:4px 0 8px}.logitem{position:relative;display:inline-block;border:2px solid #2c3352;border-radius:4px;padding:2px;background:#151a2c}
.logitem.unfound canvas{filter:brightness(0);opacity:.35}.logitem .q8{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#7a819c;font-weight:bold}
.invpop{position:absolute;z-index:80;width:320px;max-width:calc(100vw - 16px);background:#14182a;border:3px solid #3ddc84;border-radius:6px;padding:10px;box-shadow:4px 4px 0 #000}
.invpop .ph{display:flex;gap:8px;align-items:center;margin-bottom:6px}.invpop .pclose{position:absolute;right:6px;top:6px}.invpop .pact{margin-top:8px;gap:6px}
.crates{border:2px dashed #ffc93c;border-radius:6px;padding:6px 8px;margin:6px 0}.crates[hidden]{display:none}.cratelist{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.crate{display:flex;flex-direction:column;align-items:center;background:#1a1f33;border:2px solid #6b5a2b;border-radius:4px;padding:4px 6px}.crate .box8{font-size:22px;animation:uxshake 1.2s steps(4) infinite}
@keyframes uxshake{0%,60%{transform:none}70%{transform:rotate(-8deg)}80%{transform:rotate(8deg)}90%{transform:rotate(-4deg)}}
.oddsbox{margin:6px 0;padding:6px 8px;border:2px solid #2c3352;border-radius:5px;background:rgba(0,0,0,.2)}.oddsbox.compact{padding:4px 6px}
table.odds td,table.odds th{padding:2px 6px}table.odds .t1{color:#4fd18b}table.odds .t2{color:#4f9dff}table.odds .t3{color:#ffc93c}
.relwarn{margin:8px 0;padding:8px;border:2px solid #ff6b6b;border-radius:5px;background:rgba(255,80,80,.08)}
.gearwin.ux-flash{animation:uxpop .5s steps(3) 1}.gearwin.ux-t2{box-shadow:0 0 0 3px #4f9dff}.gearwin.ux-t3{box-shadow:0 0 0 3px #ffc93c,0 0 18px #ffc93c}
.gearwin.ux-fanfare{animation:uxpop .5s steps(3) 1,uxglow 1s steps(2) 3}.gearwin .meme{margin-top:4px;color:#ffc93c;font-style:italic}.gearwin .stars{color:#ffc93c;letter-spacing:4px;animation:uxblink .3s steps(2) 6}
@keyframes uxpop{0%{transform:scale(.6);filter:brightness(3)}60%{transform:scale(1.08)}100%{transform:none;filter:none}}@keyframes uxglow{50%{box-shadow:0 0 0 3px #fff,0 0 28px #ffc93c}}
.uxnote{margin-top:6px}
.faceoff .fcard{border:3px solid #2c3352;border-radius:8px;padding:10px;margin:8px 0;background:rgba(0,0,0,.2)}.faceoff .fcard.inc{border-color:#ffc93c}
.fgrid{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:stretch}
.fside{display:flex;flex-direction:column;align-items:center;gap:4px;font:inherit;color:inherit;background:#1a1f33;border:3px solid #39405f;border-radius:6px;padding:8px;cursor:pointer;text-align:center;min-height:180px}
.fside.t0{border-color:#9aa3b5}.fside.t1{border-color:#4fd18b}.fside.t2{border-color:#4f9dff}.fside.t3{border-color:#ffc93c}.fside.no{opacity:.6;filter:grayscale(.6)}
.fside.empty{justify-content:center;border-style:dashed}.fside.empty:hover,.fside.empty:focus-visible{border-color:#ffc93c}.fside .fchg{font-size:12px;color:#ffc93c;text-decoration:underline}.fside .big{font-size:36px}.fpow{color:#ffc93c;font-weight:bold}
.fstats{display:grid;gap:2px;width:100%;max-width:220px}.fst{display:grid;grid-template-columns:30px 1fr 22px;gap:4px;align-items:center;font-size:10px}
.fb{height:6px;background:#0d1020;border:1px solid #39405f}.fb i{display:block;height:100%;background:#9aa3b5}.fb i.up{background:#3ddc84}.fb i.dn{background:#ff6b6b}
.fgear{display:flex;flex-wrap:wrap;gap:2px;justify-content:center}.fgear canvas{width:24px;height:24px}
.vs{align-self:center;font-size:34px;font-weight:bold;color:#ff5d5d;text-shadow:3px 3px 0 #000,-1px -1px 0 #ffc93c;font-family:inherit;letter-spacing:2px}
.fstake{margin:8px 0;text-align:center}.fgo{display:block;margin:6px auto 0;min-width:260px}.fgo:disabled{opacity:.55;filter:grayscale(.7);cursor:not-allowed}
.fpick{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.6);display:flex;align-items:flex-start;justify-content:center;padding:4vh 8px;overflow:auto}
.fpick .box{background:#14182a;border:3px solid #3ddc84;border-radius:8px;padding:10px;width:min(920px,100%)}.fpick .row{gap:8px;align-items:center;flex-wrap:wrap}
.fpgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:6px;margin-top:8px;max-height:70vh;overflow:auto}
.fpc{display:flex;flex-direction:column;align-items:center;gap:2px;font:inherit;font-size:11px;color:inherit;background:#1a1f33;border:2px solid #39405f;border-radius:5px;padding:6px;cursor:pointer}
.fpc.t1{border-color:#4fd18b}.fpc.t2{border-color:#4f9dff}.fpc.t3{border-color:#ffc93c}.fpc.no{opacity:.45;filter:grayscale(1);cursor:not-allowed}.fpc canvas{width:64px;height:64px;image-rendering:pixelated}
@media (max-width:640px){.fgrid{grid-template-columns:1fr}.vs{font-size:26px;text-align:center}.fgo{min-width:0;width:100%}.dollslots{grid-template-columns:repeat(2,minmax(0,1fr));min-width:0}}
.rktabs{flex-wrap:wrap}.rkctl{gap:8px;align-items:center;margin:6px 0}.seg{display:inline-flex;gap:0}.seg .q.on,.rkctl .q.on{background:#3ddc84;color:#0b0f1a}.board td.num{text-align:right;white-space:nowrap}

#fOldRow{display:none!important}

/* community feed amounts: clearly separate buttons (2026-10-16) */
.camtseg{display:inline-flex;gap:6px;align-items:center}.camtunit{margin:0 8px 0 4px}
/* build 2 (2026-10-16): keep star + discarded cards */
.keepbtn{background:none;border:0;padding:0 3px 0 0;margin:0;min-width:0;cursor:pointer;color:#ffd84a;font-size:14px;line-height:1;vertical-align:baseline}
.hiddenbox .dctl{flex-wrap:wrap;gap:6px;align-items:center}.hiddenbox .dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-top:8px}
.hiddenbox .dcard{position:relative;border:2px solid #000;border-radius:6px;padding:6px;background:rgba(0,0,0,.25);text-align:center}.hiddenbox .dcard canvas{width:64px;height:64px;image-rendering:pixelated;display:block;margin:2px auto}
.hiddenbox .dcard .dcb{position:absolute;left:4px;top:4px}.hiddenbox .dcard .chips{justify-content:center;margin:4px 0}

#selMode.on{background:#2a3a2e;color:#fff;border-color:var(--acc2)}body.selmode .pet.card:not(.dead){outline:1px dashed var(--acc2);outline-offset:-2px}
#breedPanel .bgrid .pet.card>*,#breedPanel .bpick>*,#fPending .txrow,#bReqs>div,.bsum>div{min-width:0;overflow-wrap:anywhere}#breedPanel .bgrid .pet.card{min-width:0;overflow:hidden}#breedPanel .pill.tier,#fPending .pill.tier,.bsum .pill.tier{white-space:nowrap}.bsum{margin:0 0 8px}
#bReqs>div.flash{outline:3px solid #ffc93c;animation:uxblink .4s steps(2) 4}
#community .sharedwrap.cstats{display:block;margin-top:6px}#community .cstats .stats div{min-width:0;overflow-wrap:anywhere}
#fPending .txrow.flash{outline:3px solid #ffc93c;animation:uxblink .4s steps(2) 4}
#inReqBox .box{max-height:92vh;overflow:auto}.irqcmp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.irqcol{min-width:0;overflow-wrap:anywhere;border:2px solid #000;border-radius:8px;padding:6px}.irqcol canvas{width:48px;height:48px;image-rendering:pixelated}.irqst td{padding:0 6px 0 0}#inReqBox .box p,#inReqBox .box div{overflow-wrap:anywhere}
/* Home cast row (homepage-cast, 2026-10-19): Common, Uncommon, Rare, Legendary, Mythic + ONE Hybrids link card, all the same size.
   6 across on desktop, 3 x 2 on phones; minmax(0,1fr) + ellipsis so long labels can never push the row sideways. */
#castTiers.casttiers{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:8px 0 14px}
#castTiers.casttiers>button,#castTiers.casttiers>a{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;width:100%;height:62px;margin:0;padding:6px 4px;border:1px solid var(--line);border-radius:12px;background:#18221b;color:var(--ink);font:inherit;font-size:13px;line-height:1.2;text-align:center;text-decoration:none;cursor:pointer;overflow:hidden}
#castTiers.casttiers>a:hover,#castTiers.casttiers>button:hover{border-color:var(--green,#3ddc84)}
#castTiers.casttiers>a:focus-visible,#castTiers.casttiers>button:focus-visible{outline:2px solid var(--green,#3ddc84);outline-offset:2px}
#castTiers.casttiers .ct-l{display:flex;align-items:center;justify-content:center;gap:4px;max-width:100%;font-weight:bold;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#castTiers.casttiers .ct-s{max-width:100%;font-size:11px;opacity:.8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#castTiers.casttiers .ct-ico{width:18px;height:18px;flex:none;image-rendering:pixelated}
@media (max-width:640px){#castTiers.casttiers{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}#castTiers.casttiers>button,#castTiers.casttiers>a{font-size:12px}}
/* Mythic tab: every species at Mythic in a wrapping grid of equal cards */
.mythgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin:4px 0 10px}
.mythcard{min-width:0;text-align:center;padding:8px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(0,0,0,.18)}
.mythcard canvas{display:block;width:100%;max-width:112px;margin:0 auto 6px;aspect-ratio:1;image-rendering:pixelated;border-radius:8px;border:1px solid rgba(255,255,255,.08);background:#16121f}
.mythcard h3.ch{margin:0 0 2px;font-size:1em;overflow-wrap:anywhere}
@media (max-width:640px){.mythgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.mythcard{padding:6px 4px}}
/* Hybrids browser (hybrids.html): one fixed card per mix, wrapping grid, no sideways overflow */
.hybgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(230px,100%),1fr));gap:10px;margin:10px 0 16px}
.hybitem{min-width:0;padding:10px;border:1px solid var(--line);border-radius:12px;background:rgba(0,0,0,.18)}
.hybitem h3.ch{margin:0 0 2px;font-size:1em;overflow-wrap:anywhere}
.hybitem p{margin:0 0 8px;overflow-wrap:anywhere}
.hybbodies{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.hybbodies figure{margin:0;min-width:0;text-align:center}
.hybbodies canvas{display:block;width:100%;aspect-ratio:1;image-rendering:pixelated;border-radius:8px;border:1px solid rgba(255,255,255,.08);background:#16121f}
.hybbodies figcaption{margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hybstages{margin:8px 0 4px}
@media (max-width:640px){.hybgrid{gap:8px}.hybitem{padding:8px}}
/* cast stage strips: equal columns even on 360px phones (a long "Hatchling" label used to widen its column) */
.strip6{grid-template-columns:repeat(6,minmax(0,1fr))}.strip6>div{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:400px){.strip6>div{font-size:10px;letter-spacing:-.2px}}
.mythcard h3.ch,.hybitem h3.ch{font-family:inherit;color:inherit;letter-spacing:normal;line-height:1.25;font-weight:bold}
/* pet total near the hatch buttons (2026-10-19) */
.pettotal{margin:6px 6px 2px;line-height:1.4;overflow-wrap:anywhere}.pettotal b{color:#fff;font-variant-numeric:tabular-nums;border-radius:4px;padding:0 2px;transition:background-color .6s,color .6s}
.pettotal.bump b{background:#3ddc8433;color:#3ddc84}
@media (prefers-reduced-motion:reduce){.pettotal b{transition:none}}
/* gear-roll-flow (2026-10-19): gear results popup fits the window (content scrolls inside, buttons always reachable), wrapping card grid,
 * dark scrollbars, one batch caption, neutral info box; My Pets card footer (Release / Open / Discard never overlap); Unequip all */
#packBox.reveal{padding:12px}
#packBox .box{display:flex;flex-direction:column;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overflow:hidden;padding:16px}
#packBox .box>h2,#packBox .box>#packSummary,#packBox .box>.row,#packBox .box>p{flex:0 0 auto}
#packBox .packgrid{flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;overflow-x:hidden;padding:4px}
#packBox.gearmode #packSummary{max-height:38vh;overflow-y:auto}
#packBox.gearmode .packgrid{grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px}
#packBox.gearmode .packgrid .egg{min-width:0;overflow:hidden;overflow-wrap:anywhere;font-size:11px;padding:6px 4px}
#packBox.gearmode .gwname{line-height:1.25}#packBox.gearmode .gwwhere{margin-top:3px;color:#c8f7d8}
#packBox .packgrid,#packBox #packSummary,.reveal .box{scrollbar-width:thin;scrollbar-color:#3ddc84 #0a0f0b}
#packBox .packgrid::-webkit-scrollbar,#packBox #packSummary::-webkit-scrollbar,.reveal .box::-webkit-scrollbar{width:10px;height:10px}
#packBox .packgrid::-webkit-scrollbar-track,#packBox #packSummary::-webkit-scrollbar-track,.reveal .box::-webkit-scrollbar-track{background:#0a0f0b;border-radius:6px}
#packBox .packgrid::-webkit-scrollbar-thumb,#packBox #packSummary::-webkit-scrollbar-thumb,.reveal .box::-webkit-scrollbar-thumb{background:#2a3a2e;border:2px solid #0a0f0b;border-radius:6px}
#packBox .packgrid::-webkit-scrollbar-thumb:hover,.reveal .box::-webkit-scrollbar-thumb:hover{background:#3ddc84}
.grinfo{text-align:left;background:#1d3a24;border:2px solid #3ddc84;border-radius:8px;padding:8px 10px;margin:4px 0 8px;color:var(--ink)}
.grinfo p{margin:2px 0}.grinfo .grnext{color:var(--acc2);font-weight:700}
.grcap{font-family:var(--meme);font-synthesis:style;font-size:20px;letter-spacing:1px;color:var(--acc2);text-shadow:2px 2px 0 #000;margin:2px 0 6px;line-height:1.1;max-width:100%;overflow-wrap:anywhere;text-transform:uppercase}
.grtiers{display:block;margin:2px 0}
.grhelp{margin:4px 0 0}.grpending{margin:4px 0 0;border:2px dashed #ffc93c;border-radius:6px;padding:4px 8px;color:#ffe39a}
.grwhat{margin:6px 0 2px}
body #pets .pet.card{padding-bottom:44px}
#pets .pet.card .openbtn,#pets .pet.card .pet-discard,#pets .pet.card .pet-release{position:absolute;bottom:8px;height:28px;min-height:28px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;line-height:1;margin:0}
#pets .pet.card .pet-discard{right:8px;width:34px;padding:0;font-size:14px;opacity:.85}
#pets .pet.card .openbtn{right:50px;padding:0 10px;font-size:12px;box-shadow:2px 2px 0 #000}
#pets .pet.card .pet-release{left:8px;right:auto;padding:0 8px;font-size:11px;max-width:calc(100% - 150px);white-space:nowrap;overflow:hidden}
@media (max-width:600px){body #pets .pet.card{padding-bottom:56px}#pets .pet.card .openbtn,#pets .pet.card .pet-discard,#pets .pet.card .pet-release{height:40px;min-height:40px}#pets .pet.card .pet-discard{width:44px}#pets .pet.card .openbtn{right:60px}#packBox.gearmode .packgrid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}#packBox .box{padding:12px}}
.gp-offall{margin:6px 0 2px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
@media (max-width:600px){.tb-bal{min-width:0;max-width:100%}#me{word-break:break-all;overflow-wrap:anywhere}a.rulesLink{overflow-wrap:anywhere}}
.aetog{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px}.aetog [data-aetog]{min-width:54px}.aetog [data-aetog].on{background:#1d3a24;border-color:#000;color:#c8f7d8;box-shadow:inset 0 0 0 2px var(--acc2)}
.aerow{margin:4px 0 8px}.graemode{margin-top:6px!important;border-top:1px dashed #2a3a2e;padding-top:6px}