:root {
      --blue: #1267ff;
      --deep: #052b64;
      --cyan: #14c9df;
      --mint: #20d6a5;
      --ink: #17243a;
      --muted: #6f7f95;
      --line: #e4edf8;
      --soft: #f2f7fd;
      --card: #ffffff;
      --warm: #d3ae82;
      --shadow: 0 16px 34px rgba(9, 50, 107, .12);
    }

    * {
      box-sizing: border-box;
    }

    .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    html {
      min-height: 100%;
      background:
        radial-gradient(circle at 22% 0%, rgba(20, 201, 223, .18), transparent 32%),
        linear-gradient(180deg, #edf4fb 0%, #f7f9fc 100%);
      color: var(--ink);
      font-family: "HarmonyOS Sans SC", "MiSans", "Alibaba PuHuiTi 3.0", "PingFang SC", "Microsoft YaHei", "Segoe UI", Arial, sans-serif;
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
      overflow-x: hidden;
    }

    body {
      margin: 0;
      min-height: 100%;
      background: #eef3f8;
      overflow-x: hidden;
    }

    button,
    input {
      font: inherit;
    }

    button {
      border: 0;
      cursor: pointer;
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    svg {
      display: block;
      flex: 0 0 auto;
      max-width: 100%;
      max-height: 100%;
    }

    .phone-shell {
      position: relative;
      width: min(100vw, 480px);
      max-width: 480px;
      min-height: 100vh;
      margin: 0 auto;
      padding: 14px 16px 96px;
      background:
        radial-gradient(circle at 78px 12px, rgba(19, 199, 214, .22), transparent 96px),
        linear-gradient(180deg, #f8fbff 0%, #eef5fb 38%, #f7f9fc 100%);
      overflow: hidden;
    }

    .phone-shell::before {
      position: absolute;
      inset: 0 0 auto;
      height: 260px;
      pointer-events: none;
      content: "";
      background:
        linear-gradient(120deg, rgba(18, 103, 255, .09), transparent 45%),
        radial-gradient(circle at 82% 12%, rgba(32, 214, 165, .18), transparent 30%);
    }

    .notice {
      display: flex;
      align-items: center;
      gap: 10px;
      min-height: 44px;
      padding: 0 14px;
      border: 1px solid rgba(226, 236, 248, .8);
      border-radius: 14px;
      background: rgba(255, 255, 255, .78);
      color: #24456e;
      font-size: 14px;
      font-weight: 600;
      box-shadow: 0 10px 26px rgba(43, 78, 119, .06);
      backdrop-filter: blur(18px);
      overflow: hidden;
    }

    .notice svg {
      width: 20px;
      height: 20px;
      flex: 0 0 auto;
      color: #f5a623;
    }

    .notice-window {
      flex: 1;
      min-width: 0;
      overflow: hidden;
      white-space: nowrap;
    }

    .notice-track {
      display: inline-block;
      min-width: max-content;
      padding-left: 100%;
      animation: notice-marquee 32s linear infinite;
      animation-delay: -3s;
    }

    @keyframes notice-marquee {
      from { transform: translateX(0); }
      to { transform: translateX(-100%); }
    }

    .hero-strip {
      margin: 16px -16px 16px;
      padding: 0 16px;
      overflow-x: auto;
      overflow-y: hidden;
      max-width: calc(100% + 32px);
      scrollbar-width: none;
      cursor: grab;
      touch-action: pan-x;
    }

    .hero-strip::-webkit-scrollbar {
      display: none;
    }

    .hero-strip.is-dragging {
      cursor: grabbing;
      user-select: none;
    }

    .hero-track {
      display: flex;
      gap: 10px;
      width: max-content;
      padding-right: 10px;
    }

    .hero-card {
      position: relative;
      flex: 0 0 220px;
      min-height: 116px;
      overflow: hidden;
      border-radius: 14px;
      color: #fff;
      background: #0f4fc5;
      box-shadow: 0 18px 42px rgba(6, 44, 112, .2);
      isolation: isolate;
      user-select: none;
      -webkit-user-drag: none;
    }

    .hero-card img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      z-index: -2;
      pointer-events: none;
      -webkit-user-drag: none;
    }

    .hero-card.topic-bg::before {
      position: absolute;
      inset: 0;
      z-index: -2;
      background-image: var(--topic-bg);
      background-size: cover;
      background-position: center;
      opacity: .58;
      content: "";
    }

    .hero-card.topic-pd { --topic-bg: url("../../assets/hero-card-pd.webp"); }
    .hero-card.topic-tremor { --topic-bg: url("../../assets/hero-card-tremor.webp"); }
    .hero-card.topic-ad { --topic-bg: url("../../assets/hero-card-ad.webp"); }
    .hero-card.topic-fus { --topic-bg: url("../../assets/hero-card-fus.webp"); }
    .hero-card.topic-live { --topic-bg: url("../../assets/hero-card-live.webp"); }

    .hero-card::after {
      position: absolute;
      inset: 0;
      content: "";
      background:
        linear-gradient(90deg, rgba(3, 24, 76, .84) 0%, rgba(8, 63, 153, .58) 46%, rgba(7, 60, 147, .06) 100%),
        linear-gradient(180deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, .26));
      z-index: -1;
    }

    .hero-card.topic-bg::after {
      background:
        linear-gradient(90deg, rgba(3, 24, 76, .94) 0%, rgba(6, 42, 112, .68) 52%, rgba(5, 35, 96, .26) 100%),
        linear-gradient(180deg, rgba(0, 0, 0, .1), rgba(0, 0, 0, .32));
    }

    .hero-content {
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-height: 116px;
      padding: 12px 13px;
    }

    .eyebrow {
      width: fit-content;
      margin-bottom: 7px;
      padding: 4px 8px;
      border-radius: 999px;
      background: rgba(255, 255, 255, .17);
      color: rgba(255, 255, 255, .9);
      font-size: 11px;
      font-weight: 700;
      line-height: 1;
      backdrop-filter: blur(12px);
    }

    h1,
    h2,
    h3,
    p {
      margin: 0;
    }

    .hero-content h2 {
      max-width: 198px;
      font-size: 19px;
      line-height: 1.12;
      font-weight: 900;
      letter-spacing: 0;
    }

    .hero-card p {
      max-width: 198px;
      margin-top: 6px;
      color: rgba(255, 255, 255, .86);
      font-size: 11px;
      line-height: 1.46;
      font-weight: 500;
    }

    .mini-hero {
      background:
        radial-gradient(circle at 80% 20%, rgba(255, 255, 255, .24), transparent 28%),
        linear-gradient(135deg, #1148d8 0%, #13b9d6 100%);
    }

    .mini-hero::after {
      background: linear-gradient(90deg, rgba(3, 42, 118, .76), rgba(3, 42, 118, .15));
    }

    .contact-band {
      display: flex;
      align-items: center;
      gap: 12px;
      min-width: 0;
      margin-bottom: 18px;
      padding: 12px;
      border: 1px solid rgba(226, 236, 248, .82);
      border-radius: 16px;
      background: rgba(255, 255, 255, .88);
      box-shadow: 0 14px 32px rgba(30, 75, 125, .09);
      backdrop-filter: blur(16px);
    }

    .brand-mark {
      display: grid;
      width: 52px;
      height: 52px;
      place-items: center;
      flex: 0 0 auto;
      border-radius: 18px;
      background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, .7), transparent 24%),
        linear-gradient(135deg, #1267ff, #15cde0);
      color: #fff;
      box-shadow: 0 12px 22px rgba(20, 100, 255, .26);
    }

    .brand-mark svg {
      width: 27px;
      height: 27px;
    }

    .contact-copy {
      min-width: 0;
      flex: 1;
    }

    .contact-copy strong {
      display: block;
      overflow: hidden;
      color: var(--deep);
      font-size: 16px;
      font-weight: 900;
      line-height: 1.2;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .contact-copy span {
      display: block;
      overflow: hidden;
      margin-top: 4px;
      color: var(--muted);
      font-size: 12px;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .pill-button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 5px;
      min-width: 84px;
      flex: 0 0 auto;
      height: 38px;
      padding: 0 12px;
      border-radius: 999px;
      background: linear-gradient(135deg, #1267ff, #0f4dd8);
      color: #fff;
      font-size: 14px;
      font-weight: 700;
      white-space: nowrap;
      box-shadow: 0 12px 22px rgba(21, 94, 232, .28);
    }

    .pill-button svg {
      width: 16px;
      height: 16px;
    }

    .category-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
      margin: 6px 0 20px;
    }

    .category-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      min-width: 0;
      min-height: 92px;
      padding: 0 2px;
      border: 0;
      border-radius: 0;
      background: transparent;
      color: var(--deep);
      font-size: 13px;
      font-weight: 900;
      text-align: center;
      box-shadow: none;
    }

    .category-icon {
      position: relative;
      display: grid;
      width: 66px;
      height: 66px;
      place-items: center;
      border: 1px solid rgba(255, 255, 255, .82);
      border-radius: 22px;
      color: var(--blue);
      background:
        radial-gradient(circle at 30% 22%, rgba(255, 255, 255, .96), transparent 28%),
        linear-gradient(145deg, #f8fcff 0%, #dff4ff 56%, #b8e7ff 100%);
      box-shadow:
        0 13px 22px rgba(18, 103, 255, .12),
        inset 0 -8px 15px rgba(18, 103, 255, .10),
        inset 0 1px 0 rgba(255, 255, 255, .74);
      overflow: hidden;
    }

    .category-icon::before {
      position: absolute;
      inset: 6px auto auto 8px;
      width: 20px;
      height: 10px;
      border-radius: 999px;
      background: rgba(255, 255, 255, .72);
      content: "";
      filter: blur(1px);
    }

    .category-icon::after {
      position: absolute;
      right: 7px;
      bottom: 7px;
      width: 13px;
      height: 13px;
      border-radius: 50%;
      background: var(--accent, var(--mint));
      box-shadow: 0 0 0 4px rgba(32, 214, 165, .14);
      content: "";
    }

    .category-icon svg {
      position: relative;
      z-index: 1;
      width: 38px;
      height: 38px;
      filter: drop-shadow(0 6px 7px rgba(18, 103, 255, .16));
    }

    .c1,
    .c2,
    .c3,
    .c4 { background:
        radial-gradient(circle at 30% 22%, rgba(255, 255, 255, .96), transparent 28%),
        linear-gradient(145deg, #f8fcff 0%, #dff4ff 56%, #b8e7ff 100%);
    }

    .c1 {
      --accent: #22c55e;
      color: #0f5dff;
      background:
        radial-gradient(circle at 28% 20%, rgba(255, 255, 255, .96), transparent 28%),
        radial-gradient(circle at 76% 78%, rgba(34, 197, 94, .24), transparent 30%),
        linear-gradient(145deg, #f8fcff 0%, #dff4ff 56%, #b9e8ff 100%);
    }

    .c2 {
      --accent: #14b8a6;
      color: #0d8fd8;
      background:
        radial-gradient(circle at 28% 20%, rgba(255, 255, 255, .96), transparent 28%),
        radial-gradient(circle at 80% 75%, rgba(20, 184, 166, .24), transparent 31%),
        linear-gradient(145deg, #f7fdff 0%, #d9f5ff 52%, #c9f4ee 100%);
    }

    .c3 {
      --accent: #5ed6ff;
      color: #1556d6;
      background:
        radial-gradient(circle at 28% 20%, rgba(255, 255, 255, .96), transparent 28%),
        radial-gradient(circle at 78% 76%, rgba(94, 214, 255, .30), transparent 30%),
        linear-gradient(145deg, #f8fbff 0%, #e4f0ff 54%, #d4e4ff 100%);
    }

    .c4 {
      --accent: #0f5dff;
      color: #0678c9;
      background:
        radial-gradient(circle at 28% 20%, rgba(255, 255, 255, .96), transparent 28%),
        radial-gradient(circle at 76% 76%, rgba(15, 93, 255, .22), transparent 30%),
        linear-gradient(145deg, #f7fdff 0%, #d6f4ff 52%, #c8ebff 100%);
    }

    .search {
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      height: 43px;
      margin-bottom: 24px;
      padding: 0 44px;
      border-radius: 999px;
      background: rgba(232, 239, 247, .9);
      color: #99a4b4;
      font-size: 16px;
      border: 1px solid rgba(255, 255, 255, .78);
      box-shadow: inset 0 1px 4px rgba(24, 57, 94, .04);
    }

    .search svg {
      position: absolute;
      left: 18px;
      top: 50%;
      transform: translateY(-50%);
      width: 20px;
      height: 20px;
      color: #9da8b8;
    }

    .search input {
      min-width: 0;
      flex: 1;
      border: 0;
      outline: 0;
      background: transparent;
      color: var(--ink);
      font-size: 15px;
      font-weight: 600;
      text-align: center;
      cursor: pointer;
    }

    .search input::placeholder {
      color: #9da8b8;
      font-weight: 500;
    }

    .search-feedback {
      display: none;
      margin: -12px 2px 20px;
      color: #7d8ba0;
      font-size: 13px;
      line-height: 1.5;
    }

    .search-feedback.show {
      display: block;
    }

    .search-results {
      display: grid;
      gap: 10px;
      margin: -6px 0 22px;
    }

    .search-results[hidden] {
      display: none;
    }

    body.is-searching .category-grid,
    body.is-searching .contact-band,
    body.is-searching .section,
    body.is-searching .contact-panel,
    body.is-searching footer {
      display: none;
    }

    .search-results-head {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 12px;
    }

    .search-results-head strong {
      color: var(--deep);
      font-size: 17px;
      line-height: 1.3;
      font-weight: 950;
    }

    .search-results-head span {
      flex: 0 0 auto;
      color: #7d8ba0;
      font-size: 12px;
      white-space: nowrap;
    }

    .search-result-card {
      display: grid;
      gap: 8px;
      padding: 13px 14px;
      border: 1px solid rgba(218, 232, 246, .92);
      border-radius: 14px;
      background: rgba(255, 255, 255, .94);
      box-shadow: 0 10px 24px rgba(29, 67, 116, .07);
    }

    .search-result-card:focus-visible {
      outline: 0;
      box-shadow: 0 0 0 3px rgba(18, 103, 255, .2), 0 10px 24px rgba(29, 67, 116, .07);
    }

    .result-meta {
      display: flex;
      align-items: center;
      gap: 8px;
      color: var(--blue);
      font-size: 12px;
      font-weight: 900;
    }

    .result-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--mint);
      box-shadow: 0 0 0 4px rgba(32, 214, 165, .12);
    }

    .search-result-card h3 {
      color: #17243a;
      font-size: 15px;
      line-height: 1.42;
      font-weight: 900;
      overflow-wrap: anywhere;
    }

    .search-result-card p {
      color: #607089;
      font-size: 13px;
      line-height: 1.55;
      overflow-wrap: anywhere;
    }

    .search-empty {
      display: grid;
      gap: 12px;
      padding: 16px;
      border: 1px dashed #cbdff2;
      border-radius: 14px;
      background: rgba(255, 255, 255, .86);
      color: #607089;
    }

    .search-empty span {
      color: #607089;
      font-size: 14px;
      line-height: 1.65;
    }

    .search-empty strong {
      color: var(--deep);
      font-size: 16px;
      line-height: 1.35;
      font-weight: 950;
    }

    .search-suggestions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .search-suggestions button,
    .search-suggestions a {
      display: inline-flex;
      align-items: center;
      border: 0;
      min-height: 32px;
      padding: 0 11px;
      border-radius: 999px;
      background: #eaf4ff;
      color: var(--blue);
      font-size: 13px;
      font-weight: 850;
    }

    .recommend-list {
      display: grid;
      gap: 10px;
      margin-top: 4px;
    }

    .system-card {
      grid-column: 1 / -1;
      display: grid;
      min-height: 110px;
      place-items: center;
      padding: 16px;
      border: 1px dashed #cbdff2;
      border-radius: 12px;
      background: rgba(255, 255, 255, .82);
      color: #6f7f95;
      font-size: 14px;
      font-weight: 800;
      text-align: center;
    }

    .empty-state-card {
      grid-column: 1 / -1;
      display: grid;
      gap: 12px;
      min-height: 136px;
      align-content: center;
      padding: 18px;
      border: 1px solid rgba(203, 223, 242, .9);
      border-radius: 14px;
      background: rgba(255, 255, 255, .9);
      color: #607089;
      text-align: left;
      box-shadow: 0 10px 24px rgba(29, 67, 116, .06);
    }

    .empty-state-card strong {
      display: block;
      color: var(--deep);
      font-size: 16px;
      line-height: 1.35;
      font-weight: 900;
    }

    .empty-state-card span {
      display: block;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.55;
    }

    .empty-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .empty-actions a,
    .empty-actions button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 34px;
      padding: 0 12px;
      border-radius: 999px;
      background: #eaf4ff;
      color: var(--blue);
      font-size: 13px;
      font-weight: 850;
    }

    .empty-actions .primary {
      background: linear-gradient(135deg, #1267ff, #0f4dd8);
      color: #fff;
      box-shadow: 0 10px 20px rgba(18, 103, 255, .2);
    }

    .section {
      margin-top: 30px;
    }

    .section-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 14px;
    }

    .section-title {
      min-width: 0;
      color: var(--deep);
      font-size: 22px;
      line-height: 1.2;
      font-weight: 900;
      letter-spacing: 0;
    }

    .more {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      flex: 0 0 auto;
      color: #8593a4;
      font-size: 13px;
      white-space: nowrap;
    }

    .more svg {
      width: 15px;
      height: 15px;
    }

    .two-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }

    .three-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }

    .content-card {
      display: flex;
      flex-direction: column;
      min-width: 0;
      overflow: hidden;
      border: 1px solid rgba(223, 232, 242, .86);
      border-radius: 12px;
      background: var(--card);
      box-shadow: 0 12px 30px rgba(29, 67, 116, .09);
      cursor: pointer;
      outline: 0;
    }

    .content-card:focus-visible {
      box-shadow: 0 0 0 3px rgba(15, 93, 255, .22), 0 12px 30px rgba(29, 67, 116, .09);
    }

    .two-grid .content-card {
      aspect-ratio: 1 / 1;
    }

    .three-grid .content-card {
      aspect-ratio: 1 / 1;
    }

    .thumb {
      position: relative;
      display: flex;
      flex: 1 1 auto;
      min-height: 0;
      padding: 13px;
      align-items: flex-end;
      color: #fff;
      background: linear-gradient(135deg, #125de5, #16cad7);
      background-size: cover;
      background-position: center;
      overflow: hidden;
    }

    .thumb::before {
      position: absolute;
      inset: 0;
      width: auto;
      height: auto;
      right: auto;
      top: auto;
      border: 0;
      border-radius: 0;
      background: linear-gradient(180deg, rgba(2, 22, 58, .08), rgba(2, 22, 58, .54));
      content: "";
    }

    .thumb::after {
      position: absolute;
      inset: 0;
      width: auto;
      height: auto;
      right: auto;
      bottom: auto;
      border-radius: 0;
      background:
        radial-gradient(circle at 86% 16%, rgba(255, 255, 255, .24), transparent 26%),
        linear-gradient(100deg, rgba(7, 38, 98, .58), transparent 62%);
      content: "";
    }

    .cover-live .thumb,
    .cover-live-studio .thumb { background-image: linear-gradient(120deg, rgba(9, 65, 162, .08), rgba(94, 214, 255, .34)), url("../../assets/admin-avatar.png"); }
    .cover-live-roundtable .thumb { background-image: linear-gradient(135deg, rgba(0, 72, 180, .58), rgba(0, 188, 212, .22)), url("../../assets/admin-avatar.png"); background-position: 58% center; }
    .cover-fus .thumb,
    .cover-fus-precision .thumb { background-image: linear-gradient(135deg, rgba(3, 29, 90, .08), rgba(0, 205, 214, .2)), url("../../assets/admin-avatar.png"); }
    .cover-fus-principle .thumb { background: radial-gradient(circle at 78% 24%, rgba(94, 214, 255, .95), transparent 18%), radial-gradient(circle at 76% 28%, transparent 0 16%, rgba(255,255,255,.4) 17% 18%, transparent 19%), linear-gradient(135deg, #073a9a, #0f7dff 54%, #13c8c9); }
    .cover-fus-process .thumb { background-image: linear-gradient(150deg, rgba(3, 31, 91, .66), rgba(15, 93, 255, .16)), url("../../assets/banner-home-main.webp"); background-position: 60% center; }
    .cover-fus-guide .thumb { background: radial-gradient(circle at 82% 18%, rgba(34, 197, 94, .85), transparent 16%), linear-gradient(145deg, #053986, #0f5dff 62%, #5ed6ff); }
    .cover-ad .thumb,
    .cover-ad-memory .thumb { background-image: linear-gradient(135deg, rgba(8, 68, 164, .1), rgba(34, 197, 94, .18)), url("../../assets/admin-avatar.png"); background-position: 58% center; }
    .cover-ad-family .thumb { background-image: linear-gradient(135deg, rgba(7, 66, 152, .58), rgba(94, 214, 255, .18)), url("../../assets/cover-ad.webp"); }
    .cover-pd .thumb,
    .cover-pd-symptom .thumb { background-image: linear-gradient(135deg, rgba(5, 43, 100, .42), rgba(15, 93, 255, .08)), url("../../assets/admin-avatar.png"); }
    .cover-pd-medication .thumb { background: radial-gradient(circle at 76% 24%, rgba(94, 214, 255, .68), transparent 22%), linear-gradient(135deg, #06418f, #0f5dff 56%, #22c55e); }
    .cover-pd-surgery .thumb { background-image: linear-gradient(135deg, rgba(5, 43, 100, .62), rgba(15, 93, 255, .12)), url("../../assets/hero-focused-ultrasound.webp"); background-position: 64% center; }
    .cover-tremor-hands .thumb { background-image: linear-gradient(135deg, rgba(5, 43, 100, .48), rgba(34, 197, 94, .12)), url("../../assets/banner-tremor.webp"); background-position: 58% center; }
    .cover-tremor-writing .thumb { background: radial-gradient(circle at 78% 22%, rgba(34, 197, 94, .75), transparent 17%), linear-gradient(145deg, #06367c, #1169ff 54%, #5ed6ff); }
    .cover-story-care .thumb { background: radial-gradient(circle at 78% 24%, rgba(255, 255, 255, .28), transparent 18%), linear-gradient(135deg, #0752b6, #18a4cf 58%, #22c55e); }
    .cover-custom .thumb { background-image: linear-gradient(180deg, rgba(2, 24, 65, .04) 0%, rgba(2, 28, 72, .34) 58%, rgba(2, 26, 70, .74) 100%), var(--custom-cover); }

    .thumb-title {
      display: none;
      position: relative;
      z-index: 2;
      max-width: 92%;
      font-size: 18px;
      line-height: 1.22;
      font-weight: 900;
      text-shadow: 0 2px 10px rgba(0, 20, 55, .28);
    }

    .thumb .badge {
      position: absolute;
      right: 8px;
      bottom: 8px;
      z-index: 3;
      padding: 3px 6px;
      border-radius: 6px;
      background: rgba(5, 37, 84, .68);
      color: #fff;
      font-size: 11px;
      font-weight: 700;
      backdrop-filter: blur(10px);
    }

    .card-body {
      flex: 0 0 auto;
      padding: 10px 11px 11px;
    }

    .card-title {
      display: -webkit-box;
      overflow: hidden;
      min-height: 42px;
      color: #222c3b;
      font-size: 15px;
      line-height: 1.38;
      font-weight: 800;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

    .card-meta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      margin-top: 8px;
    }

    .tag {
      display: inline-flex;
      align-items: center;
      min-width: 0;
      min-height: 24px;
      padding: 3px 7px;
      border-radius: 4px;
      background: #eaf2ff;
      color: var(--blue);
      font-size: 12px;
      font-weight: 700;
      line-height: 1.2;
    }

    .mini-action {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      height: 30px;
      padding: 0 11px;
      border-radius: 999px;
      background: linear-gradient(135deg, #1267ff, #0d51db);
      color: #fff;
      font-size: 13px;
      font-weight: 700;
      white-space: nowrap;
    }

    .mini-action svg {
      width: 14px;
      height: 14px;
    }

    .content-card.is-video .badge,
    .content-card.is-video .mini-action {
      background: linear-gradient(135deg, #0f5dff, #22c55e);
      color: #fff;
    }

    .content-card:not([data-external-watch="1"]) .card-meta {
      display: none;
    }

    .two-grid .content-card[data-external-watch="1"],
    .three-grid .content-card[data-external-watch="1"] {
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: minmax(0, 44%) minmax(0, 1fr);
      height: 138px;
      aspect-ratio: auto;
      border-radius: 14px;
      box-shadow: 0 16px 34px rgba(29, 67, 116, .13);
    }

    .content-card[data-external-watch="1"] .thumb {
      width: 100%;
      height: 100%;
      aspect-ratio: auto;
      min-height: 0;
      padding: 0;
    }

    .content-card[data-external-watch="1"] .external-platform {
      position: absolute;
      left: 8px;
      top: 8px;
      z-index: 3;
      overflow: hidden;
      max-width: calc(100% - 16px);
      padding: 4px 7px;
      border: 1px solid rgba(255, 255, 255, .28);
      border-radius: 999px;
      background: rgba(4, 29, 70, .66);
      color: #fff;
      font-size: 11px;
      font-weight: 750;
      line-height: 1.2;
      text-overflow: ellipsis;
      white-space: nowrap;
      backdrop-filter: blur(12px);
    }

    .content-card[data-external-watch="1"] .card-body {
      display: flex;
      flex-direction: column;
      min-width: 0;
      padding: 11px 12px;
    }

    .content-card[data-external-watch="1"] .card-title {
      min-height: 0;
      font-size: 15px;
      line-height: 1.35;
    }

    .content-card[data-external-watch="1"] .card-meta {
      display: flex;
      justify-content: flex-start;
      margin-top: auto;
    }

    .external-live-time {
      overflow: hidden;
      margin-top: 6px;
      color: #7b8ba0;
      font-size: 12px;
      font-weight: 650;
      line-height: 1.35;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    html[data-theme="dark"] .external-live-time {
      color: #a7bbd2;
    }

    .content-card[data-external-watch="1"] .mini-action {
      min-width: 92px;
      justify-content: center;
      background: #1677ff;
      box-shadow: 0 8px 18px rgba(22, 119, 255, .18);
    }

    .content-card[data-live-status="live"] .badge {
      background: rgba(239, 68, 68, .92);
    }

    .content-card[data-live-status="preview"] .badge {
      background: rgba(37, 99, 235, .92);
    }

    .content-card[data-live-status="preview"] .mini-action {
      background: #eaf3ff;
      color: #1267ff;
      box-shadow: none;
    }

    .content-card[data-live-status="replay"] .badge {
      background: rgba(51, 65, 85, .88);
    }

    .content-card[data-live-status="replay"] .mini-action {
      background: #edf2f7;
      color: #27415f;
      box-shadow: none;
    }

    html[data-theme="dark"] .content-card[data-live-status="preview"] .mini-action,
    html[data-theme="dark"] .content-card[data-live-status="replay"] .mini-action {
      background: rgba(67, 111, 174, .24);
      color: #b8d7ff;
    }

    .content-card.is-video:not([data-external-watch="1"]) .thumb::before {
      position: absolute;
      right: 12px;
      top: 12px;
      z-index: 2;
      display: grid;
      width: 34px;
      height: 34px;
      place-items: center;
      border-radius: 999px;
      background: rgba(255, 255, 255, .92);
      color: var(--blue);
      font-size: 18px;
      font-weight: 900;
      box-shadow: 0 8px 20px rgba(5, 25, 58, .18);
      content: "▶";
    }

    .video-showcase {
      display: grid;
      gap: 12px;
      min-width: 0;
    }

    .video-showcase .content-card {
      aspect-ratio: auto;
    }

    .video-feature-card {
      display: grid;
      grid-template-columns: minmax(0, 54%) minmax(0, 46%);
      width: 100%;
      height: 142px;
      max-height: 142px;
      min-height: 142px;
      overflow: hidden;
      border: 1px solid rgba(214, 227, 242, .92);
      border-radius: 14px;
      background: rgba(255, 255, 255, .96);
      box-shadow: 0 18px 42px rgba(28, 72, 125, .12);
    }

    .video-cover {
      position: relative;
      width: 100%;
      aspect-ratio: 16 / 9;
      overflow: hidden;
      background: #dce8f5;
      isolation: isolate;
    }

    .video-feature-card > .video-cover {
      height: 100%;
      max-height: 142px;
      min-height: 142px;
      aspect-ratio: auto;
    }

    .video-cover::after {
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      background: linear-gradient(180deg, rgba(4, 21, 48, .02) 42%, rgba(4, 21, 48, .28) 100%);
      content: "";
    }

    .video-cover img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform .35s ease;
    }

    .video-feature-card:hover .video-cover img,
    .video-compact-card:hover .video-cover img {
      transform: scale(1.025);
    }

    .video-cover-fallback {
      display: block;
      width: 100%;
      height: 100%;
      background: url("../../assets/admin-avatar.png") center / cover no-repeat;
    }

    .video-play {
      position: absolute;
      left: 50%;
      top: 50%;
      z-index: 2;
      display: grid;
      width: 46px;
      height: 46px;
      place-items: center;
      border: 1px solid rgba(255, 255, 255, .76);
      border-radius: 50%;
      background: rgba(255, 255, 255, .92);
      color: #174b8f;
      box-shadow: 0 12px 30px rgba(4, 25, 58, .24);
      transform: translate(-50%, -50%);
      backdrop-filter: blur(12px);
    }

    .video-play svg {
      width: 24px;
      height: 24px;
      margin-left: 2px;
    }

    .video-type-badge {
      position: absolute;
      right: 10px;
      bottom: 10px;
      z-index: 2;
      padding: 4px 7px;
      border-radius: 5px;
      background: rgba(10, 34, 69, .74);
      color: #fff;
      font-size: 11px;
      font-weight: 800;
      line-height: 1;
      backdrop-filter: blur(10px);
    }

    .video-feature-copy {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      min-width: 0;
      justify-content: center;
      padding: 9px 11px 10px;
    }

    .video-feature-copy .card-title {
      min-height: 0;
      color: #122f55;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: var(--title-letter-spacing);
      -webkit-line-clamp: 2;
    }

    .video-tags {
      display: flex;
      align-items: center;
      gap: 5px;
      width: 100%;
      min-height: 18px;
      margin-top: 5px;
      overflow: hidden;
      white-space: nowrap;
    }

    .video-tags.is-empty {
      display: none;
    }

    .video-tag {
      display: inline-flex;
      align-items: center;
      min-width: 0;
      max-width: 100%;
      min-height: 18px;
      padding: 0 6px;
      overflow: hidden;
      border-radius: 5px;
      background: #edf5ff;
      color: #31649d;
      font-size: 9.5px;
      font-weight: 800;
      line-height: 1;
      text-overflow: ellipsis;
    }

    .video-meta {
      display: flex;
      align-items: center;
      gap: 6px;
      min-width: 0;
      justify-content: flex-start;
      width: 100%;
      margin-top: 6px;
      color: #778aa3;
      font-size: 10px;
      font-weight: 700;
      line-height: 1;
    }

    .video-meta-item {
      display: inline-flex;
      align-items: center;
      gap: 3px;
      min-width: 0;
      white-space: nowrap;
    }

    .video-meta-item svg {
      width: 13px;
      height: 13px;
    }

    .video-meta-item.is-loading {
      color: #98a8ba;
    }

    .video-meta-divider {
      width: 1px;
      height: 11px;
      background: #d7e1ed;
    }

    .video-watch-action {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 4px;
      align-self: center;
      min-height: 28px;
      margin-top: 8px;
      padding: 0 10px;
      border-radius: 999px;
      background: #1259ad;
      color: #fff;
      font-size: 10.5px;
      font-weight: 850;
      box-shadow: 0 10px 20px rgba(18, 89, 173, .2);
    }

    .video-watch-action svg {
      width: 13px;
      height: 13px;
    }

    .video-watch-action svg:last-child {
      width: 12px;
      height: 12px;
    }

    .video-compact-list {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 10px;
    }

    .video-compact-card {
      display: grid;
      grid-template-columns: minmax(0, 43%) minmax(0, 1fr);
      min-height: 94px;
      border: 1px solid rgba(218, 229, 242, .9);
      border-radius: 12px;
      background: rgba(255, 255, 255, .94);
      box-shadow: 0 10px 26px rgba(28, 72, 125, .08);
    }

    .video-compact-cover {
      height: 100%;
      min-height: 94px;
      aspect-ratio: auto;
    }

    .video-compact-cover .video-play {
      width: 38px;
      height: 38px;
      box-shadow: 0 8px 18px rgba(4, 25, 58, .2);
    }

    .video-compact-cover .video-play svg {
      width: 21px;
      height: 21px;
    }

    .video-compact-cover .video-type-badge {
      right: 7px;
      bottom: 7px;
      padding: 3px 5px;
    }

    .video-compact-copy {
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-width: 0;
      padding: 8px 11px;
    }

    .video-compact-copy .card-title {
      min-height: 0;
      color: #153052;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: var(--title-letter-spacing);
      -webkit-line-clamp: 2;
    }

    .video-compact-copy .video-meta {
      gap: 7px;
      margin-top: 5px;
      font-size: 11px;
    }

    .video-compact-copy .video-meta-divider {
      height: 11px;
    }

    html[data-theme="dark"] .video-feature-card,
    html[data-theme="dark"] .video-compact-card {
      border-color: rgba(105, 135, 174, .24);
      background: #111e31;
      box-shadow: 0 20px 44px rgba(0, 0, 0, .26);
    }

    html[data-theme="dark"] .video-feature-copy .card-title,
    html[data-theme="dark"] .video-compact-copy .card-title {
      color: #f2f7ff;
    }

    html[data-theme="dark"] .video-tag {
      background: rgba(73, 130, 200, .18);
      color: #b9d7ff;
    }

    html[data-theme="dark"] .video-meta {
      color: #9fb1c8;
    }

    html[data-theme="dark"] .video-meta-item.is-loading {
      color: #7f91a8;
    }

    html[data-theme="dark"] .video-meta-divider {
      background: rgba(147, 169, 198, .28);
    }

    html[data-theme="dark"] .video-play {
      border-color: rgba(185, 211, 247, .36);
      background: rgba(15, 31, 53, .88);
      color: #d7e8ff;
      box-shadow: 0 14px 34px rgba(0, 0, 0, .34);
    }

    html[data-theme="dark"] .video-watch-action {
      background: #4d91ec;
      color: #07111f;
      box-shadow: 0 12px 24px rgba(77, 145, 236, .22);
    }

    .article-card .thumb {
      min-height: 0;
      background: linear-gradient(135deg, #12b8d8 0%, #1166df 65%, #0a378e 100%);
    }

    .ad-card .thumb {
      background: linear-gradient(135deg, #0a56d8, #25c4b1);
    }

    .article-card.cover-live .thumb,
    .article-card.cover-live-studio .thumb,
    .article-card.cover-live-roundtable .thumb,
    .therapy-card.cover-live .thumb {
      background-image: url("../../assets/admin-avatar.png");
    }

    .article-card.cover-fus .thumb,
    .therapy-card.cover-fus .thumb {
      background-image: url("../../assets/admin-avatar.png");
    }

    .article-card.cover-ad .thumb,
    .therapy-card.cover-ad .thumb,
    .ad-card.cover-ad .thumb {
      background-image: url("../../assets/admin-avatar.png");
    }

    .article-card.cover-pd .thumb,
    .therapy-card.cover-pd .thumb {
      background-image: url("../../assets/admin-avatar.png");
      background-position: 64% center;
    }

    .article-card.cover-live-studio .thumb,
    .therapy-card.cover-live-studio .thumb { background-image: linear-gradient(120deg, rgba(9, 65, 162, .08), rgba(94, 214, 255, .34)), url("../../assets/admin-avatar.png"); }
    .article-card.cover-live-roundtable .thumb,
    .therapy-card.cover-live-roundtable .thumb { background-image: linear-gradient(135deg, rgba(0, 72, 180, .58), rgba(0, 188, 212, .22)), url("../../assets/admin-avatar.png"); background-position: 58% center; }
    .article-card.cover-fus-precision .thumb,
    .therapy-card.cover-fus-precision .thumb { background-image: linear-gradient(135deg, rgba(3, 29, 90, .08), rgba(0, 205, 214, .2)), url("../../assets/admin-avatar.png"); }
    .article-card.cover-fus-principle .thumb,
    .therapy-card.cover-fus-principle .thumb { background: radial-gradient(circle at 78% 24%, rgba(94, 214, 255, .95), transparent 18%), radial-gradient(circle at 76% 28%, transparent 0 16%, rgba(255,255,255,.4) 17% 18%, transparent 19%), linear-gradient(135deg, #073a9a, #0f7dff 54%, #13c8c9); }
    .article-card.cover-fus-process .thumb,
    .therapy-card.cover-fus-process .thumb { background-image: linear-gradient(150deg, rgba(3, 31, 91, .66), rgba(15, 93, 255, .16)), url("../../assets/banner-home-main.webp"); background-position: 60% center; }
    .article-card.cover-fus-guide .thumb,
    .therapy-card.cover-fus-guide .thumb { background: radial-gradient(circle at 82% 18%, rgba(34, 197, 94, .85), transparent 16%), linear-gradient(145deg, #053986, #0f5dff 62%, #5ed6ff); }
    .article-card.cover-pd-symptom .thumb,
    .therapy-card.cover-pd-symptom .thumb { background-image: linear-gradient(135deg, rgba(5, 43, 100, .42), rgba(15, 93, 255, .08)), url("../../assets/admin-avatar.png"); }
    .article-card.cover-pd-medication .thumb,
    .therapy-card.cover-pd-medication .thumb { background: radial-gradient(circle at 76% 24%, rgba(94, 214, 255, .68), transparent 22%), linear-gradient(135deg, #06418f, #0f5dff 56%, #22c55e); }
    .article-card.cover-pd-surgery .thumb,
    .therapy-card.cover-pd-surgery .thumb { background-image: linear-gradient(135deg, rgba(5, 43, 100, .62), rgba(15, 93, 255, .12)), url("../../assets/hero-focused-ultrasound.webp"); background-position: 64% center; }
    .article-card.cover-tremor-hands .thumb,
    .therapy-card.cover-tremor-hands .thumb { background-image: linear-gradient(135deg, rgba(5, 43, 100, .48), rgba(34, 197, 94, .12)), url("../../assets/banner-tremor.webp"); background-position: 58% center; }
    .article-card.cover-tremor-writing .thumb,
    .therapy-card.cover-tremor-writing .thumb { background: radial-gradient(circle at 78% 22%, rgba(34, 197, 94, .75), transparent 17%), linear-gradient(145deg, #06367c, #1169ff 54%, #5ed6ff); }
    .article-card.cover-ad-memory .thumb,
    .therapy-card.cover-ad-memory .thumb { background-image: linear-gradient(135deg, rgba(8, 68, 164, .1), rgba(34, 197, 94, .18)), url("../../assets/admin-avatar.png"); background-position: 58% center; }
    .article-card.cover-ad-family .thumb,
    .therapy-card.cover-ad-family .thumb { background-image: linear-gradient(135deg, rgba(7, 66, 152, .58), rgba(94, 214, 255, .18)), url("../../assets/cover-ad.webp"); }
    .article-card.cover-story-care .thumb,
    .therapy-card.cover-story-care .thumb { background: radial-gradient(circle at 78% 24%, rgba(255, 255, 255, .28), transparent 18%), linear-gradient(135deg, #0752b6, #18a4cf 58%, #22c55e); }

    [data-content-feed="therapy"].therapy-home-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }

    [data-content-feed="therapy"] .therapy-feature-card {
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: minmax(0, 46%) minmax(0, 54%);
      width: 100%;
      height: 136px;
      aspect-ratio: auto;
      border-radius: 14px;
      box-shadow: 0 16px 36px rgba(29, 67, 116, .12);
    }

    .therapy-feature-copy {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: center;
      min-width: 0;
      padding: 13px 12px;
      background: linear-gradient(135deg, #f7fbff, #eef6ff);
    }

    .therapy-category-chip {
      display: inline-flex;
      align-items: center;
      min-height: 22px;
      padding: 0 8px;
      border-radius: 999px;
      background: #e8f2ff;
      color: #1670e8;
      font-size: 10px;
      line-height: 1;
      font-weight: 850;
    }

    .therapy-feature-copy .card-title {
      min-height: 0;
      margin-top: 8px;
      color: #153052;
      font-size: 15px;
      line-height: 1.36;
      font-weight: 900;
      -webkit-line-clamp: 2;
    }

    .therapy-view-action {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 62px;
      height: 27px;
      margin-top: 9px;
      padding: 0 12px;
      border-radius: 999px;
      background: #1267ff;
      color: #fff;
      font-size: 11px;
      font-weight: 850;
      box-shadow: 0 8px 18px rgba(18, 103, 255, .18);
    }

    .therapy-feature-media {
      position: relative;
      min-width: 0;
      overflow: hidden;
      background: #dceafa;
    }

    .therapy-feature-media img,
    .therapy-square-card .thumb > img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
    }

    .therapy-feature-media .badge {
      position: absolute;
      right: 9px;
      bottom: 9px;
      z-index: 2;
      padding: 4px 7px;
      border-radius: 6px;
      background: rgba(5, 37, 84, .72);
      color: #fff;
      font-size: 10px;
      font-weight: 800;
      backdrop-filter: blur(10px);
    }

    .therapy-card {
      min-height: 0;
    }

    .therapy-card .thumb {
      min-height: 0;
      padding: 10px;
      background: linear-gradient(145deg, #0c45c6, #0fc8bc);
    }

    .therapy-card.cover-live .thumb {
      background-image: url("../../assets/admin-avatar.png");
    }

    .therapy-card.cover-fus .thumb {
      background-image: url("../../assets/admin-avatar.png");
    }

    .therapy-card.cover-pd .thumb {
      background-image: url("../../assets/admin-avatar.png");
      background-position: 64% center;
    }

    .therapy-card .thumb-title {
      font-size: 15px;
      line-height: 1.28;
    }

    .therapy-card .card-body {
      padding: 8px 8px 9px;
    }

    .therapy-card .card-title {
      min-height: 34px;
      font-size: 12px;
      line-height: 1.35;
    }

    .therapy-card p {
      display: -webkit-box;
      overflow: hidden;
      margin-top: 3px;
      color: var(--muted);
      font-size: 11px;
      line-height: 1.25;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

    .therapy-square-card .thumb {
      padding: 0;
    }

    .therapy-square-card .thumb > img {
      position: absolute;
      inset: 0;
    }

    html[data-theme="dark"] .therapy-feature-copy {
      background: linear-gradient(135deg, #13243a, #0e1b2d);
    }

    html[data-theme="dark"] .therapy-feature-copy .card-title {
      color: #f2f7ff;
    }

    html[data-theme="dark"] .therapy-category-chip {
      background: rgba(73, 130, 200, .2);
      color: #b9d7ff;
    }

    @media (max-width: 360px) {
      [data-content-feed="therapy"] .therapy-feature-card {
        grid-template-columns: minmax(0, 47%) minmax(0, 53%);
        height: 126px;
      }

      .therapy-feature-copy {
        padding: 11px 10px;
      }

      .therapy-feature-copy .card-title {
        margin-top: 6px;
        font-size: 14px;
      }

      .therapy-view-action {
        height: 25px;
        margin-top: 7px;
      }
    }

    .contact-panel {
      display: grid;
      grid-template-columns: minmax(0, 1fr) clamp(72px, 22vw, 92px);
      gap: 12px;
      align-items: center;
      margin-top: 28px;
      padding: 14px;
      border-radius: 8px;
      background: linear-gradient(135deg, #ffffff, #eff8ff);
      border: 1px solid #e0edf8;
      box-shadow: 0 8px 24px rgba(26, 81, 139, .07);
    }

    .contact-panel h2 {
      overflow-wrap: anywhere;
      color: var(--deep);
      font-size: 19px;
      line-height: 1.3;
    }

    .contact-panel p {
      margin-top: 8px;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.5;
    }

    .phone-link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      max-width: 100%;
      margin-top: 12px;
      overflow-wrap: anywhere;
      color: var(--blue);
      font-size: 16px;
      font-weight: 800;
    }

    .phone-link svg {
      width: 17px;
      height: 17px;
    }

    .qr {
      width: clamp(72px, 22vw, 92px);
      height: clamp(72px, 22vw, 92px);
      border: 6px solid #fff;
      border-radius: 8px;
      object-fit: cover;
      box-shadow: 0 6px 20px rgba(55, 80, 110, .13);
    }

    .footer-links {
      margin: 42px 0 16px;
      color: #8b97a7;
      font-size: 12px;
      text-align: center;
    }

    .footer-links a {
      color: inherit;
    }

    .footer-links a + a::before {
      content: "|";
      margin: 0 7px;
      color: #c4ccd6;
    }

    .disclaimer {
      margin-top: 8px;
      color: #a4adba;
      font-size: 11px;
      text-align: center;
      line-height: 1.5;
    }

    html[data-theme="dark"],
    html[data-theme="dark"] body {
      background: #07111f;
      color: #edf5ff;
    }

    html[data-theme="dark"] .app {
      background:
        radial-gradient(circle at 86% 0%, rgba(56, 139, 255, .18), transparent 190px),
        linear-gradient(180deg, #0b1524 0%, #07111f 52%, #08101c 100%);
    }

    html[data-theme="dark"] .notice,
    html[data-theme="dark"] .search,
    html[data-theme="dark"] .category-item,
    html[data-theme="dark"] .contact-band,
    html[data-theme="dark"] .section,
    html[data-theme="dark"] .content-card,
    html[data-theme="dark"] .contact-panel,
    html[data-theme="dark"] .empty-state-card,
    html[data-theme="dark"] .system-card {
      border-color: rgba(127, 158, 196, .20);
      background: rgba(15, 27, 45, .78);
      box-shadow: 0 18px 38px rgba(0, 0, 0, .22);
    }

    html[data-theme="dark"] .section-title,
    html[data-theme="dark"] .card-title,
    html[data-theme="dark"] .contact-copy strong,
    html[data-theme="dark"] .contact-panel h2,
    html[data-theme="dark"] .empty-state-card strong {
      color: #f2f7ff;
    }

    html[data-theme="dark"] .notice p,
    html[data-theme="dark"] .search input,
    html[data-theme="dark"] .card-meta,
    html[data-theme="dark"] .therapy-card p,
    html[data-theme="dark"] .contact-copy span,
    html[data-theme="dark"] .contact-panel p,
    html[data-theme="dark"] .empty-state-card span,
    html[data-theme="dark"] .footer-links,
    html[data-theme="dark"] .disclaimer {
      color: #a9b8ca;
    }

    html[data-theme="dark"] .bottom-nav {
      border-color: rgba(127, 158, 196, .20);
      background: rgba(8, 16, 28, .94);
    }

    html[data-theme="dark"] .bottom-nav .nav-item {
      color: #8ea0b8;
    }

    html[data-theme="dark"] .bottom-nav .nav-item.active {
      color: #62a2ff;
    }

    .float-contact {
      position: fixed;
      right: max(14px, calc((100vw - 480px) / 2 + 14px));
      bottom: 112px;
      z-index: 20;
      display: grid;
      place-items: center;
      width: 54px;
      height: 54px;
      border-radius: 50%;
      background: #fff;
      color: var(--deep);
      box-shadow: 0 10px 26px rgba(16, 50, 91, .18);
      cursor: grab;
      touch-action: none;
      transition: transform .24s ease, opacity .24s ease, box-shadow .24s ease;
      user-select: none;
    }

    .float-contact:active {
      cursor: grabbing;
    }

    .float-contact.is-peek {
      transform: scale(.96);
      opacity: .82;
      box-shadow: 0 8px 20px rgba(16, 50, 91, .13);
    }

    .float-contact svg {
      width: 28px;
      height: 28px;
    }

    .float-label {
      position: fixed;
      right: max(14px, calc((100vw - 480px) / 2 + 14px));
      bottom: 88px;
      z-index: 19;
      width: 54px;
      color: #7d8897;
      font-size: 12px;
      line-height: 1;
      text-align: center;
      transition: transform .24s ease, opacity .24s ease;
      pointer-events: none;
      user-select: none;
    }

    .float-label.is-peek {
      opacity: 0;
      transform: none;
    }

    body > .float-contact,
    body > .float-label {
      display: none;
    }

    .bottom-nav {
      position: fixed;
      left: 50%;
      bottom: 0;
      z-index: 30;
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      width: 100%;
      max-width: 480px;
      height: calc(66px + env(safe-area-inset-bottom));
      padding-bottom: env(safe-area-inset-bottom);
      transform: translateX(-50%);
      border-top: 1px solid var(--line);
      background: rgba(255, 255, 255, .96);
      backdrop-filter: blur(16px);
    }

    .nav-item {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      min-width: 0;
      overflow: hidden;
      gap: 3px;
      color: #313a47;
      font-size: 12px;
      text-align: center;
      white-space: nowrap;
    }

    .nav-item svg {
      width: 25px;
      height: 25px;
    }

    .nav-item.active {
      color: var(--blue);
      font-weight: 700;
    }

    .modal {
      position: fixed;
      inset: 0;
      z-index: 60;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 24px;
      background: rgba(9, 21, 42, .5);
    }

    .modal.open {
      display: flex;
    }

    .modal-card {
      width: min(100%, 320px);
      padding: 22px 20px 20px;
      border-radius: 8px;
      background: #fff;
      text-align: center;
      box-shadow: 0 20px 50px rgba(0, 0, 0, .18);
    }

    .modal-card h2 {
      color: var(--deep);
      font-size: 19px;
      line-height: 1.3;
    }

    .modal-card p {
      margin-top: 7px;
      color: var(--muted);
      font-size: 13px;
    }

    .modal-card img {
      width: 220px;
      height: 220px;
      margin: 18px auto 12px;
      border-radius: 8px;
      object-fit: cover;
    }

    .close-btn {
      width: 100%;
      height: 40px;
      margin-top: 10px;
      border-radius: 999px;
      background: #eff4fa;
      color: #4c5a6b;
      font-weight: 700;
    }

    @media (max-width: 360px) {
      .phone-shell {
        padding-right: 12px;
        padding-left: 12px;
      }

      .hero-strip {
        margin-right: -12px;
        margin-left: -12px;
        padding-right: 12px;
        padding-left: 12px;
      }

      .hero-content h2 {
        font-size: 23px;
      }

      .section-title {
        font-size: 19px;
      }

      .card-title {
        font-size: 15px;
      }

      .contact-band {
        gap: 9px;
      }

      .brand-mark {
        width: 46px;
        height: 46px;
        border-radius: 16px;
      }

      .pill-button {
        width: 38px;
        min-width: 38px;
        padding: 0;
        font-size: 0;
      }

      .pill-button svg {
        width: 17px;
        height: 17px;
      }
    }

    @media (prefers-reduced-motion: no-preference) {
      .notice,
      .hero-card,
      .search,
      .category-item,
      .contact-band,
      .section,
      .content-card,
      .contact-panel {
        animation: soft-enter .42s ease both;
      }

      .hero-card,
      .content-card,
      .category-item,
      .pill-button,
      .nav-item,
      .float-contact {
        transition: transform .22s ease, box-shadow .22s ease, opacity .22s ease;
      }

      .hero-card:active,
      .content-card:active,
      .category-item:active,
      .pill-button:active,
      .nav-item:active {
        transform: scale(.98);
      }

      .section:nth-of-type(2) { animation-delay: .04s; }
      .section:nth-of-type(3) { animation-delay: .08s; }
      .section:nth-of-type(4) { animation-delay: .12s; }

      @keyframes soft-enter {
        from {
          opacity: 0;
          transform: translateY(10px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }
    }