Skip to content

Variable: REMOTE_BAR_STYLES

const REMOTE_BAR_STYLES: "\n :root { color-scheme: light dark; }\n .aiui-remote-bar { font: 13px/1.45 system-ui, sans-serif; padding: 12px; max-width: 460px; }\n .aiui-remote-status { font-size: 11px; opacity: 0.7; margin-bottom: 8px; }\n .aiui-remote-phase { display: inline-block; padding: 2px 10px; border-radius: 999px; font-weight: 600;\n border: 1px solid color-mix(in srgb, currentColor 35%, transparent); }\n .aiui-remote-phase[data-phase="turn"], .aiui-remote-phase[data-phase="tweak"] { color: #7c3aed; }\n .aiui-remote-rows { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 10px; }\n .aiui-remote-cap { border: 1px solid color-mix(in srgb, currentColor 25%, transparent);\n border-radius: 6px; padding: 3px 8px; background: transparent; cursor: pointer; font: inherit;\n touch-action: manipulation; -webkit-tap-highlight-color: transparent;\n transition: transform 60ms ease-out, background 60ms ease-out, border-color 60ms ease-out; }\n .aiui-remote-cap:active:not([disabled]) { transform: scale(0.92);\n background: color-mix(in srgb, #7c3aed 30%, transparent); border-color: #7c3aed; }\n .aiui-remote-cap[data-lit="true"] { background: color-mix(in srgb, #7c3aed 18%, transparent);\n border-color: #7c3aed; }\n .aiui-remote-cap[disabled] { opacity: 0.4; cursor: default; }\n .aiui-remote-cap[data-tone="danger"] { border-color: color-mix(in srgb, #dc2626 60%, transparent); }\n .aiui-remote-claims { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 4px; }\n .aiui-remote-claim { font-size: 11px; padding: 1px 7px; border-radius: 999px;\n border: 1px solid color-mix(in srgb, currentColor 20%, transparent); opacity: 0.75; }\n .aiui-remote-claim[data-phase="active"] { color: #16a34a; opacity: 1; }\n .aiui-remote-claim[data-phase="pending"] { color: #d97706; opacity: 1; }\n .aiui-remote-claim[data-phase="error"] { color: #dc2626; opacity: 1; }\n .aiui-remote-sessions { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; }\n .aiui-remote-session { text-align: left; border: 1px solid color-mix(in srgb, currentColor 25%, transparent);\n border-radius: 6px; padding: 6px 10px; background: transparent; cursor: pointer; font: inherit;\n touch-action: manipulation; -webkit-tap-highlight-color: transparent; }\n .aiui-remote-session:active { background: color-mix(in srgb, currentColor 12%, transparent); }\n .aiui-remote-session small { display: block; opacity: 0.6; }\n .aiui-remote-note { margin-top: 8px; opacity: 0.8; }\n .aiui-remote-note[data-tone="error"] { color: #dc2626; }\n .aiui-remote-leave { margin-top: 10px; font-size: 11px; background: none; border: none;\n color: inherit; opacity: 0.6; cursor: pointer; text-decoration: underline; padding: 0; }\n"

Defined in: ui/RemoteBar.tsx:16