:root{
  --brand-dark:#3d2817;
  --brand-darker:#2b1c10;
  --brand-gold:#c9a227;
  --brand-gold-light:#e8c766;
  --brand-cream:#f7ecd7;
  --brand-text-soft:#6b5a45;
  --brand-text-muted:#8a7355;
  --brand-border:#e6d9c3;
}
body{margin:0;padding:20px;background:#f5f0e6;font-family:-apple-system,'Segoe UI',Roboto,sans-serif;color:#3d2817;}
.app{max-width:520px;margin:0 auto;}
.app.wide{max-width:900px;}
.card{background:#fffaf3;border:1px solid var(--brand-border);border-radius:12px;padding:24px;text-align:center;}
.label{font-size:13px;color:var(--brand-text-muted);text-transform:uppercase;letter-spacing:1px;}
.bignum{font-size:64px;font-weight:800;color:var(--brand-dark);margin:8px 0;letter-spacing:2px;}
.sub{color:#6b5a45;font-size:14px;}
.btn-primary{background:var(--brand-dark);color:var(--brand-gold-light);border:none;padding:16px 24px;border-radius:10px;font-size:18px;font-weight:700;cursor:pointer;width:100%;margin-top:12px;}
.btn-primary:disabled{background:#c4b7a4;color:#fff;cursor:not-allowed;}
.btn-complete{background:#12b76a;color:#fff;}
.btn-secondary{background:#fff;color:var(--brand-dark);border:1px solid var(--brand-dark);padding:12px 20px;border-radius:10px;font-size:15px;font-weight:600;cursor:pointer;margin-top:10px;width:100%;}
.history{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:16px;}
.hist-item{background:#f5efe1;border-radius:6px;padding:6px 12px;font-size:13px;color:var(--brand-text-soft);}
.waiting-row{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#f5efe1;border-radius:8px;padding:8px 10px;margin-top:6px;font-size:13px;color:var(--brand-text-soft);}
.waiting-actions{display:flex;gap:6px;align-items:center;flex-shrink:0;}
.transfer-select{font-size:12px;padding:5px 6px;border-radius:6px;border:1px solid var(--brand-border);background:#fff;color:var(--brand-dark);}
.btn-mini-delete{font-size:12px;padding:5px 10px;border-radius:6px;border:1px solid #b42318;background:#fff;color:#b42318;cursor:pointer;white-space:nowrap;}
.waiting-badge{display:inline-block;background:#fee4e2;color:#b42318;padding:4px 12px;border-radius:999px;font-size:13px;font-weight:600;margin-top:8px;}
.waiting-badge.win{background:#d1fadf;color:#067647;}
.err{color:#b42318;font-size:13px;margin-top:8px;}
.logo-top{max-height:64px;max-width:220px;object-fit:contain;display:block;margin:0 auto 16px;}
.logo-preview{max-height:60px;max-width:200px;object-fit:contain;display:block;margin:0 auto 10px;}
.settings-box{margin-top:20px;padding-top:20px;border-top:1px solid var(--brand-border);text-align:left;}

/* Chọn phòng */
.room-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:16px;}
.room-btn{background:#fff;border:1.5px solid var(--brand-border);border-radius:12px;padding:18px 8px;font-size:15px;font-weight:700;color:var(--brand-dark);cursor:pointer;}
.room-btn:hover{border-color:var(--brand-dark);}

/* Tab (trang nhân viên) */
.tabbar{display:flex;gap:8px;margin-bottom:16px;}
.tabbtn{flex:1;padding:10px 8px;border:1px solid var(--brand-border);background:#fffaf3;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;color:var(--brand-text-soft);}
.tabbtn.active{background:var(--brand-dark);color:var(--brand-gold-light);border-color:var(--brand-dark);}

/* Màn hình hiển thị */
.display-wrap{background:var(--brand-darker);border-radius:20px;padding:36px 24px;text-align:center;color:var(--brand-cream);}
.display-logo{max-height:64px;max-width:220px;object-fit:contain;margin-bottom:20px;}
.room-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.room-col{background:rgba(255,255,255,0.05);border:1px solid rgba(232,199,102,0.2);border-radius:16px;padding:20px 10px;}
.room-col.busy{border-color:var(--brand-gold-light);background:rgba(232,199,102,0.08);}
.room-status{display:inline-block;font-size:12px;font-weight:700;padding:4px 12px;border-radius:999px;margin:8px 0;letter-spacing:0.5px;}
.room-status.busy{background:#f9d0ce;color:#7a1c14;}
.room-status.idle{background:#c7f2d9;color:#0a4a2f;}
.room-col-name{font-size:14px;color:var(--brand-gold-light);text-transform:uppercase;letter-spacing:2px;font-weight:600;margin-bottom:8px;}
.room-col-num{font-size:44px;font-weight:800;color:var(--brand-cream);margin:6px 0;}
.room-col-sub{font-size:12px;color:#c9b896;}
.qr-card{margin-top:32px;background:#fff;border-radius:20px;padding:24px 28px;display:inline-block;}
.qr-card .qr-title{color:var(--brand-dark);font-size:14px;margin-bottom:12px;font-weight:600;}
.qr-card .qr-url{font-size:12px;color:var(--brand-text-muted);margin-top:10px;word-break:break-all;max-width:220px;}
