:root{--bg-dark: #F6F3EB;--panel-bg: rgba(255, 255, 255, .72);--card-light: #ffffff;--text-main: #2a1010;--text-dark: #2a1010;--text-muted: #869B7E;--accent-green: #869B7E;--accent-blue: #7F2020;--accent-purple: #C9CAAC;--accent-pink: #ec4899;--accent-red: #7F2020;--home-red: #7F2020;--home-sage: #869B7E;--home-tan: #C9CAAC;--home-cream: #F6F3EB}body{margin:0;padding:0;background:linear-gradient(145deg,#f6f3eb,#c9caac 55%,#869b7e);background-attachment:fixed;color:var(--text-main);font-family:Inter,system-ui,sans-serif;font-size:16px;font-weight:400}h1,h2,h3,h4,h5,h6{font-family:Playfair Display,Georgia,serif}*{box-sizing:border-box}.dashboard-container{padding:2vw 3vw;width:100%;max-width:100%;min-height:100vh;margin:0 auto}.top-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.title{margin:0;font-size:32px;font-weight:700;color:#7f2020;font-family:Playfair Display,Georgia,serif}.subtitle{margin:5px 0 0;color:#869b7e;font-size:16px;font-family:Inter,system-ui,sans-serif}.robot-switcher{display:flex;background-color:#fff9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:8px;padding:4px;border:1px solid #C9CAAC}.switch-btn{background:transparent;border:none;color:#869b7e;padding:8px 16px;border-radius:6px;cursor:pointer;font-weight:600;transition:all .2s}.switch-btn.active{background-color:#7f2020;color:#fff}.connection-status{display:flex;align-items:center;gap:8px;font-size:14px}.status-dot{width:10px;height:10px;border-radius:50%}.status-dot.green{background-color:#869b7e}.status-dot.red{background-color:#7f2020}.dashboard-grid{display:grid;grid-template-columns:minmax(300px,350px) 1fr;gap:24px;align-items:start}.dark-panel{background-color:#ffffffb8;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid #C9CAAC;border-radius:12px;padding:24px;margin-bottom:24px}.dark-panel h3{margin-top:0;margin-bottom:20px;font-size:20px;font-weight:600;color:#2a1010}.d-pad{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:30px}.row{display:flex;gap:10px}.btn-dir,.btn-stop{width:50px;height:50px;border-radius:8px;border:none;background-color:#c9caac;color:#2a1010;font-size:18px;cursor:pointer}.btn-stop{background-color:#7f2020;color:#fff}.btn-stop:hover{background-color:#9a2828}.btn-dir:hover{background-color:#b5b699}.slider-container input{width:100%;margin-top:10px;accent-color:#7F2020}.status-row{display:flex;justify-content:space-between;margin-bottom:12px;font-size:14px;color:#2a1010}.sensor-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:24px}.light-card{background-color:#ffffffd9;color:#2a1010;border-radius:12px;padding:20px;border:1px solid #C9CAAC}.card-header{display:flex;justify-content:space-between;font-weight:600;font-size:14px}.card-value{font-size:36px;font-weight:700;margin-top:15px}.unit{font-size:14px;font-weight:400;color:#869b7e}.bar-group{margin-bottom:15px}.bar-label{display:flex;justify-content:space-between;font-size:12px;margin-bottom:5px;color:#869b7e}.progress-bg{height:6px;background-color:#c9caac;border-radius:3px;overflow:hidden}.progress-fill{height:100%}.progress-fill.blue{background-color:#7f2020}.progress-fill.purple{background-color:#869b7e}.terminal{background-color:#ffffffd9!important;border:1px solid #C9CAAC!important}.terminal p{margin:5px 0;font-size:13px;font-family:Inter,monospace;color:#2a1010}.time,.info{color:#869b7e}.system{color:#7f2020}@media(max-width:1024px){.dashboard-grid{grid-template-columns:1fr}.top-bar{flex-direction:column;gap:15px;align-items:flex-start}.robot-switcher{align-self:center}}.control-label{font-size:14px;color:#869b7e;margin-bottom:8px;text-transform:uppercase;letter-spacing:1px}.speed-group{display:flex;gap:10px;margin-bottom:20px}.btn-speed{flex:1;padding:12px 0;border-radius:8px;border:2px solid #C9CAAC;background-color:transparent;color:#869b7e;font-weight:700;cursor:pointer;transition:all .2s}.btn-speed:hover{background-color:#c9caac;color:#2a1010}.btn-speed.active-fwd{background-color:#7f2020;color:#fff;border-color:#7f2020}.btn-speed.active-rev{background-color:#869b7e;color:#fff;border-color:#869b7e}.btn-stop-large{width:100%;padding:15px;border-radius:8px;border:2px solid #C9CAAC;background-color:transparent;color:#2a1010;font-size:18px;font-weight:700;cursor:pointer;margin-bottom:20px;transition:all .2s;letter-spacing:2px}.btn-stop-large.active-stop,.btn-stop-large:hover{background-color:#7f2020;color:#fff;border-color:#7f2020}
