:root { --bg:#faf7f2; --card:#fff; --ink:#22201c; --muted:#6b655c; --line:#e6dfd3; --accent:#9b2c4a;
        --ok:#1f6b3a; --ok-bg:#dcefe3; --bad:#a1281f; --bad-bg:#fbe1de; --warn-bg:#fdecc8; --info-bg:#e3ecfa; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#16140f; --card:#211e18; --ink:#ede7dc; --muted:#a39b8d; --line:#3a352c; --accent:#e58aa2;
          --ok:#9fdcb4; --ok-bg:#183826; --bad:#f2a49b; --bad-bg:#45201c; --warn-bg:#4a3512; --info-bg:#1d2c44; } }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.45 system-ui, -apple-system, "Segoe UI", "Noto Sans", "Noto Sans Devanagari", sans-serif; }
a { color:var(--accent); }
main { max-width:1000px; margin:0 auto; padding:16px 16px 64px; }
h1 { font-size:1.45rem; margin:8px 0 12px; } h2 { font-size:1.1rem; margin:24px 0 8px; }
.top { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 16px; border-bottom:1px solid var(--line); background:var(--card); flex-wrap:wrap; }
.brand { font-weight:700; text-decoration:none; color:var(--ink); } .brand span { color:var(--accent); }
nav { display:flex; gap:14px; align-items:center; } nav form { margin:0; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px 16px; margin:10px 0; }
.narrow { max-width:360px; margin:40px auto; }
.row { display:flex; justify-content:space-between; gap:12px; text-decoration:none; color:var(--ink); flex-wrap:wrap; }
.inline { display:flex; gap:8px; } .inline input { flex:1; }
.muted { color:var(--muted); font-size:.9rem; }
.flash { background:var(--info-bg); border-radius:8px; padding:8px 12px; }
label { display:block; margin:10px 0; font-size:.92rem; }
input, select { font:inherit; width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--ink); margin-top:4px; min-height:40px; }
input[type=checkbox] { width:auto; min-height:auto; margin:0 8px 0 0; }
label.check { display:flex; align-items:center; }
button, .btn { font:inherit; background:var(--accent); color:#fff; border:0; border-radius:8px; padding:9px 16px; cursor:pointer; text-decoration:none; display:inline-block; min-height:40px; }
button.ghost, .btn.ghost { background:transparent; color:var(--accent); border:1px solid var(--accent); }
button.small { padding:4px 10px; min-height:32px; font-size:.85rem; } button.link { background:none; color:var(--accent); padding:0; min-height:auto; }
button.danger { background:var(--bad); } button.go { background:var(--ok); }
.actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.head { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:12px; } @media (max-width:560px) { .two { grid-template-columns:1fr; } }
.tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(110px, 1fr)); gap:8px; margin:12px 0; }
.tile { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:10px; font-size:.85rem; color:var(--muted); }
.tile b { display:block; font-size:1.5rem; color:var(--ink); } .tile.ok b { color:var(--ok); } .tile.bad b { color:var(--bad); }
.wrap { overflow-x:auto; background:var(--card); border:1px solid var(--line); border-radius:12px; }
table { border-collapse:collapse; width:100%; } th, td { text-align:left; padding:7px 10px; border-bottom:1px solid var(--line); vertical-align:top; }
th { font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
tr.warn td { background:var(--warn-bg); } .bad { color:var(--bad); }
table.details input { margin:0; } table.details th { text-transform:none; }
.filters { display:flex; gap:8px; align-items:center; flex-wrap:wrap; } .filters select { width:auto; }
.guest { display:grid; gap:6px; padding:10px 14px; margin:6px 0; }
.g1 { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; } .g1 a { text-decoration:none; color:var(--ink); }
.g3 { display:flex; gap:8px; align-items:center; margin:0; } .g3 select { width:auto; margin:0; min-height:34px; padding:4px 8px; }
.st { display:inline-block; font-size:.78rem; padding:2px 8px; border-radius:999px; background:var(--info-bg); margin:0 4px 4px 0; }
.st.delivered, .st.read, .st.approved { background:var(--ok-bg); color:var(--ok); } .st.failed, .st.unknown, .st.rejected { background:var(--bad-bg); color:var(--bad); }
.st.note { background:var(--warn-bg); }
.map { display:grid; grid-template-columns:44px 1fr 1fr; gap:8px; align-items:center; margin:6px 0; }
.map select, .map input { margin:0; } @media (max-width:560px) { .map { grid-template-columns:44px 1fr; } .map input { grid-column:2; } }
.var { font-family:ui-monospace, monospace; color:var(--muted); }
.preview { white-space:pre-wrap; font:inherit; background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:12px; }
.summary { font-size:1.05rem; } .confirm { border-top:1px solid var(--line); margin-top:14px; padding-top:10px; display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.map input { display:none; } .map:has(option[value="text:"]:checked) input { display:block; }
@media (max-width:560px) { table.details tr { display:grid; grid-template-columns:1fr 1fr; } table.details th { grid-column:1 / -1; padding-bottom:0; border:0; } table.details tr:first-child { display:none; } }
.sheet td { padding:2px 4px; } .sheet td.n { color:var(--muted); font-size:.8rem; text-align:right; padding-right:8px; }
.sheet input, .sheet select { margin:0; min-height:34px; padding:4px 8px; border-radius:4px; min-width:90px; }
.sheet td:nth-child(2) input { min-width:200px; } .sheet td:nth-child(3) input { min-width:160px; }
.sheet input:focus, .sheet select:focus { outline:2px solid var(--accent); outline-offset:-1px; }
.sheet thead th { position:sticky; top:0; background:var(--card); z-index:1; }
.sheet td:nth-child(4) input, .sheet td:nth-child(5) input { min-width:128px; font-variant-numeric:tabular-nums; }
.sheet td:nth-child(6) input { min-width:200px; } .sheet select { min-width:64px; }
.sheet input[type=checkbox] { min-width:0; width:18px; height:18px; min-height:0; }
main:has(.sheet) { max-width:1400px; }
.paircode { font:700 2rem/1.2 ui-monospace, monospace; letter-spacing:.15em; }
