*{box-sizing:border-box}html,body{margin:0;background:#1e1e1e;color:#e0e0e0;font-family:sans-serif}button,input{font:inherit}button,.topbar a,.page-header a{min-height:44px;border:1px solid #555;border-radius:6px;background:#252525;color:#e0e0e0;padding:8px 14px;cursor:pointer;text-decoration:none}button.success{background:#2a7a4f;border-color:#2a7a4f}button:disabled{opacity:.5}.topbar,.controls,.pills{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.topbar{padding:12px 16px;border-bottom:1px solid #333}.topbar a.on{background:#6366f1;border-color:#6366f1}.page{padding:16px}.page-header h1{display:flex;gap:12px;flex-wrap:wrap;align-items:center;font-size:1.35rem}.page-header p,.meta,.count,.empty{color:#888}.canvas-wrap{max-width:400px}canvas{display:block;width:100%;max-width:400px;background:#2d2d2d;border:2px solid #404040;border-radius:8px;touch-action:none}.controls{margin-top:12px}.controls input,.search,.login input{background:#252525;color:#e0e0e0;border:1px solid #555;border-radius:6px;padding:8px 10px;min-height:44px}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}.card,.ing-card{border:1px solid #404040;border-radius:8px;padding:8px;background:#252525}.card.discovered,.ing-card.discovered{border-color:#2a7a4f}.card h2,.ing-card h2{font-size:12px;margin:6px 0 2px}.card p,.ing-card p{font-size:11px;margin:0 0 4px}.card canvas{width:90px;height:90px}.pill{border-radius:20px;padding:4px 11px;min-height:32px}.pill.on{background:#6366f1;border-color:#6366f1}.search{margin-left:auto}.result{margin-top:16px;padding:12px;border-radius:6px;background:#252525}.success-box{border-left:3px solid #2a7a4f}.miss-box{border-left:3px solid #a0522d}.result-name{font-size:1.3rem;font-weight:700}.error{color:#f0a0a0}.login{min-height:100vh;display:grid;place-items:center;padding:24px}.login form{width:min(360px,100%);display:grid;gap:12px}.login label{display:grid;gap:6px}.ing-grid{display:flex;flex-wrap:wrap;gap:8px}.ing-card{width:180px}.ing-card img,.placeholder{width:100%;height:220px;object-fit:contain;background:#2d2d2d;border-radius:5px}.placeholder{display:grid;place-items:center;color:#555}.cat-header{width:100%;margin:12px 0 4px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid #333}