@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap";html,body,#root{width:100%;min-height:100vh;margin:0;padding:0}body{overflow-x:hidden}#root{text-align:left}button,input,select{font:inherit}.dashboard-shell{color:#102018;width:min(100% - 44px,1560px);margin:0 auto;padding:112px 0 58px}.dashboard-shell *{box-sizing:border-box}.dashboard-hero{background:radial-gradient(circle at 88% 12%,#86efac61,#0000 34%),linear-gradient(135deg,#064e3b 0%,#15803d 55%,#22c55e 100%);border-radius:30px;justify-content:space-between;align-items:stretch;gap:26px;padding:34px;display:flex;position:relative;overflow:hidden;box-shadow:0 22px 42px #15803d33}.dashboard-hero:after{content:"";border:1px solid #ffffff26;border-radius:50%;width:280px;height:280px;position:absolute;bottom:-95px;right:-65px}.dashboard-hero-content{z-index:1;max-width:850px;position:relative}.dashboard-eyebrow{color:#fff;letter-spacing:.3px;background:#ffffff1f;border:1px solid #ffffff38;border-radius:999px;align-items:center;gap:7px;padding:8px 11px;font-size:11px;font-weight:900;display:inline-flex}.dashboard-hero h1{color:#fff;letter-spacing:-1.5px;margin:15px 0 10px;font-size:clamp(34px,4.5vw,57px);line-height:1.02}.dashboard-hero-content>p{color:#ffffffde;max-width:760px;margin:0;font-size:15px;line-height:1.75}.dashboard-tech-list{flex-wrap:wrap;gap:9px;margin-top:21px;display:flex}.dashboard-tech-list span{color:#fff;background:#ffffff1c;border:1px solid #fff3;border-radius:999px;align-items:center;gap:7px;padding:8px 11px;font-size:11px;font-weight:800;display:inline-flex}.dashboard-live-panel{z-index:1;color:#fff;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffff24;border:1px solid #ffffff3d;border-radius:22px;flex-shrink:0;width:235px;padding:19px;position:relative}.dashboard-live-label,.dashboard-live-data{color:#fff;letter-spacing:.8px;align-items:center;gap:8px;font-size:10px;font-weight:900;display:inline-flex}.dashboard-live-label span,.dashboard-live-data span{background:#bbf7d0;border-radius:50%;width:9px;height:9px;box-shadow:0 0 0 5px #bbf7d02e}.dashboard-live-panel>svg{margin:22px 0 9px;display:block}.dashboard-live-panel h3{margin:0;font-size:20px}.dashboard-live-panel p{color:#ffffffd1;margin:8px 0 15px;font-size:12px;line-height:1.5}.dashboard-live-panel p strong{color:#fff;margin-top:3px;display:block}.dashboard-live-panel button{color:#fff;cursor:pointer;background:#ffffff24;border:1px solid #ffffff3d;border-radius:13px;justify-content:center;align-items:center;gap:7px;width:100%;padding:11px;font-size:12px;font-weight:900;transition:background .2s;display:inline-flex}.dashboard-live-panel button:hover{background:#ffffff40}.dashboard-summary-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:22px 0;display:grid}.dashboard-summary-card{background:#fffffff5;border:1px solid #e2e8f0eb;border-radius:20px;align-items:center;gap:14px;min-width:0;padding:17px;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 13px 28px #0f172a0e}.dashboard-summary-card:hover{transform:translateY(-4px);box-shadow:0 20px 34px #0f172a1a}.dashboard-summary-icon{border-radius:15px;flex-shrink:0;place-items:center;width:48px;height:48px;display:grid}.dashboard-summary-icon.green{color:#15803d;background:#dcfce7}.dashboard-summary-icon.blue,.dashboard-summary-icon.sky{color:#0284c7;background:#e0f2fe}.dashboard-summary-icon.orange{color:#c2410c;background:#ffedd5}.dashboard-summary-icon.purple{color:#7e22ce;background:#f3e8ff}.dashboard-summary-icon.amber{color:#b45309;background:#fef3c7}.dashboard-summary-icon.lime{color:#4d7c0f;background:#ecfccb}.dashboard-summary-icon.red{color:#dc2626;background:#fee2e2}.dashboard-summary-card p{color:#64748b;margin:0;font-size:12px;font-weight:800}.dashboard-summary-card h2{color:#102018;margin:3px 0;font-size:25px}.dashboard-summary-card span{color:#94a3b8;text-overflow:ellipsis;white-space:nowrap;font-size:10px;font-weight:700;display:block;overflow:hidden}.dashboard-panel{background:#fffffff7;border:1px solid #e2e8f0f5;border-radius:25px;min-width:0;padding:22px;box-shadow:0 15px 34px #0f172a10}.dashboard-panel-header,.dashboard-section-header,.dashboard-status-header{justify-content:space-between;align-items:flex-start;gap:15px;display:flex}.dashboard-panel-header h2,.dashboard-section-header h2,.dashboard-status-header h2{color:#102018;margin:0;font-size:23px;line-height:1.2}.dashboard-panel-header p,.dashboard-section-header p,.dashboard-status-header p{color:#64748b;margin:7px 0 0;font-size:13px;line-height:1.55}.dashboard-section-label{color:#16a34a;letter-spacing:1.35px;margin-bottom:7px;font-size:10px;font-weight:900;display:inline-block}.dashboard-header-badge,.dashboard-petak-badge{color:#166534;background:#dcfce7;border-radius:999px;flex-shrink:0;align-items:center;gap:7px;padding:8px 11px;font-size:11px;font-weight:900;display:inline-flex}.dashboard-primary-grid{grid-template-columns:minmax(0,1.75fr) minmax(300px,.7fr);gap:18px;display:grid}.dashboard-3d-panel{overflow:hidden}.dashboard-alert-panel{max-height:850px;overflow:auto}.dashboard-alert-count{color:#dc2626;background:#fee2e2;border-radius:50%;flex-shrink:0;place-items:center;width:34px;height:34px;font-size:13px;font-weight:900;display:grid}.dashboard-safe-alert{color:#166534;background:#dcfce7;border-radius:16px;align-items:center;gap:12px;margin-top:16px;padding:15px;display:flex}.dashboard-safe-alert p{margin:4px 0 0;font-size:12px}.dashboard-alert-list{gap:11px;margin-top:16px;display:grid}.dashboard-alert-item{color:#c2410c;background:#fff7ed;border-left:4px solid #f97316;border-radius:15px;gap:10px;padding:14px;transition:transform .2s;display:flex}.dashboard-alert-item:hover{transform:translate(4px)}.dashboard-alert-item svg{flex-shrink:0;margin-top:2px}.dashboard-alert-item strong{color:#102018;font-size:13px}.dashboard-alert-item p{color:#64748b;margin:5px 0 0;font-size:12px;line-height:1.55}.dashboard-device-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:21px 0;display:grid}.dashboard-device-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;align-items:center;gap:14px;padding:17px;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 12px 27px #0f172a0d}.dashboard-device-card:hover{transform:translateY(-4px);box-shadow:0 19px 32px #0f172a17}.dashboard-device-icon{border-radius:15px;flex-shrink:0;place-items:center;width:49px;height:49px;display:grid}.dashboard-device-card.pump .dashboard-device-icon{color:#15803d;background:#dcfce7}.dashboard-device-card.fan .dashboard-device-icon{color:#0284c7;background:#e0f2fe}.dashboard-device-card.lamp .dashboard-device-icon{color:#b45309;background:#fef3c7}.dashboard-device-card.auto .dashboard-device-icon{color:#4d7c0f;background:#ecfccb}.dashboard-device-card span{color:#64748b;font-size:12px;font-weight:800;display:block}.dashboard-device-card strong{color:#102018;margin-top:4px;font-size:20px;display:block}.dashboard-status-section{background:#fffffff7;border:1px solid #e2e8f0;border-radius:25px;grid-template-columns:minmax(0,1fr) 330px;gap:18px;padding:23px;display:grid;box-shadow:0 15px 34px #0f172a0f}.dashboard-status-info{flex-direction:column;justify-content:space-between;display:flex}.dashboard-status-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px;display:grid}.dashboard-status-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;align-items:center;gap:11px;padding:14px;display:flex}.dashboard-status-icon{border-radius:50%;flex-shrink:0;place-items:center;width:39px;height:39px;display:grid}.dashboard-status-card.normal .dashboard-status-icon{color:#15803d;background:#dcfce7}.dashboard-status-card.warning .dashboard-status-icon{color:#ca8a04;background:#fef9c3}.dashboard-status-card.critical .dashboard-status-icon{color:#dc2626;background:#fee2e2}.dashboard-status-card span{color:#64748b;font-size:11px;font-weight:800;display:block}.dashboard-status-card strong{color:#102018;margin:2px 0;font-size:24px;display:block}.dashboard-status-card p{color:#94a3b8;margin:0;font-size:10px;font-weight:700}.dashboard-donut-card{flex-direction:column;justify-content:center;display:flex}.dashboard-donut-wrapper{position:relative}.dashboard-donut-center{pointer-events:none;text-align:center;place-content:center;display:grid;position:absolute;inset:0}.dashboard-donut-center strong{color:#102018;font-size:36px;line-height:1}.dashboard-donut-center span{color:#64748b;margin-top:5px;font-size:11px;font-weight:800;display:block}.dashboard-donut-caption{color:#64748b;justify-content:center;align-items:center;gap:7px;font-size:11px;font-weight:800;display:flex}.dashboard-donut-caption span{background:#22c55e;border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 4px #22c55e21}.dashboard-analytics-section{margin-top:28px}.dashboard-section-header{align-items:flex-end;margin-bottom:15px}.dashboard-live-data{color:#166534;background:#dcfce7;border-radius:999px;padding:9px 12px}.dashboard-live-data span{background:#22c55e;width:8px;height:8px}.dashboard-chart-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.dashboard-chart-card{background:#fff;border:1px solid #e2e8f0;border-radius:24px;min-width:0;padding:19px 17px 10px;transition:transform .2s,box-shadow .2s;overflow:hidden;box-shadow:0 14px 32px #0f172a0e}.dashboard-chart-card:hover{transform:translateY(-4px);box-shadow:0 20px 36px #0f172a1a}.dashboard-chart-header{justify-content:space-between;gap:12px;margin-bottom:7px;display:flex}.dashboard-chart-heading{gap:11px;display:flex}.dashboard-chart-heading h3{color:#102018;margin:0;font-size:18px}.dashboard-chart-heading p{color:#64748b;margin:5px 0 0;font-size:11px}.dashboard-chart-icon{border-radius:14px;flex-shrink:0;place-items:center;width:42px;height:42px;display:grid}.dashboard-chart-icon.green{color:#15803d;background:#dcfce7}.dashboard-chart-icon.orange{color:#c2410c;background:#ffedd5}.dashboard-chart-icon.sky{color:#0284c7;background:#e0f2fe}.dashboard-chart-icon.amber{color:#b45309;background:#fef3c7}.dashboard-chart-stats{gap:6px;display:flex}.dashboard-chart-stats div{text-align:center;background:#f8fafc;border:1px solid #e2e8f0;border-radius:11px;min-width:61px;padding:7px}.dashboard-chart-stats span{color:#94a3b8;font-size:8px;font-weight:900;display:block}.dashboard-chart-stats strong{color:#334155;margin-top:3px;font-size:11px;display:block}.dashboard-tooltip{background:#fffffffa;border:1px solid #e2e8f0;border-radius:12px;padding:11px 13px;box-shadow:0 14px 30px #0f172a1c}.dashboard-tooltip span{color:#64748b;margin-bottom:4px;font-size:11px;font-weight:800;display:block}.dashboard-tooltip strong{color:#102018;font-size:13px}.dashboard-insight-grid{grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr);gap:18px;margin-top:21px;display:grid}.dashboard-recommendation-list,.dashboard-activity-list{gap:10px;margin-top:15px;display:grid}.dashboard-recommendation-item,.dashboard-activity-item{border-radius:15px;gap:11px;padding:13px;display:flex}.dashboard-recommendation-item.normal{color:#166534;background:#f0fdf4}.dashboard-recommendation-item.warning{color:#a16207;background:#fefce8}.dashboard-recommendation-item.critical{color:#dc2626;background:#fef2f2}.dashboard-recommendation-item svg,.dashboard-activity-item svg{flex-shrink:0;margin-top:2px}.dashboard-recommendation-item strong,.dashboard-activity-item strong{color:#102018;font-size:13px}.dashboard-recommendation-item p,.dashboard-activity-item p{color:#64748b;margin:4px 0 0;font-size:12px;line-height:1.5}.dashboard-activity-item{color:#166534;background:#f8fafc}.dashboard-shell .sensor-table-section{margin-top:22px}@media (width<=1240px){.dashboard-primary-grid{grid-template-columns:1fr}.dashboard-alert-panel{max-height:none}.dashboard-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-status-section{grid-template-columns:1fr}.dashboard-donut-card{max-width:350px;margin:0 auto}}@media (width<=960px){.dashboard-device-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-chart-grid,.dashboard-insight-grid{grid-template-columns:1fr}}@media (width<=760px){.dashboard-shell{width:min(100% - 24px,1560px);padding-top:100px}.dashboard-hero{flex-direction:column;padding:25px}.dashboard-live-panel{width:100%}.dashboard-status-cards{grid-template-columns:1fr}.dashboard-chart-header,.dashboard-panel-header,.dashboard-status-header,.dashboard-section-header{flex-direction:column}}@media (width<=560px){.dashboard-summary-grid,.dashboard-device-grid{grid-template-columns:1fr}.dashboard-chart-stats{flex-wrap:wrap}.dashboard-chart-card{padding:15px 9px 7px}.dashboard-hero h1{font-size:36px}}.report-shell{color:#102018;width:min(100% - 44px,1560px);margin:0 auto;padding:112px 0 58px}.report-shell *{box-sizing:border-box}.report-hero{background:radial-gradient(circle at 90% 15%,#86efac61,#0000 32%),linear-gradient(135deg,#064e3b,#15803d,#22c55e);border-radius:28px;justify-content:space-between;align-items:center;gap:22px;padding:30px;display:flex;box-shadow:0 20px 40px #15803d2e}.report-eyebrow{color:#fff;background:#ffffff1f;border:1px solid #ffffff38;border-radius:999px;align-items:center;gap:7px;padding:8px 11px;font-size:11px;font-weight:900;display:inline-flex}.report-hero h1{color:#fff;margin:15px 0 8px;font-size:clamp(32px,4vw,48px);line-height:1.05}.report-hero p{color:#ffffffde;max-width:760px;margin:0;font-size:14px;line-height:1.7}.report-hero-badges{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.report-hero-badges span{color:#fff;background:#ffffff1a;border:1px solid #fff3;border-radius:999px;align-items:center;gap:6px;padding:8px 10px;font-size:11px;font-weight:800;display:inline-flex}.report-actions{gap:10px;min-width:190px;display:grid}.report-action{cursor:pointer;border-radius:13px;justify-content:center;align-items:center;gap:7px;padding:12px 14px;font-weight:900;display:inline-flex}.report-action.primary{color:#166534;background:#fff;border:1px solid #fff}.report-action.secondary{color:#fff;background:#ffffff24;border:1px solid #ffffff3d}.report-summary-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:22px 0;display:grid}.report-summary-card{background:#fff;border:1px solid #e2e8f0;border-radius:19px;align-items:center;gap:13px;padding:17px;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 12px 26px #0f172a0e}.report-summary-card:hover{transform:translateY(-4px);box-shadow:0 19px 32px #0f172a1a}.report-summary-icon{border-radius:15px;flex-shrink:0;place-items:center;width:47px;height:47px;display:grid}.report-summary-icon.green{color:#15803d;background:#dcfce7}.report-summary-icon.blue{color:#0284c7;background:#e0f2fe}.report-summary-icon.orange{color:#c2410c;background:#ffedd5}.report-summary-icon.red{color:#dc2626;background:#fee2e2}.report-summary-card p{color:#64748b;margin:0;font-size:12px;font-weight:800}.report-summary-card h2{color:#102018;margin:3px 0;font-size:25px}.report-summary-card span{color:#94a3b8;font-size:10px;font-weight:700}.report-panel{background:#fff;border:1px solid #e2e8f0;border-radius:23px;min-width:0;padding:21px;box-shadow:0 14px 31px #0f172a0e}.report-panel-header{justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.report-panel-header h2{color:#102018;margin:0;font-size:22px}.report-panel-header p{color:#64748b;margin:6px 0 0;font-size:12px;line-height:1.55}.report-section-label{color:#16a34a;letter-spacing:1.3px;margin-bottom:6px;font-size:10px;font-weight:900;display:inline-block}.report-chart-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.report-donut-layout{grid-template-columns:minmax(0,1fr) 150px;align-items:center;display:grid}.report-donut-wrapper{position:relative}.report-donut-center{pointer-events:none;text-align:center;place-content:center;display:grid;position:absolute;inset:0}.report-donut-center strong{color:#102018;font-size:34px}.report-donut-center span{color:#64748b;font-size:11px;font-weight:800}.report-status-list{gap:10px;display:grid}.report-status-item{border:1px solid #e2e8f0;border-radius:13px;align-items:center;gap:9px;padding:10px;display:flex}.report-status-dot{border-radius:50%;width:12px;height:12px}.report-status-item strong{color:#102018;font-size:18px}.report-status-item p{color:#64748b;margin:1px 0 0;font-size:11px}.report-statistics-panel{margin-top:18px}.report-statistics-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px;display:grid}.report-statistics-grid article{background:#f8fafc;border:1px solid #e2e8f0;border-radius:15px;gap:11px;padding:14px;display:flex}.report-statistics-icon{border-radius:13px;flex-shrink:0;place-items:center;width:40px;height:40px;display:grid}.report-statistics-icon.soil{color:#15803d;background:#dcfce7}.report-statistics-icon.temperature{color:#c2410c;background:#ffedd5}.report-statistics-icon.humidity{color:#0284c7;background:#e0f2fe}.report-statistics-icon.light{color:#b45309;background:#fef3c7}.report-statistics-grid span{color:#64748b;font-size:11px;font-weight:800}.report-statistics-grid strong{color:#102018;margin-top:4px;font-size:19px;display:block}.report-statistics-grid p{color:#94a3b8;margin:4px 0 0;font-size:10px}.report-table-panel{margin-top:18px}.report-table-wrapper{border:1px solid #e2e8f0;border-radius:15px;margin-top:16px;overflow-x:auto}.report-table-wrapper table{border-collapse:collapse;width:100%;min-width:1250px}.report-table-wrapper th,.report-table-wrapper td{text-align:left;vertical-align:top;border-bottom:1px solid #eef2f7;padding:13px 12px;font-size:12px}.report-table-wrapper th{color:#475569;letter-spacing:.3px;background:#f8fafc;font-size:11px}.report-table-wrapper td{color:#64748b}.report-table-wrapper tr:last-child td{border-bottom:none}.report-device-pill,.report-mode-pill,.report-status-pill{border-radius:999px;padding:6px 8px;font-size:10px;font-weight:900;display:inline-flex}.report-device-pill.on{color:#166534;background:#dcfce7}.report-device-pill.off{color:#dc2626;background:#fee2e2}.report-mode-pill.auto{color:#166534;background:#dcfce7}.report-mode-pill.manual{color:#854d0e;background:#fef9c3}.report-status-pill.normal{color:#166534;background:#dcfce7}.report-status-pill.warning{color:#a16207;background:#fef9c3}.report-status-pill.critical{color:#dc2626;background:#fee2e2}.report-recommendation-cell{min-width:290px;line-height:1.5}.report-empty-state{text-align:center!important;padding:35px!important}.report-footer{color:#166534;background:#f0fdf4;border:1px solid #dcfce7;border-radius:15px;justify-content:space-between;align-items:center;gap:14px;margin-top:18px;padding:15px 17px;display:flex}.report-footer div{align-items:center;gap:9px;display:flex}.report-footer p,.report-footer span{margin:0;font-size:11px;font-weight:800}@media (width<=1050px){.report-summary-grid,.report-statistics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.report-chart-grid{grid-template-columns:1fr}}@media (width<=720px){.report-shell{width:min(100% - 24px,1560px);padding-top:100px}.report-hero{flex-direction:column;align-items:stretch}.report-actions{width:100%}.report-donut-layout{grid-template-columns:1fr}.report-status-list{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=560px){.report-summary-grid,.report-statistics-grid,.report-status-list{grid-template-columns:1fr}.report-footer{flex-direction:column;align-items:flex-start}}@media print{.navbar,nav{display:none!important}.report-shell{width:100%;padding:0}.report-actions{display:none}.report-hero{color:#102018;box-shadow:none;background:#fff}.report-hero h1,.report-hero p,.report-eyebrow,.report-hero-badges span{color:#102018}.report-panel,.report-summary-card{break-inside:avoid;box-shadow:none}}.about-shell{color:#102018;width:min(100% - 44px,1500px);margin:0 auto;padding:112px 0 58px}.about-shell *{box-sizing:border-box}.about-hero{background:radial-gradient(circle at 88% 10%,#86efac73,#0000 35%),linear-gradient(135deg,#064e3b,#15803d,#22c55e);border-radius:30px;grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr);gap:24px;padding:36px;display:grid;overflow:hidden;box-shadow:0 21px 42px #15803d33}.about-hero-content{align-self:center}.about-eyebrow{color:#fff;background:#ffffff1f;border:1px solid #ffffff38;border-radius:999px;align-items:center;gap:7px;padding:8px 11px;font-size:11px;font-weight:900;display:inline-flex}.about-hero h1{color:#fff;letter-spacing:-1.7px;max-width:830px;margin:16px 0 10px;font-size:clamp(34px,4.5vw,58px);line-height:1.04}.about-hero h1 span{color:#bbf7d0}.about-hero p{color:#ffffffde;max-width:760px;margin:0;font-size:15px;line-height:1.75}.about-hero-actions,.about-cta-actions{flex-wrap:wrap;gap:10px;margin-top:22px;display:flex}.about-primary-button,.about-secondary-button{border-radius:13px;justify-content:center;align-items:center;gap:7px;padding:12px 15px;font-size:12px;font-weight:900;text-decoration:none;transition:transform .2s,background .2s;display:inline-flex}.about-primary-button{color:#166534;background:#fff}.about-secondary-button{color:#fff;background:#ffffff21;border:1px solid #ffffff3d}.about-primary-button:hover,.about-secondary-button:hover{transform:translateY(-3px)}.about-hero-illustration{min-height:310px;position:relative}.about-illustration-glow{filter:blur(18px);background:#bbf7d042;border-radius:50%;position:absolute;inset:45px}.about-illustration-card.main{color:#fff;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);text-align:center;background:#ffffff26;border:1px solid #ffffff47;border-radius:50%;place-content:center;width:210px;height:210px;display:grid;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.about-illustration-card h3{margin:8px 0 2px;font-size:23px}.about-illustration-card p{margin:0;font-size:11px}.about-floating-card{color:#fff;-webkit-backdrop-filter:blur(13px);backdrop-filter:blur(13px);background:#ffffff26;border:1px solid #ffffff3d;border-radius:999px;align-items:center;gap:7px;padding:10px 12px;font-size:11px;font-weight:900;display:inline-flex;position:absolute}.about-floating-card.sensor{top:18px;left:5px}.about-floating-card.automation{bottom:45px;right:0}.about-floating-card.database{bottom:5px;left:12px}.about-overview-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:22px 0;display:grid}.about-overview-card{color:#15803d;background:#fff;border:1px solid #e2e8f0;border-radius:18px;gap:12px;padding:16px;display:flex;box-shadow:0 12px 25px #0f172a0d}.about-overview-card strong{color:#102018;font-size:14px}.about-overview-card p{color:#64748b;margin:4px 0 0;font-size:11px;line-height:1.5}.about-section,.about-introduction-section,.about-automation-section,.about-checklist-section,.about-cta{background:#fff;border:1px solid #e2e8f0;border-radius:24px;margin-top:20px;padding:24px;box-shadow:0 14px 31px #0f172a0e}.about-introduction-section{grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:22px;display:grid}.about-section-label{color:#16a34a;letter-spacing:1.35px;margin-bottom:7px;font-size:10px;font-weight:900;display:inline-block}.about-section h2,.about-introduction-section h2,.about-automation-section h2,.about-checklist-section h2,.about-cta h2{color:#102018;margin:0;font-size:26px}.about-section-header>p,.about-introduction-section>div>p,.about-automation-heading p,.about-cta p{color:#64748b;margin:8px 0 0;font-size:13px;line-height:1.7}.about-flow-card{background:#f0fdf4;border-radius:18px;padding:18px}.about-flow-card h3{color:#166534;margin:0;font-size:19px}.about-flow-list{gap:9px;margin-top:14px;display:grid}.about-flow-list div{color:#166534;background:#fff;border:1px solid #dcfce7;border-radius:12px;align-items:center;gap:9px;padding:10px;font-size:12px;font-weight:800;display:flex}.about-feature-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:17px;display:grid}.about-feature-card{border:1px solid #e2e8f0;border-radius:17px;padding:17px;transition:transform .2s,box-shadow .2s}.about-feature-card:hover{transform:translateY(-4px);box-shadow:0 16px 27px #0f172a14}.about-feature-icon,.about-rule-icon,.about-tech-icon{border-radius:14px;place-items:center;width:43px;height:43px;display:grid}.about-feature-icon.green{color:#15803d;background:#dcfce7}.about-feature-icon.blue{color:#0284c7;background:#e0f2fe}.about-feature-icon.purple{color:#7e22ce;background:#f3e8ff}.about-feature-icon.orange{color:#c2410c;background:#ffedd5}.about-feature-card h3{color:#102018;margin:13px 0 7px;font-size:16px}.about-feature-card p{color:#64748b;margin:0;font-size:12px;line-height:1.6}.about-automation-section{background:radial-gradient(circle at 90% 20%,#dcfce7f2,#0000 32%),#fff}.about-automation-heading{justify-content:space-between;gap:14px;display:flex}.about-auto-badge{color:#166534;background:#dcfce7;border-radius:999px;flex-shrink:0;align-self:flex-start;align-items:center;gap:7px;padding:9px 12px;font-size:11px;font-weight:900;display:inline-flex}.about-rule-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:17px;display:grid}.about-rule-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;gap:12px;padding:15px;display:flex}.about-rule-icon.blue{color:#0284c7;background:#e0f2fe}.about-rule-icon.sky{color:#0369a1;background:#e0f2fe}.about-rule-icon.amber{color:#b45309;background:#fef3c7}.about-rule-card span{color:#64748b;font-size:11px;font-weight:800;display:block}.about-rule-card strong{color:#102018;margin-top:3px;font-size:17px;display:block}.about-rule-card p{color:#64748b;margin:4px 0 0;font-size:11px}.about-tech-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:17px;display:grid}.about-tech-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;gap:11px;padding:15px;display:flex}.about-tech-icon{color:#166534;background:#dcfce7;flex-shrink:0}.about-tech-card h3{color:#102018;margin:0;font-size:15px}.about-tech-card p{color:#64748b;margin:5px 0 0;font-size:11px;line-height:1.5}.about-checklist-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin-top:15px;display:grid}.about-checklist-item{color:#166534;background:#f0fdf4;border-radius:12px;align-items:center;gap:8px;padding:11px;font-size:12px;font-weight:800;display:flex}.about-cta{color:#fff;background:radial-gradient(circle at 85% 20%,#86efac57,#0000 30%),linear-gradient(135deg,#064e3b,#15803d);justify-content:space-between;align-items:center;gap:18px;display:flex}.about-cta h2{color:#fff}.about-cta p{color:#ffffffd6}.about-cta .about-section-label{color:#bbf7d0}@media (width<=1050px){.about-hero,.about-introduction-section{grid-template-columns:1fr}.about-overview-grid,.about-feature-grid,.about-tech-grid,.about-checklist-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.about-hero-illustration{min-height:260px}}@media (width<=760px){.about-shell{width:min(100% - 24px,1500px);padding-top:100px}.about-hero{padding:25px}.about-rule-grid{grid-template-columns:1fr}.about-cta{flex-direction:column;align-items:flex-start}}@media (width<=560px){.about-overview-grid,.about-feature-grid,.about-tech-grid,.about-checklist-grid{grid-template-columns:1fr}.about-automation-heading{flex-direction:column}}*{box-sizing:border-box}:root{--bg:#eef7ef;--bg-soft:#f8fff9;--white:#fff;--card:#fffffff0;--text:#102018;--muted:#64748b;--green-dark:#064e3b;--green:#16a34a;--green-light:#22c55e;--green-soft:#dcfce7;--lime:#84cc16;--sky:#0ea5e9;--amber:#f59e0b;--red:#ef4444;--purple:#8b5cf6;--border:#dceee1;--shadow:0 18px 45px #0f172a14;--shadow-green:0 24px 60px #1665342e}html{scroll-behavior:smooth}body{min-height:100vh;color:var(--text);background:radial-gradient(circle at 0 0,#84cc162e,#0000 30%),radial-gradient(circle at 100% 0,#16a34a24,#0000 28%),linear-gradient(135deg,#f7fff8,#eef7ef 45%,#e5f5e8);margin:0;font-family:Inter,Arial,sans-serif}button,input,select{font-family:inherit}button{transition:all .2s}button:hover{transform:translateY(-1px)}a{color:inherit;text-decoration:none}.navbar{z-index:100;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffffe0;border-bottom:1px solid #dceee1;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;min-height:78px;padding:15px 28px;display:grid;position:sticky;top:0;box-shadow:0 10px 28px #0f172a0a}.navbar:before{content:"";background:linear-gradient(90deg,#0000 0%,#064e3b 20%,#16a34a 50%,#84cc16 80%,#0000 100%) 0 0/200% 100%;height:3px;animation:3s linear infinite navLine;position:absolute;top:0;left:0;right:0}@keyframes navLine{0%{background-position:200% 0}to{background-position:-200% 0}}.brand{color:var(--green-dark);align-items:center;gap:12px;font-size:20px;font-weight:900;display:flex}.brand-icon-wrap{width:42px;height:42px;color:var(--green);background:var(--green-soft);border:1px solid #bbf7d0;border-radius:15px;place-items:center;animation:3s ease-in-out infinite iconPulse;display:grid;box-shadow:0 0 24px #22c55e21}@keyframes iconPulse{0%,to{box-shadow:0 0 #16a34a42}50%{box-shadow:0 0 0 8px #16a34a00}}.nav-links{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.nav-links a{color:#334155;white-space:nowrap;background:#f8fafc;border:1px solid #e5e7eb;border-radius:999px;align-items:center;gap:7px;padding:10px 13px;font-size:14px;font-weight:800;transition:all .2s;display:inline-flex}.nav-links a:hover{background:var(--green-soft);color:var(--green-dark);border-color:#bbf7d0}.nav-links a.active{background:linear-gradient(135deg, var(--green-dark), var(--green));color:#fff;border-color:#0000;box-shadow:0 12px 26px #16a34a38}.nav-live{color:#166534;background:var(--green-soft);border:1px solid #bbf7d0;border-radius:999px;align-items:center;gap:7px;padding:9px 15px;font-size:13px;font-weight:800;display:inline-flex}.nav-live-dot{background:var(--green);border-radius:50%;width:8px;height:8px;animation:1.6s ease-in-out infinite blinkDot;box-shadow:0 0 12px #22c55ecc}@keyframes blinkDot{0%,to{opacity:1}50%{opacity:.35}}.page,.dashboard{max-width:1500px;margin:0 auto;padding:28px}.home-hero{color:#fff;min-height:570px;box-shadow:var(--shadow-green);background:linear-gradient(135deg,#064e3bf2,#16a34ae0),radial-gradient(circle at 78% 18%,#dcfce759,#0000 30%),radial-gradient(circle at 25% 85%,#84cc1652,#0000 35%);border-radius:36px;grid-template-columns:1.1fr .9fr;align-items:center;gap:34px;margin-bottom:24px;padding:54px;display:grid;position:relative;overflow:hidden}.home-hero:after{content:"";opacity:.26;pointer-events:none;background-color:#0000;background-image:linear-gradient(#0000 0 95%,#ffffff14 96%),linear-gradient(90deg,#0000 0 95%,#ffffff14 96%);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:48px 48px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:absolute;inset:0}.home-hero>*{z-index:2;position:relative}.hero-label{background:#ffffff2e;border:1px solid #ffffff3d;border-radius:999px;align-items:center;gap:8px;margin-bottom:20px;padding:10px 15px;font-weight:800;display:inline-flex}.home-hero h1{letter-spacing:-2px;max-width:850px;margin:0 0 20px;font-size:clamp(42px,5vw,68px);line-height:1.02}.home-hero p{color:#ecfdf5;max-width:820px;margin:0;font-size:17px;line-height:1.85}.home-actions{flex-wrap:wrap;gap:14px;margin-top:30px;display:flex}.primary-link,.secondary-link{border-radius:999px;justify-content:center;align-items:center;padding:15px 20px;font-weight:900;display:inline-flex}.primary-link{color:var(--green-dark);background:#fff;box-shadow:0 16px 30px #0f172a29}.secondary-link{color:#fff;background:#ffffff26;border:1px solid #ffffff40}.home-visual{place-items:center;min-height:390px;display:grid;position:relative}.circle-card{text-align:center;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffff2e;border:1px solid #ffffff47;border-radius:40px;place-items:center;width:300px;height:300px;padding:28px;display:grid;box-shadow:0 20px 50px #00000038}.circle-card svg{background:#ffffff2e;border-radius:28px;width:76px;height:76px;padding:16px}.circle-card strong{font-size:27px}.circle-card span{color:#dcfce7}.mini-card{color:var(--green-dark);background:#fff;border-radius:20px;padding:15px 20px;font-weight:900;position:absolute;box-shadow:0 18px 36px #0000002e}.mini-card.one{top:28px;left:30px}.mini-card.two{top:118px;right:24px}.mini-card.three{bottom:62px;left:80px}.feature-grid{grid-template-columns:repeat(4,1fr);gap:18px;display:grid}.feature-card{border:1px solid var(--border);box-shadow:var(--shadow);background:#fff;border-radius:28px;padding:26px}.feature-card svg{color:var(--green);background:var(--green-soft);border-radius:18px;width:52px;height:52px;padding:10px}.feature-card h3{color:var(--text);margin:18px 0 8px}.feature-card p{color:var(--muted);line-height:1.7}.hero{color:#fff;min-height:280px;box-shadow:var(--shadow-green);background:radial-gradient(circle at 100% 0,#ffffff3d,#0000 28%),linear-gradient(135deg,#064e3b,#16a34a 58%,#84cc16);border-radius:34px;justify-content:space-between;align-items:center;gap:28px;margin-bottom:24px;padding:38px;display:flex}.hero h1{letter-spacing:-1.4px;margin:0 0 14px;font-size:clamp(34px,4vw,50px)}.hero p{color:#ecfdf5;max-width:760px;margin:0;line-height:1.75}.hero-info span{background:#ffffff26;border-radius:14px;padding:10px 14px;font-weight:800}.live-box{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);text-align:center;background:#ffffff2e;border:1px solid #ffffff42;border-radius:28px;width:280px;min-width:260px;padding:26px}.live-box svg{background:#ffffff2e;border-radius:18px;width:54px;height:54px;padding:11px}.live-box h3{margin:14px 0 6px}.live-box p{color:#ecfdf5;font-size:14px}.live-box button{color:var(--green-dark);cursor:pointer;background:#fff;border:none;border-radius:999px;align-items:center;gap:8px;padding:12px 17px;font-weight:900;display:inline-flex}.summary-grid{grid-template-columns:repeat(5,1fr);gap:16px;margin-bottom:22px;display:grid}.summary-card{border:1px solid var(--border);box-shadow:var(--shadow);background:#fff;border-radius:24px;padding:22px;position:relative;overflow:hidden}.summary-card:after{content:"";background:#22c55e1f;border-radius:50%;width:110px;height:110px;position:absolute;top:-38px;right:-38px}.summary-card p{color:var(--muted);margin:16px 0 8px;font-size:14px;font-weight:800}.summary-card h2{color:var(--green-dark);margin:0;font-size:34px}.danger-card h2{color:var(--red)}.icon-box{border-radius:18px;place-items:center;width:50px;height:50px;display:grid}.icon-box.green{background:var(--green-soft);color:#166534}.icon-box.blue{color:#0369a1;background:#e0f2fe}.icon-box.orange{color:#c2410c;background:#ffedd5}.icon-box.purple{color:#6d28d9;background:#ede9fe}.icon-box.red{color:#b91c1c;background:#fee2e2}.main-grid{grid-template-columns:1.5fr .85fr;gap:22px;margin-bottom:22px;display:grid}.chart-grid,.insight-grid,.report-layout{grid-template-columns:1fr 1fr;gap:22px;display:grid}.panel{border:1px solid var(--border);box-shadow:var(--shadow);background:#fff;border-radius:28px;margin-bottom:22px;padding:26px}.panel-title{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;display:flex}.panel-title h3{color:var(--text);margin:0;font-size:22px}.panel-title span{color:var(--muted);font-size:14px}.lahan-3d-wrap{background:#0a160e;border:1px solid #dceee1;border-radius:24px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff0a}.lahan-3d-canvas{cursor:grab;width:100%;height:410px;display:block}.lahan-3d-canvas:active{cursor:grabbing}.lahan-legend{gap:10px;display:flex;position:absolute;bottom:12px;right:14px}.leg{background:#0000008c;border-radius:999px;padding:5px 10px;font-size:11px;font-weight:900}.leg.normal{color:#4ade80;border:1px solid #4ade8059}.leg.warning{color:#fbbf24;border:1px solid #fbbf2459}.leg.critical{color:#f87171;border:1px solid #f8717159}.petak-detail-overlay{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:10;background:#fffffff5;border:1px solid #bbf7d0;border-radius:18px;width:270px;padding:15px;position:absolute;bottom:48px;left:16px;box-shadow:0 16px 36px #0f172a21}.pdo-name{margin-bottom:12px;font-size:18px;font-weight:900}.pdo-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.pdo-stat{background:#f8fafc;border:1px solid #e5e7eb;border-radius:11px;padding:9px}.pdo-lbl{color:#64748b;text-transform:uppercase;letter-spacing:.6px;font-size:9px}.pdo-val{margin-top:3px;font-family:monospace;font-size:16px;font-weight:900}.pdo-bar{background:#e5e7eb;border-radius:999px;height:4px;margin-top:6px;overflow:hidden}.pdo-bar-fill{border-radius:999px;height:100%}.pdo-pump-row{color:var(--muted);border-top:1px solid #e5e7eb;justify-content:space-between;align-items:center;margin-top:12px;padding-top:12px;font-size:13px;display:flex}.pdo-toggle{cursor:pointer;background:#e5e7eb;border-radius:999px;width:46px;height:23px;position:relative}.pdo-toggle:after{content:"";background:#fff;border-radius:50%;width:17px;height:17px;transition:all .25s;position:absolute;top:2px;left:3px;box-shadow:0 2px 6px #0f172a2e}.pdo-toggle.on{background:var(--green);box-shadow:0 0 12px #16a34a61}.pdo-toggle.on:after{left:25px}.pdo-rec{color:#166534;background:#f0fdf4;border-left:3px solid #22c55e99;border-radius:0 10px 10px 0;margin-top:10px;padding:10px;font-size:12px;line-height:1.5}.alert-list{gap:12px;display:grid}.alert-item{background:#fff7ed;border-left:5px solid #f97316;border-radius:18px;gap:12px;padding:15px;display:flex}.alert-item svg{color:#fb923c;flex-shrink:0}.alert-item strong{color:var(--text);margin-bottom:5px;display:block}.alert-item p{color:var(--muted);margin:0}.safe-alert{background:var(--green-soft);color:#166534;border-radius:18px;padding:16px;font-weight:900}.status-chart{background:#f8fafc;border-radius:20px;margin-top:18px}.recommendation-list,.activity-list{gap:12px;display:grid}.recommendation-item,.activity-item{background:#f8fafc;border:1px solid #e5e7eb;border-radius:18px;align-items:flex-start;gap:14px;padding:15px;display:flex}.recommendation-item.normal{background:#f0fdf4;border-color:#bbf7d0}.recommendation-item.warning{background:#fefce8;border-color:#fde68a}.recommendation-item.critical{background:#fef2f2;border-color:#fecaca}.recommendation-icon{color:#166534;background:#fff;border-radius:15px;flex-shrink:0;place-items:center;width:42px;height:42px;display:grid}.recommendation-item.warning .recommendation-icon{color:#ca8a04}.recommendation-item.critical .recommendation-icon{color:#dc2626}.recommendation-item strong,.activity-item strong{color:var(--text);margin-bottom:4px;display:block}.recommendation-item p,.activity-item p{color:var(--muted);margin:0;line-height:1.6}.table-wrapper{border:1px solid #dceee1;border-radius:22px;overflow-x:auto}table{border-collapse:collapse;background:#fff;width:100%;min-width:900px}th{text-align:left;color:#fff;text-transform:uppercase;letter-spacing:.8px;background:linear-gradient(135deg, var(--green-dark), #15803d);padding:16px;font-size:13px}td{color:#334155;border-top:1px solid #e5e7eb;padding:15px 16px}tr:hover td{background:#f8fafc}.pump,.status-pill{border-radius:999px;padding:7px 11px;font-size:12px;font-weight:900;display:inline-block}.pump.on,.status-pill.normal{background:var(--green-soft);color:#166534}.pump.off,.status-pill.critical{color:#991b1b;background:#fee2e2}.status-pill.warning{color:#854d0e;background:#fef9c3}.pump-btn{color:#fff;background:linear-gradient(135deg, var(--green-dark), var(--green));cursor:pointer;border:none;border-radius:14px;padding:10px 14px;font-weight:900;box-shadow:0 10px 22px #22c55e29}.pump-btn.wide{width:100%}.page-header{color:#fff;min-height:190px;box-shadow:var(--shadow-green);background:radial-gradient(circle at 100% 0,#ffffff38,#0000 30%),linear-gradient(135deg,#064e3b,#16a34a);border-radius:32px;justify-content:space-between;align-items:center;margin-bottom:24px;padding:36px;display:flex}.page-header h1{letter-spacing:-1px;margin:0 0 10px;font-size:42px}.page-header p{color:#ecfdf5;max-width:780px;margin:0;line-height:1.7}.toolbar{justify-content:space-between;gap:16px;margin-bottom:18px;display:flex}.search-box{background:#f8fafc;border:1px solid #e5e7eb;border-radius:16px;flex:1;align-items:center;gap:10px;padding:13px 15px;display:flex}.search-box input{width:100%;color:var(--text);background:0 0;border:none;outline:none}.search-box input::placeholder{color:#94a3b8}.toolbar select{color:var(--text);background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:13px 15px;font-weight:800}.control-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}@media (width<=1100px){.control-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=700px){.control-grid{grid-template-columns:1fr}}.control-card{border:1px solid var(--border);box-shadow:var(--shadow);background:#fff;border-radius:26px;padding:24px}.control-card h3{color:var(--text);margin:0 0 8px;font-size:22px}.control-card p{color:var(--muted)}.control-status{text-align:center;border-radius:16px;margin:18px 0;padding:15px;font-weight:900}.control-status.on{color:#0369a1;background:#e0f2fe}.control-status.off{color:#991b1b;background:#fee2e2}.report-grid,.comparison-grid{grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:22px;display:grid}.report-card,.comparison-card{border:1px solid var(--border);box-shadow:var(--shadow);background:#fff;border-radius:24px;padding:24px}.report-card p{color:var(--muted);margin:0 0 10px;font-weight:800}.report-card h2{color:var(--green-dark);margin:0;font-size:36px}.status-summary{gap:14px;display:grid}.status-box{border-radius:18px;align-items:center;gap:14px;padding:17px;display:flex}.status-box.normal{background:var(--green-soft);color:#166534}.status-box.warning{color:#854d0e;background:#fef9c3}.status-box.critical{color:#991b1b;background:#fee2e2}.status-box strong{font-size:18px;display:block}.status-box p{margin:3px 0 0}.conclusion-panel p{color:#475569;line-height:1.8}.report-note{color:var(--muted);background:#f8fafc;border-radius:16px;margin:18px 0;padding:15px;line-height:1.7}.comparison-card.selected{background:linear-gradient(#fff,#f0fdf4);border-color:#86efac}.comparison-top{justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:20px;display:flex}.comparison-top h3{color:var(--text);margin:0;font-size:24px}.comparison-top p{color:var(--muted);margin:6px 0 0}.comparison-top span{background:var(--green-soft);color:#166534;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:900}.comparison-content strong{color:var(--green-dark);margin-top:14px;display:block}.comparison-content p,.comparison-text{color:var(--muted);line-height:1.8}.about-grid{grid-template-columns:repeat(2,1fr);gap:20px;display:grid}.about-grid p,.about-list{color:var(--muted);line-height:1.85}.recharts-wrapper text{font-size:12px;font-weight:700}.recharts-cartesian-grid line{stroke:#e5e7eb}@media (width<=1200px){.navbar{grid-template-columns:1fr}.nav-links{justify-content:flex-start}.nav-live{width:fit-content}.home-hero,.main-grid,.chart-grid,.insight-grid,.report-layout{grid-template-columns:1fr}.summary-grid{grid-template-columns:repeat(3,1fr)}.feature-grid,.control-grid,.report-grid,.comparison-grid{grid-template-columns:repeat(2,1fr)}.hero{flex-direction:column;align-items:flex-start}.live-box{width:100%}}@media (width<=750px){.page,.dashboard{padding:16px}.home-hero,.hero,.page-header{border-radius:24px;padding:26px}.home-hero h1,.hero h1,.page-header h1{font-size:34px}.home-visual{display:none}.summary-grid,.feature-grid,.control-grid,.report-grid,.comparison-grid,.about-grid{grid-template-columns:1fr}.panel-title,.toolbar,.page-header{flex-direction:column}.lahan-3d-canvas{height:360px}.petak-detail-overlay{width:auto;margin:12px;position:static}}.home-showcase{grid-template-columns:.9fr 1.1fr;align-items:center;gap:24px;margin-bottom:24px;display:grid}.showcase-left{border:1px solid var(--border);min-height:410px;box-shadow:var(--shadow);background:#fff;border-radius:32px;padding:34px;position:relative;overflow:hidden}.showcase-left:after{content:"";background:#22c55e1f;border-radius:50%;width:220px;height:220px;position:absolute;top:-70px;right:-70px}.showcase-badge{z-index:2;background:var(--green-soft);color:#166534;border-radius:999px;margin-bottom:18px;padding:9px 13px;font-size:13px;font-weight:900;display:inline-flex;position:relative}.showcase-left h2{z-index:2;letter-spacing:-1.5px;color:var(--green-dark);margin:0 0 16px;font-size:clamp(32px,4vw,48px);line-height:1.05;position:relative}.showcase-left p{z-index:2;color:var(--muted);max-width:620px;margin:0;line-height:1.8;position:relative}.showcase-stats{z-index:2;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0;display:grid;position:relative}.showcase-stats div{background:#f8fafc;border:1px solid #e5e7eb;border-radius:18px;padding:16px}.showcase-stats strong{color:var(--green);margin-bottom:4px;font-size:24px;display:block}.showcase-stats span{color:var(--muted);font-size:13px;font-weight:700}.showcase-btn{z-index:2;color:#fff;background:linear-gradient(135deg, var(--green-dark), var(--green));border-radius:999px;padding:14px 18px;font-weight:900;display:inline-flex;position:relative;box-shadow:0 16px 30px #16a34a38}.farm-preview{min-height:410px;box-shadow:var(--shadow-green);transform-style:preserve-3d;perspective:900px;background:radial-gradient(circle at 70% 20%,#ffffff59,#0000 28%),linear-gradient(135deg,#064e3b,#16a34a 65%,#84cc16);border:1px solid #ffffff4d;border-radius:32px;padding:36px;position:relative;overflow:hidden}.farm-preview:before{content:"";opacity:.25;background-color:#0000;background-image:linear-gradient(#0000 0 94%,#ffffff29 95%),linear-gradient(90deg,#0000 0 94%,#ffffff29 95%);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:54px 54px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:absolute;inset:0}.farm-row{z-index:2;transform-origin:50%;grid-template-columns:repeat(3,1fr);gap:18px;display:grid;position:relative;transform:rotateX(55deg)rotate(-12deg)}.farm-row.second{margin-top:18px;transform:rotateX(55deg)rotate(-12deg)translate(45px)}.farm-plot{text-align:center;border-radius:24px;place-items:center;height:126px;padding:18px;animation:4s ease-in-out infinite floatPlot;display:grid;position:relative;transform:translateZ(0);box-shadow:0 18px #0478578c,0 28px 30px #0f172a38}.farm-plot.tall{height:150px}.farm-plot.normal{color:#166534;background:linear-gradient(135deg,#dcfce7,#86efac);border:2px solid #bbf7d0}.farm-plot.warning{color:#854d0e;background:linear-gradient(135deg,#fef9c3,#fde68a);border:2px solid #facc15}.farm-plot.critical{color:#991b1b;background:linear-gradient(135deg,#fee2e2,#fecaca);border:2px solid #f87171}.farm-plot svg{transform:rotateX(-55deg)rotate(12deg)}.farm-plot span{font-weight:900;transform:rotateX(-55deg)rotate(12deg)}.farm-plot small{opacity:.8;font-weight:800;transform:rotateX(-55deg)rotate(12deg)}.farm-plot:nth-child(2){animation-delay:.4s}.farm-plot:nth-child(3){animation-delay:.8s}@keyframes floatPlot{0%,to{translate:0}50%{translate:0 -8px}}.preview-glow{filter:blur(12px);background:#dcfce747;border-radius:50%;width:240px;height:240px;position:absolute;bottom:-70px;right:-70px}.lahan-3d-wrap{background:radial-gradient(circle at 50% 20%,#22c55e2e,#0000 35%),linear-gradient(#07130c,#0a160e);min-height:460px}.lahan-3d-canvas{min-height:460px}.land-panel{position:relative}.land-panel:after{content:"3D Interactive View";background:var(--green-soft);color:#166534;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:900;position:absolute;top:24px;right:26px}.panel,.summary-card,.feature-card,.report-card,.comparison-card,.control-card{transition:all .22s}.panel:hover,.summary-card:hover,.feature-card:hover,.report-card:hover,.comparison-card:hover,.control-card:hover{transform:translateY(-3px);box-shadow:0 24px 60px #0f172a1c}@media (width<=1200px){.home-showcase{grid-template-columns:1fr}}@media (width<=750px){.showcase-stats{grid-template-columns:1fr}.farm-preview{min-height:360px;padding:24px}.farm-row,.farm-row.second{grid-template-columns:1fr;margin-top:14px;transform:none}.farm-plot,.farm-plot.tall{height:120px;box-shadow:0 12px 20px #0f172a2e}.farm-plot svg,.farm-plot span,.farm-plot small{transform:none}}.farm-dashboard-visual{background:linear-gradient(#dff7ff 0%,#e9fbdc 45%,#86c96a 100%);border:1px solid #dceee1;border-radius:28px;overflow:hidden;box-shadow:0 24px 60px #0f172a1f}.farm-visual-header{color:#fff;background:#064e3beb;justify-content:space-between;align-items:center;padding:18px 22px;display:flex}.farm-visual-header h2{letter-spacing:-.5px;margin:0;font-size:24px}.farm-visual-header p{color:#dcfce7;margin:5px 0 0;font-size:13px}.weather-pill{background:#ffffff26;border-radius:999px;align-items:center;gap:8px;padding:10px 14px;font-weight:800;display:inline-flex}.farm-scene{min-height:680px;position:relative;overflow:hidden}.farm-background{background:linear-gradient(#fff3,#0000 45%),linear-gradient(#bdeeff 0%,#dff7ff 34%,#9bd46f 100%);position:absolute;inset:0}.sun-art{background:#fff6b7;border-radius:50%;width:110px;height:110px;position:absolute;top:35px;left:70px;box-shadow:0 0 60px #ffe650cc}.cloud{background:#ffffffb3;border-radius:999px;width:170px;height:48px;position:absolute}.cloud:before,.cloud:after{content:"";background:inherit;border-radius:50%;position:absolute}.cloud:before{width:68px;height:68px;top:-34px;left:28px}.cloud:after{width:88px;height:88px;top:-46px;right:22px}.cloud-one{top:70px;right:210px}.cloud-two{top:110px;left:240px;transform:scale(.75)}.mountain{background:#41826961;border-radius:55% 55% 0 0;width:600px;height:160px;position:absolute;bottom:360px}.mountain-one{left:-120px}.mountain-two{background:#2864554d;right:-120px}.barn{width:120px;height:110px;position:absolute;top:170px;right:180px}.barn-roof{clip-path:polygon(50% 0,100% 100%,0 100%);background:#9b3a2d;width:130px;height:58px}.barn-body{background:#b85a38;border:4px solid #7c2d12;border-radius:6px 6px 0 0;width:100px;height:70px;margin-top:-2px;margin-left:15px}.farm-land{transform-origin:bottom;background:linear-gradient(90deg,#3b82f659 0 4%,#0000 4% 48%,#3b82f659 48% 52%,#0000 52% 96%,#3b82f659 96%),#8ccf62;border-radius:34px;min-height:500px;padding:38px;position:absolute;bottom:42px;left:38px;right:220px;transform:perspective(1200px)rotateX(54deg)rotate(-2deg);box-shadow:0 32px #7b4a25,0 42px 40px #0f172a47}.farm-grid-map{z-index:2;grid-template-columns:repeat(4,1fr);gap:26px;display:grid;position:relative}.farm-plot-card{background:#6b3f1f;border:5px solid #8b5e34;border-radius:18px;min-height:230px;padding:14px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 4px #ffffff1f,0 14px 20px #0f172a29}.farm-plot-card:before{content:"";opacity:.4;background:repeating-linear-gradient(90deg,#ffffff14 0 4px,#0000 4px 18px);position:absolute;inset:20px 12px}.farm-plot-card.normal{border-color:#5f8f3b}.farm-plot-card.warning{border-color:#d3a327}.farm-plot-card.critical{border-color:#b94a48}.plot-label{z-index:6;color:#fff;background:#064e3beb;border-radius:14px;justify-content:space-between;align-items:center;margin-bottom:10px;padding:10px 12px;display:flex;position:relative;transform:rotate(2deg)}.plot-label strong{font-size:15px;display:block}.plot-label span{color:#bbf7d0;margin-top:2px;font-size:11px;display:block}.plot-label small{background:#22c55e;border-radius:999px;padding:5px 8px;font-size:10px;font-weight:900}.farm-plot-card.warning .plot-label small{color:#422006;background:#facc15}.farm-plot-card.critical .plot-label small{color:#fff;background:#ef4444}.crop-field{z-index:2;gap:10px;padding-top:8px;display:grid;position:relative}.crop-row{justify-content:space-around;gap:8px;display:flex}.crop-plant{width:18px;height:22px;display:block;position:relative;transform:rotateX(-54deg)rotate(2deg)}.crop-plant:before{content:"";background:#22c55e;border-radius:50% 50% 45% 45%;position:absolute;inset:0;box-shadow:0 10px #16653440}.chili .crop-plant:after,.tomato .crop-plant:after,.melon .crop-plant:after,.onion .crop-plant:after{content:"";border-radius:50%;width:10px;height:10px;position:absolute;top:9px;left:5px}.chili .crop-plant:after{background:#dc2626;border-radius:60% 60% 60% 10%}.tomato .crop-plant:after{background:#ef4444}.melon .crop-plant:after{background:#facc15;width:16px;height:16px;left:1px}.onion .crop-plant:after{background:#d97706}.paddy .crop-plant:before{background:linear-gradient(#84cc16,#16a34a);border-radius:999px;width:8px;height:32px}.corn .crop-plant:before{background:linear-gradient(#84cc16,#166534);border-radius:70% 70% 20% 20%;width:15px;height:36px}.lettuce .crop-plant:before{background:#65a30d;border-radius:50%;width:28px;height:24px}.kangkung .crop-plant:before{background:#16a34a;border-radius:999px;width:12px;height:32px}.sensor-device{z-index:7;place-items:center;display:grid;position:absolute;bottom:48px;right:18px;transform:rotateX(-54deg)rotate(2deg)}.wifi-wave{color:#fff;filter:drop-shadow(0 2px 4px #0006);animation:1.4s ease-in-out infinite wifiPulse}@keyframes wifiPulse{0%,to{opacity:.45;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}.sensor-box{color:#064e3b;background:#fff;border-radius:8px;padding:7px 9px;font-size:10px;font-weight:900;box-shadow:0 8px 14px #0f172a40}.sensor-stick{background:#94a3b8;border-radius:999px;width:5px;height:36px}.plot-stats{z-index:8;color:#fff;background:#064e3be6;border-radius:12px;grid-template-columns:repeat(3,1fr);gap:7px;padding:9px;display:grid;position:absolute;bottom:12px;left:14px;right:14px;transform:rotate(2deg)}.plot-stats div{justify-content:center;align-items:center;gap:4px;font-size:11px;font-weight:800;display:flex}.farm-side-panel{z-index:8;gap:12px;width:180px;display:grid;position:absolute;top:92px;right:22px}.side-card{color:#fff;background:#064e3be6;border-radius:14px;padding:14px;box-shadow:0 12px 22px #0f172a2e}.side-card p{color:#bbf7d0;margin:0 0 6px;font-size:12px}.side-card h3{margin:0;font-size:24px}.side-card.online h3{color:#86efac;align-items:center;gap:8px;font-size:20px;display:flex}.alert-mini{border-radius:9px;align-items:center;gap:6px;padding:8px 9px;font-size:12px;font-weight:900;display:flex}.alert-mini.danger{background:#ef4444}.alert-mini.safe{background:#22c55e}@media (width<=1200px){.farm-scene{min-height:auto;padding:20px}.farm-land{min-height:auto;position:relative;bottom:auto;left:auto;right:auto;transform:none}.farm-grid-map{grid-template-columns:repeat(2,1fr)}.farm-side-panel{grid-template-columns:repeat(2,1fr);width:auto;margin-top:18px;position:relative;top:auto;right:auto}}@media (width<=700px){.farm-visual-header{flex-direction:column;align-items:flex-start;gap:12px}.farm-grid-map,.farm-side-panel{grid-template-columns:1fr}}.farm-plot-card{cursor:pointer;text-align:left;border:none;transition:all .25s}.farm-plot-card:hover{filter:brightness(1.04);z-index:8;transform:translateY(-12px)scale(1.025)}.farm-plot-card.selected{outline:5px solid #fffc;animation:1.4s ease-in-out infinite selectedPulse;box-shadow:0 0 0 8px #22c55e47,0 26px 40px #0f172a47}@keyframes selectedPulse{0%,to{box-shadow:0 0 0 6px #22c55e38,0 26px 40px #0f172a3d}50%{box-shadow:0 0 0 13px #22c55e0f,0 30px 48px #0f172a52}}.crop-plant{transform-origin:bottom;animation:2.8s ease-in-out infinite plantSway}@keyframes plantSway{0%,to{translate:0;rotate:-2deg}50%{translate:0 -2px;rotate:3deg}}.cloud-one{animation:12s ease-in-out infinite alternate cloudMoveOne}.cloud-two{animation:14s ease-in-out infinite alternate cloudMoveTwo}@keyframes cloudMoveOne{0%{transform:translate(0)}to{transform:translate(-45px)}}@keyframes cloudMoveTwo{0%{transform:translate(0)scale(.75)}to{transform:translate(55px)scale(.75)}}.sun-art{animation:2.8s ease-in-out infinite sunGlow}@keyframes sunGlow{0%,to{box-shadow:0 0 45px #ffe650a6}50%{box-shadow:0 0 90px #ffe650f2}}.sensor-device{animation:2.2s ease-in-out infinite sensorFloat}@keyframes sensorFloat{0%,to{translate:0}50%{translate:0 -5px}}.sensor-box{position:relative}.sensor-box:after{content:"";border:2px solid #38bdf873;border-radius:12px;animation:1.4s ease-out infinite sensorPulseRing;position:absolute;inset:-7px}@keyframes sensorPulseRing{0%{opacity:.9;scale:.7}to{opacity:0;scale:1.45}}.water-main-line{z-index:4;opacity:.75;background:linear-gradient(90deg,#0ea5e91a,#0ea5e9e6,#0ea5e91a);border-radius:999px;height:8px;animation:1.1s linear infinite waterFlow;position:absolute;bottom:250px;left:33%;right:20%}.water-stream{z-index:5;pointer-events:none;background:linear-gradient(#0ea5e900,#0ea5e9d9,#0ea5e900);border-radius:999px;width:8px;height:90px;animation:.9s linear infinite waterDrop;position:absolute}.stream-one{bottom:56px;right:52px}.stream-two{animation-delay:.25s;bottom:70px;right:88px}@keyframes waterFlow{0%{filter:brightness();background-position:0 0}to{filter:brightness(1.25);background-position:80px 0}}@keyframes waterDrop{0%{opacity:0;transform:translateY(-20px)}35%{opacity:1}to{opacity:0;transform:translateY(30px)}}.plot-detail-popover{z-index:20;background:#fffffff5;border:1px solid #bbf7d0;border-radius:22px;width:310px;padding:18px;animation:.25s both popIn;position:absolute;top:92px;left:28px;box-shadow:0 24px 55px #0f172a38}@keyframes popIn{0%{opacity:0;transform:translateY(16px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.close-detail{color:#334155;cursor:pointer;background:#f1f5f9;border:none;border-radius:999px;place-items:center;width:30px;height:30px;display:grid;position:absolute;top:12px;right:12px}.detail-head{justify-content:space-between;gap:12px;margin-bottom:16px;padding-right:30px;display:flex}.detail-head span{color:#64748b;font-size:13px;font-weight:800}.detail-head h3{color:#064e3b;margin:3px 0 0;font-size:24px}.detail-status{border-radius:999px;height:fit-content;padding:7px 10px;font-size:12px;font-weight:900}.detail-status.normal{color:#166534;background:#dcfce7}.detail-status.warning{color:#854d0e;background:#fef9c3}.detail-status.critical{color:#991b1b;background:#fee2e2}.detail-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.detail-grid div{background:#f8fafc;border:1px solid #e5e7eb;border-radius:16px;padding:13px}.detail-grid svg{color:#16a34a}.detail-grid strong{color:#102018;margin-top:6px;font-size:20px;display:block}.detail-grid span{color:#64748b;font-size:12px;font-weight:700}.pump-detail{color:#166534;background:#ecfdf5;border-radius:16px;align-items:center;gap:8px;margin-top:13px;padding:13px;font-weight:800;display:flex}.detail-rec{color:#166534;background:#f0fdf4;border-radius:16px;margin:13px 0 0;padding:13px;font-size:14px;font-weight:700;line-height:1.6}.hint-card span{color:#dcfce7;font-size:12px;line-height:1.5}@media (width<=900px){.plot-detail-popover{width:auto;margin:16px;position:relative;top:auto;left:auto}.water-main-line{display:none}}.farm-dashboard-visual{background:linear-gradient(#ecfdf5 0%,#dff7e8 45%,#bbf7d0 100%)}.farm-scene{background:radial-gradient(circle at 0 0,#22c55e29,#0000 32%),radial-gradient(circle at 100% 0,#84cc161f,#0000 30%),linear-gradient(#f0fdf4 0%,#dcfce7 45%,#bbf7d0 100%);min-height:640px}.farm-background{background:linear-gradient(#ffffffb3,#dcfce799),radial-gradient(circle at 50% 10%,#22c55e24,#0000 35%)}.farm-bg-grid{opacity:.28;background-image:linear-gradient(#1665341f 1px,#0000 1px),linear-gradient(90deg,#1665341f 1px,#0000 1px);background-size:42px 42px;position:absolute;inset:0}.sun-art,.cloud,.mountain,.barn,.barn-roof,.barn-body{display:none!important}.farm-land{background:linear-gradient(90deg,#3b82f65c 0 4%,#0000 4% 48%,#3b82f65c 48% 52%,#0000 52% 96%,#3b82f65c 96%),repeating-linear-gradient(90deg,#16653414 0 18px,#ffffff0f 18px 28px),#8ccf62;min-height:510px;padding:42px;bottom:42px;left:46px;right:210px;box-shadow:0 34px #7b4a25,0 48px 46px #0f172a47}.farm-plot-card{min-height:245px;box-shadow:inset 0 0 0 4px #ffffff21,0 18px #58391f8c,0 28px 26px #0f172a38}.farm-plot-card:hover{transform:translateY(-18px)scale(1.03)}.farm-side-panel{top:88px}.farm3d-shell{background:#fff;border:1px solid #dceee1;border-radius:28px;overflow:hidden;box-shadow:0 24px 60px #0f172a1f}.farm3d-toolbar{color:#fff;background:linear-gradient(135deg,#064e3b,#16a34a);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.farm3d-toolbar strong{font-size:18px;display:block}.farm3d-toolbar span{color:#166534;margin-top:4px;font-size:13px;font-weight:700;display:block}.farm3d-canvas-wrap{background:#eef7ef;min-height:540px;position:relative}.farm3d-canvas-wrap canvas{cursor:grab;width:100%;height:540px;display:block}.farm3d-canvas-wrap canvas:active{cursor:grabbing}.farm3d-empty{text-align:center;z-index:10;color:#166534;background:linear-gradient(135deg,#f0fdf4,#dcfce7);place-items:center;display:grid;position:absolute;inset:0}.farm3d-empty strong{margin-top:12px;font-size:22px;display:block}.farm3d-empty p{color:#64748b;margin:8px 0 0}.farm3d-tooltip{color:#102018;z-index:20;background:#fffffff5;border:1px solid #bbf7d0;border-radius:18px;width:230px;padding:15px;position:absolute;bottom:18px;left:18px;box-shadow:0 20px 45px #0f172a2e}.farm3d-tooltip strong{color:#064e3b;margin-bottom:8px;font-size:18px;display:block}.farm3d-tooltip span{color:#475569;margin-top:5px;font-size:13px;font-weight:700;display:block}.premium-preview{background:radial-gradient(circle at 80% 15%,#dcfce773,#0000 28%),linear-gradient(135deg,#064e3b 0%,#15803d 52%,#84cc16 100%);border:1px solid #ffffff52;border-radius:34px;min-height:440px;padding:26px;position:relative;overflow:hidden;box-shadow:0 28px 70px #1665343d}.premium-preview:before{content:"";opacity:.5;background-image:linear-gradient(#ffffff17 1px,#0000 1px),linear-gradient(90deg,#ffffff17 1px,#0000 1px);background-size:52px 52px;position:absolute;inset:0}.preview-header-card{z-index:5;color:#fff;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#064e3bc7;border:1px solid #ffffff2e;border-radius:20px;justify-content:space-between;align-items:center;gap:34px;width:fit-content;min-width:280px;padding:14px 16px;display:flex;position:relative;box-shadow:0 18px 35px #0f172a2e}.preview-header-card span{color:#bbf7d0;font-size:12px;font-weight:800;display:block}.preview-header-card strong{margin-top:3px;font-size:17px;display:block}.preview-header-card small{color:#166534;background:#dcfce7;border-radius:999px;padding:8px 11px;font-weight:900}.preview-stage{z-index:3;height:350px;transform-style:preserve-3d;perspective:1100px;margin-top:14px;position:relative}.preview-grid{transform-origin:50%;grid-template-columns:repeat(3,1fr);gap:28px;display:grid;position:absolute;bottom:34px;left:22px;right:22px;transform:rotateX(58deg)rotate(-12deg)}.preview-plot{height:128px;transform-style:preserve-3d;border:none;border-radius:24px;animation:4s ease-in-out infinite plotFloat;position:relative}@keyframes plotFloat{0%,to{translate:0}50%{translate:0 -7px}}.preview-plot-top{border:3px solid #ffffff38;border-radius:24px;position:absolute;inset:0;overflow:hidden;transform:translateZ(22px);box-shadow:inset 0 0 0 4px #ffffff1f,0 18px 24px #0f172a33}.preview-plot-side{transform-origin:top;filter:brightness(.85);background:#7b4a25;border-radius:0 0 18px 18px;height:42px;position:absolute;bottom:-24px;left:10px;right:10px;transform:rotateX(-90deg)}.preview-plot.normal .preview-plot-top{background:linear-gradient(135deg,#bbf7d0e0,#22c55ee6),repeating-linear-gradient(90deg,#1665342e 0 7px,#0000 7px 18px);border-color:#86efac}.preview-plot.warning .preview-plot-top{background:linear-gradient(135deg,#fef9c3eb,#facc15e0),repeating-linear-gradient(90deg,#854d0e24 0 7px,#0000 7px 18px);border-color:#facc15}.preview-plot.critical .preview-plot-top{background:linear-gradient(135deg,#fecacaf2,#f87171e6),repeating-linear-gradient(90deg,#7f1d1d21 0 7px,#0000 7px 18px);border-color:#f87171}.mini-rice-field{grid-template-columns:repeat(4,1fr);gap:7px;display:grid;position:absolute;inset:18px 18px 34px}.mini-rice{transform-origin:bottom;background:linear-gradient(#d9f99d,#15803d);border-radius:999px;width:9px;height:24px;margin:auto;animation:2.4s ease-in-out infinite miniRiceSway;position:relative;box-shadow:7px 3px #16653473,-6px 5px #84cc16a6}.preview-plot.warning .mini-rice{background:linear-gradient(#fef08a,#ca8a04)}.preview-plot.critical .mini-rice{background:linear-gradient(#fecaca,#b91c1c)}@keyframes miniRiceSway{0%,to{rotate:-3deg}50%{rotate:5deg}}.preview-sensor{place-items:center;display:grid;position:absolute;bottom:30px;right:16px;transform:rotateX(-58deg)rotate(12deg)}.sensor-mini-box{background:#fff;border-radius:6px;width:24px;height:19px;box-shadow:0 8px 16px #0f172a38}.sensor-signal{border:3px solid #0ea5e9d9;border-color:#0ea5e9d9 #0ea5e9d9 #0000 #0000;border-radius:50%;width:18px;height:18px;animation:1.4s ease-in-out infinite signalPulse;position:absolute;top:-22px}@keyframes signalPulse{0%,to{opacity:.45;scale:.78}50%{opacity:1;scale:1.16}}.preview-plot-label{color:#fff;background:#064e3be0;border-radius:14px;padding:8px 10px;position:absolute;bottom:10px;left:14px;right:14px;transform:rotateX(-58deg)rotate(12deg);box-shadow:0 10px 20px #0f172a38}.preview-plot-label strong{font-size:13px;line-height:1;display:block}.preview-plot-label small{color:#bbf7d0;margin-top:4px;font-size:10px;font-weight:900;display:block}.preview-water-line{z-index:1;background:linear-gradient(90deg,#0ea5e90d,#0ea5e9e6,#0ea5e90d);border-radius:999px;height:9px;animation:1.2s linear infinite previewWater;position:absolute;box-shadow:0 0 20px #0ea5e966}.water-a{bottom:126px;left:90px;right:130px;transform:rotate(-12deg)}.water-b{opacity:.75;width:260px;bottom:218px;left:230px;transform:rotate(68deg)}@keyframes previewWater{0%{filter:brightness(.9)}to{filter:brightness(1.35)}}.preview-floating-card{z-index:8;color:#064e3b;background:#ffffffeb;border:1px solid #bbf7d0;border-radius:999px;align-items:center;gap:7px;padding:10px 13px;font-weight:900;animation:3s ease-in-out infinite floatingCard;display:inline-flex;position:absolute;box-shadow:0 16px 35px #0f172a2b}.card-temp{top:56px;right:26px}.card-water{animation-delay:.6s;bottom:38px;left:44px}@keyframes floatingCard{0%,to{translate:0}50%{translate:0 -8px}}.premium-preview .farm-row,.premium-preview .farm-plot,.premium-preview .farm-plot span,.premium-preview .farm-plot small{all:unset}.smart-preview{background:radial-gradient(circle at 85% 10%,#22c55e4d,#0000 30%),linear-gradient(135deg,#064e3b,#16a34a 55%,#84cc16);border:1px solid #ffffff47;border-radius:34px;min-height:440px;padding:24px;position:relative;overflow:hidden;box-shadow:0 28px 70px #1665343d}.smart-preview:before{content:"";opacity:.5;background-image:linear-gradient(#ffffff14 1px,#0000 1px),linear-gradient(90deg,#ffffff14 1px,#0000 1px);background-size:44px 44px;position:absolute;inset:0}.smart-preview-top{z-index:4;justify-content:space-between;align-items:center;gap:14px;margin-bottom:20px;display:flex;position:relative}.smart-preview-top span{color:#bbf7d0;font-size:13px;font-weight:900;display:block}.smart-preview-top h3{color:#fff;letter-spacing:-.7px;margin:4px 0 0;font-size:24px}.preview-live-badge{color:#064e3b;background:#dcfce7;border-radius:999px;align-items:center;gap:8px;padding:10px 14px;font-weight:900;display:inline-flex;box-shadow:0 12px 25px #0f172a24}.preview-live-badge span{background:#22c55e;border-radius:999px;width:9px;height:9px;animation:1.4s ease-in-out infinite livePulse;box-shadow:0 0 0 6px #22c55e2e}@keyframes livePulse{0%,to{opacity:1;scale:1}50%{opacity:.55;scale:.75}}.smart-preview-content{z-index:3;grid-template-columns:1.3fr .85fr;gap:20px;min-height:335px;display:grid;position:relative}.farm-board{background:linear-gradient(135deg,#ffffff2e,#ffffff14),#ffffff1a;border:1px solid #ffffff38;border-radius:28px;grid-template-columns:repeat(2,1fr);gap:14px;min-height:335px;padding:18px;display:grid;position:relative;overflow:hidden}.modern-plot{text-align:left;cursor:pointer;border:none;border-radius:24px;min-height:145px;padding:14px;transition:all .25s;animation:.55s both plotAppear;position:relative;overflow:hidden;box-shadow:0 18px 34px #0f172a2e}@keyframes plotAppear{0%{opacity:0;transform:translateY(16px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.modern-plot:hover{transform:translateY(-6px);box-shadow:0 24px 45px #0f172a3d}.modern-plot.normal{background:radial-gradient(circle at 90% 10%,#fff6,#0000 30%),linear-gradient(135deg,#dcfce7,#86efac)}.modern-plot.warning{background:radial-gradient(circle at 90% 10%,#ffffff73,#0000 30%),linear-gradient(135deg,#fef9c3,#fde68a)}.modern-plot.critical{background:radial-gradient(circle at 90% 10%,#ffffff73,#0000 30%),linear-gradient(135deg,#fee2e2,#fca5a5)}.plot-head strong{color:#064e3b;font-size:16px;font-weight:900}.plot-head span{color:#fff;background:#064e3bdb;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:900}.plant-area{grid-template-columns:repeat(6,1fr);gap:6px;display:grid;position:absolute;bottom:34px;left:16px;right:72px}.plant-blade{transform-origin:bottom;background:linear-gradient(#f7fee7,#15803d);border-radius:999px 999px 2px 2px;width:8px;height:27px;margin:auto;animation:2.4s ease-in-out infinite bladeMove;display:block;box-shadow:8px 3px #16653473,-6px 6px #84cc168c}.warning .plant-blade{background:linear-gradient(#fef08a,#ca8a04)}.critical .plant-blade{background:linear-gradient(#fecaca,#b91c1c)}@keyframes bladeMove{0%,to{rotate:-3deg}50%{rotate:5deg}}.iot-node{z-index:5;width:42px;height:52px;position:absolute;bottom:45px;right:18px}.node-box{background:#fff;border-radius:9px;width:28px;height:22px;position:absolute;bottom:0;left:7px;box-shadow:0 10px 20px #0f172a33}.node-box:after{content:"";background:#64748b;border-radius:999px;width:4px;height:24px;position:absolute;bottom:-22px;left:12px}.signal{opacity:0;border:3px solid #0ea5e9;border-color:#0ea5e9 #0ea5e9 #0000 #0000;border-radius:50%;position:absolute;left:9px;transform:rotate(-45deg)}.signal-a{width:24px;height:24px;animation:1.4s ease-in-out infinite signalWave;top:2px}.signal-b{width:38px;height:38px;animation:1.4s ease-in-out .25s infinite signalWave;top:-7px;left:2px}@keyframes signalWave{0%{opacity:0;scale:.7}45%{opacity:1}to{opacity:0;scale:1.1}}.water-animation{width:40px;height:70px;position:absolute;bottom:32px;right:58px}.water-animation span{background:linear-gradient(#0ea5e900,#0ea5e9);border-radius:999px;width:7px;height:26px;animation:.85s linear infinite waterDropMini;position:absolute}.water-animation span:first-child{left:0}.water-animation span:nth-child(2){animation-delay:.2s;left:14px}.water-animation span:nth-child(3){animation-delay:.4s;left:28px}@keyframes waterDropMini{0%{opacity:0;transform:translateY(-10px)}40%{opacity:1}to{opacity:0;transform:translateY(32px)}}.plot-mini-stats{z-index:6;justify-content:space-between;gap:8px;display:flex;position:absolute;bottom:12px;left:14px;right:14px}.plot-mini-stats span{color:#064e3b;background:#ffffffb8;border-radius:999px;padding:6px 9px;font-size:12px;font-weight:900}.rain-line{z-index:1;background:linear-gradient(90deg,#0ea5e900,#0ea5e9d9,#0ea5e900);border-radius:999px;height:8px;animation:1.2s linear infinite flowMove;position:absolute}.rain-two{opacity:.6;width:45%;top:70%;left:25%;transform:rotate(90deg)}@keyframes flowMove{0%{filter:brightness(.8)}to{filter:brightness(1.4)}}.preview-info-panel{color:#102018;background:#fffffff0;border:1px solid #ffffff8c;border-radius:28px;min-height:335px;padding:20px;animation:3.5s ease-in-out infinite infoPanelFloat;box-shadow:0 22px 45px #0f172a24}@keyframes infoPanelFloat{0%,to{translate:0}50%{translate:0 -7px}}.info-status{color:#fff;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:900;display:inline-flex}.info-status.normal{background:#16a34a}.info-status.warning{background:#f59e0b}.info-status.critical{background:#ef4444}.preview-info-panel h4{color:#064e3b;letter-spacing:-.7px;margin:14px 0 8px;font-size:28px}.preview-info-panel p{color:#64748b;margin:0;font-size:14px;line-height:1.7}.info-metrics{grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px;display:grid}.info-metrics div{background:#f8fafc;border:1px solid #e5e7eb;border-radius:18px;padding:13px}.info-metrics svg{color:#16a34a}.info-metrics strong{color:#102018;margin-top:6px;font-size:20px;display:block}.info-metrics span{color:#64748b;font-size:12px;font-weight:800}.preview-progress{background:#f0fdf4;border-radius:18px;margin-top:18px;padding:14px}.preview-progress>div:first-child{color:#166534;justify-content:space-between;margin-bottom:9px;font-size:13px;font-weight:900;display:flex}.progress-track{background:#dcfce7;border-radius:999px;height:10px;overflow:hidden}.progress-track div{border-radius:inherit;background:linear-gradient(90deg,#16a34a,#84cc16);height:100%;transition:all .35s}@media (width<=1100px){.smart-preview-content{grid-template-columns:1fr}.farm-board{min-height:430px}}@media (width<=650px){.farm-board{grid-template-columns:1fr}.smart-preview-top{flex-direction:column;align-items:flex-start}}.home-showcase{align-items:stretch}.smart-preview{border-radius:32px;min-height:430px;padding:22px}.smart-preview-top{margin-bottom:16px}.smart-preview-top h3{font-size:22px}.smart-preview-content{grid-template-columns:1.15fr .85fr;gap:16px;min-height:320px}.farm-board{border-radius:24px;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-height:320px;padding:16px}.modern-plot{border-radius:20px;min-height:138px;padding:13px}.plot-head strong{font-size:14px}.plot-head span{padding:5px 8px;font-size:10px}.iot-node{bottom:48px;right:16px;scale:.9}.plot-mini-stats span{padding:5px 8px;font-size:11px}.preview-info-panel{border-radius:24px;min-height:320px;padding:18px}.info-metrics{gap:10px;margin-top:14px}.rain-line{opacity:.45}.preview-info-panel{animation:none}@media (width<=1200px){.smart-preview-content{grid-template-columns:1fr}.farm-board{min-height:340px}.preview-info-panel{min-height:auto}}@media (width<=700px){.smart-preview{padding:16px}.farm-board{grid-template-columns:1fr;min-height:auto}.modern-plot{min-height:135px}.info-metrics{grid-template-columns:1fr}}.smart-preview{border-radius:34px;min-height:430px;padding:26px;overflow:hidden}.smart-preview-content{grid-template-columns:1fr .72fr;align-items:stretch;gap:22px}.farm-board{--mx:0;--my:0;background:radial-gradient(circle at calc(50% + (var(--mx) * 18%)) calc(50% + (var(--my) * 18%)), #ffffff42, transparent 38%), #ffffff21;min-height:340px;transform:perspective(900px) rotateX(calc(var(--my) * -3deg)) rotateY(calc(var(--mx) * 3deg));transform-style:preserve-3d;border-radius:30px;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:18px;transition:transform .15s,background .2s}.modern-plot{border-radius:24px;min-height:142px;padding:14px;overflow:hidden;transform:translateZ(0)}.plot-head{align-items:center}.plot-head strong{color:#064e3b;white-space:nowrap;max-width:90px;font-size:14px}.plot-head span{flex-shrink:0;padding:5px 8px;font-size:10px}.plant-area{grid-template-columns:repeat(4,1fr);gap:5px 8px;bottom:47px;left:18px;right:78px}.plant-blade{width:6px;height:21px;box-shadow:6px 3px #16653461,-5px 5px #84cc167a}.iot-node{width:34px;height:46px;bottom:52px;right:20px;scale:.82}.plot-mini-stats{bottom:12px;left:14px;right:14px}.rain-two{width:34%;top:70%;left:34%}.preview-info-panel{border-radius:28px;min-height:340px;padding:20px;animation:none}.preview-info-panel h4{margin:12px 0 8px;font-size:25px}.info-metrics strong{font-size:18px}.preview-progress{margin-top:14px;padding:13px}.modern-plot:after{content:"";opacity:.5;pointer-events:none;background:radial-gradient(circle at 80% 10%,#ffffff80,#0000 28%);position:absolute;inset:0}.modern-plot.active:before{content:"";pointer-events:none;background:conic-gradient(#0000,#ffffff73,#0000);animation:2.2s linear infinite activeSweep;position:absolute;inset:-40%}@keyframes activeSweep{to{rotate:360deg}}.plot-head,.plant-area,.iot-node,.water-animation,.plot-mini-stats{z-index:3;position:absolute}.plot-head{position:relative}@media (width<=1200px){.smart-preview-content{grid-template-columns:1fr}.farm-board{transform:none}}@media (width<=700px){.farm-board{grid-template-columns:1fr;min-height:auto}.modern-plot{min-height:145px}}.home-showcase{grid-template-columns:.9fr 1.1fr;align-items:stretch;gap:26px}.smart-preview{overflow:hidden;background:radial-gradient(circle at 100% 0,#84cc1652,#0000 35%),linear-gradient(135deg,#064e3b 0%,#15803d 58%,#84cc16 100%)!important;border-radius:34px!important;min-height:420px!important;padding:22px!important}.smart-preview-top{align-items:center;margin-bottom:14px!important}.smart-preview-top span{font-size:12px!important}.smart-preview-top h3{line-height:1.1;margin-top:4px!important;font-size:22px!important}.preview-live-badge{padding:8px 13px!important;font-size:13px!important}.smart-preview-content{grid-template-columns:minmax(0,1fr) 280px!important;align-items:stretch!important;gap:18px!important;min-height:320px!important;display:grid!important}.farm-board{--mx:0;--my:0;transform:perspective(900px) rotateX(calc(var(--my) * -2.5deg)) rotateY(calc(var(--mx) * 2.5deg));background:radial-gradient(circle at calc(50% + (var(--mx) * 16%)) calc(50% + (var(--my) * 16%)), #ffffff38, transparent 38%), #ffffff24!important;border-radius:28px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:13px!important;min-height:320px!important;padding:16px!important;transition:transform .15s,background .2s!important;overflow:hidden!important}.modern-plot{border-radius:22px!important;min-height:135px!important;padding:13px!important;overflow:hidden!important;box-shadow:0 16px 28px #0f172a29!important}.modern-plot:hover{transform:translateY(-4px)scale(1.01)!important}.modern-plot.active{outline:3px solid #ffffffe6!important;box-shadow:0 0 0 5px #dcfce73d,0 22px 36px #0f172a38!important}.plot-head{z-index:6!important;justify-content:space-between!important;align-items:center!important;gap:8px!important;display:flex!important;position:relative!important}.plot-head strong{white-space:nowrap!important;color:#064e3b!important;max-width:78px!important;font-size:13px!important;font-weight:900!important}.plot-head span{border-radius:999px!important;flex-shrink:0!important;padding:5px 7px!important;font-size:9px!important}.plant-area{z-index:3!important;grid-template-columns:repeat(4,1fr)!important;gap:4px 7px!important;display:grid!important;position:absolute!important;bottom:43px!important;left:18px!important;right:72px!important}.plant-blade{width:5px!important;height:20px!important;margin:auto!important;box-shadow:6px 3px #16653457,-5px 5px #84cc166b!important}.iot-node{z-index:5!important;width:32px!important;height:44px!important;bottom:48px!important;right:17px!important;scale:.78!important}.node-box{border-radius:8px!important;width:25px!important;height:19px!important}.node-box:after{height:21px!important}.signal-a{width:20px!important;height:20px!important}.signal-b{width:31px!important;height:31px!important}.plot-mini-stats{z-index:7!important;bottom:10px!important;left:13px!important;right:13px!important}.plot-mini-stats span{background:#ffffffdb!important;padding:5px 8px!important;font-size:10px!important}.rain-line{opacity:.18!important;height:5px!important}.rain-one{width:50%!important;top:51%!important;left:25%!important}.rain-two{display:none!important}.water-animation{opacity:.75!important;bottom:30px!important;right:50px!important;scale:.72!important}.preview-info-panel{border-radius:26px!important;min-height:320px!important;padding:18px!important;animation:none!important;overflow:hidden!important}.info-status{padding:7px 10px!important;font-size:11px!important}.preview-info-panel h4{margin:13px 0 8px!important;font-size:23px!important;line-height:1.1!important}.preview-info-panel p{font-size:12.5px!important;line-height:1.55!important}.info-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;margin-top:14px!important}.info-metrics div{border-radius:16px!important;padding:11px!important}.info-metrics svg{width:16px!important;height:16px!important}.info-metrics strong{margin-top:5px!important;font-size:17px!important}.info-metrics span{font-size:11px!important}.preview-progress{border-radius:16px!important;margin-top:13px!important;padding:12px!important}.preview-progress>div:first-child{font-size:12px!important}.progress-track{height:9px!important}.modern-plot.active:before{display:none!important}.modern-plot:after{opacity:.32!important}@media (width<=1250px){.smart-preview-content{grid-template-columns:1fr!important}.preview-info-panel{min-height:auto!important}}@media (width<=720px){.farm-board{grid-template-columns:1fr!important}.modern-plot{min-height:130px!important}}.home-system-preview{--mx:0;--my:0;background:radial-gradient(circle at calc(70% + (var(--mx) * 10%)) calc(20% + (var(--my) * 10%)), #bbf7d059, transparent 35%), linear-gradient(135deg, #064e3b 0%, #15803d 55%, #84cc16 100%);min-height:430px;transform:perspective(1000px) rotateX(calc(var(--my) * -2deg)) rotateY(calc(var(--mx) * 2deg));border:1px solid #ffffff47;border-radius:34px;padding:26px;transition:transform .15s,background .2s;position:relative;overflow:hidden;box-shadow:0 28px 70px #1665343d}.home-system-preview:before{content:"";opacity:.45;background-image:linear-gradient(#ffffff14 1px,#0000 1px),linear-gradient(90deg,#ffffff14 1px,#0000 1px);background-size:48px 48px;position:absolute;inset:0}.system-orb{filter:blur(4px);opacity:.45;pointer-events:none;border-radius:50%;position:absolute}.orb-one{background:#bbf7d0;width:170px;height:170px;animation:5s ease-in-out infinite orbFloat;top:-45px;right:-55px}.orb-two{background:#84cc16;width:130px;height:130px;animation:6s ease-in-out infinite reverse orbFloat;bottom:-35px;left:-35px}@keyframes orbFloat{0%,to{transform:translate(0)}50%{transform:translate(16px,-16px)}}.system-preview-top{z-index:2;justify-content:space-between;align-items:center;gap:14px;margin-bottom:22px;display:flex;position:relative}.system-preview-top span{color:#bbf7d0;font-size:13px;font-weight:900}.system-preview-top h3{color:#fff;letter-spacing:-.8px;margin:4px 0 0;font-size:28px}.system-status{color:#064e3b;white-space:nowrap;background:#dcfce7;border-radius:999px;align-items:center;gap:8px;padding:10px 14px;font-weight:900;display:inline-flex;box-shadow:0 14px 28px #0f172a24}.system-status span{background:#22c55e;border-radius:999px;width:9px;height:9px;animation:1.4s ease-in-out infinite livePulse;box-shadow:0 0 0 6px #22c55e2e}.system-flow-area{z-index:2;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px;display:grid;position:relative}.flow-line{background:#dcfce740;border-radius:999px;height:5px;position:absolute;top:50%;left:8%;right:8%;overflow:hidden}.flow-line i{background:linear-gradient(90deg,#0000,#dcfce7,#0000);animation:1.7s linear infinite flowSlide;display:block;position:absolute;inset:0}@keyframes flowSlide{0%{transform:translate(-100%)}to{transform:translate(100%)}}.flow-step{z-index:3;color:#064e3b;text-align:left;cursor:pointer;background:#ffffffeb;border:none;border-radius:24px;min-height:145px;padding:16px;transition:all .25s;animation:.55s both flowStepIn;position:relative;overflow:hidden;box-shadow:0 18px 35px #0f172a24}.flow-step:after{content:"";opacity:0;background:radial-gradient(circle at 85% 10%,#22c55e38,#0000 32%);transition:all .25s;position:absolute;inset:0}.flow-step:hover{transform:translateY(-7px);box-shadow:0 24px 45px #0f172a33}.flow-step:hover:after{opacity:1}.flow-step.active{background:#fff;outline:4px solid #bbf7d0bf;box-shadow:0 0 0 7px #bbf7d038,0 24px 45px #0f172a38}@keyframes flowStepIn{0%{opacity:0;transform:translateY(14px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.flow-icon{color:#16a34a;z-index:2;background:#dcfce7;border-radius:16px;place-items:center;width:46px;height:46px;margin-bottom:14px;display:grid;position:relative}.flow-step.active .flow-icon{color:#fff;background:linear-gradient(135deg,#16a34a,#84cc16);animation:1.6s ease-in-out infinite iconBounce}@keyframes iconBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.flow-step strong{z-index:2;font-size:16px;font-weight:900;display:block;position:relative}.flow-step span{color:#64748b;z-index:2;margin-top:5px;font-size:12px;font-weight:800;display:block;position:relative}.step-number{color:#064e3b29;font-size:28px;font-weight:900;position:absolute;bottom:12px;right:14px}.system-detail-card{z-index:2;background:#fffffff0;border:1px solid #fff9;border-radius:28px;padding:20px;animation:.28s both detailPop;position:relative;box-shadow:0 22px 45px #0f172a24}@keyframes detailPop{0%{opacity:.4;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.detail-main{align-items:center;gap:14px;margin-bottom:12px;display:flex}.detail-icon{color:#fff;background:linear-gradient(135deg,#064e3b,#16a34a);border-radius:20px;place-items:center;width:58px;height:58px;display:grid;box-shadow:0 14px 28px #16a34a38}.detail-main span{color:#64748b;font-size:12px;font-weight:900}.detail-main h4{color:#064e3b;letter-spacing:-.7px;margin:3px 0 0;font-size:26px}.system-detail-card p{color:#64748b;margin:0;font-size:14px;line-height:1.65}.detail-tags{flex-wrap:wrap;gap:9px;margin-top:16px;display:flex}.detail-tags span{color:#166534;background:#f0fdf4;border-radius:999px;align-items:center;gap:6px;padding:8px 10px;font-size:12px;font-weight:900;transition:all .2s;display:inline-flex}.detail-tags span:hover{background:#dcfce7;transform:translateY(-3px)}@media (width<=1100px){.system-flow-area{grid-template-columns:repeat(2,1fr)}.flow-line{display:none}}@media (width<=650px){.system-preview-top{flex-direction:column;align-items:flex-start}.system-flow-area{grid-template-columns:1fr}}.premium-status-chart{background:radial-gradient(circle at 100% 0,#22c55e1f,#0000 40%),linear-gradient(135deg,#f8fafc,#fff);border:1px solid #e5e7eb;border-radius:28px;grid-column:1/-1;grid-template-columns:1.2fr 1fr;align-items:center;gap:32px;margin-top:18px;padding:32px;display:grid}.status-chart-left{flex-direction:column;justify-content:space-between;height:100%;display:flex}.status-chart-head{justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:24px;display:flex}.status-chart-head h4{color:#064e3b;margin:0;font-size:22px;font-weight:900}.status-chart-head p{color:#64748b;margin:6px 0 0;font-size:14px;font-weight:700}.status-chart-head>span{color:#166534;white-space:nowrap;background:#dcfce7;border-radius:999px;padding:10px 16px;font-size:13px;font-weight:900}.pie-layout{place-items:center;height:260px;display:grid;position:relative}.pie-center-info{text-align:center;background:#fff;border-radius:50%;place-items:center;width:124px;height:124px;display:grid;position:absolute;box-shadow:inset 0 0 0 1px #e5e7eb,0 18px 35px #0f172a14}.pie-center-info strong{color:#064e3b;font-size:34px;font-weight:900;line-height:1;display:block}.pie-center-info span{color:#64748b;margin-top:-16px;font-size:12px;font-weight:800;display:block}.status-legend{grid-template-columns:repeat(3,1fr);gap:12px;margin-top:auto;display:grid}.legend-item{background:#fff;border:1px solid #e5e7eb;border-radius:20px;align-items:center;gap:12px;padding:14px;transition:all .3s;display:flex;box-shadow:0 4px 12px #0f172a08}.legend-item:hover{transform:translateY(-3px);box-shadow:0 12px 24px #0f172a14}.legend-item>span{border-radius:999px;flex-shrink:0;width:14px;height:14px}.legend-item.normal>span{background:#22c55e;box-shadow:0 0 0 5px #22c55e24}.legend-item.waspada>span{background:#facc15;box-shadow:0 0 0 5px #facc1524}.legend-item.kritis>span{background:#ef4444;box-shadow:0 0 0 5px #ef444424}.legend-item strong{color:#102018;font-size:22px;line-height:1;display:block}.legend-item p{color:#64748b;margin:4px 0 0;font-size:12px;font-weight:800}@media (width<=900px){.premium-status-chart{grid-template-columns:1fr}}@media (width<=700px){.status-legend{grid-template-columns:1fr}}.sensor-table-section{box-shadow:var(--shadow);background:#fff;border:1px solid #e5e7eb;border-radius:28px;margin-bottom:22px;overflow:hidden}.table-header-card{background:linear-gradient(135deg,#fff,#f8fafc);border-bottom:1px solid #f1f5f9;justify-content:space-between;align-items:center;padding:24px 32px;display:flex}.table-title-area{align-items:center;gap:16px;display:flex}.title-icon-box{color:#10b981;background:#ecfdf5;border-radius:14px;justify-content:center;align-items:center;width:48px;height:48px;display:flex;box-shadow:0 4px 12px #10b9811f}.table-title-area h3{color:#0f172a;margin:0;font-size:20px;font-weight:900}.table-title-area span{color:#64748b;margin-top:4px;font-size:13px;font-weight:600;display:block}.table-badges{align-items:center;gap:12px;display:flex}.live-badge{color:#166534;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:999px;align-items:center;gap:8px;padding:8px 16px;font-size:12px;font-weight:700;display:flex}.pulse-dot{background:#22c55e;border-radius:50%;width:8px;height:8px;animation:2s infinite pulse-green;box-shadow:0 0 #22c55e66}@keyframes pulse-green{0%{box-shadow:0 0 #22c55e66}70%{box-shadow:0 0 0 10px #22c55e00}to{box-shadow:0 0 #22c55e00}}.premium-table-wrapper{border:none;padding:0}.premium-table-wrapper table{margin-bottom:0}.premium-table-wrapper th{color:#475569;text-transform:uppercase;letter-spacing:.5px;background:#f8fafc;border-bottom:2px solid #e2e8f0;padding:16px 24px;font-weight:800}.premium-table-wrapper td{color:#334155;border-bottom:1px solid #f1f5f9;padding:16px 24px;font-weight:600}.premium-table-wrapper tbody tr:hover td{background-color:#f8fafc}.premium-table-wrapper tbody tr:last-child td{border-bottom:none}.empty-state-td{text-align:center;color:#94a3b8;padding:48px 24px!important}.empty-state-td p{margin-top:12px;font-weight:600}@media (width<=768px){.table-header-card{flex-direction:column;align-items:flex-start;gap:16px}}.control-page-header{gap:24px}.control-header-actions{align-items:center;gap:18px;display:flex}.auto-run-btn{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff29;border:1px solid #ffffff52;border-radius:15px;align-items:center;gap:9px;padding:13px 17px;font-weight:900;display:inline-flex}.auto-run-btn:hover{background:#ffffff3d}.smart-control-card{flex-direction:column;gap:18px;display:flex}.control-card-top{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.control-card-subtitle{margin:0;font-size:13px}.mode-btn{cursor:pointer;border:none;border-radius:999px;align-items:center;gap:6px;padding:9px 12px;font-size:12px;font-weight:900;display:inline-flex}.mode-btn.manual{color:#854d0e;background:#fef9c3}.mode-btn.auto{color:#166534;background:#dcfce7}.sensor-mini-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.sensor-mini-grid div{background:#f8fafc;border:1px solid #e5e7eb;border-radius:14px;padding:11px}.sensor-mini-grid span{color:#64748b;margin-bottom:5px;font-size:11px;font-weight:700;display:block}.sensor-mini-grid strong{color:#102018;font-size:15px}.device-control-grid{gap:11px;display:grid}.device-control{background:#fff;border:1px solid #e5e7eb;border-radius:17px;padding:13px}.device-control-head{align-items:center;gap:10px;margin-bottom:11px;display:flex}.device-control-head span{color:#64748b;font-size:12px;font-weight:800;display:block}.device-control-head strong{margin-top:2px;font-size:14px;display:block}.device-icon{color:#166534;background:#dcfce7;border-radius:12px;place-items:center;width:37px;height:37px;display:grid}.device-on{color:#15803d}.device-off{color:#dc2626}.device-action-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#064e3b,#16a34a);border:none;border-radius:12px;width:100%;padding:10px 12px;font-size:12px;font-weight:900}.device-action-btn:disabled{color:#94a3b8;cursor:not-allowed;background:#e2e8f0;transform:none}.auto-mode-note,.manual-mode-note{border-radius:13px;padding:11px;font-size:12px;font-weight:700;line-height:1.5}.auto-mode-note{color:#166534;background:#dcfce7}.manual-mode-note{color:#854d0e;background:#fef9c3}@media (width<=900px){.control-header-actions{justify-content:space-between;width:100%}.auto-run-btn{font-size:12px}}.control-page{padding-top:105px}.smart-summary-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.icon-box.sky{color:#0369a1;background:#e0f2fe}.icon-box.amber{color:#b45309;background:#fef3c7}.icon-box.lime{color:#4d7c0f;background:#ecfccb}.smart-main-grid{grid-template-columns:minmax(0,1.65fr) minmax(290px,.75fr)}.upgraded-land-panel{overflow:hidden}.device-overview-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px;display:grid}.device-overview-card{box-shadow:var(--shadow);background:#fffffff0;border:1px solid #e5e7eb;border-radius:22px;align-items:center;gap:14px;padding:18px;display:flex}.device-overview-card svg{border-radius:15px;width:46px;height:46px;padding:11px}.device-overview-card span{color:#64748b;font-size:12px;font-weight:800;display:block}.device-overview-card strong{color:#102018;margin-top:4px;font-size:19px;display:block}.pump-card svg{color:#166534;background:#dcfce7}.fan-card svg{color:#0369a1;background:#e0f2fe}.lamp-card svg{color:#b45309;background:#fef3c7}.auto-card svg{color:#4d7c0f;background:#ecfccb}.dashboard-status-chart{margin:0 0 22px}.mode-table{border-radius:999px;padding:7px 10px;font-size:11px;font-weight:900;display:inline-flex}.mode-table.auto{color:#166534;background:#dcfce7}.mode-table.manual{color:#854d0e;background:#fef9c3}.farm3d-wrapper{border-radius:20px;position:relative;overflow:hidden}.farm3d-toolbar{color:#166534;background:#f0fdf4;border:1px solid #dcfce7;border-radius:14px;margin-bottom:12px;padding:11px 15px;font-size:12px;font-weight:800}.farm3d-canvas{border-radius:18px;min-height:560px;overflow:hidden}.farm3d-detail{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#fffffff5;border:1px solid #bbf7d0;border-radius:18px;width:220px;padding:17px;position:absolute;top:64px;right:16px;box-shadow:0 20px 45px #0f172a2e}.farm3d-detail button{color:#64748b;cursor:pointer;background:0 0;border:none;font-size:24px;position:absolute;top:7px;right:10px}.farm3d-detail h4{color:#064e3b;margin:0 0 13px;font-size:18px}.farm3d-detail div{border-bottom:1px solid #eef2f7;justify-content:space-between;gap:10px;padding:7px 0;font-size:12px;display:flex}.farm3d-detail span{color:#64748b}.farm3d-detail strong{color:#102018}@media (width<=1180px){.smart-summary-grid,.device-overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.smart-main-grid{grid-template-columns:1fr}}@media (width<=700px){.smart-summary-grid,.device-overview-grid,.smart-chart-grid{grid-template-columns:1fr}.farm3d-detail{width:auto;inset:auto 12px 12px}}@media (width<=780px){.farm3d-legend{flex-direction:column;align-items:flex-start}.visual-legend{gap:6px}.visual-legend span{padding:7px 9px;font-size:10px}}.farm3d-legend{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;display:flex}.farm3d-legend .farm3d-toolbar{margin-bottom:0}.visual-legend{flex-wrap:wrap;gap:8px;display:flex}.visual-legend span{color:#166534;background:#f0fdf4;border:1px solid #dcfce7;border-radius:999px;align-items:center;gap:5px;padding:8px 10px;font-size:11px;font-weight:900;display:inline-flex}.farm3d-canvas{min-height:660px}@media (width<=780px){.farm3d-legend{flex-direction:column;align-items:flex-start}.visual-legend{gap:6px}.visual-legend span{padding:7px 9px;font-size:10px}}.smart-dashboard-page{padding-bottom:48px}.dashboard-hero-modern{background:radial-gradient(circle at 100% 0,#86efac73,#0000 38%),linear-gradient(135deg,#064e3b,#15803d,#22c55e);border-radius:30px;justify-content:space-between;gap:26px;padding:34px;display:flex;overflow:hidden}.dashboard-hero-content{max-width:820px}.dashboard-hero-modern h1{color:#fff;margin:13px 0 8px;font-size:clamp(30px,4vw,48px);line-height:1.08}.dashboard-hero-modern p{color:#ffffffdb;max-width:730px;margin:0;font-size:15px;line-height:1.7}.hero-info{flex-wrap:wrap;gap:9px;margin-top:20px;display:flex}.hero-info span{color:#fff;background:#ffffff1f;border:1px solid #fff3;border-radius:999px;align-items:center;gap:6px;padding:8px 11px;font-size:11px;font-weight:800;display:inline-flex}.dashboard-live-card{color:#fff;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffff26;border:1px solid #ffffff40;border-radius:22px;min-width:230px;padding:19px}.dashboard-live-card svg{margin:16px 0 8px}.dashboard-live-card h3{margin:0;font-size:19px}.dashboard-live-card p{margin:7px 0 15px;font-size:12px}.dashboard-live-card p strong{color:#fff;margin-top:4px;display:block}.dashboard-live-card button{color:#fff;cursor:pointer;background:#ffffff2b;border:1px solid #ffffff42;border-radius:13px;justify-content:center;align-items:center;gap:7px;width:100%;padding:11px;font-weight:900;display:inline-flex}.dashboard-live-card button:hover{background:#ffffff42}.live-indicator{align-items:center;gap:7px;font-size:11px;font-weight:900;display:inline-flex}.live-indicator span,.chart-live-badge span{background:#bbf7d0;border-radius:50%;width:9px;height:9px;box-shadow:0 0 0 5px #bbf7d02e}.smart-summary-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:22px 0}.modern-summary-card{background:#fffffff0;border:1px solid #e2e8f0e6;border-radius:20px;align-items:center;gap:14px;padding:17px;transition:transform .22s,box-shadow .22s;display:flex;box-shadow:0 13px 28px #0f172a0e}.modern-summary-card:hover{transform:translateY(-4px);box-shadow:0 19px 34px #0f172a1a}.summary-icon{border-radius:15px;flex-shrink:0;place-items:center;width:47px;height:47px;display:grid}.summary-icon.green{color:#15803d;background:#dcfce7}.summary-icon.blue{color:#0369a1;background:#e0f2fe}.summary-icon.orange{color:#c2410c;background:#ffedd5}.summary-icon.purple{color:#7e22ce;background:#f3e8ff}.summary-icon.sky{color:#0284c7;background:#e0f2fe}.summary-icon.amber{color:#b45309;background:#fef3c7}.summary-icon.lime{color:#4d7c0f;background:#ecfccb}.summary-icon.red{color:#dc2626;background:#fee2e2}.modern-summary-card p{color:#64748b;margin:0;font-size:12px;font-weight:800}.modern-summary-card h2{color:#102018;margin:3px 0;font-size:25px}.modern-summary-card span{color:#94a3b8;font-size:10px;font-weight:700}.modern-panel-title{justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.panel-title-badge,.petak-count-badge{color:#166534;background:#dcfce7;border-radius:999px;align-items:center;gap:6px;padding:8px 10px;font-size:11px;font-weight:900;display:inline-flex}.alert-count-badge{color:#dc2626;background:#fee2e2;border-radius:50%;place-items:center;min-width:32px;height:32px;font-size:13px;font-weight:900;display:grid}.modern-alert-panel{max-height:820px;overflow:auto}.modern-safe-alert{align-items:center;gap:12px;display:flex}.modern-safe-alert p{margin:4px 0 0}.modern-alert-item{transition:transform .2s}.modern-alert-item:hover{transform:translate(4px)}.dashboard-status-chart{background:#fffffff2;border:1px solid #e2e8f0;border-radius:24px;grid-template-columns:minmax(0,1fr) 310px;align-items:center;gap:20px;margin:22px 0;padding:23px;display:grid;box-shadow:0 14px 35px #0f172a0f}.section-small-label{color:#16a34a;letter-spacing:1.3px;margin-bottom:6px;font-size:10px;font-weight:900;display:inline-block}.status-chart-head h4{color:#102018;margin:0;font-size:22px}.status-chart-head p{color:#64748b;margin:7px 0 0;font-size:13px}.pie-layout{position:relative}.pie-center-info{pointer-events:none;text-align:center;place-content:center;display:grid;position:absolute;inset:0}.pie-center-info strong{color:#102018;font-size:31px}.pie-center-info span{color:#64748b;font-size:11px;font-weight:800}.dashboard-chart-section{margin:26px 0}.dashboard-chart-section-head{justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:15px;display:flex}.dashboard-chart-section-head h2{color:#102018;margin:0;font-size:27px}.dashboard-chart-section-head p{color:#64748b;margin:7px 0 0;font-size:13px}.chart-live-badge{color:#166534;background:#dcfce7;border-radius:999px;align-items:center;gap:8px;padding:9px 12px;font-size:11px;font-weight:900;display:inline-flex}.chart-live-badge span{background:#22c55e;width:8px;height:8px}.modern-chart-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.modern-chart-card{border-radius:24px;padding:20px 18px 12px;transition:transform .22s,box-shadow .22s;overflow:hidden}.modern-chart-card:hover{transform:translateY(-4px);box-shadow:0 20px 36px #0f172a1a}.chart-card-header{justify-content:space-between;gap:12px;margin-bottom:8px;display:flex}.chart-heading-area{gap:11px;display:flex}.chart-heading-area h3{color:#102018;margin:0;font-size:18px}.chart-heading-area span{color:#64748b;margin-top:5px;font-size:11px;display:block}.chart-icon-box{border-radius:14px;flex-shrink:0;place-items:center;width:42px;height:42px;display:grid}.chart-icon-box.blue{color:#15803d;background:#dcfce7}.chart-icon-box.orange{color:#c2410c;background:#ffedd5}.chart-icon-box.sky{color:#0284c7;background:#e0f2fe}.chart-icon-box.amber{color:#b45309;background:#fef3c7}.chart-stat-row{gap:7px;display:flex}.chart-stat-row div{text-align:center;background:#f8fafc;border:1px solid #e2e8f0;border-radius:11px;min-width:61px;padding:7px 8px}.chart-stat-row span{color:#94a3b8;font-size:9px;font-weight:800;display:block}.chart-stat-row strong{color:#334155;margin-top:3px;font-size:11px;display:block}.modern-chart-tooltip{background:#fffffff5;border:1px solid #e2e8f0f2;border-radius:12px;padding:11px 13px;box-shadow:0 14px 30px #0f172a1c}.modern-chart-tooltip span{color:#64748b;margin-bottom:4px;font-size:11px;font-weight:800;display:block}.modern-chart-tooltip strong{color:#102018;font-size:13px}@media (width<=1180px){.smart-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.smart-main-grid,.dashboard-status-chart{grid-template-columns:1fr}.pie-layout{max-width:340px;margin:auto}}@media (width<=850px){.dashboard-hero-modern{flex-direction:column;padding:25px}.dashboard-live-card{width:auto;min-width:0}.modern-chart-grid{grid-template-columns:1fr}.chart-card-header{flex-direction:column}.chart-stat-row{justify-content:flex-start}}@media (width<=620px){.smart-summary-grid{grid-template-columns:1fr}.dashboard-chart-section-head{flex-direction:column;align-items:flex-start}.chart-stat-row{flex-wrap:wrap}.modern-chart-card{padding:16px 10px 8px}}