/* Cabinet density. Palette, graphics and interaction styles remain in style.css. */
:root { font-size:13px; --sidebar:220px; --header:64px; }
button { gap:8px; min-height:36px; padding:8px 14px; border-radius:9px; }
h1 { font-size:24px; line-height:32px; letter-spacing:-.65px; }
h2 { font-size:20px; line-height:28px; letter-spacing:-.5px; }
h3 { font-size:16px; line-height:23px; letter-spacing:-.35px; }
p { margin:6px 0 12px; }
.details { font-size:12px; line-height:19px; }
.ui-icon { width:20px; height:20px; }
.brand { gap:9px; font-size:18px; line-height:24px; letter-spacing:-.5px; }
.dashboard-sidebar { padding:12px; }
.dashboard-brand { height:48px; padding:0 8px; margin-bottom:14px; gap:9px; font-size:18px; }
.dashboard-brand img { width:36px; height:32px; }
#dashboard-navigation { gap:4px; }
.nav-item { height:40px; min-height:40px; padding:0 12px; gap:12px; border-radius:10px; font-size:14px; }
.nav-item .ui-icon { width:20px; height:20px; }
.sidebar-extra { padding-top:24px; }
.sidebar-promo { padding:16px; border-radius:12px; }
.sidebar-promo>.ui-icon { width:24px; height:24px; margin-bottom:5px; }
.sidebar-promo h3 { font-size:15px; line-height:22px; }
.sidebar-promo p { margin:5px 0 14px; font-size:12px; line-height:19px; }
.sidebar-promo button { min-height:36px; border-radius:9px; font-size:12px; }
.dashboard-header { gap:16px; padding:0 24px; }
.header-search { width:min(360px,100%); height:38px; padding:0 13px; gap:11px; border-radius:11px; }
.header-search>.ui-icon { width:19px; height:19px; }
.header-search input { font-size:13px; }
.search-results { top:46px; border-radius:12px; }
#identity { gap:14px; }
.notification-button>.ui-icon { width:22px; height:22px; }
.profile-button { min-height:38px; gap:10px; }
.profile-avatar { width:36px; height:36px; font-size:13px; }
.profile-copy { min-width:100px; max-width:160px; }
.profile-copy strong { font-size:12px; line-height:18px; }
.profile-copy small { font-size:11px; line-height:16px; }
.profile-button>.ui-icon { width:16px; height:16px; margin-left:2px; }
.profile-menu { top:46px; }
.menu-item { font-size:13px; min-height:36px; padding:8px 10px; }
.signed-in #app { padding:16px 24px 24px; }
.dashboard-page { max-width:1280px; margin:0 auto; }
.dash-section { padding:18px 20px; border-radius:14px; }
.agent-section { margin-bottom:0; }
.agent-heading { min-height:36px; margin-bottom:16px; gap:14px; align-items:center; }
.agent-heading h1 { margin:0; font-size:24px; line-height:32px; letter-spacing:-.65px; max-width:none; }
.primary { min-height:36px; padding:8px 16px; border-radius:9px; font-size:13px; }
.add-agent-button .ui-icon { width:18px; height:18px; }
.agent-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.agent-card { flex-direction:row; align-items:center; gap:14px; min-height:96px; padding:16px; border-radius:12px; }
.agent-detail h3 { margin-bottom:5px; font-size:16px; line-height:23px; letter-spacing:-.4px; }
.card-more { top:8px; right:8px; width:24px; height:24px; min-height:24px; }
.card-more .ui-icon { width:18px; height:18px; }
.logo-tile { width:32px; height:32px; border-radius:8px; }
.logo-tile--agent { width:48px; height:48px; border-radius:11px; }
.logo-monogram { font-size:18px; }
.logo-tile--agent .logo-monogram { font-size:23px; }
.status-badge,.agent-detail .status-badge { padding:4px 8px; font-size:11px; line-height:16px; gap:6px; }
.status-dot,.agent-detail .status-dot { width:6px; height:6px; }
.home-connections { padding:22px 0 10px; }
.section-title { margin-bottom:12px; }
.section-title h2 { font-size:20px; line-height:28px; letter-spacing:-.5px; }
.text-action { font-size:12px; gap:6px; }
.text-action .ui-icon { width:17px; height:17px; }
.connection-overview-grid { gap:12px; }
.connection-overview { flex-basis:calc((100% - 36px)/4); min-height:68px; padding:12px 14px; gap:12px; border-radius:12px; }
.connection-overview .logo-tile { width:32px; height:32px; }
.connection-name { margin-bottom:4px; font-size:13px; line-height:18px; }
.connection-overview .status-badge { padding:3px 6px; font-size:10px; line-height:14px; gap:5px; }
.connection-overview .status-dot { width:6px; height:6px; }
.connection-overview .card-more { top:5px; right:5px; }
.overview-empty { padding:18px; gap:12px; border-radius:12px; }
.overview-empty>.ui-icon { width:26px; height:26px; }
.overview-empty h3 { font-size:16px; }
.overview-empty p { font-size:12px; }
.home-bottom { padding:12px 0 0; gap:16px; grid-template-columns:3fr 2fr; }
.stats-grid { gap:12px; }
.stat-card { padding:16px; min-height:166px; border-radius:12px; }
.stat-circle { width:42px; height:42px; margin-bottom:12px; }
.stat-circle>.ui-icon { width:23px; height:23px; }
.stat-value { font-size:30px; line-height:38px; letter-spacing:-1px; }
.stat-label { font-size:11px; }
.stat-caption { margin-top:8px; gap:5px; font-size:11px; line-height:17px; }
.stat-caption>.ui-icon { width:15px; height:18px; }
.recent-activity { padding:14px 16px; border-radius:12px; }
.recent-activity h3 { font-size:16px; line-height:23px; letter-spacing:-.35px; }
.recent-activity .activity-list { display:flex; gap:8px; }
.activity-row { grid-template-columns:26px minmax(0,1fr) auto; min-height:28px; gap:8px; }
.activity-icon { width:26px; height:26px; }
.activity-icon>.ui-icon { width:16px; height:16px; }
.page-heading,.dashboard-page--connections>.intro { padding:4px 0 18px; }
.page-heading h1,.dashboard-page--connections .intro h1 { font-size:24px; line-height:32px; }
.page-description,.dashboard-page--connections .intro>.muted { font-size:14px; line-height:22px; }
.grid { gap:16px; }
.dashboard-page--connections>.grid { padding:0; }
.panel,.card { padding:18px; border-radius:12px; }
.panel { margin-bottom:16px; }
.panel>h2 { font-size:18px; line-height:26px; }
.panel>p { margin-bottom:14px; }
.card { margin:10px 0; padding:16px; }
.card h3 { font-size:16px; line-height:23px; }
.actions { gap:8px; margin-top:14px; }
label { font-size:12px; line-height:19px; margin:12px 0 5px; }
input,select,textarea { min-height:38px; padding:8px 12px; border-radius:9px; }
pre { padding:12px; border-radius:9px; }
.warning { padding:12px; border-radius:9px; font-size:12px; }
th,td { padding:10px 8px; }
.access-options { margin:16px 0; padding:10px 12px; border-radius:10px; }
.access-options legend { font-size:13px; }
.access-option { gap:10px; margin:6px 0; padding:6px 0; }
.settings-layout { grid-template-columns:200px minmax(0,1fr); gap:16px; padding:0; }
.settings-menu { padding:10px; min-height:480px; border-radius:12px; }
.settings-tab { height:40px; min-height:40px; padding:0 12px; gap:12px; border-radius:10px; font-size:13px; }
.settings-tab>.ui-icon { width:20px; height:20px; }
.settings-content { padding:16px; border-radius:14px; }
.account-heading { gap:14px; margin:0 0 14px; }
.account-heading h2 { font-size:20px; line-height:28px; letter-spacing:-.5px; }
.account-heading .muted { font-size:13px; line-height:21px; }
.account-heading .primary { min-height:36px; font-size:12px; padding:8px 14px; }
.profile-card { padding:16px; margin-bottom:12px; border-radius:12px; }
.profile-card h3 { margin-bottom:12px; font-size:16px; line-height:23px; letter-spacing:-.35px; }
.profile-grid { grid-template-columns:116px minmax(0,1fr); gap:16px; min-height:116px; }
.profile-avatar--large { width:80px; height:80px; font-size:26px; }
.portrait-badge { width:28px; height:28px; }
.portrait-badge>.ui-icon { width:16px; height:16px; }
.profile-fields label { font-size:12px; line-height:18px; }
.profile-fields input { min-height:38px; margin-bottom:12px; padding:8px 12px; font-size:13px; }
.workspace-access-row { min-height:58px; gap:12px; padding:10px; border-radius:10px; }
.workspace-access-row>.workspace-crown { width:38px; height:38px; border-radius:9px; }
.workspace-crown>.ui-icon { width:23px; height:23px; }
.workspace-access-row strong { font-size:13px; line-height:19px; }
.workspace-access-row p { font-size:12px; }
.workspace-access-row button,.security-links button { min-height:36px; font-size:12px; }
.settings-integrations>.panel { padding:16px; }
.settings-integrations>.panel>h2 { font-size:18px; }
.access-agent-card { margin-top:12px; padding:14px; gap:12px; border-radius:12px; }
.access-agent-card h3 { font-size:15px; line-height:22px; }
.access-agent-card p { font-size:12px; }
.access-agent-card button { min-height:36px; font-size:12px; }
.theme-swatches { margin:16px 0; gap:10px; }
.theme-swatches span { width:42px; height:42px; border-radius:10px; }
.automation-empty { margin:0; padding:32px 24px; }
.automation-empty h2 { font-size:20px; line-height:28px; }
.automation-empty .stat-circle { margin-bottom:16px; }
.automation-empty .muted { margin:10px auto 18px; }
.login { max-width:380px; margin:40px auto; padding:24px; }
.login h1 { font-size:24px; line-height:32px; }
.auth-brand img { width:32px; height:28px; }
dialog { width:min(680px,calc(100vw - 40px)); padding:20px; border-radius:14px; }
.agent-modal { width:min(540px,calc(100vw - 40px)); padding:22px; }
.agent-modal h2 { font-size:20px; line-height:28px; }
.agent-modal .agent-controls p { font-size:13px; }
#notice { padding:11px 16px; border-radius:10px; font-size:13px; }
.service-catalog { margin:0 0 24px; padding:16px; border-radius:14px; }
.service-toolbar { gap:16px; margin-bottom:16px; }
.service-tabs { padding:3px; gap:3px; border-radius:11px; }
.service-tab { min-height:34px; padding:7px 12px; gap:8px; border-radius:8px; font-size:13px; }
.service-tab-count { min-width:20px; padding:1px 5px; font-size:10px; line-height:15px; border-radius:6px; }
.service-search { width:230px; height:38px; padding:0 11px; gap:8px; border-radius:10px; }
.service-search>.ui-icon { width:18px; height:18px; }
.service-search input { height:36px; min-height:0; font-size:12px; }
.service-catalog-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.service-card { min-width:0; min-height:66px; padding:12px; gap:12px; border-radius:11px; }
.service-card-copy { gap:2px; }
.service-card-name { font-size:13px; line-height:18px; letter-spacing:-.15px; }
.service-card-caption { font-size:11px; line-height:16px; }
.service-card-arrow { width:16px; height:16px; }
.service-saved-dot { width:6px; height:6px; }
.service-card>.logo-tile,.service-modal-heading>.logo-tile { width:32px; height:32px; border-radius:8px; }
.service-catalog-empty { padding:32px 16px; }
.service-catalog-empty>.ui-icon { width:32px; height:32px; margin-bottom:10px; }
.service-catalog-empty h3 { font-size:18px; line-height:26px; }
.service-modal { width:min(540px,calc(100vw - 40px)); padding:0; border-radius:16px; }
.service-modal-heading { padding:18px 20px 16px; gap:12px; }
.service-modal-title { font-size:20px; line-height:28px; letter-spacing:-.5px; }
.service-modal-heading .muted { font-size:12px; line-height:18px; }
.service-modal-close { width:32px; height:32px; min-height:32px; font-size:25px; line-height:28px; border-radius:8px; }
.service-modal-content { padding:18px 20px 20px; }
.connection-form-content>p { font-size:13px; line-height:21px; margin-bottom:16px; }
.connection-form-content>a { font-size:12px; margin-top:12px; }
.service-modal input,.service-modal select { height:38px; border-radius:9px; }
.service-modal .actions { gap:8px; margin:14px 0; }
.service-modal .connection-card-heading { margin-bottom:16px; }
.service-modal .connection-card-heading h3 { font-size:16px; line-height:23px; }
.service-modal .connection-details>section { margin:16px 0; }
.service-modal .browser-pairing { margin-top:16px; padding:14px; border-radius:12px; }
.service-modal .details { font-size:12px; line-height:19px; }
.post-tracking-options { margin-top:16px; }
.post-tracking-options>summary { min-height:38px; padding:9px 0; color:#596987; font-size:13px; line-height:20px; cursor:pointer; }
.post-tracking-options>p { margin:4px 0 0; }
.service-modal .browser-files { margin-top:16px; }
.service-modal .browser-files input[type=file] { height:auto; min-height:38px; padding:8px; }
.service-modal-feedback { margin:16px 20px 0; padding:10px 12px; border-radius:9px; font-size:12px; line-height:19px; }
.service-modal input[type=checkbox],.service-modal input[type=radio] { width:auto; height:auto; min-height:0; }
@media (max-width:1200px) {
  .home-bottom { grid-template-columns:1fr; }
  .service-catalog-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .connection-overview { flex-basis:calc((100% - 24px)/3); }
}
@media (max-width:1050px) {
  :root { --sidebar:204px; }
  .dashboard-header { padding:0 20px; }
  .profile-copy { min-width:0; max-width:125px; }
  .settings-layout { grid-template-columns:1fr; }
  .settings-menu { min-height:0; padding:6px; }
  .settings-tab { padding:0 10px; gap:8px; }
}
@media (max-width:960px) {
  .agent-grid { grid-template-columns:1fr; }
  .agent-card { min-height:80px; }
  .service-catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .connection-overview { flex-basis:calc((100% - 12px)/2); }
}
@media (max-width:760px) {
  :root { --sidebar:220px; --header:60px; }
  .signed-in #app { padding:16px; }
  .dashboard-header { padding:0 12px; gap:8px; }
  .header-search { height:36px; gap:8px; padding:0 10px; }
  .header-search input { font-size:12px; }
  .header-search input::placeholder { color:transparent; }
  #identity { gap:6px; }
  .profile-button { gap:3px; }
  .profile-avatar { width:32px; height:32px; font-size:12px; }
  .profile-avatar--large { width:80px; height:80px; font-size:26px; }
  .icon-button,.service-modal-close { width:40px; height:40px; min-height:40px; }
  .dashboard-brand { padding:0 8px; }
  .dashboard-brand img { width:36px; }
  .nav-item { height:44px; min-height:44px; }
  .dash-section { padding:16px; }
  .agent-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .agent-card { padding:14px; gap:12px; }
  .logo-tile--agent { width:40px; height:40px; }
  .agent-detail h3 { font-size:15px; line-height:22px; }
  .agent-heading { gap:10px; margin-bottom:14px; }
  .agent-heading h1 { font-size:22px; line-height:30px; }
  .add-agent-button { width:40px; height:40px; min-height:40px; padding:0; font-size:0; }
  .home-connections { padding:20px 0 8px; }
  .home-bottom { padding:12px 0 0; }
  .page-heading,.dashboard-page--connections>.intro { padding:0 0 16px; }
  .page-heading h1,.dashboard-page--connections .intro h1 { font-size:22px; line-height:30px; }
  .page-description,.dashboard-page--connections .intro>.muted { font-size:13px; line-height:21px; }
  .settings-content { padding:14px; }
  .account-heading .primary { min-height:40px; }
  .workspace-access-row>div { min-width:140px; }
  .service-catalog { margin:0 0 20px; padding:14px; }
  .service-toolbar { flex-direction:column; align-items:stretch; gap:12px; margin-bottom:14px; }
  .service-tabs { align-self:flex-start; }
  .service-tab { min-height:40px; }
  .service-search { width:100%; height:40px; }
  .service-card { min-height:68px; padding:12px; gap:12px; }
  .service-card-name { font-size:13px; }
  .service-card-arrow { display:block; }
  .service-modal { width:calc(100vw - 24px); max-height:calc(100dvh - 24px); border-radius:14px; }
  .service-modal-heading { padding:16px; gap:10px; }
  .service-modal-content { padding:16px; }
  .service-modal-feedback { margin:14px 16px 0; }
  .service-modal input,.service-modal select { height:44px; }
  .service-modal .actions button { min-height:40px; }
  .profile-fields input { min-height:44px; }
}
@media (max-width:600px) {
  .agent-grid { grid-template-columns:1fr; }
  .agent-card { min-height:80px; }
  .service-catalog-grid { grid-template-columns:minmax(0,1fr); }
  .connection-overview { flex-basis:100%; }
}
@media (max-width:480px) {
  .stat-card { min-height:0; padding:14px; grid-template-columns:42px auto 1fr; column-gap:12px; }
  .stat-circle { margin:0; }
  .stat-value { font-size:28px; line-height:36px; }
  .profile-grid { grid-template-columns:1fr; gap:14px; }
  .profile-portrait { justify-self:start; }
  .profile-avatar--large { width:72px; height:72px; font-size:24px; }
  .recent-activity { padding:14px; }
}
@media (max-width:380px) {
  .service-tabs { width:100%; }
  .service-tab { flex:1; justify-content:center; padding:7px 9px; gap:7px; font-size:12px; }
}

/* Home: assistant setup and the owner's grants stay in a dialog. */
.agent-card { padding:0; }
.agent-card-open { width:100%; min-width:0; min-height:inherit; padding:16px; gap:14px; justify-content:flex-start; text-align:left; background:none; color:var(--ink); border-radius:inherit; }
.agent-card-open:hover { background:rgba(17,19,26,.025); }
.agent-card-open:active { transform:none; }
.agent-card-open .agent-detail { display:flex; flex-direction:column; align-items:flex-start; min-width:0; }
.agent-card-name { margin-bottom:5px; font-size:16px; line-height:23px; letter-spacing:-.4px; font-weight:650; overflow-wrap:anywhere; }
.agent-card .card-more { z-index:1; }
.agent-modal { width:min(540px,calc(100vw - 40px)); padding:0; border-radius:16px; max-height:calc(100dvh - 48px); border:1px solid #ECEDEF; box-shadow:0 18px 60px rgba(17,19,26,.16); }
.agent-modal::backdrop { background:rgba(17,19,26,.32); }
.agent-modal-heading { display:flex; align-items:center; gap:12px; padding:18px 20px 16px; background:var(--surface); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:1; }
.agent-modal-heading>div { flex:1; min-width:0; }
.agent-modal .agent-modal-title { margin:0 0 3px; font-size:20px; line-height:28px; letter-spacing:-.5px; overflow-wrap:anywhere; }
.agent-modal-heading .muted { margin:0; font-size:12px; line-height:18px; }
.agent-modal-close { width:32px; height:32px; min-height:32px; font-size:25px; line-height:28px; padding:0; flex:0 0 auto; }
.agent-modal-content { padding:18px 20px 20px; }
.agent-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:16px; }
.agent-choice { min-width:0; min-height:52px; padding:10px; gap:8px; font-size:12px; border:1px solid transparent; border-radius:10px; background:linear-gradient(140deg,#F8F8F9,#F4F4F5); color:var(--ink); }
.agent-choice>.logo-tile { width:26px; height:26px; border-radius:7px; }
.agent-choice:hover { background:#EFEFF1; }
.agent-choice[aria-pressed=true] { border-color:#818BA2; background:#fff; }
.agent-connection-status { margin-bottom:14px; }
.agent-controls { min-width:0; }
.agent-modal .agent-controls p { margin:0 0 14px; font-size:13px; line-height:21px; }
.agent-modal .agent-controls label { margin-top:0; }
.agent-modal .agent-controls input { font-size:12px; }
.agent-modal .agent-controls button { margin:10px 0 0; }
.agent-check { margin-top:10px; }
.agent-modal-access { margin-top:20px; border-top:1px solid var(--line); padding-top:16px; }
.agent-modal-access>h3 { font-size:15px; line-height:22px; }
.agent-modal-access .empty { margin:8px 0 0; font-size:12px; line-height:20px; }
.agent-modal .access-agent-card { display:grid; grid-template-columns:32px minmax(0,1fr) auto; gap:12px; padding:12px; }
.agent-modal .access-agent-card h3 { font-size:13px; line-height:19px; overflow-wrap:anywhere; }
.agent-modal .access-agent-card p { font-size:11px; line-height:17px; }
.agent-modal .access-agent-card button { margin:0; }
.agent-modal-feedback { margin:16px 20px 0; padding:10px 12px; font-size:12px; line-height:19px; border:1px solid #E7E9EF; border-radius:9px; background:#F1F3F8; color:#53617B; overflow-wrap:anywhere; }
@media (max-width:760px) {
  .agent-card-open { padding:14px; gap:12px; }
  .agent-card-name { font-size:15px; line-height:22px; }
  .agent-modal { width:calc(100vw - 24px); max-height:calc(100dvh - 24px); border-radius:14px; }
  .agent-modal-heading,.agent-modal-content { padding:16px; }
  .agent-modal-close { width:40px; height:40px; min-height:40px; }
  .agent-modal-feedback { margin:14px 16px 0; }
  .agent-modal input { min-height:44px; }
  .agent-modal .agent-controls button,.agent-check,.agent-modal .access-agent-card button { min-height:40px; }
}
@media (max-width:520px) {
  .agent-choice { flex-direction:column; padding:10px 4px; gap:6px; min-height:70px; }
  .agent-modal .access-agent-card { grid-template-columns:32px minmax(0,1fr); gap:10px; }
  .agent-modal .access-agent-card button { grid-column:2; justify-self:start; }
}

.connection-guide{max-width:760px;margin:32px auto;padding:20px;overflow-wrap:anywhere}
