*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:18px;
     background:#f4f7f4;color:#16261a;padding-bottom:86px}
header{background:#1f5f2f;color:#fff;padding:14px 16px;position:sticky;top:0;z-index:20}
header h1{margin:0;font-size:19px;font-weight:700}
header .sana{font-size:14px;opacity:.85;margin-top:2px}
.banner{padding:12px 16px;font-size:15px;font-weight:600}
.banner.off{background:#fff3cd;color:#7a5b00;border-bottom:2px solid #e0c341}
.banner.sync{background:#e3f1e6;color:#1f5f2f}
main{padding:12px}
.card{background:#fff;border-radius:14px;padding:14px;margin-bottom:12px;box-shadow:0 1px 3px rgba(0,0,0,.09)}
.card.done{background:#e9f6ec;border:2px solid #4d9160}
.card h2{margin:0 0 4px;font-size:20px;font-weight:700}
.meta{font-size:15px;color:#4a5d4a;margin-bottom:8px}
.big{font-size:30px;font-weight:800;color:#1f5f2f}
.ing{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.ing span{background:#f0f5f0;border-radius:8px;padding:6px 10px;font-size:16px}
button{width:100%;min-height:58px;border:0;border-radius:12px;font-size:19px;font-weight:700;
       background:#1f5f2f;color:#fff;margin-top:8px}
button.grey{background:#e5eae5;color:#2c3a2c}
button.red{background:#c0562f}
button:active{opacity:.75}
.row2{display:flex;gap:8px}.row2 button{flex:1}
.row3{display:flex;gap:6px}.row3 button{flex:1;font-size:16px;min-height:52px}
nav{position:fixed;bottom:0;left:0;right:0;display:flex;background:#fff;border-top:1px solid #dbe4db;z-index:30}
nav button{flex:1;background:none;color:#5a6d5a;font-size:13px;font-weight:600;min-height:66px;
           border-radius:0;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
nav button .ic{font-size:23px}
nav button.on{color:#1f5f2f;background:#eaf4ec}
input{width:100%;min-height:56px;font-size:22px;border:2px solid #cfe0cf;border-radius:12px;padding:0 12px;text-align:center}
.search{min-height:50px;font-size:17px;text-align:left;margin-bottom:10px}
.mal{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid #eef2ee}
.mal.kam{color:#c0562f;font-weight:700}
.tag{background:#1f5f2f;color:#fff;font-size:12px;padding:3px 8px;border-radius:6px;margin-left:6px}
.tag.b{background:#c07a2f}
.muddat{font-size:14px;color:#7a6a2f}
.muddat.ogoh{color:#c0562f;font-weight:700}
.login{padding:40px 20px;text-align:center}
.login h1{color:#1f5f2f}
.hidden{display:none}