:root{--ink:#243e35;--muted:#5c6960;--green:#246447;--dark:#163e33;--lime:#d8e8a2;--bg:#f5f7f4;--line:#e3e8e1;--white:#fff;--amber:#9b671d;--shadow:0 8px 35px #20362908;font-family:'DM Sans',sans-serif;color:var(--ink);font-size:14px}
*{box-sizing:border-box}
body{margin:0;background:var(--bg)}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
button:disabled{opacity:.5;cursor:not-allowed}
a{color:inherit;text-decoration:none}
button{border:0;background:none;color:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #84a24e;outline-offset:3px}
/* <main> hanya menerima fokus secara terprogram (tautan lewati + pindah route); cincin sebesar halaman tidak membantu. */
#main:focus{outline:none}
svg.icon{width:19px;height:19px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
h1,h2,h3,p{margin:0}
h1,h2,h3,.metric-value{font-family:'Manrope',sans-serif}
h1{font-size:28px;letter-spacing:-1px;font-weight:750}
h2{font-size:18px;letter-spacing:-.45px}
h3{font-size:16px}
small{font-size:12px}
button.primary,.secondary,.danger{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:10px 16px;border-radius:8px;font-weight:600;white-space:nowrap}
.primary{background:var(--green);color:white;box-shadow:0 2px 3px #173e3510}
.primary:hover{background:#184d35}
.secondary{background:white;border:1px solid var(--line)}
.secondary:hover{background:#f2f6ee}
/* Aksi merusak (mis. Reset simulasi) dibedakan dari aksi utama; putih di atas merah ini 5,97:1 di terang dan 4,65:1 di gelap. */
.danger{background:#b3382c;color:#fff}
.danger:hover{background:#9e3025}
[data-theme="dark"] .danger{background:#c2503f}
[data-theme="dark"] .danger:hover{background:#d1604d}
.text-button{color:var(--green);font-weight:600;display:inline-flex;align-items:center;gap:7px;padding:8px 0}
.icon-button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--line);border-radius:8px;background:white}
.icon-button:hover{background:#eef3e9}
.skip{position:fixed;top:-80px;z-index:50;background:white;padding:15px}
.skip:focus{top:10px}
.sidebar{position:fixed;inset:0 auto 0 0;width:232px;background:var(--dark);color:#d6e0d5;display:flex;flex-direction:column;z-index:25;padding:28px 18px 0}
.brand{display:flex;align-items:center;gap:11px;font-size:14px;font-weight:750;letter-spacing:1px;color:white;white-space:nowrap}
.brand small{display:block;font-size:8px;letter-spacing:.5px;margin-top:6px;color:#b2c4b4}
.brandmark{width:38px;height:42px;display:grid;place-content:center;font-family:serif;font-size:32px;color:#d9e8a5;position:relative}
.brandmark span{font-family:sans-serif;font-size:23px;position:absolute;right:-1px;top:-4px}
.estate{margin:35px 0 26px;padding:14px 10px;display:flex;gap:10px;border:1px solid #ffffff1c;background:#ffffff05;border-radius:8px;align-items:center}
.estate-icon{color:#d6e6ae}
.estate strong{font-size:13px;font-weight:500}
.estate small{display:block;color:#b0c2b7;font-size:11px;margin-top:4px}
.nav-heading{font-size:10px;color:#9bb4a6;letter-spacing:1.8px;padding:0 12px;margin-bottom:12px}
.nav-link{display:flex;align-items:center;gap:13px;padding:13px 14px;border-radius:7px;margin-bottom:7px;font-size:14px;transition:.15s}
.nav-link .icon{width:19px;height:19px}
.nav-link:hover{background:#ffffff0d}
.nav-link.active{background:#dce8b1;color:#183c30;font-weight:600}
.nav-link .nav-number{margin-left:auto;font-size:11px;border:1px solid #ffffff25;padding:1px 6px;border-radius:4px}
.sidebar-bottom{margin-top:auto;padding:40px 13px 23px}
.phase-label{font-size:10px;letter-spacing:1.3px;color:#bad19c;display:flex;align-items:center;gap:6px;margin-bottom:15px}
.pulse{width:5px;height:5px;border-radius:50%;background:#c3d88d}
.sidebar-bottom strong{font-family:Manrope,sans-serif;font-size:17px;font-weight:500;line-height:1.6;color:#e5ecdc;display:block}
.sidebar-bottom p{font-size:12px;line-height:1.8;color:#a8c0b0;margin-top:8px}
.side-link{display:flex;justify-content:space-between;width:100%;border-top:1px solid #ffffff20;margin-top:18px;padding:17px 0 0;font-size:12px}
.profile{border-top:1px solid #ffffff18;padding:20px 0;display:flex;align-items:center;gap:9px}
.avatar{border-radius:50%;background:#365b49;width:33px;height:33px;display:grid;place-content:center;font-size:11px}
.profile strong{font-size:12px;font-weight:500}
.profile small{display:block;font-size:10px;color:#a8c0b0;margin-top:4px}
.profile>span:last-child{margin-left:auto;color:#8ca68c}
.shell{margin-left:232px}
.topbar{height:72px;background:#ffffffcc;border-bottom:1px solid var(--line);padding:0 32px;display:flex;align-items:center;justify-content:space-between}
.breadcrumbs{display:flex;gap:15px;font-size:12px;color:#7b897f}
.breadcrumbs span{color:var(--muted)}
.breadcrumbs strong{color:#394f41;font-weight:500}
.header-actions{display:flex;align-items:center;gap:17px}
.prototype-tag{font-size:10px;font-weight:600;letter-spacing:1px;display:flex;gap:7px;align-items:center}
.prototype-tag span{width:6px;height:6px;background:#c29e53;border-radius:50%}
.mobile-menu{display:none}
main{padding:28px 32px 32px;max-width:1800px;margin:auto;min-height:calc(100vh - 127px)}
.page-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:24px}
.eyebrow{font-size:10px;font-weight:650;letter-spacing:1.9px;color:#7e897c;margin-bottom:10px}
.page-heading p{margin-top:8px;color:var(--muted);font-size:13px}
.heading-actions{display:flex;gap:9px}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:22px}
.metric{background:white;border:1px solid var(--line);border-radius:10px;padding:18px 20px;box-shadow:var(--shadow)}
.metric-top{display:flex;justify-content:space-between;align-items:center;color:#6a796d;font-size:12px}
.metric-icon{display:flex;color:#738a63}
.metric-value{font-size:29px;font-weight:750;letter-spacing:-.8px;margin:11px 0 5px}
.metric-value span{font-size:14px;color:var(--muted);font-weight:500;letter-spacing:0;margin-left:4px}
.metric small{font-size:11px;color:#6e776d}
.metric small strong{font-weight:500;color:#427a51}
.workspace{display:grid;grid-template-columns:minmax(0,1fr) 286px;gap:20px;align-items:start}
.card{background:white;border:1px solid var(--line);border-radius:11px;box-shadow:var(--shadow);overflow:hidden}
.card-header{padding:18px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:10px}
.card-header p{font-size:11px;color:var(--muted);margin-top:5px}
.card-header h2{font-size:16px}
.tabs{display:flex;gap:3px;background:#f1f4ee;padding:3px;border-radius:7px}
.tabs button{font-size:11px;padding:7px 10px;border-radius:5px}
.tabs button.active{background:white;box-shadow:0 1px 4px #20362915;font-weight:600}
.map-container{position:relative;background:#eef1e9;overflow:hidden;min-width:0}
.map-svg{display:block;width:100%;height:502px;touch-action:none;cursor:grab}
.map-svg:active{cursor:grabbing}
.grid-line{stroke:#cfd8c9;stroke-width:.55;opacity:.65}
.site-outline{fill:#e0e9cd;stroke:#638456;stroke-width:2.5;stroke-dasharray:5 3}
.block-shape{stroke:#fff;stroke-width:2;cursor:pointer;transition:fill-opacity .18s;fill-opacity:.8}
.block-shape:hover{fill-opacity:1;stroke:#305539;stroke-width:2.5}
.block-shape.selected{stroke:#204e36;stroke-width:3;fill-opacity:.95}
.map-label{font-size:12px;font-family:'DM Sans',sans-serif;fill:#22432e;pointer-events:none;paint-order:stroke;stroke:#eef2dc;stroke-width:3px;stroke-linejoin:round}
.map-sublabel{font-size:10px;fill:#436446;pointer-events:none;paint-order:stroke;stroke:#edf0df;stroke-width:3px}
.tree-dot{cursor:pointer;stroke:#f2f6e9;stroke-width:1;fill:#447951}
.tree-dot:hover{stroke:#243a20;stroke-width:3}
.context-shape{fill:#e3e7dd;stroke:#c0cab9;stroke-width:1}
.context-label{font-size:10px;fill:#8a9787;letter-spacing:1px}
.map-floating{position:absolute;top:16px;left:16px;display:flex;gap:6px;align-items:center;z-index:2}
.map-floating .chip{background:#ffffffed;border:1px solid #e2e8dc;box-shadow:0 2px 8px #30403006}
.chip{padding:6px 9px;border-radius:6px;display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:500;white-space:nowrap}
.chip .icon{width:12px;height:12px}
.north{position:absolute;right:20px;top:21px;text-align:center;font-size:10px;color:#688062;font-weight:600;display:grid;gap:4px}
.north:after{content:'↑';font-size:30px;font-weight:400}
.map-tools{position:absolute;right:14px;bottom:49px;display:flex;flex-direction:column;gap:5px}
.map-tools .icon-button{width:32px;height:32px;background:#ffffffee;border-color:#d6ded0}
.scale{position:absolute;left:18px;bottom:17px;font-size:10px;color:#65755f}
.scale-line{border:solid #6f8268;border-width:0 1px 2px;height:5px;width:75px;margin-top:4px}
.map-note{position:absolute;bottom:16px;right:14px;font-size:10px;color:#7a8771}
.map-legend{padding:12px 18px;display:flex;gap:15px;align-items:center;flex-wrap:wrap;border-top:1px solid var(--line);font-size:10px;color:#798575}
.legend-item{display:flex;align-items:center;gap:6px}
.swatch{width:9px;height:9px;border-radius:2px;background:var(--swatch)}
.map-source{padding:10px 18px;background:#fafbf8;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:10px;color:#6c7468}
.map-source button{font-weight:600;color:#547245;text-decoration:underline;text-underline-offset:3px}
.side-stack{display:flex;flex-direction:column;gap:17px}
.focus-card{padding:20px}
.focus-card .section-kicker{font-size:10px;letter-spacing:1.1px;color:#6e7864;margin-bottom:12px;display:flex;justify-content:space-between;align-items:center}
.badge{display:inline-flex;align-items:center;padding:5px 8px;border-radius:5px;background:#edf3e4;color:#58753e;font-size:10px;font-weight:500;white-space:nowrap}
.badge.amber{background:#faf1df;color:#8f6521}
.badge.gray{background:#f0f2ed;color:#667063}
.badge.blue{background:#eaf0f6;color:#567288}
.focus-card h2{font-size:22px;letter-spacing:-.8px}
.focus-card .block-code{font-size:11px;color:#6d7864;margin-top:5px;letter-spacing:.4px}
.mini-map-line{display:flex;align-items:center;gap:8px;font-size:11px;color:#6d7963;margin-top:16px}
.mini-map-line .icon{width:14px}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 10px;margin-top:21px;padding-top:19px;border-top:1px solid var(--line)}
.detail-grid dt{font-size:10px;color:#6d7864;margin-bottom:6px}
.detail-grid dd{margin:0;font-size:15px;font-weight:600}
.detail-grid dd span{font-size:10px;font-weight:400;color:var(--muted)}
.progress-line{margin-top:20px}
.progress-line .row{display:flex;justify-content:space-between;font-size:11px;margin-bottom:9px}
.progress-track{height:5px;background:#ecf0e6;border-radius:10px;overflow:hidden}
.progress-track>span{height:100%;display:block;background:#658746;border-radius:10px}
.focus-card .primary{width:100%;margin-top:20px;font-size:12px}
.focus-card .text-button{margin:5px auto 0;display:flex;justify-content:center;font-size:11px}
.next-card{padding:20px;background:#eef2e7;border:1px solid #e1e7d7;border-radius:10px}
.next-card h3{font-size:14px;margin:9px 0}
.next-card p{font-size:12px;color:#75816b;line-height:1.8}
.next-card .text-button{font-size:11px;margin-top:8px}
.step-num{font-size:10px;letter-spacing:1px;color:#637151}
.lower-grid{margin-top:20px;display:grid;grid-template-columns:1.05fr 1fr;gap:20px}
.padded{padding:20px}
.workflow{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}
.workflow-step{padding:14px 12px;border:1px solid var(--line);border-radius:8px;text-align:left}
.workflow-step:hover{background:#f5f8f0}
.workflow-step>span{font-family:Manrope,sans-serif;font-size:22px;color:#abb899}
.workflow-step strong{display:block;font-size:12px;margin-top:12px}
.workflow-step small{display:block;font-size:10px;color:var(--muted);line-height:1.7;margin-top:6px}
.note-line{font-size:11px;color:#6d7966;line-height:1.8;margin-top:16px}
.activity{display:flex;gap:12px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line)}
.activity:last-child{border-bottom:0;padding-bottom:0}
.activity-icon{background:#f0f3eb;padding:8px;border-radius:7px;display:flex;color:#6e8857}
.activity strong{font-size:12px;font-weight:500}
.activity p{font-size:11px;color:var(--muted);margin-top:5px}
.activity time{font-size:10px;white-space:nowrap;margin-left:auto;color:#87927d}
.app-footer{padding:18px 32px;display:flex;gap:15px;justify-content:space-between;font-size:10px;color:#6b7267;letter-spacing:.5px;border-top:1px solid var(--line)}
.app-footer b{padding:0 7px;font-weight:400}
.app-footer button{font-size:10px;padding:0;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.notice{padding:12px 16px;border-radius:8px;display:flex;gap:10px;align-items:center;background:#edf2e7;color:#607250;font-size:12px;line-height:1.6;margin-bottom:20px}
.notice .icon{width:17px;flex-shrink:0}
.notice.amber{background:#faf2e5;color:#8b6b3c}
.notice .text-button{margin-left:auto;white-space:nowrap;padding:0;font-size:11px}
.block-table{margin-top:20px}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;white-space:nowrap;text-align:left}
th{background:#f9faf7;font-size:10px;color:#6d7467;letter-spacing:.65px;font-weight:500;padding:12px 20px;border-bottom:1px solid var(--line)}
td{padding:15px 20px;font-size:12px;border-bottom:1px solid #edf0e8}
tr:last-child td{border-bottom:0}
td strong{display:block;font-weight:600;font-size:12px}
td small{display:block;color:#707767;font-size:10px;margin-top:5px}
tr.clickable{cursor:pointer}
tr.clickable:hover{background:#f7f9f3}
td .text-button{font-size:11px;padding:0}
.filterbar{display:flex;gap:10px;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.input-wrap{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:7px;padding:0 11px;background:white;min-width:180px;flex:1}
.input-wrap input{border:0;width:100%;outline:0;background:transparent;padding:10px 0;font-size:12px}
.input-wrap:focus-within{outline:3px solid #84a24e;outline-offset:3px}
.input-wrap .icon{width:15px;color:#8c987e}
.filterbar select{padding:10px 28px 10px 12px;border:1px solid var(--line);border-radius:7px;background:white;font-size:12px;color:#68745e}
.table-footer{padding:14px 20px;display:flex;justify-content:space-between;font-size:10px;color:var(--muted);border-top:1px solid var(--line)}
.species-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#6a8e4c;margin-right:8px}
.program-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.program-card{padding:22px}
.program-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.crop-icon{display:flex;padding:11px;background:#f0f4e8;color:#6e8853;border-radius:9px}
.crop-icon .icon{width:25px;height:25px}
.program-card h2{font-size:20px}
.program-card .sub{font-size:11px;color:var(--muted);margin-top:6px}
.program-card .detail-grid{margin-top:20px}
.program-card .secondary{width:100%;font-size:12px;margin-top:18px}
.program-note{display:flex;gap:7px;padding:12px;background:#f7f8f3;font-size:11px;line-height:1.7;border-radius:7px;margin-top:18px;color:#6b7361}
.program-note .icon{width:14px;flex-shrink:0}
.timeline-card{margin-top:22px}
.timeline-row{display:grid;grid-template-columns:180px repeat(4,1fr);align-items:center;padding:17px 20px;border-bottom:1px solid var(--line);font-size:12px}
.timeline-row.head{background:#f9faf7;color:var(--muted);font-size:10px}
.timeline-row .bar{height:26px;border-radius:4px;background:#e0eacb;display:flex;align-items:center;padding:0 12px;font-size:10px;color:#58713c;margin:0 7px}
.monitor-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:20px}
.monitor-item{display:flex;gap:14px;padding:17px 20px;border-bottom:1px solid var(--line);align-items:center}
.monitor-item:last-child{border:0}
.monitor-item .grow{flex:1}
.monitor-item p{font-size:11px;color:var(--muted);margin-top:5px}
.monitor-item h3{font-size:13px}
.monitor-item button{font-size:11px}
.check-square{width:21px;height:21px;border:1px solid #c8d4bc;border-radius:6px;display:grid;place-content:center;flex-shrink:0}
.check-square.done{background:#789454;color:white}
.readiness{padding:22px}
.readiness-row{margin-top:23px}
.readiness-row>div:first-child{display:flex;justify-content:space-between;margin-bottom:9px;font-size:12px}
.empty{padding:42px;text-align:center;color:var(--muted);font-size:13px}
.empty .icon{width:30px;height:30px;margin-bottom:10px}
dialog{padding:0;border:1px solid var(--line);border-radius:15px;width:min(590px,calc(100% - 28px));max-height:88vh;color:var(--ink);box-shadow:0 24px 100px #112d3333}
dialog.wide{width:min(900px,calc(100% - 28px))}
dialog::backdrop{background:#142b2859;backdrop-filter:blur(3px)}
.modal-header{padding:23px 25px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px}
.modal-header h2{font-size:21px}
.modal-header p{font-size:12px;color:var(--muted);margin-top:6px}
.modal-body{padding:23px 25px;max-height:65vh;overflow:auto}
.modal-actions{padding:17px 25px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:10px;background:#fafbf7}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{display:flex;flex-direction:column;gap:8px;font-size:12px}
.field.full{grid-column:1/-1}
.field input,.field select,.field textarea{width:100%;padding:11px 12px;border:1px solid #dce3d6;border-radius:7px;color:var(--ink);background:white}
.field textarea{min-height:85px;resize:vertical}
.field small{font-size:10px;color:var(--muted);line-height:1.7}
.source-row{padding:15px 0;border-bottom:1px solid var(--line);font-size:13px;display:flex;justify-content:space-between;gap:15px}
.source-row strong{font-weight:600;white-space:nowrap}
.source-row small{display:block;color:var(--muted);font-size:11px;margin-top:6px}
.body-copy{font-size:13px;color:#6c7b64;line-height:1.9}
.modal-body .notice{margin-top:18px}
.steps-list{display:grid;gap:18px}
.steps-list strong{font-size:14px}
.steps-list p{font-size:12px;color:var(--muted);line-height:1.8;margin-top:6px}
.preset-options{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.preset-option{padding:17px;border:1px solid var(--line);border-radius:9px;text-align:center;cursor:pointer}
.preset-option:has(input:checked){border:2px solid #618344;background:#f0f5e7;padding:16px}
.preset-option strong{display:block;font-size:26px;margin:7px 0}
.preset-option small{color:var(--muted)}
.preset-preview{height:260px;width:100%;background:#f1f4ed;border-radius:8px;margin-top:16px}
.document-image{width:100%;display:block}
.source-actions{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap}
.tree-summary{display:flex;align-items:center;gap:18px;margin-bottom:24px}
.tree-symbol{display:flex;padding:20px;background:#eef4e4;color:#708a53;border-radius:10px}
.tree-symbol .icon{width:36px;height:36px}
.tree-summary small{color:var(--muted);display:block;margin-top:6px}
.detail-list{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-bottom:25px}
.detail-list dt{font-size:11px;color:var(--muted);margin-bottom:7px}
.detail-list dd{font-size:14px;margin:0}
.checklist{display:flex;flex-direction:column;gap:14px;font-size:13px;padding:15px 0}
.checklist label{display:flex;gap:10px}
.checklist input{accent-color:var(--green);width:16px;height:16px}
.inline-error{font-size:12px;color:#a64933;margin:12px 0 0}
.compact-heading{margin-bottom:18px}
.compact-heading p{font-size:12px;color:var(--muted);margin-top:7px}
.log-row{padding:15px 0;border-bottom:1px solid var(--line);font-size:12px;line-height:1.8}
.log-row small{display:block;color:var(--muted)}
#toast{position:fixed;bottom:24px;left:calc(50% + 116px);transform:translate(-50%,20px);background:#214d39;color:white;padding:14px 20px;border-radius:9px;font-size:13px;box-shadow:0 7px 20px #1d472633;z-index:100;opacity:0;pointer-events:none;transition:.2s;max-width:85vw}
#toast.show{opacity:1;transform:translate(-50%,0)}
.census-layout{display:grid;grid-template-columns:1fr 285px;gap:20px}
.species-row{display:flex;gap:9px;align-items:center;margin:20px 0;font-size:12px}
.species-row span:first-child{width:68px}
.species-row .progress-track{flex:1;height:6px}
.species-row strong{font-size:12px;font-weight:500;min-width:20px;text-align:right}
.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.quick-card{padding:18px}
.quick-card h3{font-size:13px;display:flex;align-items:center;gap:9px}
.quick-card p{font-size:11px;line-height:1.8;color:var(--muted);margin-top:10px}
.layers-panel{position:absolute;top:60px;left:16px;padding:13px;background:white;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);display:grid;gap:13px;z-index:5;font-size:12px}
.layers-panel label{display:flex;align-items:center;gap:8px}
.layers-panel input{accent-color:var(--green)}
.toolbar-end{margin-left:auto;font-size:11px;color:var(--muted)}
.tree-result-count{font-size:10px;color:var(--muted)}
@media(min-width:1600px){
 .workspace{grid-template-columns:minmax(0,1fr) 320px}
 .map-svg{height:560px}
 .focus-card{padding:25px}
 .metric{padding:22px}
}
@media(max-width:1180px){
 .sidebar{width:205px;padding-left:12px;padding-right:12px}
 .shell{margin-left:205px}
 .brand{font-size:12px}
 .brand small{font-size:7px}
 .topbar{padding:0 24px}
 main{padding:25px 24px}
 .workspace{grid-template-columns:minmax(0,1fr) 250px;gap:15px}
 .metrics{gap:10px}
 .metric{padding:15px}
 .metric-top{font-size:11px}
 .metric-value{font-size:26px}
 .focus-card{padding:17px}
 .program-grid{gap:12px}
 .program-card{padding:18px}
 .census-layout{grid-template-columns:1fr}
 .species-card{display:none}
 h1{font-size:25px}
 .map-floating{gap:4px}
 .map-floating .chip{font-size:10px}
 .lower-grid{gap:15px}
 .workflow{gap:7px}
 .workflow-step{padding:10px}
}
@media(max-width:960px){
 /* Pita tablet: kartu tetap 3 kolom sehingga header terlalu sempit untuk judul + pil nowrap; biarkan membungkus. */
 .wx-card header{flex-wrap:wrap}
 .sidebar{width:185px}
 .shell{margin-left:185px}
 .brand{font-size:11px;gap:6px}
 .brand small{font-size:6px}
 .nav-link{font-size:12px;gap:10px;padding:12px 10px}
 .estate{padding:11px 7px}
 .estate strong{font-size:11px}
 .estate small{font-size:10px}
 .metrics{grid-template-columns:repeat(2,1fr)}
 .workspace{grid-template-columns:1fr}
 .side-stack{display:grid;grid-template-columns:1.2fr 1fr}
 .map-svg{height:500px}
 .focus-card .detail-grid{margin-top:15px;padding-top:15px;gap:14px}
 .lower-grid{grid-template-columns:1fr}
 .program-grid{grid-template-columns:1fr 1fr}
 .monitor-grid{grid-template-columns:1fr}
 .page-heading{align-items:flex-start}
 .heading-actions .secondary{font-size:11px}
 .heading-actions .primary{font-size:11px}
 .app-footer{flex-wrap:wrap;padding:16px 24px}
 .app-footer span:nth-child(2){display:none}
 .sidebar-bottom{padding-left:7px;padding-right:7px}
 .topbar{padding:0 24px}
 .prototype-tag{font-size:10px}
 .breadcrumbs{font-size:10px;gap:8px}
 .quick-grid{grid-template-columns:1fr}
 .heading-actions{flex-wrap:wrap;justify-content:flex-end}
}
@media(max-width:700px){
 .sidebar{display:none;width:248px;padding:26px 20px;box-shadow:15px 0 80px #173e3540}
 .sidebar.open{display:flex}
 .sidebar.open:after{content:'';position:fixed;inset:0 0 0 248px;background:#15362944;z-index:-1}
 .brand{font-size:14px;gap:10px}
 .brand small{font-size:8px}
 .estate strong{font-size:13px}
 .estate small{font-size:11px}
 .nav-link{font-size:14px;padding:14px}
 .shell{margin-left:0}
 .mobile-menu{display:flex;flex-shrink:0}
 .topbar{height:64px;padding:0 16px;gap:12px}
 .breadcrumbs{font-size:11px;flex:1}
 .breadcrumbs>span,.breadcrumbs>strong{display:none}
 .header-actions{gap:8px}
 .header-actions .icon-button{display:none}
 .prototype-tag{font-size:8px;letter-spacing:.5px;white-space:nowrap}
 .prototype-tag span{width:5px;height:5px}
 main{padding:24px 16px}
 .page-heading{display:block;margin-bottom:19px}
 h1{font-size:25px}
 .page-heading p{font-size:12px;line-height:1.7}
 .heading-actions{margin-top:15px;justify-content:flex-start}
 .eyebrow{font-size:9px}
 .metrics{gap:10px;margin-bottom:17px}
 .metric{padding:15px 13px}
 .metric-top{font-size:10px}
 .metric-value{font-size:26px;margin-top:10px}
 .metric small{font-size:10px}
 .metric-icon .icon{width:16px}
 .card-header{padding:16px}
 .card-header h2{font-size:15px}
 .card-header p{font-size:10px}
 .card-header .tabs button{padding:6px 7px;font-size:10px}
 .map-svg{height:450px}
 .map-floating{top:13px;left:11px}
 .map-floating .chip{font-size:9px;padding:6px}
 .map-floating .chip:nth-child(2){display:none}
 .map-legend{font-size:9px;gap:10px;padding:12px}
 .map-source{padding:10px 12px;font-size:9px}
 .side-stack{display:block}
 .side-stack>*+*{margin-top:15px}
 .focus-card{padding:20px}
 .next-card{display:none}
 .detail-grid{grid-template-columns:repeat(2,1fr)}
 .lower-grid{margin-top:17px}
 .workflow{gap:8px}
 .workflow-step{padding:12px 8px}
 .workflow-step strong{font-size:11px}
 .workflow-step small{font-size:10px}
 .notice{font-size:11px;align-items:flex-start;padding:12px}
 .notice .text-button{display:none}
 .program-grid{grid-template-columns:1fr}
 .program-card{padding:22px}
 .timeline-row{min-width:650px}
 .timeline-card{overflow-x:auto}
 .filterbar{padding:14px;gap:8px}
 .filterbar select{max-width:calc(50% - 4px);flex:1;min-width:110px;font-size:11px}
 .input-wrap{flex-basis:100%}
 td{padding:14px 16px}
 th{padding:12px 16px}
 .monitor-item{padding:16px 14px;gap:10px}
 .monitor-item .secondary{padding:8px 10px}
 .app-footer{padding:17px 16px;font-size:8px}
 .app-footer button{font-size:9px}
 .form-grid{grid-template-columns:1fr}
 .field.full{grid-column:auto}
 .modal-header{padding:20px}
 .modal-header h2{font-size:18px}
 .modal-body{padding:20px}
 .modal-actions{padding:16px 20px}
 .modal-actions button{font-size:12px}
 .source-row{font-size:12px}
 .source-row strong{font-size:12px}
 .detail-list{gap:20px 15px}
 .detail-list dd{font-size:12px}
 .map-note{font-size:8px}
 .padded{padding:18px}
 #toast{left:50%;min-width:260px;text-align:center}
 .preset-option{padding:12px}
 .preset-option:has(input:checked){padding:11px}
 .preset-option small{font-size:10px}
 .preset-preview{height:220px}
}
@media(prefers-reduced-motion:reduce){
 *{transition:none!important;scroll-behavior:auto!important}
}
/* Keep map labels legible when the geographic canvas scales down. */
.map-label{font-size:16px;font-weight:550}
.map-sublabel{font-size:12px}
.map-source button{display:flex;align-items:center;gap:5px}
.map-source button .icon{width:13px;height:13px}
.month-axis{height:18px;position:relative}
.month-axis>span{position:absolute;white-space:nowrap;font-size:10px}
.timeline-track{position:relative;height:45px;margin:0 8px}
.schedule-bar{position:absolute;top:0;height:18px;min-width:2px;border-radius:4px;background:#dce8c1}
.timeline-track>span{position:absolute;bottom:1px;font-size:10px;color:var(--muted)}
/* Loreng accent: quiet beneath navigation, visible at the unit identity. */
:root{--loreng:url('assets/loreng-ad.svg')}
.sidebar{background-color:#253727; background-image:linear-gradient(180deg,rgba(15,34,24,.86),rgba(15,34,24,.92) 48%,rgba(15,34,24,.88)),var(--loreng); background-size:100% 100%,420px 420px; color:#e4e8db; border-right:1px solid #26372b;}
.brand{padding-bottom:16px;border-bottom:1px solid #d9ddbd45}
.brandmark{color:#e2dda6}
.brand small{color:#d3d8bf}
.estate{margin-top:19px;background:#152e23f2;border-color:#bfc6a43d}
.estate small{color:#c0cbb8}
.nav-heading{color:#c8cfb4}
.nav-link{background:#162d22dc;color:#edf1e7}
.nav-link:hover{background:#304b33eb}
.nav-link.active{background:#dce3b5;color:#263d29;box-shadow:inset 3px 0 #a4b274,0 2px 7px #10251622}
.sidebar-bottom strong{color:#f0f0df}
.sidebar-bottom p{color:#cad4c2}
.phase-label{color:#d2dbaa}
.profile{background:#152b20f2;margin:0 -18px;padding:20px 18px;border-top-color:#aab89440}
.profile small{color:#c0cbb8}
.avatar{background:#586247;color:#f0efd9;border:1px solid #9fa48155}
.topbar{position:relative;border-top:5px solid transparent;background-image:linear-gradient(#fff,#fff),linear-gradient(#ffffffbf,#ffffffbf),var(--loreng);background-origin:padding-box,border-box,border-box;background-clip:padding-box,border-box,border-box;background-size:auto,auto,360px 360px}
.unit-patch{display:inline-flex;align-items:center;padding:5px;border:1px solid #536147;border-radius:4px;background-image:linear-gradient(#1e332bbf,#1e332bbf),var(--loreng);background-size:auto,170px;box-shadow:inset 0 0 0 1px #ffffff33}
.unit-patch span{background:#1e332b;border:1px solid #c4c9a875;color:#f0ecd2;padding:5px 9px;font-size:10px;font-weight:700;letter-spacing:1.5px;white-space:nowrap}
.eyebrow{display:flex;align-items:center;gap:9px}
.eyebrow::before{content:'';width:27px;height:10px;flex-shrink:0;border-radius:2px;background:var(--loreng) center/95px;border:1px solid #45523745;opacity:.4}
@media(min-width:701px) and (max-width:1180px){
 .profile{margin:0 -12px;padding:20px 12px}
 .unit-patch span{font-size:10px;padding:4px 6px}
}
@media(max-width:960px){
 .unit-patch{display:none}
}
@media(max-width:700px){
 .sidebar{background-size:100% 100%,420px 420px}
 .profile{margin:0 -20px -26px;padding:20px}
 .brand{padding-bottom:16px}
 .eyebrow{font-size:8px;letter-spacing:1.5px}
}
/* User-supplied emblem, shown through a cropped viewport of the original poster. */
.unit-logo{display:block;width:44px;height:56px;object-fit:contain;flex-shrink:0;border-radius:4px;background:#e9e9e5;border:1px solid #d4d6bc66}
.brand{gap:9px;font-size:13px;letter-spacing:.7px;align-items:center}
.brand small{letter-spacing:.3px}
.mobile-unit-logo{display:none}
@media(min-width:701px) and (max-width:1180px){
 .unit-logo{width:36px;height:46px}
 .brand{font-size:11px;gap:7px;letter-spacing:.5px}
}
@media(min-width:701px) and (max-width:960px){
 .unit-logo{width:30px;height:38px}
 .brand{font-size:10px;gap:6px}
}
@media(max-width:700px){
 .brand{font-size:13px;gap:10px}
 .unit-logo{width:44px;height:56px}
 .mobile-unit-logo{display:block;width:26px;height:33px;object-fit:contain;border-radius:3px;flex-shrink:0}
 .breadcrumbs{align-items:center;gap:8px}
 .prototype-tag{font-size:7px;letter-spacing:.3px}
}
/* Varmos-style GIS workspace: real basemaps, DEM terrain, cluster-level navigation. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* .sr-only berposisi absolut: tanpa ancestor berposisi ia memakai blok penampung awal, lepas dari container bergulir, dan memperlebar halaman. Setiap pemakaian .sr-only baru butuh induk berposisi seperti ini. */
.users-table th,.geo-basemap{position:relative}
.farm-map-stage{height:580px;position:relative;background:#dce4d5;isolation:isolate;overflow:hidden}
.map-workspace .farm-map-stage{height:710px}
#farm-gl{position:absolute;inset:0}
.geo-top{position:absolute;top:16px;left:16px;right:16px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;z-index:3;pointer-events:none}
.geo-top>*{pointer-events:auto}
.geo-switch{display:flex;padding:5px;background:#ffffffee;border:1px solid #dfe5d9;border-radius:11px;box-shadow:0 3px 15px #102b2b25}
.geo-switch select{border:0;border-right:1px solid #dce3d6;background:#edf6e9;padding:10px 8px;color:#26633d;font-weight:650;font-size:14px;border-radius:6px 0 0 6px;max-width:150px}
.geo-switch button{background:#23804b;color:white;padding:9px 13px;border-radius:7px;margin-left:5px;font-size:14px;font-weight:600}
.geo-basemap{padding:5px;background:#fffffff0;border-radius:8px;box-shadow:0 3px 15px #102b2b25}
.geo-basemap select{background:transparent;border:0;color:#354c3b;font-size:13px;padding:8px 5px}
.geo-buttons{position:absolute;bottom:40px;left:16px;right:57px;display:flex;flex-wrap:wrap;gap:7px;justify-content:center;z-index:3;pointer-events:none}
.geo-buttons button{pointer-events:auto;background:#f7f9f2f5;box-shadow:0 2px 8px #0002;color:#435349;border:1px solid #ffffffbb;border-radius:22px;padding:9px 13px;font-size:12px;font-weight:650;min-height:36px}
.geo-buttons button.active{background:#24804aec;color:white;border-color:#64aa7380}
.geo-actions{position:absolute;right:10px;bottom:136px;display:grid;gap:7px;z-index:4}
.geo-actions button{height:32px;width:32px;background:#fff;border:1px solid #d4dbd3;border-radius:5px;font-size:23px;line-height:1;box-shadow:0 1px 4px #0003}
.geo-status{position:absolute;top:84px;left:16px;max-width:330px;border-radius:6px;background:#fffef2eb;color:#576c4d;padding:8px 10px;font-size:11px;z-index:2}
.geo-status.warning{background:#fff2dbee;color:#855a20}
.geo-legend{position:absolute;left:16px;bottom:110px;padding:13px;background:#fffffff0;border:1px solid #e1e5dc;border-radius:9px;width:160px;z-index:2;box-shadow:0 3px 15px #102b2b22}
.geo-legend>label{font-size:10px;display:block;margin-bottom:5px;color:#7c8976}
.geo-legend select{font-size:12px;border:0;background:transparent;color:#3a4e3f;width:100%;font-weight:600}
.geo-legend-items{display:grid;gap:7px;margin-top:10px}
.geo-legend-items>span{font-size:11px;display:flex;align-items:center;gap:7px;line-height:1.4}
.geo-legend-items i{width:9px;height:9px;border-radius:3px;flex-shrink:0}
.geo-terrain-note{position:absolute;right:16px;top:83px;padding:13px;background:#ffffffef;border:1px solid #e3e5db;border-radius:9px;max-width:220px;z-index:2;box-shadow:0 3px 15px #102b2b22}
.geo-terrain-note strong{font-size:12px;display:block;margin-bottom:7px}
.geo-terrain-note span{font-size:11px;line-height:1.8;color:#78816e}
.geo-explorer{position:absolute;left:16px;top:80px;bottom:110px;width:250px;max-width:calc(100% - 32px);overflow:auto;background:#fffffff7;border:1px solid #d9e3d1;border-radius:9px;box-shadow:0 5px 30px #0003;padding:12px;z-index:5}
.geo-explorer-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:14px}
.geo-explorer-heading button{font-size:22px;width:30px;height:30px}
.geo-explorer-block{border-top:1px solid #dfe6d8;padding:8px 0}
.geo-explorer-block button{display:flex;align-items:center;justify-content:space-between;gap:9px;width:100%;padding:9px;border-radius:5px;text-align:left;font-size:13px}
.geo-explorer-block>button{font-weight:600}
.geo-explorer-block small{font-size:11px;color:#7f8976}
.geo-explorer-block .geo-explorer-cluster{font-size:12px;padding-left:23px}
.geo-explorer-block button:hover{background:#e9f1e0}
.geo-explorer-block button.chosen{background:#dbe9c4;color:#23492b}
.geo-label{padding:4px 7px;background:#122b29dd;color:white;border:1px solid #ffffff38;border-radius:6px;box-shadow:0 2px 6px #0002;font-family:'DM Sans',sans-serif;text-align:center;line-height:1.25;cursor:pointer}
.geo-label strong{font-size:12px;font-weight:700;display:block}
.geo-label span{font-size:10px;display:block;white-space:nowrap}
.geo-label.remainder{background:#65441dea;color:#fff1c9;border-color:#f8d789}
.geo-label:hover{background:#346b42}
.geo-label:focus-visible{outline:3px solid #ffe1a2;outline-offset:3px}
.farm-map-stage .maplibregl-ctrl-bottom-right{bottom:4px}
.farm-map-stage .maplibregl-ctrl-bottom-left{bottom:var(--geo-attrib-h,0px)}
.farm-map-stage .maplibregl-ctrl-attrib{font-size:10px;max-width:100%;background:#fffc}
.farm-map-stage .maplibregl-ctrl-scale{font-size:10px;background:#ffffffe0;color:#243c30;border-color:#4a634d;line-height:1.5}
.farm-map-stage:fullscreen,.farm-map-stage.expanded{height:100vh!important;width:100vw!important;background:#203b2c}
.farm-map-stage.expanded{position:fixed;inset:0;z-index:100}
.farm-map-stage:fullscreen .geo-legend{width:190px}
.farm-map-stage:fullscreen .geo-buttons{bottom:45px}
.farm-map-stage:fullscreen .geo-terrain-note{font-size:14px}
.geo-fallback{position:absolute;inset:90px 25px auto;background:white;padding:22px;border-radius:10px;z-index:5}
.geo-fallback p{margin:10px 0;font-size:13px}
.geo-fallback button{background:#27643e;color:white;padding:10px;border-radius:6px}
.cluster-remainder-note{font-size:11px;line-height:1.7;color:#91692e;background:#fcf4e4;padding:10px;border-radius:6px;margin-top:15px}
.migration-note{font-size:11px;line-height:1.6;color:#876b3f;background:#fbf3e4;border:1px solid #ecdfc5;padding:11px 15px;border-radius:7px;margin:-6px 0 18px}
.map-workspace{grid-template-columns:minmax(0,1fr) 266px}
@media(min-width:1600px){
 .map-workspace{grid-template-columns:minmax(0,1fr) 290px}
 .map-workspace .farm-map-stage{height:790px}
}
@media(max-width:1180px){
 .map-workspace{grid-template-columns:1fr}
 .map-workspace .side-stack{display:grid;grid-template-columns:1fr 1fr}
 .geo-legend{width:145px}
 .geo-label strong{font-size:11px}
 .geo-label span{font-size:10px}
}
@media(max-width:700px){
 .map-workspace .farm-map-stage{height:650px}
 .farm-map-stage{height:580px}
 .geo-top{top:10px;left:10px;right:10px;gap:6px}
 .geo-switch{padding:4px}
 .geo-switch select{font-size:12px;max-width:123px;padding:9px 4px}
 .geo-switch button{font-size:12px;padding:9px;margin-left:3px}
 .geo-basemap{padding:4px}
 .geo-basemap select{font-size:11px;padding:9px 0;max-width:94px}
 .geo-legend{left:10px;bottom:135px;padding:9px;width:118px}
 .geo-legend-items{gap:4px}
 .geo-legend-items span{font-size:10px}
 .geo-legend select{font-size:10px}
 .geo-legend>label{font-size:9px}
 .geo-buttons{left:10px;right:48px;bottom:39px;gap:5px}
 .geo-buttons button{font-size:10px;padding:8px 9px;min-height:33px}
 .geo-terrain-note{right:10px;top:72px;width:165px;padding:10px}
 .geo-terrain-note strong{font-size:10px}
 .geo-terrain-note span{font-size:9px}
 .geo-status{top:72px;left:10px;max-width:180px;font-size:10px}
 .geo-explorer{top:68px;left:10px;bottom:120px;width:235px}
 .geo-label{padding:3px 5px}
 .geo-label strong{font-size:10px}
 .geo-label span{font-size:9px}
 .map-workspace .side-stack{display:block}
 .farm-map-card .card-header p{line-height:1.6}
 .farm-map-card .map-source{align-items:flex-start;line-height:1.6}
 .farm-map-card .map-source>span{max-width:62%}
}
/* Weather workspace, inspired by the VarmOS climatology page. */
.wx-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 18px}
.wx-role{display:flex;padding:4px;border:1px solid var(--line);background:#e9eee7;border-radius:9px}
.wx-role button{padding:9px 17px;border-radius:6px;font-size:12px;font-weight:600}
.wx-role .active{background:white;box-shadow:0 2px 5px #20362912;color:#246447}
.wx-toolbar label{display:flex;align-items:center;gap:10px;font-size:12px;color:#536557}
.wx-toolbar select,.wx-filter select{border:1px solid #d9e1d4;border-radius:7px;padding:10px;background:white;color:#304c3b;max-width:100%}
.wx-banner{display:flex;align-items:center;gap:12px;border:1px solid #e5d9bb;background:#fcf7e9;padding:14px 18px;border-radius:9px;margin-bottom:18px;color:#6f592e}
.wx-banner strong{font-size:12px}
.wx-banner p{font-size:12px;line-height:1.6;margin-top:3px}
.wx-banner>div{min-width:0}
.wx-banner>.wx-pill{margin-left:auto;flex-shrink:0}
.wx-icon{height:23px;width:23px;flex-shrink:0}
.wx-icon.sun{color:#c68b28}
.wx-icon.rain,.wx-icon.drop{color:#418aa8}
.wx-icon.cloud{color:#8c9e9e}
.wx-icon.wind{color:#73877c}
.wx-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}
.wx-kpi{position:relative;border:1px solid var(--line);border-radius:11px;padding:19px;background:white}
.wx-kpi>.wx-icon{position:absolute;right:16px;top:17px;width:19px}
.wx-kpi>span{font-size:12px;display:block;padding-right:22px;color:#5b6b60}
.wx-kpi>strong{display:block;font-family:Manrope,sans-serif;font-size:25px;margin:12px 0 6px;letter-spacing:-.7px}
.wx-kpi>small{font-size:11px;color:#69786d}
.wx-alert{display:flex;gap:10px;flex-wrap:wrap;align-items:center;background:#f9eee7;border:1px solid #eed8c8;padding:13px 17px;border-radius:9px;margin-bottom:18px;font-size:12px;color:#895039}
.wx-alert strong{display:flex;gap:8px;align-items:center}
.wx-alert small{width:100%;padding-left:27px;font-size:11px}
.wx-summary{display:grid;grid-template-columns:1fr 2.2fr;gap:16px;margin-bottom:16px}
.wx-card{background:white;border:1px solid var(--line);border-radius:11px;padding:19px;min-width:0;margin-bottom:16px}
.wx-summary .wx-card,.wx-decisions .wx-card,.wx-bottom .wx-card{margin-bottom:0}
.wx-card header{display:flex;align-items:center;gap:8px;justify-content:space-between;margin-bottom:18px}
.wx-card h2{font-size:14px;letter-spacing:-.2px}
.wx-card h3{font-size:22px;margin:14px 0 10px}
.wx-card h3 small{font-family:'DM Sans',sans-serif;font-size:12px;font-weight:400;color:#657368}
.wx-card p{font-size:12px;line-height:1.75;color:#637267}
.wx-pill{font-size:10px;letter-spacing:.4px;background:#edf0eb;border-radius:5px;padding:5px 8px;white-space:nowrap;color:#56675b;font-weight:650}
.wx-pill.green{background:#e8f2e6;color:#387047}
.wx-pill.amber{background:#fcf0d9;color:#8b601f}
.wx-pill.blue{background:#e8f2f6;color:#36758e}
.wx-current{display:flex;gap:19px;align-items:center;margin:16px 0 20px}
.wx-current>.wx-icon{width:52px;height:52px}
.wx-current strong{font-size:37px;letter-spacing:-1px}
.wx-current strong small{font-size:23px;font-weight:400;color:var(--muted)}
.wx-facts{display:grid;grid-template-columns:1fr 1fr;gap:12px 10px;font-size:11px;color:#6b796e}
.wx-facts span{display:flex;gap:5px;align-items:center;flex-wrap:wrap}
.wx-facts .wx-icon{width:13px;height:13px}
.wx-facts b{color:#405845;font-weight:500}
.wx-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px}
.wx-day{display:flex;flex-direction:column;align-items:center;border:1px solid #e7ebe4;border-radius:8px;padding:12px 5px;gap:9px;min-width:0;transition:background .15s}
.wx-day:hover{background:#f5f8f1}
.wx-day.selected{border-color:#7daa72;background:#edf5e8;box-shadow:inset 0 0 0 1px #7daa7230}
.wx-day>span:first-child{font-size:10px;white-space:nowrap;font-weight:600}
.wx-day>.wx-icon{height:29px;width:29px;margin:3px 0}
.wx-day strong{font-size:17px;white-space:nowrap}
.wx-day small{font-size:10px;color:#617263;font-weight:400}
.wx-rain{color:#327591!important}
.wx-day>.wx-rain{font-size:11px}
.wx-footnote{font-size:10px!important;color:#6d786e!important;line-height:1.7!important;margin-top:13px!important}
.wx-decisions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:16px}
.wx-activity{display:flex;gap:7px}
.wx-activity>div{flex:1;text-align:center;font-size:10px;color:var(--muted)}
.wx-activity i{display:block;height:6px;background:#eac4a8;border-radius:5px;margin-bottom:7px}
.wx-activity i.good{background:#79a77a}
.wx-card>.secondary{margin-top:14px;font-size:11px;min-height:34px;padding:6px 12px}
.wx-crops{display:flex;gap:6px;margin:14px 0 0;flex-wrap:wrap}
.wx-crops span{background:#f2f5ef;border:1px solid var(--line);padding:4px 7px;border-radius:4px;font-size:10px;color:#59705c}
.wx-water-row{display:flex;justify-content:space-between;font-size:11px;margin-bottom:9px;gap:8px;color:#657468}
.wx-water-row+p{border-top:1px solid var(--line);padding-top:10px}
.wx-hour-heading{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#6b786d;margin-bottom:13px;gap:10px}
.wx-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin:0 3px 0 10px}
.wx-dot.green{background:#7ba975}
.wx-dot.blue{background:#75abc4}
.wx-hour-scroll{overflow-x:auto;padding-bottom:9px;scrollbar-width:thin}
.wx-hours{display:flex;gap:6px;min-width:max-content}
.wx-hour{width:63px;border-radius:7px;border:1px solid #e8ece6;background:#fafbf9;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;padding:11px 4px}
.wx-hour.good{background:#edf5e9;border-color:#d5e5cc}
.wx-hour.rainy{background:#ecf4f8;border-color:#d8e9f1}
.wx-hour b{font-size:10px;color:#5e7364}
.wx-hour strong{font-size:16px}
.wx-hour span{font-size:10px;color:#327591}
.wx-hour small{font-size:10px;color:#637165}
.wx-bottom{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.wx-filter{display:flex;gap:12px;align-items:center;font-size:12px;margin:14px 0}
.wx-filter select{flex:1;min-width:0;font-size:12px}
.wx-clusters{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.wx-clusters button{display:flex;flex-wrap:wrap;gap:5px 12px;padding:11px;background:#f5f8f1;border:1px solid #e2e9db;border-radius:7px;text-align:left;align-items:center}
.wx-clusters strong{font-size:11px}
.wx-clusters span{font-size:10px;color:#657367}
.wx-clusters .wx-icon{width:15px;height:15px;margin-left:auto}
.wx-empty-calendar{text-align:center;padding:5px 8px 20px}
.wx-empty-calendar>.icon{width:28px;height:28px;color:#7f9780}
.wx-empty-calendar h3{font-size:15px;margin:12px 0 9px}
.wx-empty-calendar a{font-size:12px;margin-top:10px;justify-content:center}
.wx-empty-calendar .wx-icon{width:16px}
.wx-task-link{border-top:1px solid var(--line);padding-top:14px;font-size:11px;display:flex;justify-content:space-between;gap:10px}
.wx-task-link a{color:#327047;font-weight:600}
.wx-method{background:#eef2eb;border:1px solid #dfe5da;border-radius:9px;padding:16px 19px;font-size:12px;color:#596c5c}
.wx-method summary{cursor:pointer;font-weight:600}
.wx-method summary span{float:right;font-size:10px;font-weight:400}
.wx-method p{margin-top:13px;line-height:1.8;max-width:950px}
@media(max-width:1200px){
 .wx-summary{grid-template-columns:1fr}
 .wx-today .wx-current{float:left;margin:0 35px 0 0}
 .wx-today .wx-facts{padding:10px 0}
 .wx-kpi>strong{font-size:21px}
 .wx-decisions{gap:10px}
 .wx-card{padding:16px}
}
@media(max-width:700px){
 .wx-toolbar{align-items:stretch;flex-direction:column;gap:12px}
 .wx-role button{flex:1;padding:10px}
 .wx-toolbar label{justify-content:space-between}
 .wx-banner{padding:12px;align-items:flex-start}
 .wx-banner>.wx-pill{display:none}
 .wx-kpis{grid-template-columns:1fr 1fr;gap:9px}
 .wx-kpi{padding:13px}
 .wx-kpi>span{font-size:10px}
 .wx-kpi>.wx-icon{right:10px;top:11px;width:16px}
 .wx-kpi>small{font-size:10px;line-height:1.6;display:block}
 .wx-kpi>strong{font-size:21px}
 .wx-summary,.wx-decisions,.wx-bottom{grid-template-columns:1fr;gap:12px}
 .wx-week{display:flex;overflow-x:auto;padding-bottom:8px}
 .wx-day{min-width:77px;flex:1}
 .wx-current strong{font-size:32px}
 .wx-today .wx-current{float:none;margin:10px 0 15px}
 .wx-hour-heading{align-items:flex-start;flex-direction:column}
 .wx-hour-heading .wx-dot:first-child{margin-left:0}
 .wx-alert{line-height:1.7}
 .wx-alert small{padding:0}
 .wx-alert span{display:block;width:100%}
 .wx-method summary span{float:none;display:block;margin:7px 0 0 15px}
 .wx-task-link{flex-wrap:wrap}
 .wx-card header h2{font-size:13px}
}
/* Workspace controls and planning modules. */
.topbar{gap:14px}
.topbar>.breadcrumbs{margin-right:auto}
.sidebar{overflow-y:auto;scrollbar-width:thin}
.sidebar .brand,.sidebar .profile{flex-shrink:0}
.sidebar-bottom{padding-top:20px}
.sidebar #nav{flex-shrink:0}
.sidebar-toggle,.theme-toggle{font-size:20px;flex-shrink:0}
.nav-link{min-height:43px;padding-top:11px;padding-bottom:11px}
.ops-filters{display:flex;align-items:flex-end;gap:16px;padding:17px;background:var(--white);border:1px solid var(--line);border-radius:10px;margin-bottom:20px}
.ops-filters label{display:grid;gap:7px;font-size:11px;color:var(--muted)}
.ops-filters label:first-child{flex:1}
.ops-filters input,.ops-filters select{background:var(--white);border:1px solid var(--line);border-radius:7px;padding:11px;color:var(--ink);min-width:0;width:100%}
.ops-filters>span{font-size:11px;color:var(--muted);padding:12px 0}
.sop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.sop-card{padding:22px}
.sop-top{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--muted);margin-bottom:22px}
.sop-top .badge{margin-left:auto}
.sop-card h2{font-size:17px;line-height:1.5;margin-bottom:10px}
.sop-card p{font-size:12px;color:var(--muted);line-height:1.8;min-height:44px}
.sop-card>small{display:block;margin:18px 0 13px;color:var(--muted);font-size:11px}
.sop-progress{height:4px;background:var(--line);border-radius:8px;overflow:hidden}
.sop-progress span{display:block;background:#7fa563;height:100%}
.sop-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:14px;gap:8px;font-size:11px;color:var(--muted)}
.sop-bottom button{font-size:12px}
.sop-steps{display:grid;gap:12px}
.sop-steps label{display:flex;align-items:flex-start;gap:13px;padding:15px;background:var(--bg);border:1px solid var(--line);border-radius:8px;font-size:13px;line-height:1.7;cursor:pointer}
.sop-steps input{margin-top:6px;accent-color:var(--green);width:17px;height:17px;flex-shrink:0}
.sop-steps small{display:block;color:var(--muted);font-size:10px;letter-spacing:1px;margin-bottom:5px}
.sop-evidence{margin-top:20px;border-top:1px solid var(--line);padding-top:17px}
.sop-evidence h3{font-size:13px}
.sop-evidence p{margin-top:8px;color:var(--muted);font-size:12px;line-height:1.8}
.calendar-card{overflow:hidden}
.cal-header{padding:22px;display:flex;align-items:center;justify-content:space-between}
.cal-header small{font-size:10px;letter-spacing:1.4px;color:var(--muted)}
.cal-header h2{margin-top:7px;font-size:23px}
.cal-header>div:last-child{display:flex;align-items:center;gap:8px}
.cal-header .secondary{min-height:36px;padding:8px 12px;font-size:12px}
.cal-scroll{overflow:auto}
.cal-week,.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));min-width:640px}
.cal-week{background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cal-week span{padding:12px 15px;font-size:11px;color:var(--muted)}
.cal-cell{min-height:112px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:8px;min-width:0}
.cal-cell:nth-child(7n){border-right:0}
.cal-cell.outside{background:var(--bg)}
.cal-cell.today{box-shadow:inset 0 0 0 2px #8fa978}
.cal-day{height:27px;min-width:27px;padding:3px;font-size:12px;border-radius:6px;margin-bottom:5px}
.cal-day:hover{background:var(--lime);color:#23432b}
.cal-event{display:block;width:100%;text-align:left;font-size:10px;line-height:1.5;border-left:3px solid #609567;border-radius:3px;background:#e8f0e4;color:#355c3d;padding:5px 6px;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-event.activity{background:#f3ecdc;border-color:#bc985a;color:#76592b}
.cal-event.task{background:#e4f0f5;border-color:#609fba;color:#3b6c80}
.cal-more{font-size:10px;color:var(--green)}
.cal-legend{display:flex;flex-wrap:wrap;gap:20px;padding:16px 22px;font-size:10px;color:#5b7459}
.cal-legend span:nth-child(2){color:#8d7143}
.cal-legend span:nth-child(3){color:#4a7c8f}
.agenda{margin-top:22px}
.agenda-row{display:flex;align-items:center;gap:18px;text-align:left;width:100%;padding:17px 22px;border-top:1px solid var(--line);font-size:12px}
.agenda-row>span{min-width:140px;color:var(--muted);font-size:11px}
.agenda-row strong{flex:1;font-weight:550}
.agenda-row small{color:var(--muted);font-size:11px}
.agenda-row>.icon{margin-left:auto;width:16px}
.agenda-row:hover{background:var(--bg)}
.geo-site-panel{position:absolute;top:78px;right:16px;max-width:calc(100% - 32px);width:265px;background:#fffdf7f7;color:#344a3b;padding:16px;border-radius:10px;border:1px solid #dbe2d3;z-index:6;box-shadow:0 7px 30px #0003}
.geo-site-panel>strong{font-size:14px}
.geo-site-panel p{font-size:10px;line-height:1.6;color:#77816d;margin:5px 0 12px}
.geo-site-panel label{display:flex;gap:8px;align-items:center;font-size:12px;padding:9px 0;cursor:pointer}
.geo-site-panel input{accent-color:#34734b}
.geo-site-panel i{width:9px;height:9px;border-radius:3px;flex-shrink:0}
.geo-site-panel>small{display:block;font-size:10px;line-height:1.7;color:#7b6840;border-top:1px solid #dedfcd;padding-top:12px}
.site-pending{border-top:1px solid #e1e6db;padding-top:10px;margin-top:6px}
.site-pending strong{font-size:11px;color:#897449}
.maplibregl-popup-content{color:#263e31;font-size:12px;line-height:1.7}
.maplibregl-popup-content p{margin:8px 0}
.maplibregl-popup-close-button{font-size:18px}
.geo-site-panel[hidden]{display:none}
@media(min-width:701px){
 body.sidebar-collapsed .sidebar{width:78px;padding:22px 12px 0}
 body.sidebar-collapsed .shell{margin-left:78px}
 body.sidebar-collapsed .brand{justify-content:center;padding-bottom:18px}
 body.sidebar-collapsed .brand>span,body.sidebar-collapsed .estate,body.sidebar-collapsed .nav-heading,body.sidebar-collapsed .sidebar-bottom,body.sidebar-collapsed .profile,body.sidebar-collapsed .nav-label{display:none}
 body.sidebar-collapsed .nav-link{justify-content:center;padding:13px 0}
 body.sidebar-collapsed .unit-logo{width:36px;height:46px}
}
@media(max-width:1150px){
 .sop-grid{grid-template-columns:1fr 1fr}
 .header-actions{gap:9px}
 .prototype-tag{font-size:10px}
 .breadcrumbs{gap:7px}
 .cal-cell{min-height:96px}
}
@media(max-width:700px){
 .sidebar-toggle{display:none}
 .header-actions .theme-toggle{display:flex;width:32px;height:32px}
 .topbar{gap:7px}
 .prototype-tag{display:none}
 .sidebar-bottom{padding-top:15px}
 .sidebar .nav-link{padding:10px 14px;margin-bottom:4px}
 .sop-grid{grid-template-columns:1fr}
 .ops-filters{flex-wrap:wrap;gap:12px}
 .ops-filters label{flex:1;min-width:120px}
 .ops-filters label:first-child{flex-basis:100%}
 .ops-filters>span{padding:0}
 .cal-header{padding:16px;gap:8px}
 .cal-header h2{font-size:17px}
 .cal-header>div:last-child{gap:5px}
 .cal-header .secondary{font-size:10px;padding:7px}
 .cal-header .icon-button{width:30px;height:32px}
 .cal-cell{min-height:98px}
 .agenda-row{flex-wrap:wrap;gap:7px;padding:15px}
 .agenda-row>span{width:100%}
 .agenda-row strong{font-size:12px}
 .agenda-row small{width:100%}
 .geo-site-panel{right:10px;top:70px}
 .cal-legend{gap:12px;font-size:9px;padding:14px}
}
/* Explicit dark surfaces preserve map imagery and the unit emblem. */
html[data-theme="dark"]{color-scheme:dark;--ink:#e2ecdf;--muted:#a9b8aa;--green:#7cbb91;--dark:#10241b;--lime:#405e39;--bg:#14221b;--line:#35493a;--white:#1e3026;--amber:#dfb978;--shadow:0 8px 35px #0002}
[data-theme="dark"] .topbar{background:#192b21;border-color:var(--line)}
[data-theme="dark"] :is(.card,.wx-card,.wx-kpi,.filterbar,.icon-button,.secondary,dialog,.ops-filters,.field input,.field select,.field textarea,.wx-toolbar select,.wx-filter select,.wx-role .active){background:var(--white);color:var(--ink);border-color:var(--line)}
[data-theme="dark"] :is(.page-heading p,.breadcrumbs,.breadcrumbs strong,.card-header p,.body-copy,.note-line,.metric-top,.metric small,.detail-list dt,.detail-list dd,.field,.field small,.monitor-item p,.program-card p,.wx-card p,.wx-kpi>span,.wx-kpi>small,.wx-facts,.wx-facts b,.wx-day small,.wx-hour small,.wx-hour b,.wx-hour-heading,.wx-toolbar label,.wx-card h3 small,.wx-water-row,.wx-footnote,.app-footer,.log-row p,.log-row small){color:var(--muted)!important}
[data-theme="dark"] :is(.wx-role,.wx-method,.wx-hour,.wx-crops span,.wx-clusters button,.readiness,.timeline-card,.tree-summary,.checklist label,.detail-grid>div,.source-row,.empty){background:#21372a;color:var(--ink);border-color:var(--line)}
[data-theme="dark"] :is(.wx-day,.wx-role button,.wx-task-link,.wx-clusters span,.wx-day>span:first-child){color:var(--ink);border-color:var(--line)}
[data-theme="dark"] :is(.wx-day.selected,.wx-hour.good){background:#2b4630;border-color:#648760}
[data-theme="dark"] :is(.wx-hour.rainy,.cal-event.task){background:#263f4a;color:#bad9e8;border-color:#567785}
[data-theme="dark"] :is(.notice,.wx-banner,.migration-note,.cluster-remainder-note){background:#393727;color:#e0cb99;border-color:#635b3e}
[data-theme="dark"] .wx-alert{background:#42302a;border-color:#705044;color:#efc1a5}
[data-theme="dark"] :is(.wx-pill,.badge){background:#344b38;color:#d7e5cf}
[data-theme="dark"] :is(.wx-pill.amber,.badge.amber){background:#51412a;color:#f0d099}
[data-theme="dark"] :is(.wx-pill.blue,.wx-rain){color:#92cce8!important}
[data-theme="dark"] :is(.wx-rain,.wx-hour span){color:#92cce8!important}
[data-theme="dark"] .wx-pill.blue{background:#294554}
[data-theme="dark"] :is(button.primary,.primary){background:#81b68a;color:#14271a}
[data-theme="dark"] :is(.text-button,.wx-task-link a){color:#add4a0}
[data-theme="dark"] :is(th,.cal-week,.progress-track,.sop-progress){background:#243b2c;color:#bbccba}
[data-theme="dark"] :is(td,th,.card-header,.monitor-item,.modal-header,.modal-actions){border-color:var(--line)}
[data-theme="dark"] :is(.cal-event.program){background:#2c4933;color:#d4e5cc;border-color:#8cb681}
[data-theme="dark"] .cal-event.activity{background:#493e29;color:#ecdbb4;border-color:#ae945c}
[data-theme="dark"] .cal-legend span{color:#b4cfa8}
[data-theme="dark"] .cal-legend span:nth-child(2){color:#ddc496}
[data-theme="dark"] .cal-legend span:nth-child(3){color:#a7d1e2}
[data-theme="dark"] .wx-day:hover{background:#344d37}
[data-theme="dark"] :is(.geo-legend,.geo-explorer,.geo-switch,.geo-basemap,.geo-terrain-note,.geo-site-panel,.maplibregl-ctrl){color-scheme:light;color:#354c3b}
[data-theme="dark"] .geo-switch select{color:#26633d}
[data-theme="dark"] .maplibregl-popup-content{color-scheme:light;color:#263e31}
.geo-actions button{color:#354c3b;color-scheme:light}
[data-theme="dark"] :is(.next-card,.map-source){background:#23382a;border-color:var(--line);color:var(--ink)}
[data-theme="dark"] :is(.next-card p,.step-num,.mini-map-line,.section-kicker,.detail-grid dt,.block-code,td small,.program-card small,.program-meta,.tree-summary small){color:var(--muted)!important}
[data-theme="dark"] .skip{color:#23432b}
[data-theme="dark"] .map-source button{color:#b5d0a7}
/* Spacing after removal of introductory sidebar and page elements. */
.sidebar>.nav-heading{margin-top:24px}
.sidebar-bottom .side-link{margin-top:0}
/* Photo-style tree registry, with explicitly labelled illustrative artwork. */
.census-layout.gallery-layout{display:block}
.gallery-layout>.species-card{margin-top:22px}
.tree-view-switch{display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;flex-shrink:0}
.tree-view-switch button{display:flex;align-items:center;gap:7px;padding:10px 13px;font-size:11px;background:var(--white);color:var(--muted)}
.tree-view-switch button.active{background:var(--green);color:var(--white)}
.tree-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding:22px}
.tree-gallery-card{display:block;min-width:0;padding:12px;text-align:left;background:var(--white);border:1px solid var(--line);border-radius:11px;transition:border-color .15s,box-shadow .15s}
.tree-gallery-card:hover{border-color:#83a475;box-shadow:0 5px 18px #244c3510}
.tree-gallery-image{position:relative;aspect-ratio:3/4;border-radius:7px;overflow:hidden;background:#dce5d3}
.tree-gallery-image img{display:block;width:100%;height:100%;object-fit:cover}
.tree-gallery-image>span{position:absolute;left:7px;bottom:7px;right:7px;border-radius:4px;padding:5px 6px;color:#eff4e8;background:#223f32d9;text-align:center;font-size:10px;line-height:1.5}
.tree-gallery-info{padding:13px 2px 3px}
.tree-gallery-info h3{font-size:14px;font-weight:750;color:var(--green);letter-spacing:0}
.tree-gallery-info p{font-size:11px;color:var(--muted);line-height:1.7;margin:5px 0 2px}
.tree-gallery-info>small{font-size:10px;color:var(--muted)}
.tree-gallery-badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}
.tree-gallery-badges .badge{font-size:10px;padding:5px 7px}
.tree-gallery>.empty{grid-column:1/-1}
.tree-passport-image{margin:0 0 20px;border-radius:10px;overflow:hidden;background:var(--bg);border:1px solid var(--line)}
.tree-passport-image img{display:block;width:100%;height:280px;object-fit:contain;background:#dbe3d3}
.tree-passport-image figcaption{font-size:11px;color:var(--muted);padding:10px;text-align:center}
[data-theme="dark"] .tree-view-switch button.active{color:#14271a}
@media(min-width:1650px){
 .tree-gallery{grid-template-columns:repeat(5,minmax(0,1fr))}
}
@media(max-width:1150px){
 .tree-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:18px}
}
@media(max-width:800px){
 .tree-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:500px){
 .tree-gallery{gap:10px;padding:12px}
 .tree-gallery-card{padding:8px}
 .tree-gallery-info h3{font-size:12px}
 .tree-gallery-info p{font-size:10px}
 .tree-gallery-image>span{font-size:8px;padding:4px;left:4px;right:4px;bottom:4px}
 .tree-view-switch button{padding:9px}
 .tree-view-switch button span{display:none}
 .gallery-layout .card-header{gap:10px}
 .gallery-layout .card-header p{max-width:200px}
 .tree-gallery-badges .badge{font-size:8px;padding:4px 5px}
}
/* East reference follows the projected map orientation, including tilted views. */
.geo-sunrise{position:absolute;right:16px;top:82px;z-index:3;display:flex;align-items:center;gap:9px;padding:10px 13px;background:#fffdf3f5;border:1px solid #e7dfc7;border-radius:10px;box-shadow:0 3px 15px #102b2b22;pointer-events:none;color:#a16b22}
.geo-sunrise-dial{width:42px;height:42px;flex-shrink:0}
.geo-sunrise-dial svg{width:100%;height:100%}
.geo-sunrise strong{display:block;font-size:12px;color:#655026;margin-bottom:5px}
.geo-sunrise span{display:block;font-size:10px;color:#86734e}
.geo-terrain-note{top:164px}
[data-theme="dark"] .geo-sunrise{background:#302f24f5;border-color:#62563a;color:#e8bd69}
[data-theme="dark"] .geo-sunrise strong{color:#f0dbac}
[data-theme="dark"] .geo-sunrise span{color:#d2bf95}
@media(max-width:700px){
 .geo-sunrise{top:73px;right:10px;padding:8px;gap:6px}
 .geo-sunrise-dial{width:32px;height:32px}
 .geo-sunrise strong{font-size:10px}
 .geo-sunrise span{font-size:9px}
 .geo-terrain-note{top:142px}
}
/* Map toolbar below the canvas, fullscreen on the whole frame, petak profile popup, 3D orbit cue. */
.farm-map-frame{position:relative}
.farm-map-frame .geo-buttons{position:static;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;padding:12px 16px;border-top:1px solid var(--line);background:transparent;pointer-events:auto}
.farm-map-frame .geo-buttons button{background:#f4f7f0;border:1px solid var(--line);box-shadow:none;color:#435349;min-height:36px}
.farm-map-frame .geo-buttons button:hover{border-color:#8fb58f}
.farm-map-frame .geo-buttons button.active{background:#24804a;border-color:#24804a;color:#fff}
.geo-legend,.geo-explorer{bottom:44px}
.farm-map-frame:fullscreen,.farm-map-frame.expanded{display:flex;flex-direction:column;width:100vw;height:100vh;background:#203b2c}
.farm-map-frame.expanded{position:fixed;inset:0;z-index:100}
.farm-map-frame:fullscreen .farm-map-stage,.farm-map-frame.expanded .farm-map-stage{flex:1;min-height:0;height:auto!important}
.farm-map-frame:fullscreen .geo-buttons,.farm-map-frame.expanded .geo-buttons{border-top-color:#ffffff22}
.farm-map-frame:fullscreen .geo-legend{width:190px}
.farm-map-frame:fullscreen .geo-terrain-note{font-size:14px}
.geo-terrain-note .geo-gestures{display:block;margin-top:8px;padding-top:8px;border-top:1px solid #e3e5db;line-height:1.6;color:#56624f}
.geo-terrain-note .geo-gestures[hidden]{display:none}
.farm-map-stage.orbiting canvas{cursor:move!important}
.farm-map-stage.orbiting::after{content:'Memutar peta 3D';position:absolute;top:84px;left:50%;transform:translateX(-50%);padding:6px 12px;border-radius:20px;background:#173a29e6;color:#fff;font-size:11px;font-weight:600;z-index:6;pointer-events:none}
.geo-profile-popup{z-index:7}
.geo-profile-popup .maplibregl-popup-content{padding:14px 14px 12px;border-radius:12px;box-shadow:0 12px 40px #0b1f1738;line-height:1.45}
.geo-profile-popup .maplibregl-popup-close-button{top:5px;right:7px;width:26px;height:26px;border-radius:6px;font-size:20px;color:#6d7a6f}
.geo-profile-popup .maplibregl-popup-close-button:hover{background:#eef3ea}
.petak-pop{width:min(284px,calc(100vw - 80px));color:#263e31}
.petak-pop-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding-right:24px}
.petak-pop-head span{font-size:10px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:#7b8a7c}
.petak-pop-head h3{font-size:20px;line-height:1.1;margin:3px 0 3px;color:#173e33}
.petak-pop-head small{display:block;font-size:10.5px;color:#6f7d70}
.petak-pop .badge{margin:14px 0 0;flex-shrink:0}
.petak-pop .badge.amber{background:#faf1df;color:#8f6521}
.petak-pop-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:11px 0 2px}
.petak-pop-stats div{background:#f3f6ef;border-radius:7px;padding:6px 8px}
.petak-pop-stats dt{font-size:10px;color:#7a877b}
.petak-pop-stats dd{margin:0;font-size:14px;font-weight:700;color:#23432f;white-space:nowrap}
.petak-pop-stats dd small{display:block;font-size:10px;font-weight:500;color:#6f7d70}
.petak-pop h4{font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:#6b7a6c;margin:11px 0 5px}
.petak-pop ul{list-style:none;display:grid;gap:6px;margin:0;padding:0}
.petak-pop li{display:grid;gap:1px;padding-left:9px;border-left:2px solid #b9d49b}
.petak-pop li strong{font-size:12px;color:#23432f}
.petak-pop li span{font-size:10.5px;color:#6f7d70}
.petak-pop .petak-pop-empty{margin:0;font-size:11px;color:#8a958b}
.petak-pop .petak-pop-last{margin:9px 0 0;font-size:10.5px;color:#6f7d70}
.petak-pop-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.petak-pop-actions .primary,.petak-pop-actions .secondary{flex:1;width:auto;min-height:34px;margin:0;padding:7px 10px;border-radius:7px;font-size:11.5px;gap:6px}
.geo-profile-popup .petak-pop-actions .primary{background:#246447;color:#fff}
.geo-profile-popup .petak-pop-actions .secondary{background:#fff;border:1px solid #d9e2d4;color:#26443a}
.geo-profile-popup .petak-pop .petak-pop-rename{color:#246447}
.petak-pop-actions .icon{width:14px;height:14px}
.petak-pop .petak-pop-rename{display:inline-flex;margin:8px 0 0;padding:2px 0;font-size:11.5px;gap:6px}
.petak-pop .petak-pop-rename .icon{width:13px;height:13px}
.petak-pop .petak-pop-note{margin:8px 0 0;font-size:10px;color:#98875c}
[data-theme="dark"] .farm-map-frame .geo-buttons button{background:#243a2c;border-color:var(--line);color:var(--ink)}
[data-theme="dark"] .farm-map-frame .geo-buttons button.active{background:#2f7a4c;border-color:#4f9a6a;color:#fff}
@media(max-width:700px){
 .farm-map-frame .geo-buttons{gap:6px;padding:10px}
 .farm-map-frame .geo-buttons button{font-size:11px;padding:8px 10px;min-height:34px}
 .geo-legend,.geo-explorer{bottom:40px}
 .farm-map-stage.orbiting::after{top:74px}
 .geo-profile-popup .maplibregl-popup-content{padding:11px 11px 10px}
 .petak-pop{width:min(270px,calc(100vw - 64px))}
 .petak-pop-head h3{font-size:17px}
 .petak-pop .badge{margin-top:10px}
 .petak-pop-stats{margin:8px 0 0}
 .petak-pop-stats div{padding:5px 7px}
 .petak-pop h4{margin:8px 0 4px}
 .petak-pop ul{gap:4px}
 .petak-pop-actions{margin-top:9px}
 .petak-pop-actions .primary,.petak-pop-actions .secondary{min-height:32px;font-size:11px}
 .petak-pop .petak-pop-rename{margin-top:6px}
}
/* Petak map without blocks: fullscreen brand, flat petak explorer, profile sections (elevation, soil, program). */
.geo-left{display:flex;align-items:center;gap:10px;min-width:0}
.geo-brand{display:none;align-items:center;gap:10px;padding:6px 14px 6px 8px;background:#123526eb;border:1px solid #ffffff2e;border-radius:12px;color:#fff;box-shadow:0 3px 15px #0005}
.geo-brand img{width:34px;height:43px;object-fit:contain;flex-shrink:0}
.geo-brand span{font-size:14px;font-weight:800;letter-spacing:.8px;line-height:1.15;white-space:nowrap}
.geo-brand small{display:block;margin-top:3px;font-size:9px;font-weight:600;letter-spacing:1.6px;color:#d9e6c7}
.farm-map-frame:fullscreen .geo-brand,.farm-map-frame.expanded .geo-brand{display:flex}
.geo-switch button:only-child{margin-left:0}
.geo-explorer-note{font-size:11px;color:#7f8976;margin:-4px 0 10px}
.geo-explorer-petak{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;border-top:1px solid #dfe6d8;padding-top:8px}
.geo-explorer-petak .geo-explorer-cluster{display:flex;justify-content:space-between;align-items:center;gap:6px;width:100%;padding:8px 9px;border-radius:6px;font-size:12px;font-weight:600;text-align:left}
.geo-explorer-petak .geo-explorer-cluster:hover{background:#e9f1e0}
.geo-explorer-petak .geo-explorer-cluster.chosen{background:#dbe9c4;color:#23492b}
.geo-explorer-petak small{font-size:10.5px;font-weight:500;color:#7f8976}
.petak-pop{width:min(336px,calc(100vw - 80px));max-height:var(--pop-max,440px);overflow:auto;overscroll-behavior:contain;padding-right:2px}
.petak-pop-foot{position:sticky;bottom:0;margin-top:10px;padding-top:2px;background:linear-gradient(#fff0,#fff 10px)}
.petak-pop-foot .petak-pop-actions{margin-top:6px}
.petak-pop-section{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.petak-pop-section h4{margin:9px 0 4px}
.petak-pop .petak-pop-inline{padding:0;font:inherit;color:#246447;text-decoration:underline;text-underline-offset:2px}
.petak-pop .petak-pop-link{font-size:10.5px;font-weight:650;color:#246447;white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.petak-pop li a{color:#173e33;text-decoration:underline;text-decoration-color:#9cc486;text-underline-offset:3px}
.petak-pop li a:hover{text-decoration-color:#246447}
.petak-pop-soil{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:0}
.petak-pop-soil div{border:1px solid #e3eadd;border-radius:7px;padding:4px 7px;min-width:0}
.petak-pop-soil dt{font-size:10px;color:#7a877b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.petak-pop-soil dd{margin:0;font-size:13px;font-weight:700;color:#23432f}
.petak-pop-soil dd small{display:block;font-size:10px;font-weight:500;line-height:1.3;color:#6f7d70}
.petak-pop .petak-pop-texture,.petak-pop .petak-pop-next{margin:6px 0 0;font-size:10.5px;color:#6f7d70}
.petak-pop .petak-pop-next strong{color:#23432f}
@media(max-width:700px){
 .geo-brand{padding:5px 10px 5px 6px}
 .geo-brand img{width:26px;height:33px}
 .geo-brand span{font-size:11px}
 .geo-brand small{font-size:7.5px;letter-spacing:1px}
 .geo-explorer-petak{grid-template-columns:1fr 1fr}
 .petak-pop-soil dd{font-size:12px}
}
/* Simulated sign-in screen, account menu, and user management. */
body.auth-pending .sidebar,body.auth-pending .shell,body.auth-pending .bottom-nav{visibility:hidden}
body.auth-locked .sidebar,body.auth-locked .shell,body.auth-locked .app-footer,body.auth-locked .bottom-nav{display:none}
#auth-root[hidden]{display:none}
.auth-screen{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);background:var(--bg)}
.auth-brand{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:6px;padding:64px clamp(32px,6vw,96px);color:#f0efd9;background-color:#253727;background-image:linear-gradient(160deg,rgba(15,34,24,.9),rgba(15,34,24,.78)),var(--loreng);background-size:100% 100%,cover;background-position:center}
.auth-brand img{width:96px;height:122px;object-fit:contain;margin-bottom:18px;border-radius:8px;background:#e9e9e5;box-shadow:0 10px 28px #0006}
.auth-brand strong{font-family:Manrope,sans-serif;font-size:34px;font-weight:800;letter-spacing:2px}
.auth-brand>span{font-size:12px;font-weight:700;letter-spacing:4px;color:#d9e6c7}
.auth-brand p{max-width:380px;margin-top:22px;font-size:14px;line-height:1.7;color:#cad4c2}
.auth-tag{display:inline-flex;align-items:center;gap:8px;margin-top:26px;padding:6px 12px;border:1px solid #ffffff2e;border-radius:20px;font-size:10px;font-weight:600;letter-spacing:1px;color:#e7e0c2}
.auth-tag i{width:6px;height:6px;border-radius:50%;background:#c29e53}
.auth-panel{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:48px clamp(20px,5vw,72px)}
.auth-card{display:grid;gap:16px;width:100%;max-width:400px;padding:30px;background:var(--white);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}
.auth-card h1{font-size:26px}
.auth-sub{margin-top:-8px;font-size:13px;line-height:1.6;color:var(--muted)}
.auth-pass{display:flex;gap:8px}
.auth-pass input{flex:1;min-width:0}
.auth-pass button{padding:0 12px;border:1px solid var(--line);border-radius:7px;background:var(--white);font-size:12px;font-weight:600;color:var(--green)}
.auth-remember{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.auth-card .inline-error{margin:0}
.auth-card .inline-error:empty{display:none}
.auth-card .primary{width:100%;min-height:44px;margin:0}
.auth-card .text-button{justify-self:center;margin:0;padding:0;font-size:12px}
.auth-hint{margin-top:-6px;font-size:11px;color:var(--muted)}
.auth-demo,.auth-note{width:100%;max-width:400px}
.auth-demo{padding:12px 16px;border:1px solid var(--line);border-radius:10px;background:var(--white);font-size:12px}
.auth-demo summary{cursor:pointer;font-weight:650;color:var(--ink)}
.auth-demo p{margin:10px 0 8px;line-height:1.6;color:var(--muted)}
.auth-demo code{padding:2px 6px;border-radius:5px;background:#edf2e7;color:#23432f;font-weight:700}
.auth-demo ul{list-style:none;display:grid;gap:5px;padding:0;margin:0}
.auth-demo li{display:flex;justify-content:space-between;align-items:center;gap:10px}
.auth-demo li button{font-weight:650;color:var(--green);text-decoration:underline;text-underline-offset:3px}
.auth-demo li span{color:var(--muted)}
.auth-note{font-size:11px;line-height:1.6;color:var(--muted)}
.user-chip{display:inline-flex;align-items:center;gap:8px;padding:3px 12px 3px 3px;border:1px solid var(--line);border-radius:22px;background:var(--white);color:var(--ink)}
.user-chip .avatar{width:30px;height:30px;font-size:11px;color:#f0efd9;flex-shrink:0}
.user-chip-text strong{display:block;font-size:12px;font-weight:650;line-height:1.2;text-align:left;white-space:nowrap}
.user-chip-text small{display:block;font-size:10px;text-align:left;color:var(--muted)}
.profile-button{display:flex;align-items:center;gap:9px;width:100%;color:inherit;text-align:left}
.profile-button>span:nth-child(2){min-width:0}
.profile-button>.icon{width:18px;margin-left:auto;color:#8ca68c}
.user-menu{position:fixed;z-index:60;width:240px;padding:8px;background:var(--white);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 40px #0b1f1733}
.user-menu[hidden]{display:none}
.user-menu-head{display:flex;align-items:center;gap:10px;margin-bottom:6px;padding:8px 8px 12px;border-bottom:1px solid var(--line)}
.user-menu-head .avatar{flex-shrink:0;color:#f0efd9}
.user-menu-head strong{display:block;font-size:13px}
.user-menu-head small{display:block;margin-top:2px;font-size:11px;color:var(--muted)}
.user-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 8px;border-radius:7px;font-size:13px;color:var(--ink);text-align:left}
.user-menu button:hover,.user-menu button:focus-visible{background:#eef3e9}
.user-menu .icon{width:16px;height:16px}
.users-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:start}
.users-side{display:grid;gap:18px}
.users-side h2{margin-bottom:12px;font-size:16px}
.user-cell{display:flex;align-items:center;gap:10px}
.user-cell .avatar{flex-shrink:0;color:#f0efd9}
.user-cell strong{display:block}
.user-cell .user-you{display:inline-block;margin:0 0 0 6px;padding:1px 6px;border-radius:10px;background:#e3efd9;color:#2e5a3c;font-size:10px;font-weight:700;vertical-align:1px}
.user-meta{display:none}
.users-table td .role-badge+small{margin-top:6px}
.user-never{font-size:12px;color:var(--amber)}
.user-manage{min-height:34px;padding:6px 12px;font-size:12px}
[data-perm-hidden]{display:none!important}
.role-badge{display:inline-flex;padding:4px 8px;border-radius:6px;background:#edf2e7;color:#3d6147;font-size:11px;font-weight:650;white-space:nowrap}
.role-admin{background:#1e3f30;color:#f0efd9}
.role-pengelola{background:#e1eed6;color:#2e5a3c}
.role-agronom{background:#e3f0ee;color:#245a57}
.role-lapangan{background:#f4ecd9;color:#7b5a24}
.role-pengamat{background:#eceff3;color:#4d5968}
.role-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line)}
.role-row small{display:block;margin-top:5px;font-size:11px;line-height:1.5;color:var(--muted)}
.role-row>strong{font-size:18px}
.audit-list{display:grid;gap:10px;max-height:320px;overflow:auto;margin-bottom:10px}
.audit-list p{font-size:12px;line-height:1.5}
.audit-list small{font-size:10px;color:var(--muted)}
.user-admin-row{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.user-admin-row strong{display:block;font-size:13px}
.user-admin-row small{display:block;margin-top:4px;font-size:11px;color:var(--muted)}
.user-admin-row .secondary{white-space:nowrap}
.user-admin-row .user-danger{color:#a64933}
.temp-pass{display:flex;align-items:center;gap:10px;margin:16px 0;padding:12px 14px;border:1px dashed #b9c9ad;border-radius:9px;background:#f5f8f1}
.temp-pass code{flex:1;font-size:20px;font-weight:700;letter-spacing:1px;color:#23432f}
.access-matrix th,.access-matrix td{text-align:center}
.access-matrix th:first-child,.access-matrix td:first-child{text-align:left;white-space:nowrap}
.access-none{color:var(--muted)}
[data-theme="dark"] .auth-demo code{background:#2c4434;color:var(--ink)}
[data-theme="dark"] .user-cell .user-you{background:#2f4a36;color:#cfe3c4}
[data-theme="dark"] .user-admin-row .user-danger{color:#f0a58f}
/* Dark theme gap since the handoff baseline: metric cards, search boxes, filter selects, and modal footers stayed white. */
[data-theme="dark"] :is(.metric,.input-wrap,.filterbar select,.modal-actions){background:var(--white);color:var(--ink);border-color:var(--line)}
[data-theme="dark"] :is(.user-menu button:hover,.user-menu button:focus-visible){background:#2a4032}
[data-theme="dark"] .temp-pass{background:#21372a;border-color:#4d6552}
[data-theme="dark"] .temp-pass code{color:var(--ink)}
@media(max-width:1100px){
 .users-layout{grid-template-columns:1fr}
}
@media(max-width:860px){
 .auth-screen{grid-template-columns:1fr}
 .auth-brand{align-items:center;padding:34px 24px 28px;text-align:center}
 .auth-brand img{width:64px;height:82px;margin-bottom:10px}
 .auth-brand strong{font-size:24px}
 .auth-brand p{display:none}
 .auth-tag{margin-top:14px}
 .auth-panel{justify-content:flex-start;padding:24px 16px 36px}
}
@media(max-width:700px){
 .user-chip{padding:2px}
 .user-chip-text{display:none}
 .users-table :is(th,td):is(:nth-child(2),:nth-child(3),:nth-child(4)){display:none}
 .user-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
 .user-manage{min-width:38px;padding:6px 10px}
 .user-manage span{display:none}
 .user-admin-row{flex-direction:column;align-items:stretch}
 .temp-pass code{font-size:17px}
}
/* ===== Mobile & touch =====
   Loading splash, phone bottom navigation, drawer, bottom-sheet dialogs, 16px form text (no iOS focus zoom), 44px touch targets on
   touch screens, readable minimum text sizes, 7-day calendar that fits a phone, lightweight overview map preview.
   Everything below is scoped to phones (max-width:700px) or touch pointers, except the splash and reduced-motion rules. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
a,button,summary,label,select,[role="button"]{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.boot-splash{display:none}
body.auth-pending .boot-splash{position:fixed;inset:0;z-index:5;display:grid;place-content:center;justify-items:center;gap:6px;background:var(--bg);color:var(--ink)}
.boot-splash img{width:64px;height:81px;margin-bottom:12px;border-radius:6px;background:#e9e9e5;animation:boot-pulse 1.6s ease-in-out infinite}
.boot-splash strong{font-family:Manrope,sans-serif;font-size:18px;font-weight:800;letter-spacing:2px}
.boot-splash span{font-size:13px;color:var(--muted)}
@keyframes boot-pulse{
 50%{opacity:.5}
}
.auth-screen{min-height:100vh;min-height:100dvh}
.bottom-nav{display:none}
.timeline-place{display:block;color:var(--muted);margin-top:4px;font-size:10px}
.tree-more{display:flex;align-items:center;gap:8px;margin:0 auto 18px}
.tree-more small{font-size:12px;font-weight:500;color:var(--muted)}
.map-preview{position:relative;display:block;width:100%;padding:0 16px 16px;text-align:left}
.map-preview .preset-preview{display:block;margin-top:0;height:300px}
.map-preview :is(.map-label,.map-sublabel,.context-label){display:none}
.map-preview-cta{position:absolute;left:50%;bottom:32px;display:inline-flex;align-items:center;gap:8px;width:max-content;min-height:44px;padding:10px 18px;border-radius:22px;font-size:14px;font-weight:600;transform:translateX(-50%);box-shadow:0 8px 20px #1d472638;pointer-events:none}
[data-theme="dark"] .map-preview svg>rect{fill:#1b2d23}
[data-theme="dark"] .map-preview .viewport>rect{opacity:.2}
[data-theme="dark"] .map-preview .grid-line{stroke:#2c4133}
[data-theme="dark"] .map-preview .context-shape{fill:#26392d;stroke:#3d5446}
[data-theme="dark"] .map-preview .site-outline{fill:#22382a;stroke:#9cc486}
[data-theme="dark"] .map-preview .block-shape{fill:#6f9f64;stroke:#1b2d23}
.map-preview-cta .icon{width:18px;height:18px}
.farm-map-frame.expanded{height:100vh;height:100dvh}
.farm-map-frame.expanded .geo-buttons{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
@media(max-width:700px),(pointer:coarse){
 input:not([type="checkbox"],[type="radio"],[type="range"],[type="color"]),select,textarea{font-size:16px!important}
}
@media(pointer:coarse){
 .icon-button,.user-chip{min-width:44px;min-height:44px}
 button.primary,button.secondary,.primary,.secondary,.text-button,.field input,.field select,.input-wrap,.filterbar select,.tree-view-switch button,.agenda-row,.workflow-step,.wx-role button,.wx-clusters button,.wx-card .secondary,.wx-method summary,.cal-header .secondary,.geo-switch button,.geo-basemap select,.map-source button,.farm-map-frame .geo-buttons button{min-height:44px}
 .input-wrap input{align-self:stretch}
 .wx-method summary{display:flex;align-items:center;flex-wrap:wrap}
 .wx-task-link a{display:inline-flex;align-items:center;min-height:44px}
 .geo-actions button{width:44px;height:44px}
 .farm-map-stage .maplibregl-ctrl-group button{width:40px;height:40px}
 .user-manage{min-width:44px}
 .check-square{position:relative}
 .check-square::after{content:'';position:absolute;inset:-12px}
 .petak-pop .petak-pop-link,.petak-pop .petak-pop-inline,.petak-pop li a,.petak-pop .petak-pop-rename{display:inline-flex;align-items:center;min-height:32px}
 .petak-pop-actions .primary,.petak-pop-actions .secondary{min-height:44px}
 .tree-view-switch button,td .text-button{min-width:44px;justify-content:center}
 .primary:active,.secondary:active,.icon-button:active,.tree-gallery-card:active,.agenda-row:active,.workflow-step:active,.bottom-nav :is(a,button):active{transform:scale(.97)}
}
@media(max-width:700px){
 /* shell: bottom navigation, safe areas, drawer */
 .topbar{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
 main{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
 .shell{padding-bottom:calc(66px + env(safe-area-inset-bottom))}
 html{scroll-padding-bottom:calc(76px + env(safe-area-inset-bottom))}
 .bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:24;display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:2px;padding:6px max(6px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));background:#fffffff5;border-top:1px solid var(--line);box-shadow:0 -6px 22px #2036290f}
 .bottom-nav a,.bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:52px;border-radius:12px;color:#66756b;font-size:11px;font-weight:600;line-height:1.2}
 .bottom-nav .icon{width:52px;height:28px;padding:4px 15px;border-radius:14px;transition:background-color .15s}
 .bottom-nav .active{color:var(--green)}
 .bottom-nav .active .icon{background:#dce8b1;color:#183c30}
 body.map-expanded .bottom-nav{display:none}
 body.menu-open{overflow:hidden}
 .sidebar{overflow-y:auto;overscroll-behavior:contain;padding-bottom:env(safe-area-inset-bottom)}
 #toast{bottom:calc(78px + env(safe-area-inset-bottom));max-width:calc(100vw - 32px)}
 /* dialogs become bottom sheets with the actions in thumb reach */
 dialog{width:100%;max-width:100%;margin:auto 0 0;border:0;border-radius:18px 18px 0 0;max-height:calc(100vh - 20px);max-height:calc(100dvh - 20px);box-shadow:0 -12px 50px #112d3333}
 dialog.wide{width:100%}
 dialog[open]{animation:sheet-up .22s ease-out}
 @keyframes sheet-up{
  from{transform:translateY(40px);opacity:.4}
 }
 #dialog-content{display:flex;flex-direction:column;max-height:calc(100vh - 20px);max-height:calc(100dvh - 20px)}
 .modal-header{flex-shrink:0;position:relative;padding-top:24px}
 .modal-header::before{content:'';position:absolute;top:8px;left:50%;width:38px;height:4px;margin-left:-19px;border-radius:2px;background:#d3dbcf}
 .modal-body{flex:1;min-height:0;max-height:none;overscroll-behavior:contain}
 .modal-actions{flex-shrink:0;padding-bottom:calc(16px + env(safe-area-inset-bottom))}
 .modal-actions button{font-size:14px;flex:1}
 /* readable minimum text on phones */
 .breadcrumbs{font-size:13px}
 .page-heading p{font-size:14px}
 .heading-actions .primary,.heading-actions .secondary,.focus-card .primary{font-size:14px}
 .notice{font-size:13px}
 .metric-top,.metric small,.card-header p,.table-footer,.workflow-step small,.tree-gallery-info p,.agenda-row>span,.agenda-row small,.cal-week span{font-size:12px}
 .workflow-step strong,.focus-card .text-button,td,.agenda-row strong{font-size:13px}
 .note-line,td small,.map-source,.app-footer,.app-footer button,.badge,.focus-card .section-kicker,.focus-card .block-code,.tree-gallery-info>small,.cal-legend,.map-source button{font-size:11.5px}
 .tree-gallery-badges .badge{font-size:11px;padding:4px 6px}
 .tree-gallery-image>span{font-size:11px}
 .bottom-nav a,.bottom-nav button{font-size:12px}
 td small,.app-footer,.app-footer button,.detail-grid dd span,.month-axis>span,.timeline-track>span,th,.sop-top,.program-note,.sop-bottom,.ops-filters label,.monitor-item p,.card>p.sub,.progress-line,.species-row{font-size:12px}
 .detail-grid dt{font-size:12px}
 .geo-explorer-petak .geo-explorer-cluster{font-size:13px;min-height:40px}
 .geo-explorer-petak small{font-size:11.5px}
 .geo-legend-items span,.geo-legend>label,.geo-status,.geo-sunrise strong,.geo-terrain-note strong,.geo-label strong{font-size:11px}
 .geo-sunrise span,.geo-terrain-note span,.geo-label span{font-size:10.5px}
 /* weather: hourly and daily strips were 9-10px */
 .wx-day>span:first-child,.wx-day small,.wx-hour b,.wx-hour span,.wx-hour-heading,.wx-clusters span,.wx-method summary span,.wx-kpi>span,.wx-kpi>small{font-size:12px}
 .wx-hour small{font-size:11px}
 .wx-hour{width:70px}
 .wx-day>.wx-rain,.wx-clusters strong,.wx-task-link,.wx-card header h2{font-size:13px}
 /* petak profile popup on the map */
 .petak-pop-head span,.petak-pop h4,.petak-pop .badge{font-size:10.5px}
 .petak-pop-head small,.petak-pop-stats dt,.petak-pop-stats dd small,.petak-pop-soil dt,.petak-pop-soil dd small,.petak-pop li span,.petak-pop .petak-pop-last,.petak-pop .petak-pop-texture,.petak-pop .petak-pop-next,.petak-pop .petak-pop-note,.petak-pop .petak-pop-link,.petak-pop .petak-pop-empty{font-size:11px}
 .petak-pop li strong,.petak-pop-actions .primary,.petak-pop-actions .secondary,.petak-pop .petak-pop-rename{font-size:13px}
 .petak-pop{width:min(300px,calc(100vw - 48px))}
 .wx-pill,.user-cell .user-you{font-size:11px}
 .wx-footnote{font-size:12px!important}
 .wx-activity span,.wx-crops span,.field small,.timeline-row.head,.timeline-row .bar,.timeline-place{font-size:12px}
 .gallery-layout .card-header p{max-width:none}
 /* census */
 .filterbar select{flex:1 1 calc(50% - 4px);max-width:none;min-width:0}
 .tree-gallery-card{content-visibility:auto;contain-intrinsic-size:auto 390px}
 /* map page: shorter stage so the page stays scrollable around it; register keeps the key columns */
 .map-workspace .farm-map-stage{height:clamp(340px,62vh,560px);height:clamp(340px,62svh,560px)}
 .farm-map-frame .geo-buttons button{font-size:12px}
 .block-table :is(th,td):is(:nth-child(4),:nth-child(5)){display:none}
 .block-table :is(th,td){padding-left:10px;padding-right:10px}
 .block-table td:nth-child(3){white-space:normal}
 .block-table td:last-child .text-button{font-size:0;gap:0;min-width:44px;justify-content:center}
 .block-table td:last-child .text-button .icon{width:18px;height:18px}
 /* calendar: all seven days fit; the whole day cell opens that day's agenda */
 .cal-week,.cal-grid{min-width:0}
 .cal-week span{padding:9px 0;text-align:center}
 .cal-cell{position:relative;min-height:60px;padding:5px 3px 7px;display:flex;flex-direction:column;align-items:center;gap:3px}
 .cal-day{height:30px;min-width:30px;margin:0;font-size:14px;border-radius:15px}
 .cal-day::after{content:'';position:absolute;inset:0}
 .cal-cell.today .cal-day{background:var(--green);color:#fff}
 .cal-event{width:calc(100% - 4px);height:5px;padding:0;margin:0;border:0;border-radius:3px;font-size:0;line-height:0;color:transparent;background:#609567;pointer-events:none}
 .cal-event.activity{background:#bc985a}
 .cal-event.task{background:#609fba}
 .cal-more{font-size:10px;line-height:1;pointer-events:none}
 .cal-header{flex-wrap:wrap}
 .cal-header .secondary{font-size:13px;padding:8px 12px}
 .cal-header small{font-size:11px}
 .audit-list small{font-size:11.5px}
}
[data-theme="dark"] .bottom-nav{background:#14231cf5;border-top-color:var(--line)}
[data-theme="dark"] .bottom-nav :is(a,button){color:var(--muted)}
[data-theme="dark"] .bottom-nav .active{color:#cfe3c4}
[data-theme="dark"] .bottom-nav .active .icon{background:#2f4a36;color:#dce8b1}
[data-theme="dark"] .modal-header::before{background:#3f5646}
@media(max-width:700px){
 [data-theme="dark"] .cal-grid .cal-event{background:#8cb681}
 [data-theme="dark"] .cal-grid .cal-event.activity{background:#c9a86a}
 [data-theme="dark"] .cal-grid .cal-event.task{background:#6fb0cc}
 [data-theme="dark"] .cal-cell.today .cal-day{color:var(--dark)}
}
/* Imagery date chip, "Citra terbaru" panel, and old/new comparison divider on the map. */
.geo-imagery-date{margin:0 0 6px 10px!important;padding:4px 9px;border-radius:6px;background:#ffffffeb;color:#243c30;font-size:11px;font-weight:650;line-height:1.5;box-shadow:0 1px 4px #0003;white-space:nowrap}
.geo-imagery-date[hidden]{display:none}
.geo-imagery-date.old{background:#fff4dfeb;color:#865a14}
.geo-imagery-date.old::before{content:'';display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:50%;background:#d39433;vertical-align:1px}
.geo-imagery-panel{position:absolute;top:78px;right:16px;max-width:calc(100% - 32px);width:290px;max-height:calc(100% - 96px);overflow:auto;background:#fffdf7f7;color:#344a3b;padding:16px;border-radius:10px;border:1px solid #dbe2d3;z-index:6;box-shadow:0 7px 30px #0003}
.geo-imagery-panel[hidden]{display:none}
.geo-imagery-panel>strong{font-size:14px}
.geo-imagery-panel p{font-size:11px;line-height:1.6;color:#77816d;margin:5px 0 10px}
.geo-imagery-list{display:grid;gap:4px;margin-bottom:6px}
.geo-imagery-list label,.geo-imagery-toggle{display:flex;gap:9px;align-items:center;padding:8px 0;font-size:12px;cursor:pointer}
.geo-imagery-list label span{display:grid;gap:2px}
.geo-imagery-list small{font-size:11px;color:#77816d}
.geo-imagery-panel input{accent-color:#34734b}
.geo-imagery-compare{width:100%;margin:6px 0 4px;padding:9px 12px;border-radius:8px;background:#246447;color:#fff;font-size:12px;font-weight:650}
.geo-imagery-compare:disabled{background:#c9d3c4;color:#5f6c61;cursor:not-allowed}
.geo-imagery-panel em{display:block;font-size:11px;font-style:normal;color:#8a6a2c;margin-bottom:6px}
.geo-imagery-empty{display:grid;gap:5px;padding:10px 12px;margin-bottom:10px;border-radius:8px;background:#f3f0e4;font-size:11.5px;line-height:1.6;color:#5f5a45}
.geo-imagery-empty b{font-size:12px;color:#4a4430}
.geo-imagery-empty code{font-size:11px;background:#e6e1cf;padding:0 4px;border-radius:3px}
.geo-imagery-panel>small{display:block;font-size:11px;line-height:1.6;color:#7b6840;border-top:1px solid #dedfcd;padding-top:10px}
#farm-gl>.geo-compare-map{position:absolute;inset:0;pointer-events:none}
.geo-compare{position:absolute;inset:0;z-index:5;pointer-events:none}
.geo-compare[hidden]{display:none}
.geo-compare-line{position:absolute;top:0;bottom:0;left:var(--x,50%);width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 0 1px #00000040,0 0 14px #00000073}
.geo-compare-handle{position:absolute;top:50%;left:var(--x,50%);display:grid;place-content:center;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:#fff;color:#173e33;font-size:20px;font-weight:700;box-shadow:0 3px 12px #0006;pointer-events:auto;touch-action:none;cursor:ew-resize}
.geo-compare-handle:focus-visible{outline:3px solid #ffd76a;outline-offset:2px}
.geo-compare-tag{position:absolute;top:64px;max-width:calc(50% - 18px);padding:5px 9px;border-radius:6px;background:#173e33e6;color:#fff;font-size:12px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.geo-compare-tag.old{left:10px}
.geo-compare-tag.new{right:10px}
.geo-compare-close{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);padding:9px 14px;border-radius:20px;background:#fff;color:#173e33;font-size:12px;font-weight:650;box-shadow:0 2px 10px #0004;pointer-events:auto;white-space:nowrap}
.farm-map-stage.comparing :is(.geo-sunrise,.geo-terrain-note,.geo-site-panel){display:none}
[data-theme="dark"] .geo-imagery-panel{color-scheme:light;color:#354c3b}
@media(max-width:700px){
 .geo-imagery-panel{right:10px;top:70px;width:min(290px,calc(100% - 20px))}
 .geo-site-panel p,.geo-site-panel>small{font-size:11.5px}
 .geo-imagery-list label,.geo-imagery-toggle{min-height:44px;font-size:13px}
 .geo-imagery-compare,.geo-compare-close{min-height:44px;font-size:13px}
 .geo-compare-tag{top:60px;font-size:11.5px}
}
/* Siteplan zones in the site layer panel: grouped layers with a one-line summary. The panel scrolls and stops above the bottom-right map controls. */
.geo-site-panel{max-height:max(240px,calc(100% - 300px));overflow-y:auto;overscroll-behavior:contain}
.geo-site-panel label>span{display:grid;gap:2px;min-width:0}
.geo-site-panel label small{font-size:10px;line-height:1.45;color:#77816d}
.site-zone{border-top:1px solid #e1e6db;padding-top:10px;margin-top:6px}
.site-zone strong{font-size:11px;color:#34734b}
@media(max-width:700px){
 .geo-site-panel label small{font-size:11.5px}
}
/* Sentinel-2 and other registered imagery: NDVI legend, comparison baseline, attribution, newer-scene note. */
.geo-imagery-legend{margin:0 0 6px 10px!important;padding:8px 10px;max-width:240px;border-radius:8px;background:#ffffffeb;color:#243c30;box-shadow:0 1px 4px #0003}
.geo-imagery-legend[hidden]{display:none}
.geo-imagery-legend strong{display:block;margin-bottom:6px;font-size:11px}
.geo-legend-classes{display:grid;grid-template-columns:1fr 1fr;gap:4px 10px}
.geo-legend-classes span{display:flex;align-items:center;gap:6px;font-size:10.5px;line-height:1.3}
.geo-legend-classes i{width:11px;height:11px;flex-shrink:0;border-radius:2px;box-shadow:inset 0 0 0 1px #0002}
.geo-imagery-legend small{display:block;margin-top:6px;font-size:10px;color:#6f7d70}
.geo-imagery-legend b{font-weight:500}
.geo-legend-short{display:none}
.geo-imagery-baseline{display:grid;gap:5px;margin:4px 0 2px;font-size:11.5px;color:#5f6c61}
.geo-imagery-baseline select{width:100%;padding:7px 8px;border:1px solid #d6decf;border-radius:7px;background:#fff;color:#243c30;font-size:12px}
.geo-imagery-panel .geo-imagery-attrib{margin:6px 0 0;font-size:10.5px;color:#6f7d70}
.geo-imagery-panel .geo-imagery-newer{margin:6px 0 8px;padding:7px 9px;border-radius:7px;background:#eef3ea;font-size:11px;line-height:1.5;color:#4b5d4f}
.geo-imagery-panel .geo-imagery-newer.new{background:#fff4df;color:#865a14}
.geo-imagery-newer code{padding:0 4px;border-radius:3px;background:#0000000f;font-size:10.5px}
@media(max-width:700px){
 .geo-imagery-legend{max-width:176px;padding:7px 9px}
 .geo-legend-classes{grid-template-columns:repeat(2,auto);gap:4px 10px}
 .maplibregl-ctrl-top-left .geo-imagery-legend{margin:62px 0 0 10px!important}
 .farm-map-stage.comparing .maplibregl-ctrl-top-left .geo-imagery-legend{margin-top:98px!important}
 .geo-legend-long{display:none}
 .geo-legend-short{display:inline}
 .geo-legend-classes span,.geo-imagery-legend small,.geo-imagery-panel .geo-imagery-attrib{font-size:11px}
 .geo-imagery-baseline select{min-height:44px}
}
/* Brand lockup: small unit line, then NAGA RUNTING / FARM on two lines (sidebar, full-screen map, sign-in, boot).
   The name keeps the sidebar's original size; only the unit line is smaller. */
.brand>span{line-height:1.12}
.brand>span small{margin:0 0 5px;font-size:8.5px;font-weight:650;letter-spacing:1.4px;line-height:1.2;color:#c9d2b9}
@media(min-width:701px) and (max-width:1180px){
 .brand>span small{font-size:7.5px;letter-spacing:1px;margin-bottom:4px}
}
@media(min-width:701px) and (max-width:960px){
 .brand>span small{font-size:7px;letter-spacing:.6px}
}
@media(max-width:700px){
 .brand>span small{font-size:9px}
}
.geo-brand span small{margin:0 0 3px}
.auth-brand strong{line-height:1.08}
.boot-splash small{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--muted)}
.boot-splash strong{line-height:1.15;text-align:center}
/* Sidebar collapse control at the bottom of the side menu; it keeps its place when the menu is narrow. */
.sidebar-collapse{display:flex;align-items:center;gap:10px;flex-shrink:0;margin:0 -18px;padding:12px 18px calc(12px + env(safe-area-inset-bottom));min-height:46px;border-top:1px solid #aab89433;background:#10231af5;color:#c9d4c3;font-size:12px;font-weight:600;text-align:left;cursor:pointer}
.sidebar-collapse svg{width:18px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.sidebar-collapse:hover{background:#1b3526;color:#fff}
.sidebar-collapse:focus-visible{outline:2px solid #d8e8a2;outline-offset:-3px}
body.sidebar-collapsed .sidebar-collapse{margin:auto -12px 0;padding-left:0;padding-right:0;justify-content:center}
body.sidebar-collapsed .sidebar-collapse span{display:none}
body.sidebar-collapsed .sidebar-collapse svg{transform:scaleX(-1)}
@media(min-width:701px) and (max-width:1180px){
 body:not(.sidebar-collapsed) .sidebar-collapse{margin:0 -12px;padding-left:12px;padding-right:12px}
}
@media(max-width:700px){
 .sidebar-collapse{display:none}
}
@media(prefers-reduced-motion:reduce){
 .sidebar-collapse svg{transition:none}
}
/* Tumpangsari stage chips, stage track, and crop glyphs (farm-status.js). */
.stage-chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 3px;border:1px solid color-mix(in srgb,var(--stage) 32%,#fff);border-radius:999px;background:color-mix(in srgb,var(--stage) 12%,#fff);color:color-mix(in srgb,var(--stage) 72%,#000);font-size:11px;font-weight:650;line-height:1.2;white-space:nowrap}
.stage-chip .stage-icon{width:18px;height:18px;flex-shrink:0}
[data-theme="dark"] .stage-chip{border-color:color-mix(in srgb,var(--stage) 55%,#1e3026);background:color-mix(in srgb,var(--stage) 30%,#1e3026);color:color-mix(in srgb,var(--stage) 25%,#fff)}
.crop-icon .crop-glyph,.tree-symbol .crop-glyph{display:block;width:30px;height:30px}
.program-card-top .crop-icon{padding:6px;border-radius:50%}
.tree-summary .tree-symbol.crop-icon{padding:10px;border-radius:50%}
.tree-summary .tree-symbol .crop-glyph{width:40px;height:40px}
[data-theme="dark"] :is(.program-card-top .crop-icon,.tree-summary .tree-symbol.crop-icon){background:#2a4232}
.stage-track{list-style:none;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;margin:10px 0 18px;padding:0}
.stage-track li{position:relative;display:grid;justify-items:center;gap:5px;text-align:center;font-size:10px;line-height:1.2;color:var(--muted)}
.stage-track li:not(:last-child)::after{content:'';position:absolute;top:13px;left:calc(50% + 16px);right:calc(-50% + 12px);height:2px;border-radius:2px;background:var(--line)}
.stage-track li.past::after{background:#8fb58f}
.stage-track .stage-icon{width:26px;height:26px;border-radius:50%;opacity:.38;filter:grayscale(.7)}
.stage-track li.past .stage-icon{opacity:.75;filter:none}
.stage-track li.current .stage-icon{opacity:1;filter:none;box-shadow:0 0 0 3px #d8e8a2}
.stage-track li.current span{font-weight:700;color:var(--ink)}
[data-theme="dark"] .stage-track li.current .stage-icon{box-shadow:0 0 0 3px #8fb56d}
@media(max-width:700px){
 .stage-track{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:12px}
 .stage-track li:nth-child(4)::after{display:none}
 .stage-track li{font-size:11px}
}
/* Map: status pins legend panel and petak explorer icons. Map overlays keep light surfaces in both themes. */
.geo-status-panel{position:absolute;top:78px;right:16px;z-index:6;width:300px;max-width:calc(100% - 32px);max-height:max(240px,calc(100% - 300px));overflow-y:auto;overscroll-behavior:contain;padding:16px;border:1px solid #dbe2d3;border-radius:10px;background:#fffdf7f8;color:#344a3b;box-shadow:0 7px 30px #0003;color-scheme:light}
.geo-status-panel[hidden]{display:none}
.geo-status-panel>strong{font-size:14px}
.geo-status-panel>p{margin:5px 0 8px;font-size:11px;line-height:1.55;color:#6f7b69}
.geo-status-toggle{display:flex;align-items:center;gap:8px;padding:6px 0 10px;border-bottom:1px solid #e3e6da;font-size:12px;font-weight:600;cursor:pointer}
.geo-status-toggle input{width:16px;height:16px;accent-color:#34734b}
.geo-status-stages{list-style:none;display:grid;gap:1px;margin:6px 0 0;padding:0}
.geo-status-stages li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:9px;padding:5px 0}
.geo-status-stages .stage-icon{width:24px;height:24px}
.geo-status-stages b{display:block;font-size:12px;font-weight:650;color:#2a4033}
.geo-status-stages small{display:block;font-size:10.5px;line-height:1.4;color:#77816d}
.geo-status-panel em{min-width:16px;font-size:11.5px;font-style:normal;font-weight:700;text-align:right;color:#24804a}
.geo-status-crops{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px;margin-top:8px;padding-top:10px;border-top:1px solid #e3e6da}
.geo-status-crops span{display:flex;align-items:center;gap:7px;min-width:0;font-size:11.5px;color:#34473a}
.geo-status-crops em{margin-left:auto}
.geo-status-panel .crop-glyph{width:22px;height:22px;flex-shrink:0}
.geo-status-panel .geo-status-ghost{display:flex;align-items:center;gap:8px;margin:10px 0 0;font-size:10.5px;line-height:1.45;color:#6f7b69}
.geo-status-panel>small{display:block;margin-top:10px;padding-top:10px;border-top:1px solid #dedfcd;font-size:10.5px;line-height:1.6;color:#7b6840}
.farm-map-stage.comparing .geo-status-panel{display:none}
.geo-explorer-status{display:inline-flex;align-items:center;gap:2px;margin-left:auto;font-style:normal}
.geo-explorer-status svg{width:17px;height:17px}
.geo-explorer-status b{font-size:10px;font-weight:700;color:#5e6d58}
.geo-explorer-petak .geo-explorer-cluster small{flex-shrink:0}
.map-status rect{fill:#10211aeb;stroke:#ffffffa6;stroke-width:1}
@media(max-width:700px){
 .geo-status-panel{top:70px;left:10px;right:10px;width:auto;max-width:none}
 .geo-status-stages b,.geo-status-crops span,.geo-status-toggle{font-size:13px}
 .geo-status-stages small,.geo-status-panel>p,.geo-status-panel .geo-status-ghost,.geo-status-panel>small{font-size:11.5px}
 .geo-status-toggle{min-height:44px}
}
/* Petak profile: program with crop glyph and stage chip; soil cards coloured by class (red kurang, amber cukup, green baik). */
.petak-pop li{grid-template-columns:28px minmax(0,1fr);align-items:center;column-gap:8px;padding-left:0;border-left:0}
.petak-pop li>div{display:grid;justify-items:start;gap:3px;min-width:0}
.petak-pop .petak-pop-crop{width:28px;height:28px}
.petak-pop .stage-chip{padding:2px 8px 2px 2px;border-color:color-mix(in srgb,var(--stage) 32%,#fff);background:color-mix(in srgb,var(--stage) 12%,#fff);color:color-mix(in srgb,var(--stage) 72%,#000);font-size:10.5px}
.petak-pop .stage-chip .stage-icon{width:15px;height:15px}
.petak-pop-soil div[data-tone]{border-left-width:3px}
.petak-pop-soil div[data-tone="low"]{border-color:#efc4bd;border-left-color:#d2493a;background:#fdeeeb}
.petak-pop-soil div[data-tone="low"] dd{color:#9c2c1f}
.petak-pop-soil div[data-tone="low"] dd small{color:#a44a3e}
.petak-pop-soil div[data-tone="fair"]{border-color:#ecd8a8;border-left-color:#d39a22;background:#fdf5e2}
.petak-pop-soil div[data-tone="fair"] dd{color:#7c540c}
.petak-pop-soil div[data-tone="fair"] dd small{color:#86682d}
.petak-pop-soil div[data-tone="good"]{border-color:#bfdcb2;border-left-color:#3f9b52;background:#eaf5e4}
.petak-pop-soil div[data-tone="good"] dd{color:#1f5f30}
.petak-pop-soil div[data-tone="good"] dd small{color:#3d6f47}
.petak-pop .petak-pop-tones{display:flex;flex-wrap:wrap;align-items:center;gap:3px 6px;margin:6px 0 0;font-size:10.5px;color:#5f6d60}
.petak-pop-tones i{display:inline-block;width:9px;height:9px;border-radius:3px}
.petak-pop-tones i[data-tone="low"]{background:#d2493a}
.petak-pop-tones i[data-tone="fair"]{background:#d39a22}
.petak-pop-tones i[data-tone="good"]{background:#3f9b52}
.petak-pop-tones span{color:#7a877b}
@media(max-width:700px){
 .petak-pop .petak-pop-tones{font-size:11px}
}
/* Dark theme: program notes and the schedule header no longer show light boxes. */
[data-theme="dark"] .program-note{background:#21372a;color:#c3cfc0}
[data-theme="dark"] .timeline-row.head{background:#1a2d23;color:var(--muted)}
[data-theme="dark"] .timeline-row .bar,[data-theme="dark"] .schedule-bar{background:#8fb56d}
/* 3D is the default: on phones the terrain note is a one-line tag (sources stay in "Sumber peta & elevasi"). */
@media(max-width:700px){
 .geo-terrain-note{width:auto;max-width:170px;padding:6px 9px}
 .geo-terrain-note strong{margin:0}
 .geo-terrain-note>span:not(.geo-gestures),.geo-terrain-note .geo-gestures{display:none}
}
/* Tree register photos: openly licensed species examples with credits (not field photos); "Lainnya" keeps its illustration. */
.tree-gallery-image.photo{background:#1b2a21}
.tree-gallery-image.photo>span{background:#0f1d16cc;backdrop-filter:blur(2px)}
.tree-passport-image.photo{background:#15241c;border-color:var(--line)}
.tree-passport-image.photo img{height:320px;background:#15241c}
.tree-passport-image figcaption strong{display:block;font-weight:650;color:var(--ink)}
.tree-passport-image figcaption span{display:block;margin-top:4px;line-height:1.5}
.tree-passport-image figcaption a,.photo-credits a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.credit-heading{margin:22px 0 6px;font-size:14px}
.photo-credits{list-style:none;display:grid;gap:8px;margin:10px 0 18px;padding:0;font-size:12px}
.photo-credits li{padding:8px 10px;border:1px solid var(--line);border-radius:8px}
.photo-credits small{display:block;margin-top:3px;color:var(--muted);line-height:1.5}
@media(max-width:700px){
 .tree-passport-image.photo img{height:260px}
 .tree-passport-image figcaption,.photo-credits small{font-size:11px}
}
[data-theme="dark"] .tree-summary .tree-symbol:not(.crop-icon){background:#2a4232;color:#a9c99a}
/* Jaringan air (pra-desain): map panel, popups, rising-main profile and the design dialog.
   Chart colours: energy line in the validated spring-water blue, surge envelope as its 10% wash, ground as the de-emphasis gray,
   pipe classes as a two-step ordinal blue. The map panel stays light like the other map panels. */
.geo-water-panel{position:absolute;top:78px;right:16px;max-width:calc(100% - 32px);width:318px;max-height:max(260px,calc(100% - 150px));overflow:auto;overscroll-behavior:contain;background:#fffdf7f7;color:#344a3b;padding:16px;border-radius:10px;border:1px solid #dbe2d3;z-index:6;box-shadow:0 7px 30px #0003}
.geo-water-panel[hidden]{display:none}
.geo-water-panel>strong{font-size:14px}
.geo-water-panel>p{font-size:11px;line-height:1.6;color:#77816d;margin:5px 0 10px}
.geo-water-panel input{accent-color:#34734b}
[data-theme="dark"] .geo-water-panel{color-scheme:light;color:#354c3b}
.water-master{display:flex;gap:9px;align-items:center;padding:6px 0 8px;font-size:12px;font-weight:600;border-bottom:1px solid #e3e7dc;cursor:pointer}
.water-systems{display:grid;gap:2px;margin:6px 0 10px}
.water-systems label{display:flex;gap:9px;align-items:center;padding:6px 0;font-size:12px;cursor:pointer}
.water-systems label>span{display:grid;gap:2px;min-width:0}
.water-systems small{font-size:10.5px;line-height:1.45;color:#77816d}
.water-systems input:disabled~*{opacity:.5}
.water-key{flex-shrink:0;display:inline-block;width:18px;height:0;border-top:3px solid #7b8479;border-radius:2px}
.water-key.spring{border-top-color:#2a78d6}
.water-key.reuse{border-top-color:#1baf7a}
.water-key.dash{border-top-style:dashed}
.water-facts{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0 0 10px}
.water-facts div{padding:7px 8px;border-radius:7px;background:#f1f4ec}
.water-facts dt{font-size:10px;color:#6f7b6c}
.water-facts dd{margin:2px 0 0;font-size:12px;font-weight:650;color:#263e31}
.water-actions{display:grid;grid-template-columns:auto 1fr;gap:8px;margin:10px 0}
.water-actions button{padding:8px 10px;border-radius:8px;border:1px solid #d6decf;background:#fff;color:#246447;font-size:12px;font-weight:600}
.water-actions button.primary{margin:0;width:auto;background:#246447;border-color:#246447;color:#fff;box-shadow:none}
.geo-water-panel>small{display:block;font-size:10.5px;line-height:1.6;color:#7b6840;border-top:1px solid #dedfcd;padding-top:10px}
.water-chart{--wc-surface:#fff;--wc-ink:#243e35;--wc-muted:#66736b;--wc-grid:#e6ebe3;--wc-hgl:#2a78d6;--wc-band:#2a78d61a;--wc-ground:#8a877d;--wc-ground-fill:#8a877d1f;--wc-sdr9:#1c5cab;--wc-sdr11:#6da7ec;--wc-mark:#cfd6cc;position:relative}
[data-theme="dark"] .water-chart{--wc-surface:var(--white);--wc-ink:var(--ink);--wc-muted:var(--muted);--wc-grid:#2f4336;--wc-hgl:#3987e5;--wc-band:#3987e524;--wc-ground:#86928a;--wc-ground-fill:#86928a24;--wc-sdr9:#86b6ef;--wc-sdr11:#256abf;--wc-mark:#3d5445}
.geo-water-panel .water-chart.compact{--wc-surface:#fffdf7;--wc-ink:#243e35;--wc-muted:#66736b;--wc-grid:#e6ebe3;--wc-hgl:#2a78d6;--wc-band:#2a78d61a;--wc-ground:#8a877d;--wc-ground-fill:#8a877d1f;--wc-sdr9:#1c5cab;--wc-sdr11:#6da7ec;--wc-mark:#cfd6cc;margin:4px 0 2px}
.water-chart-frame{position:relative}
.water-chart svg{display:block;width:100%;height:auto;overflow:visible;font-family:inherit;touch-action:pan-y}
.water-chart svg:focus-visible{outline:2px solid var(--wc-hgl);outline-offset:3px;border-radius:4px}
.water-chart .grid{stroke:var(--wc-grid);stroke-width:1}
.water-chart .tick{fill:var(--wc-muted);font-size:10.5px;font-variant-numeric:tabular-nums}
.water-chart.compact .tick,.water-chart-frame.narrow .tick{font-size:11.5px}
.water-chart .ground{fill:var(--wc-ground-fill)}
.water-chart .ground-line{fill:none;stroke:var(--wc-ground);stroke-width:2;stroke-linejoin:round}
.water-chart .band{fill:var(--wc-band)}
.water-chart .hgl{fill:none;stroke:var(--wc-hgl);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.water-chart .sdr-9{fill:var(--wc-sdr9)}
.water-chart .sdr-11{fill:var(--wc-sdr11)}
.water-chart .mark{stroke:var(--wc-mark);stroke-width:1}
.water-chart .valve{fill:var(--wc-ink);stroke:var(--wc-surface);stroke-width:2}
.water-chart .washout{fill:var(--wc-surface);stroke:var(--wc-ink);stroke-width:2}
.water-chart .direct{fill:var(--wc-ink);font-size:11.5px;font-weight:600}
.water-chart .direct.muted{fill:var(--wc-muted);font-weight:500}
.water-chart .cross{stroke:var(--wc-muted);stroke-width:1}
.water-chart .cross-dot{fill:var(--wc-hgl);stroke:var(--wc-surface);stroke-width:2}
.water-chart .hit{fill:transparent;cursor:crosshair}
.water-tip{position:absolute;z-index:2;display:grid;gap:3px;min-width:160px;padding:8px 10px;border-radius:8px;background:var(--wc-surface);border:1px solid var(--wc-grid);box-shadow:0 6px 20px #0003;pointer-events:none}
.water-tip[hidden]{display:none}
.water-tip b{font-size:11px;font-weight:600;color:var(--wc-muted)}
.water-tip span{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.water-tip strong{font-size:12px;color:var(--wc-ink);font-variant-numeric:tabular-nums}
.water-tip small{font-size:11px;color:var(--wc-muted)}
.water-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin:10px 0 0;padding:0;list-style:none;font-size:11.5px;color:var(--wc-muted)}
.water-legend li{display:flex;align-items:center;gap:7px}
.water-legend .key-line{width:18px;height:0;border-top:2px solid var(--wc-ground)}
.water-legend .key-line.hgl{border-top-color:var(--wc-hgl)}
.water-legend .key-rect{width:14px;height:9px;border-radius:2px;background:var(--wc-band);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--wc-hgl) 55%,transparent)}
.water-legend .key-rect.sdr-9{background:var(--wc-sdr9)}
.water-legend .key-rect.sdr-11{background:var(--wc-sdr11)}
.water-legend .key-dot{width:8px;height:8px;border-radius:50%;background:var(--wc-ink)}
.water-legend .key-dot.hollow{background:transparent;box-shadow:inset 0 0 0 2px var(--wc-ink)}
.water-notice{margin:0 0 16px}
.water-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.water-kpi{display:grid;align-content:start;gap:3px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.water-kpi span,.water-kpi small{font-size:11px;line-height:1.45;color:var(--muted)}
.water-kpi strong{font-size:19px;font-weight:650;line-height:1.25;color:var(--ink)}
.water-h{font-size:14px;margin:24px 0 10px}
.water-h small{margin-left:8px;font-size:11px;font-weight:500;color:var(--muted)}
.water-flow{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin:0;padding:0;list-style:none;counter-reset:flow}
.water-flow li{position:relative;display:grid;align-content:start;gap:2px;padding:9px 11px 9px 38px;border:1px solid var(--line);border-left:4px solid #2a78d6;border-radius:9px;background:var(--white);font-size:12px;counter-increment:flow}
.water-flow li::before{content:counter(flow);position:absolute;left:9px;top:9px;display:grid;place-content:center;width:20px;height:20px;border-radius:50%;background:var(--bg);border:1px solid var(--line);font-size:11px;font-weight:650;color:var(--muted)}
.water-flow li.reuse{border-left-color:#1baf7a}
.water-flow li small{font-size:11px;line-height:1.4;color:var(--muted)}
.water-side{margin:10px 0 0;font-size:11.5px;color:var(--muted)}
.water-qa{display:grid;gap:10px}
.water-qa>div{padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.water-qa h4{margin:0 0 6px;font-size:13px}
.water-qa p{margin:0;font-size:12.5px;line-height:1.7}
.water-note{margin:8px 0 0;font-size:11.5px;line-height:1.65;color:var(--muted)}
.water-table{margin-top:10px;border:1px solid var(--line);border-radius:10px}
.water-table table{width:100%;border-collapse:collapse}
.water-table th{position:static;display:table-cell;padding:9px 12px;text-align:left;font-size:10.5px;letter-spacing:.3px;white-space:nowrap}
.water-table td{padding:9px 12px;text-align:left;vertical-align:top;font-size:12px;line-height:1.5;white-space:normal;border-bottom:1px solid var(--line)}
.water-table td:first-child{min-width:120px}
.water-table tr:last-child td{border-bottom:0}
.water-tag{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:10px;background:#e3eefb;color:#1c5cab;font-size:10px;font-weight:650}
.water-details{margin-top:12px}
.water-details summary{padding:6px 0;font-size:12.5px;font-weight:600;color:var(--green);cursor:pointer}
.water-steps{display:grid;gap:8px;margin:0;padding-left:20px;font-size:12.5px;line-height:1.65}
.water-refs{display:grid;gap:5px;margin:6px 0 0;padding-left:18px;font-size:11.5px;line-height:1.6;color:var(--muted)}
.water-pop{display:grid;gap:4px;max-width:250px}
.water-pop-kind{display:flex;align-items:center;gap:6px;font-size:10.5px;color:#5f6c61}
.water-pop strong{font-size:13px;line-height:1.35}
.water-pop small{font-size:11px;line-height:1.45;color:#58675c}
.water-pop p{margin:4px 0!important;font-size:11.5px;line-height:1.6}
.water-pop .text-button{margin:0;padding:2px 0;justify-content:flex-start;font-size:11.5px;color:#246447}
.water-pop .water-pop-status{font-size:10px;color:#8a6a2c}
/* Rataan tanah (cut & fill): platform per sub area, peta galian–timbunan, dan angka volumenya. */
.geo-grading-panel{position:absolute;top:78px;right:16px;max-width:calc(100% - 32px);width:320px;max-height:max(260px,calc(100% - 150px));overflow:auto;overscroll-behavior:contain;background:#fffdf7f7;color:#344a3b;padding:16px;border-radius:10px;border:1px solid #dbe2d3;z-index:6;box-shadow:0 7px 30px #0003;color-scheme:light}
.geo-grading-panel[hidden]{display:none}
.geo-grading-panel>strong{font-size:14px}
.geo-grading-panel>p{font-size:11px;line-height:1.6;color:#77816d;margin:5px 0 10px}
.geo-grading-panel input{accent-color:#34734b}
.geo-grading-groups{list-style:none;display:grid;gap:1px;margin:10px 0 0;padding:0}
.geo-grading-groups li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid #eceee4}
.geo-grading-groups b{display:block;font-size:12px;font-weight:650;color:#2a4033}
.geo-grading-groups small{display:block;font-size:10.5px;line-height:1.45;color:#77816d}
.geo-grading-groups em{font-style:normal;text-align:right;font-size:10.5px;font-weight:700;line-height:1.5;color:#8a4a2e;white-space:nowrap}
.geo-grading-total{margin:10px 0 0;font-size:10.5px;line-height:1.65;color:#455040}
.geo-grading-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 10px;margin:10px 0 0}
.geo-grading-legend span{display:flex;align-items:center;gap:6px;min-width:0;font-size:10px;color:#47533f}
.geo-grading-legend i{width:11px;height:11px;border-radius:3px;flex-shrink:0}
.geo-grading-panel>small{display:block;margin-top:10px;padding-top:10px;border-top:1px solid #dedfcd;font-size:10px;line-height:1.65;color:#7b6840}
.farm-map-stage.comparing .geo-grading-panel{display:none}
[data-theme="dark"] .geo-grading-panel{color-scheme:light;color:#354c3b}
[data-theme="dark"] .water-tag{background:#223a5a;color:#cfe2fb}
[data-theme="dark"] .water-flow li{background:#21372a}
@media(max-width:700px){
 .geo-grading-panel{right:10px;top:70px;width:min(320px,calc(100% - 20px))}
 .geo-grading-panel>p,.geo-grading-panel>small,.geo-grading-total,.geo-grading-groups small,.geo-grading-groups em{font-size:11.5px}
 .geo-grading-legend span{font-size:11px}
 .geo-water-panel{right:10px;top:70px;width:min(318px,calc(100% - 20px))}
 .geo-water-panel>p,.geo-water-panel>small,.water-systems small{font-size:11.5px}
 .water-master,.water-systems label{min-height:44px;font-size:13px}
 .water-facts dt{font-size:11px}
 .water-actions{grid-template-columns:1fr}
 .water-actions button{min-height:44px;font-size:13px}
 .water-kpis{grid-template-columns:1fr 1fr}
 .water-kpi strong{font-size:17px}
 .water-flow{grid-template-columns:1fr}
 .water-table th,.water-table td{padding:8px 9px;font-size:11.5px}
 .water-details summary{display:flex;align-items:center;min-height:44px;font-size:13px}
 .water-pop-kind,.water-pop .water-pop-status{font-size:11px}
}
/* Peta di ponsel (22 Sep 2026): chrome-nya menutupi petanya sendiri di layar 375 px. Toolbar 12 tombol
   memakai 217 px dari 812 px layar (lima baris), kartu matahari terbit 151x54 dan pita medan duduk di atas
   kanvas, dan tombol ⌖ persis menimpa tombol zoom-in MapLibre sehingga zoom-in tidak bisa ditekan sama sekali.
   Di ponsel toolbar jadi satu baris yang digeser ke samping (semua tombol tetap ada, satu ketukan),
   matahari terbit menyusut jadi dial + azimut (teks panjangnya tetap di aria-label dan di layar lebar),
   dan tombol panggung naik di atas kolom kontrol kanan-bawah lewat --geo-ctrl-h. Desktop dan pita tablet
   701-960 px tidak berubah. */
.geo-sun-short{display:none}
@media(max-width:700px){
 .farm-map-frame .geo-buttons{flex-wrap:nowrap;justify-content:flex-start;gap:8px;padding:10px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
 .farm-map-frame .geo-buttons::-webkit-scrollbar{display:none}
 .farm-map-frame .geo-buttons button{flex:0 0 auto}
 .geo-actions{bottom:calc(var(--geo-ctrl-h,136px) + 8px)}
 .geo-sunrise{top:73px;right:10px;gap:7px;padding:6px 11px 6px 6px}
 .geo-sunrise-dial{width:30px;height:30px}
 .geo-sunrise strong,.geo-sunrise .geo-sun-text{display:none}
 .geo-sun-short{display:block;font-size:11px;font-weight:700;line-height:1.2;color:#655026}
 [data-theme="dark"] .geo-sun-short{color:#f0dbac}
 .geo-terrain-note{top:127px}
 .geo-brand{gap:7px;padding:4px 9px 4px 5px}
 .geo-brand img{width:22px;height:28px}
 .geo-brand span{font-size:10px;letter-spacing:.4px}
 .geo-switch button{white-space:nowrap;padding:9px 11px}
 .geo-basemap select{max-width:86px}
}
/* Penggulir mendatar di dalam halaman yang bergulir tegak (22 Sep 2026): garis waktu program, pita pekan dan
   jam cuaca. Tanpa pembatas, sapuan mendatar yang sampai ujung diteruskan ke browser dan di iOS Safari itu
   gestur kembali -- pengguna kehilangan halaman saat menggeser jadwal. Ponsel saja; desktop tidak berubah. */
@media(max-width:700px){
 .timeline-card,.wx-week,.wx-hour-scroll{overscroll-behavior-x:contain}
}