:root { color-scheme: dark; font-family: system-ui, -apple-system, "Noto Sans TC", sans-serif; background: #071321; color: #edf6ff; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at top, #12365c, #071321 52%); }
.app-shell { width: min(100%, 520px); margin: auto; padding: 24px 16px calc(28px + env(safe-area-inset-bottom)); }
header { padding: 8px 4px 18px; } .eyebrow { margin: 0 0 5px; color: #70d9ff; font-size: .78rem; letter-spacing: .09em; } h1 { margin: 0; font-size: 1.55rem; }
.card { margin: 12px 0; padding: 16px; border: 1px solid #2e597c; border-radius: 16px; background: rgba(6, 21, 36, .88); box-shadow: 0 8px 25px #0005; }
.connection-card > div:not(.button-row) { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; } .label { color: #9eb9cd; } strong { overflow-wrap: anywhere; text-align: right; }
.button-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
button { min-height: 48px; border: 0; border-radius: 12px; padding: 10px 14px; font: inherit; font-weight: 700; touch-action: manipulation; } button:disabled { opacity: .45; } .primary { color: #022033; background: #76ddff; } .secondary { color: #d8ecfa; background: #254867; } .text-button { min-height: 36px; color: #9edfff; background: transparent; padding: 4px; }
label, h2 { display: block; margin-bottom: 9px; font-size: 1rem; } textarea { display: block; width: 100%; resize: vertical; border: 1px solid #3d6889; border-radius: 10px; padding: 12px; background: #071321; color: #fff; font: inherit; } #sendButton { width: 100%; margin-top: 10px; } .device-status { margin: 13px 0 0; color: #abd2e9; font-size: .9rem; overflow-wrap: anywhere; }
.section-heading { display: flex; justify-content: space-between; align-items: center; } .section-heading h2 { margin: 0; } #log { max-height: 43vh; overflow-y: auto; margin: 12px 0 0; padding: 0; list-style: none; } #log li { border-top: 1px solid #244763; padding: 10px 2px; color: #c6dfef; font-family: ui-monospace, monospace; font-size: .78rem; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; } .timestamp { color: #70d9ff; }