/* Put the working inbox before promotion, with the same controls on every screen. */
.site-header .main-nav { gap: 18px; }
.site-header .main-nav a { white-space: nowrap; }
.hero { padding-top: 36px; }
.hero-copy-wrap { max-width: 820px; margin-bottom: 26px; }
.hero .hero-pill { margin-bottom: 12px; }
.hero h1 { font-size: clamp(32px, 4.3vw, 52px); line-height: 1.1; letter-spacing: -.045em; }
.hero-copy-wrap > p { max-width: 690px; margin-top: 14px; font-size: 16px; line-height: 1.55; }
.hero .mail-workspace { scroll-margin-top: 90px; }
.hero .workspace-inbox { scroll-margin-top: 90px; }
.hero .credential-panel { position: relative; isolation: isolate; border-color: #baa5ff; background: linear-gradient(155deg, #faf7ff 0, #fff 36%, #fff 72%, #f4f8ff 100%); box-shadow: 0 18px 54px rgba(94, 58, 181, .10), 0 2px 7px rgba(94, 58, 181, .04); }
.credential-panel .panel-label { margin-bottom: 14px; gap: 8px; color: var(--ink); font-size: 12px; font-weight: 700; }
.mailbox-label-icon { width: 30px; height: 30px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; background: linear-gradient(140deg, #a150ff, #7b42ff, #078df5); color: #fff; box-shadow: 0 5px 12px rgba(123, 66, 255, .20); }
.mailbox-label-icon .ui-icon { width: 16px; height: 16px; }
.mailbox-ready-label { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; color: #227667; font-size: 9px; font-weight: 700; white-space: nowrap; }
.mailbox-ready-label i { width: 5px; height: 5px; border-radius: 50%; background: #12a888; }
.credential-panel .credential-field > button { width: 44px; height: 44px; }
.credential-panel .credential-field { min-height: 59px; padding: 6px 7px 6px 12px; border-color: #ded7ef; background: #fff; box-shadow: 0 3px 10px rgba(80, 52, 142, .035); }
.credential-panel .credential-field > button { border-color: #e4dcfa; background: #f8f5ff; color: #7040d8; }
.credential-panel .credential-field > button:hover { background: #eee7ff; border-color: #baa5ff; }
.credential-panel .password-field { min-height: 54px; background: #f7f5fc; box-shadow: none; }
.credential-panel .password-field > button { background: #fff; }
.credential-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.credential-actions > button { min-width: 0; min-height: 48px; margin: 0; padding: 8px; border-radius: 13px; font-size: 12px; line-height: 1.3; }
.credential-actions > .workspace-primary { background: linear-gradient(112deg, #9c4bf5 0, #7543fb 48%, #287ff5 100%); box-shadow: 0 8px 18px rgba(113, 65, 239, .20); }
.credential-actions > .workspace-secondary { border-color: #d7c8f9; background: #fff; color: #5930af; }
.credential-actions > .workspace-secondary:hover { border-color: #a88ae9; background: #f5f0ff; }
.credential-actions .ui-icon { width: 16px; height: 16px; }
.mailbox-options { margin-top: 14px; border: 1px solid #ddd2f6; border-radius: 15px; background: linear-gradient(112deg, #f1eaff, #f0f5ff); overflow: hidden; }
.mailbox-options > summary { min-height: 66px; padding: 12px; display: flex; align-items: center; gap: 10px; list-style: none; color: #352456; cursor: pointer; transition: background .18s ease; }
.mailbox-options > summary::-webkit-details-marker { display: none; }
.mailbox-options > summary::marker { content: ''; }
.mailbox-options > summary:hover { background: rgba(255, 255, 255, .50); }
.mailbox-options-icon { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid #e3d5ff; border-radius: 11px; background: #fff; color: #854de0; box-shadow: 0 3px 9px rgba(105, 63, 170, .07); }
.mailbox-options-copy { min-width: 0; flex: 1; display: grid; gap: 3px; }
.mailbox-options-copy strong { font-size: 12px; line-height: 1.3; }
.mailbox-options-copy small { color: #6c5e83; font-size: 10px; line-height: 1.4; }
.mailbox-options-chevron { width: 17px; height: 17px; color: #7450ad; transition: rotate .18s ease; }
.mailbox-options[open] .mailbox-options-chevron { rotate: 180deg; }
.mailbox-options[open] > summary { border-bottom: 1px solid #e0d6f4; }
.mailbox-tools-grid { padding: 9px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; background: rgba(255, 255, 255, .48); }
.mailbox-options .mailbox-tool-card { width: 100%; min-width: 0; min-height: 98px; margin: 0; padding: 11px; display: flex; flex-direction: column; align-items: flex-start; gap: 9px; border: 1px solid #e4ddf0; border-radius: 12px; background: #fff; color: #342a45; text-align: left; cursor: pointer; box-shadow: 0 2px 5px rgba(69, 42, 121, .025); transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; }
.mailbox-options .mailbox-tool-card:hover { border-color: #b89be9; background: #fdfbff; box-shadow: 0 4px 12px rgba(105, 63, 170, .08); translate: none; }
.mailbox-tool-icon { width: 30px; height: 30px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; background: #f0e8ff; color: #8550d4; }
.mailbox-tool-icon .ui-icon { width: 16px; height: 16px; }
.mailbox-tool-card:nth-child(2) .mailbox-tool-icon { background: #eaf2ff; color: #417bd2; }
.mailbox-tool-card:nth-last-child(2) .mailbox-tool-icon { background: #eef0ff; color: #6964c9; }
.mailbox-tool-card:last-child .mailbox-tool-icon { background: #e6f7f1; color: #228970; }
.mailbox-tool-card > span:last-child { min-width: 0; display: grid; gap: 3px; }
.mailbox-tool-card strong { font-size: 12px; line-height: 1.35; font-weight: 700; }
.mailbox-tool-card small { font-size: 10px; line-height: 1.45; font-weight: 400; color: #716779; }
.mailbox-options .mailbox-private-card { grid-column: 1 / -1; min-height: 64px; flex-direction: row; align-items: center; }
.credential-panel .privacy-note { margin-top: 13px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.shared-workspace-mode .mailbox-ready-label { display: none; }
:root[data-theme=dark] .hero .credential-panel { border-color: #594584; background: linear-gradient(145deg, #1a162c, #101424 65%, #141d31); box-shadow: 0 18px 54px rgba(0, 0, 0, .18); }
:root[data-theme=dark] .credential-panel .credential-field { border-color: #3e3552; background: #171728; }
:root[data-theme=dark] .credential-panel .password-field { background: #201c31; }
:root[data-theme=dark] .credential-panel .credential-field > button { border-color: #46365e; background: #2a213c; color: #c6a5ff; }
:root[data-theme=dark] .credential-actions > .workspace-secondary { border-color: #554070; background: #201a30; color: #d3b8ff; }
:root[data-theme=dark] .mailbox-options { border-color: #4a3866; background: linear-gradient(115deg, #2e2342, #1e2940); }
:root[data-theme=dark] .mailbox-options > summary { color: #eee4ff; }
:root[data-theme=dark] .mailbox-options > summary:hover { background: rgba(255,255,255,.035); }
:root[data-theme=dark] .mailbox-options-copy small { color: #b8adc9; }
:root[data-theme=dark] .mailbox-options-icon { border-color: #594273; background: #392a50; color: #d0a7ff; }
:root[data-theme=dark] .mailbox-options-chevron { color: #c6a5ef; }
:root[data-theme=dark] .mailbox-options[open] > summary { border-color: #4a3866; }
:root[data-theme=dark] .mailbox-tools-grid { background: rgba(0,0,0,.10); }
:root[data-theme=dark] .mailbox-options .mailbox-tool-card { border-color: #43364f; background: #231d31; color: #f0e9fa; }
:root[data-theme=dark] .mailbox-options .mailbox-tool-card:hover { border-color: #7f5d9e; background: #2b223b; }
:root[data-theme=dark] .mailbox-tool-card small { color: #baadca; }
:root[data-theme=dark] .mailbox-ready-label { color: #80d6bd; }
.hero > .feature-announcement-banner,
.hero > .referral-hero-banner { max-width: 1100px; margin-top: 26px; margin-bottom: 0; }
.mailbox-options > summary:focus-visible { outline: 3px solid var(--purple); outline-offset: 3px; border-radius: 5px; }
.shared-workspace-mode .mailbox-options,
.shared-workspace-mode .credential-actions,
.shared-workspace-mode .credential-panel .privacy-note { display: none; }
@media (max-width: 780px) {
  .hero { padding: 24px 14px 30px; }
  .hero-copy-wrap { margin-bottom: 20px; text-align: left; }
  .hero .hero-pill { margin-bottom: 9px; font-size: 9px; }
  .hero h1 { font-size: clamp(30px, 7.7vw, 38px); line-height: 1.12; }
  .hero-copy-wrap > p { margin-top: 11px; font-size: 14px; line-height: 1.5; }
  .hero .mail-workspace { gap: 14px; animation: none; }
  .hero .credential-panel { width: 100%; padding: 16px 14px 13px; border-radius: 17px; }
  .hero .workspace-inbox { height: 480px; }
  .hero > .feature-announcement-banner,
  .hero > .referral-hero-banner { width: 100%; }
}
@media (min-width: 561px) and (max-width: 980px) {
  .site-header .main-nav { gap: 12px; }
  .site-header .main-nav a { font-size: 12px; }
  .hero .inbox-actions .icon-button { display: inline-flex; align-items: center; justify-content: center; width: 44px; }
}
@media (min-width: 781px) and (max-width: 980px) {
  .hero .inbox-toolbar { min-height: 106px; padding: 12px 14px; align-items: stretch; flex-direction: column; gap: 10px; }
  .hero .inbox-actions { width: 100%; }
  .hero .search-box { flex: 1; min-width: 0; width: auto; }
  .hero .message-list { height: calc(100% - 106px); }
}
@media (min-width: 561px) and (max-width: 700px) {
  .site-header { height: 116px; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: 56px 44px; padding: 8px 14px; gap: 0 12px; }
  .site-header .brand { grid-column: 1; grid-row: 1; }
  .site-header .header-actions { grid-column: 2; grid-row: 1; }
  .site-header .main-nav { grid-column: 1 / -1; grid-row: 2; justify-content: space-between; width: 100%; }
  .site-header .main-nav a { min-height: 44px; padding: 0; }
}
@media (max-width: 560px) {
  .site-header .main-nav { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 3px; }
  .hero .inbox-toolbar { min-height: 106px; padding: 12px 14px; gap: 10px; }
  .hero .message-list { height: calc(100% - 106px); }
  .hero .inbox-actions > button,
  .hero .search-box { height: 44px; }
  .hero .inbox-actions .icon-button { display: inline-flex; align-items: center; justify-content: center; width: 44px; }
  .hero .inbox-actions { gap: 6px; }
  .hero .search-box { min-width: 0; padding-inline: 8px; }
  .hero .inbox-actions > button { padding-inline: 9px; }
  .hero .empty { padding: 28px 18px; }
  .hero .empty p { font-size: 13px; line-height: 1.6; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-copy-wrap, .mail-workspace { animation: none; }
}
/* Compact, equally usable consent choices; the generator remains accessible. */
.cookie-consent{width:min(430px,calc(100vw - 28px));padding:16px;border-radius:16px;background:var(--surface,#fff);backdrop-filter:none;box-shadow:0 12px 36px rgba(29,18,63,.16)}
.cookie-consent__top{display:block}.cookie-consent__icon{display:none}
.cookie-consent h2{margin:0 0 6px;font-size:17px;line-height:1.3}
.cookie-consent p{font-size:12px;line-height:1.5}
.cookie-consent__actions{margin-top:12px;grid-template-columns:1fr 1fr;gap:8px}
.cookie-consent__actions button{min-height:44px;padding:8px 10px;border:1px solid var(--line-strong,#d8d4e5);background:var(--surface-2,#f6f5fb);color:var(--ink,#11131c);box-shadow:none;font-size:12px;line-height:1.3}
.cookie-consent__actions button:hover{translate:none;box-shadow:none;background:var(--surface-3,#efedf8);border-color:var(--purple,#7b42ff)}
.cookie-consent__policy{grid-column:1/-1;min-height:32px!important;padding:4px!important;font-size:12px}
@media(max-width:560px){.cookie-consent{right:12px;bottom:78px;width:calc(100vw - 24px);padding:14px;border-radius:15px}.cookie-consent__actions{grid-template-columns:1fr 1fr}.cookie-consent__top{display:block}}
