/* ===== 19 KIOSK — fiziksel cihaz + sipariş → ödeme → kasa/KDS/yazıcı → servis ===== */
.v19 {
  --cycle: 16s;
  background:
    radial-gradient(ellipse 50% 40% at 50% 85%, rgba(255,255,255,.04), transparent 55%),
    radial-gradient(ellipse 45% 35% at 70% 20%, rgba(var(--brand-rgb),.12), transparent 50%),
    #0a0c10;
}
.v19 .story { position:absolute; inset:0; }
.v19 .beat {
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:2.5% 3%; gap:.4rem;
  opacity:0; visibility:hidden; pointer-events:none;
}
.v19 .b1 { animation:v19b1 var(--cycle) linear infinite; }
.v19 .b2 { animation:v19b2 var(--cycle) linear infinite; }
.v19 .b3 { animation:v19b3 var(--cycle) linear infinite; }
.v19 .b4 { animation:v19b4 var(--cycle) linear infinite; }
.v19 .b5 { animation:v19b5 var(--cycle) linear infinite; }
/* b1 daha uzun: yaklaş → dokun; b2: menü → seç → sepet */
@keyframes v19b1 {
  0%,5%{opacity:0;visibility:hidden;transform:scale(1.04)}
  6%{opacity:0;visibility:visible}
  10%{opacity:1;transform:none}
  24%{opacity:1}
  28%{opacity:0}
  29%,100%{opacity:0;visibility:hidden}
}
@keyframes v19b2 {
  0%,27%{opacity:0;visibility:hidden;transform:translateY(16px)}
  28%{opacity:0;visibility:visible}
  32%{opacity:1;transform:none}
  48%{opacity:1}
  52%{opacity:0}
  53%,100%{opacity:0;visibility:hidden}
}
@keyframes v19b3 {
  0%,51%{opacity:0;visibility:hidden;transform:translateY(12px)}
  52%{opacity:0;visibility:visible}
  56%{opacity:1;transform:none}
  66%{opacity:1}
  70%{opacity:0}
  71%,100%{opacity:0;visibility:hidden}
}
@keyframes v19b4 {
  0%,69%{opacity:0;visibility:hidden;transform:translateX(18px)}
  70%{opacity:0;visibility:visible}
  74%{opacity:1;transform:none}
  84%{opacity:1}
  88%{opacity:0}
  89%,100%{opacity:0;visibility:hidden}
}
@keyframes v19b5 {
  0%,87%{opacity:0;visibility:hidden;transform:scale(1.02)}
  88%{opacity:0;visibility:visible}
  92%{opacity:1;transform:none}
  100%{opacity:1;visibility:visible}
}
.v19 .eyebrow {
  margin:0; font:800 .65rem Outfit,sans-serif; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(var(--brand-rgb),.95);
}
.v19 .title {
  margin:0; text-align:center;
  font:800 clamp(1.15rem, 2.8vw, 1.7rem) Outfit,sans-serif;
  color:#fff; letter-spacing:-.02em; line-height:1.15;
}
.v19 .lead {
  margin:0; text-align:center; max-width:42ch;
  font:600 clamp(.72rem, 1.6vw, .9rem) "IBM Plex Sans",sans-serif;
  color:#c5cede; line-height:1.35;
}

