:root{color:#eaf6ff;font-synthesis:none;text-rendering:optimizelegibility;--bg:#061724;--surface:#0c2537eb;--surface-2:#123146e0;--line:#94c8e12e;--line-strong:#94dcef57;--text:#edf8ff;--muted:#91aabd;--cyan:#55d8f5;--teal:#41d9bd;--blue:#4d8fff;--amber:#ffc55d;--red:#ff7c84;--shadow:0 20px 45px #00070d47;background:#061724;font-family:Noto Sans TC,Microsoft JhengHei,system-ui,sans-serif}*{box-sizing:border-box}html{background:var(--bg);min-width:320px}body{background:radial-gradient(circle at 17% -8%,#19a0c038,#0000 32rem),radial-gradient(circle at 93% 4%,#4063c430,#0000 28rem),linear-gradient(#061724 0%,#071d2b 48%,#05131f 100%);min-width:320px;min-height:100vh;margin:0}button,input,textarea,select{font:inherit}button:focus-visible,summary:focus-visible{outline-offset:3px;outline:3px solid #55d8f5b8}button:disabled{cursor:not-allowed;opacity:.46}.app-shell{width:min(1500px,100%);min-height:100vh;margin:0 auto;padding:0 32px}.topbar{border-bottom:1px solid var(--line);align-items:center;gap:16px;min-height:104px;display:flex}.brand-mark{color:#79e8ff;letter-spacing:-.08em;background:linear-gradient(145deg,#4ccde83d,#1c568333);border:1px solid #60e0f461;border-radius:17px;place-items:center;width:56px;height:56px;font-family:Roboto Mono,monospace;font-weight:800;display:grid;box-shadow:inset 0 0 24px #52dff114}.brand-copy{flex:1}.brand-copy p,.brand-copy h1{margin:0}.brand-copy p{color:#70d7ed;letter-spacing:.17em;font-size:.72rem;font-weight:800}.brand-copy h1{margin-top:3px;font-size:clamp(1.25rem,2vw,1.76rem);line-height:1.25}.scope-chip,.live-pill,.sample-count{white-space:nowrap;align-items:center;display:inline-flex}.scope-chip{border:1px solid var(--line);color:#b6cddb;background:#0a1f30d1;border-radius:999px;gap:9px;padding:10px 14px;font-family:Roboto Mono,monospace;font-size:.78rem}.scope-chip__dot{background:var(--teal);width:7px;height:7px;box-shadow:0 0 12px var(--teal);border-radius:50%}main{padding:28px 0 20px}.intro-strip{background:linear-gradient(90deg,#2988a629,#15395133);border:1px solid #5ad2e936;border-radius:16px;justify-content:space-between;align-items:center;gap:24px;margin-bottom:18px;padding:14px 18px;display:flex}.intro-strip>div{align-items:center;gap:12px;display:flex}.intro-strip p{color:#bdd3df;margin:0;font-size:.9rem}.intro-strip__icon{width:27px;height:27px;color:var(--teal);background:#41d9bd29;border-radius:50%;flex:none;place-items:center;font-weight:900;display:grid}.intro-strip .intro-strip__warning{color:#ffcf78;font-size:.8rem}.status-shell{grid-template-columns:1fr 1fr 1.2fr auto;gap:12px;margin-bottom:18px;display:grid}.status-card,.status-actions{border:1px solid var(--line);min-height:112px;box-shadow:var(--shadow);background:linear-gradient(145deg,#102d41f0,#0a2131f0);border-radius:18px}.status-card{flex-direction:column;justify-content:center;padding:18px 20px;display:flex}.status-card__title{color:#95adbc;align-items:center;gap:9px;font-size:.78rem;font-weight:700;display:flex}.status-card strong{color:#f3fbff;margin-top:8px;font-size:1.24rem}.status-card small{color:#7490a2;margin-top:2px;font-size:.7rem}.status-dot{background:var(--muted);border:2px solid #ffffff24;border-radius:50%;flex:none;width:9px;height:9px}.status-dot--connecting,.status-dot--reconnecting{background:var(--amber);animation:1.4s ease-in-out infinite pulse;box-shadow:0 0 12px #ffc55db8}.status-dot--connected{background:var(--teal);box-shadow:0 0 12px #41d9bdc2}.status-dot--disconnected{background:#698496}.status-dot--error{background:var(--red);box-shadow:0 0 12px #ff7c84a3}.status-icon{color:var(--cyan);font-size:1rem}.status-actions{gap:8px;min-width:190px;padding:11px;display:grid}.button{color:#eaf8ff;cursor:pointer;border:1px solid #0000;border-radius:11px;padding:10px 15px;font-weight:700;transition:transform .16s,border-color .16s,background .16s}.button:not(:disabled):hover{transform:translateY(-1px)}.button--primary{background:linear-gradient(135deg,#18a9c9,#3282e7);box-shadow:0 8px 22px #1f8bd338}.button--ghost{border-color:var(--line);color:#a8c2d2;background:#081d2cdb}.button--ghost:not(:disabled):hover{border-color:var(--line-strong);background:#16394eeb}.button--small{padding:7px 11px;font-size:.75rem}.dashboard-grid{grid-template-columns:1.45fr .78fr;gap:18px;display:grid}.panel{border:1px solid var(--line);box-shadow:var(--shadow);background:linear-gradient(145deg,#112f44f0,#091e2df5);border-radius:22px;position:relative;overflow:hidden}.panel:before{content:"";background:linear-gradient(90deg,#0000,#5fddf661,#0000);height:1px;position:absolute;inset:0 0 auto}.soil-panel,.events-panel,.command-panel{padding:24px}.soil-panel{grid-row:span 2}.panel-heading{justify-content:space-between;align-items:flex-start;gap:18px;display:flex}.eyebrow,.panel-heading h2{margin:0}.eyebrow{color:#62cfe7;letter-spacing:.12em;text-transform:uppercase;font-family:Roboto Mono,monospace;font-size:.68rem;font-weight:700}.panel-heading h2{margin-top:4px;font-size:1.25rem}.sample-count,.live-pill{border:1px solid var(--line);color:#89a8b9;background:#061b2994;border-radius:999px;font-family:Roboto Mono,monospace;font-size:.66rem}.sample-count{padding:7px 10px}.live-pill{padding:6px 9px}.soil-reading{align-items:baseline;gap:10px;margin-top:21px;display:flex}.soil-reading strong{color:#dffcff;letter-spacing:-.08em;text-shadow:0 0 35px #55d8f538;font-family:Roboto Mono,monospace;font-size:clamp(3.2rem,7vw,6.2rem);line-height:1}.soil-reading span{color:var(--cyan);font-family:Roboto Mono,monospace;font-size:.85rem;font-weight:700}.chart-wrap{background:linear-gradient(#071f2d8f,#06172233),repeating-linear-gradient(90deg,#0000 0 59px,#77b3c509 60px);border:1px solid #6dbfda1f;border-radius:17px;min-height:290px;margin-top:22px;position:relative;overflow:hidden}.soil-chart{width:100%;height:290px;display:block}.chart-grid{stroke:#8bcbdd1c;stroke-width:1px}.chart-line{fill:none;stroke:var(--teal);stroke-linecap:round;stroke-linejoin:round;stroke-width:3.6px;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 6px #41d9bd73)}.chart-scale{color:#638496;justify-content:space-between;font-family:Roboto Mono,monospace;font-size:.62rem;display:flex;position:absolute;inset:13px 15px auto}.empty-state{text-align:center;place-content:center;min-height:290px;display:grid}.empty-state span{color:#3bc7d9;opacity:.55;font-size:3rem}.empty-state p{color:#66879a;margin:8px 0 0;font-size:.82rem}.panel-note{color:#6e8da0;margin:16px 0 0;font-size:.76rem;line-height:1.65}.button-counters{grid-template-columns:1fr 1fr;gap:12px;margin-top:22px;display:grid}.button-counter{border:1px solid var(--line);background:#081e2c8f;border-radius:16px;grid-template-columns:auto 1fr auto;align-items:baseline;gap:10px;padding:18px;display:grid}.button-counter>span{border-radius:10px;place-items:center;width:32px;height:32px;font-family:Roboto Mono,monospace;font-weight:800;display:grid}.button-counter--a>span{color:#6ba9ff;background:#4c92ff2b}.button-counter--b>span{color:var(--teal);background:#41d9bd26}.button-counter strong{justify-self:end;font-family:Roboto Mono,monospace;font-size:2rem}.button-counter small{color:#7994a5}.last-event{background:#061a2785;border-radius:13px;flex-direction:column;margin-top:13px;padding:14px 16px;display:flex}.last-event span{color:#67889a;font-size:.68rem}.last-event strong{color:#c7dbe6;overflow-wrap:anywhere;margin-top:4px;font-family:Roboto Mono,monospace;font-size:.76rem}.command-buttons{grid-template-columns:1fr 1fr;gap:12px;margin-top:22px;display:grid}.led-button{cursor:pointer;border-radius:14px;justify-content:center;align-items:center;gap:9px;min-height:59px;font-weight:800;transition:transform .16s,filter .16s;display:flex}.led-button:not(:disabled):hover{filter:brightness(1.08);transform:translateY(-2px)}.led-button--on{color:#baffee;background:linear-gradient(135deg,#20a18973,#2575766b);border:1px solid #3fddb657}.led-button--off{color:#b4c7d3;background:#102d3ec7;border:1px solid #789baf47}.led-symbol{font-size:1.35rem}.command-state{border:1px solid var(--line);background:#071b298c;border-radius:13px;margin-top:13px;padding:13px 15px}.command-state__label{color:#668799;font-size:.66rem;display:block}.command-state strong{color:#bfd4e0;margin-top:3px;font-size:.82rem;display:block}.command-state--waiting{background:#6d4b1329;border-color:#ffc55d3d}.command-state--waiting strong{color:var(--amber)}.command-state--acknowledged strong{color:var(--teal)}.command-state--failed strong,.command-state--timeout strong{color:var(--red)}.command-details{border:1px solid var(--line);background:var(--line);border-radius:13px;grid-template-columns:1fr 1fr;gap:1px;margin:13px 0 0;display:grid;overflow:hidden}.command-details div{background:#0b293d;min-width:0;padding:11px 13px}.command-details dt{color:#678799;font-size:.62rem}.command-details dd{overflow-wrap:anywhere;color:#bad0dc;margin:4px 0 0;font-family:Roboto Mono,monospace;font-size:.67rem}.safe-error{background:#71202a2e;border:1px solid #ff7c8442;border-radius:15px;align-items:flex-start;gap:12px;margin-top:18px;padding:15px 18px;display:flex}.safe-error>span{width:26px;height:26px;color:var(--red);background:#ff7c8429;border-radius:50%;place-items:center;font-weight:900;display:grid}.safe-error strong,.safe-error p{margin:0}.safe-error strong{color:#ffc1c5;font-size:.78rem}.safe-error p{color:#d2939b;margin-top:3px;font-size:.78rem}.raw-log{border:1px solid var(--line);background:#081c2ac7;border-radius:18px;margin-top:18px;overflow:hidden}.raw-log summary{color:#bcd2dd;cursor:pointer;justify-content:space-between;align-items:center;gap:18px;padding:17px 19px;font-size:.84rem;font-weight:700;list-style:none;display:flex}.raw-log summary::-webkit-details-marker{display:none}.raw-log summary strong{color:var(--cyan);margin-left:5px;font-family:Roboto Mono,monospace}.summary-hint{color:#648597;font-size:.68rem;font-weight:500}.raw-log__toolbar{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#0517237a;justify-content:space-between;align-items:center;gap:16px;padding:12px 18px;display:flex}.raw-log__toolbar p{color:#668699;margin:0;font-size:.7rem}.raw-log__list{max-height:420px;overflow:auto}.raw-log__empty{color:#6b8798;margin:0;padding:24px 18px;font-size:.78rem}.log-row{border-bottom:1px solid #7fb7cc17;grid-template-columns:128px minmax(220px,.7fr) 1.3fr;gap:15px;padding:12px 18px;font-family:Roboto Mono,monospace;font-size:.69rem;display:grid}.log-row:last-child{border-bottom:0}.log-meta{color:#66889a;gap:9px;display:flex}.log-meta span{color:var(--cyan)}.log-row--out .log-meta span{color:var(--amber)}.log-row--system .log-meta span{color:#a7a0ff}.log-topic{color:#9cb5c4;overflow-wrap:anywhere}.log-row pre{white-space:pre-wrap;overflow-wrap:anywhere;color:#bfd0d9;font:inherit;margin:0}.log-error{color:var(--red);grid-column:2/-1;margin:0}.safety-grid{grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px;display:grid}.safety-grid>div{border:1px solid var(--line);background:#0a22329e;border-radius:15px;grid-template-columns:auto 1fr;align-items:start;gap:11px;padding:16px;display:grid}.safety-grid span{color:#4cbfd7;font-family:Roboto Mono,monospace;font-size:.68rem}.safety-grid p{color:#87a2b2;margin:0;font-size:.74rem;line-height:1.6}.safety-grid strong{color:#c5d8e2;margin-bottom:2px;font-size:.78rem;display:block}footer{border-top:1px solid var(--line);color:#5f7c8e;justify-content:space-between;gap:20px;padding:23px 0 30px;font-size:.68rem;display:flex}footer p{margin:0}.footer-tech{overflow-wrap:anywhere;text-align:right;max-width:58%;font-family:Roboto Mono,monospace}@keyframes pulse{0%,to{opacity:.55;transform:scale(.88)}50%{opacity:1;transform:scale(1)}}@media (width<=1100px){.status-shell{grid-template-columns:1fr 1fr}.status-actions{grid-template-columns:1.5fr 1fr 1fr;min-width:0;min-height:auto}.dashboard-grid{grid-template-columns:1fr}.soil-panel{grid-row:auto}}@media (width<=700px){.app-shell{padding:0 15px}.topbar{min-height:88px}.brand-mark{border-radius:14px;width:48px;height:48px}.brand-copy p{font-size:.61rem}.brand-copy h1{font-size:1.12rem}.scope-chip{display:none}main{padding-top:19px}.intro-strip{flex-direction:column;align-items:flex-start;gap:9px;padding:13px 14px}.intro-strip p{font-size:.78rem;line-height:1.55}.status-shell{grid-template-columns:1fr 1fr}.status-card{min-height:103px;padding:14px}.status-card--wide,.status-actions{grid-column:1/-1}.status-card strong{font-size:1.05rem}.status-actions{grid-template-columns:1fr 1fr}.status-actions .button--primary{grid-column:1/-1}.soil-panel,.events-panel,.command-panel{padding:18px}.panel-heading h2{font-size:1.08rem}.soil-reading strong{font-size:clamp(3.6rem,20vw,5rem)}.chart-wrap,.soil-chart,.empty-state{height:230px;min-height:230px}.command-details,.safety-grid{grid-template-columns:1fr}.raw-log summary,.raw-log__toolbar{flex-direction:column;align-items:flex-start}.summary-hint{display:none}.log-row{grid-template-columns:1fr;gap:7px}.log-error{grid-column:auto}footer{flex-direction:column}.footer-tech{text-align:left;max-width:100%}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}