/* Pioneers workspace — ivory foundations, burgundy actions, bronze details. */
:root {
  --pioneers-border: #e2dcd2;
  --pioneers-border-light: #eee9e1;
  --pioneers-muted: #716b63;
  --shadow-card: 0 5px 24px #30241905;
}
html, body { font-family: var(--font-latin); }
html[dir="rtl"] body, [dir="rtl"] { font-family: var(--font-arabic); }
body { font-size: 14px; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:disabled { opacity: .5; cursor: not-allowed; }
button { touch-action: manipulation; }
a { color: var(--pioneers-burgundy); }
svg { flex-shrink: 0; }
[hidden] { display: none !important; }
::selection { background: #edd5df; color: #651331; }
* { scrollbar-width: thin; scrollbar-color: #d7cfc3 transparent; }
.app-container { height: 100dvh; min-height: 0; overflow: hidden; }
.app-sidebar { width: 232px; height: 100%; background: #fff; border-color: var(--pioneers-border-light); }
.sidebar-header { min-height: 84px; padding: 22px; border: 0; }
.brand-symbol { width: 42px; height: 44px; border-radius: 13px 13px 5px 13px; }
.brand-text strong { display: block; font-family: var(--font-latin); font-size: 25px; font-weight: 800; letter-spacing: -.9px; color: var(--pioneers-ink); line-height: 1.25; }
.brand-text strong span { font-size: inherit; color: var(--pioneers-burgundy); letter-spacing: inherit; }
.brand-text small { display: block; font: 8px var(--font-latin); letter-spacing: 1.5px; color: #83745d; margin-top: 3px; }
.workspace-label { margin: 3px 16px 10px; background: var(--pioneers-canvas); padding: 11px; border: 1px solid var(--pioneers-border-light); border-radius: 12px; display: flex; gap: 10px; align-items: center; }
.workspace-label strong { display: block; font-size: 12px; }
.workspace-label small { font-size: 10px; color: var(--pioneers-muted); }
.workspace-monogram { width: 32px; height: 32px; background: var(--pioneers-surface); border-radius: 9px; display: grid; place-items: center; color: #79633d; font-weight: 700; }
.sidebar-nav { padding: 0 13px 12px; gap: 3px; }
.nav-section-title { font-size: 10px; color: #8a8277; padding: 21px 12px 8px; letter-spacing: 1px; }
.nav-link-pioneers { padding: 10px 12px; font-size: 12.5px; min-height: 40px; border-radius: 9px; color: #58544e; gap: 11px; }
.nav-link-pioneers:not(.active):hover { background: var(--pioneers-canvas); color: var(--pioneers-burgundy-dark); }
.nav-link-pioneers.active { box-shadow: 0 4px 12px #7c193f1c; }
.nav-link-pioneers.active:hover,
.nav-link-pioneers.active:focus-visible { background: var(--pioneers-burgundy-dark); color: #fff; }
.sidebar-guide { margin: 10px 15px; padding: 14px 11px; border: 1px solid #e8ddca; background: #faf7f1; border-radius: 12px; display: flex; gap: 9px; align-items: center; color: #7a623b; }
.sidebar-guide strong { display: block; font-size: 11.5px; }
.sidebar-guide div span { color: var(--pioneers-muted); font-size: 10px; }
.sidebar-footer { font-size: 10px; color: #8a8173; text-align: center; padding: 10px 12px 18px; }
.brand-star { color: var(--pioneers-bronze); }
.app-main { overflow: hidden; }
.app-header { flex-shrink: 0; height: 76px; padding: 0 30px; background: #fcfaf6eF; border-bottom: 1px solid var(--pioneers-border-light); }
.header-context, .header-actions { display: flex; align-items: center; gap: 14px; min-width: 0; }
.header-context { font-size: 12px; }
.header-context strong { font-weight: 600; white-space: nowrap; }
.header-workspace { color: var(--pioneers-muted); }
.header-divider { color: #c4bbaa; }
.workspace-search-trigger { display: flex; align-items: center; gap: 10px; border: 1px solid var(--pioneers-border-light); border-radius: 10px; background: #fff; color: var(--pioneers-muted); font-size: 11px; padding: 9px 12px; cursor: pointer; }
kbd { font: 10px var(--font-latin); padding: 2px 5px; border: 1px solid var(--pioneers-border-light); border-radius: 4px; background: var(--pioneers-canvas); color: var(--pioneers-muted); white-space: nowrap; }
.header-help { font-family: var(--font-latin); font-weight: 700; width: 31px; height: 31px; border-radius: 50%; }
.user-avatar { width: 36px; height: 36px; border-radius: 12px; background: #ede4d4; color: #71542e; font-size: 12px; font-weight: 700; display: grid; place-items: center; flex-shrink: 0; }
.profile-menu { position: relative; }
.profile-menu summary { display: flex; align-items: center; gap: 9px; cursor: pointer; list-style: none; }
.profile-menu summary::-webkit-details-marker { display: none; }
.profile-name { max-width: 110px; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-popover { position: absolute; inset-inline-end: 0; top: calc(100% + 14px); padding: 20px; width: 260px; display: grid; gap: 10px; background: #fff; border: 1px solid var(--pioneers-border); border-radius: 14px; box-shadow: var(--shadow-elevated); z-index: 45; font-size: 12px; }
.app-content-wrapper { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.app-content { padding: 30px 34px 42px; scrollbar-gutter: stable; min-width: 0; width: 100%; }
.page-heading { display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap; margin-bottom: 24px; }
.page-heading h1 { font-size: 26px !important; letter-spacing: -.5px; }
.page-heading p { max-width: 740px; line-height: 1.8; }
.page-heading > div:last-child { flex-wrap: wrap; }
.eyebrow { display: inline-flex; align-items: center; gap: 7px; color: #8b7350; font-size: 10px; font-weight: 700; letter-spacing: 1.5px; }
[dir="rtl"] .eyebrow { letter-spacing: .2px; font-size: 11px; }
.workspace-banner { display: grid; grid-template-columns: 1.4fr 1fr; min-height: 235px; background: var(--pioneers-surface); border: 1px solid #e7dfd2; border-radius: 20px; overflow: hidden; margin-bottom: 24px; position: relative; }
.banner-copy { padding: 28px 32px; align-self: center; z-index: 1; }
.banner-copy h2 { font-size: clamp(23px, 2.25vw, 33px); line-height: 1.45; letter-spacing: -.6px; margin: 8px 0; font-weight: 700; }
.banner-copy p { max-width: 500px; color: #746b5d; font-size: 12.5px; line-height: 1.8; }
.banner-actions { display: flex; gap: 10px; align-items: center; margin-top: 19px; }
.banner-art { position: relative; min-height: 100%; overflow: hidden; }
.banner-art img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; object-position: 50% 58%; }
.workspace-banner.compact { min-height: 160px; grid-template-columns: 1.8fr 1fr; }
.compact .banner-copy { padding-block: 22px; }
.compact .banner-copy h2 { font-size: 24px; }
.pioneers-card { border-color: var(--pioneers-border-light); box-shadow: var(--shadow-card); border-radius: 15px; }
.pioneers-card-header { border: 0; padding-bottom: 0; margin-bottom: 22px; }
.btn-pioneers-primary, .btn-pioneers-secondary, .btn-pioneers-bronze { min-height: 39px; font-size: 12px; border-radius: 9px; padding: 9px 14px; }
.btn-pioneers-primary { box-shadow: 0 3px 8px #7c193f10; }
.btn-pioneers-primary:active, .btn-pioneers-secondary:active { transform: translateY(1px); }
.btn-pioneers-secondary.active { border-color: #caa9b7; background: var(--pioneers-burgundy-light); color: var(--pioneers-burgundy); }
.btn-pioneers-bronze, .composer-tab-btn.note-active { color: var(--pioneers-ink); }
.btn-pioneers-sm { font-size: 11px; padding: 6px 10px; min-height: 31px; }
.pioneers-input, .pioneers-select, .pioneers-textarea { min-height: 41px; border-color: #e4ded4; font-size: 12.5px; }
.pioneers-input::placeholder, .pioneers-textarea::placeholder { color: #9a9389; }
.pioneers-table { text-align: start; }
.pioneers-table th { text-align: start; font-size: 10.5px; letter-spacing: .4px; background: #faf8f4; color: #867d70; padding: 15px 20px; white-space: nowrap; }
.pioneers-table td { padding: 18px 20px; font-size: 12px; }
.pioneers-card:has(> .pioneers-table) { overflow-x: auto !important; }
.pioneers-table tbody tr:last-child td { border-bottom: 0; }
.metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.metric-card { padding: 21px !important; position: relative; overflow: hidden; }
.metric-card::after { content: ''; position: absolute; inset-inline-end: 20px; top: 20px; width: 7px; height: 7px; background: var(--pioneers-bronze); border-radius: 50%; }
.metric-card:nth-child(2)::after, .metric-card:nth-child(3)::after { background: var(--pioneers-burgundy); }
.metric-card .label-caps { font-size: 11px; font-weight: 500; letter-spacing: 0; }
.metric-card > div:nth-child(2) { font: 800 32px var(--font-latin) !important; color: var(--pioneers-ink) !important; margin-top: 12px !important; }
.charts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.svg-bar-track { height: 7px; margin-top: 9px; }
.svg-bar-fill-charcoal { background: #b39a6d; }
.svg-bar-fill-burgundy { background: #7c193f; }
.section-label { display: flex; align-items: center; gap: 10px; margin: 27px 0 17px; font-size: 15px; font-weight: 600; }
.section-label span { color: var(--pioneers-muted); font-size: 11px; font-weight: 400; }
.quick-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 24px; }
.quick-link { display: flex; align-items: center; gap: 13px; border: 1px solid var(--pioneers-border-light); padding: 16px 19px; border-radius: 12px; background: #fff; color: var(--pioneers-ink); transition: border-color .15s; }
.quick-link:hover { border-color: var(--pioneers-bronze); }
.quick-link > svg { color: var(--pioneers-burgundy); }
.quick-link strong { display: block; font-size: 12px; }
.quick-link small { display: block; font-size: 10px; color: var(--pioneers-muted); margin-top: 3px; }
.quick-link > span:last-child { margin-inline-start: auto; color: var(--pioneers-bronze); }
.feedback-banner { display: flex; gap: 14px; align-items: center; justify-content: space-between; border: 1px solid #e4c8cd; background: var(--state-danger-bg); color: var(--state-danger); padding: 13px 18px; border-radius: 10px; margin-bottom: 18px; font-size: 12px; }
.loading-state { display: grid; gap: 13px; padding: 30px; color: var(--pioneers-muted); text-align: center; }
.skeleton { height: 80px; border-radius: 12px; background: linear-gradient(90deg,#f2eee6 25%,#fbf9f5 50%,#f2eee6 75%); background-size: 200% 100%; animation: shimmer 1.8s infinite; }
@keyframes shimmer { to { background-position: -200% 0; } }
.inbox-page-header { display: flex; align-items: center; justify-content: space-between; padding: 20px 26px 16px; flex-shrink: 0; gap: 14px; }
.inbox-page-header h1 { font-size: 23px; }
.inbox-page-header p { font-size: 11px; color: var(--pioneers-muted); margin-top: 3px; }
.inbox-container { flex: 1; min-height: 0; height: auto; margin: 0 24px 22px; border: 1px solid var(--pioneers-border); border-radius: 16px; grid-template-columns: 165px 290px minmax(0,1fr); background: #fff; }
.inbox-queues-pane { background: #faf8f4; padding: 16px 10px; gap: 14px; border-color: var(--pioneers-border-light); }
.inbox-queues-pane > div:first-child { padding: 0 5px 10px; font-size: 13px !important; }
.queue-buttons { display: flex; flex-direction: column; gap: 4px; }
.inbox-queue-item { padding: 9px 8px; font-size: 11px; }
.inbox-queue-item.active { background: #eee2e6; color: var(--pioneers-burgundy); }
.inbox-queue-item.active .badge-count { background: #7c193f; color: #fff; }
.badge-count { min-width: 22px; text-align: center; background: #eae5db; font-size: 10px; }
.inbox-list-pane { border-color: var(--pioneers-border-light); min-height: 0; }
.inbox-list-header { padding: 16px 13px 13px; }
.inbox-items-scroll { padding: 6px; }
.conv-card-item { border: 1px solid transparent; border-radius: 11px; margin-bottom: 4px; padding: 14px 10px; gap: 10px; }
.conv-card-item.selected { border: 1px solid #e5c6d1; background: #fbf4f6; }
.conv-contact-name { font-size: 12px; }
.conv-preview { width: 100%; font-size: 11.5px; }
.conv-time { font-size: 9px; white-space: nowrap; }
.badge-pioneers { font-size: 9.5px; padding: 3px 7px; }
.inbox-workspace-pane { position: relative; background: #fcfaf6; min-width: 0; }
.workspace-top-bar { padding: 15px 18px; gap: 14px; flex-wrap: wrap; }
.workspace-top-bar > div { flex-wrap: wrap; }
.workspace-top-bar h2 { font-size: 14px !important; }
.workspace-top-bar .pioneers-select { min-height: 31px; max-width: 145px; }
.workspace-body { position: relative; }
.workspace-messages-area { padding: 23px; background-image: radial-gradient(#d6cfc155 .7px, transparent .7px); background-size: 15px 15px; }
.msg-row { max-width: 88%; }
.bubble-inbound { background: #fff; border-color: #e8e1d6; box-shadow: 0 2px 4px #30241903; }
.bubble-outbound { background: #f2e5eb; border-color: #ead3dd; }
.bubble-inbound, .bubble-outbound { padding: 12px 15px; overflow-wrap: anywhere; }
.bubble-internal { background: #faf3e5; }
.workspace-composer { padding: 13px 18px; }
.workspace-composer textarea { border: 1px solid #e5ded3; min-height: 75px; max-height: 160px; font-size: 13px; }
.composer-tabs { gap: 14px; margin-bottom: 10px; }
.composer-tab-btn { border: 0; border-radius: 0; padding: 4px 0 7px; background: transparent; font-size: 11px; color: var(--pioneers-muted); border-bottom: 2px solid transparent; }
.composer-tab-btn.active { background: transparent; color: var(--pioneers-burgundy); border-bottom-color: var(--pioneers-burgundy); }
.composer-tab-btn.note-active { background: transparent; color: #7a623b; border-bottom-color: #b39a6d; }
.composer-actions-bar { gap: 8px; flex-wrap: wrap; }
.composer-actions-bar > div { flex-wrap: wrap; }
.conversation-drawer { position: absolute; inset-block: 0; inset-inline-end: 0; width: min(340px,100%); background: #faf7f1; padding: 18px; overflow-y: auto; z-index: 5; border-inline-start: 1px solid var(--pioneers-border); box-shadow: -10px 0 30px #18171512; }
.empty-workspace { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; padding: 28px; text-align: center; }
.empty-workspace img { width: min(260px,70%); aspect-ratio: 1.25; object-fit: cover; border-radius: 90px 90px 20px 20px; margin-bottom: 22px; }
.empty-workspace h3 { font-size: 21px; }
.empty-workspace p { color: var(--pioneers-muted); max-width: 320px; line-height: 1.8; margin-top: 10px; font-size: 12px; }
.inbox-mobile-back, .filter-toggle { display: none; }
.draft-hint { font-size: 10px; color: #89765c; margin-inline-start: auto; }
.pioneers-modal-backdrop { backdrop-filter: blur(5px); background: #18171555; padding: 18px; }
.pioneers-modal-dialog { width: min(620px,100%); border: 1px solid #e8e0d4; border-radius: 20px; max-height: 88dvh; display: flex; flex-direction: column; box-shadow: 0 30px 90px #18171530; }
.modal-header, .modal-footer { padding: 20px 24px; flex-shrink: 0; }
.modal-body { overflow-y: auto; padding: 24px; min-height: 0; }
.modal-footer { background: #fcfaf6; }
.contact-profile-header { display: flex; gap: 16px; align-items: center; padding: 20px; background: #faf7f1; border-radius: 12px; margin-bottom: 22px; }
.contact-profile-header .user-avatar { width: 54px; height: 54px; font-size: 18px; }
.profile-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.profile-fields dt { font-size: 11px; color: var(--pioneers-muted); margin-bottom: 6px; }
.profile-fields dd { font-size: 13px; overflow-wrap: anywhere; }
.article-card { min-height: 210px; }
.article-category-icon { width: 42px; height: 42px; display: grid; place-items: center; color: #7c193f; background: #f5eaf0; border-radius: 12px; margin-bottom: 17px; }
.article-preview { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.article-content { white-space: pre-wrap; line-height: 1.9; font-size: 14px; }
.guide-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.guide-card { padding: 26px; }
.guide-number { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #e3d3b9; color: #8b7350; border-radius: 50%; font-family: var(--font-latin); font-size: 12px; margin-bottom: 18px; }
.guide-card h3 { margin-bottom: 12px; }
.guide-card p { color: var(--pioneers-muted); font-size: 13px; line-height: 1.9; margin-bottom: 20px; }
.command-dialog { margin: auto; width: min(560px,calc(100% - 32px)); max-height: 80dvh; border: 1px solid var(--pioneers-border); padding: 23px; border-radius: 18px; box-shadow: var(--shadow-elevated); color: var(--pioneers-ink); background: #fff; }
.command-dialog::backdrop { background: #18171566; backdrop-filter: blur(4px); }
.command-heading { display: flex; gap: 16px; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.command-heading h2 { font-size: 18px; }
.command-results { max-height: 45dvh; overflow-y: auto; display: grid; gap: 4px; margin-top: 15px; }
.command-results a { display: flex; gap: 13px; padding: 12px; color: var(--pioneers-ink); border-radius: 8px; font-size: 13px; }
.command-results a:hover { background: #f9f1f4; color: #7c193f; }
.command-empty { padding: 20px 0; font-size: 12px; color: var(--pioneers-muted); }
.command-dialog footer { border-top: 1px solid var(--pioneers-border-light); padding-top: 12px; margin-top: 12px; color: var(--pioneers-muted); font-size: 11px; }
.skip-link { position: fixed; top: -90px; inset-inline-start: 24px; background: #7c193f; color: #fff; padding: 12px 20px; z-index: 100; border-radius: 8px; }
.skip-link:focus { top: 10px; color: #fff; }
.nav-scrim, .mobile-nav-button { display: none; }
.account-shell { display: block; padding: 0; min-height: 100dvh; background: #fcfaf6; }
.login-experience { min-height: 100dvh; display: grid; grid-template-columns: 1fr 1fr; padding: 18px; gap: 18px; }
.login-form-panel { padding: 20px 40px 14px; display: flex; flex-direction: column; }
.login-top { display: flex; justify-content: space-between; align-items: center; }
.login-wordmark { font: 800 27px var(--font-latin); letter-spacing: -1px; color: #181715; }
.login-wordmark > span { color: #7c193f; }
.login-wordmark small { display: block; font-size: 8px; letter-spacing: 1.5px; color: #8b7350; margin-top: 3px; }
.account-card { width: 100%; max-width: 410px; margin: auto; padding: 60px 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.account-card h1 { font-size: 39px; letter-spacing: -.7px; margin: 14px 0 12px; }
.account-sub { font-size: 14px; margin-bottom: 34px; line-height: 1.9; }
.account-field { gap: 9px; font-size: 12px; }
.account-field input { height: 49px; font-size: 14px; border-radius: 10px; background: #fff; }
.account-form { gap: 21px; }
.account-submit { min-height: 49px; justify-content: space-between; padding-inline: 20px; font-size: 14px; }
.password-field { position: relative; }
.password-field input { padding-inline-end: 64px; }
.password-toggle { position: absolute; inset-inline-end: 10px; top: 7px; height: 35px; border: 0; color: #7c193f; background: transparent; font-size: 11px; padding: 6px; cursor: pointer; }
.login-support { color: var(--pioneers-muted); font-size: 11px; text-align: center; margin-top: 24px; line-height: 1.8; }
.login-footer { display: flex; justify-content: space-between; font-size: 10px; color: #8b8275; margin-top: auto; }
.login-art-panel { border-radius: 22px; position: relative; overflow: hidden; background: #eee1cc; min-height: 650px; }
.login-art-panel > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; }
.login-art-panel::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,#271820ed 0%,#271820a0 23%,transparent 60%); }
.login-art-label { position: relative; z-index: 1; display: flex; align-items: center; gap: 9px; margin: 30px; color: #583e28; font: 600 10px var(--font-latin); letter-spacing: 2px; }
.login-story { position: absolute; bottom: 45px; inset-inline: 40px; z-index: 1; color: #fff; }
.login-story .eyebrow { color: #dec9a7; }
.login-story h2 { color: #fff; font-size: clamp(29px,3vw,44px); line-height: 1.45; white-space: pre-line; margin: 15px 0; }
.login-story p { color: #eadfda; max-width: 430px; font-size: 13px; line-height: 1.9; }
.login-channel-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.login-channel-tags span { padding: 5px 12px; border: 1px solid #ffffff35; border-radius: 30px; color: #f5eee6; font: 10px var(--font-latin); }
@media (min-width: 1600px) {
  .inbox-container { grid-template-columns: 190px 330px minmax(0,1fr); }
  .app-content { padding-inline: 44px; }
}
@media (max-width: 1250px) {
  .app-sidebar { width: 205px; }
  .app-header { padding-inline: 22px; }
  .header-workspace, .header-divider, .profile-name, .workspace-search-trigger kbd { display: none; }
  .app-content { padding: 24px; }
  .inbox-container { grid-template-columns: 260px minmax(0,1fr); margin-inline: 18px; }
  .inbox-queues-pane { display: none; position: absolute; inset-inline-start: 0; top: 0; bottom: 0; width: 215px; z-index: 10; box-shadow: var(--shadow-elevated); }
  .inbox-container { position: relative; }
  .inbox-container.filters-open .inbox-queues-pane { display: flex; }
  .filter-toggle { display: inline-flex; }
  .login-form-panel { padding-inline: 24px; }
}
@media (max-width: 900px) {
  .app-container { display: flex; height: 100dvh; }
  .app-sidebar { position: fixed; z-index: 60; top: 0; bottom: 0; inset-inline-start: 0; width: 260px; max-height: none; height: 100dvh; transform: translateX(-100%); transition: transform .2s; visibility: hidden; }
  [dir="rtl"] .app-sidebar { transform: translateX(100%); }
  .nav-open .app-sidebar { transform: translateX(0); visibility: visible; }
  .nav-open .nav-scrim { display: block; position: fixed; inset: 0; border: 0; background: #18171566; backdrop-filter: blur(3px); z-index: 59; }
  .mobile-nav-button { display: inline-flex; }
  .app-header { height: 68px; min-height: 68px; flex-wrap: nowrap; padding: 0 18px; }
  .header-actions, .header-context { gap: 10px; }
  .header-context strong { font-size: 11px; }
  .app-content-wrapper { overflow: hidden !important; }
  .inbox-container { display: grid; grid-template-columns: 270px minmax(0,1fr); height: auto; min-height: 0; overflow: hidden; flex-direction: initial; }
  .inbox-list-pane { min-height: 0; border: 0; border-inline-end: 1px solid var(--pioneers-border-light); }
  .inbox-workspace-pane { min-height: 0; }
  .inbox-queues-pane { border-bottom: 0; }
  .workspace-top-bar { padding: 12px; }
  .workspace-messages-area { padding: 15px; }
  .charts-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .workspace-banner { grid-template-columns: 1.3fr 1fr; }
  .banner-copy { padding: 22px; }
  .login-experience { grid-template-columns: 1.1fr 1fr; padding: 12px; gap: 0; }
  .login-form-panel { padding: 20px; }
  .login-story { inset-inline: 23px; bottom: 30px; }
}
@media (max-width: 640px) {
  .app-header { padding-inline: 12px; gap: 8px; }
  .header-context strong, .workspace-search-trigger span, .header-help, .profile-chevron { display: none; }
  .workspace-search-trigger { padding: 9px; border-radius: 50%; }
  .header-actions { gap: 9px; }
  .app-content { padding: 22px 16px; }
  .page-heading { gap: 14px; margin-bottom: 20px; }
  .page-heading h1 { font-size: 23px !important; }
  .page-heading p { font-size: 12px !important; }
  .workspace-banner, .workspace-banner.compact { grid-template-columns: 1fr; }
  .banner-art { height: 125px; min-height: 0; }
  .banner-art img { object-position: 50% 48%; }
  .banner-copy { padding: 22px; }
  .banner-copy h2 { font-size: 25px; }
  .metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .metric-card { padding: 16px !important; }
  .metric-card::after { display: none; }
  .metric-card > div:nth-child(2) { font-size: 27px !important; }
  .charts-grid, .quick-links, .guide-grid { grid-template-columns: 1fr; }
  .quick-links { gap: 8px; }
  .quick-link { padding: 13px 16px; }
  .pioneers-table { min-width: 620px; }
  .app-content div[style*="grid-template-columns"]:not(.metric-grid):not(.quick-links) { grid-template-columns: minmax(0,1fr) !important; }
  .app-content div[style*="display: flex"] { flex-wrap: wrap; }
  .inbox-page-header { padding: 16px; }
  .inbox-page-header p { max-width: 210px; }
  .inbox-container { grid-template-columns: minmax(0,1fr); margin: 0 10px 10px; }
  .inbox-container .inbox-workspace-pane { display: none; }
  .inbox-container.thread-open .inbox-list-pane { display: none; }
  .inbox-container.thread-open .inbox-workspace-pane { display: flex; }
  .inbox-mobile-back { display: inline-flex; flex-shrink: 0; }
  .workspace-top-bar > div { gap: 7px !important; }
  .workspace-top-bar { gap: 10px; }
  .workspace-top-bar h2 { max-width: 170px; }
  .workspace-top-bar .badge-pioneers { font-size: 9px; }
  .workspace-composer { padding: 12px; }
  .workspace-composer textarea { font-size: 16px; }
  .composer-actions-bar .text-muted { display: none; }
  .workspace-messages-area { padding: 17px 12px; }
  .msg-row { max-width: 94%; }
  .draft-hint { display: none; }
  .login-experience { display: flex; flex-direction: column; padding: 0; }
  .login-form-panel { min-height: 100dvh; padding: 24px; }
  .account-card { padding: 50px 0; }
  .account-card h1 { font-size: 35px; }
  .login-art-panel { display: none; }
  .pioneers-modal-backdrop { padding: 10px; }
  .modal-header, .modal-footer, .modal-body { padding: 18px; }
  .profile-fields { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
.page-search { display: flex; align-items: center; gap: 11px; margin-bottom: 22px; background: #fff; border: 1px solid var(--pioneers-border-light); border-radius: 12px; padding: 7px 15px; color: var(--pioneers-muted); max-width: 600px; }
.page-search input { border: 0; background: transparent; min-width: 0; }
.page-search input:focus { outline: 0; box-shadow: none; }
.page-search:focus-within { outline: 2px solid #7c193f; outline-offset: 2px; }
.field-help { color: var(--pioneers-muted); font-size: 11px; line-height: 1.8; margin-top: 8px; }
.canned-response-choice { background: #fff; text-align: start; }
.canned-response-choice:hover { background: #faf5f7; }