:root { --blue:#1a62ff; --side:#1f2937; --bg:#f3f4f6; --line:#e5e7eb; --text:#111827; --muted:#6b7280; --red:#dc2626; }
* { box-sizing:border-box; }
body { margin:0; font-family:-apple-system, "Segoe UI", Roboto, Arial, sans-serif; color:var(--text); background:var(--bg); font-size:15px; }
header { display:flex; align-items:center; height:56px; background:var(--blue); color:#fff; }
header .logo { width:170px; height:56px; background:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:26px; color:var(--blue); letter-spacing:1px; }
header .user { margin-left:auto; padding:0 24px; display:flex; gap:18px; align-items:center; }
header button { background:none; border:0; color:#fff; font:inherit; cursor:pointer; padding:0; }
.layout { display:flex; min-height:calc(100vh - 56px); }
nav { width:170px; background:var(--side); padding-top:12px; flex-shrink:0; }
nav a { display:block; color:#e5e7eb; text-decoration:none; padding:12px 20px; }
nav a.active, nav a:hover { color:#fff; background:#374151; }
main { flex:1; padding:24px 32px; min-width:0; }
h1 { font-size:24px; margin:0 0 16px; }
.flash { background:#fee2e2; color:var(--red); padding:8px 12px; border-radius:4px; margin-bottom:12px; }
.flash.ok { background:#dcfce7; color:#166534; }
form.login { max-width:340px; margin:80px auto; background:#fff; padding:28px; border-radius:6px; box-shadow:0 1px 3px rgba(0,0,0,.1); }
form.login label { display:block; margin:12px 0 4px; }
input, select, textarea { font:inherit; padding:7px 9px; border:1px solid #d1d5db; border-radius:4px; width:100%; }
.btn { background:var(--blue); color:#fff; border:0; border-radius:4px; padding:8px 16px; font:inherit; cursor:pointer; }
form.login .btn { margin-top:18px; width:100%; }
@media (max-width:700px) { nav { display:none; } main { padding:16px; } header .logo { width:110px; } }
.bar { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:12px; }
.bar h1 { margin:0; }
.search { margin-left:auto; width:320px; max-width:100%; }
.muted { color:var(--muted); }
.sheet { overflow-x:auto; background:#fff; border:1px solid var(--line); }
.sheet table { border-collapse:collapse; width:100%; font-size:14px; }
.sheet th, .sheet td { border:1px solid var(--line); padding:5px 8px; text-align:left; vertical-align:top; white-space:nowrap; }
.sheet th { background:#f9fafb; font-weight:600; position:sticky; top:0; }
.sheet tbody tr:hover { background:#eef4ff; cursor:pointer; }
.sheet td.wrap { white-space:normal; min-width:200px; }
.sheet td.num { text-align:right; }
a { color:var(--blue); text-decoration:none; }
a:hover { text-decoration:underline; }
.badge { display:inline-block; font-size:12px; padding:1px 7px; border-radius:10px; white-space:nowrap; }
.badge.red { background:#fee2e2; color:var(--red); }
.badge.green { background:#dcfce7; color:#15803d; }
.badge.blue { background:#dbeafe; color:#1d4ed8; }
.cols { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:900px) { .cols { grid-template-columns:1fr; } }
.box { background:#fff; border:1px solid var(--line); border-radius:6px; padding:14px 18px; margin-bottom:16px; }
.box h2 { font-size:17px; margin:0 0 10px; }
.box .sheet { border:0; }
.kv { border-collapse:collapse; width:100%; }
.kv th { text-align:left; color:var(--muted); font-weight:500; padding:4px 12px 4px 0; width:150px; vertical-align:top; }
.kv td { padding:4px 0; }
.pre { white-space:pre-wrap; }
.entry { border-bottom:1px solid var(--line); padding:8px 0; }
summary { cursor:pointer; }
/* Nowe elementy (do dodania w oryginale) oznaczone na zielono */
:root { --new:#16a34a; --new-bg:#f0fdf4; }
.badge.new { background:var(--new); color:#fff; font-size:10px; font-weight:700; letter-spacing:.5px; vertical-align:middle; }
.new-box { border-left:4px solid var(--new); background:var(--new-bg); }
.new-row th, .new-row td { background:var(--new-bg); }
nav a.new-nav { border-left:4px solid var(--new); padding-left:16px; }
button.link { background:none; border:0; color:var(--blue); cursor:pointer; font:inherit; padding:0 6px; }
td.actions form { display:inline; }
form.inline select { width:auto; padding:3px 6px; }
.grid-form label { display:block; margin-bottom:10px; }
.grid-form input, .grid-form select { margin-top:4px; }
code.big { font-size:20px; background:#fff; padding:4px 10px; border:1px solid var(--line); border-radius:4px; user-select:all; }

.sheet td { max-width:300px; overflow:hidden; text-overflow:ellipsis; }
.sheet td.wrap { max-width:none; }
.btn:disabled, fieldset:disabled .btn { background:#9ca3af; cursor:not-allowed; }
/* Leady: kolor źródła i etapu */
.zr { display:inline-block; font-size:12px; padding:1px 8px; border-radius:10px; white-space:nowrap; font-weight:600; }
.zr-strona { background:#dbeafe; color:#1d4ed8; }
.zr-arkusz { background:#e5e7eb; color:#374151; }
.zr-email { background:#ede9fe; color:#6d28d9; }
.zr-reczny { background:#fef3c7; color:#92400e; }
.sheet tr.row-strona td:first-child { border-left:4px solid #1d4ed8; }
.sheet tr.row-email td:first-child { border-left:4px solid #6d28d9; }
.et { display:inline-block; font-size:12px; padding:1px 7px; border-radius:4px; white-space:nowrap; border:1px solid var(--line); }
.et-nowy { background:#fff7ed; color:#c2410c; border-color:#fed7aa; }
.et-w-kontakcie { background:#eff6ff; color:#1d4ed8; border-color:#bfdbfe; }
.et-probki { background:#f5f3ff; color:#6d28d9; border-color:#ddd6fe; }
.et-rfq { background:#fefce8; color:#a16207; border-color:#fde68a; }
.et-wygrany { background:#dcfce7; color:#15803d; border-color:#bbf7d0; }
.et-przegrany { background:#f3f4f6; color:#6b7280; }
.tabs { display:flex; gap:6px; flex-wrap:wrap; margin:0 0 10px; }
.tabs a { padding:5px 12px; border:1px solid var(--line); border-radius:16px; background:#fff; color:var(--text); font-size:14px; }
.tabs a.on { background:var(--blue); color:#fff; border-color:var(--blue); }
.tabs a.off { color:var(--muted); pointer-events:none; }
.sheet td.msg { white-space:normal; min-width:260px; max-width:420px; color:#374151; }
.tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:12px; margin-bottom:16px; }
.tile { background:#fff; border:1px solid var(--line); border-radius:6px; padding:14px 16px; color:var(--text); }
.tile b { display:block; font-size:28px; }
.tile:hover { text-decoration:none; border-color:var(--blue); }
.lejek { display:flex; gap:8px; flex-wrap:wrap; }
.lejek a { flex:1; min-width:110px; text-align:center; padding:10px; border-radius:6px; color:var(--text); }
.lejek a b { display:block; font-size:22px; }
pre.msg { white-space:pre-wrap; font:inherit; margin:0; }
.new-note { margin:0 0 10px; }