@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/barlow-400.woff2) format('woff2');}
@font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/barlow-500.woff2) format('woff2');}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/barlow-600.woff2) format('woff2');}
@font-face{font-family:'Barlow Semi Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/barlow-sc-600.woff2) format('woff2');}
@font-face{font-family:'Barlow Semi Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/barlow-sc-700.woff2) format('woff2');}


:root{
  --bg:#EDF0E8; --surface:#FFFFFF; --input:#FFFFFF; --ink:#1D2A21; --muted:#5B6A5F; --line:#C9D1C5;
  --field:#2F5A3E; --field-ink:#FFFFFF; --field-soft:#E1EADF;
  --raps:#F2C230; --raps-ink:#1D2A21; --danger:#B3261E; --danger-soft:#FBE9E7; --focus:#2F5A3E;
  color-scheme: light;
  box-sizing: border-box;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  --display: "Barlow Semi Condensed", "Arial Narrow", "Roboto Condensed", system-ui, sans-serif;
  --text: "Barlow", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#111712; --surface:#19211B; --input:#121914; --ink:#E5ECE4; --muted:#9AA89D; --line:#2F3B32;
    --field:#86BD96; --field-ink:#0E1610; --field-soft:#22322A;
    --raps:#E8B915; --raps-ink:#17170F; --danger:#FF8A80; --danger-soft:#3A1E1C; --focus:#86BD96;
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --bg:#111712; --surface:#19211B; --input:#121914; --ink:#E5ECE4; --muted:#9AA89D; --line:#2F3B32;
  --field:#86BD96; --field-ink:#0E1610; --field-soft:#22322A;
  --raps:#E8B915; --raps-ink:#17170F; --danger:#FF8A80; --danger-soft:#3A1E1C; --focus:#86BD96;
  color-scheme: dark;
}
*,*::before,*::after{ box-sizing: inherit; }
html{ scroll-padding-top: calc(env(safe-area-inset-top, 0px) + 76px); }
body{ margin:0; background:var(--bg); color:var(--ink); font-family:var(--text); font-size:17px; line-height:1.45; -webkit-text-size-adjust:100%; }
body::before{ content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top, 0px); z-index:10; background:var(--surface); }
button,input,select,textarea{ font:inherit; color:inherit; }
[hidden]{ display:none !important; }

/* header */
.top{ position:sticky; top:env(safe-area-inset-top, 0px); z-index:20; background:var(--surface); border-bottom:1px solid var(--line); }
.top-in{ max-width:880px; margin:0 auto; padding:10px 16px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.brand{ font-family:var(--display); font-weight:700; font-size:22px; letter-spacing:.01em; display:flex; align-items:center; gap:10px; }
.brand-mark{ width:14px; height:22px; border-radius:3px; background:var(--raps); box-shadow: 6px 0 0 var(--field); margin-right:6px; }
.tabs{ display:flex; gap:4px; background:var(--bg); padding:4px; border-radius:10px; }
.tab{ white-space:nowrap; border:0; background:transparent; padding:8px 14px; border-radius:7px; font-weight:600; cursor:pointer; color:var(--muted); min-height:40px; }
.tab[aria-selected="true"]{ background:var(--surface); color:var(--ink); box-shadow:0 1px 2px rgba(0,0,0,.12); }
.tab .count{ font-weight:500; color:var(--muted); margin-left:4px; }
.beta{ font-family:var(--text); font-size:13px; font-weight:600; background:var(--field-soft); color:var(--field); padding:2px 8px; border-radius:20px; margin-left:4px; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .beta{ color:var(--field); } }

@media (max-width:460px){
  .brand-text{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
  .tab{ padding:8px 12px; }
}
main{ max-width:880px; margin:0 auto; padding:20px 16px 140px; }

/* mark plate */
.hero{ display:flex; gap:18px; align-items:stretch; margin-bottom:22px; }
.plate{ background:var(--raps); color:var(--raps-ink); border-radius:10px; padding:10px 16px 12px; min-width:132px; display:flex; flex-direction:column; justify-content:space-between; position:relative; }
.plate::after{ content:""; position:absolute; left:50%; bottom:-14px; width:8px; height:14px; transform:translateX(-50%); background:var(--muted); border-radius:0 0 2px 2px; opacity:.5; }
.plate-label{ font-size:14px; font-weight:600; }
.plate-nr{ font-family:var(--display); font-weight:700; font-size:64px; line-height:.95; letter-spacing:-.01em; overflow-wrap:anywhere; }
.plate-nr.empty{ opacity:.35; }
.hero-text{ display:flex; flex-direction:column; justify-content:center; min-width:0; }
.hero-text h1{ font-family:var(--display); font-weight:700; font-size:34px; line-height:1.05; margin:0 0 4px; overflow-wrap:anywhere; }
.hero-text p{ margin:0; color:var(--muted); }
.editing{ margin-top:8px; display:inline-flex; gap:10px; align-items:center; background:var(--field-soft); color:var(--ink); padding:6px 10px; border-radius:8px; font-size:15px; }
.linklike{ border:0; background:none; padding:0; color:var(--field); font-weight:600; text-decoration:underline; cursor:pointer; }

/* steps */
.step{ background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:18px 18px 20px; margin:0 0 16px; min-width:0; }
.step > legend{ float:left; width:100%; padding:0; margin:0 0 14px; font-family:var(--display); font-weight:700; font-size:22px; display:flex; align-items:center; gap:10px; }
.step > legend + *{ clear:both; }
.num{ flex:none; width:30px; height:30px; border-radius:50%; background:var(--field); color:var(--field-ink); display:grid; place-items:center; font-size:17px; }
.grid{ display:grid; grid-template-columns:repeat(6, minmax(0,1fr)); gap:14px 14px; }
.c2{ grid-column:span 2; } .c3{ grid-column:span 3; } .c4{ grid-column:span 4; } .c6{ grid-column:span 6; }
@media (max-width:640px){
  .grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .c2,.c3{ grid-column:span 1; } .c4,.c6,.wide-sm{ grid-column:span 2; }
  .hero-text h1{ font-size:28px; }
  .plate-nr{ font-size:52px; }
  .plate{ min-width:108px; }
}
.f label, .f .lbl{ display:block; font-weight:600; font-size:15px; margin-bottom:5px; }
.f .hint{ font-weight:400; color:var(--muted); }
.f input[type=text], .f input[type=date], .f input[type=time], .f select, .f textarea{
  width:100%; min-height:48px; padding:10px 12px; border:1.5px solid var(--line); border-radius:8px; background:var(--input); outline:none;
}
.f textarea{ min-height:84px; resize:vertical; }
.f input:focus-visible, .f select:focus-visible, .f textarea:focus-visible{ border-color:var(--focus); box-shadow:0 0 0 3px color-mix(in srgb, var(--focus) 30%, transparent); }
.f input[aria-invalid="true"], .f select[aria-invalid="true"]{ border-color:var(--danger); background:var(--danger-soft); }
.unit{ position:relative; }
.unit input{ padding-right:46px !important; }
.unit span{ position:absolute; right:12px; top:50%; transform:translateY(-50%); color:var(--muted); pointer-events:none; font-size:15px; }
.warn{ color:var(--danger); font-size:14px; margin-top:4px; }

/* segmented */
.seg{ display:grid; grid-template-columns:repeat(3,1fr); border:1.5px solid var(--line); border-radius:8px; overflow:hidden; background:var(--input); }
.seg.invalid{ border-color:var(--danger); }
.seg input{ position:absolute; opacity:0; pointer-events:none; }
.seg label{ margin:0; text-align:center; padding:11px 4px; font-weight:600; cursor:pointer; border-left:1.5px solid var(--line); min-height:45px; font-size:17px; }
.seg label:first-of-type{ border-left:0; }
.seg input:checked + label{ background:var(--field); color:var(--field-ink); }
.seg input:focus-visible + label{ outline:3px solid var(--focus); outline-offset:-3px; }

/* products */
.prods{ display:flex; flex-direction:column; gap:10px; margin-top:4px; }
.prod{ display:grid; grid-template-columns: 2fr 1.1fr 1.1fr .9fr 1.3fr 1.1fr 44px; gap:8px; align-items:end; padding:12px; border-radius:10px; background:var(--bg); }
.prod .f label{ font-size:13px; }
.prod .f input, .prod .f select{ min-height:44px; padding:8px 10px; }
.prod .total{ min-height:44px; display:flex; align-items:center; justify-content:flex-end; font-weight:600; font-variant-numeric:tabular-nums; padding:0 4px; }
.prod .total.empty{ color:var(--muted); font-weight:400; }
.iconbtn{ width:44px; height:44px; border-radius:8px; border:1.5px solid var(--line); background:var(--surface); cursor:pointer; display:grid; place-items:center; color:var(--muted); }
.iconbtn:hover{ color:var(--danger); border-color:var(--danger); }
.iconbtn:disabled{ opacity:.35; cursor:not-allowed; }
@media (max-width:760px){
  .prod{ grid-template-columns:repeat(6, minmax(0,1fr)); }
  .prod .p-middel{ grid-column:span 4; } .prod .p-reg{ grid-column:span 2; }
  .prod .p-dosis{ grid-column:span 2; } .prod .p-enhed{ grid-column:span 2; } .prod .p-total{ grid-column:span 2; }
  .prod .p-problem{ grid-column:span 5; } .prod .p-del{ grid-column:span 1; justify-self:end; }
  .p-middel{ order:1; } .p-reg{ order:2; } .p-dosis{ order:3; } .p-enhed{ order:4; } .p-total{ order:5; } .p-problem{ order:6; } .p-del{ order:7; }
}
.addbtn{ margin-top:10px; border:1.5px dashed var(--line); background:transparent; border-radius:10px; padding:12px; width:100%; font-weight:600; cursor:pointer; color:var(--field); min-height:48px; }
.addbtn:hover{ border-color:var(--field); }

/* confirmations */
.checks{ display:flex; flex-direction:column; gap:8px; }
.check{ display:flex; align-items:center; gap:14px; padding:12px 14px; border:1.5px solid var(--line); border-radius:10px; cursor:pointer; background:var(--input); min-height:56px; }
.check input{ width:24px; height:24px; accent-color:var(--field); flex:none; margin:0; }
.check:has(input:checked){ border-color:var(--field); background:var(--field-soft); }
.check.invalid{ border-color:var(--danger); }
.check input:focus-visible{ outline:3px solid var(--focus); outline-offset:2px; }

/* errors */
.errors{ background:var(--danger-soft); border:1.5px solid var(--danger); border-radius:10px; padding:12px 16px; margin-bottom:16px; }
.errors strong{ display:block; margin-bottom:4px; }
.errors ul{ margin:0; padding-left:20px; }
.errors .linklike{ text-align:left; color:var(--ink); }

/* action bar */
.actionbar{ position:fixed; left:0; right:0; bottom:0; z-index:15; background:var(--surface); border-top:1px solid var(--line); padding:12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); }
.actionbar-in{ max-width:880px; margin:0 auto; display:flex; gap:10px; justify-content:space-between; align-items:center; }
.btn{ border-radius:10px; padding:12px 18px; font-weight:600; cursor:pointer; min-height:50px; border:1.5px solid var(--line); background:var(--surface); }
.btn.primary{ background:var(--field); color:var(--field-ink); border-color:var(--field); font-size:18px; padding:12px 24px; }
.btn.primary:disabled{ opacity:.55; cursor:progress; }
.btn:focus-visible, .tab:focus-visible, .iconbtn:focus-visible, .addbtn:focus-visible, .linklike:focus-visible{ outline:3px solid var(--focus); outline-offset:2px; }
.btn.small{ min-height:40px; padding:7px 12px; font-size:15px; }
.btn.danger{ color:var(--danger); }
.btn.danger.armed{ background:var(--danger); color:#fff; border-color:var(--danger); }

/* journal */
.log-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.log-head h1{ font-family:var(--display); font-size:34px; margin:0; line-height:1.05; }
.log-head p{ margin:4px 0 0; color:var(--muted); font-size:15px; }
.log-head .f{ min-width:200px; }
.group{ background:var(--surface); border:1px solid var(--line); border-radius:12px; margin-bottom:16px; overflow:hidden; }
.group-head{ display:flex; align-items:center; gap:14px; padding:12px 14px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.mini-plate{ background:var(--raps); color:var(--raps-ink); font-family:var(--display); font-weight:700; font-size:26px; line-height:1; padding:8px 10px; border-radius:7px; min-width:48px; text-align:center; }
.group-head h2{ margin:0; font-size:18px; font-weight:600; }
.group-head p{ margin:0; color:var(--muted); font-size:14px; }
.group-head .spacer{ flex:1; }
.entry{ display:grid; grid-template-columns: 110px 1fr auto; gap:12px; padding:12px 14px; border-top:1px solid var(--line); align-items:center; }
.entry:first-of-type{ border-top:0; }
.entry-date{ font-weight:600; font-variant-numeric:tabular-nums; }
.entry-main{ min-width:0; }
.entry-main .prods-sum{ font-weight:500; }
.entry-main .meta{ color:var(--muted); font-size:14px; }
.entry-actions{ display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
@media (max-width:640px){
  .entry{ grid-template-columns:1fr; gap:6px; }
  .entry-actions{ justify-content:flex-start; }
}
.empty-state{ background:var(--surface); border:1.5px dashed var(--line); border-radius:12px; padding:28px 20px; text-align:center; }
.empty-state p{ margin:0 0 12px; color:var(--muted); }
.note{ font-size:14px; color:var(--muted); }

/* toast */
.toast{ position:fixed; left:50%; bottom:calc(92px + env(safe-area-inset-bottom, 0px)); transform:translateX(-50%) translateY(10px); background:var(--ink); color:var(--surface); padding:12px 18px; border-radius:10px; z-index:30; opacity:0; pointer-events:none; transition:opacity .18s, transform .18s; max-width:calc(100% - 32px); font-weight:500; }
.toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }
@media (prefers-reduced-motion: reduce){ .toast{ transition:none; } }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ---- v2 additions ---- */
.banner{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; background:var(--surface); border:1.5px solid var(--raps); border-left-width:6px; border-radius:10px; padding:12px 14px; margin-bottom:16px; }
.banner p{ margin:0; flex:1; min-width:220px; }
.banner.danger{ border-color:var(--danger); }
.hero-farm{ display:inline-block; font-size:15px; font-weight:600; color:var(--field); margin-bottom:2px; }
.subgrid{ display:contents; }
.farmnew{ grid-column:1 / -1; display:grid; grid-template-columns:repeat(6, minmax(0,1fr)); gap:14px; background:var(--bg); border-radius:10px; padding:12px; }
.farmnew .hint-row{ grid-column:1 / -1; font-size:14px; color:var(--muted); margin:-4px 0 0; }
@media (max-width:640px){ .farmnew{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
.toolbar{ display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap; margin-bottom:16px; }
.toolbar .f{ min-width:180px; }
.toolbar .grow{ flex:1; }
.backupbox{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.backupbox .note{ margin-right:4px; }
.group-head .farm-meta{ min-width:0; }
.group-head .farm-meta h2{ overflow-wrap:anywhere; }
.markrow{ display:flex; align-items:center; gap:10px; padding:10px 14px 6px; border-top:1px solid var(--line); background:var(--bg); }
.markrow .mini-plate{ font-size:18px; padding:5px 8px; min-width:36px; }
.markrow span{ color:var(--muted); font-size:15px; }
.markrow strong{ font-weight:600; }
.group .entry{ border-top:1px solid var(--line); }
.season-tag{ display:inline-block; background:var(--raps); color:var(--raps-ink); font-family:var(--display); font-weight:700; padding:6px 10px; border-radius:7px; font-size:20px; line-height:1; }
/* farms view */
.addfarm{ background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:16px; margin-bottom:16px; }
.addfarm h2{ margin:0 0 10px; font-size:18px; }
.addfarm .row{ display:grid; grid-template-columns: 1fr 2fr auto; gap:12px; align-items:end; }
@media (max-width:640px){ .addfarm .row{ grid-template-columns:1fr; } }
.farmcard{ background:var(--surface); border:1px solid var(--line); border-radius:12px; margin-bottom:14px; overflow:hidden; }
.farmcard-head{ display:flex; align-items:center; gap:12px; padding:14px; flex-wrap:wrap; }
.farmcard-head h2{ margin:0; font-size:20px; font-family:var(--display); font-weight:700; }
.farmcard-head p{ margin:0; color:var(--muted); font-size:14px; }
.farmcard-head .spacer{ flex:1; }
.farmcard-head .rename{ display:flex; gap:8px; align-items:center; }
.farmcard-head .rename input{ min-height:40px; padding:6px 10px; border:1.5px solid var(--line); border-radius:8px; background:var(--input); font-size:17px; }
.tbl-wrap{ overflow-x:auto; border-top:1px solid var(--line); }
table.marks{ width:100%; border-collapse:collapse; font-size:15px; }
table.marks th, table.marks td{ text-align:left; padding:8px 14px; border-bottom:1px solid var(--line); white-space:nowrap; }
table.marks th{ font-weight:600; color:var(--muted); font-size:13px; }
table.marks td.r{ text-align:right; font-variant-numeric:tabular-nums; }
table.marks tr:last-child td{ border-bottom:0; }
.btn:disabled{ opacity:.45; cursor:not-allowed; }
@media (max-width:520px){
  .beta{ display:none; }
  .tabs{ gap:2px; padding:3px; }
  .tab{ padding:8px 9px; font-size:15px; }
  .tab .count{ display:none; }
}
/* v3 */
.inline-check{ display:inline-flex; align-items:center; gap:10px; cursor:pointer; font-weight:500; min-height:36px; }
.inline-check input{ width:20px; height:20px; accent-color:var(--field); margin:0; }
.field-note{ margin:-4px 0 0; font-size:14px; color:var(--muted); }
.prod{ grid-template-columns: repeat(6, minmax(0,1fr)) 44px; row-gap:8px; }
.prod .p-middel{ grid-column:1 / span 2; grid-row:1; }
.prod .p-type{ grid-column:3 / span 2; grid-row:1; }
.prod .p-reg{ grid-column:5 / span 2; grid-row:1; }
.prod .p-del{ grid-column:7; grid-row:1; }
.prod .p-dosis{ grid-column:1; grid-row:2; }
.prod .p-enhed{ grid-column:2; grid-row:2; }
.prod .p-problem{ grid-column:3 / span 2; grid-row:2; }
.prod .p-total{ grid-column:5 / span 2; grid-row:2; }
.prod input:disabled{ opacity:.55; }
.prod.is-bee{ box-shadow: inset 4px 0 0 var(--raps); }
@media (max-width:760px){
  .prod{ grid-template-columns:repeat(6, minmax(0,1fr)); }
  .prod > div{ grid-row:auto !important; }
  .prod .p-middel{ grid-column:span 6; } .prod .p-type{ grid-column:span 3; } .prod .p-reg{ grid-column:span 3; }
  .prod .p-dosis{ grid-column:span 2; } .prod .p-enhed{ grid-column:span 2; } .prod .p-total{ grid-column:span 2; }
  .prod .p-problem{ grid-column:span 5; } .prod .p-del{ grid-column:span 1; justify-self:end; align-self:end; }
  .prod .p-middel{ order:0; } .prod .p-type{ order:1; } .prod .p-reg{ order:2; }
}
/* dialog */
dialog{ border:0; border-radius:14px; padding:0; max-width:min(480px, calc(100% - 32px)); background:var(--surface); color:var(--ink); box-shadow:0 20px 50px rgba(0,0,0,.3); }
dialog::backdrop{ background:rgba(10,20,12,.45); }
.dlg-body{ padding:20px 20px 8px; }
.dlg-body h2{ margin:0 0 8px; font-family:var(--display); font-size:24px; }
.dlg-body p{ margin:0 0 10px; }
.dlg-actions{ display:flex; justify-content:flex-end; gap:10px; padding:12px 20px 18px; }
.btn.dangerfill{ background:var(--danger); border-color:var(--danger); color:#fff; }

/* server version */
.usermenu{ display:flex; align-items:center; gap:10px; font-size:14px; color:var(--muted); }
.usermenu .linklike{ font-size:14px; }
@media (max-width:760px){ .usermenu span{ display:none; } }
.top-in{ flex-wrap:nowrap; }
/* login */
.login-wrap{ min-height:100%; display:grid; place-items:center; padding:24px 16px; }
.login-card{ width:100%; max-width:400px; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:26px 24px; }
.login-card h1{ font-family:var(--display); font-size:30px; margin:14px 0 4px; }
.login-card p{ margin:0 0 18px; color:var(--muted); }
.login-card .f{ margin-bottom:14px; }
.login-card .btn{ width:100%; }
.login-plate{ display:inline-flex; align-items:center; gap:10px; }
.login-msg{ color:var(--danger); margin:0 0 12px; min-height:1.4em; }
.f input[type=password]{ width:100%; min-height:48px; padding:10px 12px; border:1.5px solid var(--line); border-radius:8px; background:var(--input); outline:none; }
.f input[type=password]:focus-visible{ border-color:var(--focus); box-shadow:0 0 0 3px color-mix(in srgb, var(--focus) 30%, transparent); }