:root{--ground: #f1f3ef;--surface: #ffffff;--surface-2: #e9ece6;--ink: #15201d;--ink-2: #3c4844;--muted: #6b7873;--line: #d4dbd2;--line-strong: #b3bdb3;--baize: #0b5e44;--baize-ink: #ffffff;--baize-soft: #dcede4;--blue: #1f5c8b;--blue-soft: #e1ebf4;--warn: #9a6a00;--warn-soft: #f9efd6;--crit: #ae2a1f;--crit-soft: #f8e4e1;--radius: 12px;color-scheme:light}@media (prefers-color-scheme: dark){:root{--ground: #0f1513;--surface: #182120;--surface-2: #212b29;--ink: #e9efeb;--ink-2: #c3cec9;--muted: #8d9b95;--line: #2c3a36;--line-strong: #41504b;--baize: #2f9d74;--baize-ink: #06120d;--baize-soft: #133026;--blue: #79b2dc;--blue-soft: #16303f;--warn: #d8a83c;--warn-soft: #2f2711;--crit: #e08a7e;--crit-soft: #3a1c18;color-scheme:dark}}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{margin:0;background:var(--ground);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.4;-webkit-font-smoothing:antialiased;overscroll-behavior:none}button{font:inherit;color:inherit;cursor:pointer}input,select{font:inherit;color:inherit}.app{display:flex;flex-direction:column;height:100%}.topbar{display:flex;align-items:center;gap:12px;padding:11px 16px;padding-top:calc(11px + env(safe-area-inset-top,0px));background:var(--baize);color:var(--baize-ink);flex:none}.topbar h1{font-size:1.05rem;margin:0;font-weight:700;letter-spacing:.01em}.topbar .spacer{flex:1}.topbar .stat{text-align:right;line-height:1.15}.topbar .stat .k{font-size:.62rem;text-transform:uppercase;letter-spacing:.09em;opacity:.72}.topbar .stat .v{font-size:1rem;font-weight:700;font-variant-numeric:tabular-nums}.iconbtn{background:#ffffff26;border:0;color:inherit;width:42px;height:42px;border-radius:10px;font-size:1.15rem;display:grid;place-items:center;flex:none}.iconbtn:active{background:#ffffff4d}.iconbtn.plain{background:var(--surface-2);color:var(--ink)}.chiprow{display:flex;gap:7px;padding:11px 16px 3px;overflow-x:auto;scrollbar-width:none;flex:none}.chiprow::-webkit-scrollbar{display:none}.chiprow.sub{padding-top:7px;padding-bottom:8px}.chip{border:1px solid var(--line-strong);background:var(--surface);color:var(--muted);border-radius:99px;padding:9px 15px;font-size:.9rem;font-weight:650;white-space:nowrap}.chip .n{opacity:.6;margin-left:5px;font-variant-numeric:tabular-nums;font-weight:500}.chip.on{background:var(--baize);border-color:var(--baize);color:var(--baize-ink)}.chiprow.sub .chip{padding:11px 14px;font-size:.82rem;border-radius:8px;min-height:44px}.chiprow.sub .chip.on{background:var(--surface);color:var(--ink);border-color:var(--ink)}.body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:8px 16px 20px}.cards{display:flex;flex-direction:column;gap:9px}.tcard{width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);display:flex;align-items:center;gap:12px;padding:15px 16px;min-height:58px}.tcard .name{font-size:1.05rem;font-weight:750;letter-spacing:.01em;color:var(--ink)}.tcard .free-tag{margin-left:auto;font-size:.82rem;color:var(--muted);font-weight:600}.tcard.busy{flex-direction:column;align-items:stretch;gap:0;border-left:5px solid var(--baize);padding:14px 16px 15px}.tcard.busy.soon{border-left-color:var(--warn)}.tcard.busy.paused{border-left-color:var(--muted)}.tcard .top{display:flex;align-items:baseline;gap:9px}.tcard .sub{font-size:.84rem;color:var(--muted);margin-top:3px;font-variant-numeric:tabular-nums}.badge{font-size:.63rem;font-weight:750;letter-spacing:.07em;text-transform:uppercase;padding:3px 7px;border-radius:5px;background:var(--baize-soft);color:var(--baize);flex:none;white-space:nowrap;display:inline-block;vertical-align:middle}.top>.badge{margin-left:auto}.badge.warn{background:var(--warn-soft);color:var(--warn)}.badge.mute{background:var(--surface-2);color:var(--muted)}.prog{margin:11px 0 9px}.prog-track{height:7px;border-radius:99px;background:var(--surface-2);overflow:hidden}.prog-fill{height:100%;background:var(--baize);border-radius:99px;transition:width .25s linear}.prog.soon .prog-fill{background:var(--warn)}.prog.paused .prog-fill{background:var(--muted)}.prog-cap{display:flex;justify-content:space-between;font-size:.76rem;color:var(--muted);margin-top:5px;font-variant-numeric:tabular-nums}.prog.soon .prog-cap .right{color:var(--warn);font-weight:700}.tcard .foot{display:flex;align-items:flex-end;gap:10px}.tcard .money{font-size:1.42rem;font-weight:800;font-variant-numeric:tabular-nums;line-height:1}.tcard .money-sub{font-size:.78rem;color:var(--muted);margin-left:auto;text-align:right;line-height:1.3}.gridcells{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}.cell{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px;min-height:60px;display:flex;flex-direction:column;justify-content:center;text-align:left;gap:3px}.cell.busy{justify-content:space-between;min-height:68px}.cell .name{font-weight:700;font-size:.93rem;color:var(--ink)}.cell .money{font-size:.95rem;font-weight:800;font-variant-numeric:tabular-nums;color:var(--baize)}.cell.busy{border-color:var(--baize);border-left-width:4px;background:var(--baize-soft)}.gridcells{grid-template-columns:repeat(auto-fill,minmax(98px,1fr))}.cell.free .name{color:var(--muted);font-weight:600}.cell .dot{width:7px;height:7px;border-radius:99px;background:var(--baize)}.empty{color:var(--muted);text-align:center;padding:44px 12px;font-size:.95rem}.empty b{display:block;color:var(--ink);font-size:1.02rem;margin-bottom:5px}.rows{display:flex;flex-direction:column;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.row{background:var(--surface);padding:12px 14px;display:flex;align-items:center;gap:11px;width:100%;text-align:left;border:0}.row .grow{flex:1;min-width:0}button.grow{min-height:44px;display:flex;flex-direction:column;justify-content:center}.row .t{font-weight:650;font-size:.97rem}.row .s{font-size:.79rem;color:var(--muted);font-variant-numeric:tabular-nums;margin-top:2px}.row .amt{font-weight:750;font-variant-numeric:tabular-nums;white-space:nowrap}.row.timed{background:var(--baize-soft)}.row.voided .t,.row.voided .amt{text-decoration:line-through;opacity:.5}.row .mini{display:flex;gap:4px;flex:none}.row .mini button{width:44px;height:44px;border-radius:7px;border:1px solid var(--line-strong);background:var(--surface-2);display:grid;place-items:center;font-size:.9rem}.row .mini button:disabled{opacity:.3}.qty{display:flex;align-items:center;gap:2px;flex:none}.qty button{width:44px;height:44px;border-radius:9px;border:1px solid var(--line-strong);background:var(--surface-2);font-size:1.15rem;display:grid;place-items:center}.qty span{min-width:32px;text-align:center;font-weight:750;font-variant-numeric:tabular-nums}.btn{border:1px solid var(--line-strong);background:var(--surface);border-radius:var(--radius);padding:13px 16px;font-weight:700;font-size:.96rem;display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;width:100%}.footbar .btn,.row .btn,.sheet-head .btn{width:auto;flex:none}.btn:active{transform:translateY(1px)}.btn.primary{background:var(--baize);border-color:var(--baize);color:var(--baize-ink)}.btn.warn{background:var(--warn-soft);border-color:var(--warn);color:var(--warn)}.btn.danger{background:var(--crit-soft);border-color:var(--crit);color:var(--crit)}.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}.btn:disabled{opacity:.42}.btnrow{display:flex;gap:9px;margin:12px 0;flex-wrap:wrap}.btnrow>*{flex:1 1 130px;width:auto}.nav{display:flex;background:var(--surface);border-top:1px solid var(--line);flex:none;padding-bottom:env(safe-area-inset-bottom,0px)}.nav button{flex:1;background:none;border:0;padding:9px 4px 8px;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--muted);font-size:.7rem;font-weight:650;min-height:54px}.nav button .ic{display:grid;place-items:center;height:22px}.nav button .ic svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.nav button.on{color:var(--baize)}.nav button.on .ic{transform:translateY(-1px)}.footbar{background:var(--surface);border-top:1px solid var(--line);padding:12px 16px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:12px;flex:none}.footbar .total{flex:1;min-width:0}.footbar .total .k{font-size:.73rem;color:var(--muted)}.footbar .total .v{font-size:1.45rem;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.15}.sec{margin:22px 0 8px;min-height:44px;font-size:.72rem;font-weight:750;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:8px}.sec .line{flex:1;height:1px;background:var(--line)}.sheet-bg{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;z-index:50;display:flex;align-items:flex-end}.sheet{background:var(--ground);width:100%;max-height:92%;border-radius:18px 18px 0 0;display:flex;flex-direction:column;overflow:hidden}.sheet-head{display:flex;align-items:center;gap:11px;padding:14px 16px;border-bottom:1px solid var(--line);flex:none}.sheet-head h2{margin:0;font-size:1.04rem;flex:1}.sheet-body{overflow-y:auto;padding:13px 16px calc(22px + env(safe-area-inset-bottom,0px))}.field{display:flex;flex-direction:column;gap:5px;margin-bottom:13px}.field label{font-size:.76rem;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em}.field input,.field select{border:1px solid var(--line-strong);background:var(--surface);border-radius:9px;padding:12px 13px;font-size:1rem;min-height:48px;width:100%}.hint{font-size:.83rem;color:var(--muted);margin:7px 0 0}.hint.warn{color:var(--warn)}.rtable{width:100%;border-collapse:collapse;font-size:.89rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.rtable th{text-align:left;font-size:.67rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line-strong)}.rtable td{padding:10px 12px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}.rtable tr:last-child td{border-bottom:0}.rtable td.r,.rtable th.r{text-align:right}.scroll-x{overflow-x:auto}.kpis{display:grid;gap:9px;grid-template-columns:repeat(auto-fit,minmax(138px,1fr));margin-bottom:14px}.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:13px 15px}.kpi .k{font-size:.69rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}.kpi .v{font-size:1.34rem;font-weight:800;font-variant-numeric:tabular-nums;margin-top:4px}.kpi.hi{background:var(--baize);border-color:var(--baize);color:var(--baize-ink)}.kpi.hi .k{color:inherit;opacity:.78}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}.qrbox{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;display:flex;flex-direction:column;align-items:center;gap:12px}.qrimg{width:100%;max-width:260px;aspect-ratio:1;border-radius:8px;background:#fff;padding:8px;display:block}.qrskel{background:var(--surface-2)}.qrinfo{text-align:center;width:100%}.qramt{font-size:1.6rem;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.1}.qrline{font-size:.88rem;color:var(--ink-2);margin-top:4px;word-break:break-word}.qrline.muted{color:var(--muted);font-size:.82rem}@media (min-width: 720px){body{background:var(--surface-2)}.app{max-width:600px;margin:0 auto;background:var(--ground);border-inline:1px solid var(--line)}}.row.da-chon{background:var(--baize-soft)}.vua-them{color:var(--baize);font-weight:700;animation:hien-len .18s ease-out}@keyframes hien-len{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion: reduce){.vua-them{animation:none}}.da-huy{margin-top:10px}.da-huy summary{font-size:.82rem;color:var(--muted);cursor:pointer;padding:8px 2px;list-style:none;display:flex;align-items:center;gap:6px}.da-huy summary::-webkit-details-marker{display:none}.da-huy summary:before{content:"▸";font-size:.7rem}.da-huy[open] summary:before{content:"▾"}.row.tong-cuoi{background:var(--surface-2)}.row.tong-cuoi .t,.row.tong-cuoi .amt{font-size:1.06rem}.timrow{display:flex;gap:8px;padding:11px 16px 3px;flex:none}.timbox{flex:1;display:flex;align-items:center;gap:8px;min-width:0;border:1px solid var(--line-strong);background:var(--surface);border-radius:10px;padding:0 12px;min-height:48px}.timicon{color:var(--muted);font-size:1.15rem;flex:none}.timbox input{flex:1;min-width:0;border:0;background:none;outline:none;font-size:1rem;padding:12px 0;-webkit-appearance:none}.timbox input::-webkit-search-cancel-button{display:none}.timxoa{border:0;background:var(--surface-2);color:var(--muted);width:30px;height:30px;border-radius:99px;flex:none;font-size:.85rem}.monanh{width:46px;height:46px;border-radius:9px;flex:none;object-fit:cover;background:var(--surface-2)}.dangnhap{height:100%;display:flex;align-items:center;justify-content:center;padding:24px 20px;background:var(--ground)}.dn-form{width:100%;max-width:380px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:28px 22px 22px;box-shadow:0 1px 2px #0000000d,0 20px 50px -30px #0006}.dn-logo{display:flex;justify-content:center;margin-bottom:12px}.dn-form h1{margin:0;text-align:center;font-size:1.4rem;letter-spacing:-.01em}.dn-phu{text-align:center;color:var(--muted);font-size:.9rem;margin:4px 0 22px}.bangloi{position:fixed;left:12px;right:12px;z-index:90;bottom:calc(76px + env(safe-area-inset-bottom,0px));background:var(--crit);color:#fff;border-radius:10px;padding:13px 14px;display:flex;align-items:center;gap:10px;font-size:.92rem;font-weight:600;box-shadow:0 10px 30px -12px #0009}.bangloi button{background:#fff3;border:0;color:inherit;width:30px;height:30px;border-radius:99px;flex:none}@media (min-width: 720px){.bangloi{left:50%;right:auto;transform:translate(-50%);width:min(560px,92vw)}}.lech{border-radius:10px;padding:14px 16px;font-weight:800;font-size:1.1rem;text-align:center;font-variant-numeric:tabular-nums}.lech.khop{background:var(--ok-soft);color:var(--ok)}.lech.thua{background:var(--warn-soft);color:var(--warn)}.lech.thieu{background:var(--crit-soft);color:var(--crit)}
