.plan-upgrade-button{display:inline-flex;align-items:center;min-height:34px;padding:0 11px;border:1px solid rgba(141,124,255,.55);border-radius:10px;background:rgba(141,124,255,.13);color:#cfc8ff;text-decoration:none;font-size:11px;font-weight:700;white-space:nowrap;transition:background .18s ease,border-color .18s ease,transform .18s ease}.plan-upgrade-button:hover{background:rgba(141,124,255,.25);border-color:#a99cff;transform:translateY(-1px)}@media(max-width:600px){.plan-upgrade-button{padding-inline:8px;font-size:10px}.top-actions{gap:6px}}
#messageForm.composer:not(.ticket-composer){display:grid!important;grid-template-columns:44px minmax(0,1fr) auto!important;align-items:center!important;gap:10px!important}#messageForm.composer:not(.ticket-composer) .composer-attach{grid-column:1!important}#messageForm.composer:not(.ticket-composer) .message-body-editor{grid-column:2!important;width:100%!important;min-width:0!important}#messageForm.composer:not(.ticket-composer)>.solid-button{grid-column:3!important}
@media(max-width:760px){#messageForm.composer:not(.ticket-composer){grid-template-columns:40px minmax(0,1fr) auto!important;gap:8px!important}#messageForm.composer:not(.ticket-composer) .message-body-editor{grid-column:2!important;width:100%!important;min-width:0!important}}

#messageForm.composer:not(.ticket-composer){grid-template-columns:44px 44px minmax(0,1fr) auto!important}
#messageForm.composer:not(.ticket-composer) .composer-money-request{grid-column:2!important;display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(71,214,145,.55);border-radius:12px;background:rgba(71,214,145,.1);color:#59e39b;cursor:pointer}
#messageForm.composer:not(.ticket-composer) .composer-money-request .ui-icon{width:18px;height:18px;stroke-width:2.2;color:inherit}
#messageForm.composer:not(.ticket-composer) .message-body-editor{grid-column:3!important}
#messageForm.composer:not(.ticket-composer)>.solid-button{grid-column:4!important}
.message-unit.mine .bubble.money-request-bubble{background:linear-gradient(145deg,#2d9b68,#20744f)!important;border-color:rgba(104,239,169,.45)!important;color:#fff!important}
.message-money-request{display:grid;gap:5px;min-width:190px;padding:14px 15px;border:1px solid rgba(104,239,169,.42);border-radius:14px;background:rgba(20,104,67,.34)}
.money-request-kicker{display:inline-flex;align-items:center;gap:6px;color:#a5f4c9;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.money-request-kicker svg{width:14px;height:14px}.message-money-request>strong{font-size:22px;line-height:1.1}.message-money-request small{color:var(--muted);font-size:12px}.money-request-pay{margin-top:5px;width:max-content!important;min-height:34px!important;padding:0 12px!important;font-size:12px!important}.message-money-request.is-paid{border-color:rgba(71,214,145,.4);background:rgba(71,214,145,.08)}
.message-money-request.is-paid{border-color:rgba(126,244,181,.62);background:rgba(33,132,85,.38)}
.reports-head .reports-avatar{width:36px;height:36px;margin-left:2px}.reports-head .reports-avatar .ui-icon{width:18px;height:18px}.reports-count{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:5px;padding:0 6px;border-radius:999px;background:#8f2634;color:#fff;font-size:10px;line-height:1;vertical-align:2px}.reports-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 24px;border-bottom:1px solid var(--line,#2a2a31);background:rgba(255,255,255,.015)}.reports-toolbar-title{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted,#9797a5)}.reports-toolbar-status{display:inline-flex;align-items:center;gap:6px;color:#f0a2a8;font-size:11px}.reports-toolbar-status i{width:7px;height:7px;border-radius:50%;background:#ff6975;box-shadow:0 0 0 3px rgba(255,105,117,.12)}.reports-empty{display:grid;justify-items:center;gap:8px;max-width:340px;margin:72px auto;padding:26px;text-align:center}.reports-empty-icon{display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(126,244,181,.35);border-radius:14px;color:#8ee9b8;background:rgba(71,214,145,.08)}.reports-empty-icon .ui-icon{width:19px;height:19px}.reports-empty strong{font-size:15px}.reports-empty p{margin:0;color:var(--muted,#9797a5);font-size:12px}.report-subject{display:flex;align-items:center;gap:8px;min-width:0}.report-kind{display:inline-flex;align-items:center;padding:3px 7px;border:1px solid rgba(255,145,155,.25);border-radius:999px;color:#ffb7bd;font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}.report-bubble-top{display:flex;align-items:center;justify-content:space-between;gap:14px}.report-severity-pill{padding:3px 7px;border-radius:999px;background:rgba(255,255,255,.1);color:#ffd9dc;font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.report-severity-high .report-severity-pill{background:#9b2b38;color:#fff}.report-severity-low .report-severity-pill{background:rgba(71,214,145,.14);color:#9af1bf}.report-chat-avatar.is-automated{background:#7f2938}.reports-stream{scrollbar-gutter:stable}.reports-stream .report-card:last-child{margin-bottom:28px!important}@media(max-width:760px){.reports-toolbar{padding:10px 14px}.reports-stream{padding:14px!important}.reports-stream .report-card{max-width:100%!important;padding:13px!important}.report-subject{flex-wrap:wrap;gap:5px}.report-chat-bubble{width:100%}}
@media(max-width:760px){#messageForm.composer:not(.ticket-composer){grid-template-columns:40px 40px minmax(0,1fr) auto!important;gap:8px!important}#messageForm.composer:not(.ticket-composer) .composer-money-request{width:40px;height:40px}#messageForm.composer:not(.ticket-composer) .message-body-editor{grid-column:3!important}#messageForm.composer:not(.ticket-composer)>.solid-button{grid-column:4!important}}

/* Keep message actions minimal: only unsend, outside the sender's bubble. */
.message-reply,[data-reply-message]{display:none!important}
.message-unit.mine .message-unsend{left:-34px!important;right:auto!important;top:50%!important;bottom:auto!important;transform:translateY(-50%)!important}
@media(max-width:760px){
  .message-unit.mine{overflow:visible!important;padding-left:38px!important}
  .message-unit.mine .message-unsend{left:4px!important;right:auto!important;top:50%!important;bottom:auto!important;transform:translateY(-50%)!important}
}

/* Message actions use no hover outline; keep the conversation visually clean. */
.message-unit:not(.mine):hover .bubble,.message-unit .bubble:focus,.message-unit .bubble:focus-visible{outline:none!important;outline-offset:0!important}
.message-unsent-placeholder{align-self:stretch!important;width:100%!important;max-width:none!important;justify-items:start!important}
.message-unsent-placeholder .message-unsent-bubble{margin-left:0!important;margin-right:auto!important}
.message-unsent-placeholder.mine{justify-items:end!important}
.message-unsent-placeholder.mine .message-unsent-bubble{margin-left:auto!important;margin-right:0!important}
.message-unsent-bubble{font-style:normal!important;font-size:inherit!important;line-height:inherit!important;letter-spacing:normal!important;padding:10px 14px!important;margin-top:0!important;margin-bottom:0!important}
.typing-state{min-height:42px!important;padding:8px 24px!important}.typing-state .typing-dots{min-width:58px!important;min-height:30px!important;padding:10px 14px!important;gap:5px!important;justify-content:center!important;border-radius:16px!important;background:#17171c!important}.typing-state .typing-dots i{width:6px!important;height:6px!important}

/* User-facing profile badges are icon-only; keep their meaning available via title/aria-label. */
.profile-popup-badges{gap:8px!important;align-items:center!important}
.profile-popup-badges .profile-badge{min-height:1em!important;width:1em!important;height:1em!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;transform:none!important;cursor:help!important}
.profile-popup-badges .profile-badge>span{display:none!important}
.profile-popup-badges .profile-badge .ui-icon{width:1em!important;height:1em!important}
.profile-popup-badges .profile-badge:hover,.profile-popup-badges .profile-badge:focus-visible{border:0!important;background:transparent!important;transform:scale(1.08)!important}
.profile-popup-badges .profile-badge-pro .ui-icon{color:#e1b96d!important}
.profile-popup-badges .profile-badge-developer .ui-icon{color:#bdb1ff!important}
.profile-mini-badges{display:inline-flex!important;align-items:center!important;gap:10px!important;margin-left:6px!important;vertical-align:middle!important}
.profile-mini-badge{position:relative!important;display:inline-grid!important;place-items:center!important;flex:0 0 20px!important;width:20px!important;height:20px!important;border:0!important;border-radius:0!important;background:transparent!important}
.profile-mini-badge svg,.profile-mini-badge .ui-icon{width:17px!important;height:17px!important}
.profile-mini-badge::after{content:attr(data-badge-help);position:absolute;z-index:20;left:50%;bottom:calc(100% + 8px);width:max-content;max-width:180px;padding:6px 8px;border:1px solid rgba(255,255,255,.14);border-radius:7px;color:#f4f3f8;background:#17171d;box-shadow:0 8px 20px rgba(0,0,0,.35);font-size:10px;font-weight:500;line-height:1.2;white-space:nowrap;opacity:0;pointer-events:none;transform:translate(-50%,4px);transition:opacity .14s ease,transform .14s ease}
.profile-mini-badge:hover::after,.profile-mini-badge:focus-visible::after{opacity:1;transform:translate(-50%,0)}
.thread-name .profile-mini-badges{gap:6px!important;margin-left:5px!important}
.thread-name .profile-mini-badge{flex:0 0 14px!important;width:14px!important;height:14px!important}
.thread-name .profile-mini-badge{vertical-align:middle!important;transform:translateY(-1px)!important}
.thread-name .profile-mini-badge .ui-icon,.thread-name .profile-mini-badge svg,.thread-name .profile-verified .ui-icon,.thread-name .profile-verified svg{width:14px!important;height:14px!important;stroke-width:2.1!important}
.thread-name .profile-verified{width:14px!important;height:14px!important;margin-left:5px!important}

/* Verification uses the same text-relative scale and hover treatment. */
.profile-verified{position:relative!important;width:1em!important;height:1em!important;margin-left:.18em!important;vertical-align:middle!important}
.profile-verified .ui-icon{width:1em!important;height:1em!important}
.profile-verified::after{content:attr(data-badge-help);position:absolute;z-index:20;left:50%;bottom:calc(100% + 8px);width:max-content;max-width:180px;padding:6px 8px;border:1px solid rgba(255,255,255,.14);border-radius:7px;color:#f4f3f8;background:#17171d;box-shadow:0 8px 20px rgba(0,0,0,.35);font-size:10px;font-weight:500;line-height:1.2;white-space:nowrap;opacity:0;pointer-events:none;transform:translate(-50%,4px);transition:opacity .14s ease,transform .14s ease}
.profile-verified:hover::after,.profile-verified:focus-visible::after{opacity:1;transform:translate(-50%,0)}
.notification-push-setting{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-top:1px solid var(--line,#2a2a31)}
.notification-push-setting strong,.notification-push-setting small{display:block}.notification-push-setting small{margin-top:3px;color:var(--muted,#9797a5);font-size:11px}
.profile-mini-badge{flex-basis:1em!important;width:1em!important;height:1em!important}
.profile-mini-badge svg,.profile-mini-badge .ui-icon{width:1em!important;height:1em!important}

.report-dialog-danger { border: 1px solid rgba(255, 74, 91, .75); border-radius: 18px; padding: 24px; background: linear-gradient(145deg, rgba(82, 15, 25, .95), rgba(20, 12, 17, .98)); box-shadow: 0 20px 70px rgba(255, 40, 65, .18); }
.report-dialog-danger .report-dialog-icon { width: 38px; height: 38px; color: #ff6474; margin-bottom: 12px; }
.report-dialog-danger .report-dialog-icon .ui-icon { width: 100%; height: 100%; }
.report-dialog-danger .report-submit { background: #d82f4c; border-color: #ff6474; }
.report-dialog-danger #entityReportCount { display: block; text-align: right; color: rgba(255, 210, 215, .72); font-size: 12px; margin-top: -8px; }
.storefront-report-hit { margin-left: 12px; color: #ff6474; font-size: 12px; cursor: pointer; white-space: nowrap; }
.storefront-report-hit:hover, .storefront-report-hit:focus-visible { text-decoration: underline; }
.storefront-report-hit .ui-icon { width: 13px; height: 13px; vertical-align: -2px; }

/* Native app-style feedback surface: consistent icon, copy and dismiss affordance. */
#toast, #toast:popover-open { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 10px 12px 10px 14px !important; border-radius: 15px !important; font: 600 13px/1.35 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important; }
#toast .toast-leading { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 9px; flex: 0 0 auto; }
#toast .toast-leading .ui-icon { width: 16px; height: 16px; }
#toast .toast-leading.is-success { color: #7cf0a8; background: rgba(67, 211, 126, .14); }
#toast .toast-leading.is-error { color: #ff8697; background: rgba(255, 83, 105, .14); }
#toast .toast-message { min-width: 0; flex: 1; overflow-wrap: anywhere; }
#toast .toast-dismiss { pointer-events: auto; width: 28px; height: 28px; display: grid; place-items: center; border: 0; border-radius: 8px; background: transparent; color: rgba(255,255,255,.58); cursor: pointer; padding: 0; }
#toast .toast-dismiss:hover, #toast .toast-dismiss:focus-visible { color: #fff; background: rgba(255,255,255,.1); }
#toast .toast-dismiss .ui-icon { width: 15px; height: 15px; }
@media (max-width: 560px) { #toast, #toast:popover-open { inset: auto 12px calc(78px + env(safe-area-inset-bottom)) 12px !important; min-height: 50px; } }

/* Micro-interactions: short, tactile feedback that keeps the shell feeling native. */
@keyframes mzz-fade-rise { from { opacity: 0; transform: translateY(7px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes mzz-pop { 0% { transform: scale(.72); opacity: .2; } 70% { transform: scale(1.08); opacity: 1; } 100% { transform: scale(1); } }
@keyframes mzz-dialog-in { from { opacity: 0; transform: translateY(10px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes mzz-toast-progress { from { transform: scaleX(1); } to { transform: scaleX(0); } }

/* Content arrives in a compact cascade instead of popping in all at once. */
.screen.active .thread-list > .thread,
.screen.active .storefront-card,
.screen.active .listing-card,
.screen.active .store-ops-card { animation: mzz-fade-rise 220ms var(--app-ease, ease) both; }
.screen.active .thread-list > .thread:nth-child(2), .screen.active .storefront-card:nth-child(2) { animation-delay: 25ms; }
.screen.active .thread-list > .thread:nth-child(3), .screen.active .storefront-card:nth-child(3) { animation-delay: 50ms; }
.screen.active .thread-list > .thread:nth-child(4), .screen.active .storefront-card:nth-child(4) { animation-delay: 75ms; }
.screen.active .thread-list > .thread:nth-child(5), .screen.active .storefront-card:nth-child(5) { animation-delay: 100ms; }

/* Tactile controls and segmented navigation. */
button, [role="button"], a { -webkit-tap-highlight-color: transparent; }
button:active, [role="button"]:active { transition-duration: 60ms !important; }
.subnav button, .inbox-tabs button, .period-tabs button { transition: color 140ms ease, background-color 140ms ease, transform 140ms var(--app-ease, ease); }
.subnav button:active, .inbox-tabs button:active, .period-tabs button:active { transform: scale(.96); }
.nav-link .ui-icon, .mobile-dock .ui-icon { transition: transform 180ms var(--app-ease, ease), color 140ms ease; }
.nav-link:hover .ui-icon, .mobile-dock button:hover .ui-icon { transform: translateY(-1px) scale(1.08); }

/* Conversation messages settle into place as they appear. */
.message-stream > * { animation: mzz-fade-rise 190ms var(--app-ease, ease) both; }
.message-stream > *:nth-child(2) { animation-delay: 25ms; }
.message-stream > *:nth-child(3) { animation-delay: 50ms; }
.bubble { transition: border-color 140ms ease, box-shadow 180ms ease, transform 180ms var(--app-ease, ease); }
.bubble:hover { transform: translateY(-1px); box-shadow: 0 5px 16px rgba(0,0,0,.16); }

/* Dialogs and focused fields feel anchored to the current task. */
dialog[open] { animation: mzz-dialog-in 180ms var(--app-ease, ease) both; }
:where(input, select, textarea):focus { transform: translateY(-1px); }
.solid-button, .outline-button { transition: transform 120ms var(--app-ease, ease), box-shadow 160ms ease, filter 120ms ease !important; }
.solid-button:hover, .outline-button:hover { box-shadow: 0 6px 18px rgba(0,0,0,.18); }

/* Toasts get a subtle lifetime indicator and icon pop. */
#toast.show::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; border-radius: 0 0 15px 15px; background: currentColor; opacity: .35; transform-origin: left; animation: mzz-toast-progress 3.2s linear both; pointer-events: none; }
#toast.error.show::after { animation-duration: 7s; }
#toast .toast-leading { animation: mzz-pop 220ms var(--app-ease, ease) both; }

/* Unread indicators acknowledge new activity with one restrained pop. */
.nav-alert:not([hidden]), .notification-badge:not([hidden]) { animation: mzz-pop 220ms var(--app-ease, ease) both; }

@media (prefers-reduced-motion: reduce) {
  .screen.active .thread-list > .thread, .screen.active .storefront-card, .screen.active .listing-card, .screen.active .store-ops-card, .message-stream > *, dialog[open], #toast .toast-leading, .nav-alert:not([hidden]), .notification-badge:not([hidden]) { animation: none !important; }
  #toast.show::after { animation: none !important; }
}
html[data-reduce-motion="true"] .screen.active .thread-list > .thread,
html[data-reduce-motion="true"] .storefront-card,
html[data-reduce-motion="true"] .listing-card,
html[data-reduce-motion="true"] .message-stream > * { animation: none !important; }

/* Ensure the micro entrance survives the shell's direct-child reset. */
.screen.active { animation: mzz-fade-rise 220ms var(--app-ease, ease) both !important; }
.screen.active .thread-list > .thread,
.screen.active .storefront-card,
.screen.active .listing-card,
.screen.active .store-ops-card,
.message-stream > * { animation-name: mzz-fade-rise !important; animation-duration: 220ms !important; animation-timing-function: var(--app-ease, ease) !important; animation-fill-mode: both !important; }

/* Site-wide motion system: one rhythm, shared across every surface. */
:root { --motion-fast: 120ms; --motion-base: 180ms; --motion-slow: 260ms; --motion-ease: cubic-bezier(.22,.78,.24,1); }

/* Shared interactive lift and press language. */
:where(.metric-panel,.action-card,.settings-card,.money-card,.account-card,.data-row,.thread,.store-ops-card,.network-card,.listing-card,.storefront-card) {
  transition: transform var(--motion-base) var(--motion-ease), border-color var(--motion-fast) ease, box-shadow var(--motion-base) ease, background-color var(--motion-fast) ease !important;
}
:where(.metric-panel,.action-card,.settings-card,.money-card,.account-card,.data-row,.thread,.store-ops-card,.network-card,.listing-card,.storefront-card):hover {
  transform: translateY(-2px);
}
:where(.metric-panel,.action-card,.settings-card,.money-card,.account-card,.data-row,.thread,.store-ops-card,.network-card,.listing-card,.storefront-card):active {
  transform: translateY(0) scale(.995);
}

/* Icons acknowledge the action without shifting layout. */
:where(button,a,[role="button"]) .ui-icon { transition: transform var(--motion-base) var(--motion-ease), color var(--motion-fast) ease; }
:where(button,a,[role="button"]):hover .ui-icon { transform: scale(1.08); }
:where(.solid-button,.outline-button,.text-button):hover .ui-icon { transform: translateX(2px) scale(1.06); }
:where(.nav-link,.mobile-dock button):hover .ui-icon { transform: translateY(-1px) scale(1.1); }

/* Segmented controls and filters visibly settle into their selected state. */
:where(.inbox-tabs button,.subnav button,.period-tabs button,.filter,.sort-select) { transition: color var(--motion-fast) ease, background-color var(--motion-fast) ease, border-color var(--motion-fast) ease, transform var(--motion-fast) var(--motion-ease); }
:where(.inbox-tabs button,.subnav button,.period-tabs button,.filter,.sort-select):active { transform: scale(.965); }
:where(.inbox-tabs button.active,.subnav button.active,.period-tabs button.active,.filter.active) { animation: mzz-pop 180ms var(--motion-ease) both; }

/* Field focus feels intentional and keeps keyboard users oriented. */
:where(input,select,textarea) { transition: border-color var(--motion-fast) ease, box-shadow var(--motion-base) ease, background-color var(--motion-fast) ease, transform var(--motion-fast) var(--motion-ease) !important; }
:where(input,select,textarea):focus { transform: translateY(-1px); }

/* App chrome and overlays transition as a single layer. */
.topbar, .rail, .mobile-dock { transition: background-color var(--motion-base) ease, border-color var(--motion-base) ease, box-shadow var(--motion-base) ease; }
.mobile-dock button.active { animation: mzz-dock-active 240ms var(--motion-ease) both; }
@keyframes mzz-dock-active { from { transform: scale(.96); } 65% { transform: scale(1.035); } to { transform: scale(1); } }
dialog::backdrop { animation: mzz-backdrop-in 180ms ease both; }
@keyframes mzz-backdrop-in { from { opacity: 0; } to { opacity: 1; } }

/* Links get a quiet app-like underline response. */
:where(.storefront-foot b,.text-button,.account-link,.profile-contact-button):not(button) { transition: color var(--motion-fast) ease; }
:where(.storefront-foot b,.text-button,.account-link,.profile-contact-button):not(button):hover { color: var(--accent, #a995ff); }

/* Loading surfaces use a soft sweep instead of a static blank block. */
.route-error, .empty-state.loading, .clean-loader { animation: mzz-fade-rise 220ms var(--motion-ease) both; }

@media (prefers-reduced-motion: reduce) {
  :where(.metric-panel,.action-card,.settings-card,.money-card,.account-card,.data-row,.thread,.store-ops-card,.network-card,.listing-card,.storefront-card),
  :where(.inbox-tabs button,.subnav button,.period-tabs button,.filter,.sort-select),
  :where(.inbox-tabs button.active,.subnav button.active,.period-tabs button.active,.filter.active),
  .mobile-dock button.active, dialog::backdrop, .route-error, .empty-state.loading, .clean-loader { animation: none !important; transition: none !important; }
}
html[data-reduce-motion="true"] :where(.metric-panel,.action-card,.settings-card,.money-card,.account-card,.data-row,.thread,.store-ops-card,.network-card,.listing-card,.storefront-card) { animation: none !important; transition: none !important; }

/* Press feedback is shared by every tappable control. */
:where(button,a,[role="button"]) { position: relative; overflow: hidden; }
.ui-press-ripple { position: absolute; pointer-events: none; border-radius: 999px; background: currentColor; opacity: .16; transform: scale(0); animation: mzz-ripple 360ms var(--motion-ease, ease-out) both; }
@keyframes mzz-ripple { to { opacity: 0; transform: scale(1); } }

/* Route changes carry the shell forward as one coherent surface. */
body.route-changing .workspace>main { animation: mzz-route-shift 180ms var(--motion-ease, ease) both; }
@keyframes mzz-route-shift { from { opacity: .72; transform: translateX(4px); } to { opacity: 1; transform: none; } }

/* Hover sheen on larger app surfaces gives depth without loud motion. */
:where(.home-command,.network-hero,.directory-hero,.money-summary,.account-card,.settings-card)::after { content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit; background: linear-gradient(110deg, transparent 28%, rgba(255,255,255,.045) 50%, transparent 72%); transform: translateX(-115%); opacity: 0; transition: transform 520ms var(--motion-ease, ease), opacity 180ms ease; }
:where(.home-command,.network-hero,.directory-hero,.money-summary,.account-card,.settings-card):hover::after { transform: translateX(115%); opacity: 1; }
:where(.home-command,.network-hero,.directory-hero,.money-summary,.account-card,.settings-card) { isolation: isolate; }
@media (prefers-reduced-motion: reduce) { .ui-press-ripple, body.route-changing .workspace>main { animation: none !important; } :where(.home-command,.network-hero,.directory-hero,.money-summary,.account-card,.settings-card)::after { transition: none !important; } }

/* Mobile brand: keep the mark and wordmark as one unboxed, baseline-aligned unit. */
@media (max-width: 760px) {
  .mobile-brand {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    line-height: 1 !important;
  }
  .mobile-brand img {
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    vertical-align: middle !important;
    flex: 0 0 24px;
  }
  .mobile-brand b {
    display: inline !important;
    font-size: 18px !important;
    line-height: 1 !important;
    letter-spacing: -.05em !important;
  }
  .topbar > div:first-of-type {
    margin-left: 0 !important;
    display: flex;
    align-items: center;
    min-width: 0;
  }
  .topbar {
    grid-template-columns: max-content minmax(0, 1fr) auto !important;
  }

  /* Messages keeps its messenger layout, but shares the app shell/header rhythm. */
  body:has(.screen[data-screen="messages"].active) .topbar {
    display: grid !important;
  }
  body:has(.screen[data-screen="messages"].active) .workspace {
    padding-bottom: calc(72px + env(safe-area-inset-bottom)) !important;
  }
  body:has(.screen[data-screen="messages"].active) .workspace main:has(> .screen[data-screen="messages"].active) {
    height: calc(100dvh - 68px - 66px - env(safe-area-inset-bottom)) !important;
  }
  .screen[data-screen="messages"] .thread-head {
    min-height: 56px !important;
    height: 56px !important;
    padding: 12px 14px !important;
    border-bottom: 1px solid var(--line) !important;
  }
  .screen[data-screen="messages"] .thread-column {
    grid-template-rows: 56px 64px 54px minmax(0, 1fr) !important;
  }
  .screen[data-screen="messages"] .thread-head .kicker {
    display: block !important;
    font-size: 10px !important;
    letter-spacing: .14em !important;
  }
  .screen[data-screen="messages"] .thread-head h2 {
    display: none !important;
  }
  .screen[data-screen="messages"] .thread-list > .thread:not(.scam-thread) {
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
    border-radius: 0 !important;
    background: transparent !important;
    transition: background-color 160ms ease, padding-left 160ms ease !important;
  }
  .screen[data-screen="messages"] .thread-list > .thread:not(.scam-thread):hover,
  .screen[data-screen="messages"] .thread-list > .thread:not(.scam-thread).active {
    background: rgba(255,255,255,.055) !important;
  }
  .screen[data-screen="messages"] .message-body-editor {
    min-height: 40px !important;
    max-height: 40px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    align-content: center !important;
  }
}