/* AgentEmail identity; Guth Labs effective light/dark palette, observed 2026-10-11. */
:root{color-scheme:light;--ae-canvas:#fffdf7;--ae-surface:#f0f1e9;--ae-ink:#233127;--ae-muted:#5c6e5e;--ae-blue:#153c29;--ae-blue-hover:#244e37;--ae-periwinkle:#285837;--ae-pale:#e3e8dd;--ae-rule:#d8ddcf;--ae-hover:#eeeee5;--ae-focus:#285837;--ae-on-accent:#fffdf7;--ae-terminal:#153c29;--ae-terminal-text:#f0ecdf;--ae-terminal-muted:#b8d0b2;--ae-danger:#934034;--ae-warning-bg:#f3ecd7;--ae-warning-ink:#654b18;--code:var(--ae-terminal);--code-text:var(--ae-terminal-text);--code-muted:var(--ae-terminal-muted)}

html,body{background:var(--ae-canvas);color:var(--ae-ink)}
.header,.app-header,.sidebar{background:var(--ae-canvas);border-color:var(--ae-rule)}
.nav a.button,.button:not(.secondary):not(.button-secondary):not(.close-mailbox-button){background:var(--ae-blue);border-color:var(--ae-blue);color:var(--ae-on-accent)}
.nav a.button:hover,.button.primary:hover,.button-primary:hover{background:var(--ae-blue-hover)}
.button.secondary,.button-secondary{background:var(--ae-surface);color:var(--ae-blue);border-color:var(--ae-rule)}
.ae-hero h1 em,.ae-plan h2,.ae-features article>span,.ae-start li::marker{color:var(--ae-blue)}
.ae-code,.code-panel pre,.doc pre{background:var(--ae-terminal);color:var(--ae-terminal-text);box-shadow:none}
.ae-code-head,.ae-code-options button,.ae-code-note{color:var(--ae-terminal-muted)}
.ae-code-options{border-color:var(--ae-rule)}
.ae-code-options button[aria-pressed=true]{color:var(--ae-terminal-text);border-color:var(--ae-terminal-muted)}
.ae-code .ae-example{color:var(--ae-terminal-text)}
.ae-mail-demo,.ae-plan,.mail-workspace,.reader,.reader-panel,.composer,.modal,.dialog{background:var(--ae-surface);color:var(--ae-ink);border-color:var(--ae-rule)}
.ae-mail-demo>div span,.ae-mail-demo small,.ae-plan-price span,.ae-features p,.ae-start p,.ae-status p,.ae-faq p{color:var(--ae-muted)}
.ae-mail-demo p,.ae-mail-demo>a,.ae-section,.ae-faq details,.ae-release-note{border-color:var(--ae-rule)}
.ae-start,.ae-plan-state{background:var(--ae-pale);color:var(--ae-blue)}
.ae-pricing a:focus-visible,.ae-faq summary:focus-visible{outline-color:var(--ae-focus)}
.search-field,.reader-note,.quoted-original{background:var(--ae-hover);color:var(--ae-ink)}
.quoted-original{border-color:var(--ae-rule)}
.paper-illustration i{background:var(--ae-rule)}
input,select,textarea{color:var(--ae-ink);background:var(--ae-surface);border-color:var(--ae-rule)}
input::placeholder,textarea::placeholder{color:var(--ae-muted)}
.close-mailbox-button,.danger,.error{color:var(--ae-danger)}
.warning,.billing-warning{background:var(--ae-warning-bg);color:var(--ae-warning-ink)}
.footer,.site-footer,.workspace-footer{color:var(--ae-muted);border-color:var(--ae-rule)}
.footer a,.site-footer a,.workspace-footer a{color:var(--ae-blue)}
a{color:var(--ae-blue)}

/* Selected Guth + envelope identity and public header. */
.header{position:relative}.header::after{content:"";position:absolute;bottom:0;left:32px;right:32px;height:1px;background:var(--ae-rule)}.header .brand{gap:10px}.header .ae-brand-symbol{width:64px;height:40px}.header .nav .nav-security{display:inline-flex}@media(max-width:780px){.header::after{left:20px;right:20px}}@media(max-width:640px){.header{flex-wrap:wrap;gap:18px}.header .nav{width:100%;justify-content:space-between;gap:12px}.header .nav a:not(.button){display:inline-flex}.header .ae-brand-symbol{width:60px;height:38px}}

/* Ready mailbox guidance lives in its first stored email. */
.status-strip[hidden]{display:none!important}

/* Loading stays inside the inbox without moving surrounding content. */
.mail-workspace{position:relative}.inbox-loading{position:absolute;inset:0;z-index:5;display:grid;place-items:center;background:rgba(255,253,245,.58);backdrop-filter:blur(1px);border-radius:inherit;cursor:progress}.inbox-loading[hidden]{display:none!important}.inbox-spinner{width:34px;height:34px;border:3px solid rgba(21,60,41,.15);border-top-color:#153c29;border-radius:50%;animation:inbox-spin .8s linear infinite}.mail-workspace[aria-busy="true"] .list-empty{visibility:hidden}@keyframes inbox-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.inbox-spinner{animation:none}}

/* Dashboard: larger symbol at left, domain beside search. */
.app-shell .brand-row .brand{gap:0;flex-shrink:0}.app-shell .brand-row .ae-brand-symbol{width:128px;height:64px;max-width:none;object-fit:contain}.dashboard-wordmark{flex-shrink:0;color:#153c29;font:700 34px/1.1 Arial,sans-serif;letter-spacing:-1.2px;text-decoration:none;white-space:nowrap}.topbar .global-search{flex:1 1 720px;min-width:0}.topbar .top-actions{flex-shrink:0}.topbar .search-field input{min-width:0}@media(max-width:1200px){.topbar .connection{display:none}.dashboard-wordmark{font-size:28px}.topbar{gap:18px}}@media(max-width:1000px){.app-shell .brand-row .ae-brand-symbol{width:110px;height:58px}.dashboard-wordmark{font-size:25px}.topbar{gap:14px}}@media(max-width:760px){.app-shell .brand-row,.app-shell.nav-collapsed .brand-row{height:72px}.app-shell .brand-row .ae-brand-symbol{width:120px;height:64px}.dashboard-wordmark{font-size:23px;letter-spacing:-.8px}.topbar{gap:12px}.topbar .search-field{padding-inline:12px;gap:8px}.topbar .search-field input{font-size:13px}}

/* Keep the full header stationary; only the workspace slides into the menu rail. */
@media(min-width:761px){
.app-shell,.app-shell.nav-collapsed{grid-template-columns:216px minmax(0,1fr)}
.app-shell .sidebar,.app-shell.nav-collapsed .sidebar{width:216px;padding:0 12px 16px;box-sizing:border-box;background:transparent;pointer-events:none}
.app-shell .sidebar .brand-row,.app-shell .sidebar nav,.app-shell .sidebar-account{pointer-events:auto}
.app-shell .brand-row,.app-shell.nav-collapsed .brand-row{justify-content:flex-start}
.app-shell.nav-collapsed .brand{display:flex}
.app-shell .sidebar nav{width:100%;transition:width 180ms cubic-bezier(.2,0,.2,1);overflow:hidden}
.app-shell.nav-collapsed .sidebar nav{width:48px}
.app-shell .workspace-panel{margin-left:0;transition:margin-left 180ms cubic-bezier(.2,0,.2,1)}
.app-shell.nav-collapsed .workspace-panel{margin-left:-144px}
}
@media(min-width:761px) and (max-width:1000px){
.app-shell,.app-shell.nav-collapsed{grid-template-columns:180px minmax(0,1fr)}
.app-shell .sidebar,.app-shell.nav-collapsed .sidebar{width:180px;padding-inline:8px}
.app-shell.nav-collapsed .workspace-panel{margin-left:-108px}
}
@media(max-width:760px){
.app-shell .sidebar nav,.app-shell.nav-collapsed .sidebar nav{display:flex;opacity:1;visibility:visible;transition:opacity 180ms ease,visibility 180ms}
.app-shell.nav-collapsed .sidebar nav{opacity:0;visibility:hidden;pointer-events:none}
.app-shell.nav-collapsed .nav-button{justify-content:flex-start;padding:8px 12px;border-radius:20px;gap:8px}
}
@media(max-width:420px){
.app-shell .sidebar nav,.app-shell.nav-collapsed .sidebar nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px}
.app-shell.nav-collapsed .sidebar .nav-button{padding:8px 3px;gap:5px}
}
@media(prefers-reduced-motion:reduce){.app-shell .workspace-panel,.app-shell .sidebar nav{transition:none!important}}
