.console-body { min-height: 100vh; overflow-x: hidden; }
.console-body.drawer-open { overflow: hidden; }
[hidden] { display: none !important; }
.console-topbar { position: fixed; width: 100%; }
.environment-badge { padding: 2px 7px; border: 1px solid color-mix(in srgb,var(--warn) 35%,var(--line)); border-radius: 4px; color: var(--warn); font-size: 10px; font-weight: 800; }
.docs-link { color: var(--muted); font-size: 13px; text-decoration: none; }
.profile-menu { position: relative; }
.profile-button { width: 38px; height: 38px; display: grid; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 50%; color: #fff; background: var(--brand); cursor: pointer; font-size: 12px; font-weight: 800; }
.profile-button svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
.profile-dropdown { position: absolute; z-index: 90; top: 45px; right: 0; width: 240px; padding: 6px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); box-shadow: var(--shadow); }
.profile-dropdown[hidden] { display: none; }
.profile-identity { display: grid; padding: 10px; border-bottom: 1px solid var(--line); overflow: hidden; }
.profile-identity small { color: var(--muted); text-overflow: ellipsis; overflow: hidden; }
.profile-dropdown a, .profile-dropdown button { width: 100%; display: block; padding: 9px 10px; border: 0; border-radius: 4px; color: var(--ink); background: transparent; text-align: left; text-decoration: none; cursor: pointer; font-size: 13px; }
.profile-dropdown a:hover, .profile-dropdown button:hover { background: var(--surface-subtle); }
.profile-dropdown [hidden] { display: none; }
.console-mobile-menu { display: none; }
.auth-page { min-height: 100vh; display: grid; place-items: center; padding: 96px 20px 40px; background: var(--bg); }
.auth-surface { width: calc(100vw - 32px); max-width: 430px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); box-shadow: var(--shadow); }
.auth-brand { display: flex; align-items: center; gap: 11px; padding: 20px; color: var(--ink); text-decoration: none; }
.auth-brand img { width: 38px; }.auth-brand span { display: grid; line-height: 1.25; }.auth-brand small { color: var(--muted); }
.auth-tabs { display: flex; border-block: 1px solid var(--line); }
.auth-tabs button { flex: 1; height: 44px; border: 0; border-bottom: 2px solid transparent; color: var(--muted); background: transparent; cursor: pointer; }
.auth-tabs button.active { border-color: var(--brand); color: var(--brand-strong); font-weight: 750; }
.console-form { display: grid; gap: 15px; padding: 22px; }
.console-form h1 { margin: 0; font-size: 25px; }.console-form h1 + p { margin: -8px 0 4px; color: var(--muted); font-size: 13px; }
.console-form label { display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 700; }
.console-form input, .console-form select, .console-form textarea { width: 100%; min-height: 41px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 5px; color: var(--ink); background: var(--surface); }
.console-form textarea { min-height: 90px; resize: vertical; }.console-form .button { justify-self: start; }
.console-form[aria-busy="true"] { cursor: wait; }
.button:disabled, .icon-button:disabled, .profile-button:disabled { opacity: .58; cursor: not-allowed; }
.console-form fieldset { min-width: 0; margin: 0; padding: 13px; border: 1px solid var(--line); }.console-form legend { color: var(--ink); font-size: 12px; font-weight: 750; }
.form-message { min-height: 20px; margin: 0; padding: 0 22px 18px; color: var(--bad); font-size: 13px; }
.console-layout { min-height: 100vh; padding-top: var(--header-height); }
.console-sidebar { position: fixed; z-index: 40; top: var(--header-height); bottom: 0; left: 0; width: 238px; display: flex; flex-direction: column; border-right: 1px solid var(--line); background: var(--surface); }
.console-user { display: flex; align-items: center; gap: 10px; padding: 18px; border-bottom: 1px solid var(--line); }.console-user div { display: grid; min-width: 0; }.console-user strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }.console-user small { color: var(--muted); font-size: 11px; }
.avatar { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; color: #fff; background: var(--brand); font-size: 11px; font-weight: 800; }
.console-sidebar nav { display: grid; gap: 2px; padding: 10px; }.console-sidebar nav a { display: flex; align-items: center; gap: 10px; min-height: 41px; padding: 0 10px; border-radius: 5px; color: var(--muted); font-size: 13px; text-decoration: none; }.console-sidebar nav a:hover { color: var(--ink); background: var(--surface-subtle); }.console-sidebar nav a.active { color: var(--brand-strong); background: var(--brand-soft); font-weight: 750; }.console-sidebar svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sidebar-foot { display: grid; gap: 7px; margin-top: auto; padding: 15px 20px; border-top: 1px solid var(--line); font-size: 11px; }.sidebar-foot span { color: var(--muted); }
.console-main { min-width: 0; margin-left: 238px; padding: 34px 38px 80px; }
.console-view { display: none; max-width: 1160px; margin: auto; }.console-view.active { display: block; }
.view-header { min-height: 90px; display: flex; align-items: flex-start; gap: 20px; margin-bottom: 25px; border-bottom: 1px solid var(--line); }.view-header > div { flex: 1; }.view-header h1 { margin: 5px 0 7px; font-size: 29px; }.view-header p { margin: 0 0 24px; color: var(--muted); }.view-header > .button { flex: 0 0 auto; }
.eyebrow { color: var(--brand); font-size: 11px; font-weight: 850; }.metric-strip { display: grid; grid-template-columns: repeat(4,1fr); border: 1px solid var(--line); background: var(--surface); }.metric-strip div { display: grid; gap: 4px; padding: 18px; border-right: 1px solid var(--line); }.metric-strip div:last-child { border: 0; }.metric-strip span { color: var(--muted); font-size: 12px; }.metric-strip strong { font-size: 25px; }
.overview-section { margin-top: 34px; }.overview-section h2,.section-heading { font-size: 18px; display: flex; align-items: center; gap: 10px; }
.plan-chip { padding: 2px 9px; border: 1px solid var(--brand); border-radius: 999px; color: var(--brand); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; }
.usage-card { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; border: 1px solid var(--line); background: var(--line); }
.usage-row { display: grid; gap: 8px; padding: 16px 18px; background: var(--surface); }
.usage-row-head { display: flex; justify-content: space-between; align-items: baseline; font-size: 12px; color: var(--muted); }
.usage-row-head strong { color: var(--ink); font-size: 13px; }
.usage-bar-track { height: 8px; border-radius: 999px; background: var(--surface-subtle); overflow: hidden; }
.plan-request-status { margin-top: 12px; }
.plan-request-status p { margin: 0; font-size: 13px; color: var(--muted); }
.plan-request-pending { padding: 8px 12px; border: 1px solid var(--brand); border-radius: 6px; color: var(--ink) !important; }
.plan-request-history summary { cursor: pointer; font-size: 12px; font-weight: 700; color: var(--muted); }
.plan-request-history p { padding: 4px 0; }
.plan-request-form { margin-top: 12px; max-width: 420px; }
.usage-bar-fill { height: 100%; border-radius: 999px; background: var(--brand); transition: width .3s ease; }
.usage-bar-fill.warn { background: var(--warn); }
.usage-bar-fill.bad { background: var(--bad); }
.usage-row small { color: var(--muted); font-size: 11px; }
@media(max-width:900px){.usage-card{grid-template-columns:1fr}}.quick-actions { display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid var(--line); background: var(--surface); }.quick-actions a { display: flex; align-items: center; gap: 13px; min-height: 88px; padding: 15px; border-right: 1px solid var(--line); color: var(--ink); text-decoration: none; }.quick-actions a:last-child { border: 0; }.quick-actions a:hover { background: var(--surface-subtle); }.quick-actions svg { width: 23px; fill: none; stroke: var(--brand); stroke-width: 1.8; }.quick-actions span { display: grid; }.quick-actions small { color: var(--muted); }
.table-shell { overflow: hidden; border: 1px solid var(--line); background: var(--surface); }.table-head,.resource-row { display: grid; grid-template-columns: minmax(150px,1.2fr) minmax(170px,1fr) 150px 100px 78px; gap: 12px; align-items: center; padding: 11px 15px; }.table-head { color: var(--muted); background: var(--surface-subtle); font-size: 10px; font-weight: 800; text-transform: uppercase; }.resource-row { min-height: 60px; border-top: 1px solid var(--line); font-size: 12px; }.resource-row strong { font-size: 13px; }.resource-row code { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.resource-row .row-title { display: grid; }.resource-row small { color: var(--muted); }.resource-row .button { justify-self: end; }.apps-grid { grid-template-columns: minmax(140px,1fr) minmax(160px,1.1fr) 130px minmax(120px,0.9fr) 156px; }.resource-row .callback-cell { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }.row-actions .button { flex: 0 0 auto; white-space: nowrap; }.devices-grid { grid-template-columns: minmax(150px,1fr) 100px 170px minmax(170px,1fr) 72px; }.mcp-grid { grid-template-columns: minmax(160px,1.2fr) 150px minmax(200px,1.4fr) 100px; }.query-grid { grid-template-columns: minmax(150px,1fr) 120px minmax(210px,1.4fr) 90px 80px; }
.webhooks-grid { grid-template-columns: minmax(170px,1.4fr) minmax(170px,1fr) 150px 100px 130px; }
.delivery-list { padding: 16px 20px; display: grid; gap: 10px; }
.delivery-row { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px; font-size: 12px; }
.delivery-row .delivery-meta { display: grid; gap: 2px; }
.delivery-row small { color: var(--muted); }.empty-row { padding: 25px; color: var(--muted); text-align: center; font-size: 13px; }
.empty-row.loading { position: relative; color: transparent; }.empty-row.loading::after { content: ''; position: absolute; inset: 0; margin: auto; width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--line); border-top-color: var(--brand); animation: console-spin .7s linear infinite; }
.empty-row.error { display: flex; align-items: center; justify-content: center; gap: 10px; color: var(--bad); }
@keyframes console-spin { to { transform: rotate(360deg); } }
.status { width: fit-content; padding: 3px 7px; border: 1px solid var(--line); border-radius: 999px; color: var(--good); font-size: 10px; font-weight: 750; text-transform: capitalize; }.status.revoked,.status.disabled { color: var(--bad); }
.secret-banner,.info-band { display: grid; grid-template-columns: 1fr auto; gap: 7px 15px; align-items: center; margin-bottom: 18px; padding: 14px 16px; border-left: 3px solid var(--warn); background: color-mix(in srgb,var(--warn) 8%,var(--surface)); }.secret-banner code { overflow: auto; white-space: nowrap; }.secret-banner small,.info-band span { color: var(--muted); }.info-band { grid-template-columns: 170px 1fr; border-color: var(--info); background: color-mix(in srgb,var(--info) 7%,var(--surface)); font-size: 13px; }
.secret-banner.credentials-banner { grid-template-columns: 1fr; }
.credential-list { display: grid; gap: 10px; margin: 10px 0 4px; }
.credential-field { display: grid; grid-template-columns: 96px minmax(0,1fr) auto; gap: 10px; align-items: center; }
.credential-label { color: var(--muted); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.credential-field code { overflow: auto; white-space: nowrap; padding: 7px 10px; border-radius: 5px; border: 1px solid var(--line); background: var(--surface); }
.credential-field .button { justify-self: end; }
@media(max-width:600px){.credential-field{grid-template-columns:1fr;}.credential-field .button{justify-self:start;}}
.totp-qr { width: 180px; height: 180px; background: #fff; padding: 8px; border-radius: 4px; margin: 4px 0 10px; }.totp-qr svg { width: 100%; height: 100%; shape-rendering: crispEdges; }.totp-qr .qr-bg { fill: #fff; }.totp-qr .qr-modules rect { fill: #000; }
.credentials-banner .hint { margin: -4px 0 8px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.recovery-codes { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.credential-field-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.recovery-codes-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(120px,1fr)); gap: 8px; }
.recovery-codes-grid code { display: block; text-align: center; padding: 7px 6px; border-radius: 5px; border: 1px solid var(--line); background: var(--surface); font-size: 12px; letter-spacing: 0.3px; }
@media(max-width:600px){.recovery-codes-grid{grid-template-columns:repeat(2,1fr);}}
.form-preview { margin: 4px 0 2px; padding: 10px 12px; border: 1px dashed var(--line); border-radius: 6px; background: var(--surface-subtle); font-size: 12px; color: var(--muted); }.form-preview strong { color: var(--ink); }.form-preview code { color: var(--brand); word-break: break-all; }
.managed-mcp { display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; padding: 22px; border: 1px solid var(--line); background: var(--surface); }.managed-mcp h2 { margin: 9px 0 3px; font-size: 19px; }.managed-mcp p { margin: 0 0 10px; color: var(--muted); }.managed-icon { width: 56px; height: 56px; display: grid; place-items: center; border-radius: 7px; color: var(--brand); background: var(--brand-soft); }.managed-icon svg { width: 30px; fill: none; stroke: currentColor; stroke-width: 1.8; }.section-heading { margin-top: 32px; }
.drawer { position: fixed; z-index: 100; top: 0; right: 0; width: min(460px,100vw); height: 100vh; overflow: auto; border-left: 1px solid var(--line); background: var(--surface); box-shadow: -16px 0 50px rgba(0,0,0,.16); }.drawer[hidden],.drawer-backdrop[hidden] { display: none; }.drawer header { height: 78px; display: flex; align-items: center; justify-content: space-between; padding: 0 20px; border-bottom: 1px solid var(--line); }.drawer h2 { margin: 3px 0 0; font-size: 21px; }.drawer-backdrop { position: fixed; z-index: 95; inset: 0; background: rgba(0,0,0,.38); }.callback-row { display: grid; grid-template-columns: 1fr auto; gap: 6px; margin-bottom: 7px; }.checkbox-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.checkbox-grid label { display: flex; align-items: center; gap: 7px; }.checkbox-grid input { width: auto; min-height: auto; }
.console-message { position: fixed; z-index: 120; right: 22px; bottom: 22px; max-width: 440px; margin: 0; padding: 12px 15px; border: 1px solid var(--line); border-left: 3px solid var(--brand); background: var(--surface); box-shadow: var(--shadow); font-size: 13px; }
.device-actions { display: flex; gap: 9px; }
.check-row { display:flex!important; align-items:center; gap:9px; }.check-row input { width:auto; min-height:0; }
.form-pair { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.query-filter-row { display:grid; grid-template-columns:1fr 1fr 1fr 1.25fr 36px; gap:6px; margin-bottom:7px; }.query-filter-row .icon-button { width:36px; }.toolset-list { display:grid; gap:10px; }.toolset-row { padding:16px; background:var(--surface); border:1px solid var(--line); border-radius:6px; }.toolset-row header { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }.toolset-row>code { display:block; margin:10px 0; padding:8px; background:var(--code-bg); overflow:auto; }.tool-chips { display:flex; gap:7px; flex-wrap:wrap; }
.console-scrim { display: none; }
@media(max-width:900px){.metric-strip{grid-template-columns:1fr 1fr}.metric-strip div:nth-child(2){border-right:0}.metric-strip div:nth-child(-n+2){border-bottom:1px solid var(--line)}.quick-actions{grid-template-columns:1fr}.quick-actions a{border-right:0;border-bottom:1px solid var(--line)}.table-shell{overflow-x:auto}.table-head,.resource-row{min-width:780px}}
@media(max-width:700px){.console-mobile-menu{display:inline-grid}.docs-link,.environment-badge{display:none}.console-sidebar{top:0;z-index:80;height:100vh;transform:translateX(-102%);transition:transform .2s}.console-layout.nav-open .console-sidebar{transform:none}.console-layout.nav-open .console-scrim{position:fixed;z-index:70;inset:0;display:block;background:rgba(0,0,0,.4)}.console-main{margin-left:0;padding:25px 16px 60px}.view-header{display:grid}.view-header>.button{justify-self:start}.metric-strip{grid-template-columns:1fr 1fr}.info-band{grid-template-columns:1fr}.managed-mcp{grid-template-columns:1fr}.managed-icon{display:none}.checkbox-grid{grid-template-columns:1fr}.profile-dropdown{position:fixed;top:56px;right:8px}.brand-copy span{display:none}}
.oauth-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: var(--page); }
.oauth-card { width: min(100%, 440px); background: var(--surface); border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 18px 50px rgba(18, 43, 34, .12); overflow: hidden; }
.oauth-card-header { padding: 24px 26px 18px; border-bottom: 1px solid var(--line); }
.oauth-card-header .auth-brand { margin-bottom: 22px; }
.oauth-card-body { padding: 24px 26px 26px; }
.oauth-card h1 { margin: 0 0 8px; font-size: 24px; }
.oauth-card p { margin: 0 0 20px; color: var(--muted); line-height: 1.55; }
.oauth-scope-list { display: grid; gap: 8px; padding: 0; margin: 18px 0 24px; list-style: none; }
.oauth-scope-list li { display: flex; gap: 10px; align-items: center; padding: 10px 12px; background: var(--surface-soft); border: 1px solid var(--line); border-radius: 6px; }
.oauth-scope-list svg { width: 18px; height: 18px; fill: none; stroke: var(--brand); stroke-width: 2; }
.oauth-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.oauth-client { display: block; margin-top: 8px; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.oauth-error { color: var(--danger); min-height: 22px; margin-top: 12px; }
.row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
}

.chip-action {
  border: 0;
  border-left: 1px solid currentColor;
  margin-left: 6px;
  padding-left: 7px;
  color: inherit;
  background: transparent;
  font: inherit;
  cursor: pointer;
}
.security-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.security-grid > section {
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
}
.security-grid > section > p {
  color: var(--muted);
}
.inline-security-form {
  display: flex;
  gap: 8px;
  margin: 16px 0;
}
.inline-security-form input {
  min-width: 0;
  flex: 1;
}
.security-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-top: 1px solid var(--line);
}
.security-row small {
  display: block;
  color: var(--muted);
}
@media (max-width: 760px) {
  .security-grid {
    grid-template-columns: 1fr;
  }
  .inline-security-form {
    align-items: stretch;
    flex-direction: column;
  }
}