:root { --bg:#f6f8fa; --card:#fff; --text:#1f2933; --muted:#6b7785; --line:#e1e6ec; --accent:#1f4e78; --accent-bg:#eaf1f8; }
* { box-sizing: border-box; }
body { margin:0; font:14px/1.45 -apple-system,"Segoe UI",Roboto,Arial,sans-serif; background:var(--bg); color:var(--text); }
a { color:var(--accent); text-decoration:none; } a:hover { text-decoration:underline; }
.wrap { max-width:1400px; margin:0 auto; padding:20px 16px 40px; }
h1 { font-size:20px; margin:0 0 14px; }
h1 a { color:inherit; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; }
form.search { display:flex; flex-wrap:wrap; gap:8px; padding:12px; margin-bottom:12px; }
form.search input[type=text] { flex:1 1 320px; min-width:200px; padding:9px 12px; font-size:15px; border:1px solid var(--line); border-radius:6px; }
form.search select { padding:9px 8px; border:1px solid var(--line); border-radius:6px; background:#fff; max-width:260px; }
form.search button { padding:9px 18px; border:0; border-radius:6px; background:var(--accent); color:#fff; font-size:14px; cursor:pointer; }
.meta { color:var(--muted); margin:0 2px 8px; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; }
th, td { padding:8px 10px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line); }
th { background:var(--accent-bg); font-weight:600; white-space:nowrap; position:sticky; top:0; }
th a { color:var(--accent); }
tbody tr:hover { background:#f9fbfd; }
td.num, th.num { text-align:right; white-space:nowrap; }
td.desc { min-width:260px; color:#3b4652; }
.cat { font-weight:600; } .type { color:var(--muted); font-size:13px; }
.mono { font-family:ui-monospace,Consolas,monospace; }
.guess { display:inline-block; margin-left:4px; padding:0 5px; border-radius:8px; background:#fff3cd; color:#7a5b00; font-size:11px; cursor:help; }
.empty { padding:30px; text-align:center; color:var(--muted); }
.pager { display:flex; gap:6px; flex-wrap:wrap; margin-top:12px; }
.pager a, .pager span { padding:6px 11px; border:1px solid var(--line); border-radius:6px; background:#fff; }
.pager span.cur { background:var(--accent); color:#fff; border-color:var(--accent); }
dl.props { display:grid; grid-template-columns:200px 1fr; gap:6px 16px; margin:0; padding:16px; }
dl.props dt { color:var(--muted); } dl.props dd { margin:0; }
.cancelled { color:#a33; }
h2 { font-size:16px; margin:22px 2px 8px; }
.flash { padding:10px 14px; border-radius:6px; margin:0 0 12px; border:1px solid; }
.flash.ok  { background:#e8f5ec; border-color:#a6d4b2; color:#1b5e30; }
.flash.err { background:#fdecec; border-color:#f0b5b5; color:#8a1f1f; }
.stock { font-weight:600; } .stock.zero { color:#a33; font-weight:400; }
.stock-big { font-size:20px; font-weight:700; }
.codes { font-size:13px; white-space:nowrap; } .codes small { color:var(--muted); }
form.move { display:flex; flex-wrap:wrap; gap:8px; align-items:flex-end; padding:14px 16px; }
form.move label { display:flex; flex-direction:column; gap:3px; font-size:12px; color:var(--muted); }
form.move input, form.move select { padding:8px 10px; border:1px solid var(--line); border-radius:6px; font-size:14px; background:#fff; color:var(--text); }
form.move input[name=qty] { width:110px; } form.move input[name=note] { width:300px; max-width:100%; }
button.btn { padding:9px 18px; border:0; border-radius:6px; background:var(--accent); color:#fff; font-size:14px; cursor:pointer; }
button.link { border:0; background:none; color:#a33; cursor:pointer; padding:0; font-size:13px; }
button.link:hover { text-decoration:underline; }
.hint { padding:0 16px 14px; color:var(--muted); font-size:12px; margin:0; }
.neg { color:#a33; } .pos { color:#1b5e30; }
.userbar { display:flex; justify-content:flex-end; align-items:center; gap:10px; margin:-6px 0 8px; font-size:13px; color:var(--muted); }
.userbar form { margin:0; } .userbar button.link { color:var(--accent); }
.badge { padding:1px 9px; border-radius:10px; font-size:12px; }
.badge.edit { background:#e8f5ec; color:#1b5e30; } .badge.ro { background:#eef1f5; color:#52606d; }
form.login { max-width:380px; margin:12vh auto 0; padding:22px; display:flex; flex-direction:column; gap:12px; }
form.login h1 { margin:0 0 4px; }
form.login label { display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--muted); }
form.login input { padding:9px 12px; font-size:15px; border:1px solid var(--line); border-radius:6px; color:var(--text); }
.nav { display:flex; gap:6px; margin:0 0 14px; }
.nav a { padding:7px 14px; border-radius:6px; background:#fff; border:1px solid var(--line); color:var(--text); }
.nav a.on { background:var(--accent); border-color:var(--accent); color:#fff; text-decoration:none; }
.nav .count { display:inline-block; min-width:20px; padding:0 6px; margin-left:4px; border-radius:10px; background:#c0392b; color:#fff; font-size:12px; text-align:center; }
td.low { color:#a33; background:#fdecec; }
input.minq { width:68px; padding:4px 6px; border:1px solid var(--line); border-radius:5px; font-size:13px; text-align:right; color:var(--text); }
input.minq.ok { border-color:#46a35e; background:#f0faf3; } input.minq.err { border-color:#c0392b; background:#fdecec; }
a.editlink { font-size:13px; font-weight:400; margin-left:10px; }
form.edit { padding:16px; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px 18px; }
form.edit label { display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--muted); }
form.edit label.wide, form.edit .wide { grid-column:1 / -1; }
form.edit input[type=text], form.edit input[type=number], form.edit select, form.edit textarea { padding:8px 10px; border:1px solid var(--line); border-radius:6px; font-size:14px; background:#fff; color:var(--text); font-family:inherit; }
form.edit textarea { min-height:90px; resize:vertical; }
form.edit fieldset { grid-column:1 / -1; border:1px solid var(--line); border-radius:6px; padding:12px 14px; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px 18px; }
form.edit legend { font-size:12px; color:var(--muted); padding:0 6px; }
form.edit .actions { grid-column:1 / -1; display:flex; gap:12px; align-items:center; }
form.edit .check { flex-direction:row; align-items:center; gap:8px; font-size:13px; color:var(--text); }
@media (max-width:700px) { form.edit, form.edit fieldset { grid-template-columns:1fr; } }