:root { --bg:#f6f4ef; --card:#fff; --text:#1f2421; --muted:#68706b; --accent:#2f6b4f; --accent-2:#e7f0eb;
  --border:#e1ddd3; --warn:#9a3b1f; --warn-bg:#fbeee9; --ok-bg:#e9f5ee; --info-bg:#fff7df; }
* { box-sizing:border-box; }
body { margin:0; font:15px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; background:var(--bg); color:var(--text); }
a { color:var(--accent); }
header { background:var(--accent); color:#fff; padding:10px 16px; display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
header a { color:#fff; text-decoration:none; opacity:.85; padding:4px 0; }
header a.active, header a:hover { opacity:1; border-bottom:2px solid #fff; }
header .brand { font-weight:700; margin-right:8px; }
header .right { margin-left:auto; display:flex; gap:12px; align-items:center; }
main { max-width:1150px; margin:20px auto; padding:0 16px; }
h1 { font-size:1.45rem; margin:0 0 16px; } h2 { font-size:1.12rem; margin:0 0 12px; }
.card { background:var(--card); border:1px solid var(--border); border-radius:10px; padding:18px; margin-bottom:18px; }
.flash { padding:10px 14px; border-radius:8px; margin-bottom:16px; border:1px solid; }
.flash.ok { background:var(--ok-bg); border-color:#b9dcc6; } .flash.error { background:var(--warn-bg); border-color:#e8c1b3; } .flash.info { background:var(--info-bg); border-color:#ecd9a0; }
.muted { color:var(--muted); font-size:.9em; } .warn { color:var(--warn); } .nowrap { white-space:nowrap; }
.grid { display:grid; gap:14px; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); }
.stat { background:var(--card); border:1px solid var(--border); border-radius:10px; padding:14px; }
.stat .n { font-size:1.7rem; font-weight:700; } .stat .l { color:var(--muted); font-size:.9em; }
table { width:100%; border-collapse:collapse; }
th, td { text-align:left; padding:7px 8px; border-bottom:1px solid var(--border); vertical-align:top; }
th { font-size:.82em; color:var(--muted); font-weight:600; }
td.num, th.num { text-align:right; white-space:nowrap; }
.overflow { overflow-x:auto; }
button, .btn { background:var(--accent); color:#fff; border:0; border-radius:6px; padding:8px 14px; cursor:pointer;
  font:inherit; text-decoration:none; display:inline-block; }
button.secondary, .btn.secondary { background:var(--accent-2); color:var(--accent); }
button.danger { background:var(--warn); }
button.link { background:none; color:#fff; padding:0; text-decoration:underline; }
button.small, .btn.small { padding:4px 9px; font-size:.88em; }
input[type=text], input[type=password], input[type=number], input[type=search], select, textarea {
  font:inherit; padding:7px 9px; border:1px solid var(--border); border-radius:6px; background:#fff; max-width:100%; }
textarea { width:100%; min-height:90px; }
label { display:block; margin:10px 0 4px; font-weight:600; font-size:.92em; }
.check label, label.inline { display:inline-flex; gap:6px; align-items:center; font-weight:400; margin:0 14px 0 0; }
form.inline { display:inline; }
.filters { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.pill { display:inline-block; padding:1px 8px; border-radius:20px; font-size:.82em; background:var(--accent-2); color:var(--accent); }
.pill.warn { background:var(--warn-bg); color:var(--warn); }
.pager { display:flex; gap:6px; margin-top:12px; flex-wrap:wrap; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:18px; } @media (max-width:800px){ .two { grid-template-columns:1fr; } }
dl.kv { display:grid; grid-template-columns:200px 1fr; gap:6px 12px; margin:0; } dl.kv dt { color:var(--muted); }
@media (max-width:600px){ dl.kv { grid-template-columns:1fr; } dl.kv dt { margin-top:6px; } }
pre.log { background:#1f2421; color:#e6e6e6; padding:12px; border-radius:8px; overflow:auto; max-height:520px; font-size:12px; }
.login { max-width:380px; margin:60px auto; }
.small { font-size:.88em; }
/* Картка партнера: QR банки на комп'ютері, кнопка «Відкрити банку» на телефоні (сенсорний екран) */
.pay-jar { display:flex; flex-direction:column; align-items:flex-start; gap:4px; margin-top:8px; }
.pay-jar img.qr { image-rendering:pixelated; border:1px solid var(--border); border-radius:6px; background:#fff; }
.only-mobile { display:none !important; }
@media (hover:none) and (pointer:coarse) { .only-mobile { display:inline-block !important; } .only-desktop { display:none !important; } }
details.inline-details { display:inline; } details.inline-details[open] { display:block; margin:4px 0; }
.pay-form { margin-top:8px; min-width:240px; white-space:normal; } .pay-form input { width:100%; }
summary.btn, summary.link { cursor:pointer; list-style:none; } summary.link { color:var(--accent); text-decoration:underline; display:inline; }
@media (max-width:700px){ .wide-only { display:none; }
  .stack table, .stack tr, .stack td { display:block; } .stack tr:first-child { display:none; }
  .stack tr { border-bottom:1px solid var(--border); padding:8px 0; } .stack td { border:0; padding:2px 0; text-align:left; } .pay-form { min-width:0; } }
dialog { border:1px solid var(--border); border-radius:10px; padding:18px; max-width:min(440px, calc(100vw - 32px)); background:var(--card); color:var(--text); }
dialog::backdrop { background:rgba(0,0,0,.35); }
label.block { display:block; margin:6px 0; }