:root { --bg:#f5f7fb; --card:#fff; --ink:#1c2333; --muted:#6b7385; --line:#e3e7ef; --primary:#3b5bdb; --dark:#1b2a6b; --green:#2f9e44; --amber:#e8890c; --red:#d6336c; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
a { color:var(--primary); text-decoration:none; }
main { max-width:980px; margin:0 auto; padding:16px; }
.top { background:var(--dark); color:#fff; display:flex; flex-wrap:wrap; gap:8px 18px; align-items:center; padding:10px 16px; }
.top a { color:#fff; opacity:.85; } .top a:hover { opacity:1; }
.brand { font-weight:700; opacity:1 !important; } .top nav { display:flex; gap:14px; flex:1; flex-wrap:wrap; }
.tools { display:flex; gap:10px; align-items:center; } .langs a { padding:2px 4px; border-radius:4px; text-transform:uppercase; font-size:12px; } .langs a.on { background:rgba(255,255,255,.2); opacity:1; }
.inline { display:inline; margin:0; } button.link { background:none; border:0; color:#fff; cursor:pointer; opacity:.85; font:inherit; }
h1 { font-size:22px; margin:6px 0 14px; } h2 { font-size:17px; margin:22px 0 8px; } h3 { margin:0 0 8px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px; margin-bottom:12px; }
.narrow { max-width:380px; margin:60px auto; }
label { display:block; font-size:12.5px; color:var(--muted); } label > input, label > select, label > textarea { margin-top:3px; }
input, select, textarea { width:100%; padding:9px 10px; border:1px solid var(--line); border-radius:8px; font:inherit; background:#fff; color:var(--ink); }
textarea { resize:vertical; }
input[type=color] { width:56px; padding:2px; height:36px; display:inline-block; }
.form2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:10px 14px; align-items:end; } .form2 .wide { grid-column:1/-1; }
.btn { display:inline-block; padding:9px 14px; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--ink); cursor:pointer; font:inherit; }
.btn.primary { background:var(--primary); border-color:var(--primary); color:#fff; } .btn.danger { color:var(--red); border-color:#f1c1d2; }
.actions { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 14px; } .actions.sticky { position:sticky; bottom:0; background:var(--bg); padding:10px 0; }
.grid3 { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; margin-bottom:10px; }
.stat { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px; } .stat span { display:block; color:var(--muted); font-size:13px; } .stat b { font-size:22px; } .stat.warn b { color:var(--amber); }
.tablewrap { overflow-x:auto; } table.list { width:100%; border-collapse:collapse; background:var(--card); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
table.list th, table.list td { padding:9px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; } table.list th { font-size:12px; color:var(--muted); background:#fafbfe; }
table.list tbody tr { cursor:pointer; } table.list tbody tr:hover { background:#f6f8ff; } .r { text-align:right !important; white-space:nowrap; }
.badge { padding:2px 8px; border-radius:99px; font-size:12px; font-weight:600; background:#e7eaf3; color:#445; }
.badge.green { background:#d3f2dc; color:#17692f; } .badge.amber { background:#ffe9c7; color:#8a5200; } .badge.red { background:#fbd5e3; color:#9b1c4a; } .badge.blue { background:#dbe4ff; color:#2b3f9e; } .badge.gray { background:#eceef3; }
.muted { color:var(--muted); } .flash { background:#e7f5ec; border:1px solid #b6e2c3; border-radius:10px; padding:9px 12px; margin-bottom:12px; } .flash.err { background:#fde8ef; border-color:#f4bcd0; }
.filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; } .filters input, .filters select { width:auto; flex:1 1 150px; }
.line .linegrid { display:grid; grid-template-columns:1.2fr .7fr .7fr 1fr .6fr auto; gap:8px; margin-top:8px; align-items:end; }
.total { text-align:right; font-size:16px; } .meta { display:grid; grid-template-columns:max-content 1fr; gap:4px 14px; margin:0 0 12px; } .meta dt { color:var(--muted); } .meta dd { margin:0; }
.row { display:flex; justify-content:space-between; align-items:center; gap:8px; } .site { display:grid; gap:8px; }
@media (max-width:640px) { .line .linegrid { grid-template-columns:1fr 1fr; } main { padding:10px; } }

table.list td:first-child { white-space:nowrap; }
.num { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; } .pos { color:#17692f; } .neg { color:#9b1c4a; }
.filters { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:10px 0; } .filters select, .filters input[type=text] { padding:7px 9px; border:1px solid var(--line); border-radius:8px; font:inherit; }
.upload { border:2px dashed var(--line); border-radius:12px; padding:14px; margin-bottom:12px; background:var(--card); }
.catform select { padding:4px 6px; border:1px solid var(--line); border-radius:8px; font:inherit; min-width:150px; max-width:220px; }
.warnbox { background:#fff4dc; border:1px solid #f0d28a; border-radius:10px; padding:9px 12px; margin-bottom:12px; }
td.sm { font-size:13px; color:var(--muted); max-width:340px; }
main button.link { color:#3b5bdb; text-decoration:underline; opacity:1; padding:0 4px; }