/* HAMOU MATH — Mobile premium UX v61
   Phone-only presentation layer. Loaded with a max-width media attribute.
   Desktop layout, application logic, routes, forms, payments and data remain untouched. */

@media screen and (max-width: 760px) {
  :root {
    --hm61-gutter: 16px;
    --hm61-radius: 18px;
    --hm61-line: rgba(67, 169, 255, .22);
    --hm61-surface: rgba(9, 28, 55, .94);
    --hm61-muted: #b6c9e2;
  }

  html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip !important;
    -webkit-text-size-adjust: 100%;
  }

  body.hm49-home {
    min-height: 100dvh;
    color: #edf6ff;
    background:
      radial-gradient(ellipse at 50% -12%, rgba(16, 111, 220, .20), transparent 44%),
      linear-gradient(180deg, #050d1e 0%, #07162d 52%, #061126 100%) !important;
  }

  body.hm49-home *,
  body.hm49-home *::before,
  body.hm49-home *::after {
    box-sizing: border-box;
  }

  body.hm49-home .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    width: 100%;
    padding: 0 !important;
    background: rgba(4, 13, 29, .96) !important;
    border-bottom: 1px solid var(--hm61-line) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .24) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  }

  body.hm49-home .navbar {
    min-height: 66px !important;
    width: 100%;
    max-width: 100%;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    padding: 8px var(--hm61-gutter) !important;
  }

  body.hm49-home .hm-brand-logo {
    display: flex;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: min(62vw, 230px) !important;
    min-width: 0 !important;
    align-items: center;
  }

  body.hm49-home .hm-brand-logo img {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    max-height: 44px;
    height: auto !important;
    object-fit: contain;
    object-position: right center;
  }

  body.hm49-home #mobile-button {
    display: inline-flex !important;
    flex: 0 0 46px;
    width: 46px;
    min-width: 46px;
    height: 46px;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(34, 211, 238, .38) !important;
    border-radius: 14px !important;
    color: #eafaff !important;
    background: linear-gradient(145deg, #10294d, #08172f) !important;
    box-shadow: 0 5px 16px rgba(0, 105, 220, .16);
    font-size: 21px;
    cursor: pointer;
  }

  body.hm49-home .hm-nav-center,
  body.hm49-home .desktop-nav {
    display: none !important;
  }

  /* The drawer sits below the header, never over the brand or menu control. */
  body.hm49-home #mobile-menu {
    position: fixed !important;
    top: calc(env(safe-area-inset-top, 0px) + 74px) !important;
    right: 12px !important;
    left: 12px !important;
    inset-inline: 12px !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100dvh - env(safe-area-inset-top, 0px) - 90px) !important;
    margin: 0 !important;
    padding: 14px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    display: none;
    flex-direction: column;
    gap: 7px !important;
    border: 1px solid rgba(55, 169, 255, .34) !important;
    border-radius: 20px !important;
    background: rgba(5, 19, 41, .985) !important;
    box-shadow: 0 22px 58px rgba(0, 0, 0, .48), 0 0 24px rgba(0, 126, 255, .12) !important;
    z-index: 10000 !important;
  }

  body.hm49-home #mobile-menu.open {
    display: flex !important;
  }

  body.hm49-home #mobile-menu > a,
  body.hm49-home #mobile-menu > button,
  body.hm49-home #mobile-menu .mobile-submenu > button {
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 49px !important;
    padding: 12px 14px !important;
    border: 1px solid rgba(79, 153, 225, .12) !important;
    border-radius: 13px !important;
    color: #eaf4ff !important;
    background: rgba(13, 39, 72, .72) !important;
    font-size: 14px !important;
    font-weight: 750;
    line-height: 1.5;
    text-align: right;
    text-decoration: none;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  body.hm49-home #mobile-menu > a:focus-visible,
  body.hm49-home #mobile-menu > button:focus-visible,
  body.hm49-home #mobile-button:focus-visible {
    outline: 2px solid #35d9f2;
    outline-offset: 2px;
  }

  body.hm49-home #mobile-menu .mobile-submenu {
    width: 100%;
    padding: 6px;
    border-radius: 14px;
    background: rgba(3, 13, 29, .65) !important;
  }

  body.hm49-home .hero {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 26px 0 30px !important;
    overflow: hidden;
    border: 0;
    border-bottom: 1px solid var(--hm61-line);
    border-radius: 0 0 24px 24px;
    background:
      radial-gradient(ellipse at 78% 12%, rgba(17, 130, 255, .18), transparent 38%),
      linear-gradient(145deg, #07172f, #081d3a 58%, #06142b) !important;
  }

  body.hm49-home .hm-hero-container {
    display: flex;
    flex-direction: column;
    gap: 18px;
    width: calc(100% - 2 * var(--hm61-gutter)) !important;
    max-width: 560px !important;
    margin-inline: auto !important;
    padding: 0 !important;
  }

  body.hm49-home .hm-hero-main,
  body.hm49-home .hm-hero-title-wrap {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0 !important;
  }

  body.hm49-home .hm-hero-badge {
    max-width: 100%;
    width: fit-content;
    padding: 7px 11px;
    border: 1px solid rgba(56, 189, 248, .24);
    border-radius: 999px;
    color: #aeeeff !important;
    background: rgba(8, 46, 82, .66);
    font-size: 11px;
    line-height: 1.5;
  }

  body.hm49-home .hm-hero-title {
    margin: 12px 0 5px !important;
    color: #f5f9ff !important;
    font-size: clamp(30px, 8.5vw, 42px) !important;
    line-height: 1.16 !important;
    letter-spacing: -.035em;
    overflow-wrap: anywhere;
  }

  body.hm49-home .hm-hero-title span {
    color: #29d8f2 !important;
  }

  body.hm49-home .hm-hero-tagline {
    margin-top: 7px;
    color: #e4f2ff !important;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.6;
  }

  body.hm49-home .hm-hero-desc {
    max-width: 52ch;
    margin: 10px 0 0;
    color: var(--hm61-muted) !important;
    font-size: 14px;
    line-height: 1.9;
    overflow-wrap: anywhere;
  }

  body.hm49-home .hm-hero-pills-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;
    width: 100%;
    margin-top: 16px;
  }

  body.hm49-home .hm-hero-mini-pill {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: center;
    column-gap: 9px;
    min-width: 0;
    min-height: 62px;
    padding: 10px !important;
    border: 1px solid rgba(64, 157, 238, .22) !important;
    border-radius: 15px !important;
    background: rgba(9, 35, 67, .78) !important;
    color: #eaf5ff !important;
    text-decoration: none;
  }

  body.hm49-home .hm-hero-mini-pill .hm-mini-pill-icon {
    grid-row: span 2;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 11px;
  }

  body.hm49-home .hm-hero-mini-pill strong {
    min-width: 0;
    font-size: 11px;
    line-height: 1.45;
  }

  body.hm49-home .hm-hero-mini-pill > span:last-child {
    min-width: 0;
    color: #aac5e3 !important;
    font-size: 10px;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }

  body.hm49-home .hm-hero-ctas {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;
    width: 100%;
    margin-top: 16px;
  }

  body.hm49-home .hm-hero-ctas > * {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 50px !important;
    padding: 11px 9px !important;
    border-radius: 14px !important;
    font-size: 12px !important;
    line-height: 1.45;
    text-align: center;
    white-space: normal;
  }

  body.hm49-home :where(.hm-section-features, .hm-section-pillars, .hm-pathways-section, .hm-math-world) {
    width: 100%;
    max-width: 100%;
    padding: 28px var(--hm61-gutter) !important;
    color: #edf6ff !important;
    background: linear-gradient(180deg, #07162d, #081a34) !important;
  }

  body.hm49-home :where(.hm-features-head, .hm-pathways-heading, .hm-math-world-heading) {
    width: 100%;
    max-width: 560px;
    margin: 0 auto 16px !important;
    text-align: right;
  }

  body.hm49-home :where(.hm-features-head h2, .hm-pathways-heading h2, .hm-math-world-heading h2) {
    margin: 0 0 6px;
    color: #f3f8ff !important;
    font-size: 22px !important;
    line-height: 1.4;
  }

  body.hm49-home :where(.hm-features-head p, .hm-pathways-heading p, .hm-math-world-heading p) {
    color: #aec5e1 !important;
    font-size: 13px;
    line-height: 1.75;
  }

  body.hm49-home :where(.hm-features-grid, .hm-pathways-grid, .hm-math-world-grid, .hm-pillars-grid) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 11px !important;
    width: 100%;
    max-width: 560px;
    margin-inline: auto;
  }

  body.hm49-home :where(.hm-feature-card, .hm-pillar-card, .hm-pathway-card, .hm-world-card, .hm-founder-card) {
    min-width: 0;
    padding: 15px !important;
    border: 1px solid rgba(66, 155, 232, .24) !important;
    border-radius: var(--hm61-radius) !important;
    background: linear-gradient(145deg, rgba(12, 38, 72, .96), rgba(6, 22, 45, .98)) !important;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .16) !important;
    color: #edf6ff !important;
    overflow-wrap: anywhere;
  }

  body.hm49-home :where(.hm-feature-card, .hm-pillar-card, .hm-pathway-card, .hm-world-card, .hm-founder-card) :where(h2, h3, h4, p, span, small) {
    color: inherit;
  }

  body.hm49-home :where(.hm-feature-card, .hm-pillar-card, .hm-pathway-card, .hm-world-card) :where(p, small) {
    color: #b5cbe4 !important;
    font-size: 12px;
    line-height: 1.7;
  }

  body.hm49-home :where(.hm-feature-card, .hm-pillar-card, .hm-pathway-card, .hm-world-card) :where(a, button) {
    max-width: 100%;
    min-height: 44px;
    white-space: normal;
  }

  body.hm49-home .hm-bottom-strip {
    padding: 15px var(--hm61-gutter) !important;
    color: #eaf5ff !important;
    background: linear-gradient(105deg, #06152d, #0a2850, #06152d) !important;
    border-top: 1px solid var(--hm61-line);
    line-height: 1.7;
  }

  body.hm49-home .hm-bottom-strip :where(p, span, strong, small) {
    color: inherit;
  }

  body.hm49-home .hm-site-footer {
    padding: 22px var(--hm61-gutter) !important;
    margin-top: 0 !important;
    color: #b6c9e2 !important;
    background: #040d1e;
  }

  body.hm49-home .hm-site-footer > .container {
    display: flex;
    flex-direction: column;
    align-items: flex-start !important;
    gap: 14px !important;
    padding: 0 !important;
  }

  body.hm49-home .hm-site-footer nav {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 16px !important;
    width: 100%;
  }

  body.hm49-home .hm-site-footer nav a {
    min-height: 40px;
    display: flex;
    align-items: center;
  }

  /* Shared mobile usability for forms, tables, overlays and content pages. */
  body.hm49-home :where(button, a, [role=button], input, select, textarea) {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  body.hm49-home :where(input, select, textarea) {
    width: 100%;
    max-width: 100%;
    min-height: 46px;
    box-sizing: border-box;
    font-size: 16px !important;
  }

  body.hm49-home :where(.table-wrap, .table-responsive, .table-container, .overflow-x-auto) {
    max-width: 100%;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  body.hm49-home table {
    max-width: 100%;
  }

  body.hm49-home :where(.modal, .dialog, [role=dialog]) {
    width: calc(100vw - 24px);
    max-width: calc(100vw - 24px);
    max-height: calc(100dvh - 24px);
    margin-inline: auto;
    overflow: auto;
    overscroll-behavior: contain;
  }

  body.hm49-home :where(.toast) {
    left: 12px !important;
    right: 12px !important;
    bottom: calc(12px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    max-width: none !important;
    border-radius: 14px !important;
  }

  body.hm49-home :where(.document-preview, .preview-page, .a4-preview, .document-sheet) {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }
}

@media screen and (max-width: 520px) {
  :root { --hm61-gutter: 14px; }

  body.hm49-home .hm-hero-container {
    width: calc(100% - 28px) !important;
  }

  body.hm49-home .hm-hero-pills-row,
  body.hm49-home :where(.hm-features-grid, .hm-pathways-grid, .hm-math-world-grid, .hm-pillars-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  body.hm49-home .hm-hero-mini-pill {
    grid-template-columns: 30px minmax(0, 1fr);
    min-height: 60px;
    padding: 8px !important;
  }

  body.hm49-home .hm-hero-mini-pill .hm-mini-pill-icon {
    width: 30px;
    height: 30px;
  }

  body.hm49-home .hm-hero-ctas {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.hm49-home .hm-hero-ctas > * {
    min-height: 48px !important;
    font-size: 13px !important;
  }
}

@media screen and (max-width: 370px) {
  :root { --hm61-gutter: 12px; }

  body.hm49-home .hm-hero-pills-row,
  body.hm49-home :where(.hm-features-grid, .hm-pathways-grid, .hm-math-world-grid, .hm-pillars-grid),
  body.hm49-home .hm-site-footer nav {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.hm49-home .hm-hero-title {
    font-size: 28px !important;
  }

  body.hm49-home .navbar {
    padding-inline: 12px !important;
  }
}

@media (prefers-reduced-motion: reduce) and (max-width: 760px) {
  body.hm49-home *,
  body.hm49-home *::before,
  body.hm49-home *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}


/* Shared mobile usability for interior routes. Neutral colors preserve each page's theme. */
@media screen and (max-width: 760px) {
  html, body:not(.hm49-home) {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
  }

  body:not(.hm49-home) :where(main, .container, .wrap, .page, .content, .page-content, .dashboard, .workspace, .section-inner) {
    min-width: 0;
    max-width: 100%;
  }

  body:not(.hm49-home) :where(.grid-2, .grid-3, .grid-4, .form-grid, .fields, .builder, .workspace-grid, .teacher-layout, .teacher-grid, .document-layout, .editor-grid, .account-grid, .import-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
    min-width: 0;
  }

  body:not(.hm49-home) :where(.card, .panel, .surface, .section-card, .feature-card, .tool-card, .dashboard-card, .workspace-card, .form-section) {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  body:not(.hm49-home) :where(button, a, [role=button], input, select, textarea) {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  body:not(.hm49-home) :where(button, a.btn, .btn, [role=button]) {
    min-height: 44px;
    max-width: 100%;
    white-space: normal;
    line-height: 1.45;
  }

  body:not(.hm49-home) :where(input, select, textarea) {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-height: 46px;
    font-size: 16px !important;
  }

  body:not(.hm49-home) :where(.actions, .toolbar, .top-actions, .button-row, .panel-header, .section-head, .page-header) {
    min-width: 0;
    max-width: 100%;
    flex-wrap: wrap;
    gap: 10px;
  }

  body:not(.hm49-home) :where(.table-wrap, .table-responsive, .table-container, .overflow-x-auto) {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  body:not(.hm49-home) table {
    max-width: 100%;
  }

  body:not(.hm49-home) :where(.modal, .dialog, [role=dialog]) {
    width: calc(100vw - 24px);
    max-width: calc(100vw - 24px);
    max-height: calc(100dvh - 24px);
    margin-inline: auto;
    overflow: auto;
    overscroll-behavior: contain;
  }

  body:not(.hm49-home) :where(.document-preview, .preview-page, .a4-preview, .document-sheet) {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }
}

@media screen and (max-width: 520px) {
  body:not(.hm49-home) :where(.grid-2, .grid-3, .grid-4, .form-grid, .fields, .builder, .workspace-grid, .teacher-layout, .teacher-grid, .document-layout, .editor-grid, .account-grid, .import-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body:not(.hm49-home) :where(.card, .panel, .surface, .section-card, .feature-card, .tool-card, .dashboard-card, .workspace-card, .form-section) {
    border-radius: 16px;
  }
}


/* v62 — visual language matching the approved mobile concept.
   Strictly phone-only: no selectors below can affect desktop rendering. */
@media screen and (max-width:760px) {
  :root {
    color-scheme:dark;
    --hm62-bg:#050d1e;
    --hm62-panel:#0a1b34;
    --hm62-panel2:#102747;
    --hm62-line:rgba(65,174,255,.28);
    --hm62-cyan:#24d7f2;
    --hm62-gold:#f4c64e;
    --hm62-text:#f2f7ff;
    --hm62-muted:#a9bfdc;
  }
  html,body { background-color:var(--hm62-bg)!important; }
  body:not(.hm49-home) {
    color:var(--hm62-text)!important;
    background:
      radial-gradient(ellipse at 85% 0,rgba(0,119,255,.18),transparent 38%),
      linear-gradient(180deg,#050d1e,#071831 62%,#050e20)!important;
    padding-bottom:calc(78px + env(safe-area-inset-bottom))!important;
  }
  body.hm49-home {
    background:
      radial-gradient(ellipse at 80% 4%,rgba(0,124,255,.2),transparent 36%),
      linear-gradient(180deg,#050d1e,#071831 62%,#050e20)!important;
    padding-bottom:calc(78px + env(safe-area-inset-bottom))!important;
  }
  body:not(.hm49-home) :where(.top,.topbar,header,.nav,.navbar) {
    background:rgba(4,13,29,.96)!important;
    color:var(--hm62-text)!important;
    border-color:var(--hm62-line)!important;
    box-shadow:0 8px 28px rgba(0,0,0,.25)!important;
    backdrop-filter:blur(18px);
  }
  body:not(.hm49-home) :where(.nav,.navbar) {
    min-height:62px!important;
    padding:8px 14px!important;
    gap:8px!important;
  }
  body:not(.hm49-home) :where(.brand,.logo,.site-title) {
    color:#fff!important;
    font-weight:950!important;
    letter-spacing:.01em;
  }
  body:not(.hm49-home) :where(.wrap,.page,.bac-page,.container,.main-container) {
    width:calc(100% - 24px)!important;
    max-width:560px!important;
    margin:14px auto 24px!important;
    padding:0!important;
  }
  body:not(.hm49-home) :where(.hero,.bac-hero,.growth-hero,.banner,.page-hero) {
    position:relative;
    overflow:hidden;
    margin:10px 0 14px!important;
    padding:23px 18px!important;
    border:1px solid var(--hm62-line)!important;
    border-radius:23px!important;
    color:#f5f9ff!important;
    background:
      radial-gradient(circle at 90% 10%,rgba(0,174,255,.22),transparent 38%),
      linear-gradient(145deg,#0c2c55,#07172e 72%)!important;
    box-shadow:0 16px 42px rgba(0,0,0,.26),inset 0 1px rgba(255,255,255,.06)!important;
    text-align:right;
  }
  body:not(.hm49-home) :where(.hero h1,.bac-hero h1,.growth-hero h2,.page-hero h1) {
    color:#fff!important;
    font-size:clamp(25px,7vw,34px)!important;
    line-height:1.35!important;
    font-weight:950!important;
  }
  body:not(.hm49-home) :where(.hero p,.bac-hero p,.growth-hero p,.page-hero p) {
    color:#c2d8f2!important;
    line-height:1.9!important;
    font-size:14px!important;
  }
  body:not(.hm49-home) :where(.panel,.card,.side,.chat,.bac-card,.resource,.exercise-card,.section-card,.feature-card,.dashboard-card,.workspace-card,.form-section,.growth-card,.stat,.filters,.preview) {
    color:var(--hm62-text)!important;
    background:linear-gradient(150deg,rgba(13,38,70,.98),rgba(7,23,45,.98))!important;
    border:1px solid var(--hm62-line)!important;
    border-radius:19px!important;
    box-shadow:0 9px 25px rgba(0,0,0,.2)!important;
  }
  body:not(.hm49-home) :where(h1,h2,h3,h4,strong,label) { color:#f3f8ff; }
  body:not(.hm49-home) :where(p,small,.muted,.hint,.description,.stat span) { color:var(--hm62-muted); }
  body:not(.hm49-home) :where(.grid,.stats,.filters,.fields,.layout,.bac-grid,.builder,.growth-grid,.persona-grid) {
    gap:11px!important;
  }
  body:not(.hm49-home) :where(.grid,.stats,.filters,.fields,.layout,.bac-grid,.builder,.growth-grid,.persona-grid) {
    grid-template-columns:minmax(0,1fr)!important;
  }
  body:not(.hm49-home) :where(input,select,textarea,.input,.select,.answer-input) {
    color:#f4f8ff!important;
    background:#06152a!important;
    border:1px solid rgba(91,169,237,.38)!important;
    border-radius:13px!important;
    min-height:48px!important;
    padding:12px 13px!important;
  }
  body:not(.hm49-home) :where(input,select,textarea)::placeholder { color:#829bb9!important; }
  body:not(.hm49-home) :where(button,.btn,.primary,.btn-primary,.solve,.action) {
    border-radius:13px!important;
    min-height:46px!important;
    font-weight:850!important;
  }
  body:not(.hm49-home) :where(.primary,.btn-primary,.solve,.action) {
    color:#03152a!important;
    background:linear-gradient(110deg,#23d5f1,#1688ef)!important;
    border:1px solid rgba(116,226,255,.5)!important;
    box-shadow:0 7px 20px rgba(0,139,255,.2)!important;
  }
  body:not(.hm49-home) :where(.secondary,.btn:not(.primary):not(.btn-primary)) {
    color:#edf6ff!important;
    background:linear-gradient(145deg,#17375d,#0d2341)!important;
    border:1px solid var(--hm62-line)!important;
  }
  body:not(.hm49-home) :where(.badge,.pill,.tag) {
    color:#a9f5ff!important;
    background:rgba(0,160,220,.13)!important;
    border:1px solid rgba(52,206,241,.22)!important;
    border-radius:99px!important;
  }
  body:not(.hm49-home) :where(.messages,.aianswer,.notice,.empty,.loading) {
    color:#eaf4ff!important;
    background:#06152a!important;
    border-color:var(--hm62-line)!important;
  }
  body:not(.hm49-home) :where(.user,.msg.user) {
    color:#f2f8ff!important;
    background:#123b66!important;
  }
  body:not(.hm49-home) :where(.ai,.msg.ai) {
    color:#eaf8f2!important;
    background:#102c2c!important;
  }
  body:not(.hm49-home) :where(.preview-page,.hamou-answer-paper) {
    color:#172033!important;
    background:#fff!important;
    border:1px solid #d6c58c!important;
  }
  body:not(.hm49-home) :where(.preview-page,.hamou-answer-paper) * { color:inherit; }
  body:not(.hm49-home) :where(.top a,.nav a) {
    color:#e9f5ff!important;
    border-color:rgba(74,158,228,.22)!important;
  }
  body.hm49-home :where(.hero,.growth-hero,.hero-card,.growth-card,.card,.persona,.education-card) {
    color:#f2f7ff!important;
    background:linear-gradient(145deg,#0d2b52,#07172e)!important;
    border:1px solid var(--hm62-line)!important;
    border-radius:20px!important;
    box-shadow:0 12px 30px rgba(0,0,0,.22)!important;
  }
  body.hm49-home :where(.hero h1,.hero h2,.growth-hero h2,.card h3) { color:#fff!important; }
  body.hm49-home :where(.hero p,.growth-hero p,.card p,.persona small) { color:#b8cce6!important; }
  body.hm49-home :where(.hero-actions a,.growth-actions a,.action,.btn-primary) {
    min-height:48px!important;
    border-radius:14px!important;
  }
  body.hm49-home :where(.eyebrow,.micro-proof span,.persona) {
    color:#c8f5ff!important;
    border-color:var(--hm62-line)!important;
    background:rgba(7,39,74,.82)!important;
  }
  body.hm49-home :where(.section-head h2,.growth-section h2) { color:#fff!important; }
  body.hm49-home :where(.section-head p) { color:#b3c8e3!important; }
  body.hm49-home :where(.hero-grid,.growth-grid,.persona-grid,.grid-2,.grid-3,.grid-4) {
    grid-template-columns:minmax(0,1fr)!important;
    gap:12px!important;
  }
  body.hm49-home :where(.container) { width:calc(100% - 24px)!important; }
  body.hm49-home :where(.hero-actions,.growth-actions) { display:grid!important;grid-template-columns:1fr!important; }
  body.hm49-home :where(.hero-actions a,.growth-actions a) { width:100%!important;justify-content:center; }
  body :where(button,a,input,select,textarea) { touch-action:manipulation;-webkit-tap-highlight-color:transparent; }
  body :where(a,button):focus-visible { outline:2px solid var(--hm62-cyan)!important;outline-offset:3px; }
  body :where(.modal,.dialog,[role=dialog]) {
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    max-height:calc(100dvh - 24px)!important;
    border-radius:20px!important;
  }
  body :where(table) { min-width:560px; }
  body :where(.table-wrap,.table-responsive,.table-container) { overflow-x:auto!important;max-width:100%; }
}
@media screen and (max-width:390px) {
  body:not(.hm49-home) :where(.wrap,.page,.bac-page,.container,.main-container) { width:calc(100% - 20px)!important; }
  body:not(.hm49-home) :where(.hero,.bac-hero,.growth-hero) { padding:19px 14px!important; }
}