/* —— fiziksel kiosk ünitesi (CSS yeniden üretim; referans fotoğrafı yok) —— */
.v19 .unit {
  --chassis: #e8eaee;
  --chassis-edge: #c5cad3;
  display:flex; flex-direction:column; align-items:center;
  width:min(178px, 30%);
  height:min(74%, 360px);
  max-height:100%;
  filter:drop-shadow(0 18px 32px rgba(0,0,0,.55));
  position:relative; z-index:2; flex-shrink:1; min-height:0;
}
.v19 .unit.lg { width:min(196px, 32%); height:min(76%, 370px); }
.v19 .unit.hero { width:min(210px, 34%); }
.v19 .unit.sm { width:min(140px, 24%); }
.v19 .b1 .arrive .unit,
.v19 .b2 .order-row .unit {
  height:100%;
  max-height:min(100%, 355px);
  animation:v19unitIn var(--cycle) var(--snap) infinite;
}
@keyframes v19unitIn {
  0%,8%{transform:scale(.94); filter:drop-shadow(0 8px 16px rgba(0,0,0,.3))}
  14%{transform:scale(1); filter:drop-shadow(0 20px 36px rgba(0,0,0,.55))}
  50%,100%{transform:scale(1); filter:drop-shadow(0 20px 36px rgba(0,0,0,.55))}
}
.v19 .unit::before {
  content:""; position:absolute; left:-3px; top:10%; bottom:18%; width:4px;
  border-radius:3px; background:var(--brand); opacity:.85;
  box-shadow:2px 0 10px rgba(var(--brand-rgb),.35);
}
.v19 .head {
  width:100%; flex:1 1 auto; min-height:0;
  aspect-ratio:auto;
  background:linear-gradient(160deg,#f3f4f6 0%, var(--chassis) 40%, #dfe3ea 100%);
  border:2px solid var(--chassis-edge); border-bottom:none;
  border-radius:14px 14px 4px 4px; overflow:hidden; position:relative;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.65);
}
.v19 .head::before {
  content:""; position:absolute; top:7px; left:50%; transform:translateX(-50%);
  width:22%; height:3px; border-radius:99px; background:#9dffc4; z-index:3;
  box-shadow:0 0 8px rgba(125,255,178,.55);
}
.v19 .head::after {
  content:""; position:absolute; top:6px; left:12px; width:7px; height:7px;
  border-radius:50%; background:#2a3140; z-index:3; opacity:.55;
}
.v19 .screen {
  position:absolute; inset:14px 10px 8px; border-radius:6px; overflow:hidden;
  background:#f6f4f1; color:#151922;
  display:flex; flex-direction:column;
  box-shadow:0 0 0 2px #111318;
}
.v19 .screen.dark { background:#12151c; color:#e8ecf4; }
.v19 .deck {
  width:100%; flex-shrink:0; background:linear-gradient(180deg,#f7f8fa,#d8dde6);
  border:2px solid var(--chassis-edge); border-top:1px solid #b0b7c3;
  border-radius:0 0 10px 10px;
  padding:6px 7px 7px; display:grid; grid-template-columns:1fr 1.35fr 1fr; gap:5px; align-items:center;
}
.v19 .slot {
  height:16px; border-radius:3px; background:#1a1f28;
  box-shadow:inset 0 2px 5px rgba(0,0,0,.45);
  position:relative; border:1px solid #3a4454;
}
.v19 .slot::before {
  content:""; position:absolute; left:10%; right:10%; top:-3px; height:2px;
  background:#7dffb2; border-radius:99px; opacity:.7;
}
.v19 .slot::after {
  content:""; position:absolute; left:18%; right:18%; top:100%; height:0;
  background:#f7f4ef; border-radius:0 0 2px 2px;
}
.v19 .b3 .slot::after, .v19 .b4 .slot.out::after {
  animation:v19slip var(--cycle) var(--snap) infinite;
}
@keyframes v19slip {
  0%,56%{height:0;opacity:0}
  60%{height:18px;opacity:1}
  68%,100%{height:22px;opacity:1}
}
.v19 .pospad {
  height:24px; border-radius:5px; background:#151922; border:1px solid #3a4454;
  display:grid; place-items:center; font:800 .4rem Outfit,sans-serif; color:#8b95a8; letter-spacing:.06em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.v19 .b3 .pospad {
  animation:v19pad var(--cycle) var(--punch) infinite;
  color:#9dffc4; border-color:rgba(125,255,178,.55);
  box-shadow:0 0 14px rgba(125,255,178,.35);
}
@keyframes v19pad {
  0%,54%{box-shadow:none;border-color:#3a4454;color:#8b95a8}
  58%{box-shadow:0 0 16px rgba(125,255,178,.45);border-color:rgba(125,255,178,.6);color:#9dffc4}
  68%,100%{box-shadow:0 0 10px rgba(125,255,178,.25);border-color:rgba(125,255,178,.45);color:#9dffc4}
}
.v19 .scan {
  height:16px; border-radius:3px; background:#0e1014;
  border:1px solid #3a4454;
  box-shadow:inset 0 0 0 1px rgba(126,182,255,.2);
}
.v19 .pillar {
  width:52%; flex:0 0 11%; min-height:22px; max-height:42px;
  background:
    linear-gradient(90deg, transparent 0%, rgba(255,255,255,.04) 45%, transparent 100%),
    linear-gradient(180deg,#3a4252 0%, #1a1f28 55%, #12151c 100%);
  border-left:1px solid rgba(255,255,255,.08);
  border-right:1px solid rgba(0,0,0,.35);
  position:relative;
}
.v19 .pillar::after {
  content:""; position:absolute; left:18%; right:18%; top:30%; height:7px;
  border-radius:3px; background:#0e1014; border:1px solid rgba(255,255,255,.08);
}
.v19 .foot {
  width:88%; flex-shrink:0; height:8px; border-radius:3px;
  background:linear-gradient(180deg,#3a4252,#12151c);
  box-shadow:0 6px 14px rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.06);
}

/* ekran UI parçaları */
.v19 .ui-top {
  display:flex; justify-content:space-between; align-items:center;
  padding:6px 8px; background:#fff; border-bottom:1px solid #e5e7eb;
  font:800 .55rem Outfit,sans-serif;
}
.v19 .ui-top .cart {
  background:var(--brand); color:#fff; border-radius:999px;
  padding:2px 7px; font-size:.5rem;
  animation:v19cartBadge var(--cycle) var(--punch) infinite;
}
@keyframes v19cartBadge {
  0%,38%{transform:scale(0);opacity:0}
  41%{transform:scale(1.25);opacity:1}
  45%,100%{transform:scale(1);opacity:1}
}
.v19 .ui-foot .go {
  animation:v19footGo var(--cycle) ease-in-out infinite;
}
@keyframes v19footGo {
  0%,44%{transform:translateX(0)}
  47%{transform:translateX(4px)}
  50%{transform:translateX(0)}
  52%,100%{transform:translateX(0)}
}
.v19 .cats {
  display:flex; gap:4px; padding:5px 7px; overflow:hidden;
}
.v19 .cats i {
  font:700 .42rem Outfit,sans-serif; font-style:normal; white-space:nowrap;
  padding:3px 7px; border-radius:999px; background:#eceff3; color:#4b5563;
}
.v19 .cats i.on { background:var(--brand); color:#fff; }
.v19 .menu {
  flex:1; display:grid; grid-template-columns:1fr 1fr; gap:5px;
  padding:4px 7px 6px; min-height:0; overflow:hidden;
}
.v19 .menu .tile {
  background:#fff; border:1px solid #e5e7eb; border-radius:8px; overflow:hidden;
  display:flex; flex-direction:column; min-height:0;
  opacity:0; transform:translateY(10px);
  animation:v19tileIn var(--cycle) var(--snap) infinite;
}
.v19 .menu .tile:nth-child(1){animation-delay:0s}
.v19 .menu .tile:nth-child(2){animation-delay:.06s}
.v19 .menu .tile:nth-child(3){animation-delay:.12s}
.v19 .menu .tile:nth-child(4){animation-delay:.18s}
@keyframes v19tileIn {
  0%,30%{opacity:0;transform:translateY(12px)}
  34%{opacity:1;transform:none}
  52%,100%{opacity:1;transform:none}
}
.v19 .menu .tile.sel {
  border-color:var(--brand);
  animation:v19tileIn var(--cycle) var(--snap) infinite, v19sel var(--cycle) var(--punch) infinite;
}
@keyframes v19sel {
  0%,36%{box-shadow:0 0 0 0 rgba(var(--brand-rgb),0); filter:brightness(1)}
  39%{box-shadow:0 0 0 3px rgba(var(--brand-rgb),.5); filter:brightness(1.05)}
  43%{box-shadow:0 0 0 7px rgba(var(--brand-rgb),.22); filter:brightness(1.08)}
  47%,100%{box-shadow:0 0 0 2px rgba(var(--brand-rgb),.4); filter:brightness(1)}
}
.v19 .menu .tile .ph {
  aspect-ratio:5/3; max-height:42%; background:#eef0f4; overflow:hidden; flex:1; min-height:0;
}
.v19 .menu .tile img { width:100%; height:100%; object-fit:cover; display:block; }
.v19 .menu .tile b {
  font:800 .48rem Outfit,sans-serif; padding:3px 4px 0; line-height:1.15;
}
.v19 .menu .tile em {
  font:700 .42rem "IBM Plex Sans",sans-serif; font-style:normal;
  color:var(--brand); padding:0 4px 4px;
}
.v19 .ui-foot {
  display:flex; justify-content:space-between; align-items:center;
  padding:6px 8px; background:var(--brand); color:#fff;
  font:800 .52rem Outfit,sans-serif;
}
.v19 .welcome {
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; padding:12px; text-align:center;
  background:linear-gradient(165deg,#151922,#0e1014);
  color:#fff;
}
.v19 .welcome .logo {
  width:48px; height:48px; border-radius:14px;
  background:var(--brand); display:grid; place-items:center;
  font:800 1.15rem Outfit,sans-serif;
  animation:v19logoIn var(--cycle) var(--snap) infinite;
}
@keyframes v19logoIn {
  0%,9%{opacity:0;transform:scale(.7)}
  13%{opacity:1;transform:scale(1.08)}
  16%,100%{opacity:1;transform:none}
}
.v19 .welcome strong { font:800 .95rem Outfit,sans-serif; }
.v19 .welcome span { font:600 .58rem "IBM Plex Sans",sans-serif; color:#aeb6c6; max-width:16ch; }
.v19 .welcome .cta {
  margin-top:4px; padding:9px 16px; border-radius:999px;
  background:var(--brand); font:800 .62rem Outfit,sans-serif;
  position:relative; animation:v19pulse var(--cycle) ease-in-out infinite;
}
@keyframes v19pulse {
  0%,12%{transform:scale(1);box-shadow:0 0 0 0 rgba(var(--brand-rgb),.45)}
  16%{transform:scale(1.06);box-shadow:0 0 0 10px rgba(var(--brand-rgb),0)}
  20%{transform:scale(1);box-shadow:0 0 0 0 rgba(var(--brand-rgb),.35)}
  22%{transform:scale(.96);box-shadow:0 0 0 4px rgba(var(--brand-rgb),.4)}
  25%{transform:scale(1.04);box-shadow:0 0 18px rgba(var(--brand-rgb),.55)}
  28%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(var(--brand-rgb),0)}
}
.v19 .payui {
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:6px; padding:10px; text-align:center; background:#fff;
}
.v19 .payui .amt {
  font:800 1.35rem Outfit,sans-serif; color:#151922;
}
.v19 .payui .hint { font:600 .55rem "IBM Plex Sans",sans-serif; color:#6b7280; }
.v19 .payui .methods {
  display:flex; gap:6px; margin-top:4px;
}
.v19 .payui .methods i {
  font:800 .48rem Outfit,sans-serif; font-style:normal;
  padding:7px 10px; border-radius:8px; border:1px solid #e5e7eb; background:#f3f4f6;
}
.v19 .payui .methods i.on {
  border-color:var(--brand); background:rgba(var(--brand-rgb),.1); color:var(--brand);
}
.v19 .payui .ok {
  margin-top:6px; padding:7px 16px; border-radius:999px;
  background:#2eaf5a; color:#fff; font:800 .6rem Outfit,sans-serif;
  opacity:0; animation:v19ok var(--cycle) var(--punch) infinite;
}
@keyframes v19ok {
  0%,58%{opacity:0;transform:scale(.9)}
  62%{opacity:1;transform:scale(1.04)}
  68%,100%{opacity:1;transform:none}
}

/* b1 / b2 — stage’e sığan kompakt sahne */
.v19 .b1, .v19 .b2 {
  justify-content:flex-start; align-items:center;
  padding:1.6% 2.2% 5.5%; gap:.2rem; overflow:hidden;
}
.v19 .b1 .eyebrow, .v19 .b2 .eyebrow {
  flex-shrink:0; font-size:.58rem; letter-spacing:.12em;
}
.v19 .b1 .title, .v19 .b2 .title {
  flex-shrink:0; font-size:clamp(.92rem, 2vw, 1.2rem); line-height:1.15;
}
.v19 .b1 .lead, .v19 .b2 .lead { display:none; }

/* b1 sahne */
.v19 .arrive {
  position:relative;
  display:flex; align-items:center; justify-content:center; gap:1rem;
  width:100%; flex:1 1 auto; min-height:0; max-height:100%;
}
.v19 .floor {
  position:absolute; left:18%; right:18%; bottom:4%; height:18px;
  background:radial-gradient(ellipse 70% 100% at 50% 50%, rgba(255,255,255,.1), transparent 70%);
  border-radius:50%; pointer-events:none;
  animation:v19floor var(--cycle) ease-in-out infinite;
}
@keyframes v19floor {
  0%,10%{opacity:.35;transform:scaleX(.9)}
  16%{opacity:.8;transform:scaleX(1)}
  28%,100%{opacity:.55;transform:scaleX(1)}
}
.v19 .glow-ring {
  position:absolute; left:50%; top:50%; transform:translate(-50%,-42%);
  width:min(260px,42%); aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, rgba(var(--brand-rgb),.2), transparent 62%);
  pointer-events:none; z-index:0;
  animation:v19glow var(--cycle) ease-in-out infinite;
}
@keyframes v19glow {
  0%,10%{opacity:.3;transform:translate(-50%,-42%) scale(.85)}
  18%{opacity:1;transform:translate(-50%,-42%) scale(1)}
  26%{opacity:.7;transform:translate(-50%,-42%) scale(1.04)}
  28%,100%{opacity:.5;transform:translate(-50%,-42%) scale(1)}
}
.v19 .person {
  width:56px; display:flex; flex-direction:column; align-items:center; gap:5px;
  opacity:0; animation:v19walk var(--cycle) var(--snap) infinite;
  z-index:3; position:relative; flex-shrink:0; align-self:flex-end;
  margin-bottom:8%;
}
@keyframes v19walk {
  0%,8%{opacity:0;transform:translateX(-56px) scale(.92)}
  13%{opacity:1;transform:translateX(-8px) scale(1)}
  18%{opacity:1;transform:translateX(0) scale(1)}
  28%,100%{opacity:1;transform:none}
}
.v19 .person .body {
  width:38px; height:64px; border-radius:18px 18px 12px 12px;
  background:linear-gradient(180deg,#5a6578,#1e2430);
  position:relative;
  box-shadow:0 8px 16px rgba(0,0,0,.4);
}
.v19 .person .body::before {
  content:""; position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  width:18px; height:18px; border-radius:50%;
  background:linear-gradient(160deg,#e0c4a0,#b8895c);
  box-shadow:0 2px 4px rgba(0,0,0,.25);
}
.v19 .person .body::after {
  content:""; position:absolute; bottom:-8px; left:8px; right:8px; height:8px;
  background:#151922; border-radius:3px;
}
.v19 .person .arm {
  position:absolute; top:22px; right:-8px; width:28px; height:8px;
  border-radius:8px; background:linear-gradient(90deg,#4a5568,#c4a574);
  transform-origin:left center;
  animation:v19reach var(--cycle) var(--snap) infinite;
}
@keyframes v19reach {
  0%,14%{transform:rotate(-8deg) scaleX(.7);opacity:.4}
  18%{transform:rotate(-28deg) scaleX(1.15);opacity:1}
  22%{transform:rotate(-32deg) scaleX(1.2);opacity:1}
  26%{transform:rotate(-20deg) scaleX(1);opacity:.85}
  28%,100%{transform:rotate(-12deg) scaleX(.95);opacity:.7}
}
.v19 .person > span {
  font:800 .55rem Outfit,sans-serif; color:#c5cede;
  background:rgba(255,255,255,.08); padding:.18rem .45rem; border-radius:999px;
  border:1px solid rgba(255,255,255,.1);
}
.v19 .hand {
  position:absolute; z-index:6; width:22px; height:22px; border-radius:50%;
  background:radial-gradient(circle at 35% 35%, #e8c9a8, #b8895c 70%);
  box-shadow:0 4px 10px rgba(0,0,0,.35);
  pointer-events:none;
}
.v19 .b1 .hand {
  left:58%; top:52%;
  animation:v19tap1 var(--cycle) var(--punch) infinite;
}
@keyframes v19tap1 {
  0%,16%{opacity:0;transform:translate(18px,22px) scale(.6)}
  19%{opacity:1;transform:translate(4px,6px) scale(1)}
  22%{opacity:1;transform:translate(0,0) scale(.85)}
  25%{opacity:1;transform:translate(0,0) scale(1.05)}
  28%{opacity:0;transform:translate(-6px,-8px) scale(.5)}
  29%,100%{opacity:0}
}
.v19 .ripple {
  position:absolute; z-index:5; width:18px; height:18px; border-radius:50%;
  border:2px solid rgba(var(--brand-rgb),.9);
  pointer-events:none;
}
.v19 .b1 .ripple {
  left:57%; top:54%;
  animation:v19rip1 var(--cycle) var(--punch) infinite;
}
@keyframes v19rip1 {
  0%,21%{opacity:0;transform:scale(.4)}
  23%{opacity:1;transform:scale(.8)}
  27%{opacity:0;transform:scale(2.4)}
  28%,100%{opacity:0;transform:scale(2.4)}
}

/* b2: kiosk + sepet paneli */
.v19 .order-row {
  position:relative;
  display:flex; align-items:center; justify-content:center; gap:.75rem;
  width:100%; flex:1 1 auto; min-height:0; max-height:100%;
}
.v19 .b2 .hand {
  left:42%; top:38%;
  animation:v19tap2 var(--cycle) var(--punch) infinite;
}
@keyframes v19tap2 {
  0%,34%{opacity:0;transform:translate(20px,24px) scale(.5)}
  37%{opacity:1;transform:translate(4px,4px) scale(1)}
  39%{opacity:1;transform:translate(0,0) scale(.82)}
  42%{opacity:1;transform:translate(0,0) scale(1.08)}
  46%{opacity:0;transform:translate(-10px,-14px) scale(.4)}
  47%,100%{opacity:0}
}
.v19 .b2 .ripple {
  left:41%; top:40%;
  animation:v19rip2 var(--cycle) var(--punch) infinite;
}
@keyframes v19rip2 {
  0%,38%{opacity:0;transform:scale(.3)}
  40%{opacity:1;transform:scale(.7)}
  45%{opacity:0;transform:scale(2.6)}
  46%,100%{opacity:0}
}
.v19 .fly {
  position:absolute; z-index:7; left:40%; top:42%;
  padding:.28rem .55rem; border-radius:999px;
  background:var(--brand); color:#fff;
  font:800 .55rem Outfit,sans-serif; white-space:nowrap;
  box-shadow:0 8px 18px rgba(var(--brand-rgb),.4);
  opacity:0; pointer-events:none;
  animation:v19fly var(--cycle) var(--punch) infinite;
}
@keyframes v19fly {
  0%,40%{opacity:0;transform:translate(0,0) scale(.7)}
  42%{opacity:1;transform:translate(0,0) scale(1)}
  48%{opacity:1;transform:translate(72px,-20px) scale(.85)}
  51%{opacity:0;transform:translate(96px,-28px) scale(.4)}
  52%,100%{opacity:0}
}
.v19 .side-cart {
  width:min(168px, 22%); flex-shrink:0; align-self:center;
  background:#151922; border:1px solid var(--line);
  border-radius:12px; padding:.55rem; font-size:.58rem;
  box-shadow:0 12px 28px rgba(0,0,0,.35);
  opacity:0; transform:translateX(18px) scale(.94);
  animation:v19cartIn var(--cycle) var(--snap) infinite;
}
@keyframes v19cartIn {
  0%,40%{opacity:0;transform:translateX(28px) scale(.92)}
  44%{opacity:1;transform:translateX(-4px) scale(1.03)}
  47%{opacity:1;transform:none}
  52%,100%{opacity:1;transform:none}
}
.v19 .side-cart h4 {
  margin:0 0 .4rem; font:800 .75rem Outfit,sans-serif; color:#fff;
  display:flex; align-items:center; justify-content:space-between;
}
.v19 .side-cart h4 em {
  font:800 .55rem Outfit,sans-serif; font-style:normal;
  background:rgba(125,255,178,.15); color:#9dffc4;
  padding:.12rem .4rem; border-radius:999px;
  animation:v19cartBadge var(--cycle) var(--punch) infinite;
}
.v19 .side-cart .ln {
  display:flex; justify-content:space-between; gap:.3rem;
  padding:.3rem 0; border-bottom:1px solid rgba(255,255,255,.06);
  color:#c5cede; font-weight:600;
  opacity:0; animation:v19lnIn var(--cycle) var(--snap) infinite;
}
.v19 .side-cart .ln:nth-child(2){animation-delay:0s}
.v19 .side-cart .ln:nth-child(3){animation-delay:.08s}
@keyframes v19lnIn {
  0%,43%{opacity:0;transform:translateY(6px)}
  46%{opacity:1;transform:none}
  52%,100%{opacity:1;transform:none}
}
.v19 .side-cart .tot {
  margin-top:.45rem; display:flex; justify-content:space-between;
  font:800 .85rem Outfit,sans-serif; color:#9dffc4;
  opacity:0; animation:v19lnIn var(--cycle) var(--snap) infinite;
  animation-delay:.14s;
}

/* b4: kasa + KDS + yazıcı */
.v19 .dispatch {
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  gap:.5rem; width:min(940px,100%); margin-top:.2rem;
}
.v19 .panel {
  background:#151922; border:1px solid rgba(255,255,255,.12);
  border-radius:14px; padding:.55rem .6rem; min-width:0;
  display:flex; flex-direction:column; gap:.35rem;
  box-shadow:0 12px 28px rgba(0,0,0,.3);
}
.v19 .panel .ph {
  font:800 .55rem Outfit,sans-serif; letter-spacing:.08em; text-transform:uppercase;
  color:#8b95a8;
}
.v19 .panel .ph.live { color:#9dffc4; }
.v19 .panel .ph.warn { color:#ffc86b; }
.v19 .ticket {
  background:#1a2228; border-radius:10px; padding:.5rem;
  border-left:3px solid var(--brand);
}
.v19 .ticket strong { display:block; font:800 .85rem Outfit,sans-serif; color:#fff; }
.v19 .ticket span { display:block; margin-top:.15rem; font:600 .65rem "IBM Plex Sans",sans-serif; color:#aeb6c6; }
.v19 .ticket .tag {
  display:inline-block; margin-top:.3rem; font:800 .5rem Outfit,sans-serif;
  padding:.12rem .35rem; border-radius:4px;
  background:rgba(var(--brand-rgb),.2); color:#ffb4b1;
}
.v19 .kds-mini {
  display:flex; flex-direction:column; gap:.3rem;
}
.v19 .kds-mini .col-h {
  font:800 .55rem Outfit,sans-serif; color:#7eb6ff; letter-spacing:.06em; text-transform:uppercase;
}
.v19 .print-box {
  background:#0e1014; border-radius:10px; padding:.5rem; text-align:center;
}
.v19 .print-box .ico {
  width:40px; height:32px; margin:0 auto .3rem; border-radius:5px;
  background:linear-gradient(180deg,#2a3340,#1a2028); border:1px solid rgba(255,255,255,.12);
  position:relative;
}
.v19 .print-box .ico::after {
  content:""; position:absolute; left:22%; right:22%; bottom:-3px; height:12px;
  background:#f4f4f5; border-radius:2px;
  animation:v19pslip var(--cycle) var(--snap) infinite;
}
@keyframes v19pslip {
  0%,72%{transform:translateY(-8px);opacity:0}
  76%{transform:translateY(3px);opacity:1}
  86%,100%{transform:translateY(3px);opacity:1}
}
.v19 .print-box .slip {
  background:#f7f4ef; color:#111; border-radius:6px; padding:.4rem;
  font:600 .55rem "IBM Plex Sans",sans-serif; text-align:left; line-height:1.35;
}

/* b5 servis */
.v19 .serve {
  display:flex; align-items:center; justify-content:center; gap:1rem;
  width:min(860px,100%);
}
.v19 .num {
  width:min(160px,28vw); aspect-ratio:1; border-radius:20px;
  background:linear-gradient(160deg, rgba(125,255,178,.18), #121816);
  border:1px solid rgba(125,255,178,.4);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.2rem;
  box-shadow:0 0 40px rgba(125,255,178,.15);
}
.v19 .num span {
  font:800 .65rem Outfit,sans-serif; letter-spacing:.12em; text-transform:uppercase; color:#9dffc4;
}
.v19 .num strong {
  font:800 clamp(2.4rem, 7vw, 3.6rem) Outfit,sans-serif; color:#fff; line-height:1;
}
.v19 .tray {
  flex:1; max-width:360px; background:#151922; border:1px solid var(--line);
  border-radius:16px; padding:.7rem; display:flex; gap:.55rem; align-items:center;
}
.v19 .tray img {
  width:88px; height:88px; object-fit:cover; border-radius:12px;
  border:1px solid rgba(255,255,255,.1);
}
.v19 .tray div { display:flex; flex-direction:column; gap:.2rem; min-width:0; }
.v19 .tray strong { font:800 1.05rem Outfit,sans-serif; color:#fff; }
.v19 .tray em { font:600 .75rem "IBM Plex Sans",sans-serif; font-style:normal; color:#aeb6c6; }
.v19 .tray b { font:800 .85rem Outfit,sans-serif; color:#9dffc4; }

.v19 .rail {
  position:absolute; left:50%; bottom:2.5%; transform:translateX(-50%);
  display:flex; gap:.3rem; z-index:5;
}
.v19 .rail i {
  width:22px; height:3px; border-radius:99px; background:rgba(255,255,255,.12);
}
.v19 .rail i:nth-child(1){animation:v19r1 var(--cycle) linear infinite}
.v19 .rail i:nth-child(2){animation:v19r2 var(--cycle) linear infinite}
.v19 .rail i:nth-child(3){animation:v19r3 var(--cycle) linear infinite}
.v19 .rail i:nth-child(4){animation:v19r4 var(--cycle) linear infinite}
.v19 .rail i:nth-child(5){animation:v19r5 var(--cycle) linear infinite}
@keyframes v19r1 {
  0%,6%{background:rgba(255,255,255,.12)} 7%,27%{background:var(--brand)} 28%,100%{background:rgba(255,255,255,.12)}
}
@keyframes v19r2 {
  0%,28%{background:rgba(255,255,255,.12)} 29%,51%{background:var(--brand)} 52%,100%{background:rgba(255,255,255,.12)}
}
@keyframes v19r3 {
  0%,52%{background:rgba(255,255,255,.12)} 53%,69%{background:#7dffb2} 70%,100%{background:rgba(255,255,255,.12)}
}
@keyframes v19r4 {
  0%,70%{background:rgba(255,255,255,.12)} 71%,87%{background:#7eb6ff} 88%,100%{background:rgba(255,255,255,.12)}
}
@keyframes v19r5 {
  0%,88%{background:rgba(255,255,255,.12)} 89%,100%{background:#7dffb2}
}
@media (max-width:640px) {
  .v19 .arrive, .v19 .order-row { gap:.4rem; }
  .v19 .person { width:44px; margin-bottom:6%; }
  .v19 .person .arm, .v19 .b1 .hand, .v19 .b2 .hand, .v19 .fly { display:none; }
  .v19 .order-row { flex-wrap:wrap; }
  .v19 .side-cart { width:min(200px,70%); order:3; }
  .v19 .dispatch { grid-template-columns:1fr; }
  .v19 .serve { flex-direction:column; }
  .v19 .unit, .v19 .unit.hero, .v19 .unit.lg { width:min(160px, 42%); height:min(100%, 300px); }
}

