/* Deep Life product layer. Native Sngine controls retain their handlers. */
:root {
  --deep-page: #f3f5f8;
  --deep-surface: #fff;
  --deep-soft: #f5f7fa;
  --deep-soft-blue: #edf3ff;
  --deep-category: #ffffff;
  --deep-dark: #192638;
  --deep-blue: #315ce5;
  --deep-blue-hover: #244ac6;
  --deep-line: #e6eaf0;
  --deep-text: #253247;
  --deep-muted: #758196;
  --deep-shadow: 0 4px 20px rgb(25 38 56 / 4%);
  --life-radius: 16px;
  --life-motion: 180ms cubic-bezier(.2,.7,.2,1);
}
html { scroll-padding-top: 90px; }
body { background: var(--deep-page); color: var(--deep-text); }
body, input, textarea, select, button { -webkit-font-smoothing: antialiased; }
a, button, .btn { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid #7195ff; outline-offset: 3px;
}
.main-header {
  background: var(--deep-surface) !important;
  border-bottom: 1px solid var(--deep-line);
  box-shadow: 0 2px 12px rgb(25 38 56 / 3%);
}
.main-header .logo { gap: 9px; text-decoration: none; }
.main-header .deep-life-logo { width: 38px; height: 44px; object-fit: contain; }
.deep-product-wordmark { color: var(--deep-dark); font-size: 24px; font-weight: 700; line-height: 1; letter-spacing: -.9px; }
.deep-product-wordmark > span { color: var(--deep-blue); font-weight: 400; }
.deep-product-wordmark small { display: block; margin-top: 5px; font-size: 7px; letter-spacing: 1.5px; color: var(--deep-muted); }
.main-header .header-icon, .main-header .header-icon * { color: var(--deep-muted) !important; fill: var(--deep-muted) !important; }
.main-header .header-icon { transition: color var(--life-motion), transform var(--life-motion); }
.main-header a:hover .header-icon { transform: translateY(-1px); }
.main-header .deep-theme-nav-item { display: flex; align-items: flex-start; justify-content: center; }
.main-header .deep-theme-toggle {
  display: inline-flex; width: 50px; height: 50px; align-items: center; justify-content: center; margin-top: 10px;
  padding: 0; color: var(--deep-blue); background: var(--deep-soft); border: 1px solid var(--deep-line);
  border-radius: 8px; cursor: pointer; transition: color var(--life-motion), background var(--life-motion), border-color var(--life-motion), transform var(--life-motion);
}
.main-header .deep-theme-toggle:hover { color: #244ac6; background: var(--deep-soft-blue); border-color: #bdccf7; transform: translateY(-1px); }
.main-header .deep-theme-toggle:active { transform: scale(.96); }
.main-header .deep-theme-toggle .deep-theme-icon { font-size: 17px; line-height: 1; }
.main-header .deep-theme-icon-sun { display: none; }
body.night-mode .main-header .deep-theme-toggle { color: #ffd166; background: #252f3e; border-color: #39475a; }
body.night-mode .main-header .deep-theme-toggle:hover { color: #ffe29a; background: #2c394a; border-color: #506078; }
body.night-mode .main-header .deep-theme-icon-moon { display: none; }
body.night-mode .main-header .deep-theme-icon-sun { display: inline-block; }
.main-header .deep-user-menu-dropdown { inset: calc(100% + 8px) 0 auto auto !important; max-height: calc(100vh - 82px); overflow-y: auto; transform: none !important; }
.main-header .navbar-wrapper > ul > li:last-child { border-color: var(--deep-line); }
.main-header .search-wrapper .form-control { background: var(--deep-soft) !important; border-color: transparent !important; border-radius: 12px !important; }
.main-header .search-wrapper .form-control:focus { border-color: #aac0ff !important; box-shadow: 0 0 0 3px #315ce510; }
.deep-feed-layout { margin-top: 30px !important; }
.deep-feed-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 24px; }
.deep-eyebrow { color: var(--deep-blue); font-size: 10px; font-weight: 700; letter-spacing: 1.8px; }
.deep-feed-heading h1 { margin: 6px 0 6px; color: var(--deep-dark); font-size: clamp(23px,2vw,30px); font-weight: 700; letter-spacing: -.8px; }
.deep-feed-heading p { margin: 0; color: var(--deep-muted); font-size: 12px; }
.deep-compose-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 10px 16px; }
.card, .post, .publisher, .x-form, .modal-content, .dropdown-menu {
  border: 1px solid var(--deep-line); border-radius: var(--life-radius); box-shadow: var(--deep-shadow);
}
.card { margin-bottom: 20px; }
.card-header { color: var(--deep-dark); background: var(--deep-surface); border-color: var(--deep-line); padding: 18px 20px; font-weight: 700; }
.card-header:first-child { border-radius: var(--life-radius) var(--life-radius) 0 0; }
.card-body { padding: 20px; }
.deep-life-sidebar { background: transparent !important; border: 0; box-shadow: none; }
.deep-life-sidebar .card-body { padding: 0; }
.deep-character-card { display: flex; align-items: center; gap: 12px; padding: 17px 13px; margin-bottom: 20px; border: 1px solid var(--deep-line); border-radius: var(--life-radius); background: var(--deep-surface); text-decoration: none !important; }
.deep-character-card > img { flex: 0 0 48px; width: 48px; height: 48px; object-fit: cover; border-radius: 15px; }
.deep-character-card > span { min-width: 0; }
.deep-character-card small { display: block; font-size: 8px; font-weight: 700; letter-spacing: 1px; color: var(--deep-blue); }
.deep-character-card strong { display: block; margin: 4px 0; overflow: hidden; text-overflow: ellipsis; color: var(--deep-dark); font-size: 13px; }
.deep-character-card span span { display: block; font-size: 10px; color: var(--deep-muted); }
.main-side-nav > li { margin-bottom: 5px; }
.main-side-nav > li > a { display: flex; align-items: center; gap: 1px; padding: 13px 15px; min-height: 47px; border-radius: 12px; color: #647188; font-size: 13px; font-weight: 500; transition: background var(--life-motion), color var(--life-motion), transform var(--life-motion); }
.main-side-nav > li > a:hover { color: var(--deep-blue); background: #eaf0fa; transform: translateX(2px); }
.main-side-nav > li.active > a { background: var(--deep-soft-blue) !important; color: var(--deep-blue) !important; box-shadow: none; }
.main-side-nav > li.active > a .main-icon, .main-side-nav > li.active > a .main-icon * { color: var(--deep-blue) !important; fill: var(--deep-blue) !important; }
.main-side-nav .main-icon { flex: 0 0 21px; width: 21px; height: 21px; margin-right: 13px; }
.deep-life-nav-label { margin: 22px 0 10px !important; padding-left: 15px; color: #94a0b2; letter-spacing: 1.2px; border: 0; }
.deep-life-nav-label small { font-size: 9px; }
.btn { border-radius: 10px; font-weight: 500; transition: background var(--life-motion), box-shadow var(--life-motion), transform var(--life-motion); }
.btn:active { transform: scale(.98); }
.btn-primary, .btn-primary:focus, .btn-primary:active { border-radius: 10px; box-shadow: 0 4px 10px #315ce518; }
.btn-primary:hover { box-shadow: 0 6px 15px #315ce526; }
.form-control, .form-select { border-radius: 10px; border-color: var(--deep-line); min-height: 42px; }
.form-control:focus, .form-select:focus { border-color: #91abff; box-shadow: 0 0 0 3px #315ce512; }
.publisher { background: var(--deep-surface); }
.publisher-message { min-height: 80px; padding: 20px 20px 20px 72px; }
.publisher-avatar { top: 20px; left: 20px; border-radius: 14px; }
.publisher-message .colored-text-wrapper { min-width: 0; }
.publisher-message textarea { width: 100%; min-height: 40px; padding: 8px 0; }
.publisher-message textarea { color: var(--deep-text); font-size: 14px; line-height: 1.6; }
.publisher-message textarea::placeholder { color: #8793a6; }
.publisher:focus-within { border-color: #bbccff; box-shadow: 0 4px 24px #315ce50b; }
.publisher-meta { border-color: var(--deep-line); }
.stories-wrapper #stories .add-story { width: 70px; height: 90px; }
.stories-wrapper #stories .add-story .img { width: 70px; height: 80px; border-radius: 16px; background-size: cover; }
.post { background: var(--deep-surface); margin-bottom: 22px; }
.post .post-text { font-size: 14px; line-height: 1.75; }
.post .post-stats { color: var(--deep-muted); font-size: 11px; }
.post .post-footer { background: var(--deep-soft); border-color: var(--deep-line); border-radius: 0 0 var(--life-radius) var(--life-radius); }
.post .post-actions { border-color: var(--deep-line); }
.post .post-actions > div { border-radius: 8px; transition: background var(--life-motion); }
.post .post-actions > div:hover { background: var(--deep-soft-blue); }
.post .post-avatar img { border-radius: 14px; }
.dropdown-menu { padding: 8px; border-radius: 14px; box-shadow: 0 12px 36px rgb(25 38 56 / 12%); }
.dropdown-item { border-radius: 8px; padding: 9px 12px; }
.dropdown-menu.show { animation: life-appear var(--life-motion) both; }
.deep-posts-filter { position: relative; overflow: visible !important; z-index: 20; }
.deep-location-filter, .deep-post-type-filter { position: relative; }
.deep-posts-filter .deep-feed-filter-menu { display: none; position: absolute !important; top: calc(100% + 7px) !important; bottom: auto !important; box-sizing: border-box; width: min(280px, calc(100vw - 24px)); max-height: min(360px, calc(100vh - 150px)); margin: 0 !important; overflow-y: auto; transform: none !important; animation: none !important; z-index: 1080; }
.deep-posts-filter .deep-feed-filter-menu.show { display: block; }
.deep-posts-filter .deep-updates-menu, .deep-posts-filter .deep-location-menu { right: auto !important; left: 0 !important; }
.deep-posts-filter .deep-post-type-menu { right: 0 !important; left: auto !important; }
.deep-posts-filter .js_scroller { max-height: 340px; }
.modal-content { box-shadow: 0 24px 80px rgb(15 23 42 / 18%); }
.modal-header, .modal-footer { border-color: var(--deep-line); padding: 18px 22px; }
.modal.fade .modal-dialog { transform: translateY(14px) scale(.98); transition: transform 200ms ease-out; }
.modal.show .modal-dialog { transform: none; }
.alert { border-radius: 12px; }
.profile-header { border: 1px solid var(--deep-line); border-radius: 20px; background: var(--deep-surface); box-shadow: var(--deep-shadow); }
.profile-cover-wrapper { border-radius: 20px 20px 0 0; overflow: hidden; background: linear-gradient(0deg, rgb(18 30 47 / 72%), rgb(18 30 47 / 12%)), url('../images/deep-life-banner.jpg') center / cover; }
.profile-avatar-wrapper { border-radius: 24px; box-shadow: 0 5px 20px rgb(25 38 56 / 10%); }
.profile-avatar-wrapper img { border-radius: 21px; object-fit: cover; }
.profile-name-wrapper { letter-spacing: -.4px; }
.footer-bottom-bar { background: var(--deep-surface); border-top: 1px solid var(--deep-line); box-shadow: 0 -4px 20px rgb(25 38 56 / 4%); padding-bottom: env(safe-area-inset-bottom); }
.footer-bottom-bar .link .title { font-size: 10px; font-weight: 500; }
.footer-bottom-bar .link.active .title { color: var(--deep-blue); }
.footer-bottom-bar .link a { min-height: 48px; }
.footer-bottom-bar .dropdown-menu { margin-bottom: 12px !important; max-height: 70dvh; overflow-y: auto; }
.loader { border-top-color: var(--deep-blue); }
.deep-balance-pill { min-width: 120px; padding: 10px 14px; border: 1px solid var(--deep-line); border-radius: 12px; background: var(--deep-surface); text-align: right; }
.deep-balance-pill small { display: block; color: var(--deep-muted); font-size: 8px; letter-spacing: 1px; }
.deep-balance-pill strong { color: var(--deep-dark); font-size: 14px; }
.deep-premium-heading { align-items: flex-start; }
.deep-premium-summary { display: grid; grid-template-columns: repeat(2, minmax(130px, auto)); gap: 10px; }
.deep-premium-summary > div { padding: 12px 14px; border: 1px solid var(--deep-line); border-radius: 12px; background: var(--deep-surface); text-align: right; }
.deep-premium-summary small, .deep-active-premium-grid small { display: block; margin-bottom: 4px; color: var(--deep-muted); font-size: 8px; font-weight: 700; letter-spacing: 1px; }
.deep-premium-summary strong, .deep-active-premium-grid strong { display: block; overflow: hidden; color: var(--deep-dark); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.deep-package-grid { display: grid; grid-template-columns: minmax(0, 440px); justify-content: center; gap: 18px; }
.deep-package-card { position: relative; overflow: hidden; height: 100%; }
.deep-package-card::before { content: ''; display: block; height: 4px; background: var(--deep-blue); }
.deep-package-pro::before { background: #7457e8; }
.deep-package-elite::before { background: #d49a28; }
.deep-package-card h2, .deep-active-premium h2 { margin: 9px 0 16px; color: var(--deep-dark); font-size: 21px; }
.deep-package-price { margin-bottom: 22px; color: var(--deep-dark); font-size: 32px; font-weight: 700; }
.deep-package-price small { color: var(--deep-muted); font-size: 13px; }
.deep-package-card ul { min-height: 112px; margin: 0 0 22px; padding: 0; list-style: none; }
.deep-package-card li { display: flex; gap: 9px; margin: 11px 0; color: var(--deep-muted); font-size: 12px; }
.deep-package-card li i { margin-top: 2px; color: var(--deep-blue); }
.deep-purchase-row { display: flex; justify-content: space-between; gap: 20px; padding: 13px 0; border-bottom: 1px solid var(--deep-line); }
.deep-purchase-row span { color: var(--deep-muted); }
.deep-active-premium { background: linear-gradient(135deg, var(--deep-surface), var(--deep-soft-blue)); }
.deep-active-premium-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 18px; }
.deep-active-premium-grid > div { padding: 13px 14px; border: 1px solid var(--deep-line); border-radius: 12px; background: rgb(255 255 255 / 70%); }
.deep-messenger-list-title { padding: 10px 10px 5px; color: var(--deep-muted); font-size: 12px; font-weight: 700; text-transform: uppercase; }
.deep-messenger-list-view ul { margin: 0; padding: 0; list-style: none; }
.deep-messenger-list-view .feeds-item { margin: 0; border-bottom: 1px solid var(--deep-line); }
.deep-messenger-list-view .feeds-item:last-child { border-bottom: 0; }
.deep-messenger-list-view .data-container { display: flex; min-width: 0; min-height: 50px; gap: 8px; padding: 7px 5px; color: inherit; border-radius: 8px; }
.deep-messenger-list-view .data-container:hover { background: var(--deep-soft); }
.deep-messenger-list-view .data-avatar { flex: 0 0 38px; width: 38px; height: 38px; }
.deep-messenger-list-view .data-avatar img { width: 38px; height: 38px; border-radius: 50%; object-fit: cover; }
.deep-messenger-list-view .data-content { min-width: 0; flex: 1; padding-left: 0; }
.deep-messenger-list-view .data-content .name { display: block; overflow: hidden; color: var(--deep-dark); font-size: 14px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.deep-messenger-list-view .data-content .text { overflow: hidden; margin-top: 2px; color: var(--deep-muted); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.deep-messenger-list-view .data-content .time { margin-top: 3px; color: var(--deep-muted); font-size: 11px; }
.deep-messenger-list-view .feeds-item.unread .data-container { background: var(--deep-soft-blue); }
.deep-messenger-list-view .feeds-item.unread .data-content .name { color: var(--deep-blue); }
.deep-messenger-list-view .feeds-item.unread .data-content .name::after { display: inline-block; width: 7px; height: 7px; margin-left: 7px; background: var(--deep-blue); border-radius: 50%; content: ""; vertical-align: 1px; }
.deep-messenger-empty { padding: 72px 20px; color: var(--deep-muted); text-align: center; }
.deep-messenger-stage { display: none; }
.chat-sidebar.deep-chat-open .deep-messenger-list-view, .chat-sidebar.deep-chat-open .chat-sidebar-footer { display: none !important; }
.chat-sidebar.deep-chat-open .deep-messenger-stage { display: block; }
.deep-messenger-stage .chat-widget { display: block !important; position: relative !important; inset: auto !important; width: 100% !important; box-shadow: none !important; }
.deep-messenger-stage .chat-widget-head { position: relative; min-height: 58px; padding: 8px 12px; border-radius: 0; cursor: default; }
.deep-messenger-stage .chat-widget-head .chat-user-card { position: absolute; left: 50%; max-width: 220px; justify-content: center; transform: translateX(-50%); }
.deep-messenger-stage .chat-widget-head .chat-user-card .avatar { flex: 0 0 40px; }
.deep-messenger-stage .chat-widget-head .chat-user-card .name { max-width: 160px; }
.deep-messenger-stage .chat-widget-head .deep-chat-back { position: relative; z-index: 2; margin-right: auto; }
.deep-messenger-stage .chat-widget-head .chat-head-btns { position: relative; z-index: 2; margin-left: auto; }
.deep-messenger-stage .chat-head-label { display: none !important; }
.deep-messenger-stage .chat-widget-content { display: block !important; }
.deep-messenger-stage .chat-conversations { height: 300px; overflow-y: auto; }
.deep-messenger-stage .deep-chat-back { display: inline-flex; width: 34px; height: 34px; align-items: center; justify-content: center; padding: 0; color: var(--deep-dark); background: transparent; border: 0; border-radius: 50%; }
.deep-messenger-stage .deep-chat-back:hover { background: var(--deep-soft); }
.deep-messenger-stage .chat-box.fresh .chat-widget-content { padding: 12px; background: var(--deep-soft); }
.deep-messenger-stage .chat-box.fresh .chat-to { position: relative; inset: auto; display: flex; min-height: 48px; align-items: center; gap: 8px; padding: 6px 8px; background: var(--deep-surface); border: 1px solid var(--deep-line); border-radius: 8px; }
.deep-messenger-stage .chat-box.fresh .chat-to .to { position: static; flex: 0 0 auto; color: var(--deep-muted); font-size: 12px; font-weight: 700; }
.deep-messenger-stage .chat-box.fresh .chat-to .tags { display: flex; flex-wrap: wrap; gap: 5px; margin: 0; padding: 0; }
.deep-messenger-stage .chat-box.fresh .chat-to .typeahead { float: none; min-width: 0; flex: 1; }
.deep-messenger-stage .chat-box.fresh .chat-to .typeahead input { width: 100% !important; min-width: 120px; height: 34px; color: var(--deep-text); font-size: 13px; line-height: 34px; }
.deep-messenger-stage .chat-box.fresh .chat-to .typeahead input::placeholder { color: var(--deep-muted); }
.deep-messenger-stage .chat-box.fresh .chat-to .auto-complete { top: calc(100% + 6px); right: 0; left: 0; width: 100%; max-height: 210px; overflow-y: auto; }
.deep-messenger-stage .chat-box.fresh .chat-conversations { height: 220px; margin-top: 10px; background: var(--deep-surface); border: 1px solid var(--deep-line); border-radius: 8px; }
.deep-messenger-stage .chat-box.fresh .chat-form { margin: 10px -12px -12px; }
@media (min-width: 768px) {
  .chat-sidebar { display: block; position: fixed; z-index: 1050; right: max(16px, calc((100vw - 1320px) / 2)); bottom: 0; top: auto; width: min(340px, calc(100vw - 32px)); height: auto; padding: 0; background: transparent; border: 0; box-shadow: none; }
  .deep-messenger-toggle { display: flex; width: 100%; min-height: 50px; align-items: center; justify-content: space-between; padding: 0 18px; color: var(--deep-dark); background: var(--deep-surface); border: 1px solid var(--deep-line); border-bottom: 0; border-radius: 14px 14px 0 0; box-shadow: 0 -8px 28px rgb(25 38 56 / 10%); font-weight: 700; }
  .deep-messenger-toggle span { display: flex; align-items: center; gap: 9px; }
  .deep-messenger-toggle i:first-child { color: var(--deep-blue); }
  .deep-messenger-chevron { color: var(--deep-muted); transition: transform var(--life-motion); }
  .deep-messenger-toggle[aria-expanded="true"] .deep-messenger-chevron { transform: rotate(180deg); }
.deep-messenger-count { min-width: 20px; height: 20px; align-items: center; justify-content: center; padding: 0 6px; color: #fff; background: #e24a5a; border-radius: 10px; font-size: 11px; line-height: 20px; }
.deep-messenger-count:not(.x-hidden) { display: inline-flex; }
.deep-messenger-count.x-hidden, .deep-messenger-count[data-count="0"] { display: none !important; }
.chat-sidebar.deep-has-unread .deep-messenger-toggle { background: #fff3f5; border-color: #e24a5a; box-shadow: 0 -8px 30px rgb(226 74 90 / 22%); }
  .deep-messenger-panel { background: var(--deep-surface); border: 1px solid var(--deep-line); border-bottom: 0; box-shadow: 0 -14px 36px rgb(25 38 56 / 12%); }
  .chat-sidebar-content { position: static; width: 100%; height: 360px; padding: 4px; background: var(--deep-surface); }
  .chat-sidebar-content .slimScrollDiv { height: 100% !important; }
  .chat-sidebar-content .js_scroller { height: 100% !important; }
  .chat-sidebar .chat-avatar-wrapper { display: flex; width: 100%; align-items: center; gap: 12px; margin: 0; padding: 9px 10px; border-radius: 10px; }
  .chat-sidebar .chat-avatar-wrapper:hover { background: var(--deep-soft); }
  .chat-sidebar .chat-avatar { flex: 0 0 38px; width: 38px; height: 38px; }
  .chat-sidebar .chat-avatar img { width: 38px; height: 38px; border-radius: 12px; object-fit: cover; }
  .chat-sidebar .pb10, .chat-sidebar .last-seen { display: none; }
  .deep-chat-contact-name { min-width: 0; }
  .deep-chat-contact-name strong, .deep-chat-contact-name span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .deep-chat-contact-name strong { color: var(--deep-dark); font-size: 12px; }
  .deep-chat-contact-name span { margin-top: 2px; color: var(--deep-muted); font-size: 9px; }
  .chat-sidebar-footer { position: static; display: flex; width: 100%; height: 54px; align-items: center; gap: 8px; padding: 8px 10px; background: var(--deep-soft); border-top: 1px solid var(--deep-line); }
  .chat-sidebar-footer .btn { margin: 0 !important; }
  .deep-all-messages { margin-right: auto; padding: 8px; font-size: 11px; font-weight: 700; }
  body > .chat-box { right: calc(max(16px, (100vw - 1320px) / 2) + 358px) !important; bottom: 14px !important; }
  body > .chat-box ~ .chat-box { right: calc(max(16px, (100vw - 1320px) / 2) + 628px) !important; }
  body > .chat-box ~ .chat-box ~ .chat-box { right: calc(max(16px, (100vw - 1320px) / 2) + 898px) !important; }
  .main-header .navbar-wrapper .header-messages { display: none !important; }
}
@keyframes life-appear { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@media (min-width: 1200px) {
  .main-wrapper > .container, .main-header > .container { max-width: 1320px; }
  .deep-feed-layout > .row > .sg-offcanvas-sidebar { width: 22%; }
  .deep-feed-layout > .row > .sg-offcanvas-mainbar { width: 78%; }
}
@media (max-width: 991.98px) { .deep-feed-heading { margin-bottom: 20px; } }
@media (max-width: 767.98px) {
  .chat-sidebar { display: block; position: fixed; z-index: 1050; right: 12px; bottom: calc(58px + env(safe-area-inset-bottom)); top: auto; width: min(340px, calc(100vw - 24px)); height: auto; }
  .deep-messenger-toggle { display: flex; width: 100%; min-height: 48px; align-items: center; justify-content: space-between; padding: 0 16px; color: var(--deep-dark); background: var(--deep-surface); border: 1px solid var(--deep-line); border-radius: 12px; box-shadow: 0 8px 24px rgb(25 38 56 / 16%); font-weight: 700; }
  .deep-messenger-toggle > span { display: flex; align-items: center; gap: 8px; }
  .deep-messenger-count { min-width: 20px; height: 20px; padding: 0 6px; color: #fff; background: #e24a5a; border-radius: 10px; font-size: 11px; line-height: 20px; }
  .chat-sidebar.deep-has-unread .deep-messenger-toggle { background: #fff3f5; border-color: #e24a5a; }
  .deep-messenger-panel { max-height: calc(100vh - 150px); overflow: hidden; background: var(--deep-surface); border: 1px solid var(--deep-line); border-bottom: 0; }
  .chat-sidebar-content { height: min(340px, calc(100vh - 220px)); padding: 4px; }
  .chat-sidebar-footer { display: flex; height: 54px; align-items: center; gap: 8px; padding: 8px 10px; background: var(--deep-soft); border-top: 1px solid var(--deep-line); }
  .deep-feed-layout { margin-top: 18px !important; }
  .deep-feed-heading { padding: 0 4px; margin-bottom: 18px; }
  .deep-feed-heading h1 { font-size: 23px; }
  .deep-feed-heading p { font-size: 11px; }
  .deep-eyebrow { font-size: 8px; }
  .deep-compose-button { min-width: 40px; padding: 10px; }
  .deep-compose-button span { display: none; }
  .main-header .deep-life-logo { width: 30px; height: 38px; }
  .deep-product-wordmark { font-size: 21px; }
  .deep-product-wordmark small { font-size: 6px; letter-spacing: 1px; }
  .main-header .logo { gap: 6px; }
  .card, .post, .publisher { border-radius: 14px; }
  .card-body { padding: 16px; }
  .publisher-message { min-height: 72px; padding: 16px 16px 16px 66px; }
  .publisher-avatar { top: 16px; left: 16px; }
  .sg-offcanvas-sidebar { background: var(--deep-page); }
  .profile-header { border-radius: 14px; }
  .profile-cover-wrapper { border-radius: 14px 14px 0 0; }
  .modal-dialog { margin: 12px; }
  .deep-premium-heading { display: block; }
  .deep-premium-summary { grid-template-columns: 1fr; margin-top: 14px; }
  .deep-premium-summary > div { text-align: left; }
  .deep-package-grid { grid-template-columns: 1fr; }
  .deep-package-card ul { min-height: 0; }
  .deep-active-premium-grid { grid-template-columns: 1fr; }
  body { padding-bottom: calc(70px + env(safe-area-inset-bottom)); }
}
body.night-mode {
  --deep-page: #121923; --deep-surface: #1a2432; --deep-soft: #202c3c;
  --deep-soft-blue: #243550; --deep-dark: #ecf1fa; --deep-text: #dae3f0;
  --deep-muted: #9aa9bf; --deep-line: #2b3748;
}
body.night-mode .main-side-nav > li > a { color: var(--deep-muted); }
body.night-mode .chat-sidebar.deep-has-unread .deep-messenger-toggle { background: #38262d; }
body.night-mode .main-side-nav > li.active > a { color: #94b4ff; }
body.night-mode .form-control, body.night-mode .form-select { color: var(--deep-text); background: var(--deep-soft); border-color: var(--deep-line); }
body.night-mode .main-header .search-wrapper .form-control { color: var(--deep-text) !important; }
@media (prefers-reduced-motion: reduce) {
  .dropdown-menu.show { animation: none; }
  .btn, .main-side-nav > li > a, .modal.fade .modal-dialog, .main-header .header-icon { transition: none; }
}


/* Deep messenger bottom dock correction 2026-09-22 */
@media (min-width: 768px) {
  body .chat-sidebar {
    display: flex !important;
    position: fixed !important;
    top: auto !important;
    right: max(16px, calc((100vw - 1320px) / 2)) !important;
    bottom: 0 !important;
    flex-direction: column-reverse;
    height: auto !important;
  }
  body .chat-sidebar .deep-messenger-panel {
    order: 1;
    max-height: calc(100vh - 90px);
    overflow: hidden;
    border-radius: 14px 14px 0 0;
  }
  body .chat-sidebar .deep-messenger-toggle {
    order: 0;
    border-radius: 0;
    border-bottom: 0;
  }
  body .chat-sidebar .deep-messenger-panel:not(.show) + * { margin: 0; }
}
@media (max-width: 767.98px) {
  body .chat-sidebar {
    display: flex !important;
    position: fixed !important;
    top: auto !important;
    bottom: calc(58px + env(safe-area-inset-bottom)) !important;
    flex-direction: column-reverse;
    height: auto !important;
  }
}
