: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;--green-soft:#41d9bd1a;--amber-soft:#ffc55d1a;--red-soft:#ff7c841a;--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.72rem);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}.section-heading{justify-content:space-between;align-items:end;gap:24px;margin:28px 2px 14px;display:flex}.section-heading h2,.section-heading p{margin:0}.section-heading h2{margin-top:4px;font-size:clamp(1.2rem,2vw,1.55rem)}.section-heading>p{color:#7895a6;text-align:right;max-width:460px;font-size:.78rem;line-height:1.6}.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}.diagnostics{margin-top:18px}.diagnostic-summary{border:1px solid var(--line);box-shadow:var(--shadow);background:linear-gradient(135deg,#0d2d40f5,#081c2bf5);border-radius:20px;align-items:center;gap:16px;padding:18px 20px;display:flex}.diagnostic-summary--ok{background:linear-gradient(135deg,#1b675c3b,#082330f2);border-color:#41d9bd42}.diagnostic-summary--waiting{border-color:#ffc55d3d}.diagnostic-summary--error{background:linear-gradient(135deg,#6d23304d,#091f2cf5);border-color:#ff7c8459}.diagnostic-summary__icon{width:46px;height:46px;color:var(--cyan);background:#55d8f51a;border-radius:15px;flex:none;place-items:center;font-size:1.45rem;font-weight:900;display:grid}.diagnostic-summary--ok .diagnostic-summary__icon{color:var(--teal);background:#41d9bd24}.diagnostic-summary--error .diagnostic-summary__icon{color:var(--red);background:#ff7c8424}.diagnostic-summary h2,.diagnostic-summary p{margin:0}.diagnostic-summary h2{margin-top:3px;font-size:1.12rem}.diagnostic-summary>div:last-child>p:last-child{color:#8ca6b6;margin-top:5px;font-size:.77rem;line-height:1.55}.channel-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:12px;display:grid}.channel-card{border:1px solid var(--line);background:#0a2232d1;border-radius:17px;min-width:0;padding:17px}.channel-card--ok{background:linear-gradient(145deg, var(--green-soft), #092231e6);border-color:#41d9bd3d}.channel-card--waiting{background:linear-gradient(145deg, var(--amber-soft), #092231e6);border-color:#ffc55d38}.channel-card--error{background:linear-gradient(145deg, var(--red-soft), #092231e6);border-color:#ff7c844d}.channel-card>div{align-items:center;gap:9px;display:flex}.channel-card>div span{color:#4fc8e1;font-family:Roboto Mono,monospace;font-size:.62rem}.channel-card>div strong{color:#a8c0ce;font-size:.76rem}.channel-card b,.channel-card small,.channel-card code{display:block}.channel-card b{color:#eaf8ff;margin-top:13px;font-size:.92rem}.channel-card--ok b{color:#83f0d8}.channel-card--error b{color:#ffabb0}.channel-card small{color:#718e9f;min-height:30px;margin-top:4px;font-size:.66rem;line-height:1.45}.channel-card code{color:#8eb0c0;text-overflow:ellipsis;white-space:nowrap;margin-top:11px;font-size:.61rem;overflow:hidden}.hardware-map{border:1px solid var(--line);background:var(--line);border-radius:16px;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:12px;display:grid;overflow:hidden}.hardware-map>div{background:#081d2cf5;grid-template-columns:auto 1fr;align-items:center;gap:11px;min-width:0;padding:14px 16px;display:grid}.hardware-map span{width:34px;height:34px;color:var(--cyan);background:#55d8f51a;border-radius:11px;place-items:center;font-family:Roboto Mono,monospace;font-size:.68rem;font-weight:800;display:grid}.hardware-map p,.hardware-map em{margin:0}.sync-panel{box-shadow:var(--shadow);background:radial-gradient(circle at 0 0,#249bb824,#0000 24rem),linear-gradient(145deg,#0e2b3df5,#071c2af5);border:1px solid #55d8f533;border-radius:22px;grid-template-columns:minmax(0,.86fr) minmax(520px,1.14fr);gap:18px;margin-top:18px;padding:22px;display:grid}.sync-panel__copy h2,.sync-panel__copy p{margin:0}.sync-panel__copy h2{margin-top:5px;font-size:1.18rem}.sync-panel__copy>p:last-of-type{color:#829faf;max-width:560px;margin-top:8px;font-size:.76rem;line-height:1.65}.sync-actions{flex-wrap:wrap;gap:9px;margin-top:17px;display:flex}.sync-actions a{justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.sync-steps{grid-template-columns:1fr 1fr;gap:9px;margin:0;padding:0;list-style:none;display:grid}.sync-step{border:1px solid var(--line);background:#05192694;border-radius:14px;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;min-width:0;padding:13px;display:grid}.sync-step>span{color:#7394a6;background:#648ba01f;border-radius:10px;place-items:center;width:29px;height:29px;font-family:Roboto Mono,monospace;font-size:.64rem;font-weight:800;display:grid}.sync-step strong,.sync-step small{display:block}.sync-step strong{color:#bdcfda;font-size:.72rem}.sync-step small{color:#6f8c9d;text-overflow:ellipsis;white-space:nowrap;margin-top:2px;font-size:.61rem;overflow:hidden}.sync-step b{color:#8ca7b6;font-size:.65rem}.sync-step--ok{background:#1f6b5e1f;border-color:#41d9bd3b}.sync-step--ok>span{color:var(--teal);background:#41d9bd21}.sync-step--ok b{color:#76e4cf}.sync-step--error{background:#70222d1f;border-color:#ff7c8447}.sync-step--error>span,.sync-step--error b{color:#ff9ba2}.hardware-map p{color:#7995a5;font-size:.69rem}.hardware-map strong{color:#c6d9e3;font-size:.76rem;display:block}.hardware-map em{color:#d4aa61;grid-column:2;font-size:.61rem;font-style:normal}.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}.live-pill--ready{color:#82decf;background:#22746626;border-color:#41d9bd40}.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}.raw-meter{background:#0519267a;border:1px solid #6dbfda21;border-radius:14px;margin-top:18px;padding:13px 15px}.raw-meter__track{background:linear-gradient(90deg,#367db459,#41d9bd59);border-radius:999px;height:9px;position:relative}.raw-meter__fill{border-radius:inherit;background:linear-gradient(90deg, #498fe5, var(--teal));height:100%;display:block;box-shadow:0 0 14px #41d9bd40}.raw-meter__marker{background:#2abfa8;border:3px solid #dffcff;border-radius:50%;width:16px;height:16px;position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 13px #41d9bda6}.raw-meter__labels{color:#7695a5;justify-content:space-between;margin-top:7px;font-family:Roboto Mono,monospace;font-size:.6rem;display:flex}.raw-meter p{color:#698898;margin:7px 0 0;font-size:.65rem;line-height:1.5}.raw-meter--empty{opacity:.6}.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}.empty-state strong{color:#a9c5d4;font-size:.88rem}.empty-state code{border:1px solid var(--line);color:#9bb8c7;background:#03141e99;border-radius:9px;margin:14px auto 0;padding:8px 11px;font-size:.68rem;display:inline-block}.empty-state--alert span,.empty-state--alert strong{color:var(--red)}.panel-note{color:#6e8da0;margin:16px 0 0;font-size:.76rem;line-height:1.65}.panel-note--split{justify-content:space-between;gap:20px;display:flex}.panel-note--split span:last-child{color:#8aa6b6;flex:none;font-family:Roboto Mono,monospace}.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-recovery{background:#6f222c24;border:1px solid #ff7c843d;border-radius:12px;margin-top:11px;padding:12px 14px}.command-recovery strong,.command-recovery p{margin:0}.command-recovery .button{margin-top:9px}.command-recovery strong{color:#ffb4b8;font-size:.7rem}.command-recovery p{color:#b98990;margin-top:3px;font-size:.68rem;line-height:1.5}.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}.channel-grid{grid-template-columns:1fr 1fr}.sync-panel{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}.section-heading{flex-direction:column;align-items:flex-start;gap:6px}.section-heading>p{text-align:left}.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}.diagnostic-summary{align-items:flex-start;padding:16px}.diagnostic-summary h2{font-size:1rem}.channel-grid,.hardware-map{grid-template-columns:1fr}.sync-panel{padding:17px}.sync-actions,.sync-actions a{width:100%}.sync-steps{grid-template-columns:1fr}.hardware-map em{grid-column:2}.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{grid-template-columns:1fr}.panel-note--split{flex-direction:column;gap:4px}.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}}
