/* 蜜瓜农场管理 — 共用外壳。取色沿用采购清单那套：牛皮纸单据底 + 镀锌钢灰 + 墨蓝 */
:root{
  --paper:#f2f1ec; --card:#fbfaf7; --sunk:#e6e4dc; --hi:#fff;
  --ink:#1a1c1a; --ink2:#565b56; --ink3:#8a908a;
  --line:#dcd9d0; --line2:#bcb8ac;
  --act:#1f5673; --act-f:#dce9f0; --on-act:#fff;
  --ok:#3d7a5a; --ok-f:#e2f0e8;
  --warn:#9d6b1f; --warn-f:#f7ecd8;
  --bad:#a8341f; --bad-f:#f6e2dc;
  --shadow:rgba(26,28,26,.10);
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --paper:#151715; --card:#1d201d; --sunk:#0f110f; --hi:#242824;
  --ink:#e9ebe8; --ink2:#a6aca6; --ink3:#767c76;
  --line:#2c302c; --line2:#41463f;
  --act:#69a8c6; --act-f:#152a35; --on-act:#0c1a22;
  --ok:#6fb98c; --ok-f:#16271e;
  --warn:#d9a441; --warn-f:#2b2312;
  --bad:#e07a5f; --bad-f:#331914;
  --shadow:rgba(0,0,0,.45);
}}
:root[data-theme=dark]{
  --paper:#151715; --card:#1d201d; --sunk:#0f110f; --hi:#242824;
  --ink:#e9ebe8; --ink2:#a6aca6; --ink3:#767c76;
  --line:#2c302c; --line2:#41463f;
  --act:#69a8c6; --act-f:#152a35; --on-act:#0c1a22;
  --ok:#6fb98c; --ok-f:#16271e;
  --warn:#d9a441; --warn-f:#2b2312;
  --bad:#e07a5f; --bad-f:#331914;
  --shadow:rgba(0,0,0,.45);
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font:15px/1.6 "Segoe UI Variable Text","Segoe UI","PingFang SC","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased}
.n,input,select,textarea,td.num,th.num,.big{font-family:ui-monospace,"Cascadia Mono","SF Mono",Consolas,monospace;
  font-variant-numeric:tabular-nums}
a{color:var(--act)}

/* 顶部导航 */
#nav{position:sticky;top:0;z-index:30;background:var(--card);border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:4px;padding:0 14px;height:52px;overflow-x:auto;scrollbar-width:none}
#nav::-webkit-scrollbar{display:none}
#nav .brand{font-weight:700;margin-right:10px;white-space:nowrap;letter-spacing:-.01em}
#nav a{color:var(--ink2);text-decoration:none;font-size:14px;font-weight:600;padding:8px 11px;
  border-radius:7px;white-space:nowrap}
#nav a:hover{background:var(--sunk);color:var(--ink)}
#nav a.on{background:var(--act-f);color:var(--act)}
#nav .sp{flex:1}
#nav .me{font-size:12.5px;color:var(--ink3);white-space:nowrap}

.wrap{max-width:1120px;margin:0 auto;padding:22px 18px 80px}
h1{font-size:clamp(21px,3.6vw,27px);margin:0 0 4px;letter-spacing:-.02em}
.dek{color:var(--ink2);font-size:14.5px;margin:0 0 20px;max-width:64ch}
h2{font-size:17px;margin:30px 0 8px}
.card{background:var(--card);border:1px solid var(--line);border-radius:11px;padding:16px 18px}
.grid{display:grid;gap:12px}
.g2{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}

/* 统计块 */
.stat{background:var(--card);border:1px solid var(--line);border-radius:11px;padding:13px 15px}
.stat .k{font-size:11.5px;color:var(--ink3);font-weight:700;letter-spacing:.03em}
.stat .v{font-size:24px;font-weight:700;margin-top:2px;letter-spacing:-.02em}
.stat .s{font-size:12.5px;color:var(--ink2);margin-top:2px}
.stat.acc .v{color:var(--act)} .stat.ok .v{color:var(--ok)}
.stat.warn .v{color:var(--warn)} .stat.bad .v{color:var(--bad)}

