.strategy-control-page { display: grid; gap: 10px; }
.strategy-control-toolbar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.strategy-control-toolbar .muted { margin: 0 auto 0 0; }
.strategy-control-result { min-height: 0; font-size: 13px; }
.strategy-control-result:empty { display: none; }
.strategy-bulk-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.strategy-bulk-actions button { min-height: 34px; padding: 6px 11px; }
.strategy-select-cell { width: 38px; padding-right: 6px; }
.strategy-select-cell input, #strategy-select-all { width: 16px; height: 16px; accent-color: var(--cyan); cursor: pointer; }
.access-management-pages { display: flex; gap: 8px; flex-wrap: wrap; border-bottom: 1px solid var(--line); }
.access-management-pages button { padding: 8px 12px; color: var(--muted); border: 0; border-bottom: 2px solid transparent; background: transparent; }
.access-management-pages button.active { color: var(--cyan); border-bottom-color: var(--cyan); background: rgba(49, 216, 205, .08); }
#access-management-content { display: grid; gap: 10px; }
#access-management-content > .strategy-control-page,
#access-management-content > .contracts-page { margin: 0; }
.access-overview-pane { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.access-overview-card { position: relative; display: grid; overflow: hidden; gap: 6px; min-height: 88px; padding: 14px; border: 1px solid var(--line); background: linear-gradient(135deg, rgba(8, 21, 35, .7), rgba(10, 28, 43, .48)); text-align: left; transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease; }
.access-overview-card::after { position: absolute; right: -34px; bottom: -48px; width: 122px; height: 122px; border-radius: 50%; content: ''; pointer-events: none; background: rgba(49, 216, 205, .14); filter: blur(20px); opacity: 0; transition: opacity .16s ease; }
.access-overview-card strong { color: var(--cyan); font-size: 13px; }
.access-overview-card b { color: var(--text); font-size: 20px; line-height: 1.1; }
.access-overview-card span { color: var(--muted); font-size: 12px; line-height: 1.5; }
.access-overview-card.healthy { border-color: rgba(49, 216, 205, .42); }
.access-overview-card.attention { border-color: rgba(242, 193, 109, .62); }
.access-overview-card.attention b { color: #f2c16d; }
.access-overview-card:hover { transform: translateY(-2px); border-color: rgba(49, 216, 205, .76); background: linear-gradient(135deg, rgba(11, 39, 53, .96), rgba(9, 31, 45, .82)); box-shadow: 0 10px 24px rgba(0, 6, 13, .32), inset 0 1px 0 rgba(124, 255, 246, .1); }
.access-overview-card:hover::after { opacity: 1; }
.access-overview-card:hover strong { color: #76f3ec; }
.access-overview-card:hover span { color: #acc4d8; }
.access-overview-card.attention:hover { border-color: rgba(242, 193, 109, .9); background: linear-gradient(135deg, rgba(47, 37, 23, .92), rgba(36, 30, 23, .78)); box-shadow: 0 10px 24px rgba(0, 6, 13, .32), inset 0 1px 0 rgba(255, 223, 162, .1); }
.access-overview-card.attention:hover::after { background: rgba(242, 193, 109, .14); }
.access-overview-card.attention:hover strong { color: #ffda92; }
.access-overview-card:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .access-overview-card, .access-overview-card::after { transition: none; } .access-overview-card:hover { transform: none; } }
.strategy-control-table td { vertical-align: middle; }
.platform-account-actions { display: flex; align-items: center; gap: 10px; flex-wrap: nowrap; white-space: nowrap; }
.platform-account-actions .secondary-button { min-width: 0; padding: 6px 9px; font-size: 12px; }
.platform-account-toggle, .platform-account-delete { display: inline-flex; position: relative; z-index: 0; }
.platform-account-delete { z-index: 1; }
.strategy-command-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.strategy-command-button { padding: 6px 8px; font-size: 12px; }
.strategy-instance-state { display: inline-flex; align-items: center; gap: 7px; min-width: 136px; margin-top: 8px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 3px; background: rgba(45, 77, 104, .12); }
.strategy-instance-state > span:last-child { display: grid; gap: 2px; }
.strategy-instance-state strong { font-size: 13px; line-height: 1.1; }
.strategy-instance-state small { color: var(--muted); font-size: 10px; line-height: 1.2; }
.strategy-state-dot { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: var(--muted); }
.strategy-instance-state.online { border-color: rgba(49, 216, 205, .78); background: rgba(49, 216, 205, .12); color: var(--cyan); }
.strategy-instance-state.online .strategy-state-dot { background: var(--cyan); box-shadow: 0 0 9px rgba(49, 216, 205, .9); }
.strategy-instance-state.starting { border-color: rgba(242, 193, 109, .78); background: rgba(242, 193, 109, .12); color: #f2c16d; }
.strategy-instance-state.starting .strategy-state-dot { background: #f2c16d; box-shadow: 0 0 9px rgba(242, 193, 109, .75); animation: strategy-state-pulse 1.2s ease-in-out infinite; }
.strategy-instance-state.stopped { border-color: rgba(128, 151, 174, .55); background: rgba(45, 77, 104, .2); color: #9db2c5; }
.strategy-instance-state.errored { border-color: rgba(255, 116, 140, .8); background: rgba(255, 116, 140, .12); color: #ff8ba7; }
.strategy-instance-state.errored .strategy-state-dot { background: #ff718e; box-shadow: 0 0 9px rgba(255, 113, 142, .75); }
.strategy-instance-state.unknown { border-color: rgba(155, 142, 239, .72); background: rgba(155, 142, 239, .11); color: #b6a9ff; }
.strategy-instance-state.unknown .strategy-state-dot { background: #b6a9ff; animation: strategy-state-pulse 1.2s ease-in-out infinite; }
.strategy-credential-status { display: inline-block; margin-top: 7px; }
@keyframes strategy-state-pulse { 50% { opacity: .38; transform: scale(.72); } }
.strategy-server-form { display: flex; align-items: end; gap: 12px; flex-wrap: wrap; padding: 14px; border: 1px solid var(--line); background: rgba(8, 21, 35, .58); }
.strategy-server-form label { display: grid; gap: 6px; min-width: 190px; color: var(--muted); font-size: 12px; font-weight: 700; }
.strategy-server-form input { min-height: 36px; }
.strategy-server-form select { min-height: 36px; }
.strategy-setup-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 12px; margin: 14px 0; }
.strategy-setup-form { position: relative; z-index: 1; display: grid; grid-column: span 4; align-content: start; gap: 12px; min-width: 0; }
.strategy-setup-form > strong { color: var(--text); font-size: 14px; }
.strategy-setup-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; }
.strategy-setup-fields label { min-width: 0; }
.strategy-setup-fields label:last-child { grid-column: 1 / -1; }
.strategy-setup-fields select { position: relative; z-index: 1; pointer-events: auto; }
.strategy-setup-actions { display: flex; justify-content: flex-end; padding-top: 2px; border-top: 1px solid rgba(45, 77, 104, .42); }
.strategy-setup-actions button { min-width: 118px; }
.strategy-setup-grid[data-access-tab="accounts"] .account-discovery-form { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
.strategy-setup-grid[data-access-tab="accounts"] .account-discovery-form > strong { grid-column: 1 / -1; }
.strategy-setup-grid[data-access-tab="accounts"] .account-discovery-form .strategy-setup-fields { grid-template-columns: minmax(220px, .4fr) minmax(180px, .28fr) minmax(0, 1fr); align-items: end; }
.strategy-setup-grid[data-access-tab="accounts"] .account-discovery-form .strategy-setup-fields p { margin: 0 0 7px; font-size: 12px; line-height: 1.5; }
.strategy-setup-grid[data-access-tab="accounts"] .account-discovery-form .strategy-setup-actions { padding: 0 0 1px 12px; border-top: 0; border-left: 1px solid rgba(45, 77, 104, .42); }
.account-import-card { overflow: hidden; padding: 0; border-color: rgba(49, 216, 205, .32); background: linear-gradient(120deg, rgba(12, 36, 52, .94), rgba(8, 21, 35, .72)); box-shadow: inset 3px 0 0 rgba(49, 216, 205, .88); }
.account-import-heading { display: flex; grid-column: 1 / -1; align-items: center; justify-content: space-between; gap: 24px; padding: 14px 16px 12px; border-bottom: 1px solid rgba(45, 77, 104, .52); }
.account-import-heading > div { display: grid; gap: 2px; }
.account-import-heading span, .platform-account-list-heading span { color: var(--cyan); font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.account-import-heading strong { color: var(--text); font-size: 17px; }
.account-import-heading p { max-width: 580px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; text-align: right; }
.strategy-setup-grid[data-access-tab="accounts"] .account-import-card .strategy-setup-fields { padding: 0 0 14px 16px; }
.strategy-setup-grid[data-access-tab="accounts"] .account-import-card .strategy-setup-actions { margin: 0 16px 14px 0; }
.account-import-note { padding-left: 14px; border-left: 1px solid rgba(49, 216, 205, .28); }
.platform-account-list { display: grid; gap: 10px; margin-top: 6px; }
.platform-account-list-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; padding: 0 2px; }
.platform-account-list-heading h3 { margin: 3px 0 0; color: var(--text); font-size: 17px; }
.platform-account-list-heading b { padding: 5px 9px; border: 1px solid rgba(49, 216, 205, .32); background: rgba(49, 216, 205, .08); color: var(--cyan); font-size: 11px; }
.platform-account-table { margin: 0; }
.platform-account-table td { vertical-align: middle; }
.platform-account-disabled { opacity: .58; }
.platform-account-identity { display: grid; justify-items: start; gap: 5px; min-width: 170px; }
.platform-account-badge { padding: 2px 6px; border: 1px solid rgba(49, 216, 205, .4); background: rgba(49, 216, 205, .08); color: var(--cyan); font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.platform-account-identity strong { color: var(--text); }
.platform-account-identity code, .platform-account-credential { color: #8fa7bd; font-size: 11px; overflow-wrap: anywhere; }
.platform-account-server { display: block; min-width: 190px; line-height: 1.55; }
.platform-account-readiness { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.platform-account-readiness::before { width: 7px; height: 7px; border-radius: 50%; content: ''; background: #f2c16d; box-shadow: 0 0 7px rgba(242, 193, 109, .45); }
.platform-account-readiness.ready { color: var(--cyan); }
.platform-account-readiness.ready::before { background: var(--cyan); box-shadow: 0 0 7px rgba(49, 216, 205, .65); }
.platform-account-instances { display: grid; gap: 4px; min-width: 135px; }
.platform-account-instances > span:not(.muted) { padding-left: 8px; border-left: 2px solid rgba(49, 216, 205, .42); }
.agent-approval-panel { display: grid; gap: 12px; margin-top: 4px; }
.agent-approval-panel-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; padding: 15px 16px; border: 1px solid var(--line); background: linear-gradient(135deg, rgba(10, 32, 48, .86), rgba(8, 21, 35, .58)); }
.agent-approval-kicker, .agent-approval-group-heading p { margin: 0 0 4px; color: var(--cyan); font-size: 11px; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.agent-approval-panel-heading h3, .agent-approval-group-heading h4 { margin: 0; color: var(--text); }
.agent-approval-panel-heading h3 { font-size: 18px; }
.agent-approval-panel-heading .muted { margin: 6px 0 0; font-size: 12px; }
.agent-approval-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: start; }
.agent-approval-group, .agent-approval-grid > .contracts-page { display: grid; align-content: start; gap: 10px; min-width: 0; min-height: 192px; max-height: min(720px, calc(100vh - 210px)); margin: 0; padding: 14px; overflow: hidden; border: 1px solid var(--line); background: rgba(8, 21, 35, .62); }
.agent-approval-group { grid-template-rows: auto minmax(0, 1fr); }
.agent-approval-grid > .contracts-page { grid-template-rows: auto auto minmax(0, 1fr); }
.agent-approval-group-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; padding-bottom: 10px; border-bottom: 1px solid rgba(45, 77, 104, .5); }
.agent-approval-group-heading h4 { font-size: 14px; }
.agent-approval-group-heading > span { flex: 0 0 auto; padding: 4px 7px; color: #9db4cc; border: 1px solid rgba(76, 122, 153, .58); background: rgba(45, 77, 104, .16); font-size: 11px; }
.agent-approval-group-description { margin: -4px 0 0; font-size: 12px; }
.agent-approval-group .agent-key-list, .agent-approval-grid > .contracts-page .agent-key-list { min-height: 0; margin: 0; padding-right: 2px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(49, 216, 205, .55) transparent; }
.agent-approval-group .agent-key-list::-webkit-scrollbar, .agent-approval-grid > .contracts-page .agent-key-list::-webkit-scrollbar { width: 6px; }
.agent-approval-group .agent-key-list::-webkit-scrollbar-thumb, .agent-approval-grid > .contracts-page .agent-key-list::-webkit-scrollbar-thumb { border-radius: 3px; background: rgba(49, 216, 205, .45); }
.agent-approval-group .agent-key-row, .agent-approval-grid > .contracts-page .agent-key-row { display: flex; align-items: start; min-height: 106px; }
.agent-approval-group .agent-key-row > :first-child, .agent-approval-grid > .contracts-page .agent-key-row > :first-child { min-width: 0; }
.agent-approval-group .agent-key-row code, .agent-approval-grid > .contracts-page .agent-key-row code { overflow-wrap: anywhere; word-break: break-word; }
.agent-approval-group .agent-key-actions, .agent-approval-grid > .contracts-page .agent-key-actions { align-self: center; }
.agent-approval-cex-group { grid-column: auto; }
@media (max-width: 960px) { .agent-approval-grid { grid-template-columns: 1fr; } }
@media (max-width: 820px) { .strategy-setup-form { grid-column: 1 / -1; } .strategy-setup-grid[data-access-tab="accounts"] .account-discovery-form { grid-template-columns: 1fr; } .strategy-setup-grid[data-access-tab="accounts"] .account-discovery-form .strategy-setup-actions { justify-content: flex-start; padding: 10px 0 0; border-top: 1px solid rgba(45, 77, 104, .42); border-left: 0; } .strategy-setup-grid[data-access-tab="accounts"] .account-discovery-form .strategy-setup-fields { grid-template-columns: 1fr; } .account-import-heading { align-items: start; flex-direction: column; gap: 7px; } .account-import-heading p { text-align: left; } .strategy-setup-grid[data-access-tab="accounts"] .account-import-card .strategy-setup-fields { padding: 0 16px; } .strategy-setup-grid[data-access-tab="accounts"] .account-import-card .strategy-setup-actions { margin: 0 16px 14px; } .account-import-note { padding: 10px 0 0; border-top: 1px solid rgba(49, 216, 205, .22); border-left: 0; } }
@media (max-width: 560px) { .strategy-setup-fields { grid-template-columns: 1fr; } .strategy-setup-fields label:last-child { grid-column: auto; } .strategy-setup-actions button { width: 100%; } }
@media (max-width: 560px) { .platform-account-actions { flex-wrap: wrap; } }
.strategy-server-switch { display: inline-flex; cursor: pointer; }
.strategy-server-switch input { position: absolute; opacity: 0; }
.strategy-server-switch span { position: relative; width: 38px; height: 20px; border: 1px solid var(--line); border-radius: 12px; background: rgba(45, 77, 104, .35); transition: .18s ease; }
.strategy-server-switch span::after { position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; border-radius: 50%; content: ''; background: var(--muted); transition: .18s ease; }
.strategy-server-switch input:checked + span { border-color: rgba(49, 216, 205, .7); background: rgba(49, 216, 205, .22); }
.strategy-server-switch input:checked + span::after { left: 21px; background: var(--cyan); box-shadow: 0 0 8px rgba(49, 216, 205, .7); }
.strategy-server-switch input:focus-visible + span { outline: 2px solid var(--cyan); outline-offset: 2px; }
@media (max-width: 760px) { .strategy-control-toolbar .muted { width: 100%; margin-right: 0; } }
@media (max-width: 760px) { .access-overview-pane { grid-template-columns: 1fr; } }