:root{--bg: #0b1020;--bg-card: #141a30;--bg-card-2: #1a2140;--fg: #e6ecff;--fg-dim: #8a92b2;--accent: #6aa4ff;--good: #3ddc84;--warn: #ffb454;--err: #ff6b6b;--border: #22294a}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;background:var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;overscroll-behavior:none}#app{min-height:100%;padding:max(env(safe-area-inset-top),12px) 12px max(env(safe-area-inset-bottom),12px) 12px;display:flex;flex-direction:column;gap:12px}header{display:flex;align-items:center;justify-content:space-between;padding:4px 4px 0}header h1{margin:0;font-size:18px;font-weight:600;letter-spacing:.2px}.state-pill{padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;background:var(--bg-card);color:var(--fg-dim);border:1px solid var(--border)}.state-pill.connected{color:var(--good);border-color:var(--good)}.state-pill.connecting{color:var(--warn);border-color:var(--warn)}.state-pill.error{color:var(--err);border-color:var(--err)}.controls{display:flex;gap:8px;flex-wrap:wrap}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:var(--bg-card);color:var(--fg);padding:10px 14px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;min-height:44px;flex:1 1 auto}button.primary{background:var(--accent);color:#081226;border-color:transparent}button.danger{background:var(--err);color:#240808;border-color:transparent}button:disabled{opacity:.4;cursor:not-allowed}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.tile{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:6px;min-height:104px}.tile .label{color:var(--fg-dim);font-size:12px;text-transform:uppercase;letter-spacing:.6px}.tile .value{font-size:36px;font-weight:700;line-height:1.05;font-variant-numeric:tabular-nums}.tile .unit{color:var(--fg-dim);font-size:13px}.log{background:var(--bg-card-2);border:1px solid var(--border);border-radius:12px;padding:10px 12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--fg-dim);max-height:160px;overflow-y:auto;white-space:pre-wrap;word-break:break-word}.row{display:flex;gap:8px;align-items:center;justify-content:space-between;font-size:13px;color:var(--fg-dim)}.kbd{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--bg-card);padding:1px 6px;border-radius:4px;color:var(--fg);border:1px solid var(--border)}.banner{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:12px;font-size:13px;color:var(--fg-dim);line-height:1.4}.banner b{color:var(--fg)}.terminal-wrap{display:flex;flex-direction:column;gap:8px;background:#05070f;border:1px solid var(--border);border-radius:12px;padding:10px 10px 0;flex:1 1 auto;min-height:280px}.terminal-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.terminal-bar input[type=search]{flex:1 1 100px;min-width:80px;background:var(--bg-card);color:var(--fg);border:1px solid var(--border);border-radius:8px;padding:6px 10px;font:13px ui-monospace,SFMono-Regular,Menlo,monospace}.terminal-bar button.sm{min-height:32px;padding:4px 10px;font-size:12px;flex:0 0 auto;transition:background-color .12s,color .12s,border-color .12s}.terminal-bar button.sm[data-kind=ok]{background:#0e2a18;color:var(--good);border-color:var(--good)}.terminal-bar button.sm[data-kind=warn]{background:#2b2210;color:var(--warn);border-color:var(--warn)}.terminal-bar button.sm[data-kind=err]{background:#2a0f10;color:var(--err);border-color:var(--err)}.terminal-status{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.5px;padding:3px 8px;border-radius:6px;background:var(--bg-card);color:var(--fg-dim);border:1px solid var(--border)}.terminal-status[data-kind=ok]{color:var(--good);border-color:var(--good)}.terminal-status[data-kind=warn]{color:var(--warn);border-color:var(--warn)}.terminal-status[data-kind=err]{color:var(--err);border-color:var(--err)}.terminal-counter{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--fg-dim);margin-left:auto}.terminal-body{flex:1 1 auto;margin:0 -10px;padding:10px;overflow-y:auto;font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;color:#c8d1e4;white-space:pre-wrap;word-break:break-word;max-height:60vh;border-top:1px solid var(--border);border-radius:0 0 12px 12px;background:#03050c}.terminal-body .t-ts{color:#6b7591}.terminal-body .t-key{color:#58c4ff}.terminal-body .t-val{color:#3ddc84;font-weight:600}.terminal-body .t-unit{color:#6b7591;margin-left:1px}.terminal-body .t-info{color:#ffb454}.terminal-body .t-err{color:var(--err)}.t-badge-remote{display:inline-block;background:#1a2140;color:#58c4ff;border:1px solid #244169;border-radius:4px;padding:0 4px;font-size:10px;margin-right:4px}.dtc-panel{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px}.dtc-header{display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:14px}.dtc-header button.sm{min-height:28px;padding:0 10px;font-size:16px;background:transparent;border:1px solid var(--border);color:var(--fg-dim);border-radius:6px}.dtc-loading,.dtc-empty,.dtc-error{color:var(--fg-dim);font-size:13px;padding:6px 0}.dtc-empty{color:var(--good)}.dtc-error{color:var(--err)}.dtc-section{margin-top:8px}.dtc-section-title{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--fg-dim);margin-bottom:6px}.dtc-stored .dtc-code{color:var(--err)}.dtc-pending .dtc-code{color:var(--warn)}.dtc-permanent .dtc-code{color:var(--err)}.dtc-row{display:grid;grid-template-columns:auto 1fr auto auto;gap:10px;align-items:center;padding:6px 8px;background:var(--bg-card-2);border-radius:6px;margin-bottom:4px;font-size:13px}.dtc-code{font:600 13px ui-monospace,Menlo,monospace}.dtc-system{color:var(--fg-dim);font-size:12px;text-transform:lowercase}.dtc-origin{color:var(--fg-dim);font-size:11px}.dtc-lookup{color:var(--accent);font-size:12px;text-decoration:none}.stream-row{display:flex;align-items:center;gap:8px;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:8px 10px}.stream-row .stream-label{font-size:11px;color:var(--fg-dim);text-transform:uppercase;letter-spacing:.6px;flex:0 0 auto}.stream-row .stream-url{flex:1 1 auto;background:var(--bg-card-2);padding:6px 8px;border-radius:6px;font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stream-row button.sm{min-height:32px;padding:4px 12px;font-size:12px;flex:0 0 auto;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:var(--bg-card);color:var(--fg);border-radius:8px;font-weight:600}.nav{display:flex;gap:4px;padding:4px;background:var(--bg-card);border:1px solid var(--border);border-radius:10px}.nav button{flex:1 1 auto;background:transparent;border:none;min-height:36px;font-size:13px;color:var(--fg-dim);padding:6px 10px}.nav button.active{background:var(--bg-card-2);color:var(--fg);border-radius:8px}