/* App de celular do campo. */
.field-app{max-width:480px; margin:0 auto; min-height:100%; display:flex; flex-direction:column}
.f-top{background:var(--side); color:var(--side-ink); padding:14px 16px; display:flex; justify-content:space-between; align-items:center; gap:10px; position:sticky; top:0; z-index:5}
.f-top b{font-family:var(--f-display); font-weight:500; font-size:18px; display:block}
.f-top span{font-size:12.5px; color:var(--side-muted)}
.f-top select{background:var(--side-hover); color:var(--side-ink); border:1px solid #333; border-radius:8px; padding:6px 8px; max-width:190px}
.f-body{flex:1; padding:16px 16px 100px; display:flex; flex-direction:column; gap:14px}
.f-nav{position:fixed; left:50%; transform:translateX(-50%); bottom:0; width:min(480px,100%); background:var(--surface); border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(4,1fr); padding-bottom:env(safe-area-inset-bottom,0px); z-index:6}
.f-nav button{all:unset; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:3px; padding:10px 0; font-size:12px; color:var(--muted)}
.f-nav button[aria-current="page"]{color:var(--accent); font-weight:600}
.f-nav svg{width:22px; height:22px; stroke:currentColor; fill:none; stroke-width:1.6}
.stepper{display:grid; grid-template-columns:48px minmax(0,1fr) 48px; gap:8px; align-items:center}
.stepper button{height:46px; border:1px solid var(--line); background:var(--surface-2); border-radius:10px; font-size:20px; cursor:pointer}
.stepper input{height:46px; text-align:center; border:1px solid var(--line); border-radius:10px; background:var(--surface); font-size:18px; font-family:var(--f-display); width:100%}
.big-check{display:grid; grid-template-columns:28px minmax(0,1fr); gap:12px; align-items:center; padding:12px 4px; border-top:1px solid var(--line); cursor:pointer; font-size:15.5px}
.big-check:first-child{border-top:0}
.big-check input{width:24px; height:24px; accent-color:var(--accent)}
.weather{display:grid; grid-template-columns:repeat(3,1fr); gap:8px}
.weather button{border:1px solid var(--line); background:var(--surface); border-radius:10px; padding:10px 4px; cursor:pointer; font-weight:600}
.weather button[aria-pressed="true"]{border-color:var(--accent); background:var(--accent-soft)}