@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--size: 20px;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-height:100vh;background:#0f0f0f}@font-face{font-family:Geist;src:url(https://assets.codepen.io/605876/GeistVF.ttf) format("truetype")}.el{position:fixed;top:0;left:0;z-index:-2;background:conic-gradient(from 180deg at 50% 70%,#fafafa,#eec32d,#ec4b4b,#709ab9,#4dffbf,#fafafa 1turn);width:100%;height:100%;mask:radial-gradient(circle at 50% 50%,white 2px,transparent 2.5px) 50% 50% / var(--size) var(--size),url(https://assets.codepen.io/605876/noise-mask.png) 256px 50% / 256px 256px;-webkit-mask-composite:source-in;mask-composite:intersect;animation:flicker 20s infinite linear}h1.bg-text{position:fixed;top:50%;left:50%;translate:-50% -50%;margin:0;font-size:clamp(6rem,8vw + 1rem,14rem);font-family:Geist,sans-serif;font-weight:140;color:#050505;mix-blend-mode:soft-light;filter:drop-shadow(0 0 2px white);text-shadow:2px 2px white;z-index:-1;pointer-events:none}@keyframes flicker{to{-webkit-mask-position:50% 50%,0 50%;mask-position:50% 50%,0 50%}}@font-face{font-family:LCD-7-Segment;src:url(/fonts/MyBlueRoom/MyBlueRoom.ttf.woff) format("woff"),url(/fonts/MyBlueRoom/MyBlueRoom.ttf.svg#MyBlueRoom) format("svg"),url(/fonts/MyBlueRoom/MyBlueRoom.ttf.eot),url(/fonts/MyBlueRoom/MyBlueRoom.eot?#iefix) format("embedded-opentype");font-weight:400;font-style:normal}@font-face{font-family:LCD-Grid;src:url(/fonts/ericsson-ga628/EricssonGA628.woff) format("woff"),url(/fonts/ericsson-ga628/EricssonGA628.woff2) format("woff2");font-weight:400;font-style:normal}#root{max-width:100%;margin:0;padding:0;text-align:center}.dispensador-app{min-height:100vh;background:transparent;display:flex;flex-direction:column;align-items:center;padding:24px 16px;color:#1d1d1d;font-family:Inter,system-ui,-apple-system,sans-serif}.top-bar{width:100%;max-width:440px;display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.connection-indicator{display:flex;align-items:center;gap:8px}.connection-dot{width:8px;height:8px;border-radius:50%;background:#d32f2f;transition:background .3s ease;flex-shrink:0}.connection-indicator.connected .connection-dot{background:#2e7d32}.connection-label{font-size:13px;color:#e0e0e0;font-weight:500}.sync-btn{background:#ffffff1a;border:none;color:#e0e0e0;font-size:18px;width:40px;height:40px;border-radius:50%;cursor:pointer;transition:all .15s ease;display:flex;align-items:center;justify-content:center;line-height:1}.sync-btn:hover:not(:disabled){background:#fff3;color:#fff}.sync-btn:active:not(:disabled){background:#ffffff4d}.sync-btn:disabled{opacity:.3;cursor:not-allowed}.dispensador-body{background:#ffffff0d;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:28px 24px;box-shadow:0 8px 32px #0000004d;max-width:440px;width:100%;display:flex;flex-direction:column;align-items:center;gap:28px;transition:all .3s ease}.screen-frame{background:linear-gradient(180deg,#333,#111);padding:3px;border-radius:6px;box-shadow:0 1px 4px #00000080,inset 0 1px #ffffff1a}.screen-frame>pre{margin:0}.lcd-grid-panel{position:relative;text-align:left;white-space:pre-wrap;word-wrap:break-word;background-color:#1431ec;color:#d1e8f2;font-family:LCD-Grid;width:20ch;height:5.65ch;line-height:1;padding:.33em .33em .16em;font-size:30px;border-radius:.25ch;box-shadow:inset 0 0 5px #00000040,inset 5px 5px 10px #00000020,inset 5px 5px 20px #00000020,0 0 40px #3c51d340;margin:0}.lcd-panel{font-family:LCD-7-Segment;background:#1e2a1e;padding:16px 20px 12px;border-radius:4px;box-shadow:inset 0 2px 8px #0006;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-end;width:100%;box-sizing:border-box}.lcd-panel:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(255,255,255,.04) 0%,rgba(255,255,255,.01) 40%,transparent 60%,rgba(0,0,0,.06) 100%);pointer-events:none;z-index:3;border-radius:4px}.lcd-row{position:relative;font-size:52px;line-height:1.15;display:flex;align-items:baseline;justify-content:flex-end;width:100%}.lcd-row-sm{font-size:40px}.lcd-label{font-family:Inter,system-ui,sans-serif;font-size:11px;font-weight:600;color:#c8e6c880;letter-spacing:.3px;position:absolute;left:4px;text-transform:uppercase}.lcd-digits{position:relative;text-align:right}.lcd-ghost{color:#ffffff0a;text-shadow:none}.lcd-active{position:absolute;right:0;top:0;color:#00ff41;text-shadow:0 0 6px rgba(0,255,65,.6),0 0 15px rgba(0,255,65,.3),0 0 30px rgba(0,255,65,.1)}.cara-toggle-container{display:flex;background:#ffffff1a;border-radius:24px;padding:3px;width:fit-content}.cara-toggle-btn{padding:10px 32px;border:none;border-radius:20px;font-family:Inter,system-ui,sans-serif;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;background:transparent;color:#bbb}.cara-toggle-btn.active{background:#fff3;color:#fff;box-shadow:0 1px 3px #0000004d}.cara-toggle-btn:hover:not(:disabled):not(.active){color:#eaeaea}.cara-toggle-btn:disabled{opacity:.4;cursor:not-allowed}.status-display{text-align:center;min-height:48px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}.status-row{display:flex;align-items:center;gap:8px}.status-indicator{width:8px;height:8px;border-radius:50%;flex-shrink:0;background:#2e7d32;transition:background .3s ease}.status-indicator.active{background:#f9a825}.status-indicator.active.pulse{animation:pulse 1.5s ease-in-out infinite}.status-indicator.danger{background:#d32f2f}.status-text{margin:0;font-size:14px;font-weight:500;color:#fff}.status-text.pulse{animation:pulse 1.5s ease-in-out infinite}.sale-type-label{margin:0;font-size:13px;color:#bbb;font-weight:500}.sync-msg{font-size:12px;margin:0;color:#888}.sync-msg.error{color:#d32f2f}.sync-msg.warn{color:#f9a825}.vender-btn{width:100%;padding:16px;border:none;border-radius:12px;font-family:Inter,system-ui,sans-serif;font-size:15px;font-weight:600;letter-spacing:.3px;cursor:pointer;background:#2e7d32;color:#fff;transition:background .15s ease}.vender-btn:hover:not(:disabled){background:#256b29}.vender-btn:active:not(:disabled){background:#1b5e20}.vender-btn:disabled{background:#ffffff1a;color:#ffffff59;cursor:not-allowed}.parar-btn{width:100%;padding:16px;border:none;border-radius:12px;font-family:Inter,system-ui,sans-serif;font-size:14px;font-weight:600;cursor:pointer;background:#d32f2f;color:#fff;transition:background .15s ease;animation:fadeSlideIn .2s ease}.parar-btn:hover{background:#c62828}.parar-btn:active{background:#b71c1c}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (min-width: 768px){.top-bar{max-width:700px}.dispensador-body{max-width:700px;padding:40px;gap:40px}.connection-label{font-size:16px}.sync-btn{width:48px;height:48px;font-size:22px}.lcd-row{font-size:76px}.lcd-row-sm{font-size:58px}.lcd-label{font-size:14px;left:8px}.lcd-panel{padding:24px 30px 20px}.lcd-grid-panel{font-size:42px}.cara-toggle-btn{font-size:18px;padding:16px 48px}.status-text{font-size:18px}.sale-type-label{font-size:16px}.vender-btn{font-size:20px;padding:20px}.parar-btn{font-size:18px;padding:20px}.copyright-footer{font-size:18px;bottom:24px;right:32px}}.copyright-footer{position:fixed;bottom:16px;right:24px;font-family:Inter,system-ui,sans-serif;font-size:15px;color:#fff6;font-weight:500;pointer-events:none;z-index:10;letter-spacing:.5px}