:root,:root[data-theme=dark]{--bg:#0b0e14;--card:#151a23;--card-2:#1c2230;--border:#283142;--text:#e6eaf0;--muted:#8b94a7;--accent:#3b82f6;--good:#22c55e;--warn:#f59e0b;--bad:#ef4444}:root[data-theme=light]{--bg:#f4f6fa;--card:#ffffff;--card-2:#eef1f6;--border:#d8dee8;--text:#1a2030;--muted:#5d6678;--accent:#2563eb;--good:#16a34a;--warn:#d97706;--bad:#dc2626}*{box-sizing:border-box}body,html{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans Thai,sans-serif}a{color:var(--accent)}.container{max-width:1000px;margin:0 auto;padding:24px 16px 64px}.header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:20px}.title{font-size:22px;font-weight:700;margin:0}.subtitle{color:var(--muted);font-size:13px;margin:2px 0 0}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));grid-gap:14px;gap:14px}.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px}.card h3{margin:0 0 12px;font-size:13px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.metric{font-size:28px;font-weight:700;line-height:1.1}.metric small{font-size:14px;font-weight:500;color:var(--muted)}.row{display:flex;justify-content:space-between;padding:6px 0;font-size:14px;border-bottom:1px solid var(--border)}.row:last-child{border-bottom:none}.row span:first-child{color:var(--muted)}.battery-track{height:10px;border-radius:999px;background:var(--card-2);overflow:hidden;margin-top:10px}.battery-fill{height:100%;border-radius:999px;transition:width .4s ease}.btn{background:var(--accent);color:white;border:none;border-radius:10px;padding:10px 16px;font-size:14px;font-weight:600;cursor:pointer}.btn.secondary{background:var(--card-2);color:var(--text);border:1px solid var(--border)}.btn:disabled{opacity:.5;cursor:not-allowed}.pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--card-2);border:1px solid var(--border);color:var(--text)}button.pill{cursor:pointer;font-family:inherit}.dot{width:8px;height:8px;border-radius:50%;background:var(--muted)}.dot.online{background:var(--good)}.dot.asleep{background:var(--warn)}.dot.offline{background:var(--bad)}.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:18px}select{color:var(--text);border:1px solid var(--border);border-radius:10px;padding:9px 12px;font-size:14px}.notice,select{background:var(--card)}.notice{border:1px solid var(--border);border-radius:14px;padding:24px;text-align:center}.error{color:var(--bad);font-size:13px}label.check{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);cursor:pointer}.tabs{display:flex;gap:6px;margin-bottom:16px;border-bottom:1px solid var(--border);overflow-x:auto;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tab{background:none;color:var(--muted);font-size:15px;font-weight:600;padding:10px 16px;cursor:pointer;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;flex-shrink:0}.tab.active{color:var(--text);border-bottom-color:var(--accent)}.segmented{display:inline-flex;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:3px;gap:2px}.seg{background:none;border:none;color:var(--muted);font-size:13px;font-weight:600;padding:7px 14px;border-radius:8px;cursor:pointer}.seg.active{background:var(--accent);color:white}.stat-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));margin-bottom:14px}.hint{color:var(--muted);font-size:12px;margin-top:6px}.chart-card{margin-bottom:14px}.chart{width:100%;height:auto;display:block}.chart-grid{stroke:var(--border);stroke-width:1}.chart-label{fill:var(--muted);font-size:11px}.chart-empty{color:var(--muted);font-size:13px;padding:24px 0;text-align:center}.chart-wrap{position:relative}.chart-cursor{stroke:var(--muted);stroke-width:1;stroke-dasharray:3 3}.chart-tip{position:absolute;top:4px;transform:translateX(-50%);background:var(--card);border:1px solid var(--border);border-radius:8px;padding:5px 9px;font-size:12px;pointer-events:none;white-space:nowrap;box-shadow:0 3px 10px rgba(0,0,0,.3);z-index:3}.chart-tip-time{color:var(--muted);font-size:11px;margin-bottom:2px}.chart-tip-row{display:flex;align-items:center;gap:6px;font-weight:700}.chart-tip-dot{width:8px;height:8px;border-radius:50%}.legend{display:flex;gap:16px;margin-top:10px;font-size:12px;color:var(--muted)}.legend span{display:inline-flex;align-items:center;gap:6px}.legend i{width:12px;height:3px;border-radius:2px;display:inline-block}code{border:1px solid var(--border);border-radius:5px;padding:1px 5px;font-size:.9em}.map,code{background:var(--card-2)}.map{width:100%;height:380px;border-radius:12px;overflow:hidden}.map-loading{display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:14px}.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--card);color:var(--text)}.leaflet-container{font-family:inherit}.leaflet-tooltip.trip-tip{background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:8px;font-size:12px;font-weight:600;padding:4px 9px;box-shadow:0 2px 8px rgba(0,0,0,.3);white-space:nowrap}.leaflet-tooltip.trip-tip:before{display:none}.trip-row{display:block;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--border);padding:10px 4px;cursor:pointer;color:var(--text)}.trip-row:last-child{border-bottom:none}.trip-row.selected,.trip-row:hover{background:var(--card-2);border-radius:8px}.trip-main{display:flex;justify-content:space-between;align-items:center}.trip-dist{font-weight:700;font-size:15px}.trip-time{color:var(--muted);font-size:13px}.trip-sub{color:var(--muted);font-size:12px;margin-top:3px}.badge{display:inline-block;background:var(--warn);color:#1a1200;font-size:11px;font-weight:700;padding:1px 6px;border-radius:6px;margin-left:6px}.badge.ac{background:var(--good);color:#04220f;margin-left:0}.badge.dc{background:var(--accent);color:#fff;margin-left:0}.poller-pill{cursor:pointer}.field{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}.field:last-of-type{border-bottom:none}.field-label{font-size:14px}.field input{width:110px;text-align:right}.logs{margin-top:12px;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px;font-size:11px;line-height:1.5;color:var(--muted);max-height:180px;overflow:auto;white-space:pre-wrap}.ring-text{fill:var(--text);font-size:26px;font-weight:700}.map-live{height:100%;min-height:300px}.health-row{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.health-deg{text-align:center;min-width:130px}.deg-num{font-size:44px;font-weight:800;color:var(--warn);line-height:1}.health-range{flex:1 1;min-width:220px}.accent-text{color:var(--accent);font-weight:700}.ratio-bar{display:flex;height:30px;border-radius:8px;overflow:hidden;background:var(--card-2);font-size:12px;font-weight:700;color:#fff}.ratio-ac{background:var(--good)}.ratio-ac,.ratio-dc{display:flex;align-items:center;justify-content:center;min-width:0}.ratio-dc{background:var(--accent)}.place-namer{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--border);flex-wrap:wrap}.place-namer .hint{flex:1 1;min-width:140px;margin-top:0}.place-namer input{flex:1 1;min-width:120px}.btn-link{background:none;border:none;color:var(--bad);cursor:pointer;font-size:13px}.trip-route{font-size:13px;color:var(--text);margin-top:2px}.theme-toggle{cursor:pointer}input{font-size:14px}input,textarea{background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:8px 10px}textarea{font-size:13px;resize:vertical}.car-hero{position:relative;background:linear-gradient(180deg,var(--card) 0,var(--card-2) 100%);border:1px solid var(--border);border-radius:16px;padding:14px 16px 16px;margin-bottom:16px;overflow:hidden;text-align:center}.car-glow{position:absolute;top:44%;left:50%;width:80%;height:60%;transform:translate(-50%,-50%);background:radial-gradient(ellipse at center,rgba(216,24,42,.3),transparent 62%);pointer-events:none}.car-stage{position:relative;display:flex;justify-content:center}.car-svg{height:auto}.car-photo,.car-svg{position:relative;display:block;width:100%;max-width:600px}.car-photo{max-height:230px;margin:0 auto;object-fit:contain;border-radius:10px}.car-name{font-size:19px;font-weight:700;color:var(--text)}.car-name,.car-sub{position:relative;margin-top:2px}.car-sub{font-size:12px;color:var(--muted);letter-spacing:.02em}.car-strip{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:12px}.car-stat{display:inline-flex;align-items:center;gap:6px;background:var(--card-2);border:1px solid var(--border);border-radius:999px;padding:5px 12px;font-size:13px;font-weight:600;color:var(--text)}.car-stat.charging{background:rgba(34,197,94,.15);border-color:var(--good);color:var(--good)}.detail-head{display:flex;align-items:center;justify-content:space-between}.detail-head h3{margin:0}.waypoints{max-height:230px;overflow:auto;border:1px solid var(--border);border-radius:8px}.wp{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 10px;font-size:12px;color:var(--muted);border-bottom:1px solid var(--border)}.wp:last-child{border-bottom:none}.wp a{color:var(--accent);white-space:nowrap}.wp span:first-child{min-width:42px}.pager{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:12px;font-size:13px;color:var(--muted)}.pager .btn{padding:4px 14px;font-size:16px}.place-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--border);flex-wrap:wrap}.place-row:last-of-type{border-bottom:none}.place-info{font-size:14px}.place-name-input{display:flex;gap:6px}.place-name-input input{width:140px}.charge-prog{position:relative;height:16px;border-radius:999px;background:var(--card-2);overflow:hidden;margin-top:4px}.charge-prog-fill{height:100%;background:var(--good);border-radius:999px;transition:width .5s ease}.charge-prog-limit{position:absolute;top:-2px;width:2px;height:20px;background:var(--text);transform:translateX(-1px)}.warn-row{display:flex;align-items:center;gap:8px;padding:7px 0;font-size:14px;border-bottom:1px solid var(--border)}.warn-row:last-child{border-bottom:none}.warn-dot{width:8px;height:8px;border-radius:50%;flex:none}.warn-dot.bad{background:var(--bad)}.warn-dot.warn{background:var(--warn)}.warn-dot.info{background:var(--accent)}.maint-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--border)}.maint-row:last-child{border-bottom:none}.maint-info{display:flex;flex-direction:column;gap:2px;font-size:14px}.maint-due{font-size:13px;font-weight:600;white-space:nowrap}.help-box{margin-top:10px;padding:12px;background:var(--bg);border:1px solid var(--border);border-radius:10px}.help-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--border)}.help-row:last-of-type{border-bottom:none}.help-val{font-size:12px;color:var(--text);font-family:var(--font-mono,monospace);word-break:break-all;margin-top:2px}.today-card{border-left:3px solid var(--accent);margin-bottom:14px}.today-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:6px}.today-title{font-size:16px;font-weight:700}.today-date{font-size:13px;color:var(--muted)}.today-headline{font-size:18px;font-weight:700;color:var(--text);margin-bottom:14px;line-height:1.4}.today-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));grid-gap:10px;gap:10px}.today-item{background:var(--card-2);border-radius:10px;padding:12px 8px;text-align:center}.today-item-val{font-size:18px;font-weight:700}.today-item-label{font-size:12px;color:var(--muted);margin-top:3px}.grok-box{background:var(--card-2);border:1px solid var(--border);border-radius:10px;padding:14px;font-size:14px;line-height:1.6;white-space:pre-wrap}.service-banner.ok{border-left:3px solid var(--good)}.service-banner.soon{border-left:3px solid var(--warn)}.service-banner.due{border-left:3px solid var(--bad)}.service-headline{font-size:18px;font-weight:700}.service-item{padding:11px 0;border-bottom:1px solid var(--border)}.service-item:last-child{border-bottom:none}.service-item-head{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px;font-weight:600}.service-remain{font-weight:700;white-space:nowrap}.service-action{margin-top:3px}.dashboard-layout{display:flex;flex-direction:column;gap:20px;width:100%}@media (min-width:768px){.dashboard-layout{flex-direction:row;align-items:stretch}.dashboard-left{width:380px;flex-shrink:0}.dashboard-left,.dashboard-right{display:flex;flex-direction:column;gap:20px}.dashboard-right{flex-grow:1;min-width:0}}.clickable-polyline{cursor:pointer;transition:stroke-width .15s ease,stroke-opacity .15s ease}.clickable-polyline:hover{stroke-width:6px!important;stroke-opacity:1!important}