:root{--brand:#16a34a;--brand-d:#0f7a37;--bg:#eef5f0;--ink:#1f2937;--muted:#6b7280;--card:#fff;--line:#e5e7eb;--ok-bg:#ecfdf3;--bad-bg:#fef2f2;--shadow:0 4px 18px rgba(16,94,50,.08)}
[data-theme=dark]{--bg:#0f1a14;--ink:#e5efe8;--muted:#93a39a;--card:#16241c;--line:#243830;--ok-bg:#12301f;--bad-bg:#3a1719;--shadow:0 4px 18px rgba(0,0,0,.35)}
[data-theme=dark] .form-control,[data-theme=dark] .form-select,[data-theme=dark] .modal-content{background:var(--card);color:var(--ink);border-color:var(--line)}
[data-theme=dark] .table{--bs-table-color:var(--ink);--bs-table-bg:transparent;border-color:var(--line)}
body{background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;padding-bottom:84px}
@media(min-width:768px){body{padding-bottom:0}}
.text-muted{color:var(--muted)!important}
.btn-brand{background:linear-gradient(135deg,var(--brand),var(--brand-d));color:#fff;border:0;border-radius:12px;padding:.65rem 1rem;font-weight:600}
.btn-brand:hover{color:#fff;filter:brightness(1.08)}
.topbar{background:linear-gradient(135deg,#16a34a,#0f7a37);color:#fff;padding:.7rem 0;position:sticky;top:0;z-index:40;box-shadow:0 2px 12px rgba(0,0,0,.2)}
.brand{color:#fff;font-weight:800;font-size:1.25rem;text-decoration:none;letter-spacing:-.3px}
.navlink{color:#e8fff0;text-decoration:none;padding:.45rem .95rem;border-radius:10px;transition:.15s}
.navlink:hover,.navlink.active{background:rgba(255,255,255,.22);color:#fff}
.bottomnav{position:fixed;bottom:0;left:0;right:0;background:var(--card);display:flex;justify-content:space-around;padding:.45rem 0 calc(.45rem + env(safe-area-inset-bottom));box-shadow:0 -4px 16px rgba(0,0,0,.12);z-index:40;border-radius:18px 18px 0 0}
.bottomnav a{display:flex;flex-direction:column;align-items:center;font-size:.72rem;color:var(--muted);text-decoration:none;flex:1}
.bottomnav a i{font-size:1.45rem}.bottomnav a.active{color:var(--brand);font-weight:700}
.cardx{background:var(--card);border-radius:18px;padding:1.15rem;box-shadow:var(--shadow);border:1px solid var(--line)}
.cardx h6{font-weight:700;margin-bottom:.9rem}
.hero{background:radial-gradient(circle at 90% 10%,rgba(255,255,255,.25),transparent 40%),linear-gradient(135deg,#16a34a,#059669 55%,#0d9488);color:#fff;border-radius:22px;padding:1.6rem;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;box-shadow:0 10px 30px rgba(5,150,105,.3)}
.hero h2{font-size:clamp(1.35rem,4vw,2rem);font-weight:800;margin:.2rem 0}
.hero-btn{border-radius:14px;font-weight:700;color:var(--brand-d)}
.ring{position:relative;width:170px;height:170px;margin:0 auto}
.ring svg{transform:rotate(-90deg);width:100%;height:100%}
.ring circle{fill:none;stroke-width:10;stroke-linecap:round}
.ring-bg{stroke:var(--line)}.ring-fg{stroke:var(--brand);transition:stroke-dashoffset 1s ease}
.ring-txt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ring-txt b{font-size:2.4rem;font-weight:800;line-height:1}.ring-txt span{font-size:.8rem;color:var(--muted)}
.stat,.tile{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;color:inherit;height:100%;gap:.15rem}
.stat i,.tile i{font-size:1.7rem}.stat b,.tile b{font-size:1.9rem;line-height:1.1}.stat span,.tile span{font-size:.78rem;color:var(--muted)}
.s-green i{color:#16a34a}.s-red i{color:#dc2626}.s-amber i{color:#f59e0b}.s-blue i{color:#3b82f6}
.tile{transition:transform .15s,box-shadow .15s}.tile:hover{transform:translateY(-3px);color:inherit}.tile i{color:var(--brand)}
.bars{display:flex;gap:.6rem;align-items:flex-end;height:150px}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;gap:.3rem}
.bar-track{flex:1;width:100%;max-width:38px;background:var(--line);border-radius:10px;display:flex;align-items:flex-end;overflow:hidden}
.bar-fill{width:100%;background:linear-gradient(180deg,#34d399,#16a34a);border-radius:10px;transition:height .8s}
.alert-item{display:flex;gap:.7rem;background:var(--bad-bg);border-radius:12px;padding:.7rem .9rem;margin-bottom:.5rem}
.alert-item i{color:#dc2626;font-size:1.2rem}
.feed{display:flex;align-items:center;gap:.7rem;padding:.55rem 0;border-bottom:1px solid var(--line)}.feed:last-child{border:0}
.dot{width:10px;height:10px;border-radius:50%;background:#16a34a}.dot.fail{background:#dc2626}
/* Daily checks */
.page-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.6rem;margin-bottom:1rem}
.page-head input{border-radius:12px}
.sticky-progress{position:sticky;top:58px;z-index:30;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:.8rem 1rem;box-shadow:var(--shadow);margin-bottom:1rem}
.progress{background:var(--line);border-radius:10px}.progress-bar{background:linear-gradient(90deg,#34d399,#16a34a);border-radius:10px;transition:width .5s}
.filters{display:flex;gap:.4rem}.chip{border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:20px;padding:.2rem .85rem;font-size:.82rem}
.chip.active{background:var(--brand);color:#fff;border-color:var(--brand)}
.done-banner{display:flex;gap:.9rem;align-items:center;background:linear-gradient(135deg,#16a34a,#0d9488);color:#fff;border-radius:16px;padding:1rem 1.2rem;margin-bottom:1rem;animation:pop .5s}
.done-banner span{font-size:2rem}
@keyframes pop{0%{transform:scale(.9);opacity:0}100%{transform:scale(1);opacity:1}}
.cat-card{background:var(--card);border-radius:20px;border:1px solid var(--line);box-shadow:var(--shadow);margin-bottom:1.2rem;overflow:hidden}
.cat-head{display:flex;align-items:center;gap:.8rem;padding:1rem 1.1rem;background:linear-gradient(135deg,color-mix(in srgb,var(--cc) 16%,transparent),transparent)}
.cat-icon{width:46px;height:46px;border-radius:14px;background:var(--cc);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.4rem;flex-shrink:0;box-shadow:0 4px 12px color-mix(in srgb,var(--cc) 45%,transparent)}
.cat-prog{height:6px;margin-top:.4rem;max-width:240px}.cat-bar{background:var(--cc)!important}
.cat-count{font-weight:700;color:var(--cc)}
.btn-all{background:var(--cc);color:#fff;border-radius:10px;font-weight:600}.btn-all:hover{color:#fff;filter:brightness(1.1)}
.check-row{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center;justify-content:space-between;padding:.9rem 1.1rem;border-top:1px solid var(--line);border-left:5px solid transparent;transition:background .25s,border-color .25s}
.check-row.pass{background:var(--ok-bg);border-left-color:#16a34a}.check-row.fail{background:var(--bad-bg);border-left-color:#dc2626}
.check-main{flex:1 1 220px;min-width:0}.check-title{font-weight:600}
.target{display:inline-block;margin-top:.2rem;font-size:.75rem;background:var(--line);border-radius:20px;padding:.1rem .6rem;color:var(--muted)}
.note-preview{margin-top:.35rem;font-size:.8rem;color:var(--muted)}
.check-actions{display:flex;align-items:center;gap:.5rem}
.big-btn{border:2px solid var(--line);background:var(--card);color:var(--muted);border-radius:14px;min-width:84px;height:52px;display:flex;align-items:center;justify-content:center;gap:.35rem;font-weight:700;transition:.15s}
.big-btn i{font-size:1.3rem}
.big-btn.pass:hover{border-color:#16a34a;color:#16a34a}.big-btn.fail:hover{border-color:#dc2626;color:#dc2626}
.big-btn.pass.on{background:#16a34a;border-color:#16a34a;color:#fff;transform:scale(1.04);box-shadow:0 4px 14px rgba(22,163,74,.4)}
.big-btn.fail.on{background:#dc2626;border-color:#dc2626;color:#fff;transform:scale(1.04);box-shadow:0 4px 14px rgba(220,38,38,.4)}
.big-btn:active{transform:scale(.94)}
.temp-wrap{display:flex;align-items:center;gap:.3rem;background:var(--card);border:2px solid var(--line);border-radius:14px;padding:0 .8rem;height:52px}
.temp-input{width:80px;border:0;outline:0;background:transparent;font-size:1.4rem;font-weight:700;text-align:right;color:var(--ink)}
.temp-wrap span{color:var(--muted);font-weight:600}
.temp-wrap:has(.ok){border-color:#16a34a}.temp-wrap:has(.bad){border-color:#dc2626}
.temp-input.ok{color:#16a34a}.temp-input.bad{color:#dc2626}
.note-btn{border:0;background:var(--line);color:var(--muted);border-radius:12px;width:44px;height:44px}.note-btn:hover{color:var(--brand)}
.pill{min-width:14px;color:var(--muted)}
#toasts{position:fixed;left:50%;transform:translateX(-50%);bottom:96px;z-index:100;display:flex;flex-direction:column;gap:.5rem;align-items:center;pointer-events:none}
@media(min-width:768px){#toasts{bottom:30px}}
.toastx{background:#16a34a;color:#fff;padding:.6rem 1.1rem;border-radius:30px;font-weight:600;box-shadow:0 6px 20px rgba(0,0,0,.25);opacity:0;transform:translateY(10px);transition:.3s;font-size:.9rem}
.toastx.bad{background:#dc2626}.toastx.show{opacity:1;transform:none}
@media(max-width:575px){.check-actions{width:100%}.big-btn{flex:1}.temp-wrap{flex:1}.temp-input{flex:1;width:auto}.cat-prog{max-width:none}}
/* Login */
.login-body{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.2),transparent 40%),linear-gradient(135deg,#16a34a,#0d9488);padding:1rem}
.login-card{background:#fff;border-radius:24px;padding:2.2rem;width:100%;max-width:400px;text-align:center;box-shadow:0 25px 60px rgba(0,0,0,.3)}
.login-card h1{font-size:1.7rem;font-weight:800;margin-bottom:.2rem;color:#1f2937}
.login-logo{width:72px;height:72px;border-radius:22px;background:linear-gradient(135deg,var(--brand),var(--brand-d));color:#fff;font-size:2.1rem;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;box-shadow:0 8px 20px rgba(22,163,74,.4)}
.login-card form{text-align:left}