body { min-width: 0; min-height: 100vh; overflow-x: hidden; overflow-y: auto; }
:where([hidden]) { display: none !important; }
body.session-checking #login-view { visibility: hidden; }
.auth-login-background, .auth-login-shell { min-height: 100vh; }
.runtime-error-card { width: 100%; }
.runtime-error-meta { display: grid; gap: 14px; margin: 28px 0; }
.runtime-error-meta div { display: grid; gap: 6px; }
.runtime-error-meta dt { color: var(--auth-muted); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.runtime-error-meta dd { margin: 0; color: var(--auth-ink); font: inherit; font-size: 13px; font-weight: 750; }
.runtime-error-actions { display: grid; gap: 10px; margin-top: 4px; }
.runtime-error-actions .auth-login-submit { margin-top: 0; }
.runtime-error-reload { min-height: 48px; border: 1px solid var(--auth-line); border-radius: 9px; color: var(--auth-ink); background: transparent; font: inherit; font-size: 14px; font-weight: 800; cursor: pointer; }
.runtime-error-reload:hover { border-color: var(--auth-blue); color: var(--auth-blue-dark); background: rgba(52, 120, 246, .06); }
.runtime-error-status { margin: 16px 0 0; color: var(--auth-muted); font-size: 12px; text-align: center; }
.auth-shell { display: grid; place-items: center; min-height: calc(100vh - 32px); padding: clamp(24px, 6vw, 72px) clamp(18px, 5vw, 64px); background: radial-gradient(circle at 15% 15%, #eaf3ff, transparent 38%), #f5f8fb; }
.auth-card { width: min(100%, 440px); margin: 0 auto; padding: clamp(28px, 5vw, 44px); border: 1px solid #dce5ec; border-radius: 18px; background: rgba(255,255,255,.94); box-shadow: 0 24px 70px rgba(43,70,91,.12); }
.auth-back { display: inline-block; margin-bottom: 34px; color: #667b8a; font-size: 12px; font-weight: 700; text-decoration: none; }
.auth-back:hover { color: #4777d4; }
.auth-card h1 { margin: 0 0 10px; color: #182b3b; font-size: clamp(30px, 6vw, 42px); letter-spacing: -.045em; }
.auth-lead { margin-bottom: 26px; color: #667b8a; font-size: 13px; line-height: 1.6; }
.auth-form { display: grid; gap: 15px; }
.auth-form label { display: grid; gap: 7px; color: #496272; font-size: 12px; font-weight: 800; }
.auth-form input { min-height: 44px; padding: 0 13px; border: 1px solid #dce5ec; border-radius: 9px; color: #182b3b; background: #fff; font: inherit; font-size: 13px; outline: 0; }
.auth-form input:focus { border-color: #4777d4; box-shadow: 0 0 0 3px rgba(71,119,212,.14); }
.auth-form button { margin-top: 7px; }
.auth-error { margin: 0 0 16px; padding: 11px 12px; border: 1px solid #f0c4c4; border-radius: 9px; color: #9b3030; background: #fff1f1; font-size: 12px; line-height: 1.45; }
.auth-login-error.auth-info { border-color: #b8dfc5; color: #237a45; background: #effaf2; }
.link-button { display: inline-flex; margin: 0; padding: 0; border: 0; color: #4777d4; background: transparent; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.auth-card > .link-button { display: block; margin: 20px auto 0; }
.auth-login-links { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 22px; }
.auth-oauth-options { display: grid; gap: 14px; margin-top: 26px; }
.auth-oauth-divider { display: flex; align-items: center; gap: 12px; color: #7b8d99; font-size: 11px; text-transform: lowercase; }
.auth-oauth-divider::before, .auth-oauth-divider::after { flex: 1; height: 1px; background: #dce5ec; content: ""; }
.auth-oauth-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.auth-oauth-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 0 12px; border: 1px solid #dce5ec; border-radius: 9px; color: #34495a; background: #fff; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.auth-oauth-button:hover { border-color: #4777d4; color: #274fae; background: #f7faff; }
.auth-oauth-button img { width: 18px; height: 18px; object-fit: contain; }
body[data-color-mode="dark"] .auth-oauth-divider { color: #9eafc1; }
body[data-color-mode="dark"] .auth-oauth-divider::before, body[data-color-mode="dark"] .auth-oauth-divider::after { background: #344657; }
body[data-color-mode="dark"] .auth-oauth-button { border-color: #344657; color: #dbe7f1; background: #0d1722; }
body[data-color-mode="dark"] .auth-oauth-button:hover { border-color: #79a2ff; color: #fff; background: #142337; }
body[data-color-mode="dark"] .auth-oauth-button img { filter: none; }
body[data-color-mode="dark"] .auth-login-error.auth-info { border-color: #2f6d49; color: #a7e2b8; background: #122b1d; }
.auth-security { margin: 26px 0 0; color: #7b8d99; font-size: 11px; line-height: 1.5; text-align: center; }
.operations-shell { padding-top: 0; }
.operations-shell .app-frame { min-height: 100vh; }
.operations-shell .app-workspace { display: flex; flex-direction: column; min-height: 100vh; }
.operations-shell .side-panel { top: 0; height: 100vh; overflow: visible; }
.operations-shell .workspace-topbar { top: 0; }
.operations-shell .workspace-topbar { grid-template-columns: auto minmax(0, 1fr); gap: min(1.2vw, 16px); padding-inline: min(2vw, 24px); }
.operations-shell .workspace-topbar > *, .operations-shell .topbar-actions, .operations-shell .topbar-actions > * { min-width: 0; }
.operations-shell .topbar-actions { max-width: 100%; flex-wrap: nowrap; overflow: visible; }
.operations-shell .topbar-actions { grid-column: 2; justify-content: flex-end; }
.operations-shell .topbar-actions { gap: min(.6vw, 6px); }
.operations-shell .topbar-actions .topbar-home-link { flex: 0 1 auto; max-width: min(9vw, 90px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.operations-shell .topbar-actions .topbar-user { flex: 0 0 min(18vw, 170px); max-width: min(18vw, 170px); }
.operations-shell .topbar-actions .theme-toggle { min-width: 0; width: min(4vw, 42px); padding-inline: min(.8vw, 9px); }
.operations-shell .topbar-user { gap: min(.7vw, 8px); padding: min(.5vw, 5px) min(.8vw, 9px) min(.5vw, 5px) min(.4vw, 5px); }
.operations-shell .topbar-user .user-avatar { width: min(2.6vw, 28px); min-width: 0; height: min(2.6vw, 28px); }
.user-tag { display: inline-flex; align-items: center; min-width: max-content; padding: 3px 7px; border: 1px solid #cbd8ef; border-radius: 999px; color: #315da9; background: #eef4ff; font-size: 10px; font-weight: 800; line-height: 1; }
.server-performance-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); gap: 12px; }
.server-performance-card { display: grid; gap: 7px; min-width: 0; padding: 16px; border: 1px solid #e1e4ec; border-radius: 10px; background: #fff; }
.server-performance-card span { color: #718096; font-size: 11px; font-weight: 800; }
.server-performance-card strong { color: #273348; font-size: clamp(18px, 3vw, 26px); }
.server-performance-card small { overflow-wrap: anywhere; color: #89909f; font-size: 11px; }
.server-monitor-state { align-self: end; color: #718096; font-size: 11px; }
.server-dashboard { display: grid; gap: 14px; }
.server-monitor { display: grid; grid-template-columns: minmax(190px, 22vw) minmax(0, 1fr); gap: 12px; }
.server-metrics, .server-focus { --server-grid: #dbe3ec; min-width: 0; border: 1px solid #e1e4ec; border-radius: 10px; background: #fff; }
.server-metrics { align-self: start; padding: 12px; }
.server-metrics header { display: grid; gap: 3px; padding: 3px 4px 11px; }
.server-metrics header strong { color: #273348; font-size: 13px; }
.server-metrics header small { color: #89909f; font-size: 10px; }
.server-metric-list { display: grid; gap: 4px; }
.server-metric-button { display: grid; grid-template-columns: 3px minmax(0, 1fr) auto; align-items: center; gap: 9px; min-width: 0; padding: 9px 8px; border: 1px solid transparent; border-radius: 7px; color: #273348; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.server-metric-button:hover, .server-metric-button.is-active { border-color: #dbe4f1; background: #f4f7fb; }
.server-metric-line { width: 3px; height: 30px; border-radius: 3px; background: var(--server-metric-color); }
.server-metric-copy { display: grid; min-width: 0; gap: 3px; }
.server-metric-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.server-metric-copy small { overflow: hidden; color: #89909f; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.server-metric-button b { max-width: 7rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.server-focus { display: grid; gap: 11px; padding: clamp(14px, 2vw, 22px); }
.server-focus header { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.server-focus header div { display: grid; gap: 4px; }
.server-focus header span { color: #718096; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.server-focus header h2 { margin: 0; color: #273348; font-size: clamp(20px, 3vw, 30px); }
.server-focus header > strong { color: #273348; font-size: clamp(25px, 4vw, 38px); }
.server-focus > p { min-height: 15px; margin: 0; color: #89909f; font-size: 11px; }
.server-focus canvas { display: block; width: 100%; height: clamp(190px, 24vw, 300px); }
.server-focus-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.server-focus-stats span { display: grid; gap: 4px; padding: 9px; border-radius: 7px; background: #f4f7fb; }
.server-focus-stats small { color: #89909f; font-size: 10px; }
.server-focus-stats strong { color: #273348; font-size: 12px; }
.operations-shell .compact-language-picker { gap: min(.4vw, 4px); height: min(3.1vw, 34px); padding-inline: min(.7vw, 7px); }
.operations-shell .compact-language-picker .language-symbol { width: min(1.5vw, 16px); height: min(1.5vw, 16px); font-size: min(1.2vw, 13px); }
.operations-shell .compact-language-picker { inline-size: min(100%, 7rem); }
.module-nav .nav-link { border: 0; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.platform-content { min-width: 0; }
.platform-content > .idw-page { min-height: calc(100vh - 48px); }
.dashboard-panel { min-height: 0; }
.platform-view { display: grid; gap: 34px; }
.platform-card { display: grid; width: min(100%, 720px); gap: 18px; margin-inline: auto; padding: 22px; border: 1px solid #e6e8ed; border-radius: 10px; background: #fff; box-shadow: 0 8px 15px rgba(54,91,160,.08); }
.platform-card-heading { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 14px; }
.platform-card-heading > img { width: 40px; height: 40px; object-fit: contain; }
.platform-card h3 { margin: 0; color: #273348; font-size: 17px; font-weight: 500; }
.platform-card p { margin: 0; color: #89909f; font-size: 12px; line-height: 1.6; }
.platform-card .session-picker { display: grid; gap: 7px; color: #64748b; font-size: 11px; font-weight: 800; }
.platform-card .session-picker select { min-height: 38px; padding: 0 10px; border: 1px solid #e1e4ea; border-radius: 8px; color: #273348; background: #fff; font: inherit; font-size: 12px; }
.platform-tools { display: flex; flex-wrap: wrap; gap: 8px; }
.platform-tool { display: inline-flex; align-items: center; min-height: 30px; padding: 0 11px; border-radius: 999px; color: #4d6ed2; background: #eef4ff; font-size: 11px; font-weight: 800; }
.platform-empty { display: grid; gap: 12px; padding: 24px; border: 1px dashed #cdd8e5; border-radius: 10px; color: #667b8a; background: #f8fbff; }
.platform-empty strong { color: #273348; }
.platform-card .primary { justify-self: start; }
.platform-card.theme-blue { border-top: 3px solid #4777d4; }
.platform-card.theme-orange { border-top: 3px solid #ea580c; }
.platform-card.theme-green { border-top: 3px solid #16a34a; }
.platform-card.theme-yellow { border-top: 3px solid #ca8a04; }
.session-area { display: grid; width: min(100%, 430px); justify-items: center; gap: 12px; margin-inline: auto; padding: 16px; border: 1px solid #edf0f5; border-radius: 10px; background: #fafcff; text-align: center; }
.session-area .session-picker { width: 100%; text-align: left; }
.session-area .session-picker select { width: 100%; }
.session-area p { max-width: 360px; margin: 0; color: #718096; font-size: 12px; line-height: 1.55; }
.session-area .primary { justify-self: center; }
.idworks-session-row { display: flex; align-items: end; gap: 12px; max-width: 420px; }
.idworks-session-row .session-picker { flex: 1; }
.dashboard-tools button.module-lane { width: 100%; font: inherit; text-align: left; cursor: pointer; }
.dashboard-tools .module-lane.theme-orange { background: linear-gradient(115deg, #db6517, #f0a63a); }
.dashboard-tools .module-lane.theme-orange:hover { background: linear-gradient(115deg, #c95713, #e9982f); }
.dashboard-tools .module-lane.theme-yellow { background: linear-gradient(115deg, #ca8a04, #f2c94c); }
.dashboard-tools .module-lane.theme-yellow:hover { background: linear-gradient(115deg, #b77903, #e7b83d); }
.dashboard-tools .module-lane.theme-green { background: linear-gradient(115deg, #16a34a, #4cc978); }
.dashboard-tools .module-lane.theme-green:hover { background: linear-gradient(115deg, #128d40, #42b96b); }
.terminal-workspace .terminal-window { min-height: calc(100dvh - 110px); }
.page-crumb { gap: 0; min-height: clamp(34px, 4vw, 42px); overflow-x: auto; scrollbar-width: thin; }
.page-tab { position: relative; display: inline-flex; flex: 0 0 auto; align-items: center; gap: clamp(4px, .6vw, 8px); min-height: 100%; padding: 0 clamp(6px, 1vw, 12px); }
.page-tab-link,
.page-tab-close { padding: 0; border: 0; color: #202735; background: transparent; font: inherit; cursor: pointer; }
.page-tab-link { white-space: nowrap; }
.page-tab-close { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; color: #8d98a8; font-size: 15px; line-height: 1; }
.page-tab-close:hover { color: #c23c47; background: #fce9eb; }
.page-tab-separator { flex: 0 0 auto; color: #a5afbd; }
.page-tab.is-active:not([data-tab-key="workspace"]) .page-tab-link { color: #6485f7; }
.page-tab.is-active:not([data-tab-key="workspace"])::after { position: absolute; right: clamp(6px, 1vw, 12px); bottom: 0; left: clamp(6px, 1vw, 12px); height: 2px; background: #6689ff; content: ""; }
.operations-shell[data-color-mode="dark"] .page-tab-link { color: #e4eaf2; }
.operations-shell[data-color-mode="dark"] .page-tab-close:hover { color: #ff8d99; background: #47252c; }
.order-table tr[data-state="running"] .order-status-column span { background: #dce8ff; color: #4265bc; animation: search-status-pulse 1.1s ease-in-out infinite alternate; }
@keyframes search-status-pulse { to { box-shadow: 0 0 0 5px rgba(99,135,251,.12); } }
#module-output { margin: 0; padding: 14px; overflow: auto; color: #334155; font: 12px/1.6 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; }
.auth-login-submit { justify-content: center; gap: 12px; }
.auth-login-submit span { flex: 0 0 auto; }
.commerce-hero { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
#commerce-view .panel-actions { display: flex; align-items: center; gap: 10px; }
.commerce-card { position: relative; width: 100%; border: 0; color: inherit; background: var(--paper, #fff); font: inherit; text-align: left; cursor: pointer; }
.brand-lockup { border: 0; color: inherit; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.brand-lockup:disabled { cursor: default; opacity: 1; }
.account-menu { position: relative; }
.account-menu-options { position: absolute; left: calc(100% + 8px); bottom: 0; z-index: 40; display: grid; width: min(12rem, calc(100vw - 24px)); gap: 3px; padding: 5px; border: 1px solid #dbe3ec; border-radius: 10px; background: #fff; box-shadow: 0 14px 30px rgba(43,70,91,.16); }
.account-menu-options button { display: flex; align-items: center; justify-content: space-between; gap: 9px; width: 100%; min-height: 36px; padding: 0 10px; border: 1px solid #dbe3ec; border-radius: 7px; color: #273348; background: #fff; font: inherit; font-size: 12px; font-weight: 800; text-align: center; cursor: pointer; }
.account-menu-options button span { flex: 1; text-align: center; }
.account-menu-options button img { width: 16px; height: 16px; object-fit: contain; }
.account-menu-options button:hover, .account-menu-options button:focus-visible { background: #f4f7fb; outline: 0; }
.account-menu-options [data-account-action="logout"] { border-color: #efb7bd; color: #b4232f; background: #fff8f8; }
.account-menu-options [data-account-action="logout"]:hover, .account-menu-options [data-account-action="logout"]:focus-visible { background: #ffedef; }
body[data-color-mode="dark"] .account-menu-options { border-color: #344657; background: #121b25; box-shadow: 0 14px 30px rgba(0,0,0,.28); }
body[data-color-mode="dark"] .account-menu-options button { border-color: #344657; color: #e8eef5; background: #121b25; }
body[data-color-mode="dark"] .account-menu-options button:hover, body[data-color-mode="dark"] .account-menu-options button:focus-visible { background: #182744; }
body[data-color-mode="dark"] .account-menu-options [data-account-action="logout"] { border-color: #803944; color: #ff9da7; background: #2a161b; }
body[data-color-mode="dark"] .account-menu-options [data-account-action="logout"]:hover, body[data-color-mode="dark"] .account-menu-options [data-account-action="logout"]:focus-visible { background: #3a1b23; }
body[data-color-mode="dark"] .account-menu-options [data-account-action="dashboard"] img { filter: invert(1); }
.language-symbol { display: inline-grid; place-items: center; width: 16px; height: 16px; color: currentColor; font-size: 13px; font-weight: 800; line-height: 1; }
.auth-login-topbar .language-picker { display: inline-flex; align-items: center; gap: 6px; }
.auth-login-topbar-actions { display: flex; align-items: center; gap: 10px; }
.language-picker { position: relative; inline-size: min(100%, 7rem); }
.language-menu-toggle { display: inline-flex; align-items: center; justify-content: space-between; width: 100%; gap: 6px; min-height: 30px; padding: 0 6px; border: 1px solid transparent; border-radius: 8px; color: inherit; background: transparent; font: inherit; font-size: 11px; font-weight: 800; cursor: pointer; }
.language-menu-toggle:hover, .language-menu-toggle[aria-expanded="true"] { border-color: #dbe3ec; background: rgba(255,255,255,.72); }
.language-menu-options { position: absolute; top: calc(100% + 6px); right: 0; z-index: 30; display: grid; width: 100%; min-width: 0; padding: 5px; border: 1px solid #dbe3ec; border-radius: 10px; background: var(--paper, #fff); box-shadow: 0 14px 30px rgba(43,70,91,.14); }
.language-menu-options button { display: grid; grid-template-columns: 1.2rem minmax(0, 1fr); align-items: center; gap: 6px; padding: 9px 7px; border: 0; border-radius: 7px; color: var(--ink, #273348); background: transparent; font: inherit; font-size: 11px; text-align: center; cursor: pointer; }
.language-menu-options button:hover, .language-menu-options button[aria-selected="true"] { background: #eef4ff; }
.language-menu-options button strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.language-menu-options button .language-option-flag { font-size: 14px; line-height: 1; }
.auth-login-topbar .language-picker { display: inline-flex; align-items: center; gap: 6px; }
.compact-language-picker { gap: 0; padding-inline: 0; }
.compact-language-picker .language-menu-toggle { min-height: min(3.1vw, 34px); padding-inline: min(.7vw, 7px); }
.operations-shell .compact-language-picker .language-menu-options { left: auto; right: 0; }
.compact-language-picker .language-symbol { width: min(1.5vw, 16px); height: min(1.5vw, 16px); font-size: min(1.2vw, 13px); }
.session-picker-compact select { min-width: 160px; }
.session-status-note { max-width: 640px; margin: 14px 0; padding: 10px 12px; border-left: 3px solid #d89b35; color: var(--muted, #718096); background: var(--soft, #f8fbff); font-size: 12px; line-height: 1.5; }
.auth-password-control { position: relative; }
.background-task-indicator { position: fixed; right: 0; bottom: 0; z-index: 20; display: grid; gap: 6px; min-width: min(220px, 100vw); max-width: min(280px, 100vw); font-size: 11px; }
.background-task { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: 100%; min-height: 34px; padding: 0 10px; border: 0; border-radius: 6px 6px 0 0; color: #273348; font: inherit; text-align: left; cursor: pointer; }
.background-task:hover { filter: brightness(.97); }
.background-task strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.background-task b { flex: 0 0 auto; color: currentColor; font-variant-numeric: tabular-nums; }
.background-task-blue { color: #fff; background: #4777d4; }
.background-task-orange { color: #fff; background: #d87824; }
.password-eye { position: relative; display: inline-block; width: 17px; height: 11px; border: 1.5px solid currentColor; border-radius: 75% 15%; transform: rotate(45deg); }
.password-eye::after { position: absolute; top: 50%; left: 50%; width: 4px; height: 4px; border-radius: 50%; background: currentColor; content: ""; transform: translate(-50%, -50%); }
.password-eye.is-closed::before { position: absolute; top: 4px; left: -2px; width: 20px; height: 1.5px; background: currentColor; content: ""; transform: rotate(-45deg); }
.commerce-card:focus-visible { outline: 3px solid rgba(98,136,255,.35); outline-offset: 3px; }
.commerce-empty-register { display: grid; justify-items: center; gap: 12px; width: min(100%, 720px); margin: 16px auto 0; padding: 0; border: 0; border-radius: 0; background: transparent; text-align: center; }
.commerce-empty-register > p { max-width: 560px; color: var(--muted, #718096); line-height: 1.6; }
.commerce-empty-icon { display: grid; place-items: center; width: clamp(48px, 6vw, 64px); aspect-ratio: 1; border: 1px solid #dbe3ec; border-radius: 14px; background: transparent; }
.commerce-empty-icon img { width: 52%; height: 52%; filter: invert(42%) sepia(49%) saturate(1300%) hue-rotate(184deg) brightness(87%); }
.commerce-register-trigger { display: grid; justify-items: center; gap: 14px; width: 100%; box-sizing: border-box; padding: clamp(32px, 8vw, 76px) clamp(16px, 4vw, 32px); border: 1px dashed #dbe3ec; border-radius: 12px; color: var(--ink, #273348); background: transparent; font: inherit; text-align: center; font-weight: 800; cursor: pointer; }
.commerce-register-trigger:hover { background: rgba(71,119,212,.03); }
#commerce-view { display: flex; flex: 1; flex-direction: column; }
.commerce-grid:has(.commerce-empty-register) { display: grid; grid-template-columns: minmax(0, 1fr); flex: 1; min-height: 0; align-content: center; align-items: center; }
.commerce-register-copy { display: grid; justify-items: center; gap: 5px; }
.commerce-register-copy strong { font-size: clamp(18px, 3vw, 24px); }
.commerce-register-copy small { color: var(--muted, #718096); font-size: 12px; font-weight: 500; }
.commerce-register-cta { display: inline-flex; align-items: center; gap: 9px; margin-top: 2px; padding: 0 0 2px; border-bottom: 1px solid currentColor; color: #315ab5; background: transparent; font-size: 12px; }
.commerce-register-form { display: grid; width: min(100%, 720px); gap: 18px; margin-top: 12px; padding: clamp(18px, 4vw, 28px); border: 1px solid #e1e4ea; border-radius: 14px; background: var(--paper, #fff); text-align: left; box-shadow: 0 14px 36px rgba(43,70,91,.08); }
.commerce-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 14px; }
.commerce-form-grid label, .commerce-service-options legend { display: grid; gap: 7px; color: var(--ink, #273348); font-size: 12px; font-weight: 800; }
.commerce-form-grid input { box-sizing: border-box; min-height: 40px; padding: 0 11px; border: 1px solid #e1e4ea; border-radius: 8px; color: var(--ink, #273348); background: var(--paper, #fff); font: inherit; }
.commerce-form-grid input:focus { border-color: #4777d4; outline: 0; box-shadow: 0 0 0 3px rgba(71,119,212,.14); }
.commerce-form-grid small, .commerce-service-choice small, .commerce-register-note { color: var(--muted, #718096); font-size: 11px; line-height: 1.5; }
.commerce-service-options { display: grid; gap: 9px; margin: 0; padding: 0; border: 0; }
.commerce-service-options legend { margin-bottom: 2px; }
.commerce-service-choice { display: flex; align-items: flex-start; gap: 10px; padding: 12px; border: 1px solid #e1e4ea; border-radius: 9px; cursor: pointer; }
.commerce-service-choice:has(input:checked) { border-color: #4777d4; background: #f4f7ff; }
.commerce-service-choice input { flex: 0 0 auto; width: 18px; min-width: 18px; height: 18px; min-height: 18px; margin: 3px 0 0; padding: 0; accent-color: #4777d4; }
.commerce-service-choice span { display: grid; gap: 3px; }
.commerce-register-actions { display: flex; justify-content: flex-end; gap: 9px; margin: 0 -28px -28px; padding: 13px 28px; border-top: 1px solid #e1e4ea; background: rgba(255,255,255,.94); }
.commerce-register-actions button { min-height: 38px; padding: 0 15px; border: 0; border-radius: 8px; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.commerce-register-actions .secondary { color: #718096; background: #eef2f7; }
.commerce-register-actions .primary { color: #fff; background: #4777d4; }
.commerce-register-actions button:disabled { cursor: wait; opacity: .55; }
button, select { user-select: none; -webkit-user-select: none; }
button:focus-visible, select:focus-visible { outline: 3px solid rgba(98,136,255,.35); outline-offset: 2px; }
@media (max-width: 760px) {
    .operations-shell .workspace-topbar { grid-template-columns: minmax(0, 5vw) minmax(0, 1fr); padding-inline: min(2vw, 12px); }
    .operations-shell .topbar-menu { width: min(5vw, 34px); min-width: 0; height: min(5vw, 34px); }
    .server-monitor { grid-template-columns: minmax(150px, 30vw) minmax(0, 1fr); }
    #commerce-view .commerce-hero { align-items: flex-start; flex-direction: column; }
    .idworks-session-row { align-items: stretch; flex-direction: column; }
}
@media (min-width: 761px) and (max-width: 920px) {
    .operations-shell .workspace-topbar { grid-template-columns: minmax(0, 1fr) minmax(0, min(24vw, 240px)); gap: min(1.2vw, 8px); padding-inline: min(2vw, 12px); }
    .operations-shell .topbar-actions { grid-column: 2; }
    .operations-shell .topbar-actions .topbar-home-link { display: none; }
}
@media (min-width: 921px) and (max-width: 1120px) {
    .operations-shell .topbar-actions .topbar-home-link { display: none; }
}
@media (max-width: 560px) {
    .operations-shell .workspace-topbar { gap: min(1.2vw, 6px); padding-inline: min(2vw, 8px); }
    .operations-shell .topbar-actions .topbar-user { flex: 0 0 auto; inline-size: auto; max-width: min(8vw, 34px); padding-right: min(.8vw, 3px); }
    .operations-shell .topbar-actions .topbar-user strong { display: none; }
    .server-monitor { grid-template-columns: minmax(0, 1fr); }
    .server-metrics { order: 2; }
    .server-metric-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
body[data-color-mode="dark"] .platform-card-heading h3 { color: #e8eef5; }
body[data-color-mode="dark"] .user-tag { border-color: #3b5f93; color: #bcd3ff; background: #142743; }
body[data-color-mode="dark"] .server-performance-card { border-color: #2b3948; background: #121b25; }
body[data-color-mode="dark"] .server-performance-card strong { color: #e8eef5; }
body[data-color-mode="dark"] .server-performance-card span, body[data-color-mode="dark"] .server-performance-card small { color: #9aaabc; }
body[data-color-mode="dark"] .server-monitor-state { color: #9aaabc; }
body[data-color-mode="dark"] .server-metrics, body[data-color-mode="dark"] .server-focus { --server-grid: #344657; border-color: #2b3948; background: #121b25; }
body[data-color-mode="dark"] .server-metrics header strong, body[data-color-mode="dark"] .server-focus header h2, body[data-color-mode="dark"] .server-focus header > strong, body[data-color-mode="dark"] .server-focus-stats strong { color: #e8eef5; }
body[data-color-mode="dark"] .server-metrics header small, body[data-color-mode="dark"] .server-metric-copy small, body[data-color-mode="dark"] .server-focus header span, body[data-color-mode="dark"] .server-focus > p, body[data-color-mode="dark"] .server-focus-stats small { color: #9aaabc; }
body[data-color-mode="dark"] .server-metric-button { color: #e8eef5; }
body[data-color-mode="dark"] .server-metric-button:hover, body[data-color-mode="dark"] .server-metric-button.is-active, body[data-color-mode="dark"] .server-focus-stats span { border-color: #2b3948; background: #1a2735; }
body[data-color-mode="dark"] .commerce-page-content,
body[data-color-mode="dark"] #platform-content { background: #0b1118; color: #e8eef5; }
body[data-color-mode="dark"] .commerce-hero h1,
body[data-color-mode="dark"] .dashboard-title h1 { color: #e8eef5; }
body[data-color-mode="dark"] .commerce-hero p,
body[data-color-mode="dark"] .dashboard-title p { color: #9aaabc; }
body[data-color-mode="dark"] .dashboard-panel { border-color: #2b3948; background: #121b25; }
body[data-color-mode="dark"] .commerce-card { border-color: #2b3948; background: #121b25; }
body[data-color-mode="dark"] .commerce-register-trigger { border-color: #344657; color: #e8eef5; }
body[data-color-mode="dark"] .commerce-register-trigger:hover { background: #182744; }
body[data-color-mode="dark"] .platform-card { border-color: #2b3948; background: #121b25; }
body[data-color-mode="dark"] .platform-card.theme-blue { border-top-color: #4777d4; }
body[data-color-mode="dark"] .platform-card.theme-orange { border-top-color: #ea580c; }
body[data-color-mode="dark"] .platform-card.theme-green { border-top-color: #16a34a; }
body[data-color-mode="dark"] .platform-card.theme-yellow { border-top-color: #ca8a04; }
body[data-color-mode="dark"] .platform-card .session-picker select { border-color: #344657; color: #e8eef5; background: #0e1721; }
body[data-color-mode="dark"] .session-area { border-color: #2b3948; background: #0e1721; }
body[data-color-mode="dark"] .platform-empty { border-color: #344657; color: #9aaabc; background: #18232f; }
body[data-color-mode="dark"] .platform-empty strong { color: #e8eef5; }
body[data-color-mode="dark"] #module-output { color: #dbeafe; }
html.theme-switching,
html.theme-switching body,
html.theme-switching body *,
html.theme-switching body *::before,
html.theme-switching body *::after {
    transition: background-color 250ms ease, border-color 250ms ease, color 250ms ease, fill 250ms ease, filter 250ms ease, outline-color 250ms ease, stroke 250ms ease, box-shadow 250ms ease !important;
}
@media (prefers-reduced-motion: reduce) {
    html.theme-switching,
    html.theme-switching body,
    html.theme-switching body *,
    html.theme-switching body *::before,
    html.theme-switching body *::after {
        transition-duration: 1ms !important;
    }
}
.desktop-product-toolbar { grid-template-columns: minmax(0, 1fr); }
.product-local-panel { display: grid; gap: 14px; max-width: 760px; padding: 22px; border: 1px solid #e6e8ed; border-radius: 10px; background: #fff; box-shadow: 0 8px 15px rgba(54,91,160,.08); }
.product-local-panel > label { display: grid; gap: 7px; }
.product-local-panel textarea { min-height: 96px; resize: vertical; }
.product-local-panel .primary { justify-self: start; }
.product-local-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 9px; }
.product-local-card { display: grid; gap: 3px; min-width: 0; padding: 12px; border: 1px solid #e6e8ed; border-radius: 8px; background: #f8fbff; }
.product-local-card strong { overflow: hidden; color: #273348; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.product-local-card span, .product-local-card small { color: #718096; font: 11px ui-monospace, monospace; }
.product-local-empty { margin: 0; color: #718096; font-size: 12px; }
.product-review-dialog { box-sizing: border-box; width: min(100% - 32px, 580px); max-height: calc(100dvh - 32px); padding: 0; overflow-x: hidden; overflow-y: auto; border: 1px solid #dce5ec; border-radius: 14px; background: #fff; color: #273348; box-shadow: 0 24px 70px rgba(15,23,42,.28); }
.product-review-dialog::backdrop { background: rgba(15,23,42,.58); }
.product-review-dialog form { display: grid; min-width: 0; gap: 16px; padding: 24px; }
.product-review-dialog h2 { margin: 0; font-size: 20px; }
.product-review-dialog p { margin: 6px 0 0; font-size: 12px; }
.product-review-items { display: grid; gap: 9px; }
.product-review-item { display: grid; grid-template-columns: minmax(100px, .6fr) minmax(0, 1fr); align-items: center; gap: 10px; }
.product-review-item > span { min-width: 0; color: #52697a; font: 11px/1.4 ui-monospace, monospace; overflow-wrap: anywhere; }
.product-review-item input, .product-review-group-label input { min-height: 38px; width: 100%; padding: 0 10px; border: 1px solid #dce5ec; border-radius: 7px; color: #273348; background: #fff; }
.product-relation { display: grid; min-inline-size: 0; gap: 8px; margin: 0; padding: 0; border: 0; }
.product-relation label { display: flex; min-width: 0; align-items: flex-start; gap: 9px; padding: 10px; border: 1px solid #e1e7ef; border-radius: 8px; color: #273348; text-transform: none; cursor: pointer; }
.product-relation label:hover { border-color: #bfcaf2; background: #f8faff; }
.product-relation label:has(input:checked) { border-color: #7f9cf5; background: #eef4ff; box-shadow: 0 0 0 2px rgba(71,119,212,.1); }
.product-relation input[type="radio"] { flex: 0 0 16px; width: 16px; min-width: 16px; min-height: 16px; margin: 3px 0 0; padding: 0; accent-color: #4777d4; }
.product-relation span, .product-relation strong, .product-relation small { display: block; min-width: 0; }
.product-relation strong { font-size: 12px; }
.product-relation small { margin-top: 2px; color: #718096; font-size: 11px; line-height: 1.4; font-weight: 500; }
.product-review-group-label { display: grid; gap: 7px; }
.product-review-group-label span { color: #52697a; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.product-review-dialog footer { display: flex; justify-content: flex-end; gap: 9px; }
.product-review-dialog footer button { min-height: 36px; padding: 0 14px; border: 1px solid #dce5ec; border-radius: 7px; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.product-review-dialog footer .secondary { color: #52697a; background: #fff; }
.product-review-dialog footer .primary { border-color: #4777d4; color: #fff; background: #4777d4; }
.compact-input-dialog { width: min(100% - 32px, 460px); }
.compact-input-dialog h2 { text-align: center; }
.compact-input-dialog form { gap: 14px; }
.compact-input-dialog input { box-sizing: border-box; min-height: 40px; width: 100%; padding: 0 11px; border: 1px solid #dce5ec; border-radius: 7px; color: #273348; background: #fff; font: inherit; }
.compact-input-dialog p { color: #52697a; line-height: 1.45; }
body[data-color-mode="dark"] .product-local-panel, body[data-color-mode="dark"] .product-review-dialog { border-color: #2b3948; background: #121b25; color: #e8eef5; }
body[data-color-mode="dark"] .product-local-card { border-color: #344657; background: #18232f; }
body[data-color-mode="dark"] .product-local-card strong, body[data-color-mode="dark"] .product-relation label { color: #e8eef5; }
body[data-color-mode="dark"] .product-relation label:hover, body[data-color-mode="dark"] .product-relation label:has(input:checked) { border-color: #5876d8; background: #182744; }
body[data-color-mode="dark"] .product-review-item input, body[data-color-mode="dark"] .product-review-group-label input { border-color: #344657; color: #e8eef5; background: #0e1721; }
body[data-color-mode="dark"] .compact-input-dialog input { border-color: #344657; color: #e8eef5; background: #0e1721; }
body[data-color-mode="dark"] .compact-input-dialog p { color: #a8b7c8; }
body[data-color-mode="dark"] .product-review-dialog footer .secondary { border-color: #344657; color: #e8eef5; background: #0e1721; }
@media (max-width: 520px) { .product-review-dialog form { padding: 18px; } .product-review-item { grid-template-columns: 1fr; gap: 5px; } .product-review-dialog footer { flex-direction: column-reverse; } .product-review-dialog footer button { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .order-table tr[data-state="running"] .order-status-column span { animation: none; } }
.chat-launch-panel { display: grid; place-items: center; min-height: clamp(20rem, 62dvh, 42rem); padding: clamp(2rem, 6vw, 5rem); text-align: center; }
.chat-launch-panel h2 { margin: 0 0 .5rem; }
.chat-launch-panel p { color: var(--muted); margin: 0 auto 1rem; max-width: 34rem; }
.chat-launch-panel button { margin-top: .5rem; }
.chat-launch-error { color: #b42318 !important; }
.manualess-chat-frame { display: block; width: 100%; height: min(72dvh, 52rem); min-height: 24rem; border: 0; border-radius: 1rem; }
.commerce-settings-link { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 34px; margin-bottom: 8px; padding: 0 10px; border: 1px solid #dbe3ec; border-radius: 8px; color: #273348; background: transparent; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.commerce-settings-link:hover { background: #f4f7fb; }
.commerce-settings-link img { width: 17px; height: 17px; filter: brightness(0) saturate(100%); opacity: .78; }
.connections-page { --connection-accent: #4777d4; display: grid; gap: clamp(.75rem, 1.35vw, 1rem); width: min(100%, 62rem); margin-inline: auto; padding: clamp(.5rem, 1.25vw, 1rem); }
.connections-page.theme-yellow { --connection-accent: #e1b500; }
.connections-page.theme-orange { --connection-accent: #ee5a32; }
.connections-page.theme-instagram { --connection-accent: #d23883; }
.connections-page.theme-whatsapp { --connection-accent: #22a249; }
.connections-page.theme-telegram { --connection-accent: #249dd8; }
.connections-providers { display: grid; grid-template-columns: auto minmax(0, 11rem) auto; align-items: center; justify-content: center; gap: .7rem; min-height: 4.7rem; }
.connections-provider-viewport { overflow: hidden; }
.connections-provider-track { display: flex; align-items: center; width: max-content; transition: transform 180ms ease; }
.connections-provider { flex: 0 0 3.65rem; display: grid; place-items: center; width: 2.35rem; aspect-ratio: 1; margin: 0 .65rem; padding: .38rem; border: .1rem solid transparent; border-radius: .7rem; background: transparent; cursor: pointer; opacity: .58; transition: transform 180ms ease, border-color 180ms ease, opacity 180ms ease, background-color 180ms ease; }
.connections-provider img { width: 100%; height: 100%; object-fit: contain; }
.connections-provider:hover { opacity: 1; transform: translateY(-.12rem); background: color-mix(in srgb, var(--connection-accent) 7%, transparent); }
.connections-provider.is-active { transform: scale(1.3); padding: .5rem; border-color: var(--connection-accent); border-radius: .9rem; background: color-mix(in srgb, var(--connection-accent) 7%, white); opacity: 1; box-shadow: 0 .35rem 1rem color-mix(in srgb, var(--connection-accent) 14%, transparent); }
.connections-nav { display: grid; place-items: center; width: 2.15rem; height: 2.15rem; padding: .35rem; border: .08rem solid color-mix(in srgb, var(--connection-accent) 45%, #d8dde5); border-radius: .6rem; color: var(--connection-accent); background: #fff; cursor: pointer; transition: color 180ms ease, border-color 180ms ease, opacity 180ms ease; }
.connections-nav img { width: 100%; height: 100%; filter: brightness(0) saturate(100%); opacity: .72; }
.connections-nav:disabled { cursor: default; opacity: .32; }
.connections-panel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); min-height: clamp(20rem, 34dvh, 24rem); border: .12rem solid var(--connection-accent); border-radius: .9rem; background: #fff; overflow: hidden; box-shadow: 0 .75rem 2rem rgba(31, 45, 61, .07); transition: border-color 240ms ease, box-shadow 240ms ease; }
.connections-panel > article { display: grid; align-content: start; gap: clamp(.9rem, 1.5vw, 1.2rem); min-width: 0; padding: clamp(1.2rem, 2vw, 1.65rem); }
.connections-panel > article + article { border-left: .12rem solid #d8dde5; }
.connections-panel h2 { margin: 0; color: #111827; font-size: clamp(1.3rem, 1.9vw, 1.65rem); font-weight: 500; text-align: center; transition: color 240ms ease; }
.connections-api-body { display: grid; grid-template-columns: minmax(8rem, .7fr) minmax(12rem, 1.3fr); gap: clamp(1rem, 2.5vw, 2rem); }
.connections-api-body aside { min-width: 0; }
.connections-api-body aside + * { padding-left: clamp(1rem, 2.5vw, 2rem); border-left: .1rem solid #d8dde5; }
.connections-api-body h3 { margin: 0 0 .75rem; color: #6c7888; font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; }
.connections-list { display: grid; gap: .45rem; margin: 0; padding: 0; list-style: none; }
.connections-list li { display: flex; align-items: center; justify-content: space-between; gap: .5rem; min-width: 0; min-height: 2.75rem; padding: .4rem .5rem .4rem .85rem; border: .08rem solid #d8dde5; border-radius: .6rem; background: #f9fafc; transition: border-color 120ms ease, background-color 120ms ease; }
.connections-list li:hover { border-color: color-mix(in srgb, var(--connection-accent) 45%, #d8dde5); background: color-mix(in srgb, var(--connection-accent) 4%, white); }
.connections-list li > span:first-child { overflow: hidden; color: #344256; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.connections-actions { display: flex; gap: .15rem; opacity: 0; transition: opacity 120ms ease; }
.connections-list li:hover .connections-actions, .connections-list li:focus-within .connections-actions { opacity: 1; }
.connections-actions button { display: grid; place-items: center; width: 1.75rem; aspect-ratio: 1; padding: .32rem; border: 0; border-radius: .35rem; color: #566579; background: transparent; cursor: pointer; }
.connections-actions button:hover { background: #edf1f6; }
.connections-actions button.is-danger { color: #c92a36; }
.connections-actions svg { width: 100%; height: 100%; fill: currentColor; }
.connections-empty, .connections-help { margin: 0; color: #6c7888; font-size: .75rem; line-height: 1.5; }
.connections-form { display: grid; align-content: start; gap: 1rem; }
.connections-form label { display: grid; gap: .4rem; color: #253247; font-size: .78rem; font-weight: 650; }
.connections-form input { box-sizing: border-box; width: 100%; min-height: 2.8rem; padding-inline: .85rem; border: .08rem solid #cfd6df; border-radius: .6rem; color: #172033; background: #fff; font: inherit; outline: 0; transition: border-color 120ms ease, box-shadow 120ms ease; }
.connections-form input:focus { border-color: var(--connection-accent); box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--connection-accent) 15%, transparent); }
.connections-form footer { display: flex; justify-content: flex-end; gap: .5rem; }
.connections-form footer button { min-height: 2.5rem; padding: 0 1rem; border: .08rem solid transparent; border-radius: .6rem; font: inherit; font-size: .8rem; font-weight: 750; cursor: pointer; transition: transform 120ms ease, filter 120ms ease, background-color 240ms ease, border-color 240ms ease, color 240ms ease; }
.connections-form footer button:hover { transform: translateY(-.08rem); filter: brightness(.97); }
.connections-form footer .primary { color: #fff; background: var(--connection-accent); }
.connections-form footer .secondary { border-color: #d8dde5; color: #526174; background: #fff; }
.connections-web { justify-items: center; text-align: center; }
.connections-web .connections-list { width: min(100%, 18rem); }
.connections-web-add { display: grid; place-items: center; gap: .55rem; width: clamp(8rem, 11vw, 9.5rem); aspect-ratio: 1.3; margin: clamp(.25rem, 1.2vw, .8rem) auto; border: .1rem dashed #b9c2ce; border-radius: .85rem; color: #1e293b; background: #fafbfd; font: inherit; cursor: pointer; transition: transform 120ms ease, border-color 240ms ease, background-color 240ms ease, color 240ms ease; }
.connections-web-add:hover { border-color: var(--connection-accent); background: color-mix(in srgb, var(--connection-accent) 6%, white); transform: translateY(-.12rem); }
.connections-web-add span { font-size: 1.4rem; font-weight: 400; }
.connections-web-add strong { font-size: .76rem; font-weight: 600; }
body[data-color-mode="dark"] .commerce-settings-link { border-color: #344657; color: #e8eef5; }
body[data-color-mode="dark"] .commerce-settings-link:hover { background: #182744; }
body[data-color-mode="dark"] .commerce-settings-link img { filter: brightness(0) invert(1); }
body[data-color-mode="dark"] .connections-panel { background: #121b25; }
body[data-color-mode="dark"] .connections-panel > article + article, body[data-color-mode="dark"] .connections-api-body aside + *, body[data-color-mode="dark"] .connections-list li { border-color: #334254; }
body[data-color-mode="dark"] .connections-panel h2, body[data-color-mode="dark"] .connections-form label, body[data-color-mode="dark"] .connections-list li > span:first-child { color: #e8eef5; }
body[data-color-mode="dark"] .connections-form input { border-color: #3a4a5d; color: #e8eef5; background: #0e1721; }
body[data-color-mode="dark"] .connections-actions button:hover { background: #233244; }
body[data-color-mode="dark"] .connections-web-add { border-color: #46566a; color: #e8eef5; }
body[data-color-mode="dark"] .connections-web-add:hover { background: color-mix(in srgb, var(--connection-accent) 9%, #121b25); }
body[data-color-mode="dark"] .connections-provider.is-active { background: color-mix(in srgb, var(--connection-accent) 10%, #121b25); }
body[data-color-mode="dark"] .connections-list li { background: #0e1721; }
body[data-color-mode="dark"] .connections-nav { border-color: color-mix(in srgb, var(--connection-accent) 45%, #344657); background: #121b25; }
body[data-color-mode="dark"] .connections-nav img { filter: brightness(0) invert(1); }
.operations-shell.sidebar-collapsed .side-panel .side-footer { flex-direction: column; width: 40px; }
.operations-shell.sidebar-collapsed .side-panel .commerce-settings-link { flex: 0 0 40px; width: 40px; min-height: 36px; margin: 0; padding: 0; }
.operations-shell.sidebar-collapsed .side-panel .commerce-settings-link span { display: none; }
.operations-shell.sidebar-collapsed .side-panel .commerce-settings-link img { display: block; flex: 0 0 19px; width: 19px; height: 19px; }
@media (max-width: 900px) { .connections-panel { grid-template-columns: 1fr; } .connections-panel > article + article { border-top: .12rem solid #d8dde5; border-left: 0; } }
@media (max-width: 620px) { .connections-providers { grid-template-columns: auto minmax(0, 9.2rem) auto; } .connections-api-body { grid-template-columns: 1fr; } .connections-api-body aside + * { padding-top: 1rem; padding-left: 0; border-top: .1rem solid #d8dde5; border-left: 0; } }

.profile-preview { min-height: 100dvh; scrollbar-color: #c7d0dc #f3f4f6; }
.profile-preview .workspace-topbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; padding-inline: clamp(.75rem, 2vw, 1.5rem); }
.profile-preview-topbar-title { grid-column: 1; color: #263746; font-size: .82rem; font-weight: 700; }
.profile-preview .topbar-actions { grid-column: 2; display: flex; align-items: center; gap: clamp(.45rem, 1vw, .8rem); }
.profile-preview-user { display: flex; align-items: center; gap: .5rem; min-width: 0; color: #263746; font-size: .75rem; }
.profile-preview-user .user-avatar { width: 1.8rem; height: 1.8rem; padding: 0; }
.profile-preview .idw-page { flex: 1; }
.profile-preview .dashboard-title { align-items: center; }
.profile-preview-crumb-separator { padding-inline: .45rem; color: #9aa4b5; }
.profile-preview-badge { padding: .35rem .65rem; border: 1px solid #d7e2f0; border-radius: 999px; color: #52709a; background: #f4f8fc; font-size: .62rem; font-weight: 800; letter-spacing: .08em; }
.profile-preview .dashboard-panel { width: min(100%, 72rem); min-height: 0; margin-inline: auto; padding: clamp(.9rem, 2vw, 1.5rem); border: 1px solid #e0e5ec; border-radius: .8rem; }
.profile-preview-notice { margin: 0 0 1rem; padding: .7rem .9rem; border: 1px solid #d8e4f5; border-radius: .55rem; color: #526b8b; background: #f5f9ff; font-size: .72rem; }
.profile-preview-hero { display: flex; align-items: center; gap: clamp(.8rem, 1.5vw, 1.2rem); padding: clamp(.9rem, 2vw, 1.4rem); border: 1px solid #e5eaf1; border-radius: .7rem; background: linear-gradient(110deg, #f4f8ff, #fff 74%); }
.profile-preview-avatar { display: grid; flex: 0 0 auto; width: clamp(3.4rem, 5vw, 4.4rem); aspect-ratio: 1; place-items: center; border: .2rem solid #fff; border-radius: 50%; color: #fff; background: linear-gradient(145deg, #507bd6, #7ba3f4); box-shadow: 0 .25rem .8rem #355d9c2b; font-size: clamp(1rem, 1.7vw, 1.35rem); font-weight: 800; }
.profile-preview-identity { display: grid; flex: 1 1 auto; min-width: 0; gap: .2rem; }
.profile-preview-identity strong { overflow: hidden; color: #1e293b; font-size: clamp(.95rem, 1.4vw, 1.12rem); text-overflow: ellipsis; white-space: nowrap; }
.profile-preview-identity span, .profile-preview-identity small { overflow: hidden; color: #748196; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.profile-preview-identity small { color: #526b8b; }
.profile-preview-secondary, .profile-preview-primary { flex: 0 0 auto; min-height: 2.25rem; padding: 0 .85rem; border: 1px solid #d7e0eb; border-radius: .5rem; color: #33445b; background: #fff; font: inherit; font-size: .7rem; font-weight: 700; cursor: pointer; transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease; }
.profile-preview-secondary:hover { border-color: #9bb6e5; background: #f7faff; }
.profile-preview-primary { border-color: #3569c8; color: #fff; background: #3569c8; }
.profile-preview-primary:hover { background: #2857ad; }
.profile-preview-tabs { display: flex; gap: clamp(.25rem, .8vw, .7rem); margin-top: 1.1rem; overflow-x: auto; border-bottom: 1px solid #e3e8ef; scrollbar-width: thin; }
.profile-preview-tabs button { flex: 0 0 auto; min-height: 2.65rem; padding: 0 clamp(.6rem, 1.25vw, 1rem); border: 0; border-bottom: .14rem solid transparent; color: #758196; background: transparent; font: inherit; font-size: .72rem; cursor: pointer; }
.profile-preview-tabs button[aria-selected="true"] { border-bottom-color: #527be0; color: #315fbf; font-weight: 750; }
.profile-preview-tabs button:focus-visible, .profile-preview button:focus-visible, .profile-preview input:focus-visible, .profile-preview textarea:focus-visible, .profile-preview select:focus-visible { outline: .15rem solid #7398ef; outline-offset: .12rem; }
.profile-preview-content { padding: clamp(1rem, 2.4vw, 1.8rem) clamp(.15rem, .6vw, .5rem) .25rem; }
.profile-preview-content section[hidden] { display: none; }
.profile-preview-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.2rem; }
.profile-preview-section-heading h2 { margin: 0; color: #263449; font-size: clamp(.95rem, 1.4vw, 1.15rem); font-weight: 700; }
.profile-preview-section-heading p { margin: .3rem 0 0; color: #758196; font-size: .7rem; }
.profile-preview-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem 1rem; }
.profile-preview-fields label { display: grid; min-width: 0; gap: .35rem; color: #4b5a70; font-size: .68rem; font-weight: 700; }
.profile-preview-fields .profile-preview-wide { grid-column: 1 / -1; }
.profile-preview-fields input, .profile-preview-fields textarea, .profile-preview-fields select, .profile-preview-privacy select { box-sizing: border-box; width: 100%; min-height: 2.55rem; padding: .55rem .7rem; border: 1px solid #d7dfe9; border-radius: .45rem; color: #263449; background: #fff; font: inherit; font-size: .72rem; }
.profile-preview-fields textarea { min-height: 5rem; resize: vertical; }
.profile-preview-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: .75rem; margin-top: 1rem; }
.profile-preview-status { margin: .7rem 0 0; color: #718096; font-size: .68rem; }
.profile-preview-status:empty { display: none; }
.profile-preview-info-row, .profile-preview-choice, .profile-preview-privacy { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 4rem; padding: .75rem 0; border-bottom: 1px solid #e7ebf1; }
.profile-preview-info-row > div, .profile-preview-choice > span, .profile-preview-privacy > span { display: grid; gap: .25rem; }
.profile-preview-info-row strong, .profile-preview-choice strong, .profile-preview-privacy strong { color: #334155; font-size: .74rem; }
.profile-preview-info-row span, .profile-preview-choice small, .profile-preview-privacy small { color: #748196; font-size: .68rem; }
.profile-preview-state { padding: .28rem .55rem; border-radius: 999px; color: #66758b; background: #eef1f5; }
.profile-preview-choice input { width: 1.05rem; height: 1.05rem; accent-color: #4777d4; }
.profile-preview-privacy select { width: min(45%, 14rem); }
.profile-preview-nav-mark { display: grid; width: 1.25rem; height: 1.25rem; flex: 0 0 auto; place-items: center; border-radius: .3rem; color: #fff; background: #5479ce; font-size: .65rem; font-weight: 800; }
.profile-preview .module-nav img { filter: brightness(0) saturate(100%); }
.profile-preview-rail-toggle { display: grid; flex: 0 0 2rem; height: 2rem; place-items: center; align-self: flex-end; color: #7b8797; font-size: 1rem; }
.profile-preview .side-footer { color: #8792a3; font-size: .65rem; }
body[data-color-mode="dark"] .profile-preview-topbar-title, body[data-color-mode="dark"] .profile-preview-user, body[data-color-mode="dark"] .profile-preview-identity strong, body[data-color-mode="dark"] .profile-preview-section-heading h2, body[data-color-mode="dark"] .profile-preview-fields label, body[data-color-mode="dark"] .profile-preview-info-row strong, body[data-color-mode="dark"] .profile-preview-choice strong, body[data-color-mode="dark"] .profile-preview-privacy strong { color: #e8eef5; }
body[data-color-mode="dark"] .profile-preview-badge, body[data-color-mode="dark"] .profile-preview-notice { border-color: #2e4561; color: #b8c9df; background: #152337; }
body[data-color-mode="dark"] .profile-preview-hero { border-color: #2b3948; background: linear-gradient(110deg, #17263a, #121b25 74%); }
body[data-color-mode="dark"] .profile-preview-identity span, body[data-color-mode="dark"] .profile-preview-identity small, body[data-color-mode="dark"] .profile-preview-section-heading p, body[data-color-mode="dark"] .profile-preview-fields label > span, body[data-color-mode="dark"] .profile-preview-info-row span, body[data-color-mode="dark"] .profile-preview-choice small, body[data-color-mode="dark"] .profile-preview-privacy small { color: #a5b4c6; }
body[data-color-mode="dark"] .profile-preview-secondary, body[data-color-mode="dark"] .profile-preview-fields input, body[data-color-mode="dark"] .profile-preview-fields textarea, body[data-color-mode="dark"] .profile-preview-fields select, body[data-color-mode="dark"] .profile-preview-privacy select { border-color: #3a4a5d; color: #e8eef5; background: #0e1721; }
body[data-color-mode="dark"] .profile-preview-tabs, body[data-color-mode="dark"] .profile-preview-info-row, body[data-color-mode="dark"] .profile-preview-choice, body[data-color-mode="dark"] .profile-preview-privacy { border-color: #2b3948; }
body[data-color-mode="dark"] .profile-preview-tabs button { color: #a5b4c6; }
body[data-color-mode="dark"] .profile-preview-tabs button[aria-selected="true"] { color: #a9c4ff; }
body[data-color-mode="dark"] .profile-preview-secondary:hover { background: #182744; }
body[data-color-mode="dark"] .profile-preview-state { color: #c2cedc; background: #263444; }
@media (max-width: 760px) {
    .profile-preview .app-frame { grid-template-columns: minmax(0, 1fr); }
    .profile-preview .side-panel { position: static; display: flex; height: auto; flex-direction: row; align-items: center; padding: .45rem .75rem; border-right: 0; border-bottom: 1px solid #dfe2e8; }
    .profile-preview .brand-lockup { flex: 0 0 auto; }
    .profile-preview.sidebar-collapsed .brand-lockup > span { display: grid; }
    .profile-preview-rail-toggle, .profile-preview .side-footer { display: none; }
    .profile-preview .module-nav { display: flex; flex: 1; flex-direction: row; align-items: center; justify-content: flex-end; gap: .2rem; overflow: visible; }
    .profile-preview .module-nav .nav-link { display: flex; flex: 0 0 auto; width: auto; min-height: 2.1rem; padding-inline: .45rem; }
    .profile-preview .module-nav .nav-link > span:last-child { display: inline; font-size: .68rem; }
    .profile-preview .module-nav .nav-link img, .profile-preview .module-nav .nav-link .profile-preview-nav-mark { display: none; }
    .profile-preview .workspace-topbar { min-height: 3rem; }
}
@media (max-width: 520px) {
    .profile-preview .dashboard-title { align-items: flex-start; }
    .profile-preview .dashboard-panel { padding: .75rem; }
    .profile-preview-hero { flex-wrap: wrap; }
    .profile-preview-hero .profile-preview-secondary { margin-left: auto; }
    .profile-preview-fields { grid-template-columns: 1fr; }
    .profile-preview-fields .profile-preview-wide { grid-column: auto; }
    .profile-preview-form-actions { align-items: flex-start; flex-direction: column; }
    .profile-preview-form-actions .profile-preview-primary { align-self: flex-end; }
    .profile-preview-privacy { align-items: flex-start; flex-direction: column; }
    .profile-preview-privacy select { width: 100%; }
    .profile-preview-user strong { display: none; }
}