/* Mockup POS */
        .lp-mock { margin:50px auto 0; max-width:900px; perspective:1500px; }
        .lp-mock-win { position:relative; border-radius:16px; overflow:hidden; background:#f6faf9; color:#0b1f22;
            box-shadow:0 44px 100px rgba(0,0,0,.6); }
        .lp-mock-bar { display:flex; align-items:center; gap:7px; padding:11px 14px; background:#eaf1f0;
            border-bottom:1px solid #dde7e6; }
        .lp-mock-bar i { width:11px; height:11px; border-radius:50%; background:#d3dcdc; }
        .lp-mock-bar i:nth-child(1){background:#ff5f57;} .lp-mock-bar i:nth-child(2){background:#febc2e;} .lp-mock-bar i:nth-child(3){background:#28c840;}
        .lp-mock-bar em { margin-left:8px; font-style:normal; font-size:12.5px; color:#5c7472; font-weight:600; }
        .lp-mock-body { display:grid; grid-template-columns:1fr 250px; }
        .lp-mock-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:11px; padding:18px; }
        .lp-mp { background:#fff; border:1px solid #e6eeee; border-radius:12px; padding:11px; text-align:center; }
        .lp-mp .img { height:52px; border-radius:9px; display:grid; place-items:center; font-size:24px;
            background:#e9f4f3; margin-bottom:8px; }
        .lp-mp b { display:block; font-size:12.5px; color:#12312f; }
        .lp-mp span { font-size:12.5px; color:#0b6b73; font-weight:800; }
        .lp-mock-cart { background:#0e2b2e; color:#dff0ee; padding:18px; display:flex; flex-direction:column; gap:9px; }
        .lp-mock-cart h4 { margin:0 0 4px; font-size:13px; color:#8fe6da; letter-spacing:.4px; text-transform:uppercase; }
        .lp-ci { display:flex; justify-content:space-between; font-size:13px; color:#cfe6e4; }
        .lp-total { display:flex; justify-content:space-between; margin-top:auto; padding-top:12px;
            border-top:1px solid rgba(255,255,255,.14); font-size:18px; font-weight:850; }
        .lp-pay { margin-top:10px; text-align:center; padding:12px; border-radius:11px; font-weight:850;
            color:#1a1206; background:linear-gradient(135deg,#ffcf2e,#f2b705); }
        /* Mockup interactivo */
        .lp-mp { cursor:pointer; font-family:inherit; -webkit-appearance:none; appearance:none;
            transition:transform .1s ease, box-shadow .12s ease, border-color .12s ease; }
        .lp-mp:hover { border-color:#bcdedb; box-shadow:0 8px 20px rgba(11,107,115,.16); transform:translateY(-2px); }
        .lp-mp:active { transform:scale(.97); }
        .lp-mp.pulse { animation:lpPulse .28s ease; }
        @keyframes lpPulse { 0%{transform:scale(1);} 45%{transform:scale(.9);} 100%{transform:scale(1);} }
        #lpCart { display:flex; flex-direction:column; gap:9px; flex:1; }
        #lpItems { display:flex; flex-direction:column; gap:6px; }
        .lp-empty { color:#6f8a88; font-size:12.5px; padding:6px 0; }
        .lp-pay { border:none; width:100%; cursor:pointer; font-family:inherit; font-size:14px; }
        .lp-pay:disabled { opacity:.45; cursor:default; filter:grayscale(.4); }
        /* Overlay de impresion */
        .lp-print { position:absolute; inset:0; z-index:6; display:flex; flex-direction:column;
            align-items:center; justify-content:center; gap:14px; padding:18px; overflow:auto;
            background:rgba(6,16,19,.92); backdrop-filter:blur(3px); }
        .lp-print[hidden] { display:none; }
        .lp-print-load { text-align:center; color:#dff0ee; font-size:14px; font-weight:600; }
        .lp-print-load[hidden] { display:none; }
        .lp-spinner { width:34px; height:34px; margin:0 auto 12px; border-radius:50%;
            border:3px solid rgba(255,255,255,.18); border-top-color:#f2b705; animation:lpSpin .8s linear infinite; }
        @keyframes lpSpin { to { transform:rotate(360deg); } }
        .lp-receipt-wrap { width:100%; display:flex; flex-direction:column; align-items:center; gap:12px;
            animation:lpUp .35s ease; }
        .lp-receipt-wrap[hidden] { display:none; }
        @keyframes lpUp { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:none; } }
        .lp-receipt { width:272px; max-width:100%; background:#fff; color:#141414; border-radius:5px 5px 0 0;
            padding:16px 18px 18px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
            font-size:12px; line-height:1.55; box-shadow:0 22px 55px rgba(0,0,0,.55); position:relative; }
        .lp-receipt::after { content:""; position:absolute; left:0; right:0; bottom:-10px; height:11px;
            background:
                linear-gradient(45deg, transparent 34%, #fff 34% 66%, transparent 66%) 0 0/14px 22px repeat-x,
                linear-gradient(-45deg, transparent 34%, #fff 34% 66%, transparent 66%) 7px 0/14px 22px repeat-x; }
        .lp-receipt .tk-h { text-align:center; font-weight:800; font-size:15px; letter-spacing:2px; }
        .lp-receipt .tk-sub { text-align:center; font-size:10.5px; color:#666; margin:3px 0 9px; line-height:1.55; }
        .lp-receipt .tk-items { border-top:1px dashed #bbb; border-bottom:1px dashed #bbb; padding:9px 0;
            display:flex; flex-direction:column; gap:6px; }
        .lp-receipt .tk-line { display:flex; justify-content:space-between; gap:10px; }
        .lp-receipt .tk-total { display:flex; justify-content:space-between; font-weight:800; font-size:14px; margin-top:10px; }
        .lp-receipt .tk-ty { text-align:center; font-size:10.5px; color:#666; margin-top:10px; }
        .lp-print-actions { display:flex; gap:8px; width:272px; max-width:100%; }
        .lp-tk-btn { flex:1; cursor:pointer; font-family:inherit; font-weight:750; font-size:13px; border-radius:10px;
            padding:12px 8px; border:1px solid rgba(255,255,255,.24); background:rgba(255,255,255,.1); color:#eaf4f2; }
        .lp-tk-btn:hover { background:rgba(255,255,255,.2); }
        .lp-tk-new { color:#1a1206; border:none; background:linear-gradient(135deg,#ffcf2e,#f2b705); }
        .lp-mock-hint { text-align:center; margin:14px 0 0; font-size:13px; color:#8fa9a7; }
        #lpPrintDoc { display:none; }
        @media print {
            html, body.lp-body { margin:0 !important; padding:0 !important; background:#fff !important; }
            body.lp-body > * { display:none !important; }
            body.lp-body > #lpPrintDoc { display:block !important; }
            #lpPrintDoc .lp-receipt { width:auto !important; max-width:300px; margin:0; padding:4px 8px;
                box-shadow:none !important; border-radius:0 !important; position:static; color:#000; }
            #lpPrintDoc .lp-receipt::after { display:none !important; }
        }
        
* { box-sizing:border-box; }
html, body { margin:0; padding:0; background:#0e2b2e; font:16px/1.5 Arial,Helvetica,sans-serif; }
.lp-mock { margin:0; max-width:none; perspective:none; }
.lp-mock-win { border-radius:0; box-shadow:none; }
.lp-mock-body { grid-template-columns:minmax(0,1fr) 220px; min-height:390px; }
.lp-mock-grid { gap:10px; padding:16px; align-content:start; }
.lp-mp { min-width:0; }
.lp-mp .img { height:65px; font-size:32px; }
.lp-mp b, .lp-mp span, .lp-ci, .lp-mock-cart h4, .lp-empty, .lp-tk-btn { font-size:14px; }
.lp-empty { color:#a9c2c0; }
.lp-ci { gap:10px; }
.lp-ci b { white-space:nowrap; }
.lp-mock-hint { margin:0; padding:14px 18px; color:#b9cfcd; font-size:13px; }
.lp-print { justify-content:flex-start; padding:24px 18px; }
.lp-receipt-wrap { margin:auto 0; }
.lp-print-load { margin:auto 0; }
.lp-receipt { font-size:14px; }
.lp-receipt .tk-sub, .lp-receipt .tk-ty { font-size:12px; }
button:focus-visible { outline:3px solid #f2b705; outline-offset:3px; }
@media(max-width:600px) {
 .lp-mock-body { grid-template-columns:1fr; }
 .lp-mock-grid { grid-template-columns:repeat(3,minmax(0,1fr)); padding:12px; gap:8px; }
 .lp-mp { padding:8px; }
 .lp-mp .img { height:42px; }
 .lp-mock-cart { min-height:190px; padding:16px; }
}
@media(max-width:350px) { .lp-mock-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(prefers-reduced-motion:reduce) { *, *::before, *::after { animation:none !important; transition:none !important; } }