:root{--bg:#12091f;--panel:#1d1230;--panel2:#271a40;--line:#3a2a5c;--text:#f1ebfa;--muted:#a89cc4;--gold:#e0b44c;--gold2:#b8892a;--red:#e5534b;--green:#3fb67a;--blue:#4c8fe0;--orange:#e08a3c}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;min-height:100vh}
a{color:var(--gold);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3{margin:.2em 0 .5em;font-weight:600}h1{font-size:1.5rem}h2{font-size:1.2rem}h3{font-size:1rem;color:var(--gold)}
.muted{color:var(--muted)}.center{text-align:center}.small{font-size:.85rem}.right{text-align:right}
header.top{position:sticky;top:0;z-index:20;background:#0c0615;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:.6rem;padding:.5rem .8rem;padding-top:max(.5rem,env(safe-area-inset-top))}
header.top .brand{font-weight:700;color:var(--gold);letter-spacing:.04em;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#menuBtn{display:none}
nav.side{width:210px;flex:none;background:var(--panel);border-right:1px solid var(--line);padding:.6rem;min-height:calc(100vh - 52px)}
nav.side a{display:block;padding:.6rem .8rem;border-radius:8px;color:var(--text)}
nav.side a.on,nav.side a:hover{background:var(--panel2);color:var(--gold);text-decoration:none}
.layout{display:flex}
main{flex:1;min-width:0;padding:1rem;max-width:1200px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:1rem;margin-bottom:1rem}
.grid{display:grid;gap:1rem}.g2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.g4{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.stat{text-align:center}.stat b{display:block;font-size:1.8rem;color:var(--gold)}
label{display:block;font-size:.85rem;color:var(--muted);margin:.6rem 0 .2rem}
input,select,textarea,button{font:inherit}
input[type=text],input[type=password],input[type=email],input[type=date],input[type=number],input[type=tel],input[type=search],select,textarea{width:100%;background:#0f0819;color:var(--text);border:1px solid var(--line);border-radius:8px;padding:.6rem .7rem;min-height:44px}
textarea{min-height:80px;resize:vertical}
input:focus,select:focus,textarea:focus,button:focus-visible{outline:2px solid var(--gold);outline-offset:1px}
.chk{display:flex;align-items:center;gap:.5rem;color:var(--text);font-size:1rem;margin:.3rem 0}.chk input{width:22px;height:22px;accent-color:var(--gold)}
button,.btn{background:var(--gold);color:#1b1000;border:0;border-radius:8px;padding:.6rem 1rem;min-height:44px;font-weight:600;cursor:pointer;display:inline-block}
button.sec,.btn.sec{background:var(--panel2);color:var(--text);border:1px solid var(--line)}
button.danger{background:var(--red);color:#fff}button.ok{background:var(--green);color:#04170d}
button.sm{min-height:34px;padding:.25rem .6rem;font-size:.85rem}
button:disabled{opacity:.5}
.row{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}.row>*{flex:0 0 auto}.row .grow{flex:1 1 200px}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0 1rem}
table{width:100%;border-collapse:collapse}th,td{padding:.5rem .4rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{color:var(--muted);font-weight:500;font-size:.8rem;text-transform:uppercase}
.tablewrap{overflow-x:auto}
.badge{display:inline-block;padding:.1rem .6rem;border-radius:99px;font-size:.78rem;font-weight:600;background:var(--panel2);border:1px solid var(--line)}
.b-available,.b-active,.b-delivered,.b-checked_out{color:var(--green);border-color:var(--green)}
.b-occupied,.b-checked_in,.b-preparing,.b-vip{color:var(--blue);border-color:var(--blue)}
.b-out_of_service,.b-banned,.b-cancelled,.b-no_show,.b-disabled{color:var(--red);border-color:var(--red)}
.b-maintenance,.b-watch,.b-ordered,.b-booked{color:var(--orange);border-color:var(--orange)}
.chip{display:inline-block;background:var(--panel2);border:1px solid var(--line);border-radius:99px;padding:.1rem .6rem;margin:.15rem .2rem .15rem 0;font-size:.82rem}
.roomgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.7rem}
.room{display:block;background:var(--panel2);border:1px solid var(--line);border-left:6px solid var(--green);border-radius:10px;padding:.6rem;color:var(--text)}
.room:hover{text-decoration:none;border-color:var(--gold)}
.room.occupied{border-left-color:var(--blue)}.room.out_of_service{border-left-color:var(--red)}.room.maintenance{border-left-color:var(--orange)}
.room b{font-size:1.3rem}
.err{color:#ff8b85;min-height:1.3em}
#toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:#000;border:1px solid var(--gold);padding:.6rem 1rem;border-radius:10px;opacity:0;pointer-events:none;transition:opacity .25s;z-index:99;max-width:92vw}
#toast.show{opacity:1}#toast.bad{border-color:var(--red);color:#ffb3ae}
dialog{background:var(--panel);color:var(--text);border:1px solid var(--gold);border-radius:14px;padding:1rem;width:min(560px,94vw);max-height:92vh;overflow:auto}
dialog::backdrop{background:rgba(0,0,0,.7)}
.login{max-width:420px;margin:8vh auto;padding:0 1rem}
.couponcode{background:#fff;color:#000;border-radius:12px;padding:1rem;text-align:center}
.couponcode svg{max-width:100%;height:auto}
.alert{background:#3a1a1a;border:1px solid var(--red);border-radius:8px;padding:.5rem .7rem;margin:.4rem 0}
.warn{background:#3a2a10;border:1px solid var(--orange);border-radius:8px;padding:.5rem .7rem;margin:.4rem 0}
video#cam{width:100%;max-height:50vh;background:#000;border-radius:10px}
pre.code{background:#0a0512;border:1px solid var(--line);padding:.7rem;border-radius:8px;overflow:auto;font-size:.8rem}
@media (max-width:800px){
 #menuBtn{display:inline-block}
 nav.side{position:fixed;left:0;top:52px;bottom:0;z-index:30;transform:translateX(-105%);transition:transform .2s;overflow:auto}
 nav.side.open{transform:none}
 main{padding:.7rem}
 th.hide-s,td.hide-s{display:none}
}
@media print{header.top,nav.side,button{display:none!important}body{background:#fff;color:#000}.card{border-color:#999;background:#fff}}