:root{--paper:#e6eadc;--card:#f1f3ea;--ink:#1f2a1c;--muted:#5b6656;--rule:#c8cfba;--orange:#d9692a;--lcd:#b8c4a0;--lcd-ink:#1f2a1c;--bezel:#2b3327;--shell:#e3dcc8;--display:"Silkscreen", "DM Mono", ui-monospace, monospace;--body:"Atkinson Hyperlegible", system-ui, -apple-system, "Segoe UI", sans-serif;--mono:"DM Mono", ui-monospace, Menlo, monospace}@media (prefers-color-scheme:dark){:root{--paper:#151b13;--card:#1c2419;--ink:#dce4cf;--muted:#9aa68f;--rule:#2f3a2b;--orange:#f08a4b;--bezel:#0d110c;--shell:#cfc7b1;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--paper);color:var(--ink);font:16px/1.5 var(--body)}a{color:inherit;-webkit-text-decoration-color:var(--orange);text-decoration-color:var(--orange);text-underline-offset:3px}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--orange);outline-offset:2px}canvas{image-rendering:pixelated;max-width:100%;display:block}.page{justify-items:center;gap:18px;max-width:760px;margin:0 auto;padding-block:18px 60px;padding-inline:16px;display:grid}.topbar{width:100%;font-family:var(--mono);color:var(--muted);flex-wrap:wrap;align-items:baseline;gap:4px 14px;font-size:13px;display:flex}.topbar>*{white-space:nowrap}.topbar .name{font-family:var(--display);color:var(--ink);letter-spacing:.03em;font-size:15px}.topbar .grow{flex:1}.topbar form{margin:0}.topbar button{color:var(--muted);cursor:pointer;text-decoration:underline;-webkit-text-decoration-color:var(--rule);text-decoration-color:var(--rule);background:0 0;border:0;padding:0}.shell{background:var(--shell);border-radius:20px;justify-items:center;gap:14px;max-width:100%;padding:22px 26px 30px;display:grid;position:relative;box-shadow:inset 0 -6px #0000000f,0 1px 2px #0000001f}.shell .brand{font-family:var(--display);letter-spacing:.2em;color:#0006;justify-self:start;margin-top:-4px;font-size:12px}.screen{background:var(--bezel);border-radius:10px;max-width:100%;padding:14px}.screen canvas{cursor:pointer;touch-action:none;outline-offset:4px;border-radius:3px}.controls{justify-content:space-between;align-items:center;gap:24px;width:100%;padding-inline:6px 14px;display:flex}.dpad{grid-template-rows:repeat(3,30px);grid-template-columns:repeat(3,30px);display:grid}.dpad>*{touch-action:none;-webkit-tap-highlight-color:transparent;background:#2e322b;border:0;padding:0;display:block;position:relative}.dpad button{cursor:pointer}.dpad>:after{content:"";border:5px solid #0000;width:0;height:0;margin:auto;position:absolute;inset:0}.dpad .up{border-radius:5px 5px 0 0;grid-area:1/2}.dpad .up:after{border-bottom-color:#5a6056;top:-8px}.dpad .down{border-radius:0 0 5px 5px;grid-area:3/2}.dpad .down:after{border-top-color:#5a6056;top:8px}.dpad .left{border-radius:5px 0 0 5px;grid-area:2/1}.dpad .left:after{border-right-color:#5a6056;left:-8px}.dpad .right{border-radius:0 5px 5px 0;grid-area:2/3}.dpad .right:after{border-left-color:#5a6056;left:8px}.dpad .hub{grid-area:2/2}.dpad .hub:after{background:#3a3f37;border:0;border-radius:50%;width:12px;height:12px}.dpad button:active,.dpad button.pressed{background:#1c1f1a}.ab{grid-template-columns:auto auto;gap:12px;display:grid;transform:rotate(-25deg)}.ab>div{justify-items:center;gap:4px;display:grid}.ab .a{margin-top:-18px}.ab button,.ab .btn{cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent;background:#8a2f4e;border:0;border-radius:50%;width:36px;height:36px;display:block;box-shadow:inset 0 -4px #00000040}.ab .a button,.ab .a .btn{background:var(--orange)}.ab button:active,.ab button.pressed{transform:translateY(1px);box-shadow:inset 0 2px #0000004d}.ab span:last-child{font-family:var(--display);letter-spacing:.1em;color:#00000080;font-size:11px}.typing{background:var(--lcd);border-radius:10px;width:100%;max-width:520px;padding:10px}.typing[hidden]{display:none}.typing textarea{border:2px solid var(--lcd-ink);width:100%;color:var(--lcd-ink);font-family:var(--mono);background:#cbd5b6;border-radius:6px;padding:7px 8px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=480px){.page{padding-inline:8px}.shell{border-radius:16px;padding:14px 10px 22px}.screen{border-radius:8px;padding:8px}.dpad{grid-template-rows:repeat(3,38px);grid-template-columns:repeat(3,38px)}.ab button{width:44px;height:44px}.controls{padding-inline:4px 12px}}.form-card{background:var(--card);border:1px solid var(--rule);border-radius:12px;gap:16px;width:100%;max-width:520px;padding:22px;display:grid}.form-card h1{font-family:var(--display);margin:0;font-size:24px;font-weight:400}.form-card label{gap:6px;font-size:15px;font-weight:700;display:grid}.form-card label span{color:var(--muted);font-size:14px;font-weight:400}.form-card input,.form-card select{background:var(--paper);border:1px solid var(--rule);border-radius:8px;padding:9px 10px;font-weight:400}.breeds{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;display:grid}.breed{background:var(--lcd);color:var(--lcd-ink);cursor:pointer;border-radius:8px;justify-items:center;gap:6px;padding:10px;font-size:14px;display:grid;font-weight:400!important}.breed:has(input:checked){box-shadow:0 0 0 3px var(--orange)}.breed input{opacity:0;position:absolute}.primary{font-family:var(--display);letter-spacing:.05em;background:var(--ink);color:var(--paper);cursor:pointer;border:0;border-radius:8px;padding:12px 16px;font-size:14px}.errors{color:#a3341a;font-size:14px}.welcome h1{font-family:var(--display);text-align:center;text-wrap:balance;margin:0;font-size:clamp(26px,6vw,40px);font-weight:400;line-height:1.15}.welcome p{text-align:center;max-width:46ch;color:var(--muted);margin:0 auto}.place,.foods{gap:6px;display:grid}.place>label,.foods>label{gap:6px;font-size:15px;font-weight:700;display:grid}.place>label span,.foods>label span{color:var(--muted);font-size:14px;font-weight:400}.combo{position:relative}.combo input{background:var(--paper);border:1px solid var(--rule);border-radius:8px;width:100%;padding:9px 10px;font-weight:400}.suggest{z-index:5;background:var(--card);border:1px solid var(--rule);border-radius:8px;max-height:320px;margin:0;padding:4px;list-style:none;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;box-shadow:0 6px 18px #0000001f}.suggest[hidden]{display:none}.suggest li{cursor:pointer;border-radius:6px;gap:1px;padding:8px 10px;display:grid}.suggest li[aria-selected=true],.suggest li:hover{background:var(--lcd);color:var(--lcd-ink)}.suggest li small{color:var(--muted);font-size:13px}.suggest li .tag{font-family:var(--mono);color:var(--orange);font-size:11px}.suggest .empty{color:var(--muted);cursor:default}.chosen{font-family:var(--mono);color:var(--ink);margin:0;font-size:13px}.chosen:before{content:"✓ ";color:var(--orange)}.known{color:var(--muted);margin:0;font-size:14px}.food-inputs{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.food-inputs input{background:var(--paper);border:1px solid var(--rule);border-radius:8px;width:100%;min-width:0;padding:9px 10px;font-weight:400}.credit{color:var(--muted);margin:0;font-size:12px}@media (width<=480px){.food-inputs{grid-template-columns:1fr}}.notice{color:var(--ink);margin:0;font-size:15px}.reset-list{color:var(--muted);gap:4px;margin:0;padding-left:20px;font-size:15px;display:grid}.danger{font-family:var(--display);letter-spacing:.05em;color:#fff6ee;cursor:pointer;background:#a3341a;border:0;border-radius:8px;padding:12px 16px;font-size:14px}.form-actions{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.topbar a{color:var(--muted);-webkit-text-decoration-color:var(--rule);text-decoration-color:var(--rule)}
