:root{--ink:#1b302b;--muted:#748780;--pale:#f5f8f6;--green:#08795b;--mint:#cde9c9;--line:#e7ece8;--deep:#0b1c18;--white:#fff}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f5f7f5;color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:14px}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.4}.layout{display:flex;min-height:100vh}.side{position:fixed;top:0;bottom:0;left:0;width:235px;background:#0b1b17;color:#b6c7c0;padding:27px 17px;display:flex;flex-direction:column;z-index:5}.logo{display:flex;align-items:center;gap:10px;padding:2px 7px 44px;color:#fff;font-size:19px;letter-spacing:-.6px}.logo-mark{width:36px;height:36px;border-radius:12px;background:#bbed9c;color:#194b38;text-align:center;line-height:36px;font-size:28px}.logo small{display:block;letter-spacing:2.2px;font-size:8px;color:#718f81;margin-top:3px}.side-label{font-size:10px;letter-spacing:1.7px;color:#68887c;padding:0 12px;margin-bottom:12px}.side nav{display:flex;flex-direction:column;gap:6px}.nav-item{color:#82988c;padding:12px 13px;border-radius:9px;text-decoration:none;display:flex;align-items:center;gap:12px;font-weight:600;font-size:13px}.nav-item span{font-size:19px;width:23px;text-align:center}.nav-item:hover,.nav-item.active{background:#18362b;color:#c1f3bf}.nav-item em{font-style:normal;margin-left:auto;background:#244838;padding:2px 5px;border-radius:5px;font-size:10px}.side-bottom{margin-top:auto;border-top:1px solid #234034;padding:20px 6px 3px;font-size:10px;color:#7d9a8c;display:flex;align-items:center;gap:8px}.dot,.online-pill i,.live-pill i{width:7px;height:7px;border-radius:50%;background:#52ce8b;display:inline-block;box-shadow:0 0 0 3px #44ba7425}.layout main{margin-left:235px;min-width:0;flex:1}.topbar{height:66px;border-bottom:1px solid #e9eeea;background:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 35px}.crumb{font-size:10px;font-weight:700;letter-spacing:1.5px;color:#a1aaa4}.crumb span{margin:0 11px;color:#ccd4ce}.crumb b{color:#435a4f;letter-spacing:.3px}.top-right{display:flex;gap:20px;align-items:center;color:#8e9d94;font-size:12px}.online-pill{background:#e6f8ec;color:#197443;padding:7px 12px;border-radius:30px;display:flex;gap:8px;align-items:center;font-size:11px;font-weight:700}.content{max-width:1500px;padding:28px 35px 50px;margin:auto}.hero{min-height:200px;border-radius:15px;background:radial-gradient(ellipse at 88% 50%,#295f42 0,transparent 40%),linear-gradient(107deg,#0e3027,#0a211c);display:flex;align-items:center;justify-content:space-between;padding:32px 38px;color:white;overflow:hidden;position:relative}.eyebrow{font-size:10px;letter-spacing:2px;color:#95d8a1;font-weight:750}.hero h1{font-weight:700;letter-spacing:-1.2px;line-height:1.14;font-size:clamp(24px,2.4vw,35px);margin:12px 0}.hero h1 span{color:#bbebad}.hero p{font-size:12px;color:#a9c2b5;margin:0}.hero-icon{font-size:120px;color:#b0e89d;opacity:.75;transform:rotate(-14deg);padding:0 55px}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:19px 0 39px}.stat{padding:21px 22px;background:white;border:1px solid var(--line);border-radius:12px;min-height:154px}.stat-head{font-size:10px;letter-spacing:1.2px;font-weight:750;color:#8b9b90;display:flex;justify-content:space-between;align-items:center}.stat-head span{font-size:18px;color:#53aa76}.stat-number{font-size:36px;font-weight:700;letter-spacing:-1.5px;margin:17px 0 12px}.stat-number small{font-size:17px;color:#82948a;margin-left:4px;font-weight:450}.stat-foot{color:#9baaa0;font-size:11px}.automation{background:#e8f3e7}.auto-title{color:#12704e;font-size:29px;font-weight:700;margin:19px 0 18px}.toggle-wrap{display:flex;justify-content:space-between;align-items:center;color:#628377;font-size:11px}.switch{position:relative;display:block;width:36px;height:21px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;inset:0;background:#a6b3a8;border-radius:50px;transition:.2s}.slider:before{content:'';width:15px;height:15px;border-radius:50%;position:absolute;left:3px;top:3px;background:#fff;transition:.2s}.switch input:checked+.slider{background:#21845d}.switch input:checked+.slider:before{transform:translateX(15px)}.section-heading{display:flex;justify-content:space-between;align-items:end;margin:0 0 16px;gap:15px}.eyebrow.dark{color:#64977b}.section-heading h2{font-size:22px;letter-spacing:-.6px;margin:6px 0 0}.h2-muted{color:#a6b1a8;font-weight:400}.section-sub{font-size:12px;color:#9baba0}.live-pill{border:1px solid #c9e6d2;background:#eafaed;color:#26835a;padding:8px 11px;border-radius:25px;font-size:10px;font-weight:700;letter-spacing:.7px;display:flex;gap:8px;align-items:center}.camera-layout{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(240px,1fr);gap:14px}.camera-frame{background:#162c22;border-radius:13px;min-height:335px;overflow:hidden;position:relative;display:flex;justify-content:center;align-items:center}.camera-frame img{display:none;width:100%;height:100%;object-fit:contain;position:absolute;inset:0;transform:scale(1);transition:transform .2s ease}.camera-placeholder{color:#769b87;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}.camera-placeholder span{font-size:60px;opacity:.5}.camera-placeholder strong{color:#bdd7c5;font-size:14px}.camera-placeholder small{font-size:12px}.camera-caption{position:absolute;bottom:14px;left:18px;color:#c6e7ca;background:#0b251bd9;padding:9px 12px;border-radius:6px;font-size:9px;font-weight:700;letter-spacing:1.3px}.camera-controls{padding:24px;background:white;border:1px solid var(--line);border-radius:13px}.card-kicker{font-size:10px;letter-spacing:1.6px;color:#76a081;font-weight:750}.camera-controls h3{margin:10px 0 29px;font-size:21px;letter-spacing:-.6px}.control-label{font-size:12px;color:#546c60;font-weight:700;margin-bottom:12px}.zoom-controls,.servo-controls{display:flex;align-items:center;gap:9px}.zoom-controls>div{flex:1;text-align:center;font-size:19px;font-weight:700;color:#255840}.square-btn{width:45px;height:38px;border-radius:9px;border:1px solid #d9e3dc;background:#f5f9f5;font-size:20px;color:#2d5f4b}.square-btn:hover:not(:disabled){background:#daefdb;border-color:#b6d9bf}.square-btn.middle{flex:1}.servo-controls>.square-btn{flex:1}.text-btn{font-size:11px;color:#168051;border:0;background:transparent;padding:12px 0;text-align:left}.camera-controls hr{border:0;border-top:1px solid #eef2ee;margin:18px 0 22px}.mini-note{font-size:11px;color:#8e9f94;line-height:1.5}.plant-section,.history-section,.calibration-section{margin-top:40px}.plant-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.plant-card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:19px 17px 16px;min-width:0}.plant-top{display:flex;align-items:center;justify-content:space-between}.plant-icon{background:#ecf7e8;color:#46845b;width:34px;height:34px;border-radius:10px;text-align:center;line-height:34px;font-size:19px}.plant-index{font-size:10px;color:#a4b5aa;letter-spacing:1px}.plant-card h3{margin:13px 0 4px;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-row{display:flex;gap:8px;align-items:center;font-size:11px;color:#879a8c;margin-bottom:20px;min-height:16px}.status-dot{width:7px;height:7px;border-radius:50%;background:#44ac71}.status-dot.dry{background:#f1ab4a}.status-dot.bad{background:#dd6c6c}.moisture-label{display:flex;justify-content:space-between;color:#839a8b;font-size:10px;font-weight:650}.moisture-label b{font-size:17px;color:#275b41}.progress{height:7px;background:#e8efe8;border-radius:9px;margin:9px 0 14px;overflow:hidden}.progress div{height:100%;background:#45ae73;border-radius:9px;transition:width .2s}.plant-card.dry .progress div{background:#e6a441}.plant-meta{display:flex;justify-content:space-between;gap:4px;border-top:1px solid #eef2ee;padding:11px 0;color:#8b9e91;font-size:10px}.plant-meta strong{color:#396d4c}.water-btn{width:100%;border:0;border-radius:8px;padding:11px 8px;font-size:12px;font-weight:750;background:#1a7957;color:#fff}.water-btn:hover{background:#0e5c3b}.water-btn:disabled{background:#aabdb0}.water-sub{font-size:10px;color:#a2aea5;text-align:center;margin-top:9px}.history-card{background:#fff;border:1px solid var(--line);border-radius:13px;overflow:auto}.history-card table{width:100%;border-collapse:collapse;text-align:left}.history-card th{background:#f9fbf9;font-size:10px;color:#8ca095;letter-spacing:1.1px;padding:16px 20px}.history-card td{border-top:1px solid #edf0ed;padding:13px 20px;font-size:12px;color:#5a7364}.link-button{border:0;background:transparent;color:#16835e;font-weight:700;font-size:12px}.calibration-box{display:flex;gap:16px;background:#eef5ed;border:1px solid #dceadb;padding:23px;border-radius:13px}.alert-icon{background:#cfe6cd;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#27764e;font-weight:800;flex-shrink:0}.calibration-box strong{font-size:13px}.calibration-box p{font-size:12px;color:#6d8676;line-height:1.65;max-width:870px}.calibration-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:16px}.calib-item{background:#fff;border:1px solid #dce7dc;padding:12px;border-radius:9px}.calib-head{display:flex;justify-content:space-between;font-size:12px;margin-bottom:10px}.calib-head small{color:#879d8c}.calib-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.calib-actions button{font-size:11px;background:#f2f8f3;border:1px solid #d2e7d7;color:#276348;padding:7px 10px;border-radius:7px;font-weight:650}.calib-actions input{width:53px;padding:6px;border-radius:6px;border:1px solid #d2e7d7}.calib-actions label{font-size:11px;color:#647f6d}footer{margin-top:37px;color:#9aaba0;font-size:11px}footer span{margin:0 9px}.error-banner{border:1px solid #f4d4bf;background:#fff2e8;color:#8f4c29;padding:13px 16px;border-radius:10px;margin:16px 0;line-height:1.55}.toast{position:fixed;bottom:25px;right:25px;background:#1e4e3b;color:#fff;padding:12px 17px;border-radius:10px;box-shadow:0 10px 40px #0003;opacity:0;pointer-events:none;transform:translateY(12px);transition:.2s;z-index:30;max-width:360px}.toast.visible{opacity:1;transform:translateY(0)}.toast.error{background:#9d403a}.loading{padding:30px;color:#80988b}
@media(max-width:1300px){.side{width:194px}.layout main{margin-left:194px}.plant-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-icon{padding:0 20px}}
@media(max-width:990px){.side{display:none}.layout main{margin-left:0}.content{padding:20px}.topbar{padding:0 20px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.camera-layout{grid-template-columns:1fr}.camera-frame{min-height:320px}}
@media(max-width:600px){.hero{padding:26px 22px;min-height:170px}.hero-icon{display:none}.stats{gap:9px}.stat{padding:16px 13px;min-height:130px}.stat-number{font-size:29px}.stat-head{font-size:9px}.stat-foot,.toggle-wrap{font-size:10px}.auto-title{font-size:22px}.plant-grid{grid-template-columns:1fr}.calibration-grid{grid-template-columns:1fr}.top-right{gap:9px}.crumb{font-size:9px}.content{padding:13px}.section-sub{display:none}.camera-frame{min-height:240px}.history-card th,.history-card td{padding:11px 9px;font-size:10px}}

/* Plant Management — responsive inline editing; reuses the dashboard design. */
.management-section{margin-top:40px;scroll-margin-top:15px}
.manager-card{background:#fff;border:1px solid var(--line);border-radius:13px;overflow:hidden}
.manager-intro{padding:22px 24px 15px;border-bottom:1px solid #e7ece8}
.manager-intro strong,.manager-add strong{font-size:14px;color:#244834}
.manager-intro p,.manager-add p{font-size:12px;color:#70887a;line-height:1.6;margin:7px 0 0}
.manager-list{padding:4px 22px}
.manager-row{display:grid;grid-template-columns:minmax(180px,1fr) minmax(170px,1fr) auto;gap:14px;align-items:end;padding:17px 0;border-bottom:1px solid #edf2ee}
.manager-row:last-child{border-bottom:0}
.manager-row label,.manager-form label{display:flex;flex-direction:column;gap:7px;font-size:11px;color:#688476;font-weight:700}
.manager-row input,.manager-form input,.manager-form select{width:100%;min-height:39px;background:#fff;border:1px solid #d1e0d5;border-radius:8px;padding:9px 11px;color:#244834;font-size:12px}
.manager-row input:focus,.manager-form input:focus,.manager-form select:focus{outline:2px solid #8bcfac;outline-offset:1px}
.manager-channel{color:#6a8675;font-size:11px;line-height:1.7;padding:5px 0}
.manager-channel strong{color:#26583d}
.manager-actions{display:flex;gap:7px;align-items:center}
.manager-actions button,.manager-primary{border:1px solid #cfe0d1;border-radius:8px;padding:10px 13px;background:#eaf5eb;color:#21613f;font-weight:700;font-size:11px;white-space:nowrap}
.manager-actions button:hover:not(:disabled),.manager-primary:hover:not(:disabled){background:#d3ebd9}
.manager-actions button.danger{background:#fff4f2;border-color:#efd4ce;color:#b05243}
.manager-add{background:#f8fbf8;border-top:1px solid #e5eee7;padding:20px 24px}
.manager-form{display:grid;grid-template-columns: minmax(120px,1.5fr) minmax(120px,1fr) minmax(120px,1fr) auto;gap:12px;align-items:end;margin-top:16px}
.manager-primary{background:#197a54;color:#fff;border:0;min-height:39px}
.manager-primary:hover:not(:disabled){background:#0e5c3b}
.manager-help{font-size:11px!important;margin-top:12px!important}
@media(max-width:1100px){.manager-row{grid-template-columns:1fr 1fr}.manager-actions{grid-column:1/-1}.manager-form{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.manager-row,.manager-form{grid-template-columns:1fr}.manager-actions{grid-column:auto}.manager-intro,.manager-add{padding:18px 15px}.manager-list{padding:4px 15px}}