/* 表单 */
label.f{display:block;font-size:12px;color:var(--ink2);font-weight:600;margin-bottom:3px}
input,select,textarea{width:100%;padding:7px 9px;font:inherit;font-size:14px;
  border:1px solid var(--line2);border-radius:7px;background:var(--paper);color:var(--ink)}
input[type=file]{padding:5px;font-size:12.5px}
textarea{min-height:60px;resize:vertical;font-family:inherit}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible
  {outline:2px solid var(--act);outline-offset:1px}
.row{display:grid;gap:9px;margin-bottom:10px}
.r2{grid-template-columns:1fr 1fr} .r3{grid-template-columns:1fr 1fr 1fr}
.r4{grid-template-columns:repeat(4,1fr)}
@media(max-width:620px){.r2,.r3,.r4{grid-template-columns:1fr}}

button{font:inherit;font-size:14px;font-weight:600;cursor:pointer;color:var(--ink);
  background:var(--card);border:1px solid var(--line2);border-radius:8px;padding:8px 14px}
button:hover{background:var(--sunk)}
button:disabled{opacity:.5;cursor:not-allowed}
button.pri{background:var(--act);border-color:var(--act);color:var(--on-act)}
button.pri:hover{filter:brightness(1.08);background:var(--act)}
button.danger{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 45%,var(--line2))}
button.sm{padding:4px 9px;font-size:12.5px;border-radius:6px}
.btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

/* 表格 */
.tbl{overflow-x:auto;border:1px solid var(--line);border-radius:11px;background:var(--card)}
table{border-collapse:collapse;width:100%;font-size:14px;min-width:560px}
th{text-align:left;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink3);
  font-weight:700;padding:10px 12px 7px;border-bottom:1px solid var(--line2);white-space:nowrap}
td{padding:8px 12px;border-bottom:1px solid var(--line);vertical-align:top}
tr:last-child td{border-bottom:none}
td.num,th.num{text-align:right;white-space:nowrap}
tbody tr:hover{background:color-mix(in srgb,var(--act) 5%,transparent)}
.empty{padding:30px 16px;text-align:center;color:var(--ink3);font-size:14px}

/* 标签 */
.tag{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;white-space:nowrap}
.tag.ok{background:var(--ok-f);color:var(--ok)}
.tag.warn{background:var(--warn-f);color:var(--warn)}
.tag.bad{background:var(--bad-f);color:var(--bad)}
.tag.act{background:var(--act-f);color:var(--act)}
.tag.mut{background:var(--sunk);color:var(--ink2)}

/* 收据缩略图 */
.thumbs{display:flex;gap:5px;flex-wrap:wrap;margin-top:4px}
.thumbs a{display:block;width:42px;height:42px;border-radius:6px;overflow:hidden;
  border:1px solid var(--line2);background:var(--sunk)}
.thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.drop{border:2px dashed var(--line2);border-radius:9px;padding:14px;text-align:center;
  font-size:13px;color:var(--ink2);cursor:pointer;background:var(--paper)}
.drop:hover,.drop.over{border-color:var(--act);background:var(--act-f);color:var(--act)}

/* 提示条 */
#toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:200;
  padding:9px 17px;border-radius:9px;font-size:13.5px;font-weight:600;pointer-events:none;
  box-shadow:0 6px 22px var(--shadow);opacity:0;transition:opacity .2s;
  background:var(--act);color:var(--on-act)}
#toast.bad{background:var(--bad);color:#fff}
#toast.show{opacity:1}
.hint{font-size:12.5px;color:var(--ink3)}
.warnbox{background:var(--bad-f);border:1px solid color-mix(in srgb,var(--bad) 40%,transparent);
  border-radius:9px;padding:11px 14px;font-size:13.5px}
.warnbox b{color:var(--bad)}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}