/* MCP keeps its native state, permission and connection owners. */
body.account-visual #mcpDashboard {
    --mcp-radius: 16px;
    gap: 20px;
    color: var(--text-primary);
}
body.account-visual #mcpDashboard :is(.mcp-hero-card,.mcp-card,.mcp-help-drawer,.mcp-settings-drawer) {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    box-shadow: none;
    backdrop-filter: none;
}
body.account-visual #mcpDashboard .mcp-hero-card::before { display: none; }
body.account-visual #mcpDashboard .mcp-hero-card-compact {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: start;
    gap: 24px;
    min-height: 0;
    padding: 24px;
}
body.account-visual #mcpDashboard .mcp-hero-card-compact .mcp-hero-copy { max-width: 650px; min-width: 0; padding: 0; }
body.account-visual #mcpDashboard .mcp-hero-status-controls { position: static; gap: 20px; }
body.account-visual #mcpDashboard .mcp-hero-copy h3 { font-size: 24px; line-height: 1.3; font-weight: 600; letter-spacing: -.5px; }
body.account-visual #mcpDashboard :is(.mcp-eyebrow,.mcp-card-label) { font-size: 12px; font-weight: 500; letter-spacing: .04em; color: var(--text-secondary); }
body.account-visual #mcpDashboard :is(.mcp-hero-copy p,.mcp-steps,.mcp-card p:not(.code-block-content)) { font-size: 14px; line-height: 1.6; }
body.account-visual #mcpDashboard .mcp-card { padding: 24px; gap: 20px; }
body.account-visual #mcpDashboard :is(.mcp-card h4,.mcp-platform-topline span:first-child) { font-size: 16px; font-weight: 600; letter-spacing: 0; }
body.account-visual #mcpDashboard .mcp-platform-tabs { border-color: var(--border-color); background: var(--input-bg); }
body.account-visual #mcpDashboard .mcp-platform-tab-slide { background: var(--text-primary); box-shadow: none; }
body.account-visual #mcpDashboard .mcp-platform-tab { color: var(--text-secondary); font-family: inherit; font-size: 14px; font-weight: 500; line-height: 20px; min-height: 44px; padding: 8px 14px; }
body.account-visual #mcpDashboard .mcp-platform-tab:hover { color: var(--text-primary); }
body.account-visual #mcpDashboard .mcp-platform-tab.is-active { color: var(--card-bg); }
body.account-visual #mcpDashboard .mcp-platform-card { padding: 20px; border: 1px solid var(--border-color); border-radius: 12px; background: transparent; }
body.account-visual #mcpDashboard :is(.code-block,.mcp-endpoint-strip) { background: var(--input-bg); border-color: var(--border-color); border-radius: 12px; }
body.account-visual #mcpDashboard :is(.mcp-help-drawer,.mcp-settings-drawer) > summary { padding: 18px 20px; font-size: 14px; font-weight: 500; }
body.account-visual #mcpDashboard :is(.mcp-help-drawer,.mcp-settings-drawer) > summary small { font-weight: 400; }
body.account-visual #mcpDashboard .mcp-drawer-content { padding: 20px; }
body.account-visual #mcpDashboard :is(.mcp-check-row strong,.mcp-field > span,.mcp-usage-example-card summary > span) { font-weight: 500; }
body.account-visual #mcpDashboard :is(button,input,select,summary,a):focus-visible { outline: 2px solid var(--text-primary); outline-offset: 3px; }
body.account-visual #mcpDashboard .mcp-field input[data-mcp-limit] { border-radius: 12px; min-height: 40px; }
body.account-visual #mcpDashboard [data-mcp-feature-status] {
    display: inline-flex;
    max-width: 100%;
    box-sizing: border-box;
    white-space: normal;
    overflow-wrap: break-word;
}
@media (max-width: 1000px) {
    body.account-visual #mcpDashboard .mcp-hero-card-compact { grid-template-columns: minmax(0,1fr); }
    body.account-visual #mcpDashboard .mcp-hero-status-controls { align-items: flex-start; }
}
@media (max-width: 600px) {
    body.account-visual #mcpDashboard :is(.mcp-card,.mcp-hero-card-compact,.mcp-drawer-content) { padding: 18px; }
    body.account-visual #mcpDashboard .mcp-hero-copy h3 { font-size: 22px; }
    body.account-visual #mcpDashboard .mcp-platform-card { padding: 14px; }
}

