:root{--bg:#f3f4f2;--panel:#fff;--ink:#1f2a30;--muted:#66727a;--line:#dde2e0;--brand:#0f5c63;--brand2:#13808a;--accent:#c98a2b;
--ok:#1f7a4d;--okbg:#e5f4ec;--err:#a8322d;--errbg:#fbe9e7;--warn:#8a5a00;--warnbg:#fff4dc;--hd:#1e2b31}
*{box-sizing:border-box}html,body{margin:0}body{font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--brand2);text-decoration:none}a:hover{text-decoration:underline}
.top{background:var(--hd);color:#fff;display:flex;align-items:center;gap:16px;padding:0 16px;height:46px}
.top .logo{font-weight:700;letter-spacing:.3px;display:flex;align-items:center;gap:8px}
.top .logo i{display:inline-block;width:22px;height:22px;border-radius:5px;background:linear-gradient(135deg,var(--brand2),var(--accent))}
.top .prop{opacity:.9}.top .biz{margin-left:auto;background:#2d3e46;padding:4px 10px;border-radius:4px;font-size:13px}
.top .who{font-size:13px;opacity:.85}.top form{margin:0}.top button{background:none;border:1px solid #4b5d66;color:#fff;padding:3px 9px;border-radius:4px;cursor:pointer}
nav.menu{background:var(--brand);display:flex;flex-wrap:wrap;padding:0 8px}
nav.menu .dd{position:relative}nav.menu .dd>span,nav.menu>a{display:block;color:#e8f4f4;padding:9px 14px;cursor:pointer;font-weight:500}
nav.menu .dd:hover>span,nav.menu>a:hover{background:var(--brand2);text-decoration:none}
nav.menu .dd .items{display:none;position:absolute;z-index:20;top:100%;left:0;background:#fff;min-width:220px;box-shadow:0 8px 24px rgba(0,0,0,.15);border-radius:0 0 6px 6px;padding:6px 0}
nav.menu .dd:hover .items{display:block}nav.menu .items a{display:block;padding:7px 16px;color:var(--ink)}nav.menu .items a:hover{background:#eef5f5;text-decoration:none}
main{padding:18px 20px;max-width:1500px;margin:0 auto}
h1{font-size:21px;margin:0 0 14px;font-weight:600}h2{font-size:16px;margin:0 0 10px}h3{font-size:14px;margin:0 0 8px}
.crumb{color:var(--muted);font-size:12px;margin-bottom:4px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:14px 16px;margin-bottom:16px}
.grid{display:grid;gap:16px}.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:900px){.g2,.g3,.g4{grid-template-columns:1fr}}
.kpi{background:#fff;border:1px solid var(--line);border-radius:6px;padding:12px 14px}.kpi b{display:block;font-size:24px;font-weight:600}.kpi span{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.4px}
table{width:100%;border-collapse:collapse;background:#fff}th,td{text-align:left;padding:7px 9px;border-bottom:1px solid var(--line);vertical-align:top}
th{background:#f0f3f2;font-weight:600;font-size:12px;color:#44515a;text-transform:uppercase;letter-spacing:.3px}
tr:hover td{background:#fafcfb}td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
tfoot td{font-weight:700;background:#f7f9f8}
.badge{display:inline-block;padding:1px 7px;border-radius:10px;font-size:11px;font-weight:600;background:#e7ecea;color:#3c4a50}
.b-RESERVED{background:#e6eefb;color:#1d4f9a}.b-CHECKED_IN{background:var(--okbg);color:var(--ok)}.b-CHECKED_OUT{background:#ececec;color:#555}
.b-CANCELLED,.b-NO_SHOW,.b-VOIDED,.b-VOID{background:var(--errbg);color:var(--err)}.b-ISSUED,.b-PAID{background:var(--okbg);color:var(--ok)}
.b-OPEN{background:var(--warnbg);color:var(--warn)}.b-ROOM_CHARGED{background:#e6eefb;color:#1d4f9a}.b-PORTAL{background:#f3e8fb;color:#6b2d9a}
.hk{display:inline-block;min-width:34px;text-align:center;padding:2px 6px;border-radius:4px;font-weight:700;font-size:12px}
.hk-CL{background:#d9f2e4;color:#1f7a4d}.hk-IP{background:#cde7f7;color:#1b5f8c}.hk-DI{background:#fbe2d5;color:#a24a1a}.hk-PU{background:#fff0c2;color:#7a5a00}.hk-OOO,.hk-OOS{background:#3a3a3a;color:#fff}
form.inline{display:inline}label{display:block;font-size:12px;color:var(--muted);margin:0 0 3px;font-weight:500}
input,select,textarea{font:inherit;padding:6px 8px;border:1px solid #c7cfcc;border-radius:4px;background:#fff;width:100%}
textarea{min-height:60px}input[type=checkbox]{width:auto;vertical-align:middle}
.fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px 14px;margin-bottom:12px}
.fields .wide{grid-column:1/-1}
.btn{display:inline-block;background:var(--brand2);color:#fff;border:0;padding:7px 14px;border-radius:4px;cursor:pointer;font-weight:600;font-size:13px;width:auto}
.btn:hover{filter:brightness(1.08);text-decoration:none}.btn.sec{background:#e3e9e7;color:var(--ink)}.btn.warn{background:var(--accent)}.btn.danger{background:var(--err)}.btn.sm{padding:3px 9px;font-size:12px}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.right{margin-left:auto}.muted{color:var(--muted)}.small{font-size:12px}
.flash{padding:9px 13px;border-radius:5px;margin-bottom:12px}.flash.ok{background:var(--okbg);color:var(--ok)}.flash.err{background:var(--errbg);color:var(--err)}
.tabs{display:flex;gap:4px;border-bottom:2px solid var(--line);margin-bottom:14px}.tabs a{padding:7px 14px;border-radius:5px 5px 0 0;color:var(--muted);font-weight:600}
.tabs a.on{background:#fff;color:var(--brand);border:1px solid var(--line);border-bottom:2px solid #fff;margin-bottom:-2px}
.dl{display:grid;grid-template-columns:140px 1fr;gap:4px 10px}.dl dt{color:var(--muted);font-size:12px}.dl dd{margin:0;font-weight:500}
.avail td{text-align:center;font-variant-numeric:tabular-nums}.avail .low{background:#fff4dc}.avail .zero{background:#fbe9e7;color:var(--err);font-weight:700}
.bar{height:8px;background:#e3e9e7;border-radius:4px;overflow:hidden}.bar i{display:block;height:100%;background:var(--brand2)}
.rooms{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.room{background:#fff;border:1px solid var(--line);border-left:5px solid #ccc;border-radius:5px;padding:8px 10px}
.room.occ{border-left-color:var(--brand2)}.room .no{font-size:17px;font-weight:700}.room select{padding:3px;font-size:12px}
.menu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.menu-grid button{background:#fff;border:1px solid var(--line);border-radius:6px;padding:10px;text-align:left;cursor:pointer;font:inherit}
.menu-grid button:hover{border-color:var(--brand2);background:#f2f9f9}.menu-grid b{display:block;font-size:13px}
.login{max-width:380px;margin:9vh auto}.login .panel{padding:26px}
.doc{background:#fff;max-width:420px;margin:0 auto;padding:20px 22px;border:1px solid var(--line);font:13px/1.4 "SF Mono",Menlo,Consolas,monospace}
.doc h2{text-align:center;font-size:15px;margin:4px 0}.doc .c{text-align:center}.doc table{font:inherit}.doc td,.doc th{padding:2px 0;border:0;background:none}
.doc hr{border:0;border-top:1px dashed #999;margin:8px 0}
@media print{.top,nav.menu,.noprint,.flash{display:none!important}main{padding:0}.doc{border:0}body{background:#fff}}
/* dashboard tiles */
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.tile{background:#fff;border:1px solid var(--line);border-radius:6px;padding:12px 14px;min-width:0}
.tile.w2{grid-column:span 2}.tile.w4{grid-column:1/-1}.tile h3{text-align:center;font-weight:500;font-size:15px;margin:0 0 2px}.tile .sub{text-align:center;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}
@media(max-width:1100px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.tiles{grid-template-columns:1fr}.tile.w2{grid-column:auto}}
.proj{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0}.proj .h{text-align:center;font-weight:600;font-size:12px;margin-bottom:4px}
.proj .box{border-radius:5px;color:#fff;padding:6px 9px;font-size:12px}.proj .box div{display:flex;justify-content:space-between}.proj .box b{font-size:17px}
.c-ind{background:#f39c12}.c-blk{background:#16a085}.c-occ{background:#8e5aa8}
.big-circle{width:96px;height:96px;border-radius:50%;background:#16a085;color:#fff;display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:700;margin:10px auto}
.stat{display:inline-block;text-align:center;background:#f3f6f5;border-radius:6px;padding:8px 14px;margin:4px}.stat b{display:block;font-size:24px;color:var(--brand)}.stat span{font-size:11px;color:var(--muted)}
.rsum{display:grid;grid-template-columns:minmax(0,3fr) minmax(170px,1.3fr);gap:10px}.rbox{background:#e8f3f4;border-radius:5px;padding:10px;font-size:12px}.rbox .g{display:grid;grid-template-columns:1fr 1fr;gap:6px}.rbox small{display:block;color:var(--muted)}
.scroll{max-height:240px;overflow:auto}
/* OPERA-style reservation header */
.rhead{display:flex;gap:16px;align-items:center}.avatar{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--brand2),#5bb0b6);color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;flex:none}
.rhead .nm{font-size:20px;color:var(--brand2)}.strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;margin:12px 0}
.strip small,.cols small{display:block;color:var(--muted);font-size:11px}.strip b{font-size:15px}.cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.cols>div{border-right:1px solid var(--line);padding-right:12px}.cols>div:last-child{border:0}
.cols .f{margin-bottom:10px}.cols .f b{display:block}.teal{color:var(--brand2)}.hl{background:#fdf9d8;padding:8px;border-radius:4px}.gray{background:#eceeed;padding:8px;border-radius:4px}
@media(max-width:900px){.strip{grid-template-columns:repeat(2,1fr)}.cols{grid-template-columns:1fr 1fr}}
.iwant{position:relative;display:inline-block}.iwant .menu2{display:none;position:absolute;right:0;top:100%;background:#fff;border:1px solid var(--line);box-shadow:0 8px 20px rgba(0,0,0,.15);border-radius:6px;min-width:220px;z-index:30;padding:6px 0}
.iwant:focus-within .menu2,.iwant:hover .menu2{display:block}.iwant .menu2 a,.iwant .menu2 button{display:block;width:100%;text-align:left;background:none;border:0;padding:7px 14px;color:var(--ink);font:inherit;cursor:pointer}.iwant .menu2 a:hover,.iwant .menu2 button:hover{background:#eef5f5;text-decoration:none}
.b-APPROVED,.b-POSTED,.b-REGULAR{background:var(--okbg);color:var(--ok)}.b-PENDING,.b-DRAFT{background:var(--warnbg);color:var(--warn)}.b-REJECTED{background:var(--errbg);color:var(--err)}