@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@400;500;600;700&display=swap";:root{color:#e9f2f5;font-synthesis:none;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#09151e;font-family:IBM Plex Sans Thai,Tahoma,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline-offset:4px;outline:2px solid #4de0d2}button{color:inherit;background:0 0;border:1px solid #334855;padding:10px 15px}button:disabled{opacity:.6;cursor:wait}input,select{color:#edf7fa;background:#101f2a;border:1px solid #334855;border-radius:3px;width:100%;padding:12px}label{color:#b2c6cf;gap:8px;font-size:14px;display:grid}h1{letter-spacing:-.5px;margin:10px 0 22px;font-size:32px;line-height:1.35}h2{margin:8px 0;font-size:24px}p{line-height:1.65}.wordmark{letter-spacing:2px;font-size:27px;font-weight:700}.wordmark span{color:#8ca4b3;letter-spacing:2px;margin-top:3px;font-size:10px;display:block}.eyebrow{color:#6edbd0;letter-spacing:2px;font-size:11px;font-weight:600}.login-layout{grid-template-columns:1.25fr 1fr;min-height:100vh;display:grid}.intro{background:radial-gradient(at 30% 80%,#123e44,#0000 70%),#0c202c;border-right:1px solid #284250;padding:65px 10vw 60px 7vw}.intro>.eyebrow{margin-top:95px}.intro h1{font-size:clamp(40px,4vw,66px);line-height:1.25}.intro-copy{color:#adc0c8;font-size:18px}.flow{letter-spacing:2px;color:#e8f3f5;white-space:nowrap;margin-top:75px;font-size:11px}.flow span{color:#57d8ca;margin:0 14px}.login-panel{align-self:center;width:100%;max-width:510px;margin:auto;padding:55px}.login-panel h2{font-size:30px}.login-panel p{color:#a1b6c3;font-size:14px}.login-panel form{gap:22px;margin-top:32px;display:grid}.primary{color:#08262a;background:#59d9cd;border:none;padding:14px;font-weight:700}.mode{letter-spacing:1.5px;color:#7ce2d5;font-size:10px;font-weight:700}.footnote{color:#92aab6;margin-top:28px;font-size:12px}.error{background:#422229;border-left:3px solid #ff8070;padding:12px 16px;font-size:14px;color:#ffc2bd!important}.shell{grid-template-columns:236px 1fr;min-height:100vh;display:grid}aside{background:#0c1a25;border-right:1px solid #233643;flex-direction:column;padding:32px 24px;display:flex}.nav-label{letter-spacing:2px;color:#718996;margin-top:64px;font-size:10px}nav{gap:8px;display:grid}nav button{text-align:left;color:#a7bdc8;border:0;padding:15px 12px}nav button span{color:#617e8d;margin-right:18px;font-size:10px}.active{background:#183b42;color:#71e3d6!important;border-left:2px solid #59d9cd!important}.sidebar-bottom{margin-top:auto;padding-top:80px}.sidebar-bottom p{overflow-wrap:anywhere;color:#90a5b3;font-size:11px}.sidebar-bottom button{padding:8px 12px;font-size:12px}main{min-width:0}header{border-bottom:1px solid #283d49;justify-content:space-between;align-items:center;gap:20px;height:112px;padding:24px 42px;display:flex}header strong{font-size:20px}header p{margin:0 0 5px}.selector{width:230px;font-size:11px}.selector select{padding:8px;font-size:13px}.content{min-height:calc(100vh - 174px);padding:25px 42px 48px}.notice{letter-spacing:1px;color:#88ded2;align-items:center;gap:10px;padding-bottom:25px;font-size:10px;display:flex}.notice>span:last-child{color:#8b9fae;letter-spacing:0;font-size:12px}.dot{background:#72daca;border-radius:50%;width:6px;height:6px}.section-title{justify-content:space-between;align-items:center;gap:20px;display:flex}.quiet{color:#99afbc;font-size:13px}.stats{border-top:1px solid #314954;border-bottom:1px solid #314954;grid-template-columns:repeat(4,1fr);margin:10px 0 30px;display:grid}.stats section{border-right:1px solid #293d49;padding:15px 22px 20px}.stats section:first-child{padding-left:0}.stats section:last-child{border:0}.stats p{color:#a5b8c3;margin:0 0 8px;font-size:12px}.stats strong{font-size:42px;font-weight:500;line-height:1.2}.alarm-text{color:#f5b478}.machine-panel{background:#10232e;border:1px solid #2a414e;padding:28px}.machine-heading{justify-content:space-between;align-items:center;gap:15px;display:flex}.machine-heading p{color:#8fa9b8;font-size:12px}.status{letter-spacing:1px;border:1px solid #506676;padding:8px 18px;font:600 13px Tahoma,sans-serif}.status.run{color:#72e7bc;background:#173a35;border-color:#285e4c}.status.alarm{color:#ffc18e;background:#412f24;border-color:#805438}.status.stop{color:#d5dfea;background:#293743}.status.offline{color:#c4c8d5;background:#292d38}.status.small{padding:5px 10px;font-size:10px}.signal-flow{letter-spacing:1.4px;border-top:1px solid #304752;border-bottom:1px solid #304752;align-items:center;gap:20px;margin:18px 0;padding:30px 0;font-size:11px;display:flex}.signal-flow i{color:#55bfb6;font-style:normal}.details{grid-template-columns:1.2fr 1.2fr 1fr;gap:18px;display:grid}.details p{color:#8fa9b8;font-size:11px}.details strong{font-size:13px;font-weight:500}.table-wrap{margin-top:25px;overflow:auto}.access-table{table-layout:fixed}.access-table td{white-space:normal;overflow-wrap:anywhere}.access-table form{gap:10px;display:grid}.access-table select{min-width:0}@media (width<=650px){.access-table thead{display:none}.access-table,.access-table tbody,.access-table tr,.access-table td{width:100%;display:block}.access-table tr{border:1px solid #263d49;margin-bottom:16px}.access-table td{border:0;padding:10px}}table{border-collapse:collapse;width:100%;font-size:13px}th{text-align:left;color:#a2b9c6;background:#10232e;padding:14px;font-size:11px;font-weight:500}td{white-space:nowrap;border-bottom:1px solid #263d49;padding:17px 14px}.settings{border-top:1px solid #304752;grid-template-columns:1fr 1fr;gap:24px;margin:30px 0;padding-top:28px;display:grid}.settings input{color:#9fb6c4;font-size:13px}.empty{color:#a2b9c6;text-align:center;border:1px dashed #304752;padding:30px}.content footer{margin-top:30px}footer{letter-spacing:1px;color:#6e8a9b;border-top:1px solid #233946;justify-content:space-between;padding:20px 42px;font-size:10px;display:flex}@media (width<=950px){.shell{grid-template-columns:190px 1fr}aside{padding:25px 15px}header{padding:20px 25px}.content{padding:25px}.stats{grid-template-columns:1fr 1fr}.stats section{padding:18px!important}.details{grid-template-columns:1fr}.section-title .quiet{display:none}.signal-flow{gap:10px;font-size:10px}}@media (width<=640px){.login-layout{display:block}.intro{padding:30px}.intro>.eyebrow{margin-top:30px}.intro h1{font-size:38px}.intro-copy,.flow{display:none}.login-panel{padding:35px 25px}.shell{display:block}aside{border:0;padding:16px;display:block}.wordmark{font-size:21px}.nav-label,.sidebar-bottom p,.sidebar-bottom .mode{display:none}nav{gap:5px;max-width:100%;margin-top:15px;display:flex;overflow-x:auto}nav button{white-space:nowrap;flex:none;width:auto;padding:9px}nav button span{display:none}.sidebar-bottom{padding:0;position:absolute;top:12px;right:16px}header{align-items:start;height:auto;padding:18px}.selector{flex-shrink:0;width:145px}header strong{font-size:16px}header .eyebrow{letter-spacing:.5px;font-size:9px}.content{padding:18px}h1{font-size:26px}.notice{flex-wrap:wrap}.machine-panel{padding:18px}.machine-heading{flex-direction:column;align-items:start}.signal-flow{flex-wrap:wrap}.settings{grid-template-columns:1fr}.stats strong{font-size:36px}footer{padding:18px}}.box-id{color:#82aaaf;font-size:13px;font-weight:400}.pwa-bar{color:#b8ced4;background:#102935;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:10px 20px;font-size:13px;display:flex}.pwa-bar button{color:#35dfd5;cursor:pointer;background:0 0;border:1px solid #35dfd5;border-radius:6px;padding:8px 12px}.pwa-help{color:#edf7f8;background:#173641;padding:16px 20px;line-height:1.8}.pwa-offline{max-width:640px;margin:40px auto;padding:24px;line-height:1.8}.signal-settings{background:#0d2731;border:1px solid #214a52;border-radius:12px;margin-top:26px;padding:24px}.signal-settings-heading,.signal-actions{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px;display:flex}.signal-settings h2{margin:4px 0 8px;font-size:20px}.config-version{color:#35dfd5;font-weight:700}.signal-toolbar{flex-wrap:wrap;gap:16px;margin:20px 0;display:flex}.signal-toolbar label{color:#aac7cd;gap:6px;min-width:220px;font-size:13px;display:grid}.signal-toolbar .all-signals-toggle{align-self:end;align-items:center;gap:8px;min-width:auto;display:flex}.manual-default{color:#8caab0;white-space:nowrap;font-size:10px}.signal-toolbar select,.signal-toolbar input{color:#edf7f8;background:#071c25;border:1px solid #315c66;border-radius:6px;padding:11px}.signal-group{margin-top:20px}.signal-group h3{color:#35dfd5;margin-bottom:12px;font-size:15px}.signal-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:9px;display:grid}.signal-option{cursor:pointer;background:#091f28;border:1px solid #24444d;border-radius:7px;align-items:center;gap:11px;padding:12px;display:flex}.signal-option input{accent-color:#35dfd5;width:17px;height:17px}.signal-option span{flex:1;gap:3px;display:grid}.signal-option small{color:#9fb7bc}.signal-option em{color:#8da8af;font-size:11px;font-style:normal}.signal-actions{margin-top:22px}.signal-actions span{color:#a7c1c7;font-size:13px}.registry-filters{flex-wrap:wrap;gap:16px;margin:24px 0;display:flex}.registry-filters label{flex:1;min-width:220px}.registry-filters input,.registry-filters select{width:100%;margin-top:8px}.device-registry{max-width:1500px;margin:auto}.device-registry h1{letter-spacing:-.04em;margin-bottom:12px}.fleet-graphic{grid-template-columns:minmax(240px,.8fr) minmax(350px,1.4fr);gap:24px;margin:32px 0;display:grid}.fleet-health,.fleet-route{background:radial-gradient(at 100% 0,#163d45,#0d202b 70%);border:1px solid #29434e;border-radius:14px;padding:28px}.fleet-health>strong{font-variant-numeric:tabular-nums;color:#80ddd2;font-size:64px;line-height:1.2;display:block}.fleet-health strong small{color:#8ca9b4;font-size:24px}.fleet-meter{background:#304650;border-radius:9px;height:8px;margin:18px 0;overflow:hidden}.fleet-meter span{background:#69caba;height:100%;transition:width .3s;display:block}.fleet-route{text-align:center;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:12px;display:grid}.fleet-route strong,.fleet-route small{display:block}.fleet-route>p{color:#9fb3bd;grid-column:1/-1;margin:12px 0 0;font-size:12px}.route-symbol{color:#77d4c8;margin-bottom:12px;font-size:42px;display:block}.device-registry table{border-collapse:collapse;width:100%;min-width:850px}.device-registry th{text-align:left;white-space:nowrap;background:#142a35;padding:16px}.device-registry td{border-bottom:1px solid #263c47;padding:20px 16px;line-height:1.8}.device-registry tbody tr:hover{background:#132b34}.device-registry code{color:#83d8cd;font-size:12px}.device-registry small{color:#a5bac5}.device-registry button{border-radius:7px}@media (width<=1050px){.fleet-graphic{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.fleet-meter span{transition:none}}.monitoring{font-variant-numeric:tabular-nums}.monitoring .section-title{flex-wrap:wrap;align-items:start;gap:20px}.monitoring-window{grid-template-columns:1fr 1fr 1fr auto;align-items:end;gap:14px;margin-top:22px;display:grid}.monitoring-window input{min-width:0}.analysis-caption{color:#a7bcc7;border-bottom:1px solid #30434e;flex-wrap:wrap;gap:20px;padding:18px 0;font-size:13px;display:flex}.analysis-caption strong{color:#77d9cb}.monitoring-kpis{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;margin:26px 0;display:grid}.monitoring-kpis article{border-left:2px solid #31535e;gap:8px;padding:3px 0 3px 18px;display:grid}.monitoring-kpis span,.monitoring-kpis small{color:#a7bbc5;font-size:13px}.monitoring-kpis strong{font-size:25px;font-weight:600}.analysis-section{border-top:1px solid #30434e;margin-top:16px;padding:26px 0}.analysis-section h2{font-size:21px}.analysis-columns{grid-template-columns:1fr 1fr;gap:40px;display:grid}.analysis-form{gap:16px;margin-top:24px;display:grid}.context-form{grid-template-columns:2fr 1.5fr 1fr 1fr;gap:18px;margin:24px 0;display:grid}.context-form button{grid-column:1/-1;justify-self:start}.timeline{background:#233440;border-radius:4px;height:40px;margin-top:24px;display:flex;overflow:hidden}.segment{flex-shrink:0;height:100%}.segment.run,.timeline-legend .run,.fleet-dot.run{background:#56c99c}.segment.stop,.timeline-legend .stop,.fleet-dot.stop{background:#d9b263}.segment.alarm,.timeline-legend .alarm,.fleet-dot.alarm{background:#e77b7b}.segment.unknown,.timeline-legend .unknown,.fleet-dot.unknown{background:repeating-linear-gradient(135deg,#3c4b57,#3c4b57 4px,#26343e 4px 8px)}.timeline-axis{color:#a6bac7;justify-content:space-between;margin-top:8px;font-size:12px;display:flex}.timeline-legend{flex-wrap:wrap;gap:22px;margin-top:20px;font-size:13px;display:flex}.timeline-legend span{align-items:center;gap:7px;display:flex}.timeline-legend i{width:10px;height:10px;display:inline-block}.pareto-row{margin:22px 0}.pareto-row>div{justify-content:space-between;gap:10px;margin-bottom:7px;font-size:14px;display:flex}.pareto-row meter{width:100%;height:15px}.pareto-row meter::-webkit-meter-bar{background:#203540;border:0}.pareto-row meter::-webkit-meter-optimum-value{background:#64bcb6}.oee-grid{background:#102831;border-radius:5px;grid-template-columns:repeat(4,1fr);gap:24px;padding:28px;display:grid}.oee-grid article{gap:12px;display:grid}.oee-grid span{color:#b3c8ce;font-size:14px}.oee-grid strong{color:#79dccb;font-size:38px;font-weight:500}.analysis-section li{color:#bed0d9;margin:10px 0}.capability{border-left:3px solid #6b7d8c;padding-left:20px}.success{color:#9be2c1;padding:10px 0}.fleet-list{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:24px 0;display:grid}.fleet-machine{text-align:left;background:#0f222d;border:1px solid #263f4c;border-radius:5px;align-items:center;gap:12px;min-width:0;display:flex}.fleet-machine.selected{background:#13303a;border-color:#59bfb3}.fleet-machine>span:nth-child(2){flex:1;min-width:0}.fleet-machine strong{font-size:15px;display:block}.fleet-machine small{color:#a1b9c4;margin-top:4px;font-size:11px;display:block}.fleet-machine b{font-size:12px;font-weight:500}.fleet-dot{background:#667989;border-radius:50%;flex-shrink:0;width:11px;height:11px}.machine-actions{border-block:1px solid #273d49;margin:20px 0;padding:18px 0}.machine-actions p{color:#b6ced8;margin-top:0}.machine-actions button{border-radius:3px;margin-right:10px}.monitoring button:hover:not(:disabled),.fleet-machine:hover{filter:brightness(1.12)}@media (width<=1150px){.monitoring-window,.context-form,.monitoring-kpis{grid-template-columns:1fr 1fr}.analysis-columns{grid-template-columns:1fr}}@media (width<=600px){.monitoring-window,.context-form{grid-template-columns:1fr}.oee-grid{grid-template-columns:1fr 1fr;padding:20px}.oee-grid strong{font-size:30px}.monitoring-kpis{gap:18px}.monitoring-kpis strong{font-size:20px}.analysis-caption{gap:9px}.fleet-list{grid-template-columns:1fr}.analysis-section{padding-top:20px}.monitoring .section-title button{width:100%}}