:root{--color-text:#14241b;--color-text-muted:#6f8075;--color-text-soft:#8a9a90;--color-brand:#06c755;--color-brand-dark:#049b44;--color-brand-ink:#0c5c2d;--color-brand-deep:#057332;--color-danger:#c62828;--color-bg:#eef7f1;--color-surface:#fff;--color-surface-soft:#f4fbf6;--color-chip:#eef9f2;--color-border:#0842241a;--shadow-panel:0 14px 36px #21432f14;--radius-panel:22px;--radius-card:18px;--radius-chip:999px;--space-page:18px;--space-stack:14px;color:var(--color-text);background:var(--color-bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:Hiragino Sans,Hiragino Kaku Gothic ProN,Noto Sans JP,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:var(--color-bg);min-width:320px;min-height:100vh;margin:0}button{font:inherit}.login-shell,.app-shell{min-height:100vh;padding:var(--space-page)}.login-shell{background:radial-gradient(circle at 0 0,#06c75538,#0000 34%),linear-gradient(160deg,#f6fff9 0%,#e9f7ee 52%,#dff2e8 100%);place-items:center;display:grid}.login-card{background:#ffffffeb;border-radius:28px;width:min(440px,100%);padding:28px;box-shadow:0 24px 80px #124d2e2e}.brand-logo,.top-brand{align-items:center;gap:12px;display:flex}.brand-logo{margin-bottom:18px}.brand-logo.compact{margin-bottom:0}.brand-logo strong{font-size:28px;line-height:1;display:block}.brand-logo.compact strong{font-size:22px}.brand-logo small{color:var(--color-text-muted);letter-spacing:.06em;text-transform:uppercase;margin-top:5px;font-size:12px;font-weight:800;display:block}.battery-logo{background:linear-gradient(135deg, var(--color-brand), var(--color-brand-dark));border-radius:22px;place-items:center;width:72px;height:72px;display:grid;position:relative;box-shadow:0 14px 34px #06c75547}.brand-logo.compact .battery-logo{border-radius:16px;width:48px;height:48px}.battery-logo:before{content:"";border:3px solid #fff;border-radius:6px;width:34px;height:20px}.battery-logo:after{content:"";background:#fff;border-radius:0 4px 4px 0;width:4px;height:12px;position:absolute;right:15px}.brand-logo.compact .battery-logo:after{right:9px}.battery-logo span{background:#fff;border-radius:3px;width:20px;height:10px;position:absolute}.login-card h1,.top-bar h1,.detail-hero h1,.section-heading h2{margin:0;line-height:1.2}.section-heading h2{font-size:20px;font-weight:800}.login-card p{color:var(--color-text-muted);line-height:1.7}.primary-button,.ghost-button,.command-row button{cursor:pointer;border:0}.primary-button{border-radius:var(--radius-chip);color:#fff;background:var(--color-brand);width:100%;margin:18px 0 12px;padding:15px 18px;font-weight:800}.primary-button:disabled{cursor:wait;opacity:.7}.login-card small{color:var(--color-text-soft);line-height:1.6;display:block}.error-box{color:#9d2424;background:#fff4f4;border:1px solid #ffd0d0;border-radius:14px;padding:12px 14px}.app-shell{max-width:1120px;margin:0 auto}.top-bar,.detail-hero,.section-heading,.vehicle-card-header,.user-card{justify-content:space-between;align-items:center;gap:16px;display:flex}.section-heading{gap:12px;margin-bottom:2px}.top-bar{margin-bottom:var(--space-stack);flex-wrap:nowrap;gap:8px}.top-brand{flex:auto;align-items:center;gap:10px;min-width:0;display:flex}.top-brand-text{min-width:0}.top-brand-text h1{text-overflow:ellipsis;white-space:nowrap;font-size:clamp(16px,4.2vw,22px);overflow:hidden}.top-bar-trailing{flex:none;align-items:center;gap:8px;display:flex}.top-bar-avatar{flex:none;width:36px;height:36px}.back-button,.refresh-button,.ghost-button{border-radius:var(--radius-chip);color:var(--color-brand-ink);background:var(--color-chip);white-space:nowrap;cursor:pointer;border:0;flex:none;align-items:center;gap:6px;padding:8px 12px;font-size:13px;font-weight:800;display:inline-flex}.back-button{margin-right:2px}.refresh-button:disabled{cursor:wait;opacity:.7}.refresh-icon{flex:none}.refresh-icon.is-spinning{animation:.8s linear infinite refresh-spin}@keyframes refresh-spin{to{transform:rotate(360deg)}}.app-version{text-align:center;color:var(--color-text-soft);letter-spacing:.04em;margin:20px 0 0;font-size:12px;font-weight:600}.eyebrow{color:var(--color-brand-deep);letter-spacing:.06em;margin:0 0 4px;font-size:11px;font-weight:800}.user-card{border-radius:var(--radius-chip);background:var(--color-surface);box-shadow:var(--shadow-panel);padding:10px 12px}.user-card span,.vehicle-card span,.last-seen,.data-list dt{color:var(--color-text-muted);font-size:13px}.avatar{color:#fff;background:var(--color-brand);border-radius:50%;place-items:center;width:42px;height:42px;font-weight:800;display:grid}.avatar-image{object-fit:cover;background:#fff}.line-profile-panel{margin-bottom:18px}.line-profile-list{gap:14px;margin:0;display:grid}.line-profile-list div{gap:4px;display:grid}.line-profile-list dt{color:#718378;margin:0;font-size:13px;font-weight:700}.line-profile-list dd{color:#14241b;word-break:break-all;margin:0;font-size:16px;font-weight:700}.panel{margin-top:var(--space-stack);border:1px solid var(--color-border);border-radius:var(--radius-panel);box-shadow:var(--shadow-panel);background:#ffffffeb;padding:16px}.panel h2{margin:0}.chip,.count{border-radius:var(--radius-chip);color:var(--color-brand-ink);background:#e6f8ed;border:0;padding:8px 13px;font-weight:800}.chip{cursor:pointer}.chip.active{color:#fff;background:var(--color-brand)}.range-tabs{border-radius:var(--radius-chip);background:#eaf7ef;flex-wrap:wrap;gap:6px;max-width:100%;padding:4px;display:flex}.range-tabs button{border-radius:var(--radius-chip);color:var(--color-brand-ink);cursor:pointer;white-space:nowrap;background:0 0;border:0;padding:7px 11px;font-size:12px;font-weight:800}.range-tabs button.active{color:#fff;background:var(--color-brand)}.site-grid,.vehicle-list,.unit-list,.kpi-grid,.detail-grid,.wave-grid{gap:14px;display:grid}.site-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:16px}.site-card,.vehicle-card{text-align:left;cursor:pointer;background:#fff;border:1px solid #074e2514;border-radius:18px;width:100%}.site-card{padding:16px}.site-card.active{border-color:#06c755;box-shadow:0 0 0 3px #06c7551f}.site-card span,.site-card strong,.site-card small{display:block}.site-card strong{margin:10px 0;font-size:28px}.site-card small{color:#758579;line-height:1.45}.vehicle-list,.unit-list{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:16px}.unit-card{background:#fff;border:1px solid #074e2514;border-radius:18px;padding:16px}.unit-card h3{color:#14241b;margin:0 0 8px;font-size:20px}.unit-card small{color:#758579;word-break:break-all}.site-list-panel{padding:8px}.site-list{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.site-list-item{text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:16px;grid-template-columns:1fr auto auto;align-items:center;gap:12px;width:100%;padding:16px 14px;transition:background .16s,transform .12s,box-shadow .12s;display:grid;transform:scale(1)}.site-list-item.vehicle-ofs-row{grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr) auto;align-items:start}.vehicle-ofs-main,.vehicle-ofs-meta{flex-direction:column;gap:4px;min-width:0;display:flex}.vehicle-ofs-meta{text-align:right;align-items:flex-end}.ofs-status{font-size:13px;font-weight:800}.ofs-status.online{color:var(--color-brand-deep)}.ofs-status.offline{color:var(--color-danger)}.ofs-time,.ofs-metric{color:var(--color-text-muted);word-break:break-word;font-size:12px;font-weight:700}@media (hover:hover){.site-list-item:hover{background:#eef8f1}.mos-segment-btn:hover:not(:disabled):not(.is-active){background:#ffffff8c}}.site-list-item:focus-visible{background:#eef8f1;outline:none}.site-list-item:active{background:#d4f0df;transform:scale(.97);box-shadow:inset 0 0 0 2px #06c75547}.site-list-item.is-pressing{animation:.28s site-list-press}@keyframes site-list-press{0%{box-shadow:none;background:0 0;transform:scale(1)}35%{background:#d4f0df;transform:scale(.97);box-shadow:inset 0 0 0 2px #06c75547}to{box-shadow:none;background:#eef8f1;transform:scale(1)}}.site-list-name{color:var(--color-text);font-size:17px;font-weight:700}.site-list-no{color:var(--color-text-muted);font-size:13px;font-weight:700}.site-list-chevron{color:var(--color-text-soft);font-size:22px;font-weight:400;line-height:1}.vehicle-card{padding:16px;transition:transform .16s,box-shadow .16s}.vehicle-card:hover{transform:translateY(-2px);box-shadow:0 14px 34px #21432f1a}.vehicle-card h3{margin:0 0 4px}.status-badge{border-radius:999px;flex:none;padding:6px 10px;font-size:12px;font-weight:800}.status-badge.good{color:#057332;background:#dff8e9}.status-badge.idle{color:#6b5f00;background:#fff5bf}.status-badge.warn{color:#a14d00;background:#ffe4c8}.status-badge.bad{color:#a12424;background:#ffdede}.vehicle-metrics{grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0 10px;display:grid}.vehicle-metrics div{border-radius:var(--radius-card);background:var(--color-surface-soft);padding:12px}.vehicle-metrics strong,.vehicle-metrics span{display:block}.last-seen{margin:0}.detail-shell{gap:var(--space-stack);display:grid}.detail-hero{border-radius:var(--radius-panel);color:#fff;background:linear-gradient(135deg,#06c755f2,#077b3ef2),radial-gradient(circle at 100% 0,#ffffff59,#0000 34%);padding:16px 18px}.detail-hero.is-offline{background:linear-gradient(135deg,#5c636cf5,#373d46f5),radial-gradient(circle at 100% 0,#ffffff2e,#0000 34%)}.detail-hero-id{color:#fff;letter-spacing:.01em;word-break:break-all;margin:0;font-size:16px;font-weight:800}.detail-hero-updated{color:#ffffffd1;margin:6px 0 0;font-size:12px;font-weight:700}.detail-hero .eyebrow,.detail-hero p{color:#ffffffd1}.kpi-grid{grid-template-columns:1.4fr 1fr}.kpi-card{border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface);padding:14px}.kpi-card span,.kpi-card strong{display:block}.kpi-card span{color:var(--color-text-muted);font-size:12px;font-weight:700}.kpi-card strong{white-space:nowrap;margin-top:6px;font-size:26px;font-weight:800}.progress{background:#e4efe8;border-radius:999px;height:10px;margin-top:16px;overflow:hidden}.progress span{border-radius:inherit;background:#06c755;height:100%;display:block}.wave-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:16px}.wave-card{border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface);padding:14px}.wave-card-button{text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;width:100%;transition:background .16s,transform .12s,box-shadow .12s}.wave-card-button:active{background:#f3faf5;transform:scale(.985)}.wave-card-header,.bms-header{justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.wave-card-header{flex-direction:column;align-items:flex-start;gap:4px}.wave-card-header span,.wave-card-header small,.bms-header span,.bms-metrics span,.cell-card span{color:#718378;font-size:13px}.wave-card-header span,.wave-card-header small{white-space:nowrap}.wave-card-header strong{margin-top:6px;font-size:30px;display:block}.wave-chart{width:100%;height:150px;margin-top:8px;overflow:visible}.wave-chart.fullscreen{height:min(62vh,420px)}.wave-line{stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 8px 10px #06c7552e)}.wave-grid-line{stroke:#0842241a;stroke-width:1px}.wave-axis-line{stroke:#08422459;stroke-width:1.2px}.wave-axis-label,.wave-axis-unit{fill:#829287;font-size:9px;font-weight:700}.wave-chart.fullscreen .wave-axis-label,.wave-chart.fullscreen .wave-axis-unit{font-size:10px}.wave-chart.fullscreen .wave-axis-label-vertical{font-size:9px}.wave-axis{color:#829287;justify-content:space-between;font-size:12px;display:flex}.wave-modal-backdrop{z-index:40;background:#0a1c128c;justify-content:stretch;align-items:stretch;padding:0;display:flex;position:fixed;inset:0}.wave-modal{background:#f4faf6;flex-direction:column;width:100%;height:100%;padding:18px 16px 24px;display:flex;overflow:auto}.wave-modal-header{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;display:flex}.wave-modal-header h2{margin:4px 0 0;font-size:28px}.wave-modal-chart{background:#fff;border-radius:20px;flex:1;align-items:center;min-height:280px;padding:12px;display:flex;box-shadow:0 16px 45px #21432f1a}.bms-list{gap:16px;margin-top:16px;display:grid}.bms-card{border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface);padding:14px}.bms-card.is-main{border-color:#05733247;box-shadow:inset 3px 0 #057332}.bms-card.is-inactive{background:#fbfbfb;border-color:#c6282838}.bms-card.is-inactive.is-main{box-shadow:inset 3px 0 #c62828}.bms-title-row{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:4px;display:flex}.bms-header .bms-main-badge{color:#057332;letter-spacing:.04em;background:#ddf7e7;border-radius:999px;align-items:center;padding:2px 8px;font-size:11px;font-weight:800;line-height:1.4;display:inline-flex}.bms-header h3{margin:0 0 4px}.bms-title-row h3{margin:0}.bms-header>strong{color:#057332;background:#ddf7e7;border-radius:18px;place-items:center;min-width:58px;height:58px;display:grid}.bms-header>strong.bms-soc-hidden{color:#8a8a8a;background:#efefef;font-size:18px;font-weight:700}.bms-slot-meta{flex-wrap:wrap;gap:8px 16px;margin-top:10px;font-size:12px;font-weight:700;display:flex}.bms-slot-meta.active{color:#057332}.bms-slot-meta.inactive{color:#c62828}.bms-slot-notice{background:#fff5f5;border:1px solid #c6282829;border-radius:14px;margin-top:14px;padding:14px 16px}.bms-slot-notice-title{color:#b71c1c;margin:0;font-size:13px;font-weight:800}.bms-slot-notice-body{color:#6d4c4c;margin:6px 0 0;font-size:12px;font-weight:600;line-height:1.55}.mos-control-panel{border-radius:var(--radius-card);border:1px solid var(--color-border);background:var(--color-surface-soft);margin-top:14px;padding:14px}.mos-panel-title{color:var(--color-text-muted);letter-spacing:.08em;margin:0;font-size:11px;font-weight:800}.mos-panel-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px;display:flex}.mos-panel-note{color:#8d6e63;margin:0;font-size:11px;font-weight:700;line-height:1.4}.mos-control-panel.is-readonly{background:#f5f5f5;border-color:#0842240f}.mos-control-card.is-readonly{opacity:.92}.mos-control-panel.is-readonly .mos-segment-btn:disabled{opacity:.72;cursor:not-allowed}.mos-control-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.mos-control-card{background:var(--color-surface);border:1px solid #08422414;border-radius:14px;gap:12px;min-width:0;padding:12px;display:grid;box-shadow:0 6px 18px #21432f0a}.mos-control-card-head{gap:6px;display:grid}.mos-control-name{color:var(--color-text);font-size:13px;font-weight:800;line-height:1.35}.mos-status-line{align-items:center;gap:6px;font-size:12px;font-weight:800;display:inline-flex}.mos-status-dot{background:currentColor;border-radius:50%;flex-shrink:0;width:8px;height:8px}.mos-status-line.on{color:var(--color-brand-deep)}.mos-status-line.off{color:#5f6368}.mos-status-line.pending{color:#e65100}.mos-status-line.pending.is-pending .mos-status-dot{background:0 0;border:2px solid;border-right-color:#0000;width:10px;height:10px;animation:.75s linear infinite mos-pending-spin}.mos-status-line.pending.is-pending .mos-status-label{animation:1.2s ease-in-out infinite mos-pending-pulse}@keyframes mos-pending-spin{to{transform:rotate(360deg)}}@keyframes mos-pending-pulse{0%,to{opacity:1}50%{opacity:.45}}@media (prefers-reduced-motion:reduce){.mos-status-line.pending.is-pending .mos-status-dot,.mos-status-line.pending.is-pending .mos-status-label{animation:none}}.mos-status-line.unkown{color:#8d6e63}.mos-status-updated{color:var(--color-text-muted);white-space:nowrap;font-size:11px;font-weight:600;line-height:1.4}.mos-segment{background:#e8f0eb;border-radius:14px;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:4px;display:grid}.mos-segment-btn{min-height:44px;color:var(--color-brand-ink);letter-spacing:.04em;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:11px;padding:10px 8px;font-size:14px;font-weight:800;transition:background-color .16s,color .16s,box-shadow .16s}.mos-segment-btn.is-active{color:var(--color-brand-deep);background:#fff;box-shadow:0 2px 8px #21432f1f}.mos-segment-btn:disabled{opacity:.55;cursor:not-allowed}.bms-card.is-inactive .mos-control-panel{background:#f5f5f5}.bms-card.is-inactive .mos-control-card{background:#fafafa}.bms-metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0;display:grid}.bms-metrics div{background:var(--color-surface-soft);border-radius:14px;padding:12px}.bms-metrics span{color:var(--color-text-muted);font-size:12px;font-weight:700}.bms-metrics strong{white-space:nowrap}.bms-metrics strong,.cell-card strong{margin-top:4px;display:block}.cell-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;display:grid}.cell-card{background:var(--color-surface-soft);text-align:center;border-radius:12px;padding:9px 8px}.cell-card strong{white-space:nowrap;font-size:13px}.detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wide{grid-column:1/-1}.data-list{gap:12px;margin:16px 0 0;display:grid}.data-list div{border-bottom:1px solid #edf3ef;justify-content:space-between;gap:12px;padding-bottom:12px;display:flex}.data-list dd{margin:0;font-weight:800}.alert-row,.command-row{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.ok-message,.alert-pill{border-radius:14px;padding:10px 12px;font-weight:800}.ok-message{color:var(--color-brand-deep);background:#e1f8ea}.alert-pill{color:#a14d00;background:#ffe4c8}.command-row button{color:#0c5c2d;background:#eef9f2;border-radius:14px;padding:11px 14px;font-weight:800}@media (width<=820px){.detail-hero,.section-heading{flex-direction:column;align-items:flex-start}.top-bar .brand-logo.compact .battery-logo{border-radius:14px;width:40px;height:40px}.back-button,.refresh-button{padding:7px 10px;font-size:12px}.site-grid,.vehicle-list,.unit-list,.detail-grid{grid-template-columns:1fr}.kpi-grid,.wave-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wave-card{padding:12px 8px}.wave-card-header span,.wave-card-header small{font-size:11px}.wave-chart{height:132px}.kpi-card{padding:12px 10px}.kpi-card strong{font-size:20px}.site-list-item{grid-template-columns:1fr auto}.site-list-item.vehicle-ofs-row{grid-template-columns:1fr}.site-list-chevron{display:none}.vehicle-ofs-meta{text-align:left;align-items:flex-start}.bms-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.cell-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.cell-card{padding:8px 4px}.cell-card strong{font-size:12px}.mos-control-grid{grid-template-columns:1fr}.mos-control-card{padding:14px}.mos-control-card-head{grid-template-rows:auto auto;grid-template-columns:1fr auto;align-items:center;gap:4px 10px;display:grid}.mos-control-name{grid-area:1/1;font-size:14px}.mos-control-card-head .mos-status-line{grid-area:1/2;justify-self:end}.mos-status-updated{grid-area:2/1/auto/-1;font-size:10px}.mos-segment-btn{min-height:48px;font-size:15px}}
