.sc-demo{--sc-bg-screen: #0d1117;--sc-bg-card: #151b23;--sc-border-card: #1e2a35;--sc-accent: #5eead4;--sc-accent-dim: rgba(94, 234, 212, .15);--sc-text-primary: #e2e8f0;--sc-text-secondary: #6b7280;--sc-text-muted: #4b5563;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.sc-demo--light{--sc-bg-screen: #f8fafc;--sc-bg-card: #ffffff;--sc-border-card: #e2e8f0;--sc-accent: #14b8a6;--sc-accent-dim: rgba(20, 184, 166, .1);--sc-text-primary: #1e293b;--sc-text-secondary: #64748b;--sc-text-muted: #94a3b8}.sc-phone-wrapper{position:relative;display:flex;justify-content:center;padding:20px}.sc-phone-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:280px;height:500px;background:radial-gradient(ellipse,rgba(94,234,212,.2) 0%,transparent 70%);filter:blur(40px);pointer-events:none;z-index:0}.sc-phone-frame{position:relative;background:#1a1a1a;border-radius:36px;padding:8px;box-shadow:0 25px 50px -12px #00000080,inset 0 1px #ffffff1a;z-index:1}.sc-phone-btn{position:absolute;background:#2a2a2a;border-radius:2px}.sc-phone-btn--vol-up{left:-3px;top:80px;width:3px;height:28px}.sc-phone-btn--vol-down{left:-3px;top:120px;width:3px;height:28px}.sc-phone-btn--power{right:-3px;top:100px;width:3px;height:40px}.sc-phone-screen{position:relative;width:280px;aspect-ratio:9 / 20;background:var(--sc-bg-screen);border-radius:28px;overflow:hidden;display:flex;flex-direction:column}.sc-phone-screen--light{background:var(--sc-bg-screen)}.sc-phone-gesture-bar{position:absolute;bottom:6px;left:50%;transform:translate(-50%);width:100px;height:4px;background:#ffffff4d;border-radius:2px}.sc-demo--light .sc-phone-gesture-bar{background:#0003}.sc-status-bar{display:flex;align-items:center;justify-content:space-between;padding:4px 12px;height:24px;font-size:11px;color:var(--sc-text-primary)}.sc-status-bar__left{display:flex;align-items:center;gap:6px}.sc-status-bar__time{font-weight:500}.sc-status-bar__notifs{display:flex;gap:3px}.sc-status-bar__icon{width:12px;height:12px;color:var(--sc-text-secondary)}.sc-status-bar__center{position:absolute;left:50%;transform:translate(-50%)}.sc-status-bar__punch-hole{width:10px;height:10px;background:#000;border-radius:50%}.sc-status-bar__right{display:flex;align-items:center;gap:4px}.sc-status-bar__battery{width:18px;height:9px;border:1px solid var(--sc-text-secondary);border-radius:2px;padding:1px;position:relative}.sc-status-bar__battery:after{content:"";position:absolute;right:-3px;top:50%;transform:translateY(-50%);width:2px;height:4px;background:var(--sc-text-secondary);border-radius:0 1px 1px 0}.sc-status-bar__battery-fill{width:80%;height:100%;background:var(--sc-text-primary);border-radius:1px}.sc-app-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid var(--sc-border-card)}.sc-app-header__title{font-size:14px;font-weight:600;color:var(--sc-text-primary)}.sc-app-header__actions{display:flex;gap:2px}.sc-app-header__btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:6px;color:var(--sc-text-secondary);cursor:pointer}.sc-app-header__btn svg{width:16px;height:16px}.sc-app-header__btn:hover{background:var(--sc-accent-dim)}.sc-app-content{flex:1;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:8px}.sc-app-content::-webkit-scrollbar{width:0}.sc-stats-card{background:var(--sc-bg-card);border:1px solid var(--sc-border-card);border-radius:12px;padding:10px}.sc-stats-card__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.sc-stats-card__period{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--sc-text-secondary)}.sc-stats-card__dot{width:8px;height:8px;border:1.5px solid var(--sc-accent);border-radius:50%}.sc-stats-card__chevron{width:10px;height:10px}.sc-stats-card__actions{display:flex;gap:4px}.sc-stats-card__btn{font-size:10px;background:transparent;border:none;color:var(--sc-text-muted);cursor:pointer;padding:2px}.sc-stats-card__stats{display:flex;justify-content:space-around;margin-bottom:8px}.sc-stats-card__stat{text-align:center}.sc-stats-card__stat-value{display:block;font-size:12px;font-weight:600;color:var(--sc-text-primary)}.sc-stats-card__stat-label{font-size:9px;color:var(--sc-text-muted);text-transform:uppercase}.sc-stats-card__chart{height:50px;margin-bottom:6px}.sc-stats-card__chart-svg{width:100%;height:40px;color:var(--sc-text-secondary)}.sc-stats-card__chart-labels{display:flex;justify-content:space-between;font-size:8px;color:var(--sc-text-muted);padding:0 4px}.sc-stats-card__legend{display:flex;justify-content:center;gap:16px}.sc-stats-card__legend-item{display:flex;align-items:center;gap:4px;font-size:9px;color:var(--sc-text-secondary)}.sc-stats-card__legend-dot{width:8px;height:3px;background:var(--sc-accent);border-radius:1px}.sc-stats-card__legend-dot--dashed{background:repeating-linear-gradient(90deg,var(--sc-accent) 0px,var(--sc-accent) 2px,transparent 2px,transparent 4px)}.sc-obd-card{background:var(--sc-bg-card);border:1px solid var(--sc-border-card);border-radius:12px;padding:10px}.sc-obd-card__status{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.sc-obd-card__status-left{display:flex;align-items:center;gap:6px}.sc-obd-card__bolt{width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:10px;background:var(--sc-accent-dim);border-radius:50%}.sc-obd-card__status-text{font-size:11px;font-weight:500;color:var(--sc-text-primary)}.sc-obd-card__status-ready{font-size:10px;color:var(--sc-text-muted)}.sc-obd-card__status-right{display:flex;align-items:center;gap:6px}.sc-obd-card__connect-btn{font-size:10px;font-weight:500;padding:4px 10px;background:var(--sc-accent);color:#000;border:none;border-radius:6px;cursor:pointer}.sc-obd-card__heart-btn{font-size:12px;background:transparent;border:none;color:var(--sc-text-muted);cursor:pointer}.sc-obd-card__car-container{position:relative;height:80px;display:flex;align-items:center;justify-content:center}.sc-obd-card__car-svg{width:180px;height:70px}.sc-obd-card__corner-icons{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.sc-obd-card__corner-icon{position:absolute;font-size:12px;opacity:.5}.sc-obd-card__corner-icon--tl{top:0;left:8px}.sc-obd-card__corner-icon--tr{top:0;right:8px}.sc-obd-card__corner-icon--bl{bottom:0;left:8px}.sc-obd-card__corner-icon--br{bottom:0;right:8px}.sc-vehicle-selector{display:flex;align-items:center;justify-content:space-between;background:var(--sc-bg-card);border:1px solid var(--sc-border-card);border-radius:12px;padding:10px 12px}.sc-vehicle-selector__left{display:flex;align-items:center;gap:8px}.sc-vehicle-selector__avatar{font-size:14px}.sc-vehicle-selector__name{font-size:12px;font-weight:500;color:var(--sc-text-primary)}.sc-vehicle-selector__chevron{width:10px;height:10px;color:var(--sc-text-muted)}.sc-vehicle-selector__right{display:flex;gap:8px}.sc-vehicle-selector__btn{font-size:12px;background:transparent;border:none;color:var(--sc-text-muted);cursor:pointer}.sc-eco-gauge{display:flex;justify-content:space-around;background:var(--sc-bg-card);border:1px solid var(--sc-border-card);border-radius:12px;padding:12px 8px}.sc-eco-gauge__item{display:flex;flex-direction:column;align-items:center}.sc-eco-gauge__label{font-size:8px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--sc-text-muted);margin-bottom:4px}.sc-eco-gauge__arc-container{position:relative;width:90px;height:70px}.sc-eco-gauge__svg{width:100%;height:100%}.sc-eco-gauge__value-container{position:absolute;bottom:8px;left:50%;transform:translate(-50%);text-align:center}.sc-eco-gauge__value{display:block;font-size:24px;font-weight:700;color:var(--sc-text-primary);line-height:1}.sc-eco-gauge__value--small{font-size:20px}.sc-eco-gauge__max{font-size:10px;color:var(--sc-text-muted)}.sc-badge-progress{display:flex;align-items:center;gap:8px;background:var(--sc-bg-card);border:1px solid var(--sc-border-card);border-radius:12px;padding:10px 12px}.sc-badge-progress__icon{width:18px;height:18px;color:#cd7f32;flex-shrink:0}.sc-badge-progress__label{font-size:11px;font-weight:500;color:var(--sc-text-primary);white-space:nowrap}.sc-badge-progress__bar{flex:1;height:6px;background:var(--sc-border-card);border-radius:3px;overflow:hidden;min-width:60px}.sc-badge-progress__bar-fill{height:100%;background:linear-gradient(90deg,#cd7f32,#e8a849);border-radius:3px;transition:width .3s ease}.sc-badge-progress__km{font-size:10px;font-weight:600;color:var(--sc-text-muted);white-space:nowrap}.sc-last-movement{background:var(--sc-bg-card);border:1px solid var(--sc-border-card);border-radius:12px;padding:10px}.sc-last-movement__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.sc-last-movement__title{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--sc-text-muted)}.sc-last-movement__time{font-size:9px;color:var(--sc-text-secondary)}.sc-last-movement__content{display:flex;align-items:center;gap:10px}.sc-last-movement__map{width:60px;height:50px;background:var(--sc-accent-dim);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;overflow:hidden}.sc-last-movement__map-svg{width:100%;height:100%}.sc-last-movement__details{flex:1;display:flex;flex-direction:column;gap:2px}.sc-last-movement__route{font-size:11px;font-weight:500;color:var(--sc-text-primary);line-height:1.3}.sc-last-movement__stats{display:flex;gap:12px;margin-top:4px}.sc-last-movement__stat{display:flex;align-items:center;gap:4px;font-size:9px;color:var(--sc-text-secondary)}.sc-last-movement__stat-icon{width:10px;height:10px;color:var(--sc-accent)}.sc-last-movement__arrow{width:16px;height:16px;color:var(--sc-text-muted);flex-shrink:0}@media (max-width: 360px){.sc-phone-wrapper{padding:10px}.sc-phone-screen{width:260px}}
