/* VendNest demo bar + first-time guide */
body{margin:0}
.vn-bar{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  background:#0A1628;color:#fff;padding:8px 16px;font:500 14px/1.3 "Figtree",system-ui,sans-serif;margin-inline:-16px}
.vn-bar a,.vn-bar button{color:#fff;text-decoration:none;font:inherit}
.vn-bar .vn-l{display:flex;align-items:center;gap:10px;min-width:0}
.vn-bar .vn-mark{width:28px;height:28px;display:block;flex:none}.vn-bar .vn-mark svg{width:100%;height:100%;display:block}
.vn-bar .vn-t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vn-bar .vn-t b{font-weight:700}
.vn-bar .vn-r{display:flex;gap:8px;align-items:center}
.vn-bar .vn-btn{border:1px solid rgba(255,255,255,.3);background:transparent;border-radius:8px;padding:5px 11px;cursor:pointer;white-space:nowrap}
.vn-bar .vn-btn:hover{border-color:#fff}
.vn-bar .vn-gold{background:#F0A500;border-color:#F0A500;color:#0A1628!important;font-weight:700}
@media (max-width:560px){.vn-bar .vn-hide{display:none}}

.vn-block{position:fixed;inset:0;z-index:9990;background:transparent}
.vn-hole{position:fixed;z-index:9991;border-radius:12px;box-shadow:0 0 0 9999px rgba(8,14,28,.62);pointer-events:none;transition:all .3s ease;outline:2px solid #F0A500;outline-offset:2px}
.vn-hole.none{left:50%!important;top:40%!important;width:0!important;height:0!important;outline:0}
.vn-card{position:fixed;z-index:9992;width:min(360px,calc(100vw - 24px));background:#fff;color:#101B2B;border-radius:16px;padding:18px;
  box-shadow:0 20px 50px rgba(0,0,0,.35);font:15px/1.5 "Figtree",system-ui,sans-serif;transition:top .3s ease,left .3s ease}
.vn-card.center{left:50%!important;top:50%!important;transform:translate(-50%,-50%);width:min(440px,calc(100vw - 24px))}
.vn-card h3{font:700 1.15rem/1.25 "Bricolage Grotesque",system-ui,sans-serif;margin:0 0 6px;letter-spacing:-.01em}
.vn-card p{margin:0;color:#47566B}
.vn-card ul{margin:10px 0 0;padding-left:18px;color:#47566B}
.vn-card li{margin:3px 0}
.vn-step{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#BA7517;margin-bottom:4px}
.vn-nav{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:14px;flex-wrap:wrap}
.vn-nav .grp{display:flex;gap:8px}
.vn-card button{font:600 14px "Figtree",system-ui,sans-serif;border-radius:9px;padding:8px 14px;cursor:pointer;border:1px solid #D5DDE7;background:#fff;color:#101B2B}
.vn-card button.pri{background:#0A1628;border-color:#0A1628;color:#fff}
.vn-card button.link{border:0;padding:8px 4px;color:#56657A;background:none}
.vn-dots{display:flex;gap:4px}
.vn-dots i{width:6px;height:6px;border-radius:50%;background:#D5DDE7}
.vn-dots i.on{background:#F0A500;width:16px;border-radius:3px}
@media (max-width:640px){
  .vn-card:not(.center){left:12px!important;right:12px;top:auto!important;bottom:12px;width:auto}
}
@media (prefers-color-scheme:dark){
  .vn-card{background:#1A2233;color:#E6EAF2}
  .vn-card p,.vn-card ul{color:#A9B4C6}
  .vn-card button{background:#1A2233;color:#E6EAF2;border-color:#36425A}
  .vn-card button.pri{background:#F0A500;border-color:#F0A500;color:#0A1628}
}
/* language switch + upi + report card (shared) */
.vn-lang{display:inline-flex;gap:2px;padding:3px;border-radius:10px;background:rgba(127,140,160,.16)}
.vn-lang button{border:0;background:none;padding:5px 10px;border-radius:8px;font:600 13px "Figtree",system-ui,sans-serif;color:inherit;opacity:.75;cursor:pointer}
.vn-lang button[aria-pressed="true"]{background:#F0A500;color:#0A1628;opacity:1}
.vn-upi{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px;border-radius:14px;background:#F4F6FA;color:#101B2B;text-align:center}
.vn-upi .amt{font:800 1.6rem "Bricolage Grotesque",system-ui,sans-serif}
.vn-upi .apps{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.vn-upi .apps span{font:600 12px "Figtree",sans-serif;padding:3px 9px;border-radius:99px;background:#fff;border:1px solid #DCE2EA}
.vn-upi small{color:#56657A;font-size:12px}
.vn-rc{background:#fff;color:#101B2B;border:1px solid #DCE2EA;border-radius:12px;padding:18px;font:14px/1.45 "Figtree",system-ui,sans-serif}
.vn-rc .rh{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;border-bottom:2px solid #0A1628;padding-bottom:10px;margin-bottom:12px}
.vn-rc .rh b{font:800 1.15rem "Bricolage Grotesque",system-ui,sans-serif;display:block}
.vn-rc .rh span{color:#56657A;font-size:12px}
.vn-rc .meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 16px;margin-bottom:12px;font-size:13px}
.vn-rc table{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:12px}
.vn-rc th,.vn-rc td{border:1px solid #DCE2EA;padding:6px 8px;text-align:center}
.vn-rc th{background:#F4F6FA;font-weight:700}
.vn-rc td:first-child,.vn-rc th:first-child{text-align:left}
.vn-rc .sum{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:12px}
.vn-rc .sum div{background:#F4F6FA;border-radius:8px;padding:8px;text-align:center}
.vn-rc .sum b{display:block;font:800 1.1rem "Bricolage Grotesque",system-ui,sans-serif}
.vn-rc .sum span{font-size:11px;color:#56657A}
.vn-rc .rem{font-size:13px;border-left:3px solid #F0A500;padding-left:10px;margin-bottom:10px}
.vn-rc .sig{display:flex;justify-content:space-between;font-size:12px;color:#56657A;margin-top:18px}
@media (max-width:480px){.vn-rc .sum{grid-template-columns:repeat(2,minmax(0,1fr))}.vn-rc .meta{grid-template-columns:1fr}}
