:root{--bg:#f4f5f7;--card:#fff;--ink:#17202a;--mute:#667085;--line:#d9dde3;--brand:#c0392b;--ok:#1e8449;--warn:#b9770e;--bad:#b03a2e;--blue:#1f5fa8}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.4 system-ui,Segoe UI,Roboto,sans-serif}
header{background:var(--brand);color:#fff;padding:10px 16px;display:flex;gap:12px;align-items:center;flex-wrap:wrap;position:sticky;top:0;z-index:5}
header h1{font-size:18px;margin:0;flex:1}
header a{color:#fff;text-decoration:none;font-size:14px;padding:4px 8px;border:1px solid rgba(255,255,255,.5);border-radius:6px}
header a.on{background:#fff;color:var(--brand)}
main{max-width:720px;margin:0 auto;padding:12px 16px 80px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px;margin:12px 0}
.card h3{margin:0 0 6px;font-size:16px}
label{display:block;font-size:13px;color:var(--mute);margin:10px 0 3px}
input,select,textarea{width:100%;padding:10px;border:1px solid var(--line);border-radius:8px;font:inherit;background:#fff;color:var(--ink)}
input[type=checkbox],input[type=radio]{width:auto}
.row{display:flex;gap:8px}.row>*{flex:1;min-width:0}
.seg{display:flex;gap:8px;flex-wrap:wrap}
.seg label{margin:0;flex:1;border:1px solid var(--line);border-radius:8px;padding:10px;text-align:center;color:var(--ink);font-size:15px;background:#fff;cursor:pointer}
.seg input{display:none}.seg input:checked+span{font-weight:700;color:var(--brand)}
.seg label:has(input:checked){border-color:var(--brand);background:#fdf1ef}
button{font:inherit;padding:11px 14px;border-radius:8px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer}
button.primary{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:700;width:100%}
button.ok{background:var(--ok);border-color:var(--ok);color:#fff;font-weight:700}
button.small{padding:6px 10px;font-size:14px}
button:disabled{opacity:.5}
.chip{display:inline-block;font-size:12px;font-weight:700;padding:2px 8px;border-radius:99px;background:#e8eaee;color:var(--mute)}
.chip.READY{background:#e3f0ff;color:var(--blue)}.chip.POSTED{background:#e2f5e8;color:var(--ok)}
.chip.HOLD,.chip.REJECTED{background:#fbe4e1;color:var(--bad)}.chip.WAITING,.chip.BOOKED,.chip.MANUAL{background:#fdf0d5;color:var(--warn)}
.mute{color:var(--mute);font-size:13px}
.bad{color:var(--bad)}.warn{color:var(--warn)}.good{color:var(--ok)}
.msg{padding:10px;border-radius:8px;margin:10px 0;font-size:14px}
.msg.bad{background:#fbe4e1}.msg.warn{background:#fdf0d5}.msg.good{background:#e2f5e8}
.line{border-top:1px dashed var(--line);padding-top:8px;margin-top:8px}
.sugg{border:1px solid var(--line);border-radius:8px;margin-top:4px;max-height:220px;overflow:auto;background:#fff}
.sugg div{padding:8px 10px;border-bottom:1px solid #eef0f3;font-size:14px;cursor:pointer}
.sugg div small{color:var(--mute)}
table{width:100%;border-collapse:collapse;font-size:14px}
td{padding:4px 0;vertical-align:top}td.n{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.total td{border-top:1px solid var(--line);font-weight:700}
img.thumb{max-width:100%;max-height:220px;border-radius:8px;border:1px solid var(--line);margin-top:6px}
