:root{
  --red:#c8161d;
  --red-dark:#9e1015;
  --bg:#f5f1ec;
  --card:#ffffff;
  --text:#222;
  --muted:#888;
  --line:#ececec;
  --ok:#1f9d55;
  --no:#c8161d;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--bg);color:var(--text);font-size:15px;line-height:1.6;
}
.topbar{
  background:linear-gradient(135deg,var(--red),var(--red-dark));
  color:#fff;padding:18px 16px;box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.topbar h1{margin:0;font-size:19px;letter-spacing:1px}
.topbar .sub{margin:2px 0 0;font-size:12px;opacity:.85}
.container{max-width:520px;margin:0 auto;padding:14px}
.card{background:var(--card);border-radius:12px;padding:16px;margin-bottom:14px;box-shadow:0 1px 4px rgba(0,0,0,.05)}
.card h2{margin:0 0 12px;font-size:16px;color:var(--red);border-left:4px solid var(--red);padding-left:8px}
.field{display:block;margin-bottom:14px}
.field>span{display:block;font-size:13px;color:#555;margin-bottom:6px}
input,select,textarea{
  width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;
  font-size:15px;background:#fff;color:var(--text);outline:none;font-family:inherit;
}
input:focus,select:focus,textarea:focus{border-color:var(--red)}
textarea{resize:vertical}
.checks{display:flex;flex-wrap:wrap;gap:8px}
.check{
  display:flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid var(--line);
  border-radius:8px;font-size:14px;cursor:pointer;background:#fafafa;
}
.check input{width:auto;margin:0}
.halls{display:flex;flex-direction:column;gap:10px}
.hall{border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:#fafafa}
.hall h3{margin:0 0 4px;color:var(--red);font-size:15px}
.hall p{margin:0;font-size:13px;color:#666}
button{
  width:100%;padding:12px;border:none;border-radius:8px;background:var(--red);color:#fff;
  font-size:16px;font-weight:600;cursor:pointer;
}
button:disabled{opacity:.6;cursor:not-allowed}
.btn-ghost{background:#fff;color:var(--red);border:1px solid var(--red)}
.btn-ok{background:var(--ok);color:#fff}
.btn-no{background:var(--no);color:#fff}
.hint{font-size:12px;color:var(--muted);margin:8px 0 0}
.hint.warn{color:var(--red)}
.err{color:var(--no);font-size:13px;margin:6px 0 0}
.ok{color:var(--ok);font-size:14px;margin:8px 0 0}
.hidden{display:none}
.result .code{
  font-size:30px;font-weight:700;letter-spacing:3px;color:var(--red);text-align:center;
  background:#fdecec;border:1px dashed var(--red);border-radius:10px;padding:14px;margin:6px 0 10px;
}
.row{display:flex;gap:10px;align-items:flex-end;margin-bottom:12px}
.row label{flex:1}
.row select{margin:0}
.item{border:1px solid var(--line);border-radius:10px;padding:12px;margin-bottom:12px}
.item-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.code-sm{font-weight:700;color:var(--red);letter-spacing:1px}
.badge{font-size:12px;padding:2px 8px;border-radius:10px;color:#fff}
.badge.pending{background:#e8a93b}
.badge.approved{background:var(--ok)}
.badge.rejected{background:var(--no)}
.kv{display:flex;font-size:14px;padding:3px 0;border-bottom:1px dashed #f0f0f0}
.kv span{width:64px;color:var(--muted);flex:none}
.kv b{font-weight:600}
.actions{display:flex;gap:10px;margin-top:10px}
.actions button{width:auto;flex:1;padding:9px}
.status{font-size:15px;font-weight:700;color:var(--red);text-align:center;margin:8px 0}
#code{text-transform:uppercase;letter-spacing:2px;font-weight:700}