*{box-sizing:border-box;margin:0;padding:0;}
:root{
  --red:#c0392b;--red2:#e74c3c;
  --cyan:#00bcd4;--cyan2:#00e5ff;
  --dark:#0d1117;--panel:#161b22;--card:#1e2530;--border:#2a3340;
  --gold:#f1c40f;--green:#2ecc71;--white:#ecf0f1;--muted:#7f8c8d;
  --purple:#9b59b6;--orange:#e67e22;
}
body{background:var(--dark);font-family:'Courier New',monospace;color:var(--white);min-height:100vh;overflow-x:hidden;font-weight:700;}

/* ── TOPBAR ── */
.topbar{
  background:linear-gradient(90deg,#6b0000,var(--red),#6b0000);
  padding:8px 16px;display:flex;align-items:center;justify-content:space-between;
  border-bottom:3px solid #5a0000;box-shadow:0 4px 20px #00000088;
  position:sticky;top:0;z-index:200;flex-wrap:wrap;gap:6px;
}
.store-brand{display:flex;flex-direction:column;}
.store-name{font-size:16px;font-weight:900;letter-spacing:3px;color:#fff;}
.store-sub{font-size:9px;color:#ffaaaa;letter-spacing:2px;}
.day-bar-wrap{width:140px;height:5px;background:#2a0000;border-radius:3px;margin-top:5px;overflow:hidden;}
.day-bar{height:100%;border-radius:3px;background:linear-gradient(90deg,#f1c40f,#ff8c00);transition:width 1s linear,background 1s linear;}
.topbar-mid{display:flex;flex-direction:column;align-items:center;}
.level-badge{background:#2a1a00;border:2px solid var(--gold);border-radius:8px;padding:4px 14px;text-align:center;}
.level-badge .lv-num{font-size:20px;font-weight:900;color:var(--gold);line-height:1;}
.level-badge .lv-name{font-size:9px;color:#c8a800;letter-spacing:1px;}
.xp-bar-wrap{width:120px;height:6px;background:#2a2a00;border-radius:3px;margin-top:4px;overflow:hidden;}
.xp-bar{height:100%;background:var(--gold);border-radius:3px;transition:width 0.5s ease;}
.topbar-right{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end;}
.tb-stat{text-align:center;}
.tb-stat .tv{font-size:17px;font-weight:900;color:var(--gold);}
.tb-stat .tl{font-size:9px;color:#aaa;letter-spacing:1px;}
.balance-big{font-size:22px !important;color:#00e5ff;}
.shop-toggle{width:auto;padding:9px 12px;border-radius:8px;border:2px solid;font-family:inherit;font-weight:900;font-size:11px;letter-spacing:1px;cursor:pointer;box-shadow:0 0 18px #00000055;}
.shop-toggle.open{background:#062a12;color:var(--green);border-color:var(--green);animation:shopGlowOpen 1.2s infinite;}
.shop-toggle.closed{background:#2a0606;color:var(--red2);border-color:var(--red2);animation:shopGlowClosed 1.2s infinite;}
@keyframes shopGlowOpen{0%,100%{box-shadow:0 0 8px #2ecc7144;}50%{box-shadow:0 0 22px #2ecc71aa;}}
@keyframes shopGlowClosed{0%,100%{box-shadow:0 0 8px #e74c3c44;}50%{box-shadow:0 0 22px #e74c3caa;}}

/* ── LAYOUT ── */
.game-wrap{display:grid;grid-template-columns:280px 1fr 270px;gap:10px;padding:12px;max-width:1180px;margin:0 auto;}

/* ── PANELS ── */
.panel{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px;}
.pt{font-size:10px;letter-spacing:2px;color:var(--cyan);border-bottom:1px solid var(--border);padding-bottom:6px;margin-bottom:2px;display:flex;align-items:center;justify-content:space-between;}

/* ── CUSTOMER ── */
.cust-card{background:var(--card);border:2px solid var(--border);border-radius:10px;padding:12px;display:flex;gap:10px;align-items:flex-start;transition:all 0.3s;position:relative;overflow:hidden;}
.cust-card.active{border-color:var(--cyan2);box-shadow:0 0 16px #00e5ff33;}
.cust-card.waiting{opacity:0.5;}
.cust-emoji-big{font-size:36px;flex-shrink:0;}
.cust-name{font-size:13px;font-weight:900;}
.cust-mood{font-size:10px;color:#b8c2cc;margin-top:1px;font-weight:900;}
.pay-badge{display:inline-flex;align-items:center;gap:3px;font-size:9px;font-weight:900;padding:2px 7px;border-radius:20px;margin-top:4px;}
.pb-cash{background:#1a3a00;color:var(--green);border:1px solid var(--green);}
.pb-card{background:#1a0a3a;color:var(--purple);border:1px solid var(--purple);}
.status-dot{position:absolute;top:8px;right:8px;width:7px;height:7px;border-radius:50%;}
.dot-a{background:var(--cyan2);animation:blink 1s infinite;}
.dot-w{background:var(--gold);}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:0.3;}}
.patience-bar-wrap{width:100%;height:6px;background:#1a2030;border-radius:3px;overflow:hidden;}
.patience-bar{height:100%;border-radius:3px;background:var(--green);transition:width 0.4s linear,background 0.4s linear;}

/* ── ITEM LIST ── */
.item-list{display:flex;flex-direction:column;gap:4px;max-height:200px;overflow-y:auto;}
.item-row{display:flex;justify-content:space-between;align-items:center;background:#0d1117;border:1px solid var(--border);border-radius:6px;padding:6px 9px;font-size:11px;cursor:pointer;transition:all 0.15s;}
.item-row:hover{border-color:var(--cyan);background:#00bcd411;}
.item-row.scanned{opacity:0.38;cursor:default;}
.item-row.scanned:hover{border-color:var(--border);background:#0d1117;}
.scan-tag{background:var(--cyan);color:#000;font-size:9px;font-weight:900;padding:2px 6px;border-radius:3px;}

/* ── REGISTER ── */
.reg-screen{background:#001a28;border:3px solid #005577;border-radius:10px;padding:14px 18px;text-align:center;box-shadow:inset 0 0 30px #001020,0 0 16px #00bcd422;}
.reg-total{font-size:52px;font-weight:900;color:#00e5ff;text-shadow:0 0 20px #00e5ff88;line-height:1;transition:color 0.15s;}
.reg-sub{font-size:10px;color:#005577;margin-top:3px;}
.receipt-box{background:#001015;border:1px solid #00334455;border-radius:8px;padding:8px;max-height:130px;overflow-y:auto;}
.rcp-row{display:flex;justify-content:space-between;font-size:11px;padding:2px 0;border-bottom:1px dashed #002233;}
.rcp-row .rn{color:#6abed0;}
.rcp-row .rp{color:var(--gold);font-weight:700;}
.rcp-row.tr{border-top:1px solid #005577;border-bottom:none;padding-top:6px;margin-top:3px;font-weight:900;font-size:13px;}

/* ── PAY ZONE ── */
.pay-zone{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:12px;}
.pzt{font-size:10px;color:var(--muted);margin-bottom:8px;letter-spacing:1px;}
.cash-row{display:flex;justify-content:space-between;align-items:center;padding:7px 10px;background:#0d1117;border-radius:7px;margin-bottom:5px;}
.cr-label{font-size:10px;color:var(--muted);}
.cr-val{font-size:17px;font-weight:900;}
.card-machine{background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);border:2px solid #4a4a8a;border-radius:12px;padding:14px;display:flex;flex-direction:column;align-items:center;gap:8px;}
.card-screen{background:#000a14;border:2px solid #00557788;border-radius:7px;width:100%;padding:8px 12px;text-align:center;}
.cs-status{font-size:10px;color:#00bcd4;letter-spacing:2px;margin-bottom:3px;}
.cs-amount{font-size:22px;font-weight:900;color:#00e5ff;}
.card-tap{width:100%;padding:12px;text-align:center;border:2px dashed #4a4a8a;border-radius:8px;cursor:pointer;transition:all 0.2s;font-size:12px;color:#7a7aaa;}
.card-tap.pulse{border-color:var(--purple);color:var(--purple);animation:cp 0.8s infinite;}
@keyframes cp{0%,100%{box-shadow:0 0 8px #9b59b633;}50%{box-shadow:0 0 22px #9b59b688;}}
.card-tap.success{border-color:var(--green);color:var(--green);animation:none;}
.card-tap.processing{border-color:var(--gold);color:var(--gold);animation:cp2 0.4s infinite;}
@keyframes cp2{0%,100%{opacity:1;}50%{opacity:0.4;}}
.card-btns{display:flex;gap:6px;width:100%;}
.cbtn{flex:1;padding:7px;border:1px solid;border-radius:6px;font-family:'Courier New',monospace;font-size:10px;font-weight:700;cursor:pointer;transition:all 0.15s;}
.cbtn-g{background:#0a2a1a;border-color:var(--green);color:var(--green);}
.cbtn-g:hover{background:#1a5a2a;}
.cbtn-r{background:#2a0a0a;border-color:var(--red2);color:var(--red2);}
.cbtn-r:hover{background:#5a1a1a;}
.info-box{padding:8px 10px;border-radius:7px;font-size:11px;text-align:center;margin-top:6px;}
.ib-green{background:#0a2a0a;border:1px solid var(--green);color:var(--green);}
.ib-purple{background:#0a002a;border:1px solid var(--purple);color:var(--purple);}
.ib-muted{background:#1a2030;border:1px solid var(--border);color:var(--muted);}

/* ── BUTTONS ── */
.btn{width:100%;padding:11px;font-size:13px;font-weight:900;font-family:inherit;border:none;border-radius:9px;cursor:pointer;letter-spacing:1px;transition:all 0.15s;}
.btn-green{background:var(--green);color:#000;}
.btn-green:hover{background:#27ae60;}
.btn-red{background:var(--red);color:#fff;}
.btn-red:hover{background:var(--red2);}
.btn-orange{background:var(--orange);color:#fff;}
.btn-orange:hover{background:#d35400;}
.btn-muted{background:#1e2530;color:var(--muted);border:1px solid var(--border);} 
.btn-muted:hover{border-color:var(--white);color:var(--white);} 
.btn:disabled{background:#1a1a1a;color:#333;cursor:not-allowed;}
.promo-select{width:100%;background:#0d1117;border:1px solid var(--border);color:var(--white);border-radius:7px;padding:8px 9px;font-family:inherit;font-size:11px;font-weight:900;}

/* ── STOCK PANEL ── */
.stock-grid{display:flex;flex-direction:column;gap:5px;max-height:260px;overflow-y:auto;}
.stock-item{display:flex;align-items:center;gap:8px;background:#0d1117;border:1px solid var(--border);border-radius:7px;padding:7px 9px;}
.stock-item.low{border-color:#e67e2244;}
.stock-item.out{border-color:var(--red2);background:#1a0a0a;}
.si-emoji{font-size:20px;flex-shrink:0;}
.si-info{flex:1;min-width:0;}
.si-name{font-size:11px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.si-sub{font-size:9px;color:#aeb7c2;font-weight:900;}
.stock-bar-wrap{width:60px;height:5px;background:#1a2030;border-radius:3px;overflow:hidden;margin-top:2px;}
.stock-bar{height:100%;border-radius:3px;transition:width 0.3s;}
.si-qty{font-size:13px;font-weight:900;min-width:28px;text-align:right;}
.si-qty.ok{color:var(--green);}
.si-qty.low{color:var(--orange);}
.si-qty.out{color:var(--red2);}
.price-ctrl{display:flex;align-items:center;gap:5px;margin-top:5px;}
.price-btn{width:20px;height:20px;background:#1a2a33;border:1px solid var(--border);color:var(--cyan);border-radius:4px;font-size:12px;font-weight:900;cursor:pointer;line-height:1;}
.price-btn:disabled{opacity:0.25;cursor:not-allowed;}
.price-now{font-size:9px;color:var(--gold);font-weight:900;min-width:62px;text-align:center;}
.delivery-list{display:flex;flex-direction:column;gap:5px;max-height:120px;overflow-y:auto;}
.delivery-row{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;background:linear-gradient(90deg,#0d1117,#00131a);border:1px solid #00bcd433;border-radius:7px;padding:7px 9px;font-size:10px;position:relative;overflow:hidden;}
.delivery-row::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,var(--cyan2),var(--green));}
.delivery-truck{font-size:18px;animation:truck-bounce .9s infinite;}
.delivery-name{font-weight:900;color:var(--white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.delivery-meta{color:#aeb7c2;font-size:9px;margin-top:1px;line-height:1.25;font-weight:900;}
.delivery-time{color:var(--cyan2);font-weight:900;font-size:11px;text-align:right;}
.delivery-progress{width:100%;height:3px;background:#002532;border-radius:2px;overflow:hidden;margin-top:4px;}
.delivery-progress>span{display:block;height:100%;background:linear-gradient(90deg,var(--cyan2),var(--green));transition:width 0.5s linear;}
.incoming-tag{display:inline-block;font-size:8px;color:var(--cyan2);border:1px solid #00bcd455;border-radius:4px;padding:1px 4px;margin-top:4px;}
@keyframes truck-bounce{0%,100%{transform:translateY(0);}50%{transform:translateY(-2px);}}

/* ── STATS ── */
.stat-row{display:flex;justify-content:space-between;align-items:center;padding:6px 9px;background:var(--card);border-radius:7px;font-size:11px;}
.sl{color:#b8c2cc;font-weight:900;}
.sv{font-weight:900;}
.sv.green{color:var(--green);}
.sv.gold{color:var(--gold);}
.sv.cyan{color:var(--cyan2);}
.sv.purple{color:var(--purple);}
.sv.red{color:var(--red2);}
.sv.orange{color:var(--orange);}

/* ── EXPENSE BOX ── */
.expense-box{background:#1a1200;border:1px solid #4a3800;border-radius:9px;padding:11px;}
.exp-title{font-size:10px;color:var(--gold);letter-spacing:2px;margin-bottom:8px;}
.exp-row{display:flex;justify-content:space-between;font-size:11px;padding:4px 0;border-bottom:1px dashed #2a1e00;}
.exp-row:last-child{border-bottom:none;font-weight:900;font-size:12px;padding-top:7px;margin-top:3px;}

/* ── LOG ── */
.log-list{display:flex;flex-direction:column;gap:4px;max-height:160px;overflow-y:auto;}
.log-row{display:flex;justify-content:space-between;padding:5px 8px;border-radius:6px;font-size:10px;}
.log-row.cash{background:#0a1a00;border-left:3px solid var(--green);}
.log-row.card{background:#0a001a;border-left:3px solid var(--purple);}
.log-row.expense{background:#1a0e00;border-left:3px solid var(--orange);}
.log-row.order{background:#00101a;border-left:3px solid var(--cyan);}

/* queue badge */
.qbadge{display:inline-flex;align-items:center;justify-content:center;background:var(--red);color:#fff;font-size:10px;font-weight:900;width:18px;height:18px;border-radius:50%;margin-left:5px;}

/* ── TOAST ── */
.toast{position:fixed;top:68px;left:50%;transform:translateX(-50%);background:var(--panel);border:1px solid var(--border);padding:9px 18px;border-radius:18px;font-size:12px;font-weight:700;z-index:400;white-space:nowrap;pointer-events:none;transition:opacity 0.3s;}
.event-banner{position:sticky;top:52px;z-index:190;text-align:center;padding:7px 12px;font-size:12px;font-weight:900;letter-spacing:1px;animation:eventGlow 1.5s infinite;}
@keyframes eventGlow{0%,100%{filter:brightness(1);}50%{filter:brightness(1.25);}}

/* ── MODALS ── */
.overlay{position:fixed;inset:0;background:#000000cc;display:flex;align-items:center;justify-content:center;z-index:300;}
.modal{background:var(--panel);border:2px solid var(--border);border-radius:14px;padding:24px 28px;text-align:center;max-width:420px;width:94%;box-shadow:0 20px 60px #00000099;max-height:90vh;overflow-y:auto;}
.modal .me{font-size:48px;margin-bottom:8px;}
.modal .mt{font-size:19px;font-weight:900;margin-bottom:4px;}
.modal .ms{font-size:12px;color:var(--muted);margin-bottom:16px;}
.modal .md{background:var(--card);border-radius:9px;padding:12px;margin-bottom:14px;text-align:left;}
.modal .mr{display:flex;justify-content:space-between;font-size:12px;padding:3px 0;}
.modal .mr.big{font-size:18px;font-weight:900;border-top:1px solid var(--border);margin-top:7px;padding-top:8px;}

/* ORDER MODAL special */
.order-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px;}
.order-card{background:#0d1117;border:1px solid var(--border);border-radius:9px;padding:10px;cursor:pointer;transition:all 0.15s;position:relative;}
.order-card:hover{border-color:var(--cyan);}
.order-card.selected{border-color:var(--cyan2);background:#001a22;}
.order-card.out-of-stock{border-color:var(--red2);}
.oc-emoji{font-size:22px;margin-bottom:4px;}
.oc-name{font-size:11px;font-weight:700;}
.oc-stock{font-size:10px;margin-top:2px;}
.oc-cost{font-size:12px;font-weight:900;color:var(--gold);margin-top:3px;}
.oc-qty-ctrl{display:flex;align-items:center;gap:6px;margin-top:6px;justify-content:center;}
.qty-btn{width:22px;height:22px;background:#2a3a4a;border:1px solid var(--border);color:var(--white);border-radius:4px;cursor:pointer;font-size:14px;font-weight:900;display:flex;align-items:center;justify-content:center;transition:all 0.1s;}
.qty-btn:hover{background:var(--cyan);color:#000;}
.qty-btn.disabled{opacity:0.25;pointer-events:none;}
.oc-qty-val{font-size:14px;font-weight:900;min-width:24px;text-align:center;}
.order-total-bar{background:#001520;border:1px solid #00334455;border-radius:8px;padding:10px 14px;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.order-card.locked{opacity:0.45;border-color:#444;filter:grayscale(0.8);}
.unlock-tag{font-size:9px;color:var(--gold);margin-top:5px;}
.order-cat-title{grid-column:1/-1;font-size:10px;color:var(--cyan);letter-spacing:1.5px;border-bottom:1px solid var(--border);padding:6px 2px 4px;margin-top:4px;text-align:left;}
.safe-tag{display:inline-block;font-size:8px;color:var(--green);border:1px solid #2ecc7144;border-radius:4px;padding:1px 4px;margin-top:4px;}
.upgrade-list{display:flex;flex-direction:column;gap:6px;}
.upgrade-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;background:#0d1117;border:1px solid var(--border);border-radius:7px;padding:8px;}
.upgrade-name{font-size:11px;font-weight:900;color:var(--white);}
.upgrade-desc{font-size:9px;color:#aeb7c2;margin-top:2px;line-height:1.25;font-weight:900;}
.upgrade-btn{background:#1a2a1a;border:1px solid var(--green);color:var(--green);border-radius:6px;padding:6px 8px;font-family:inherit;font-size:9px;font-weight:900;cursor:pointer;}
.upgrade-btn:disabled{border-color:#333;color:#555;background:#111;cursor:not-allowed;}

/* LEVEL UP */
.levelup-stars{font-size:30px;letter-spacing:5px;margin:8px 0;}

/* END DAY */
.endday-summary{display:flex;flex-direction:column;gap:6px;}
.eds-row{display:flex;justify-content:space-between;padding:6px 10px;background:#0d1117;border-radius:7px;font-size:12px;}
.eds-row.profit{background:#0a2a0a;border:1px solid var(--green);}
.eds-row.loss{background:#2a0a0a;border:1px solid var(--red2);}

@media(max-width:900px){.game-wrap{grid-template-columns:1fr;max-width:620px;}.stock-grid{max-height:360px;}}
@media(max-width:600px){
  .topbar{position:relative;padding:8px 10px;align-items:flex-start;}
  .store-name{font-size:13px;letter-spacing:1.5px;}
  .topbar-mid{order:3;width:100%;margin-top:4px;}
  .topbar-right{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:6px;}
  .tb-stat{background:#00000022;border:1px solid #ffffff16;border-radius:7px;padding:5px;}
  .tb-stat .tv{font-size:13px;}
  .balance-big{font-size:16px !important;}
  .game-wrap{padding:8px;gap:8px;}
  .panel{padding:10px;border-radius:9px;}
  .reg-total{font-size:40px;}
  .modal{width:96%;padding:16px 14px;border-radius:10px;}
  .modal .me{font-size:34px;}
  .order-grid{grid-template-columns:1fr;}
  .order-card{padding:9px;}
  .stock-item{align-items:flex-start;}
  .price-ctrl{flex-wrap:wrap;}
  .toast{top:12px;max-width:92vw;white-space:normal;text-align:center;}
}
::-webkit-scrollbar{width:4px;}
::-webkit-scrollbar-thumb{background:#2a3340;border-radius:2px;}

.cnp-btn{
  padding:13px 0;background:var(--card);border:1px solid var(--border);
  color:var(--white);font-family:'Courier New',monospace;font-size:18px;font-weight:700;
  border-radius:8px;cursor:pointer;transition:all 0.1s;
}
.cnp-btn:hover{background:#00bcd422;border-color:var(--cyan);color:var(--cyan);}
.cnp-btn:active{transform:scale(0.92);}
.qc-change-btn{
  flex:1;padding:7px 4px;text-align:center;
  background:#001a10;border:1px solid #00aa5544;
  color:#00cc66;font-family:'Courier New',monospace;font-size:11px;font-weight:700;
  border-radius:6px;cursor:pointer;transition:all 0.15s;
}
.qc-change-btn:hover{background:#00aa5522;border-color:var(--green);}