/* Center the shared page heading independently of the narrower Connections card. */
html body.account-visual .page-header {display:block;text-align:center}
html body.account-visual .page-header > div,html body.account-visual .page-header :is(h1,p) {width:100%;text-align:center;margin-inline:auto}
body.account-visual #mcpDashboard .mcp-platform-select {display:none;min-width:0;width:100%}
body.account-visual #mcpDashboard .mcp-hero-action-row {gap:10px;flex-wrap:wrap}
body.account-visual #mcpDashboard .mcp-hero-action-row .action-btn {min-height:44px;padding:12px 16px;line-height:20px;font-size:14px;flex-shrink:0}
body.account-visual #mcpDashboard .mcp-usage-intro-copy {align-items:flex-start}
body.account-visual #mcpDashboard .mcp-usage-intro-copy > svg {flex-shrink:0;margin-top:3px}
body.account-visual #mcpDashboard .mcp-steps {min-width:0;padding-left:20px}
body.account-visual #mcpDashboard .mcp-steps .code-block {margin-top:12px}
body.account-visual #mcpDashboard .mcp-usage-example-card summary > span {min-width:0}
body.account-visual #mcpDashboard :is(.mcp-help-drawer,.mcp-settings-drawer,.mcp-usage-example-card) > summary > svg {flex-shrink:0}
@media(max-width:764px) {
    body.account-visual #mcpDashboard .mcp-platform-tabs {display:none}
    body.account-visual #mcpDashboard .mcp-platform-select {display:block}
    body.account-visual #mcpDashboard .mcp-platform-select .modern-select-trigger {width:100%;min-height:44px;font-size:14px;font-weight:500}
    body.account-visual #mcpDashboard .mcp-platform-select .modern-select-option {min-height:44px}
}

body.account-visual #mcpDashboard :is(.mcp-sessions-toolbar .action-btn,.mcp-session-revoke-btn,.mcp-usage-intro-actions .action-btn) {min-height:44px}
body.account-visual #mcpDashboard .mcp-usage-intro-actions .icon-btn {width:44px;height:44px;flex:0 0 44px}
body.account-visual #mcpDashboard .mcp-field input[data-mcp-limit] {min-height:44px}
@media(max-width:600px) {
    body.account-visual #mcpDashboard .mcp-drawer-content {padding:14px}
    body.account-visual #mcpDashboard .mcp-usage-example-card .mcp-drawer-content {padding:12px}
    body.account-visual #mcpDashboard .mcp-usage-example-card summary {padding:14px}
    body.account-visual #mcpDashboard .code-block {padding:12px}
}
/* At phone and tablet widths all three feature values remain readable together. */
@media(max-width:860px) {
    body.account-visual #mcpDashboard .mcp-table-scroll-hint {display:none}
    body.account-visual #mcpDashboard .mcp-table-wrap {overflow:visible}
    body.account-visual #mcpDashboard .mcp-table {display:block;min-width:0;width:100%}
    body.account-visual #mcpDashboard .mcp-table thead {display:none}
    body.account-visual #mcpDashboard .mcp-table tbody {display:block}
    body.account-visual #mcpDashboard .mcp-table tr {display:grid;grid-template-columns:minmax(0,1fr);gap:8px;padding:18px 0;border-bottom:1px solid var(--border-color)}
    body.account-visual #mcpDashboard .mcp-table tr:first-child {padding-top:0}
    body.account-visual #mcpDashboard .mcp-table tr:last-child {border-bottom:0;padding-bottom:0}
    body.account-visual #mcpDashboard .mcp-table td {display:block;width:auto;padding:0;border:0;white-space:normal;overflow-wrap:anywhere}
    body.account-visual #mcpDashboard .mcp-table td:first-child {font-size:14px;font-weight:600;line-height:1.45}
    body.account-visual #mcpDashboard .mcp-table td:nth-child(2) {grid-row:3;font-size:13px;line-height:1.55}
    body.account-visual #mcpDashboard .mcp-table td:nth-child(3) {grid-row:2}
}
