/* Wedding Bands Mallorca — local fonts and the studio's original identity. */
@font-face {
  font-family: "Cormorant Garamond";
  src: url("/brand/cormorant-garamond-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("/brand/cormorant-garamond-italic-latin.woff2") format("woff2");
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
}
@font-face {
  font-family: Manrope;
  src: url("/brand/manrope-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}
@font-face {
  font-family: Lora;
  src: url("/brand/lora-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
}
:root {
  --paper: #ffffff;
  --surface: #ffffff;
  --ink: #28342b;
  --muted: #5c655c;
  --line: #d6d2c6;
  --green: #303e32;
  --olive: #303e32;
  --gold: #ad8d60;
  --light-green: #f0f2ec;
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: Manrope, "Segoe UI", sans-serif;
  --reading: Lora, Georgia, serif;
}
body { background: #fff; }
button:focus-visible, a:focus-visible { outline-color: #ad8d60; }
input, textarea { background: #fff; border-color: #d6d2c6; }
input:focus, textarea:focus { border-color: #ad8d60; box-shadow: 0 0 0 3px #ad8d601a; }
input::placeholder, textarea::placeholder { color: #757d73; }
.eyebrow { color: #746448; letter-spacing: 1.7px; }
.title-dot, .sparkle, .footer-sparkle { color: var(--gold); }
.button { border-radius: 4px; letter-spacing: .1px; }
.button.primary { background: var(--green); color: #fff; }
.button.primary:hover { background: #40523f; }
.button.secondary { color: var(--green); border-color: #b7b7a6; }
.button.secondary:hover { background: #f3f2ec; }
.text-button { color: #526047; }
.icon-button { color: #65705f; }
.icon-button:hover { background: #303e320c; }
.field-hint, .auth-privacy, .auth-divider span { color: #687061; }
.wordmark { display: flex; flex-direction: column; gap: 11px; letter-spacing: normal; }
.brand-lockup {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  width: 100%;
  padding: 11px 12px 13px;
  background: #fff;
  border: 1px solid #e7e3d9;
  border-radius: 3px;
}
.brand-emblem { display: block; width: 53px; height: 53px; object-fit: contain; }
.brand-wordmark-image { display: block; width: 100%; max-width: 220px; height: auto; }
.brand-product { color: #dbd0bb; font: 500 8px/1.5 var(--sans); letter-spacing: 2.2px; text-align: center; }
.boot { background: var(--green); color: #eee9df; }
.boot-brand { width: 140px; height: 140px; padding: 13px; background: #fff; border-radius: 50%; object-fit: contain; }
.boot p { margin-top: 25px; font-size: 12px; letter-spacing: .5px; }
.sidebar { width: 238px; padding: 25px 20px 0; background: var(--green); color: #e2e5d9; }
.sidebar .wordmark { margin-left: 0; }
.compose-button { margin: 27px 0 27px; padding: 14px 15px; color: #fff; background: #80633e; border-color: #bda27c; border-radius: 4px; box-shadow: none; }
.compose-button:hover { background: #90734d; }
.nav-label { color: #c2c8b6; font-size: 8px; letter-spacing: 2px; }
.nav-item { color: #d0d7c8; border-radius: 4px; font-size: 12px; }
.nav-item:hover { background: #45533f; }
.nav-item.active { background: #4b5945; color: #fff; box-shadow: inset 2px 0 #bda27c; }
.nav-count { color: #fff; background: #69765a; font-size: 10px; }
.quiet-count { color: #c5cdbb; }
.nav-item.subtle { color: #cbd3c2; font-size: 10px; }
.assistant-note { border-color: #84907650; margin-bottom: 13px; }
.assistant-note .sparkle { color: #c9ad84; }
.assistant-note strong { color: #eeeade; font-size: 10px; }
.assistant-note p { color: #bbc7b1; }
.account { border-color: #84907650; }
.account-avatar { background: #657257; color: #fff; font-size: 18px; }
.account strong { color: #f2eee3; }
.account>div>span { color: #c1cbb5; }
.account>.icon-button { color: #d1d9c6; }
.workspace-header { background: #fff; border-bottom-color: var(--line); }
.workspace-heading .eyebrow { color: #68624e; font-size: 8px; letter-spacing: 1.3px; }
.today-label { color: #687061; border-color: #d6d2c6; }
.connection-status { color: #62705b; }
.connection-status.connected>span { background: #637d4c; }
.demo-banner, .connection-banner { background: #f5f3eb; color: #68664f; border-color: #e0d9c9; }
.demo-banner strong, .connection-banner strong { color: #574b33; }
.demo-banner button, .connection-banner button { color: #526047; }
.mail-list-pane { background: #fcfcf9; border-color: var(--line); }
.list-title-row h1 { font-size: 41px; font-weight: 500; letter-spacing: -.8px; }
.list-title-row p { color: #6e7567; line-height: 1.6; }
.total-badge { border-color: #d2ccb9; color: #72664e; }
.search-box { background: #f2f2eb; border-color: #e2e1d6; border-radius: 4px; color: #727966; }
.search-box input { font-size: 11px; }
.search-box>span { color: #6e7962; }
.filter-tab, .filter-tab span, .list-sort { color: #69715f; }
.filter-tab.active { color: #303e32; }
.filter-tab.active:after { background: #ad8d60; }
.mail-card { border-bottom-color: #e1e1d6; }
.mail-card:hover { background: #f0f2e9; }
.mail-card.selected { background: #eaf0e3; }
.mail-card.selected:before { background: var(--gold); }
.mail-avatar { background: #e9eadf; color: #5d6d4e; font-size: 15px; }
.mail-card:nth-child(3n+2) .mail-avatar { background: #f1e8db; color: #80633e; }
.mail-card:nth-child(3n) .mail-avatar { background: #e7ece1; color: #52634a; }
.mail-card-name { font-size: 11px; color: #374332; }
.mail-card-time { font-size: 9px; color: #6f7865; }
.mail-card-subject { font-size: 12px; color: #4b5843; }
.mail-card.unread .mail-card-subject { color: #28342b; }
.mail-card-preview { color: #737b6a; font-size: 11px; }
.unread-dot { background: #8b724d; }
.draft-label { color: #80643e; border-color: #cbb999; }
.list-footer { color: #707964; }
.list-empty { color: #6c775f; }
.reader-pane { background: #fff; scrollbar-color: #d6d2c6 transparent; }
.empty-reader { padding-bottom: 66px; }
.empty-reader .empty-illustration { width: 164px; height: 164px; flex: none; margin: 0; }
.brand-empty-emblem { display: block; width: 164px; height: 164px; object-fit: contain; }
.empty-reader:has(.brand-empty-emblem)>.eyebrow { margin-top: 28px; }
.empty-reader .eyebrow { color: #836a45; letter-spacing: 2px; }
.empty-reader h2 { font-size: 45px; font-weight: 400; line-height: 1.05; color: #303e32; letter-spacing: -.7px; margin: 21px 0 21px; }
.empty-reader>p { color: #66725d; font-size: 12px; line-height: 1.9; }
.empty-tip { color: #748067; font-size: 9px; margin-top: 35px; padding-top: 22px; position: relative; }
.empty-tip:before { content: ""; position: absolute; top: 0; left: calc(50% - 25px); width: 50px; height: 1px; background: #ad8d60; }
.empty-tip>span { color: #ad8d60; }
.reader-category { color: #7c6b4e; }
.message-content { width: 100%; }
.message-content h2 { font-size: 35px; font-weight: 500; line-height: 1.2; color: #303e32; }
.sender-avatar { background: #eef0e5; color: #596d48; font-size: 19px; }
.sender-details strong { color: #374332; font-size: 12px; }
.sender-details>span, .message-date { color: #6b7462; font-size: 10px; }
.message-body, .thread-message p, .draft-body, .review-body { font-family: var(--reading); font-size: 13px; line-height: 1.95; color: #4f5c46; }
.ai-prompt-card { background: #f2f4eb; border-color: #dce1cd; border-radius: 4px; }
.ai-prompt-card strong { color: #465d3d; font-size: 11px; }
.ai-prompt-card p { color: #65765a; font-size: 10px; }
.ai-prompt-card .text-button { color: #526742; font-size: 10px; }
.thread-details { color: #5c6d4f; }
.editor-heading h2 { font-size: 36px; font-weight: 500; color: #303e32; }
.editor-fields label { color: #6a765f; }
.editor-fields input { font-size: 12px; color: #38492f; }
.ai-controls>label { color: #546e42; font-size: 11px; }
.instruction-input { background: #f4f5ed; border-color: #d7ddc9; border-radius: 4px; }
.instruction-input input { font-size: 11px; }
.ai-button { background: #e4e9d5; color: #4e663c; }
.ai-button:hover { background: #d8e0c4; }
.ai-controls>p { color: #67765a; font-size: 9px; }
.dictate-button { color: #597148; }
.dictation-strip>span, .draft-save-status, .send-assurance { color: #67775a; }
.modal { background: #fff; border-color: #d6d2c6; border-radius: 6px; }
.modal::backdrop { background: #28342bad; }
.modal-heading h2 { color: #303e32; font-size: 34px; font-weight: 500; }
.settings-section h3 { color: #35462e; font-weight: 600; }
.section-number { background: #f2ede4; color: #80663f; }
.optional-label { color: #657751; }
.privacy-note { color: #576c46; background: #f3f5ec; border-color: #dce1cd; }
.review-meta span { color: #6d795f; }
.toast { background: #303e32; color: #fff; border-color: #7f8b72; border-radius: 5px; }
.toast button { color: #e1d4be; }
.auth-story { background: #303e32; color: #fff; }
.auth-story:after { border-color: #c3a57528; box-shadow: 0 0 0 55px #c3a57508, 0 0 0 110px #c3a57505; }
.auth-story .wordmark { width: min(280px, 100%); align-self: flex-start; gap: 15px; }
.auth-story .brand-lockup { padding: 15px 22px 20px; gap: 4px; }
.auth-story .brand-emblem { width: 80px; height: 80px; }
.auth-story .brand-wordmark-image { max-width: 240px; }
.auth-story .brand-product { color: #d6c3a5; font-size: 9px; letter-spacing: 3px; }
.auth-story .eyebrow { color: #d6bd94; letter-spacing: 2px; }
.auth-story h1 { font-size: clamp(49px, 5vw, 76px); font-weight: 400; letter-spacing: -1.6px; line-height: 1.04; }
.auth-story-copy>p, .story-note { color: #c7d0bc; }
.story-note strong { color: #f1eadc; }
.auth-footer { color: #b5c2a8; }
.auth-form-wrap { background: #fff; }
.auth-form-card h2 { font-size: 44px; font-weight: 500; }
.auth-divider span { background: #fff; }
@media (min-width: 1550px) {
  .sidebar { width: 260px; padding-left: 25px; padding-right: 25px; }
  .mail-card-name { font-size: 12px; }
  .mail-card-subject { font-size: 13px; }
  .mail-card-preview { font-size: 12px; }
  .message-body, .draft-body, .review-body { font-size: 14px; }
}
@media (max-width: 1150px) {
  .sidebar { width: 205px; padding: 24px 15px 0; }
  .brand-lockup { padding: 9px 10px 12px; }
  .brand-emblem { width: 46px; height: 46px; }
  .brand-product { font-size: 7px; letter-spacing: 1.7px; }
  .workspace-heading .eyebrow { font-size: 7px; letter-spacing: .8px; }
  .compose-button { margin-top: 24px; margin-bottom: 25px; }
  .ai-prompt-card .text-button { margin-left: 36px; }
}
@media (max-width: 900px) {
  .sidebar { width: 190px; padding-left: 12px; padding-right: 12px; }
  .brand-emblem { width: 43px; height: 43px; }
  .auth-story .wordmark { width: min(240px, 100%); }
  .auth-story .brand-emblem { width: 65px; height: 65px; }
  .auth-story h1 { font-size: 53px; }
  .message-content h2 { font-size: 30px; }
  .editor-heading h2 { font-size: 32px; }
}
@media (max-width: 760px) {
  .sidebar { width: 250px; padding: 25px 22px 0; }
  .brand-emblem { width: 53px; height: 53px; }
  .brand-product { font-size: 8px; letter-spacing: 2px; }
  .workspace-header { padding: 0 15px; }
  .workspace-heading { min-width: 0; gap: 8px; }
  .workspace-heading .eyebrow { max-width: 170px; font-size: 8px; line-height: 1.5; letter-spacing: .85px; white-space: normal; }
  .header-actions { flex-shrink: 0; }
  .connection-status { font-size: 8px; }
  .list-title-row h1 { font-size: 43px; }
  .mail-card-name, .mail-card-subject { font-size: 12px; }
  .mail-card-preview { font-size: 11px; }
  .mail-card-time { font-size: 10px; }
  .message-content h2 { font-size: 35px; }
  .message-body, .draft-body, .review-body { font-size: 13px; }
  .sender-details>span, .message-date { font-size: 9px; }
  .editor-heading h2 { font-size: 35px; }
  .instruction-input input { min-width: 0; }
  .auth-story { min-height: 0; padding: 24px 28px 32px; }
  .auth-story .wordmark { width: 210px; }
  .auth-story .brand-lockup { padding: 10px 18px 14px; }
  .auth-story .brand-emblem { width: 52px; height: 52px; }
  .auth-story .brand-product { font-size: 8px; letter-spacing: 2px; }
  .auth-story-copy { padding-top: 32px; }
  .auth-story h1 { font-size: 43px; }
  .auth-story h1 br { display: block; }
  .auth-story-copy>p { max-width: 330px; }
  .auth-form-card h2 { font-size: 36px; }
}
@media (max-width: 390px) {
  .workspace-heading .eyebrow { max-width: 148px; font-size: 8px; letter-spacing: .7px; }
  .connection-status { font-size: 7px; }
  .message-content h2 { font-size: 32px; }
  .sender-details>span { max-width: 145px; }
  .auth-story h1 { font-size: 39px; }
}
@media (max-height: 760px) {
  .sidebar .brand-emblem { width: 39px; height: 39px; }
  .sidebar .brand-lockup { padding-top: 7px; padding-bottom: 10px; }
  .sidebar .wordmark { gap: 8px; }
  .sidebar .compose-button { margin-top: 22px; margin-bottom: 22px; }
  .assistant-note { padding-top: 18px; padding-bottom: 18px; margin-bottom: 8px; }
}
@media (max-height: 650px) {
  .sidebar { padding-top: 18px; overflow-y: auto; }
  .sidebar .brand-lockup { flex-direction: row; gap: 9px; padding: 10px; }
  .sidebar .brand-emblem { width: 37px; height: 37px; flex-shrink: 0; }
  .sidebar .brand-wordmark-image { width: calc(100% - 46px); }
  .assistant-note { display: none; }
  .sidebar-bottom { padding-top: 24px; }
  .account { margin-top: 13px; padding-top: 16px; padding-bottom: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
