:root{--bg:#e9ece9;--panel:#fff;--soft:#f0f2ef;--line:rgba(10,10,10,.12);--text:#0a0a0a;--muted:#6f746f;--accent:#f4511e;--green:#08806b;--blue:#2764ff;font-family:var(--jw-font-sans,"Geist Variable",Inter,system-ui,sans-serif)}*{box-sizing:border-box}html,body,#app{min-height:100%;margin:0}body{background:var(--bg);color:var(--text);overscroll-behavior:none;touch-action:manipulation}button{font:inherit}.topbar{height:76px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 24px;background:transparent;border-bottom:1px solid transparent;color:#fff;transition:background .3s,border-color .3s,backdrop-filter .3s;pointer-events:none}.topbar.is-scrolled{background:rgba(10,10,10,.86);border-bottom-color:rgba(255,255,255,.09);backdrop-filter:blur(8px)}.topbar>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:10px}.brand [data-logo]{width:34px;height:34px}.brand b{font-size:16px;font-weight:900}.brand small,.merchant small{color:#979d99;font-size:16px;text-transform:none;letter-spacing:0}.brand small{display:inline;font-weight:900}.brand small:before{content:"·";color:#979d99;margin:0 9px}.brand b,.merchant strong,.merchant small{display:block}.merchant{text-align:center}.merchant strong{font-family:var(--jw-font-display,"Syne Variable");font-size:21px}.connection{justify-self:end;display:grid;grid-template-columns:auto auto;align-items:center;gap:6px;text-align:right}.connection i{width:9px;height:9px;border-radius:50%;background:#18b397;box-shadow:0 0 0 5px rgba(24,179,151,.15)}.connection span{font-size:11px;font-weight:850}.connection time{grid-column:1/-1;color:#979d99;font-size:9px}.connection.offline i{background:#e05b43}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:12px 14px 8px}.stats article{display:flex;align-items:center;justify-content:space-between;min-height:66px;padding:10px 15px;border:1px solid var(--line);border-radius:15px;background:var(--panel)}.stats span{color:var(--muted);font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}.stats strong{font-size:30px}.tabs{display:flex;gap:8px;padding:4px 14px 12px}.tabs button{min-height:46px;padding:0 18px;border:1px solid var(--line);border-radius:13px;background:var(--panel);color:var(--muted);font-weight:850}.tabs button.active{background:var(--text);color:#fff}.tabs span{display:inline-grid;place-items:center;min-width:22px;height:22px;margin-left:7px;border-radius:99px;background:var(--soft);color:var(--text);font-size:10px}.tabs small{margin-left:4px;color:var(--accent)}.board{display:none;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px;padding:0 14px 18px}.board.active{display:grid}.ticket,.payment-ticket{min-height:260px;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:20px;background:var(--panel);overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.05)}.ticket>header{display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:10px;padding:14px;border-bottom:1px solid var(--line)}.table{width:52px;height:52px;display:grid;place-items:center;border-radius:14px;background:var(--text);color:#fff;font-size:20px;font-weight:900}.ticket header small,.ticket header strong{display:block}.ticket header small{color:var(--muted);font-size:9px;text-transform:uppercase}.ticket header strong{font-size:24px}.ticket header time{color:var(--muted);font-size:12px;font-weight:800}.ticket-body{flex:1;padding:16px}.ticket-body p{margin:0;font-size:20px;font-weight:800;line-height:1.28}.ticket-body small{display:block;margin-top:12px;color:var(--muted)}.ticket>footer{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--soft)}.status{color:var(--muted);font-size:10px;font-weight:900;text-transform:uppercase}.ticket footer button,.payment-ticket button{min-height:56px;margin-left:auto;padding:0 18px;border:0;border-radius:13px;background:var(--accent);color:#fff;font-weight:900}.ticket footer button b{margin-left:12px}.status-accepted{border-color:rgba(39,100,255,.35)}.status-accepted .table{background:var(--blue)}.status-accepted footer button{background:var(--blue)}.status-delivered{border-color:rgba(8,128,107,.4)}.status-delivered .table{background:var(--green)}.status-delivered footer button{background:var(--green)}.payment-ticket{padding:18px}.payment-ticket header{display:flex;gap:12px;align-items:center}.payment-ticket header>span{width:54px;height:54px;display:grid;place-items:center;border-radius:15px;background:#fff2c7;font-size:26px}.payment-ticket small,.payment-ticket strong{display:block}.payment-ticket strong{font-size:24px}.payment-ticket p{color:var(--muted)}.payment-ticket button{width:100%;margin:auto 0 0;background:var(--green)}.pending{margin-top:auto;padding:18px;border-radius:13px;background:var(--soft);color:var(--muted)}.empty{grid-column:1/-1;min-height:330px;display:grid;place-content:center;text-align:center;border:2px dashed #c8ccc8;border-radius:22px;color:var(--muted)}.empty>span{font-size:48px}.empty h2{margin:12px 0 5px;font-family:var(--jw-font-display,"Syne Variable");font-size:32px;color:var(--text)}.empty p{margin:0}.toast{position:fixed;left:50%;bottom:24px;z-index:20;transform:translate(-50%,20px);padding:14px 20px;border-radius:13px;background:var(--text);color:#fff;font-weight:850;opacity:0;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}.pos-loading,.pos-error{min-height:100vh;display:grid;place-content:center;text-align:center}.pos-loading>span,.pos-error>span{font-size:65px}.pos-error h1{max-width:700px;font-family:var(--jw-font-display,"Syne Variable");font-size:60px;line-height:.9;margin:15px}.pos-loading p,.pos-error small{color:var(--muted)}@media(max-width:700px){.topbar{grid-template-columns:1fr auto;padding:0 14px}.merchant{display:none}.brand small{display:none}.stats{grid-template-columns:repeat(2,1fr)}.tabs{overflow:auto}.tabs button{flex:1;min-width:110px}.board{grid-template-columns:1fr}.ticket{min-height:240px}}@media(min-width:701px) and (max-width:1100px){.board{grid-template-columns:repeat(2,1fr)}.ticket-body p{font-size:18px}}@media(orientation:landscape) and (max-height:700px){.topbar{height:62px}.stats article{min-height:54px}.stats strong{font-size:25px}.ticket{min-height:225px}.empty{min-height:250px}}
body{padding-top:76px}
@media(max-width:700px){body{padding-top:64px}}
