/* Basic responsive layout and accessible defaults */
:root { --primary:#1a73e8; --bg:#fff; --text:#222; --muted:#666; --card:#f7f7f8; --danger:#c62828; --success:#2e7d32; }
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--primary);text-decoration:none}
header{position:sticky;top:0;background:#fff;border-bottom:1px solid #eee;z-index:10}
.nav{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 16px}
.nav a.logo{font-weight:700;color:var(--text)}
.nav .links{display:flex;gap:12px;flex-wrap:wrap}
.container{max-width:1100px;margin:0 auto;padding:16px}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.card{background:var(--card);border:1px solid #e9e9eb;border-radius:10px;overflow:hidden}
.card .content{padding:12px}
.btn{background:var(--primary);color:#fff;border:none;border-radius:8px;padding:10px 14px;cursor:pointer}
.btn.secondary{background:#eee;color:#222}
.btn.danger{background:var(--danger)}
.btn.success{background:var(--success)}
input,select,textarea{width:100%;padding:10px;border:1px solid #ddd;border-radius:8px}
label{font-weight:600;margin-bottom:6px;display:block}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.footer{padding:18px;border-top:1px solid #eee;color:var(--muted);text-align:center}
.meal-card img{width:100%;height:180px;object-fit:cover}
.meal-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:14px}
.badge{display:inline-block;padding:4px 8px;background:#eee;border-radius:999px;font-size:12px;color:#333}
@media (max-width: 768px){ .form-row{grid-template-columns:1fr} .grid{grid-template-columns:repeat(6,1fr)} }