:root{--blue: #006cff;--green: #18b26b;--yellow: #ffc533;--graphite: #15171a;--muted: #687284;--line: #dce4ef;--bg: #f3f6fa;--white: #ffffff;color:var(--graphite);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:var(--bg)}button{font:inherit}button:disabled{cursor:not-allowed;opacity:.62}.field{display:grid;gap:6px;margin-bottom:12px}.field span{color:#2d3542;font-size:12px;font-weight:850}.field input{width:100%;min-height:46px;border:1px solid #d8e1ee;border-radius:10px;padding:10px 12px;color:var(--graphite);background:#fbfdff;font:inherit;font-size:14px;outline:none}.field input:focus{border-color:#006cffb8;box-shadow:0 0 0 3px #006cff1f}.page{min-height:100vh;padding:24px;display:grid;grid-template-columns:minmax(280px,390px) minmax(300px,1fr);gap:28px;align-items:start}.phone{width:min(100%,390px);min-height:780px;background:var(--white);border:1px solid rgba(21,23,26,.12);border-radius:30px;overflow:hidden;box-shadow:0 24px 80px #15171a2e}.hero{position:relative;min-height:290px;padding:22px;color:var(--white);background:linear-gradient(180deg,#006cff33,#006cffd1),url(/en-3-min-concepto-marca.png) center / cover}.statusbar{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:700;margin-bottom:22px}.brand{display:inline-flex;align-items:center;gap:8px;font-weight:900;padding:7px 10px;border-radius:999px;background:#15171a61;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.bolt{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--yellow);color:var(--graphite);font-size:15px}h1{margin:46px 0 6px;font-size:58px;line-height:.92;letter-spacing:0}.hero p{margin:0;max-width:280px;font-size:16px;line-height:1.36;font-weight:650}.content{padding:18px;display:grid;gap:14px;background:linear-gradient(180deg,#fff,#f8fbff)}.quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.btn{border:0;border-radius:12px;padding:14px 12px;font-weight:800;font-size:14px;min-height:48px;cursor:pointer}.btn.primary{background:var(--blue);color:var(--white)}.btn.secondary{background:#eaf2ff;color:var(--blue)}.btn.full{width:100%}.mini-btn{border:1px solid #d8e1ee;border-radius:999px;min-height:32px;padding:5px 10px;color:var(--blue);background:#eef6ff;font-size:12px;font-weight:900;cursor:pointer}.panel{border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--white)}.panel-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;font-weight:850}.customer-panel{display:grid;gap:12px;border-color:#18b26b3d}.auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.auth-actions{display:grid;grid-template-columns:1fr 96px 1fr;gap:9px;align-items:end}.field.compact{margin-bottom:0}.customer-card{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px;border:1px solid #e5ebf4;border-radius:12px;background:#f3fff8}.customer-card strong,.customer-card span{display:block}.customer-card span{margin-top:3px;color:var(--muted);font-size:12px;font-weight:800}.plate-list{display:flex;flex-wrap:wrap;gap:8px}.plate-chip{min-height:30px;border:1px solid rgba(0,108,255,.28);border-radius:999px;padding:5px 10px;background:#eef6ff;color:var(--blue);font-size:12px;font-weight:950;cursor:pointer}.qr-title{margin-bottom:4px}.badge{display:inline-flex;align-items:center;min-height:26px;padding:4px 9px;border-radius:999px;background:#18b26b1f;color:#087a46;font-size:12px;font-weight:850;white-space:nowrap}.plate{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border-radius:12px;background:#f7f9fc;border:1px solid #e5ebf4}.plate.live{margin-top:12px;border-color:#18b26b47;background:#f3fff8}.plate-code{font-size:22px;font-weight:950;letter-spacing:0}.muted{color:var(--muted);font-size:13px;line-height:1.35}.services{display:grid;gap:10px}.loyalty-panel{border-color:#18b26b3d}.loyalty-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.loyalty-metrics>div{min-height:68px;display:grid;align-content:center;gap:4px;padding:10px;border:1px solid #e5ebf4;border-radius:12px;background:#fbfdff}.loyalty-metrics strong{color:var(--blue);font-size:18px;font-weight:950}.loyalty-metrics span,.tier span,.plan-row span{color:var(--muted);font-size:11px;line-height:1.25;font-weight:800}.tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}.tier{min-height:58px;display:grid;align-content:center;gap:3px;padding:9px;border:1px solid #e5ebf4;border-radius:12px;background:#fbfdff}.tier.active{border-color:#18b26b61;background:#f0fff6}.tier strong{font-size:12px;font-weight:950}.plan-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:11px 0;border-top:1px solid #edf2f8}.plan-row:first-of-type{border-top:0;padding-top:0}.plan-row strong{display:block;margin-bottom:3px;font-size:14px}.renew-toggle{width:100%;min-height:42px;display:flex;align-items:center;gap:9px;margin-top:8px;border:1px solid #d8e1ee;border-radius:12px;padding:8px 10px;background:#fbfdff;color:#2d3542;font-size:12px;font-weight:900;cursor:pointer}.renew-toggle span{width:38px;height:22px;border-radius:999px;background:#d8e1ee;position:relative;flex:0 0 auto}.renew-toggle span:after{content:"";position:absolute;width:16px;height:16px;top:3px;left:3px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #15171a33}.renew-toggle.active span{background:#18b26b59}.renew-toggle.active span:after{left:19px;background:var(--green)}.location-panel{display:grid;gap:12px;border-color:#006cff33}.map-preview{position:relative;min-height:148px;overflow:hidden;border:1px solid #dbe6f3;border-radius:12px;background:#edf5ff}.map-grid{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,rgba(0,108,255,.08) 1px,transparent 1px) 0 0 / 34px 34px,linear-gradient(rgba(0,108,255,.08) 1px,transparent 1px) 0 0 / 34px 34px}.map-road{position:absolute;border-radius:999px;background:#fff;box-shadow:0 0 0 1px #d8e1ee}.map-road.main{width:112%;height:24px;left:-18px;top:78px;transform:rotate(-11deg)}.map-road.side-a{width:82px;height:18px;left:38px;top:46px;transform:rotate(54deg)}.map-road.side-b{width:104px;height:18px;right:28px;bottom:34px;transform:rotate(48deg)}.map-pin{position:absolute;left:50%;top:46%;width:38px;height:38px;display:grid;place-items:center;border:3px solid #fff;border-radius:50% 50% 50% 12px;background:var(--yellow);color:var(--graphite);font-size:16px;font-weight:950;transform:translate(-50%,-50%) rotate(-45deg);box-shadow:0 10px 20px #15171a2e}.map-pin:first-letter{transform:rotate(45deg)}.location-main,.location-stats,.schedule-row{display:grid;align-items:center;gap:10px}.location-main{grid-template-columns:1fr auto}.location-main strong,.location-main span{display:block}.location-main span{margin-top:3px;color:var(--muted);font-size:12px;font-weight:800}.map-link{text-decoration:none}.location-stats{grid-template-columns:1fr 1fr}.location-stats>div{min-height:62px;display:grid;align-content:center;gap:4px;padding:10px;border:1px solid #e5ebf4;border-radius:12px;background:#fbfdff}.location-stats strong{color:var(--blue);font-size:17px;font-weight:950}.location-stats span{color:var(--muted);font-size:11px;font-weight:850}.schedule-list{display:grid;gap:8px}.schedule-row{grid-template-columns:1fr auto;min-height:34px;padding:7px 10px;border-radius:10px;background:#f7f9fc}.schedule-row span{color:#2d3542;font-size:12px;font-weight:850}.schedule-row strong{color:var(--graphite);font-size:12px;font-weight:950}.service{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:12px;border:1px solid #e5ebf4;border-radius:12px;background:#fbfdff}.service strong{display:block;margin-bottom:3px;font-size:15px}.price{color:var(--blue);font-weight:950;white-space:nowrap}.payment-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.payment{min-height:74px;display:grid;place-items:center;align-content:center;gap:6px;border:1px solid #e5ebf4;border-radius:12px;background:#fbfdff;font-size:12px;font-weight:900;color:#273142}.payment-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;color:#fff;font-size:13px;font-weight:950}.payment.wompi .payment-icon{background:linear-gradient(135deg,#6d4aff,#00a8ff)}.payment.pse .payment-icon{background:linear-gradient(135deg,#006cff,#18b26b)}.payment.nequi .payment-icon{background:linear-gradient(135deg,#ff2f92,#6d4aff)}.wash-timer{display:grid;gap:12px;border-color:#006cff38;background:linear-gradient(180deg,#f7fbff,#fff)}.timer-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.timer{font-size:48px;line-height:1;font-weight:950;color:var(--blue);letter-spacing:0}.timer.live-countdown{color:#087a46}.timer-label{display:grid;gap:3px}.position-ok{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:5px 10px;border-radius:999px;background:#18b26b1f;color:#087a46;font-size:12px;font-weight:900;white-space:nowrap}.phase-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.phase{min-height:74px;display:grid;align-content:center;gap:5px;padding:10px;border-radius:12px;border:1px solid #e5ebf4;background:#fbfdff}.phase.active{border-color:#006cff5c;background:#edf5ff}.phase.done{border-color:#18b26b57;background:#f0fff6}.phase.error{border-color:#cd38385c;background:#fff8f8}.phase strong{font-size:13px}.phase span{font-size:11px;color:var(--muted);font-weight:800}.phase em{width:-moz-fit-content;width:fit-content;min-height:20px;padding:3px 7px;border-radius:999px;background:#eef3fa;color:#445063;font-size:10px;font-style:normal;font-weight:950;text-transform:uppercase}.phase.active em{background:#006cff1f;color:var(--blue)}.phase.done em{background:#18b26b21;color:#087a46}.progress{height:8px;border-radius:999px;background:#e5ebf4;overflow:hidden}.progress>span{display:block;width:25%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--green))}.result{border-color:#006cff3d}.result.error{border-color:#cd38385c;background:#fff8f8}.result pre{max-height:220px;margin:0;overflow:auto;white-space:pre-wrap;word-break:break-word;color:#273142;font-size:12px;line-height:1.45}.qr{display:grid;grid-template-columns:86px 1fr;gap:12px;align-items:center}.qrbox{width:86px;height:86px;border-radius:12px;background:linear-gradient(90deg,#15171a 10px,transparent 10px) 0 0 / 20px 20px,linear-gradient(#15171a 10px,transparent 10px) 0 0 / 20px 20px,#fff;border:8px solid #fff;box-shadow:inset 0 0 0 1px #15171a,0 0 0 1px #dce4ef}.bottom-nav{height:70px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #e5ebf4;background:#fff}.nav-item{display:grid;place-items:center;align-content:center;gap:4px;color:var(--muted);font-size:11px;font-weight:800}.nav-icon{width:22px;height:22px;border-radius:7px;background:#d8e6fb}.nav-item.active{color:var(--blue)}.nav-item.active .nav-icon{background:var(--blue)}.side{display:grid;gap:16px}.side h2{margin:0;font-size:30px;letter-spacing:0}.side-card{padding:18px;border-radius:16px;border:1px solid var(--line);background:var(--white)}.flow{display:grid;gap:10px;margin:0;padding:0;list-style:none}.flow li{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:start;color:#2d3542;font-size:15px}.step{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:#fff;font-weight:900;font-size:13px}@media(max-width:840px){.page{grid-template-columns:1fr;padding:14px}.phone{margin-inline:auto;min-height:auto}.side h2{font-size:24px}}
