:root{--color-bg: #f0fdfa;--color-bg-card: #ffffff;--color-primary: #0d9488;--color-primary-dark: #0f766e;--color-accent: #0284c7;--color-accent-light: #38bdf8;--color-text: #134e4a;--color-text-muted: #5eead4;--color-text-secondary: #64748b;--color-border: #99f6e4;--color-danger: #dc2626;--color-success: #16a34a;--shadow: 0 4px 20px rgba(13, 148, 136, .12);--radius: 16px;--radius-sm: 10px;--font: "DM Sans", system-ui, sans-serif;--touch-min: 48px}*,*:before,*:after{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:var(--font);background:linear-gradient(160deg,#ecfdf5 0%,#e0f2fe 50%,#f0fdfa 100%);color:var(--color-text);-webkit-font-smoothing:antialiased}a{color:var(--color-accent);text-decoration:none}button,input,select,textarea{font-family:inherit;font-size:1rem}.page-loading{display:flex;align-items:center;justify-content:center;min-height:100vh;color:var(--color-primary);font-weight:600}.payment-form{margin-top:1rem}.stripe-element-wrap{min-height:120px;padding:.75rem 0}.payment-total{text-align:center;margin:1rem 0;font-weight:600;font-size:1.125rem}.wallet-card{text-align:center}.wallet-balance-display{font-size:2rem;font-weight:700;color:var(--color-primary);margin:1rem 0 1.25rem}.wallet-balance-line{text-align:center;margin-bottom:1rem;color:var(--color-text-secondary)}.wallet-amount-chips{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}.wallet-amount-chip{flex:1;min-width:4rem;padding:.6rem .75rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);font-weight:600;cursor:pointer}.wallet-amount-chip.active{border-color:var(--color-primary);background:#ecfdf5;color:var(--color-primary)}.payment-method-actions{display:flex;flex-direction:column;gap:.75rem}.payment-method-hint{font-size:.875rem;color:var(--color-text-secondary);text-align:center;margin:0}.payment-method-hint a{color:var(--color-primary);font-weight:600}.stripe-setup-notice{background:#ecfdf5;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:1rem;margin-bottom:1rem;font-size:.875rem;line-height:1.5}.stripe-setup-notice code{font-size:.8rem;background:rgba(13,148,136,.1);padding:.1rem .35rem;border-radius:4px}.app-shell{min-height:100vh;display:flex;flex-direction:column;max-width:480px;margin:0 auto;padding-bottom:80px}.app-header{padding:1rem 1.25rem;display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.85);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:10}.logo{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:1.25rem;color:var(--color-primary-dark)}.logo-icon{width:36px;height:36px;background:linear-gradient(135deg,var(--color-primary),var(--color-accent));border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem}.app-main{flex:1;padding:1.25rem}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;display:flex;background:white;border-top:1px solid var(--color-border);box-shadow:0 -4px 20px #0000000f;z-index:20}.nav-link{flex:1;display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.75rem .5rem;color:var(--color-text-secondary);font-size:.75rem;font-weight:500;min-height:var(--touch-min);transition:color .2s}.nav-link.active{color:var(--color-primary)}.nav-link span:first-child{font-size:1.25rem}.card{background:var(--color-bg-card);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow);border:1px solid var(--color-border);margin-bottom:1rem}.card-title{margin:0 0 .5rem;font-size:1.125rem;font-weight:600}.card-subtitle{margin:0 0 1rem;color:var(--color-text-secondary);font-size:.875rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:var(--touch-min);padding:.75rem 1.5rem;border:none;border-radius:var(--radius-sm);font-weight:600;cursor:pointer;transition:transform .15s,box-shadow .15s;width:100%}.btn:active{transform:scale(.98)}.btn-primary{background:linear-gradient(135deg,var(--color-primary),var(--color-accent));color:#fff;box-shadow:0 4px 14px #0d948859}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:white;color:var(--color-primary);border:2px solid var(--color-primary)}.btn-danger{background:var(--color-danger);color:#fff}.btn-ghost{background:transparent;color:var(--color-text-secondary);width:auto;padding:.5rem;min-height:auto}.form-group{margin-bottom:1rem}.form-group label{display:block;margin-bottom:.375rem;font-weight:500;font-size:.875rem}.form-group input,.form-group select{width:100%;min-height:var(--touch-min);padding:.75rem 1rem;border:2px solid var(--color-border);border-radius:var(--radius-sm);background:white;color:var(--color-text)}.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--color-primary)}.error-banner{background:#fef2f2;color:var(--color-danger);padding:.75rem 1rem;border-radius:var(--radius-sm);margin-bottom:1rem;font-size:.875rem}.success-banner{background:#f0fdf4;color:var(--color-success);padding:.75rem 1rem;border-radius:var(--radius-sm);margin-bottom:1rem;font-size:.875rem}.badge{display:inline-block;padding:.25rem .625rem;border-radius:999px;font-size:.75rem;font-weight:600}.badge-online{background:#dcfce7;color:var(--color-success)}.badge-offline{background:#f1f5f9;color:var(--color-text-secondary)}.badge-charging{background:#dbeafe;color:var(--color-accent)}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:1rem 0}.stat-box{background:var(--color-bg);border-radius:var(--radius-sm);padding:1rem;text-align:center}.stat-value{font-size:1.5rem;font-weight:700;color:var(--color-primary-dark)}.stat-label{font-size:.75rem;color:var(--color-text-secondary);margin-top:.25rem}.auth-page{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;max-width:400px;margin:0 auto}.auth-card{width:100%;background:white;border-radius:var(--radius);padding:2rem 1.5rem;box-shadow:var(--shadow);border:1px solid var(--color-border)}.auth-card h1{margin:0 0 .25rem;text-align:center;font-size:1.75rem}.auth-card .subtitle{text-align:center;color:var(--color-text-secondary);margin-bottom:1.5rem}.auth-footer{text-align:center;margin-top:1.5rem;font-size:.875rem;color:var(--color-text-secondary)}.car-item{display:flex;align-items:center;justify-content:space-between;padding:1rem 0;border-bottom:1px solid var(--color-border)}.car-item:last-child{border-bottom:none}.car-plate{font-weight:700;font-size:1.125rem;letter-spacing:.05em}.qr-reader{width:100%;min-height:260px;max-height:min(60vh,420px);border-radius:var(--radius);overflow:hidden;margin-bottom:1rem;position:relative;background:#0f172a}.qr-reader video{width:100%!important;height:auto!important;max-height:min(60vh,420px);object-fit:cover;display:block;border-radius:var(--radius)}.qr-reader video~video{display:none!important}.qr-reader #qr-shaded-region{border-radius:var(--radius)}.manual-qr{margin-top:1rem;padding-top:1rem;border-top:1px dashed var(--color-border)}.badge{display:inline-block;padding:.2rem .55rem;border-radius:999px;font-size:.75rem;font-weight:600;white-space:nowrap}.badge-success{background:#dcfce7;color:#166534}.badge-warning{background:#fef9c3;color:#854d0e}.badge-danger{background:#fee2e2;color:#991b1b}.badge-muted{background:#f1f5f9;color:#64748b}.history-item{padding:1rem 0;border-bottom:1px solid var(--color-border)}.history-item:last-child{border-bottom:none;padding-bottom:0}.history-item-header{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem;margin-bottom:.5rem}.history-item-title{font-weight:600;font-size:.95rem}.history-item-meta{font-size:.8rem;color:var(--color-text-secondary);margin-top:.15rem}.history-item-stats{display:flex;justify-content:space-between;font-size:.9rem;font-weight:600;margin-bottom:.35rem}.history-item-payment{font-size:.8rem;color:var(--color-text-secondary);margin-bottom:.5rem}.history-payment-id{font-family:ui-monospace,monospace}.history-item-actions{display:flex;gap:.5rem;flex-wrap:wrap}.history-pay-btn{width:auto;min-height:auto;padding:.45rem .9rem;font-size:.875rem}.charging-pulse{width:80px;height:80px;margin:1rem auto;border-radius:50%;background:linear-gradient(135deg,var(--color-primary),var(--color-accent));animation:pulse 2s ease-in-out infinite;display:flex;align-items:center;justify-content:center;font-size:2rem}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.08);opacity:.85}}.empty-state{text-align:center;padding:2rem 1rem;color:var(--color-text-secondary)}.empty-state p{margin-bottom:1rem}
