:root { --bg:#f6f4ef; --card:#fff; --ink:#1d1d1b; --muted:#6b6b66; --line:#e3e0d8; --ok:#1f8a4c; --warn:#b7791f; --bad:#c0392b; --accent:#2b5f8f; }
* { box-sizing: border-box; }
html, body { margin:0; padding:0; background:var(--bg); color:var(--ink); font-family: -apple-system, "Segoe UI", Arial, "Noto Sans Hebrew", sans-serif; font-size:16px; direction:rtl; }
header.top { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 20px; background:var(--card); border-bottom:1px solid var(--line); flex-wrap:wrap; }
.brand { font-weight:700; }
nav { display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
nav a { color:var(--accent); text-decoration:none; padding:4px 6px; border-radius:6px; }
nav a.active { background:var(--bg); font-weight:600; }
form.inline { display:inline; margin:0; }
button.link { background:none; border:none; color:var(--muted); cursor:pointer; font:inherit; }
main { max-width:1100px; margin:0 auto; padding:20px; }
h1 { font-size:1.4rem; margin:0 0 16px; }
h2 { font-size:1.1rem; margin:24px 0 8px; }
.cards { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:12px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:14px 16px; }
.card .label { color:var(--muted); font-size:.85rem; margin-bottom:6px; }
.card .value { font-size:1.15rem; font-weight:600; }
.card.ok { border-color:var(--ok); }
.card.warn { border-color:var(--warn); }
.card.bad { border-color:var(--bad); background:#fdf1ef; }
.pill { display:inline-block; padding:2px 10px; border-radius:999px; font-size:.85rem; background:var(--bg); }
.pill.ok { background:#e6f4ea; color:var(--ok); }
.pill.warn { background:#fbf1dd; color:var(--warn); }
.pill.bad { background:#fbe3df; color:var(--bad); }
.banner { padding:10px 20px; text-align:center; font-weight:600; }
.banner.warn { background:#fbf1dd; color:var(--warn); }
.banner.bad { background:#fbe3df; color:var(--bad); }
.banner.ok { background:#e6f4ea; color:var(--ok); }
table { width:100%; border-collapse:collapse; background:var(--card); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
th, td { padding:8px 10px; border-bottom:1px solid var(--line); text-align:right; vertical-align:top; }
th { background:var(--bg); font-weight:600; font-size:.9rem; }
td.ltr, .ltr { direction:ltr; unicode-bidi:plaintext; text-align:right; font-variant-numeric: tabular-nums; }
.muted { color:var(--muted); font-size:.9rem; }
.login { max-width:360px; margin:60px auto; }
input[type=password], input[type=text], input[type=number], textarea, select { width:100%; padding:10px; border:1px solid var(--line); border-radius:8px; font:inherit; background:#fff; }
textarea { min-height:160px; line-height:1.5; }
button.primary { background:var(--accent); color:#fff; border:none; padding:10px 18px; border-radius:8px; font:inherit; cursor:pointer; }
button.danger { background:var(--bad); color:#fff; border:none; padding:8px 14px; border-radius:8px; font:inherit; cursor:pointer; }
.error { color:var(--bad); margin:8px 0; }
.ok-text { color:var(--ok); }
.row { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.qr { background:#fff; padding:12px; border:1px solid var(--line); border-radius:10px; display:inline-block; }
@media (max-width:600px) { main { padding:12px; } th, td { padding:6px; font-size:.9rem; } }