/* Arapora Farm Intelligence (app-v2). Base copiada do visual do site-v2 (tokens, tipografia, painel + mapa, barra de baixo no celular). */
:root{--ink:#10241b;--ink2:#1b3a2c;--straw:#eceee4;--paper:#fff;--line:#d7dccd;--muted:#56665d;--soy:#2f6b3a;--soy-d:#245530;--leaf:#9fd36b;--sky:#2a7889;--soil:#8e3b23;--soil-bg:#f8e7df;--ndvi:linear-gradient(90deg,#33456e 0%,#9c643b 45%,#e0b563 58%,#e6e08c 68%,#7ab35c 80%,#2e7a42 90%,#0a4026 100%);--display:'Bricolage Grotesque',system-ui,sans-serif;--body:'Atkinson Hyperlegible Next',system-ui,sans-serif;--r:14px;--nav:68px}
*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;height:100%}body{font-family:var(--body);color:var(--ink);background:var(--straw);font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased}
button,input,select{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.app{display:grid;grid-template-columns:420px 1fr;height:100dvh}
.panel{display:flex;flex-direction:column;min-height:0;background:var(--straw);border-right:1px solid var(--line)}
.top{background:var(--ink);color:#fff;padding:18px 22px 0;position:relative}
.brand{display:flex;align-items:center;gap:11px}.brand svg{flex:none}.brand h1{white-space:nowrap;font-family:var(--display);font-weight:800;font-size:22px;letter-spacing:-.02em;margin:0;line-height:1}.brand small{display:block;font-size:13px;color:#b9cdbf;margin-top:3px;font-family:var(--body);font-weight:400;letter-spacing:0}
.conn{margin-left:auto;white-space:nowrap;flex:none;display:flex;align-items:center;gap:7px;font-size:13px;color:#b9cdbf;background:#ffffff12;border:0;border-radius:99px;padding:7px 12px;cursor:pointer}.conn i{width:9px;height:9px;border-radius:50%;background:#e0b563;box-shadow:0 0 0 3px #e0b56333}.conn.on i{background:var(--leaf);box-shadow:0 0 0 3px #9fd36b33}
.ramp{height:4px;background:var(--ndvi);margin:16px -22px 0}
nav.tabs{display:flex;gap:2px;padding:10px 14px 0;background:var(--straw);border-bottom:1px solid var(--line)}nav.tabs button{flex:1;border:0;background:none;padding:10px 4px 12px;font-size:14px;font-weight:700;color:var(--muted);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;border-bottom:3px solid transparent;margin-bottom:-1px}nav.tabs button svg{width:22px;height:22px}nav.tabs button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--soy)}
.scroll{flex:1;overflow:auto;padding:18px 22px 28px;min-height:0}
.agent{display:flex;gap:12px;align-items:flex-start;margin-bottom:18px}.agent .av{flex:none;width:38px;height:38px;border-radius:12px;background:var(--ink);display:grid;place-items:center;position:relative;overflow:hidden}.agent .av:after{content:'';position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--ndvi)}
#status{flex:1;font-size:15px;line-height:1.5;padding:12px 14px;border-radius:4px var(--r) var(--r) var(--r);background:var(--paper);border:1px solid var(--line);white-space:pre-line;min-height:46px}#status.error{background:var(--soil-bg);border-color:#e7c3b4;color:var(--soil)}
.busy .agent .av svg{animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{50%{opacity:.35}}@media (prefers-reduced-motion:reduce){.busy .agent .av svg{animation:none}}
.view{display:none}.view.on{display:block}
.hero h2{font-family:var(--display);font-weight:700;font-size:clamp(28px,6vw,34px);line-height:1.08;letter-spacing:-.025em;margin:2px 0 10px;text-wrap:balance}.hero p{font-size:17px;color:var(--ink2);margin:0 0 18px;max-width:34em}
.facts{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);margin:22px 0 4px}.facts div{padding:13px 0 12px;border-bottom:1px solid var(--line)}.facts div:nth-child(odd){padding-right:12px;border-right:1px solid var(--line)}.facts div:nth-child(even){padding-left:14px}.facts b{display:block;font-family:var(--display);font-weight:700;font-size:24px;letter-spacing:-.02em;line-height:1.1}.facts span{font-size:13px;color:var(--muted)}
h3{font-family:var(--display);font-weight:700;font-size:21px;letter-spacing:-.015em;margin:0 0 6px}.lead{color:var(--muted);font-size:15px;margin:0 0 16px}.hint,.small{font-size:13px;color:var(--muted);line-height:1.5}
.block{padding:18px 0;border-top:1px solid var(--line)}.block:first-child{border-top:0;padding-top:0}
label{display:block;font-size:14px;font-weight:700;margin:14px 0 6px}input,select{width:100%;min-height:48px;padding:11px 13px;border:1.5px solid var(--line);border-radius:10px;background:var(--paper);font-size:16px}input:focus,select:focus{border-color:var(--sky);outline:0;box-shadow:0 0 0 3px #2a788933}
button.btn,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;padding:12px 16px;border:0;border-radius:12px;background:var(--soy);color:#fff;font-weight:700;font-size:16px;cursor:pointer;margin-top:12px}button.btn:hover{background:var(--soy-d)}button.btn:disabled{opacity:.5;cursor:wait}
button.secondary{background:var(--paper);color:var(--ink);border:1.5px solid var(--line)}button.secondary:hover{background:#f4f6ef;border-color:#c3cab8}
button.ghost{background:none;color:var(--soy);border:0;min-height:44px;width:auto;padding:8px 2px;margin-top:6px;text-decoration:underline;text-underline-offset:3px}
.row{display:flex;gap:10px}.row>*{min-width:0;flex:1}
.seg{display:flex;background:#dfe3d6;border-radius:12px;padding:4px;gap:4px}.seg button{flex:1;min-height:44px;border:0;background:none;border-radius:9px;font-weight:700;font-size:15px;color:var(--muted);cursor:pointer}.seg button[aria-pressed=true]{background:var(--paper);color:var(--ink);box-shadow:0 1px 3px #10241b26}
.ab{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ab .tag{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:7px;background:#ffffff2a;font-family:var(--display);font-size:14px}
.active{outline:3px solid var(--leaf);outline-offset:2px}
#pins{margin-top:12px}#pins>div{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}#pins>div span{flex:1;min-width:0;overflow-wrap:anywhere}#pins>div button{width:auto;min-height:40px;margin:0;padding:6px 12px;font-size:14px;border-radius:9px;flex:none}
#pins:empty:before{content:'Nenhum ponto marcado ainda.';display:block;color:var(--muted);font-size:14px;padding:10px 0}
footer{font-size:13px;color:var(--muted);line-height:1.55;margin-top:22px;padding-top:16px;border-top:1px solid var(--line)}
#mapWrap{position:relative;min-height:0}#map{height:100%;width:100%;background:#cfd6c6}
.mapnote{position:absolute;bottom:24px;left:14px;z-index:500;background:#10241bec;color:#fff;padding:12px 14px;border-radius:12px;max-width:330px;font-size:13px;box-shadow:0 6px 24px #10241b40}.mapnote strong{font-family:var(--display);font-weight:700;font-size:15px;letter-spacing:-.01em}.bar{height:10px;border-radius:5px;background:var(--ndvi);margin:10px 0 4px}.ticks{position:relative;height:16px;font-size:11px;color:#cfdcd3}.ticks span{position:absolute;transform:translateX(-50%)}.ticks span:first-child{left:0;transform:none}.ticks span:nth-child(2){left:50%}.ticks span:nth-child(3){left:75%}.ticks span:last-child{right:0;transform:none}.mapnote .small{color:#b9cdbf;font-size:12px}
button.drawfab{position:absolute;top:14px;right:14px;z-index:600;width:auto;margin:0;min-height:48px;box-shadow:0 6px 20px #10241b38;border-radius:99px;padding:10px 18px}
.leaflet-touch .leaflet-bar a{width:40px;height:40px;line-height:40px}.leaflet-bar{border:0!important;box-shadow:0 2px 10px #10241b2e!important;border-radius:10px!important;overflow:hidden}.leaflet-container{font-family:var(--body)}.leaflet-popup-content-wrapper{border-radius:12px}
/* ---- app-v2: peças novas no mesmo sistema ---- */
.fieldbar{display:flex;align-items:center;gap:8px;padding:10px 0 2px}.fieldbar select{min-height:42px;padding:7px 34px 7px 12px;border-radius:10px;background:#ffffff14 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239fd36b' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat right 12px center;color:#fff;border:1.5px solid #ffffff26;font-weight:700;font-size:15px;-webkit-appearance:none;appearance:none}.fieldbar select option{color:var(--ink)}.fieldbar .meta{font-size:13px;color:#b9cdbf;white-space:nowrap}
.cards{display:flex;flex-direction:column;gap:10px;margin:6px 0 4px}
.card{display:flex;gap:12px;align-items:flex-start;width:100%;text-align:left;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:13px 14px;cursor:pointer;font:inherit;color:inherit}.card:hover{border-color:#c3cab8}.card .dot{flex:none;width:12px;height:12px;border-radius:50%;margin-top:6px;background:var(--leaf)}.card b{display:block;font-family:var(--display);font-weight:700;font-size:17px;letter-spacing:-.01em;line-height:1.2}.card p{margin:3px 0 0;font-size:15px;color:var(--ink2)}.card small{display:block;margin-top:4px;font-size:12.5px;color:var(--muted)}.card .grow{flex:1;min-width:0}
.lvl-urgente .dot,.dot.urgente{background:var(--soil)}.lvl-atencao .dot,.dot.atencao{background:#e0b563}.lvl-ok .dot,.dot.ok{background:var(--leaf)}.lvl-info .dot,.dot.info{background:var(--sky)}.lvl-sem-dado .dot{background:#b8bfb0}
.badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;padding:3px 9px;border-radius:99px;background:#dfe3d6;color:var(--ink2);vertical-align:middle}.badge.exp{background:#fbefd5;color:#7a5410}.badge.warn{background:var(--soil-bg);color:var(--soil)}.badge.good{background:#e3f1d6;color:var(--soy-d)}
.kpis{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);margin:14px 0 4px}.kpis div{padding:12px 0 11px;border-bottom:1px solid var(--line)}.kpis div:nth-child(odd){padding-right:12px;border-right:1px solid var(--line)}.kpis div:nth-child(even){padding-left:14px}.kpis b{display:block;font-family:var(--display);font-weight:700;font-size:22px;letter-spacing:-.02em;line-height:1.15}.kpis span{font-size:13px;color:var(--muted)}
.range{font-family:var(--display);font-weight:700;font-size:26px;letter-spacing:-.02em;line-height:1.15;margin:4px 0}
.howto{font-size:13.5px;color:var(--ink2);background:#e4e8db;border-radius:10px;padding:10px 12px;margin:12px 0 0;line-height:1.5}.howto b{font-weight:700}
.menu{display:flex;flex-direction:column;border-top:1px solid var(--line)}.menu button{display:flex;align-items:center;gap:14px;width:100%;min-height:64px;padding:12px 2px;background:none;border:0;border-bottom:1px solid var(--line);text-align:left;cursor:pointer;font:inherit;color:inherit}.menu button svg{flex:none;width:26px;height:26px;color:var(--soy)}.menu button b{display:block;font-family:var(--display);font-size:17px;font-weight:700}.menu button span{display:block;font-size:13.5px;color:var(--muted)}.menu button:after{content:'›';margin-left:auto;font-size:24px;color:var(--muted)}
.back{display:inline-flex;align-items:center;gap:6px;background:none;border:0;color:var(--soy);font-weight:700;font-size:15px;padding:6px 0;margin:0 0 6px;cursor:pointer}
.chart{width:100%;margin:10px 0 4px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:10px 8px 6px}.chart svg{display:block;width:100%;height:auto;overflow:visible}.chart .lg{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12.5px;color:var(--muted);padding:2px 6px 4px}.chart .lg i{display:inline-block;width:12px;height:3px;border-radius:2px;margin-right:5px;vertical-align:middle}.chart .ax{font:11px var(--body);fill:var(--muted)}.chart .grid{stroke:#e6e9df}
.empty{background:var(--paper);border:1.5px dashed var(--line);border-radius:var(--r);padding:16px;color:var(--muted);font-size:15px}
.list{margin:6px 0 0;padding:0;list-style:none}.list li{display:flex;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line);font-size:15px}.list li .grow{flex:1;min-width:0;overflow-wrap:anywhere}.list li button{width:auto;min-height:40px;margin:0;padding:6px 12px;font-size:14px;border-radius:9px;flex:none}
textarea{width:100%;min-height:90px;padding:11px 13px;border:1.5px solid var(--line);border-radius:10px;background:var(--paper);font:inherit;font-size:16px;resize:vertical}textarea:focus{border-color:var(--sky);outline:0;box-shadow:0 0 0 3px #2a788933}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:15px;margin:14px 0 0;cursor:pointer}.check input{width:22px;min-height:22px;height:22px;margin:1px 0 0;flex:none;accent-color:var(--soy)}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:15px;background:var(--paper);border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;overflow-wrap:anywhere;user-select:all}
.demo-flag{border:0;cursor:pointer;font-family:inherit;position:fixed;top:8px;left:50%;transform:translateX(-50%);z-index:2000;background:#e0b563;color:var(--ink);font-weight:700;font-size:12.5px;padding:4px 12px;border-radius:99px;box-shadow:0 2px 8px #10241b30}
.legend .bar{background:var(--ramp,var(--ndvi))}
@media (max-width:820px){
 .app{display:flex;flex-direction:column;height:auto;min-height:100dvh;padding-bottom:calc(var(--nav) + env(safe-area-inset-bottom))}
 .panel{display:contents}.top{order:0;padding:14px 16px 0}.ramp{margin:14px -16px 0}
 #mapWrap{order:1;height:46dvh;min-height:330px}
 .scroll{order:2;overflow:visible;padding:16px 16px 28px}
 nav.tabs{position:fixed;left:0;right:0;bottom:0;z-index:1000;background:var(--ink);border:0;padding:6px 6px calc(6px + env(safe-area-inset-bottom));height:calc(var(--nav) + env(safe-area-inset-bottom))}
 nav.tabs button{color:#9fb5a7;font-size:12px;border:0;border-radius:12px;margin:0;padding:6px 2px;justify-content:center}nav.tabs button[aria-selected=true]{color:#fff;background:#ffffff14}nav.tabs button[aria-selected=true] svg{color:var(--leaf)}
 .mapnote{bottom:40px;left:auto;right:10px;max-width:230px;padding:9px 11px}.mapnote .small{display:none}.mapnote strong{font-size:14px}button.drawfab{top:10px;right:10px}.leaflet-control-attribution{font-size:10px}
 .brand small{max-width:210px}
 .fieldbar{padding-bottom:0}.fieldbar select{flex:1;min-width:0}
 .demo-flag{top:auto;bottom:calc(var(--nav) + env(safe-area-inset-bottom) + 8px)}
}
.menu-title{margin:18px 0 4px;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
