/* Refined Home for the messenger study. The original experience stays recoverable. */
body { --orange:#e94728; --ink:#2a2926; --muted:#878179; --line:#eae5dd; --paper:#fff; --cream:#f8f6f2; background:#f0ede8; }
.desk { border:1px solid #fff; border-radius:24px; box-shadow:0 22px 70px #352b1e10; }
.desk-header { padding:19px 23px 8px; }
.desk-header img { width:190px; margin-left:-8px; }
.icon-button { width:32px; height:32px; font-size:19px; border-color:#ffffff38; background:transparent; }
.hero { padding:12px 24px 27px; min-height:76px; }
.hero h1 { font-size:28px; font-weight:650; letter-spacing:-1.1px; max-width:calc(100% - 46px); line-height:1.2; }
.mascot { width:55px; height:66px; right:17px; bottom:15px; }
.screen { scrollbar-width:thin; scrollbar-color:#ddd7ce transparent; }
.home-content { padding:20px; }
.home-icon { width:18px; height:18px; display:block; flex:0 0 auto; }
.start-card { border:1px solid #eee7dd; border-radius:17px; padding:17px 16px; gap:13px; box-shadow:0 3px 10px #30241904; transition:background .15s,border-color .15s; }
.start-card:hover { border-color:#ecc6af; background:#fffaf6; }
.card-icon { width:42px; height:42px; background:#ffede2; color:#df4b24; border-radius:13px; }
.card-icon .home-icon { width:23px; height:23px; }
.start-card strong { font-size:14px; font-weight:600; }
.start-card small { color:#888077; font-size:11px; margin-top:4px; }
.start-card .arrow { display:grid; place-items:center; width:28px; height:28px; flex:0 0 28px; border:1px solid #f3e5d9; border-radius:50%; color:#cd542d; }
.start-card .arrow .home-icon { width:14px; height:14px; }
.home-help { margin-top:16px; border:1px solid #ece6dd; border-radius:17px; padding:16px 16px 3px; }
.section-heading { margin-bottom:13px; }
.section-heading h2 { font-size:14px; letter-spacing:-.2px; }
.text-button { display:inline-flex; align-items:center; gap:5px; font-size:11px; color:#b4512f; }
.text-button .home-icon { width:12px; height:12px; }
.home-search { border:1px solid #ece6df; background:#f7f5f1; height:42px; border-radius:11px; margin-bottom:5px; padding:0 10px; }
.home-search input { font-size:12px; }
.home-search input::placeholder { color:#938a81; }
.home-search button { display:grid; place-items:center; }
.home-search button .home-icon { width:15px; height:15px; }
.home-faq { min-height:44px; font-size:12px; border-color:#efebe5; padding:11px 0; gap:12px; }
.home-faq > span { color:#ab9e91; }
.home-faq .home-icon { width:14px; height:14px; }
.home-faq:hover { color:#b64b29; }
.home-direct { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:17px; }
.home-direct .direct-card { position:relative; display:flex; flex-direction:column; align-items:flex-start; min-height:124px; padding:14px 13px; border:1px solid #ebdfd1; border-radius:15px; background:#f2e9dd; color:#493c30; transition:border-color .15s,background .15s; }
.home-direct .client-card { background:#eef0ed; border-color:#e0e5df; color:#39433b; }
.home-direct .direct-icon { display:grid; place-items:center; margin:0 0 11px; width:29px; height:29px; border-radius:9px; color:#8a6447; background:#ffffff8a; }
.home-direct .client-card .direct-icon { color:#647268; }
.direct-icon .home-icon { width:18px; height:18px; }
.home-direct strong { display:block; font-size:12px; font-weight:600; line-height:1.4; letter-spacing:-.1px; }
.home-direct small { display:block; font-size:10px; font-weight:400; line-height:1.45; color:#88796b; margin-top:4px; }
.home-direct .client-card small { color:#78847b; }
.home-direct .direct-arrow { position:absolute; top:19px; right:13px; margin:0; color:#9c856e; }
.home-direct .client-card .direct-arrow { color:#849186; }
.direct-arrow .home-icon { width:15px; height:15px; }
.home-direct .team-card:hover { background:#eee2d3; border-color:#d4bea5; }
.home-direct .client-card:hover { background:#e7ece6; border-color:#bdcaba; }
.tabs { border-top:1px solid #eee8df; padding:10px 16px 7px; gap:7px; }
.tabs button { min-height:51px; font-size:11px; border-radius:12px; color:#888075; }
.tabs button.active { background:#fff0e6; color:#c74826; }
.tabs svg { width:20px; height:20px; }
.embed-disclosure { color:#a4988d; }
.article-link .arrow { flex:0 0 auto; }
.secondary { display:flex; align-items:center; justify-content:center; gap:8px; }
.secondary .home-icon { width:15px; height:15px; }
.embedded .desk { border-radius:0; }
@media(max-width:360px) {
  .desk-header { padding:16px 17px 8px; }
  .desk-header img { width:177px; }
  .hero { padding:12px 18px 24px; min-height:74px; }
  .hero h1 { font-size:24px; max-width:calc(100% - 37px); letter-spacing:-.9px; }
  .mascot { width:44px; height:58px; right:12px; bottom:14px; }
  .home-content { padding:16px 13px; }
  .start-card { padding:14px 12px; gap:10px; }
  .card-icon { width:36px; height:38px; }
  .start-card strong { font-size:13px; }
  .start-card small { font-size:10px; }
  .start-card .arrow { width:24px; height:24px; flex-basis:24px; }
  .home-help { padding:15px 13px 3px; }
  .home-faq { font-size:11px; }
  .home-direct { gap:9px; }
  .home-direct .direct-card { padding:12px 11px; min-height:123px; }
  .home-direct .direct-arrow { right:11px; top:17px; }
  .home-direct strong { font-size:11px; }
  .home-direct small { font-size:9px; }
}
/* Keep both direct support cards comfortably in the compact Home viewport. */
.desk-header { padding-top:14px; }
.hero { min-height:64px; padding-top:8px; padding-bottom:20px; }
.home-content { padding-top:18px; padding-bottom:18px; }
.home-faq { min-height:42px; padding-top:10px; padding-bottom:10px; }
.home-direct .direct-card { min-height:112px; }
.home-view-all { text-decoration:none; white-space:nowrap; }
@media(max-width:360px) { .home-direct .direct-card { min-height:112px; } }

/* Help shares the same full-width answer rows as the Messages help panel. */
.help-page { padding:18px 20px 24px; background:#fff; min-height:100%; }
.help-page .search-wrap { margin:0 0 15px; }
.help-page .search { border-color:#eae4dc; border-radius:12px; background:#f8f6f2; }
.help-page .search-count { margin:0 0 12px; }
.help-page .article-link { width:100%; min-height:60px; margin-bottom:8px; padding:12px 14px; gap:14px; border:1px solid #eae5dd; border-radius:13px; background:#fff; }
.help-page .article-link > span:first-child { flex:1; }
.help-page .article-link:hover { border-color:#e4c6af; background:#fffcf8; }
.help-page .secondary { margin-top:20px; }
@media(max-width:360px) { .help-page { padding:17px; } }
