*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #0f172a;--surface: #1e293b;--accent: #38bdf8;--accent-hot: #f97316;--text: #f1f5f9;--text-muted: #94a3b8;--connected: #22c55e;--disconnected: #ef4444}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;min-height:100dvh;display:flex;align-items:center;justify-content:center}.app{width:100%;max-width:400px;padding:2rem 1.5rem;display:flex;flex-direction:column;align-items:center;gap:2.5rem;min-height:100dvh;justify-content:space-between}header{display:flex;flex-direction:column;align-items:center;gap:.75rem;width:100%}h1{font-size:1.4rem;font-weight:600;color:var(--text-muted);letter-spacing:.05em;text-transform:uppercase}.status{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem 1rem;border-radius:999px;font-size:.85rem;font-weight:500}.status:before{content:"";width:8px;height:8px;border-radius:50%;display:inline-block}.status.connected{background:#22c55e26;color:var(--connected)}.status.connected:before{background:var(--connected);box-shadow:0 0 6px var(--connected)}.status.disconnected{background:#ef444426;color:var(--disconnected)}.status.disconnected:before{background:var(--disconnected)}.status.connecting{background:#38bdf826;color:var(--accent);animation:pulse 1.2s infinite}.status.connecting:before{background:var(--accent)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}main{display:flex;flex-direction:column;align-items:center;gap:1rem;flex:1;justify-content:center}.temp-display{display:flex;align-items:flex-start;gap:.5rem;line-height:1}.temperature{font-size:8rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.03em;color:var(--accent);transition:color .3s ease;min-width:4ch;text-align:right}.temperature.hot{color:var(--accent-hot)}.unit{font-size:2.5rem;font-weight:300;color:var(--text-muted);padding-top:1rem}.rssi-display{display:flex;align-items:center;gap:.5rem}.rssi-icon{width:28px;height:28px}.rssi-icon rect{fill:var(--surface);transition:fill .4s ease}.rssi-icon rect.active{fill:var(--accent)}.rssi-value{font-size:.9rem;color:var(--text-muted);font-variant-numeric:tabular-nums;min-width:6ch}.last-update{font-size:.8rem;color:var(--text-muted);min-height:1.2em}footer{width:100%}.btn-connect{width:100%;padding:1rem;border:none;border-radius:12px;font-size:1.1rem;font-weight:600;cursor:pointer;background:var(--accent);color:#0f172a;transition:background .2s,transform .1s,opacity .2s;letter-spacing:.02em}.btn-connect:hover{opacity:.9}.btn-connect:active{transform:scale(.98)}.btn-connect:disabled{opacity:.4;cursor:not-allowed}.btn-connect.connected{background:var(--surface);color:var(--disconnected);border:1px solid var(--disconnected)}