.mode-switch{--mode-switch-on-bg:var(--text-primary);--mode-switch-on-ink:var(--accent);position:relative;display:inline-grid;grid-template-columns:1fr 1fr;flex:none;padding:3px;border:1px solid var(--hairline);border-radius:999px;background:var(--row-alt);font-family:var(--font-ui)}:root[data-theme=dark] .mode-switch{--mode-switch-on-bg:var(--accent);--mode-switch-on-ink:var(--on-accent)}.mode-switch-option{min-height:36px;padding:6px 14px;border:0;border-radius:999px;background:transparent;color:var(--text-secondary);font:inherit;font-size:.86rem;font-weight:600;line-height:1.2;text-align:center;white-space:nowrap;cursor:pointer;transition:background-color .15s ease,color .15s ease}.mode-switch-option:hover{color:var(--text-primary)}.mode-switch-option[aria-pressed=true]{background:var(--mode-switch-on-bg);color:var(--mode-switch-on-ink);cursor:default}.mode-switch-option:focus-visible{outline:3px solid var(--primary);outline-offset:2px}.mode-switch[aria-busy=true] .mode-switch-option{cursor:progress}.mode-switch-error{position:absolute;top:calc(100% + 6px);right:0;z-index:5;width:max-content;max-width:240px;padding:6px 10px;border-radius:8px;background:var(--ink-panel);box-shadow:var(--shadow-card);color:var(--text-error);font-size:.8rem;font-weight:500}.crm-page .crm-example-bar .mode-switch{--mode-switch-on-bg:var(--accent);--mode-switch-on-ink:var(--on-accent);margin-left:auto;border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.06)}.crm-page .crm-example-bar .mode-switch-option:not([aria-pressed=true]){color:var(--text-secondary)}.crm-page .crm-example-bar .mode-switch-option:not([aria-pressed=true]):hover{color:var(--text-primary)}.crm-page .crm-example-bar .mode-switch-option:focus-visible{outline-color:var(--accent)}.app-topbar .mode-switch{margin-left:auto}.app-topbar .mode-switch-option{min-height:34px;padding:5px 12px;font-size:.82rem}.app-sidebar-head .mode-switch{display:grid;width:100%;margin-top:4px}@media (max-width:380px){.app-topbar .mode-switch-option{padding:5px 9px}}@media (prefers-reduced-motion:reduce){.mode-switch-option{transition:none}}@media (max-width:560px){[data-crm-compact-example] .crm-example-header .mode-switch-option{min-height:34px;padding:5px 10px;font-size:.8rem}}