button:disabled,.side-link[aria-disabled="true"]{cursor:not-allowed;opacity:.55}
.side-link.unavailable-link{cursor:default;color:#aaa8b6}
.mail-empty[hidden]{display:none}
.mail-empty{padding:36px 16px;text-align:center;color:var(--muted)}
.mail-empty .waiting-icon{margin:0 auto 10px}
.mail-empty h3{margin:0 0 6px;color:var(--ink);font-size:13px}
.mail-empty p{margin:0;font-size:10px;line-height:1.6}
.mail-empty small{display:block;margin-top:9px;font-size:9px}
.star{color:#b08436;font-style:normal;margin-right:4px}
.coming-soon-chip{display:inline-flex;align-items:center;justify-content:center;padding:7px 11px;border-radius:7px;background:#f2f0fb;color:#7b72b2;font-size:10px;font-weight:600}
.empty-card>.coming-soon-chip{width:auto;height:auto;margin:0 auto;display:inline-flex;border-radius:7px;font-size:10px}
.dark .empty-card>.coming-soon-chip{background:#39354e;color:#c2baff}
#settings-status{margin:0 0 18px;padding:11px 13px;border:1px solid #dcefe5;border-radius:8px;background:#f0f8f3;color:#38745b;font-size:11px}
#settings-status[hidden]{display:none}
.recovery-file-button{display:block;margin:11px auto 0;padding:8px 4px;border:0;background:transparent;color:var(--accent);font-size:11px;font-weight:600;cursor:pointer}
#recovery-file-status{display:block;margin-top:7px;text-align:center;color:var(--muted);font-size:10px}
#mail-notice{margin:8px 12px;padding:8px 10px;border-radius:6px;background:#f0f8f3;color:#38745b;font-size:10px}
#mail-notice[hidden]{display:none}
.delete-dialog-form>label{display:block;margin:12px 0 5px;text-align:left;color:var(--ink);font-size:11px}
.delete-dialog-form>input{width:100%;min-height:38px;padding:8px 10px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink);font-size:12px}
.delete-dialog-form>input:focus{outline:2px solid color-mix(in srgb,var(--accent) 35%,transparent);border-color:var(--accent)}
.dark #settings-status{background:#25372f;border-color:#3d594a;color:#b5e1c5}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.recovery-key-value{display:block;overflow-wrap:anywhere;padding:14px;margin:16px 0;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);font:600 14px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;user-select:all}
.security-dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:1100px;margin:0 auto 28px}
.security-panel{min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:11px;padding:18px;box-shadow:var(--shadow)}
.security-panel .panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px}
.security-panel h2{font-size:14px;margin:0 0 5px}
.security-panel p,.security-panel small{font-size:10px;line-height:1.6;color:var(--muted)}
.security-panel small{display:block;margin-top:11px}
.breach-account-label{display:block;margin:12px 0 4px;color:var(--muted);font-size:10px}
.breach-account-address{margin:0 0 12px!important;color:var(--ink)!important;font-size:13px!important;font-weight:600;overflow-wrap:anywhere}
.consent-row,.security-toggle-row{display:flex;align-items:center;gap:8px;margin:10px 0;font-size:10px;color:var(--ink)}
.consent-row input,.security-toggle-row input{accent-color:var(--accent)}
.privacy-score{display:flex;align-items:baseline;gap:4px;margin:8px 0;color:var(--muted)}
.privacy-score strong{font-size:38px;letter-spacing:-2px;color:var(--accent)}
.privacy-score span{font-size:11px}
.security-list p{margin:7px 0;padding:7px 8px;border-radius:6px;background:var(--surface-2);overflow-wrap:anywhere}
.security-list [data-severity="high"]{color:#b74850}
.security-metrics{display:flex;gap:18px;margin:12px 0;color:var(--muted);font-size:9px}
.security-metrics span{display:flex;flex-direction:column;gap:3px}
.security-metrics strong{font-size:20px;color:var(--ink)}
.plan-feature{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:10px}
.plan-feature:last-child{border:0}.plan-feature strong{min-width:54px;color:var(--accent)}
.cleanup-controls{display:flex;gap:8px}.cleanup-controls select{flex:1;min-width:0;border:1px solid var(--line);border-radius:7px;padding:7px;background:var(--surface);color:var(--ink);font:inherit}
.message-actions{flex-wrap:wrap}.message-security{margin-top:18px;padding:14px;border:1px solid var(--line);border-radius:9px;background:var(--surface-2);font-size:10px;line-height:1.65;overflow-wrap:anywhere}
.message-security h3{font-size:12px;margin:0 0 10px}.message-security p{color:var(--muted);margin:8px 0}.message-security ul{padding-left:18px;color:var(--ink)}
.risk-level.high{color:#b74149}.risk-level.medium{color:#b47b26}.risk-level.low{color:#34836a}
.risk-tag{font-style:normal;margin-left:7px;padding:3px 6px;border-radius:8px;font-size:8px}.risk-tag.high{background:#fff0ef;color:#ae4445}.risk-tag.medium{background:#fff5e6;color:#a6762f}
.aliases-panel{max-width:850px;margin:0 auto}.alias-create-form{display:flex;align-items:end;gap:10px;margin:14px 0}.alias-create-form label{font-size:10px;color:var(--muted)}.alias-create-form input{flex:1;min-width:0;height:34px;padding:7px 9px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink)}.alias-list{display:grid;gap:9px;margin-top:14px}.alias-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px;border:1px solid var(--line);border-radius:8px}.alias-details{display:grid;gap:5px;min-width:0}.alias-details strong{font-size:11px}.alias-details code{font-size:10px;color:var(--accent);overflow-wrap:anywhere}.alias-details small{margin:0}.alias-actions{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}.alias-actions button{border:1px solid var(--line);white-space:nowrap}.dark .alias-row{background:var(--surface-2)}
.dark .risk-tag.high{background:#492c30;color:#f4b4b3}.dark .risk-tag.medium{background:#47392b;color:#efca8b}
@media(max-width:760px){.security-dashboard-grid{grid-template-columns:1fr}.security-panel{padding:15px}.alias-row{align-items:flex-start;flex-direction:column}.alias-actions{justify-content:flex-start}.alias-create-form{align-items:stretch;flex-direction:column}}
@media(max-width:700px){.settings-layout{grid-template-columns:1fr}.settings-nav{position:static;display:flex;overflow:auto}.settings-nav a{white-space:nowrap}.setting-row{flex-wrap:wrap}.setting-row>span:nth-child(2){min-width:60%}.setting-row>button,.setting-row>.setting-segment{margin-left:41px}}
.blue-icon{background:#edf3fb;color:#6685b5}
.feature-grid{grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch}
.feature-large{grid-column:span 2}
.feature-card{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.feature-card:hover{transform:translateY(-3px);border-color:#dedaf2;box-shadow:0 12px 28px rgba(40,35,80,.075)}
.dashboard-security-snapshot{grid-column:1/-1;background:linear-gradient(115deg,var(--surface),color-mix(in srgb,var(--accent-soft) 40%,var(--surface)));}
.snapshot-heading,.snapshot-heading>div{display:flex;align-items:center;gap:11px}
.snapshot-heading{justify-content:space-between}
.snapshot-heading h2{margin:0;color:var(--ink);font-size:12px}
.snapshot-heading p{margin:5px 0 0;color:var(--muted);font-size:9px;line-height:1.5}
.snapshot-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:var(--accent-soft);color:var(--accent);font-size:15px}
.snapshot-stats{display:flex;gap:20px;margin:15px 0 3px;color:var(--muted);font-size:9px}
.snapshot-stats strong{color:var(--ink);font-size:17px;margin-right:4px}
.dashboard-security-snapshot .feature-link{margin-top:12px}
.quick-link:hover{background:var(--surface-2);color:var(--accent)}
.dark .blue-icon{background:#303a4b;color:#a9c2e8}
@media(max-width:900px){.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-large{grid-column:span 2}}
@media(max-width:520px){.feature-grid{grid-template-columns:1fr}.feature-large{grid-column:auto}.dashboard-security-snapshot{padding:15px}.snapshot-heading{align-items:flex-start}.snapshot-heading>div{align-items:flex-start}.snapshot-heading .status-chip{white-space:nowrap}.snapshot-stats{gap:14px;flex-wrap:wrap}}
.temp-mail-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:14px;max-width:1100px;margin:0 auto}
.temp-mail-grid .security-panel{padding:20px}
.temporary-address-panel #temporary-empty>p,.temporary-address-panel .temporary-privacy p{font-size:10px;line-height:1.7;color:var(--muted)}
.temporary-address-panel #temporary-empty .primary{margin-top:5px}
#temporary-active[hidden],#temporary-empty[hidden]{display:none}
#temporary-address{display:block;margin:15px 0;padding:14px;border:1px solid var(--line);border-radius:9px;background:var(--surface-2);color:var(--accent);font:600 16px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere;user-select:all}
.temporary-timer{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:10px;margin:10px 0 6px}
.temporary-timer strong{font-size:16px;font-variant-numeric:tabular-nums;color:var(--ink)}
.temporary-progress{height:5px;border-radius:8px;background:var(--line);overflow:hidden}
.temporary-progress i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#7d72d1,#dba447);transition:width .6s linear}
.temporary-actions{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}
.temporary-actions .danger-button{height:28px;margin-left:auto;padding:0 9px}
.temporary-privacy{border-top:1px solid var(--line);margin-top:16px;padding-top:8px}
.temporary-privacy p{margin:8px 0}.temporary-privacy strong{color:var(--ink)}
#temporary-status-message{min-height:12px;margin:8px 0 0;color:var(--muted);font-size:9px;line-height:1.5}
.temporary-message-list{display:grid;gap:9px;margin-top:12px}
.temporary-message-list>p{color:var(--muted);font-size:10px;line-height:1.6}
.temporary-message{padding:12px;border:1px solid var(--line);border-radius:9px;background:var(--surface-2)}
.temporary-message-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.temporary-message-heading>div{display:grid;gap:5px;min-width:0}
.temporary-message-heading strong{font-size:10px;overflow-wrap:anywhere}
.temporary-message-heading span{font-size:11px;color:var(--ink);font-weight:600;overflow-wrap:anywhere}
.temporary-message-heading time{font-size:9px;color:var(--muted);white-space:nowrap}
.temporary-message details{margin-top:9px;border-top:1px solid var(--line);padding-top:8px}
.temporary-message summary{cursor:pointer;color:var(--accent);font-size:10px;font-weight:600}
.temporary-message-body{white-space:pre-wrap;overflow-wrap:anywhere;color:var(--ink);font-size:10px;line-height:1.65}
.temporary-risk{margin:9px 0 0;padding:7px 8px;border-radius:6px;font-size:9px;line-height:1.5}
.temporary-risk.high{background:#fff0ef;color:#a83d46}.temporary-risk.medium{background:#fff5e6;color:#996c26}
.dark .temporary-risk.high{background:#492c30;color:#f4b4b3}.dark .temporary-risk.medium{background:#47392b;color:#efca8b}
@media(max-width:760px){.temp-mail-grid{grid-template-columns:1fr}.temp-mail-grid .security-panel{padding:16px}}
@media(max-width:520px){#temporary-address{font-size:13px}.temporary-actions{gap:5px}.temporary-actions .danger-button{margin-left:0}}
.skip-link{position:fixed;z-index:20;top:8px;left:8px;transform:translateY(-160%);padding:10px 14px;border-radius:7px;background:#29283a;color:#fff;font-size:13px}.skip-link:focus{transform:translateY(0)}
.legal-consent{display:flex;align-items:flex-start;gap:8px;margin:9px 0;color:#565466;font-size:11px;line-height:1.55;text-align:left}.legal-consent input{flex:none;margin:2px 0 0;accent-color:var(--accent)}.legal-consent label{cursor:pointer}.inline-policy-link{padding:0;border:0;background:transparent;color:#5145aa;text-decoration:underline;text-underline-offset:2px;font-size:inherit;font-weight:650}
.signup-trap{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important}
.legal-footer{display:flex;flex-wrap:wrap;gap:10px}.legal-footer button{padding:3px 0;border:0;background:transparent;color:#514f61;text-decoration:underline;text-underline-offset:2px;font-size:12px}.business-disclosure{flex-basis:100%;color:#575566;font-size:11px;line-height:1.5}
.dark .legal-consent{color:#d0ceda}.dark .inline-policy-link,.dark .legal-footer button{color:#c3baff}.dark .business-disclosure{color:#c4c1ce}
#legal-dialog{width:min(720px,calc(100vw - 28px));max-height:min(82vh,760px);padding:0;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink);box-shadow:0 24px 80px #14122245}#legal-dialog::backdrop{background:#17152699;backdrop-filter:blur(3px)}.legal-dialog-content{position:relative;padding:28px 32px;overflow:auto;max-height:min(82vh,760px)}.legal-dialog-content h2{margin:0 40px 14px 0;font-size:22px}.legal-dialog-content h3{margin:21px 0 7px;font-size:15px}.legal-dialog-content p,.legal-dialog-content li{color:#555365;font-size:13px;line-height:1.7}.legal-draft-notice{padding:10px 12px;border-left:3px solid #a66b1c;background:#fff7e8;color:#694913!important}.legal-close{position:absolute;top:18px;right:18px;width:34px;height:34px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:20px}.dark #legal-dialog{background:#242330;color:#efedf6}.dark .legal-dialog-content p,.dark .legal-dialog-content li{color:#d1cfdb}.dark .legal-draft-notice{background:#40372b;color:#f0d8aa!important}
:root{--muted:#696778}.dark{--muted:#bdbac9}
small,.eyebrow,.subhead{font-size:max(11px,1em)}
:focus-visible{outline:3px solid #5749c2;outline-offset:3px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media(max-width:650px){.legal-dialog-content{padding:22px 18px}}

/* Vento visual system: readable type, comfortable controls, and consistent surfaces. */
:root {
  font-size:16px;
  --accent:#6554c8;
  --accent-soft:#efecff;
  --ink:#29243d;
  --muted:#6b657c;
  --line:#e6e2ee;
  --surface:#fff;
  --surface-2:#f7f6fb;
  --shadow:0 8px 32px #30204c06;
}
:root:has(body.large-text) { font-size:18px; }
body,body.large-text { font-size:1rem; line-height:1.5; background:var(--surface-2); letter-spacing:-.015em; }
button,input,textarea,select { font-family:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button,a { transition:background .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease; }
button:disabled { transform:none; }
::selection { background:#ddd5ff; color:#30235b; }
:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
[id$="-settings"],#features { scroll-margin-top:150px; }
main,.public-page main { width:100%; max-width:1480px; margin:0 auto; padding:28px clamp(20px,3.5vw,56px) 64px; }
.public-page main { max-width:1420px; }
.topbar { min-height:84px; height:auto; padding:16px clamp(20px,3.5vw,56px); gap:24px; border-bottom:1px solid var(--line); background:#ffffffed; box-shadow:none; }
.brand { font-size:21px; gap:12px; flex-shrink:0; }
.brand-mark { width:42px; height:42px; border-radius:14px; font-size:28px; background:linear-gradient(145deg,#8d7ae9,#6050c1); box-shadow:0 5px 12px #6554c825; }
.brand small { font-size:9px; letter-spacing:1.7px; margin-top:0; }
.js-enabled .mode-switch { display:none; }
.topnav { gap:19px; height:48px; align-items:center; margin:0; min-width:0; }
.tab { height:44px; font-size:.875rem; white-space:nowrap; }
.tab.active:after { bottom:0; }
.tab b { font-size:.6875rem; margin-left:5px; }
.top-actions { gap:10px; margin-left:auto; flex-shrink:0; }
.icon-button,.avatar { width:40px; height:40px; border-radius:12px; font-size:20px; }
.icon-button:hover { background:var(--accent-soft); }
.get-started-top { height:44px; padding:0 18px; border-radius:12px; font-size:.875rem; gap:12px; box-shadow:0 4px 10px #6554c818; }
.hero-cta,.primary,.compose { min-height:46px; height:auto; padding:12px 20px; border-radius:12px; font-size:.875rem; line-height:1.4; background:var(--accent); color:#fff; box-shadow:0 5px 14px #6554c822; }
.hero-cta { min-height:52px; padding:14px 23px; gap:25px; font-size:.9375rem; }
.hero-cta span { font-size:21px; }
.hero-cta:hover,.primary:hover,.compose:hover { background:#5946ba; box-shadow:0 8px 20px #6554c830; }
.soft-button,.danger-button,.message-actions button { min-height:40px; height:auto; padding:9px 13px; border-radius:10px; font-size:.8125rem; line-height:1.4; }
.security-note,.public-page .security-note { height:auto; min-height:44px; padding:11px 15px; gap:10px; align-items:flex-start; border-radius:12px; font-size:.75rem; line-height:1.6; background:var(--accent-soft); border-color:var(--line); color:var(--muted); margin-bottom:22px; }
.security-note>span:first-child { flex:0 0 22px; width:22px; height:22px; }
.security-note strong { color:var(--ink); }
.security-note button { min-width:28px; min-height:28px; flex-shrink:0; }
.eyebrow { font-size:.6875rem; font-weight:700; letter-spacing:1.7px; color:var(--accent); }
.subhead { font-size:.9375rem; line-height:1.65; color:var(--muted); }
.welcome h1,.view-heading h1,.dashboard-heading h1,.settings-heading h1 { font-size:clamp(1.875rem,3vw,2.5rem); line-height:1.18; letter-spacing:-1.4px; color:var(--ink); font-weight:650; }
.utility-view,.dashboard-view,.settings-view { padding-top:24px; }
.view-heading { margin-bottom:32px; }
.status-chip,.account-chip { font-size:.75rem; padding:7px 11px; border-radius:30px; }
.feature-link { font-size:.8125rem; gap:10px; }
.feature-link:hover,.hero-secondary:hover { text-decoration:underline; text-underline-offset:5px; }

/* Home: a generous editorial hero and a clearly illustrative mailbox preview. */
.home-hero { min-height:570px; grid-template-columns:1.08fr 1fr; gap:32px; padding:66px 52px; border-radius:28px; border-color:#e6e0f4; background:radial-gradient(ellipse at 90% 12%,#ded5fa 0,transparent 56%),radial-gradient(ellipse at 65% 95%,#efdcf0 0,transparent 45%),linear-gradient(120deg,#fff 10%,#f7f3ff 100%); box-shadow:0 16px 60px #47356508; }
.hero-copy { max-width:590px; }
.hero-kicker { font-size:.6875rem; letter-spacing:1.6px; gap:10px; }
.hero-kicker span { width:28px; height:28px; font-size:16px; }
.hero-copy h1 { font-size:clamp(2.75rem,4.4vw,3.625rem); line-height:1.1; letter-spacing:-2.6px; margin:24px 0; font-weight:650; color:var(--ink); }
.hero-copy h1 em { color:#7562c7; }
.hero-copy>p { max-width:440px; font-size:1rem; line-height:1.8; color:var(--muted); }
.hero-actions { margin-top:30px; gap:25px; flex-wrap:wrap; }
.hero-secondary { font-size:.875rem; color:var(--ink); padding:12px 0; }
.hero-proof { gap:11px; margin-top:30px; color:var(--ink); }
.proof-icon { width:36px; height:36px; border-radius:12px; font-size:18px; flex-shrink:0; }
.hero-proof>span:nth-of-type(2) { font-size:.75rem; gap:2px; }
.hero-proof small { font-size:.6875rem; color:var(--muted); }
.hero-art { min-width:0; width:100%; height:420px; margin:0; }
.hero-glow { width:100%; height:100%; background:radial-gradient(circle,#bca7ee44,transparent 70%); }
.orbit { width:108%; height:88%; border-color:#c5b9e755; }
.orbit-two { width:105%; height:95%; border-color:#c5b9e744; }
.inbox-showcase { position:relative; width:100%; max-width:460px; z-index:1; border-radius:18px; border:1px solid #fff; background:var(--surface); box-shadow:0 28px 65px #50387922,0 2px 5px #50387908; transform:rotate(-3deg); overflow:hidden; }
.showcase-top { display:flex; align-items:center; gap:14px; padding:16px 20px; border-bottom:1px solid var(--line); background:var(--surface-2); }
.showcase-brand { color:var(--accent); font-family:Georgia,serif; font-size:25px; font-style:italic; display:flex; align-items:center; gap:8px; }
.showcase-brand b { font:650 13px/1.3 ui-sans-serif,system-ui,sans-serif; color:var(--ink); letter-spacing:-.4px; }
.showcase-brand b span { font-weight:400; color:var(--muted); }
.showcase-label { margin-left:auto; font-size:8px; font-weight:650; letter-spacing:1px; color:var(--muted); }
.showcase-menu { color:var(--muted); font-size:20px; letter-spacing:2px; }
.showcase-body { padding:23px 22px 15px; }
.showcase-heading { display:flex; align-items:center; gap:10px; justify-content:space-between; }
.showcase-heading small { font-size:8px; color:var(--muted); letter-spacing:1.2px; }
.showcase-heading h2 { margin:5px 0 17px; font-size:18px; letter-spacing:-.7px; color:var(--ink); font-weight:650; }
.showcase-compose { display:grid; place-items:center; width:34px; height:34px; flex-shrink:0; border-radius:11px; background:var(--accent); color:#fff; font-size:18px; }
.showcase-search { display:flex; gap:9px; align-items:center; padding:9px 12px; margin-bottom:6px; background:var(--surface-2); color:var(--muted); border-radius:8px; font-size:18px; }
.showcase-search span { font-size:10px; }
.showcase-mail { display:flex; align-items:center; gap:11px; padding:16px 0; border-bottom:1px solid var(--line); }
.showcase-avatar { display:grid; place-items:center; flex:0 0 33px; height:33px; border-radius:11px; background:var(--accent-soft); color:var(--accent); font-size:12px; font-weight:650; }
.showcase-avatar.mint { background:#e7f2ee; color:#43816e; }
.showcase-avatar.peach { background:#faf0e7; color:#b18659; }
.showcase-mail strong { font-size:12px; color:var(--ink); font-weight:650; }
.showcase-mail p { font-size:10px; margin:3px 0 0; color:var(--muted); }
.showcase-star { font-size:18px; margin-left:auto; color:#aba1be; }
.showcase-unread { height:6px; width:6px; border-radius:50%; margin-left:auto; background:var(--accent); }
.showcase-bottom { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px; font-size:9px; color:var(--muted); }
.showcase-bottom>span:first-child { color:#4c826f; }
.float-card-one { top:auto; bottom:-10px; right:-9px; padding:14px 18px; border-radius:15px; gap:12px; box-shadow:0 12px 35px #4a34661a; }
.float-card strong { font-size:.8125rem; color:var(--ink); }
.float-card small { font-size:.6875rem; color:var(--muted); }
.float-card>span { width:34px; height:34px; border-radius:11px; background:#e8f3ef; color:#3e8468; font-size:16px; }
.dot-a { top:4px; left:20%; }.dot-b { right:-8px; bottom:24%; }
.home-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; padding:32px 12px; margin:0 20px; border-color:var(--line); }
.home-stats>i { display:none; }
.home-stats div { gap:6px; }
.home-stats strong { font-size:.875rem; color:var(--ink); }
.home-stats span { font-size:.75rem; color:var(--muted); }
.features-section { padding:78px 0 66px; }
.section-intro { margin-bottom:36px; }
.section-intro h2 { font-size:clamp(1.875rem,3vw,2.5rem); line-height:1.18; letter-spacing:-1.4px; color:var(--ink); }
.section-intro h2 span { color:var(--muted); }
.section-intro>p:last-child { font-size:.9375rem; color:var(--muted); margin-top:16px; }
.feature-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.feature-card { display:flex; flex-direction:column; min-height:310px; padding:30px; border-radius:20px; border-color:var(--line); box-shadow:var(--shadow); background:var(--surface); }
.feature-card .eyebrow { font-size:.625rem; margin:22px 0 12px; }
.feature-card h3 { font-size:1.375rem; line-height:1.25; letter-spacing:-.6px; color:var(--ink); }
.feature-card>p:not(.eyebrow) { font-size:.875rem; line-height:1.75; color:var(--muted); max-width:350px; margin:12px 0 22px; }
.feature-icon { width:44px; height:44px; border-radius:14px; font-size:21px; }
.feature-card .feature-link { margin-top:auto; }
.feature-large { grid-column:span 2; padding-right:45%; background:linear-gradient(125deg,var(--surface),var(--accent-soft)); }
.feature-large>p:not(.eyebrow) { min-width:210px; }
.mini-inbox { width:42%; right:28px; bottom:48px; padding:18px; border-radius:15px; transform:rotate(3deg); border-color:var(--line); }
.mini-inbox-head { font-size:.75rem; padding-bottom:12px; }
.mini-inbox-head small { font-size:.625rem; }
.mini-mail { gap:10px; padding:13px 0; }
.mini-avatar { width:30px; height:30px; flex-shrink:0; font-size:.6875rem; border-radius:10px; }
.mini-mail b,.mini-mail small { font-size:.6875rem; }
.mini-mail time { font-size:.625rem; }
.home-bottom { padding:44px 46px; gap:30px; border-radius:24px; background:radial-gradient(ellipse at 80% 10%,#8977d588,transparent 65%),#30234e; border-color:#4d396c; }
.home-bottom h2 { font-size:2rem; color:#fff; line-height:1.2; }
.home-bottom .eyebrow { color:#c8b8f3; }
.home-bottom p:not(.eyebrow) { font-size:.9375rem; color:#d4cce1; margin-top:12px; }
.home-bottom .hero-cta { background:#fff; color:#513e85; box-shadow:0 6px 20px #190e2930; flex-shrink:0; }

/* Dashboard: readable numbers and clear, useful destinations. */
.dashboard-heading { align-items:center; gap:24px; margin:4px 0 28px; }
.dashboard-heading .subhead { margin:12px 0 0; }
.dashboard-mail-link { white-space:nowrap; }
.sample-banner { padding:15px 18px; gap:12px; border-radius:14px; font-size:.8125rem; line-height:1.6; margin-bottom:24px; background:var(--accent-soft); border-color:var(--line); color:var(--muted); }
.sample-banner>span:first-child { font-size:20px; }
.sample-banner strong { color:var(--ink); }
.dashboard-panel,.stat-card,.security-panel,.settings-card,.empty-card { border-radius:20px; border-color:var(--line); box-shadow:var(--shadow); background:var(--surface); }
.dashboard-panel { padding:25px 28px; }
.mailbox-plan-panel { margin-bottom:22px; }
.panel-heading { gap:20px; }
.panel-heading h2,.mailbox-plan-panel h2,.snapshot-heading h2 { font-size:1rem; color:var(--ink); }
.panel-heading p,.mailbox-plan-panel .panel-heading p,.storage-caption { font-size:.8125rem; color:var(--muted); }
.storage-track { height:9px; margin:20px 0 12px; background:var(--accent-soft); }
.stats-grid { gap:20px; }
.stat-card { min-height:208px; padding:24px; position:relative; overflow:hidden; }
.stat-card:first-child { background:linear-gradient(135deg,#7460cf,#5743aa); border-color:transparent; box-shadow:0 10px 28px #6554c826; }
.stat-top { font-size:.875rem; color:var(--muted); gap:10px; }
.stat-icon,.quick-icon { width:40px; height:40px; border-radius:13px; font-size:19px; flex:0 0 40px; }
.stat-number { font-size:2.875rem; line-height:1.05; letter-spacing:-2px; margin-top:18px; color:var(--ink); font-variant-numeric:tabular-nums; }
.stat-card>small { font-size:.75rem; color:var(--muted); margin-top:10px; }
.stat-foot,.stat-link { font-size:.75rem; margin-top:18px; color:var(--muted); }
.stat-link { color:var(--accent); }
.stat-card:first-child .stat-top,.stat-card:first-child .stat-number { color:#fff; }
.stat-card:first-child>small,.stat-card:first-child .stat-foot { color:#eee8ff; }
.stat-card:first-child .stat-icon { background:#ffffff22; color:#fff; }
.dashboard-lower { gap:20px; margin-top:22px; grid-template-columns:1.25fr 1fr; }
.activity-empty { min-height:210px; padding:30px; font-size:.875rem; color:var(--muted); border:1px dashed var(--line); background:var(--surface-2); border-radius:14px; margin-top:22px; }
.quick-link { padding:17px 0; gap:14px; border-color:var(--line); }
.quick-link:hover { padding-left:8px; border-radius:10px; }
.quick-link strong { font-size:.875rem; color:var(--ink); }
.quick-link small { font-size:.75rem; color:var(--muted); }
.quick-link>i { font-size:19px; }
.dashboard-security-snapshot { background:linear-gradient(110deg,var(--surface),var(--accent-soft)); }
.snapshot-heading p { font-size:.8125rem; color:var(--muted); }
.snapshot-icon { width:44px; height:44px; flex:0 0 44px; border-radius:14px; font-size:21px; }
.snapshot-stats { gap:30px; margin:22px 0 5px; font-size:.8125rem; color:var(--muted); }
.snapshot-stats strong { font-size:1.625rem; }

/* Inbox and forms share the same comfortable density. */
.welcome { margin:22px 0 28px; gap:24px; }
.search { width:300px; height:46px; border-radius:13px; }
.search input { font-size:.875rem; }
.mail-layout { grid-template-columns:210px minmax(280px,340px) minmax(320px,1fr); border-radius:20px; min-height:640px; border-color:var(--line); box-shadow:var(--shadow); }
.sidebar { padding:22px 14px; }
.compose { width:100%; margin-bottom:26px; gap:12px; }
.side-label { font-size:.625rem; letter-spacing:1.4px; margin:12px 12px; }
.side-link { height:42px; padding:0 12px; gap:12px; font-size:.8125rem; border-radius:10px; }
.side-link em { font-size:.6875rem; }
.sidebar-footer { font-size:.6875rem; padding:20px 10px 0; line-height:1.5; }
.sidebar-footer small { font-size:.625rem; }
.list-heading { padding:22px 20px 16px; gap:10px; }
.list-heading h2 { font-size:1.125rem; }
.count { font-size:.75rem; }
.list-tabs { padding:0 20px; gap:24px; }
.list-tabs button { font-size:.8125rem; padding:14px 0; }
.list-tabs span { font-size:.6875rem; }
.message { padding:20px 18px; min-height:115px; gap:12px; }
.sender-avatar { width:38px; height:38px; flex-basis:38px; font-size:.8125rem; }
.message-meta,.subject { font-size:.8125rem; }
.preview { font-size:.75rem; }
.tags,.label-chip { font-size:.625rem; }
.reading-toolbar { height:58px; padding:0 20px; }
.reading-toolbar .soft-button { min-width:36px; width:36px; min-height:36px; height:36px; padding:0; }
.mail-content { padding:30px; }
.mail-content h2 { font-size:1.625rem; line-height:1.3; margin:24px 0; }
.encryption-pill { font-size:.6875rem; }
.sender-row>span:nth-child(2) { font-size:.8125rem; }
.body-copy { font-size:1rem; line-height:1.8; color:var(--ink); }
.mail-empty { padding:56px 24px; gap:12px; }
.mail-empty .waiting-icon { width:54px; height:54px; border-radius:17px; font-size:24px; }
.mail-empty h3 { font-size:1rem; color:var(--ink); }
.mail-empty p,.mail-empty small,.mailbox-message-placeholder { font-size:.8125rem; line-height:1.65; color:var(--muted); }
.message-security { padding:20px; border-radius:14px; font-size:.875rem; }
.message-security h3 { font-size:1rem; }
.start-view { padding-top:8px; }
.back-home { font-size:.875rem; }
.start-card { width:min(510px,100%); padding:40px 42px; border-radius:24px; border-color:var(--line); box-shadow:0 20px 70px #4833690b; }
.start-mark { width:54px; height:54px; border-radius:18px; font-size:32px; margin-bottom:22px; }
.start-card h1 { font-size:2.125rem; line-height:1.15; color:var(--ink); }
.start-description { font-size:.875rem; color:var(--muted); margin:18px 0 26px; }
.signup-label,.delete-dialog-form label { font-size:.8125rem; color:var(--ink); margin-bottom:9px; }
.password-label { margin-top:20px; }
.mailbox-input,.auth-password,.delete-dialog-form>input { min-height:50px; height:50px; border-radius:11px; padding:0 14px; font-size:1rem; }
.mailbox-input input { font-size:1rem; }
.mailbox-input>span { font-size:.8125rem; }
.input-hint,.key-reminder { font-size:.75rem; line-height:1.7; color:var(--muted); }
.input-hint { margin:12px 0 20px; }
.legal-consent { font-size:.8125rem; margin:14px 0; }
.legal-consent input { width:17px; height:17px; margin-top:3px; }
.start-button { margin-top:20px; }
.login-submit { margin-top:20px; }
.auth-switch,.recovery-file-button { font-size:.8125rem; min-height:40px; padding:10px 0; }
.start-checks { margin:16px 0; padding:16px 0; }
.start-checks>div { padding:8px 0; gap:12px; }
.start-checks strong { font-size:.8125rem; }
.start-checks small { font-size:.75rem; color:var(--muted); line-height:1.55; }
.signup-error,#recovery-file-status { font-size:.8125rem; }
dialog { width:min(620px,calc(100vw - 32px)); border-radius:20px; max-height:90vh; overflow:auto; }
.delete-dialog-form { padding:32px; }
.delete-dialog-form h2 { font-size:1.5rem; }
.delete-dialog-copy { font-size:.9375rem; }
.delete-dialog-actions { flex-wrap:wrap; gap:10px; }
.delete-dialog-actions .soft-button,.delete-dialog-actions .danger-button { height:auto; min-height:42px; font-size:.8125rem; }
.compose-head { padding:20px 24px; align-items:center; }
.compose-head strong { font-size:1rem; }
.compose-head strong span { font-size:.75rem; }
.compose-window>label { font-size:.875rem; padding:14px 24px; gap:12px; flex-wrap:wrap; }
.compose-window input,.compose-window select { font-size:.875rem; min-width:0; min-height:34px; }
.compose-window select { max-width:100%; color:var(--ink); background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:7px; }
.compose-window textarea { font-size:1rem; line-height:1.7; padding:22px 24px; min-height:220px; }
.key-info,.expiration-note { font-size:.75rem; line-height:1.6; margin:10px 24px; color:var(--muted); }
.compose-foot { padding:18px 24px; flex-wrap:wrap; }
.compose-foot small { font-size:.75rem; }
.compose-foot .primary { height:auto; min-height:44px; }

/* Settings, temporary mail, plans and security keep the same type scale. */
.settings-heading { margin:4px 0 32px; gap:20px; }
.settings-heading .subhead { font-size:.9375rem; }
.settings-layout { grid-template-columns:205px minmax(0,880px); gap:32px; }
.settings-nav { padding:10px; border-radius:16px; top:108px; border-color:var(--line); }
.settings-nav a { padding:13px 14px; font-size:.875rem; border-radius:10px; }
.settings-content { gap:30px; }
.settings-group-title h2 { font-size:1.125rem; color:var(--ink); }
.settings-group-title p { font-size:.8125rem; color:var(--muted); margin-top:6px; }
.settings-card { padding:4px 24px; }
.settings-card .soft-button { border:1px solid var(--line); background:var(--surface-2); color:var(--ink); }
.settings-card .soft-button:hover { border-color:var(--accent); background:var(--accent-soft); }
.setting-row { padding:22px 0; gap:15px; }
.setting-row strong,.large-text .setting-row strong { font-size:.9375rem; color:var(--ink); }
.setting-row small,.large-text .setting-row small { font-size:.8125rem; line-height:1.65; color:var(--muted); }
.setting-icon { width:38px; height:38px; flex-basis:38px; border-radius:12px; font-size:18px; }
.setting-row>span:nth-child(2) { min-width:0; }
.setting-row>button { flex-shrink:0; }
.setting-choice { min-height:36px; font-size:.75rem; padding:8px 10px; }
.setting-toggle { font-size:.75rem; min-height:40px; gap:9px; }
.setting-toggle>span { width:38px; height:22px; }
.setting-toggle>span:after { width:18px; height:18px; }
.setting-toggle.enabled>span:after { transform:translateX(16px); }
.settings-card .status-chip { font-size:.6875rem; }
.settings-footnote { font-size:.8125rem; padding:18px 0; color:var(--muted); }
.account-settings-card { padding:24px; gap:15px; }
.account-settings-avatar { width:48px; height:48px; flex-basis:48px; border-radius:15px; font-size:18px; }
.account-settings-info strong { font-size:.9375rem; }
.account-settings-info small { font-size:.75rem; }
.large-text .settings-nav a { font-size:.875rem; }
.security-dashboard-grid,.temp-mail-grid { max-width:1200px; gap:22px; }
.security-panel,.temp-mail-grid .security-panel { padding:26px; }
.security-panel h2,.aliases-panel h2 { font-size:1.0625rem; }
.security-panel p,.security-panel small,.aliases-panel>p,.plan-disclosure { font-size:.8125rem; line-height:1.75; color:var(--muted); }
.consent-row,.security-toggle-row,.breach-account-label,.plan-feature,.security-metrics { font-size:.8125rem; }
.consent-row,.security-toggle-row { gap:10px; margin:16px 0; }
.privacy-score strong { font-size:3.5rem; }
.privacy-score span { font-size:.9375rem; }
.security-list p { padding:12px 14px; border-radius:10px; }
.security-metrics { flex-wrap:wrap; gap:24px; }
.security-metrics strong { font-size:1.75rem; }
.subscription-cards { gap:20px; }
.subscription-card { padding:25px; border-radius:16px; }
.subscription-card h3 { font-size:2.375rem; }
.subscription-card h3 small { font-size:.875rem; }
.subscription-card ul { font-size:.8125rem; color:var(--muted); line-height:2; }
.subscription-card>small { font-size:.75rem; }
.alias-create-form { gap:12px; margin:24px 0; }
.alias-create-form label,.alias-create-form>span { font-size:.8125rem; }
.alias-create-form input { height:46px; font-size:.9375rem; border-radius:11px; }
.alias-row { padding:20px; border-radius:13px; }
.alias-details strong { font-size:.9375rem; }
.alias-details code { font-size:.8125rem; }
.temporary-address-panel #temporary-empty>p,.temporary-address-panel .temporary-privacy p,.temporary-message-list>p,.temporary-message-body { font-size:.875rem; }
.temporary-timer,.temporary-message-heading strong,.temporary-message summary,#temporary-status-message,.temporary-risk { font-size:.8125rem; }
.temporary-message-heading span { font-size:.9375rem; }
.temporary-message-heading time { font-size:.75rem; }
.temporary-message { padding:18px; border-radius:13px; }
.temporary-actions .danger-button { min-height:40px; height:auto; }
.temporary-progress { height:7px; }
.empty-card { padding:60px 28px; }
.empty-card h2 { font-size:1.375rem; }
.empty-card p { font-size:.9375rem; color:var(--muted); }
.empty-card>.coming-soon-chip { font-size:.75rem; }
footer { max-width:1480px; padding:24px clamp(20px,3.5vw,56px) 32px; border-top:1px solid var(--line); flex-wrap:wrap; gap:18px; font-size:.8125rem; line-height:1.6; color:var(--muted); }
.legal-footer { gap:20px; }
.legal-footer button { min-height:32px; font-size:.8125rem; }
.business-disclosure { font-size:.75rem; color:var(--muted); }

/* Dark appearance uses the same hierarchy, with quieter surfaces. */
:root.dark { --accent:#b3a2ff; --accent-soft:#322948; --ink:#efecf6; --muted:#b9b1c9; --line:#393245; --surface:#231e2f; --surface-2:#1a1623; --shadow:0 8px 32px #00000010; }
.dark .topbar { background:#231e2fee; }
.dark .home-hero { background:radial-gradient(ellipse at 90% 10%,#4e3b7155,transparent 60%),linear-gradient(120deg,#231e2f,#2e243e); border-color:var(--line); }
.dark .hero-copy h1 em { color:#baa8f5; }
.dark .hero-cta,.dark .primary,.dark .compose { color:#221934; }
.dark .hero-cta:hover,.dark .primary:hover,.dark .compose:hover { background:#c4b6ff; }
.dark .home-bottom,.dark .home-bottom:hover { background:radial-gradient(ellipse at 80% 10%,#8977d566,transparent 65%),#30234e; border-color:#4d396c; }
.dark .home-bottom h2 { color:#fff; }
.dark .home-bottom .hero-cta { background:#fff; color:#513e85; }
.dark .feature-large { background:linear-gradient(120deg,var(--surface),var(--accent-soft)); }
.dark .inbox-showcase { border-color:#514361; box-shadow:0 24px 60px #0003; }
.dark .float-card,.dark .mini-inbox { background:var(--surface); border-color:var(--line); }
.dark .feature-card,.dark .stat-card,.dark .dashboard-panel,.dark .settings-card,.dark .settings-nav,.dark .start-card,.dark .empty-card { background:var(--surface); border-color:var(--line); }
.dark .stat-card:first-child { background:linear-gradient(135deg,#7460cf,#5743aa); }
.dark .dashboard-security-snapshot { background:linear-gradient(110deg,var(--surface),var(--accent-soft)); }
.dark .message-list,.dark .secure-message,.dark .reading-pane { background:var(--surface); }
.dark .showcase-bottom>span:first-child { color:#90c9b1; }
.dark .mail-empty h3,.dark .panel-heading h2,.dark .setting-row strong { color:var(--ink); }
.dark .feature-link,.dark .status-chip { color:#c9bbff; }
.dark .tab:not(.active) { color:var(--muted); }
.dark .tab:not(.active):hover { color:var(--ink); }
.dark .status-chip.warning { color:#edc78f; }
.dark .hero-copy>p,.dark .home-stats span,.dark .feature-card>p:not(.eyebrow),.dark .mail-empty p,.dark .mail-empty small,.dark .setting-row small { color:var(--muted); }
.dark :focus-visible { outline-color:#c4b6ff; }

/* Keep navigation and every mailbox folder reachable on smaller screens. */
@media(max-width:1300px) {
  .topbar { flex-wrap:wrap; gap:10px 22px; }
  .topnav { order:3; width:100%; flex:none; overflow:auto; height:42px; gap:24px; }
  .top-actions { order:1; }
  .brand { flex:1; }
  .home-hero { padding:48px 36px; gap:24px; }
  .hero-copy h1 { font-size:3rem; }
  .mail-layout { grid-template-columns:190px minmax(260px,310px) minmax(270px,1fr); }
  .mail-content { padding:24px; }
  .stat-card { padding:22px; }
  .settings-nav { top:155px; }
}
@media(max-width:1000px) {
  .home-hero { grid-template-columns:1fr 1fr; padding:42px 28px; }
  .hero-copy h1 { font-size:2.625rem; letter-spacing:-1.8px; }
  .hero-art { height:385px; }
  .showcase-body { padding:18px 16px 14px; }
  .showcase-heading h2 { font-size:16px; }
  .showcase-heading small { font-size:7px; }
  .showcase-mail p { font-size:9px; }
  .showcase-label { display:none; }
  .showcase-menu { margin-left:auto; }
  .float-card-one { padding:12px 14px; right:-8px; bottom:-12px; }
  .feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .feature-large { grid-column:span 2; padding-right:50%; }
  .stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mail-layout { grid-template-columns:190px minmax(0,1fr); }
  .reading-pane { grid-column:1/-1; border-top:1px solid var(--line); }
  .message-list { border-right:0; }
  .sidebar { grid-row:1; }
  .settings-layout { grid-template-columns:175px minmax(0,1fr); gap:22px; }
  .setting-row { flex-wrap:wrap; }
  .setting-row>span:nth-child(2) { min-width:60%; }
  .setting-row>button,.setting-row>.setting-segment { margin-left:53px; }
}
@media(max-width:760px) {
  main,.public-page main { padding:22px 20px 44px; }
  .topbar { padding:12px 20px; min-height:76px; }
  .home-hero { grid-template-columns:1fr; gap:22px; padding:40px 30px 36px; min-height:0; }
  .hero-copy { max-width:540px; }
  .hero-copy h1 { font-size:clamp(2.5rem,6.5vw,3.25rem); }
  .hero-copy>p { max-width:480px; }
  .hero-art { max-width:440px; height:420px; margin:12px auto 0; }
  .showcase-heading h2 { font-size:18px; }.showcase-heading small { font-size:8px; }
  .showcase-mail p { font-size:10px; }
  .home-stats { gap:16px; margin:0; padding:28px 0; }
  .home-stats strong { font-size:.8125rem; }
  .home-stats span { font-size:.6875rem; }
  .home-bottom { padding:32px; }
  .dashboard-lower,.security-dashboard-grid,.temp-mail-grid { grid-template-columns:1fr; }
  .dashboard-heading { align-items:flex-start; }
  .dashboard-mail-link { min-height:44px; padding:12px 16px; font-size:.8125rem; gap:12px; }
  .settings-layout { grid-template-columns:1fr; }
  .settings-nav { position:static; display:flex; overflow:auto; white-space:nowrap; padding:6px; }
  .settings-nav a { padding:12px; }
  .settings-heading .subhead { max-width:420px; }
  .public-page .top-actions #theme { display:inline-flex; align-items:center; justify-content:center; }
  .public-page .top-actions .avatar { display:none; }
  .alias-create-form { flex-direction:column; align-items:stretch; }
  .alias-row { flex-direction:column; align-items:flex-start; }
  .alias-actions { justify-content:flex-start; }
  .subscription-cards { grid-template-columns:1fr; }
}
@media(max-width:560px) {
  main,.public-page main { padding:18px 16px 36px; }
  .topbar { padding:12px 16px; gap:8px; }
  .brand { gap:8px; font-size:18px; }
  .brand-mark { width:36px; height:36px; font-size:24px; border-radius:12px; }
  .brand small { font-size:7px; letter-spacing:1.2px; }
  .top-actions { gap:5px; }
  .get-started-top { font-size:.75rem; padding:0 12px; height:40px; gap:8px; }
  .icon-button,.avatar { width:34px; height:40px; font-size:18px; }
  .topnav { gap:22px; }
  .tab { font-size:.8125rem; }
  .account-session .get-started-top { min-width:0; }
  .security-note,.public-page .security-note { font-size:.6875rem; padding:12px; margin-bottom:18px; }
  .home-hero { padding:32px 24px 30px; border-radius:22px; }
  .hero-copy h1 { font-size:2.5rem; letter-spacing:-1.8px; margin:22px 0; }
  .hero-copy>p { font-size:.9375rem; line-height:1.75; }
  .hero-kicker { font-size:.625rem; letter-spacing:1.2px; }
  .hero-actions { gap:20px; margin-top:26px; }
  .hero-cta { padding:13px 18px; gap:18px; min-height:48px; }
  .hero-secondary { font-size:.8125rem; }
  .hero-proof>span:nth-of-type(2) { font-size:.75rem; }
  .hero-proof small { font-size:.625rem; }
  .hero-art { height:375px; margin-top:10px; }
  .inbox-showcase { transform:rotate(-2deg); border-radius:14px; }
  .showcase-top { padding:13px 15px; }
  .showcase-body { padding:16px 14px 13px; }
  .showcase-heading h2 { font-size:15px; }
  .showcase-heading small { font-size:7px; letter-spacing:.6px; }
  .showcase-compose { width:29px; height:29px; font-size:16px; }
  .showcase-mail { padding:13px 0; gap:9px; }
  .showcase-mail strong { font-size:11px; }
  .showcase-mail p,.showcase-search span { font-size:9px; }
  .showcase-avatar { flex-basis:29px; height:29px; }
  .showcase-bottom { font-size:8px; gap:7px; }
  .float-card-one { bottom:-3px; right:-7px; gap:9px; padding:11px 13px; }
  .float-card strong { font-size:.6875rem; }
  .float-card small { font-size:.625rem; }
  .home-stats { grid-template-columns:1fr; gap:0; padding:12px 0; }
  .home-stats div { text-align:left; padding:16px 6px; border-bottom:1px solid var(--line); gap:3px; }
  .home-stats div:last-child { border-bottom:0; }
  .home-stats strong { font-size:.875rem; }
  .home-stats span { font-size:.75rem; max-width:none; }
  .features-section { padding:48px 0; }
  .section-intro { text-align:left; margin-bottom:26px; }
  .section-intro h2 { font-size:1.875rem; }
  .section-intro>p:last-child { font-size:.875rem; }
  .feature-grid { grid-template-columns:1fr; gap:16px; }
  .feature-card,.feature-large { grid-column:auto; padding:26px; min-height:0; }
  .feature-large>p:not(.eyebrow) { min-width:0; }
  .mini-inbox { position:relative; width:100%; right:auto; bottom:auto; margin:8px 0 0; transform:none; }
  .mini-mail b,.mini-mail small { font-size:.75rem; }
  .home-bottom { flex-direction:column; align-items:flex-start; padding:30px; gap:22px; }
  .home-bottom h2 { font-size:1.875rem; }
  .home-bottom p:not(.eyebrow) { max-width:none; }
  .home-bottom .hero-cta { min-height:46px; padding:12px 18px; font-size:.875rem; }
  .dashboard-heading { flex-wrap:wrap; gap:18px; margin-top:0; }
  .dashboard-heading h1,.settings-heading h1,.view-heading h1,.welcome h1 { font-size:1.875rem; }
  .dashboard-heading .subhead { max-width:none; }
  .sample-banner { padding:14px; align-items:flex-start; font-size:.75rem; }
  .stats-grid { gap:12px; }
  .stat-card { padding:18px; min-height:195px; border-radius:16px; }
  .stat-top { font-size:.75rem; align-items:flex-start; gap:5px; }
  .stat-icon { width:29px; height:29px; flex-basis:29px; font-size:16px; border-radius:9px; }
  .stat-number { font-size:2.5rem; }
  .stat-card>small,.stat-foot,.stat-link { font-size:.6875rem; }
  .dashboard-panel,.security-panel,.temp-mail-grid .security-panel { padding:22px; border-radius:16px; }
  .panel-heading,.mailbox-plan-panel .panel-heading { flex-wrap:wrap; gap:12px; }
  .panel-heading .feature-link { margin-top:0; }
  .snapshot-heading { flex-wrap:wrap; gap:16px; }
  .snapshot-heading .status-chip { margin-left:55px; }
  .snapshot-stats { flex-wrap:wrap; gap:14px; }
  .snapshot-stats strong { font-size:1.375rem; }
  .welcome { display:block; }
  .search { margin-top:20px; width:100%; }
  .mail-layout { display:flex; flex-direction:column; }
  .sidebar { display:flex; flex-wrap:wrap; gap:6px; padding:16px; border-right:0; border-bottom:1px solid var(--line); }
  .compose { flex-basis:100%; margin-bottom:10px; }
  .side-label,.sidebar-footer,.sidebar .unavailable-link { display:none; }
  .side-link { padding:0 10px; height:38px; font-size:.75rem; gap:6px; }
  .reading-toolbar { padding:0 14px; }
  .mail-content { padding:24px 20px; }
  .message-actions { gap:8px; }
  .start-card { margin-top:24px; padding:30px 24px; }
  .start-card h1 { font-size:1.875rem; }
  .mailbox-input>span { font-size:.75rem; }
  .settings-heading { flex-wrap:wrap; gap:14px; }
  .settings-heading .subhead { font-size:.875rem; }
  .settings-card { padding:4px 18px; }
  .account-settings-card { padding:20px 18px; flex-wrap:wrap; }
  .account-settings-info { flex:1 1 calc(100% - 70px); }
  .account-settings-card .status-chip { margin-left:63px; }
  .setting-row { padding:20px 0; display:grid; grid-template-columns:38px minmax(0,1fr); gap:10px 15px; }
  .setting-row>.setting-icon { grid-column:1; grid-row:1; }
  .setting-row>span:nth-child(2) { grid-column:2; min-width:0; }
  .setting-row>button,.setting-row>.setting-segment,.setting-row>.status-chip { grid-column:2; margin-left:0; justify-self:start; }
  .setting-row small { max-width:none; }
  .setting-segment { flex-direction:row; flex-wrap:wrap; }
  .settings-card .status-chip { white-space:normal; }
  .delete-dialog-form { padding:26px 22px; }
  .delete-dialog-actions { justify-content:flex-start; }
  .temporary-message-heading { flex-wrap:wrap; }
  .cleanup-controls { flex-wrap:wrap; }
  .cleanup-controls select { min-height:42px; flex-basis:100%; }
  footer { padding:22px 20px; gap:15px; }
  .legal-footer { gap:16px; }
  .account-session .top-actions .panic { display:none; }
}
@media(max-width:360px) {
  .public-page .top-actions #theme { display:none; }
  .hero-copy h1 { font-size:2.125rem; }
  .home-hero { padding:28px 18px; }
  .hero-actions { gap:8px 16px; }
  .hero-art { height:365px; }
  .showcase-bottom { flex-wrap:wrap; }
  .stat-card { padding:14px; }
  .stat-top { flex-direction:column-reverse; gap:10px; }
}

/* Monochrome interface. Colour is reserved for warnings and destructive actions. */
:root {
  --accent:#171717;
  --accent-soft:#f0f0f0;
  --ink:#202020;
  --muted:#696969;
  --line:#e4e4e4;
  --surface:#fff;
  --surface-2:#f7f7f7;
  --shadow:0 2px 8px #00000003;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
:root.dark {
  --accent:#ececec;
  --accent-soft:#292929;
  --ink:#ededed;
  --muted:#ababab;
  --line:#343434;
  --surface:#1e1e1e;
  --surface-2:#151515;
  --shadow:none;
}
::selection { background:#d9d9d9; color:#151515; }
.dark ::selection { background:#505050; color:#fff; }
.skip-link { background:#171717; color:#fff; }
.showcase-star,.security-note button { color:var(--muted); }
.ui-icon { display:block; width:20px; height:20px; flex-shrink:0; }
.stat-icon .ui-icon,.quick-icon .ui-icon { width:17px; height:17px; }
.security-note .ui-icon,.sample-banner .ui-icon { width:16px; height:16px; }
.topbar,.dark .topbar { min-height:76px; background:var(--surface); backdrop-filter:none; box-shadow:none; border-color:var(--line); }
.brand-mark,.start-mark,.account-settings-avatar { background:#171717; color:#fff; box-shadow:none; border-radius:10px; }
.brand-light,.brand small,.dark .brand-light { color:var(--muted); }
.brand { letter-spacing:-.8px; }
.topnav { gap:22px; }
.tab,.dark .tab:not(.active) { color:var(--muted); }
.tab.active,.tab:not(.active):hover,.dark .tab:not(.active):hover { color:var(--ink); }
.tab b,.count { background:var(--accent-soft); color:var(--ink); }
.get-started-top,.hero-cta,.primary,.compose,.dark .get-started-top,.dark .hero-cta,.dark .primary,.dark .compose {
  background:var(--accent); color:var(--surface); box-shadow:none; border-radius:7px; font-weight:600;
}
.get-started-top:hover,.hero-cta:hover,.primary:hover,.compose:hover,.dark .hero-cta:hover,.dark .primary:hover,.dark .compose:hover {
  background:var(--ink); color:var(--surface); box-shadow:none; transform:none; filter:none; opacity:.9;
}
.hero-cta { min-height:46px; font-size:.875rem; padding:12px 20px; gap:22px; }
.get-started-top { height:40px; }
.icon-button,.avatar { border-radius:8px; }
.icon-button,.dark .icon-button { color:var(--muted); }
.icon-button:hover,.dark .icon-button:hover { color:var(--ink); background:var(--accent-soft); }
.account-session .avatar,.dark.account-session .avatar { background:var(--accent-soft); color:var(--ink); }
.eyebrow,.hero-kicker,.feature-card .eyebrow,.home-bottom .eyebrow { color:var(--muted); letter-spacing:1.2px; }
.security-note,.public-page .security-note,.sample-banner,.dark .security-note,.dark .sample-banner {
  background:var(--surface); color:var(--muted); border:1px solid var(--line); border-radius:8px;
}
.security-note strong,.sample-banner strong,.dark .security-note strong,.dark .sample-banner strong { color:var(--ink); }
.security-note>span:first-child,.sample-banner>span:first-child { background:transparent; color:var(--muted); }
.home-hero,.dark .home-hero {
  background:none; border:0; border-bottom:1px solid var(--line); border-radius:0; box-shadow:none;
  padding:54px 0 64px; gap:70px; min-height:500px; grid-template-columns:1.05fr 1fr;
}
.hero-copy h1 { font-size:clamp(2.75rem,4.8vw,4rem); line-height:1.07; letter-spacing:-2.5px; font-weight:650; }
.hero-copy h1 em,.dark .hero-copy h1 em { color:var(--ink); }
.hero-copy>p,.dark .hero-copy>p { font-size:1rem; line-height:1.75; max-width:400px; color:var(--muted); }
.hero-secondary,.dark .hero-secondary,.hero-secondary span { color:var(--ink); }
.hero-proof { margin-top:26px; }
.hero-proof strong { font-weight:500; }
.proof-icon,.dark .proof-icon { border-radius:7px; background:var(--accent-soft); color:var(--ink); }
.hero-art { height:auto; min-height:350px; }
.inbox-showcase,.dark .inbox-showcase { width:100%; max-width:480px; border:1px solid var(--line); border-radius:12px; box-shadow:0 8px 25px #00000005; transform:none; }
.showcase-top { background:var(--surface); padding:15px 20px; }
.showcase-brand { color:var(--ink); }
.showcase-heading h2 { font-size:22px; margin:6px 0 18px; }
.showcase-compose { background:var(--accent); color:var(--surface); border-radius:7px; }
.showcase-search { border:1px solid var(--line); border-radius:6px; background:var(--surface-2); }
.showcase-avatar,.showcase-avatar.mint,.showcase-avatar.peach { background:var(--accent-soft); color:var(--ink); border-radius:8px; }
.showcase-bottom>span:first-child,.dark .showcase-bottom>span:first-child { color:var(--muted); }
.home-stats { margin:0; padding:26px 0; }
.features-section { padding:56px 0; }
.section-intro { text-align:left; }
.section-intro h2 { font-size:2rem; }
.feature-card,.feature-large,.dark .feature-card,.dark .feature-large { background:var(--surface); border-color:var(--line); border-radius:12px; box-shadow:none; min-height:280px; }
.feature-card:hover { transform:none; box-shadow:none; border-color:#bdbdbd; }
.feature-icon,.purple-icon,.blue-icon,.green-icon,.amber-icon,.dark .blue-icon {
  background:var(--accent-soft); color:var(--ink); border-radius:9px;
}
.feature-card h3 { font-size:1.25rem; }
.mini-inbox,.dark .mini-inbox { transform:none; box-shadow:none; border-color:var(--line); border-radius:9px; background:var(--surface); }
.mini-avatar,.mini-avatar.avatar-blue { background:var(--accent-soft); color:var(--muted); border-radius:7px; }
.mini-inbox-head,.dark .mini-inbox-head { color:var(--ink); border-color:var(--line); }
.mini-inbox-head small,.mini-mail small,.mini-mail time { color:var(--muted); }
.mini-mail b,.dark .mini-mail b { color:var(--ink); }
.feature-link,.stat-link,.dark .feature-link,.dark .stat-link { color:var(--ink); font-weight:500; }
.feature-link:hover,.stat-link:hover { text-decoration:underline; text-underline-offset:4px; }
.home-bottom,.dark .home-bottom,.dark .home-bottom:hover { background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:36px; }
.home-bottom h2,.dark .home-bottom h2 { color:var(--ink); font-size:1.75rem; }
.home-bottom p:not(.eyebrow) { color:var(--muted); }
.home-bottom .hero-cta,.dark .home-bottom .hero-cta { background:var(--accent); color:var(--surface); box-shadow:none; }

/* The dashboard follows the reference: equal cards, quiet borders, simple rows. */
.dashboard-heading h1 { font-size:2rem; letter-spacing:-1px; }
.dashboard-panel,.stat-card,.security-panel,.settings-card,.empty-card,
.dark .dashboard-panel,.dark .stat-card,.dark .security-panel,.dark .settings-card,.dark .empty-card {
  border-radius:12px; border-color:var(--line); box-shadow:var(--shadow); background:var(--surface);
}
.stats-grid { gap:16px; }
.stat-card { min-height:174px; padding:20px; }
.stat-card:first-child,.dark .stat-card:first-child { background:var(--surface); border-color:var(--line); box-shadow:var(--shadow); }
.stat-card:first-child .stat-top { color:var(--muted); }
.stat-card:first-child .stat-number { color:var(--ink); }
.stat-card:first-child>small,.stat-card:first-child .stat-foot { color:var(--muted); }
.stat-top { font-size:.8125rem; }
.stat-number { font-size:2rem; margin-top:14px; letter-spacing:-.8px; }
.stat-card>small { margin-top:8px; }
.stat-foot,.stat-link { margin-top:12px; }
.stat-icon,.quick-icon,.snapshot-icon,.stat-card:first-child .stat-icon,
.violet-stat,.blue-stat,.green-stat,.amber-stat { width:32px; height:32px; flex-basis:32px; font-size:16px; border-radius:8px; background:var(--accent-soft); color:var(--ink); }
.dashboard-lower { gap:16px; margin-top:16px; grid-template-columns:1.3fr 1fr; }
.dashboard-panel { padding:22px; }
.panel-heading h2,.snapshot-heading h2 { font-size:.9375rem; font-weight:600; }
.panel-heading p,.snapshot-heading p { font-size:.75rem; }
.activity-empty { background:transparent; border:0; margin-top:0; min-height:176px; padding:24px; font-size:.8125rem; }
.quick-panel { padding-bottom:12px; }
.quick-link { padding:12px 0; gap:12px; border-color:var(--line); }
.quick-link:hover { padding-left:0; border-radius:0; background:var(--surface-2); }
.quick-link strong { font-size:.8125rem; font-weight:600; }
.quick-link small,.quick-link small b { font-size:.6875rem; color:var(--muted); }
.quick-link>i { color:var(--muted); }
.dashboard-security-snapshot,.dark .dashboard-security-snapshot { background:var(--surface); }
.snapshot-stats { margin:20px 0 4px; gap:26px; font-size:.75rem; }
.snapshot-stats strong { font-size:1.25rem; }
.snapshot-heading .status-chip,.status-chip,.dark .status-chip,.account-chip { background:var(--accent-soft); color:var(--muted); border-color:var(--line); }
.storage-track,.dark .storage-track { background:var(--accent-soft); }
.storage-track span,.temporary-progress i { background:var(--accent); }
.storage-track span.near-limit { background:#a96d24; }
.stat-progress i { background:var(--accent); }

/* Mail, settings, and account forms use the same black and grey palette. */
.mail-layout,.start-card,.settings-nav,.dark .mail-layout,.dark .start-card,.dark .settings-nav { border-radius:12px; border-color:var(--line); box-shadow:none; }
.message-list,.reading-pane,.dark .message-list,.dark .reading-pane { background:var(--surface); }
.reading-toolbar,.dark .reading-toolbar { background:var(--surface); border-color:var(--line); }
.side-link.selected,.message.selected-message,.dark .side-link.selected,.dark .message.selected-message { background:var(--accent-soft); color:var(--ink); box-shadow:none; }
.side-link:not(.selected):hover,.dark .side-link:not(.selected):hover,.message:hover,.dark .message:hover { background:var(--surface-2); color:var(--ink); }
.side-label,.sidebar-footer,.sidebar-footer small { color:var(--muted); }
.list-tabs button,.message-meta,.subject,.preview,.tags { color:var(--muted); }
.list-tabs button.chosen,.message.unread .message-meta strong,.message.unread .subject { color:var(--ink); border-color:var(--ink); }
.sender-avatar,.avatar-purple,.label-chip,.dark .label-chip { background:var(--accent-soft); color:var(--ink); }
.list-tabs button.chosen:after { background:var(--accent); }
.message-security,.key-info,.dark .key-info { background:var(--surface-2); border-color:var(--line); color:var(--muted); }
.mail-empty .waiting-icon,.dark .mail-empty .waiting-icon,.setting-icon,.dark .setting-icon,.snapshot-icon { background:var(--accent-soft); color:var(--ink); }
.settings-nav a,.dark .settings-nav a { color:var(--muted); }
.settings-nav a:first-child,.settings-nav a:hover,.dark .settings-nav a:first-child,.dark .settings-nav a:hover { background:var(--accent-soft); color:var(--ink); }
.setting-segment,.dark .setting-segment { background:var(--accent-soft); }
.setting-choice,.dark .setting-choice { color:var(--muted); }
.setting-choice.selected,.dark .setting-choice.selected { background:var(--surface); color:var(--ink); box-shadow:0 1px 3px #0000000a; }
.setting-toggle.enabled>span { background:var(--accent); }
.setting-toggle>span:after { background:var(--surface); }
.setting-toggle.enabled b,.dark .setting-toggle.enabled b { color:var(--ink); }
.setting-toggle>span,.dark .setting-toggle>span { background:#bdbdbd; }
.setting-toggle.enabled>span,.dark .setting-toggle.enabled>span { background:var(--accent); }
.search,.dark .search,.auth-password,.mailbox-input,.delete-dialog-form>input,.dark .auth-password,.dark .mailbox-input,.dark .delete-dialog-form input {
  border-color:var(--line); background:var(--surface); color:var(--ink); border-radius:7px;
}
.auth-password:focus,.mailbox-input:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px #88888818; }
.auth-switch,.dark .auth-switch,.inline-policy-link,.dark .inline-policy-link,.recovery-file-button { color:var(--ink); }
.legal-footer button,.dark .legal-footer button,.business-disclosure,.dark .business-disclosure { color:var(--muted); }
.coming-soon-chip,.dark .empty-card>.coming-soon-chip,.empty-card>span { background:var(--accent-soft); color:var(--muted); }
.subscription-card.premium,.dark .subscription-card.premium { background:var(--surface-2); border-color:var(--line); }
.plan-feature strong,.privacy-score strong,#temporary-address,.alias-details code { color:var(--ink); }
.subscription-card h3 small,.subscription-card>small,.subscription-card ul { color:var(--muted); }
.compose-head,.dark .compose-head { background:var(--surface); }
.compose-window input,.compose-window textarea { color:var(--ink); }
.dark :focus-visible { outline-color:var(--accent); }
.danger-row .setting-icon,.delete-dialog-icon { background:#fff0f0; color:#a53b47; }
.dark .danger-row .setting-icon,.dark .delete-dialog-icon { background:#3b2525; color:#eea0a0; }
.status-chip.warning,.dark .status-chip.warning { background:#fff4e7; color:#865816; }
.dark .status-chip.warning { background:#352b1c; color:#edc78f; }
.account-settings-info strong,.dark .account-settings-info strong { color:var(--ink); }
.soft-button,.dark .soft-button,.side-link,.dark .side-link,.setting-toggle,.dark .setting-toggle,
.alias-create-form>span,.activity-empty,.dark .activity-empty,.mail-empty,.dark .mail-empty,
.settings-group-title p,.dark .settings-group-title p,.settings-footnote,.dark .settings-footnote,
.account-chip,.dark .account-chip { color:var(--muted); }
.account-chip,.dark .account-chip { background:var(--surface); border-color:var(--line); }
.dot.violet { background:#777; }
.side-link.selected,.dark .side-link.selected { color:var(--ink); }

@media(max-width:1000px) {
  .home-hero { gap:35px; padding:40px 0; }
  .hero-copy h1 { font-size:3rem; }
  .dashboard-lower { grid-template-columns:1.3fr 1fr; }
}
@media(max-width:760px) {
  .home-hero { grid-template-columns:1fr; padding:32px 0 36px; gap:28px; }
  .hero-art { min-height:0; height:auto; margin:0 auto; }
  .hero-copy { max-width:500px; }
  .hero-copy h1 { font-size:3rem; }
  .dashboard-lower { grid-template-columns:1fr; }
  .stat-card { min-height:166px; }
  .activity-empty { min-height:150px; }
}
@media(max-width:560px) {
  .topbar { min-height:68px; }
  .home-hero { padding-top:28px; }
  .hero-copy h1 { font-size:2.75rem; }
  .hero-copy>p { font-size:.9375rem; }
  .hero-proof>span:nth-of-type(2) { font-size:.6875rem; }
  .hero-proof small { font-size:.625rem; }
  .section-intro h2 { font-size:1.75rem; }
  .feature-card,.feature-large { min-height:0; }
  .home-bottom { padding:26px; }
  .stats-grid { gap:12px; }
  .stat-card { padding:16px; }
  .stat-top { font-size:.75rem; }
  .stat-icon { width:28px; height:28px; flex-basis:28px; }
  .stat-number { font-size:1.875rem; }
  .dashboard-panel { padding:20px; }
  .snapshot-heading .status-chip { margin-left:44px; }
  .snapshot-stats { flex-wrap:wrap; gap:12px; }
  .hero-art { height:auto; }
}
.calendar-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:20px}.calendar-heading .view-heading{text-align:left;margin:0}.calendar-add{min-height:44px;padding:0 17px;font-size:13px}.calendar-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.calendar-nav{display:flex;align-items:center;gap:8px}.calendar-nav .soft-button{min-width:38px;min-height:38px}.calendar-nav #calendar-today{min-width:64px}.calendar-nav h2{margin:0 0 0 8px;font-size:20px;letter-spacing:-.5px}.calendar-local-note,.calendar-footnote{margin:0;color:var(--muted);font-size:12px}.calendar-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.8fr);gap:16px;align-items:stretch}.calendar-panel{min-width:0;padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.calendar-weekdays,.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.calendar-weekdays{margin-bottom:8px}.calendar-weekdays span{text-align:center;color:var(--muted);font-size:11px;font-weight:650;padding:8px}.calendar-day{position:relative;min-width:0;min-height:106px;padding:5px;border:1px solid var(--line);border-right:0;border-bottom:0;background:var(--surface)}.calendar-day:nth-child(7n){border-right:1px solid var(--line)}.calendar-day:nth-last-child(-n+7){border-bottom:1px solid var(--line)}.calendar-day.outside-month{background:var(--surface-2)}.calendar-day.is-selected{background:color-mix(in srgb,var(--accent-soft) 44%,var(--surface))}.calendar-date{display:grid;place-items:center;width:30px;height:30px;border:0;border-radius:50%;background:transparent;color:var(--ink);font-size:12px}.calendar-day.outside-month .calendar-date{color:var(--muted)}.calendar-day.is-today .calendar-date{background:var(--ink);color:var(--surface);font-weight:750}.calendar-day.is-selected:not(.is-today) .calendar-date{outline:1px solid var(--accent);color:var(--accent)}.calendar-day-events{display:grid;gap:4px;margin-top:3px}.calendar-event-chip{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:0;border-radius:5px;padding:4px 6px;text-align:left;background:var(--accent-soft);color:var(--ink);font-size:10px}.calendar-event-chip:hover{outline:1px solid var(--accent)}.calendar-more{padding-left:5px;color:var(--muted);font-size:10px}.calendar-agenda-panel{padding:20px}.calendar-agenda-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--line)}.calendar-agenda-heading .eyebrow{margin-bottom:5px}.calendar-agenda-heading h2{margin:0;font-size:18px;letter-spacing:-.35px}.calendar-agenda-heading button{min-height:36px}.calendar-agenda{display:grid;gap:12px;padding-top:14px}.calendar-agenda-empty{padding:22px 4px;color:var(--ink)}.calendar-agenda-empty strong{font-size:14px}.calendar-agenda-empty p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.6}.calendar-agenda-event{display:grid;grid-template-columns:95px minmax(0,1fr) auto;gap:10px;align-items:start;padding:12px 0;border-bottom:1px solid var(--line)}.calendar-agenda-event time{padding-top:2px;color:var(--muted);font-size:11px}.calendar-agenda-event h3{margin:0;font-size:13px;overflow-wrap:anywhere}.calendar-agenda-event p{margin:5px 0 0;color:var(--muted);font-size:11px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}.calendar-event-edit{border:0;background:transparent;color:var(--accent);font-size:11px}.calendar-footnote{margin-top:12px;font-size:11px}.calendar-form{padding:26px;display:grid;gap:9px}.calendar-dialog-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:6px}.calendar-dialog-head .eyebrow{margin-bottom:6px}.calendar-dialog-head h2{margin:0;font-size:22px}.calendar-form>label,.calendar-form-row label{display:block;margin:5px 0 0;color:var(--ink);font-size:12px;font-weight:650}.calendar-form label span{color:var(--muted);font-weight:400}.calendar-form input,.calendar-form textarea{width:100%;min-width:0;min-height:42px;border:1px solid var(--line);border-radius:9px;padding:9px 11px;background:var(--surface);color:var(--ink);font:inherit}.calendar-form textarea{resize:vertical;min-height:84px}.calendar-form input:focus,.calendar-form textarea:focus{outline:2px solid color-mix(in srgb,var(--accent) 35%,transparent);border-color:var(--accent)}.calendar-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.calendar-status{margin:0;color:#a33e48;font-size:12px;line-height:1.5}.calendar-dialog-actions{display:flex;justify-content:flex-end;gap:10px;align-items:center;margin-top:9px}.calendar-dialog-actions .danger-button{margin-right:auto}.calendar-footnote+.calendar-status{margin-top:10px}.dark .calendar-event-chip{background:var(--accent-soft);color:var(--ink)}.dark .calendar-day.is-today .calendar-date{background:#f2f0f7;color:#17161e}@media(max-width:900px){.calendar-layout{grid-template-columns:1fr}.calendar-agenda-panel{min-height:210px}.calendar-day{min-height:92px}}@media(max-width:620px){.calendar-heading{align-items:flex-start}.calendar-heading .view-heading{text-align:left}.calendar-add{min-height:40px;padding:0 12px;white-space:nowrap}.calendar-toolbar{align-items:flex-start;flex-direction:column}.calendar-nav h2{font-size:18px}.calendar-panel{padding:10px}.calendar-weekdays span{font-size:10px;padding:6px 2px}.calendar-day{min-height:74px;padding:3px}.calendar-date{width:26px;height:26px;font-size:11px}.calendar-event-chip{font-size:8px;padding:3px 4px}.calendar-more{font-size:8px;padding-left:2px}.calendar-agenda-event{grid-template-columns:74px minmax(0,1fr) auto;gap:7px}.calendar-agenda-event time,.calendar-agenda-event p{font-size:10px}.calendar-form{padding:21px 18px}.calendar-form-row{gap:8px}}@media(max-width:390px){.calendar-heading{display:block}.calendar-add{margin-top:12px}.calendar-day{min-height:62px}.calendar-event-chip{font-size:7px}.calendar-agenda-event{grid-template-columns:1fr auto}.calendar-agenda-event time{grid-column:1/-1}}

/* Keep the privacy dashboard especially calm and low-glare in dark mode. */
.dark #view-security .security-panel { background:#181818; border-color:#2b2b2b; }
.dark #view-security .security-list p { background:#111; }
.dark #view-security .status-chip { background:#292929; color:#e2e2e2; }
.dark #view-security .status-chip.warning { background:#3a3026; color:#e9bd84; }

/* Separate the permanent-address card from the disposable-alias section. */
#permanent-address-list + h2 { margin-top:32px; }

.shortcuts-open { width:100%; border:0; background:transparent; color:var(--muted); font:inherit; text-align:left; cursor:pointer; }
.side-link kbd,.compose kbd { margin-left:auto; padding:2px 6px; border:1px solid var(--line); border-radius:5px; background:var(--surface); color:var(--muted); font-family:inherit; font-size:10px; font-weight:600; line-height:1.3; }
.mail-transfer-status { margin:0 20px 16px; padding:11px 13px; border-radius:9px; background:var(--surface-2); color:var(--ink); font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.mail-transfer-status[data-state="error"] { background:#fff0f0; color:#87343c; }
.dark .mail-transfer-status[data-state="error"] { background:#3b2525; color:#f0b2b2; }
.file-button { display:inline-flex; align-items:center; cursor:pointer; }
.undo-send-row { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:10px 12px; border:1px solid var(--line); border-radius:9px; background:var(--surface-2); color:var(--ink); font-size:13px; }
.undo-send-row[hidden] { display:none; }
.shortcuts-dialog { padding:24px; }
#keyboard-shortcuts-dialog { width:min(480px,calc(100vw - 28px)); padding:0; border:1px solid var(--line); border-radius:16px; background:var(--surface); color:var(--ink); box-shadow:0 24px 80px #14122245; }
.shortcuts-dialog dl { display:grid; gap:0; margin:14px 0; }
.shortcuts-dialog dl>div { display:grid; grid-template-columns:minmax(120px,auto) 1fr; gap:16px; align-items:center; padding:11px 0; border-bottom:1px solid var(--line); }
.shortcuts-dialog dt { display:flex; gap:5px; align-items:center; }
.shortcuts-dialog kbd { min-width:24px; padding:4px 7px; border:1px solid var(--line); border-radius:6px; background:var(--surface-2); text-align:center; font-family:inherit; font-size:12px; font-weight:600; line-height:1.2; }
.shortcuts-dialog dd { margin:0; color:var(--muted); font-size:13px; line-height:1.45; }
.shortcuts-dialog>p { margin:14px 0 0; color:var(--muted); font-size:12px; line-height:1.5; }
@media(max-width:560px) {
  .sidebar { flex-wrap:nowrap; overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-width:thin; }
  .compose { flex:0 0 auto; width:auto; min-height:44px; margin:0 4px 0 0; }
  .side-link,.shortcuts-open { flex:0 0 auto; width:auto; min-height:44px; height:auto; white-space:nowrap; }
  .side-link kbd { display:none; }
  .message-list { max-height:42vh; overflow:auto; }
  .reading-pane { min-height:300px; }
  .compose-window { max-height:calc(100dvh - 20px); overflow:auto; }
  #compose-dialog { width:calc(100vw - 16px); max-width:none; max-height:calc(100dvh - 16px); margin:auto; }
  .compose-window input,.compose-window select { min-height:44px; }
  .compose-window textarea { min-height:150px; }
  .file-button { min-height:44px; }
}

/* Native settings controls inherit the same accessible surface treatment. */
.setting-row select { min-height:40px; min-width:150px; padding:0 32px 0 11px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-size:.8125rem; }
.setting-row select:focus-visible { outline:2px solid var(--ink); outline-offset:2px; }
.hide-message-previews .message .preview { display:none; }
@media(max-width:700px) { .setting-row select { grid-column:2; justify-self:start; margin-left:0; min-height:44px; } }