diff --git "a/hf-shell-css-4f6465bad160.css" "b/hf-shell-css-4f6465bad160.css"
new file mode 100644--- /dev/null
+++ "b/hf-shell-css-4f6465bad160.css"
@@ -0,0 +1,23735 @@
+
+      :root {
+        --bg: #050914;
+        --panel: rgba(10, 18, 31, 0.82);
+        --panel-strong: rgba(11, 18, 31, 0.94);
+        --stroke: rgba(255, 255, 255, 0.1);
+        --stroke-strong: rgba(255, 255, 255, 0.18);
+        --text: #f5f8ff;
+        --muted: #91a0ba;
+        --muted-strong: #c5d0e3;
+        --lime: #9cff63;
+        --sky: #88d7ff;
+        --ink: #07100d;
+        --shadow: 0 30px 90px rgba(0, 0, 0, 0.45);
+        --preview-surface:
+          radial-gradient(circle at 50% 0%, rgba(136, 215, 255, 0.12), transparent 52%),
+          radial-gradient(circle at 20% 12%, rgba(156, 255, 99, 0.1), transparent 32%),
+          linear-gradient(180deg, rgba(10, 18, 31, 0.9), rgba(7, 13, 23, 0.98));
+      }
+
+      * {
+        box-sizing: border-box;
+      }
+
+      #hs-eu-cookie-confirmation {
+        position: fixed !important;
+        right: clamp(12px, 2.4vw, 24px) !important;
+        bottom: clamp(12px, 2.4vw, 24px) !important;
+        left: auto !important;
+        z-index: 2147483000 !important;
+        max-width: min(390px, calc(100vw - 24px)) !important;
+        border: 1px solid rgba(255, 255, 255, 0.14) !important;
+        border-radius: 20px !important;
+        color: var(--text) !important;
+        background:
+          radial-gradient(circle at 8% 0%, rgba(156, 255, 99, 0.11), transparent 34%),
+          radial-gradient(circle at 92% 18%, rgba(136, 215, 255, 0.06), transparent 38%),
+          linear-gradient(145deg, rgba(6, 11, 21, 0.66), rgba(12, 20, 34, 0.58)) !important;
+        box-shadow:
+          0 24px 70px rgba(0, 0, 0, 0.38),
+          inset 0 1px 0 rgba(255, 255, 255, 0.22),
+          inset 0 -1px 0 rgba(255, 255, 255, 0.06) !important;
+        backdrop-filter: blur(24px) saturate(1.38) !important;
+        -webkit-backdrop-filter: blur(24px) saturate(1.38) !important;
+        font-family: "Inter", sans-serif !important;
+      }
+
+      #hs-eu-cookie-confirmation #hs-eu-cookie-confirmation-inner,
+      #hs-eu-cookie-confirmation .hs-eu-cookie-confirmation-inner,
+      #hs-eu-cookie-confirmation [class*="cookie-confirmation"],
+      #hs-eu-cookie-confirmation [class*="cookie-notification"],
+      #hs-eu-cookie-confirmation [class*="consent-banner"],
+      #hs-eu-cookie-confirmation div,
+      #hs-eu-cookie-confirmation section,
+      #hs-eu-cookie-confirmation article,
+      #hs-eu-cookie-confirmation form {
+        border: 0 !important;
+        background: transparent !important;
+        background-color: transparent !important;
+        box-shadow: none !important;
+      }
+
+      #hs-eu-cookie-confirmation #hs-eu-cookie-confirmation-inner,
+      #hs-eu-cookie-confirmation .hs-eu-cookie-confirmation-inner {
+        width: auto !important;
+        max-width: none !important;
+        margin: 0 !important;
+        padding: 16px 18px !important;
+      }
+
+      #hs-eu-cookie-confirmation *,
+      #hs-eu-cookie-confirmation #hs-eu-policy-wording,
+      #hs-eu-cookie-confirmation #hs-eu-policy-wording *,
+      #hs-eu-cookie-confirmation #hs-eu-cookie-disclaimer,
+      #hs-eu-cookie-confirmation #hs-eu-cookie-disclaimer * {
+        font-family: "Inter", sans-serif !important;
+        font-size: 13px !important;
+        letter-spacing: -0.01em !important;
+        line-height: 1.42 !important;
+        text-align: left !important;
+      }
+
+      #hs-eu-cookie-confirmation div,
+      #hs-eu-cookie-confirmation p,
+      #hs-eu-cookie-confirmation span,
+      #hs-eu-cookie-confirmation label,
+      #hs-eu-cookie-confirmation li,
+      #hs-eu-cookie-confirmation small,
+      #hs-eu-cookie-confirmation h1,
+      #hs-eu-cookie-confirmation h2,
+      #hs-eu-cookie-confirmation h3,
+      #hs-eu-cookie-confirmation h4,
+      #hs-eu-cookie-confirmation strong,
+      #hs-eu-cookie-confirmation #hs-eu-policy-wording,
+      #hs-eu-cookie-confirmation #hs-eu-cookie-disclaimer {
+        color: rgba(245, 248, 255, 0.9) !important;
+      }
+
+      #hs-eu-cookie-confirmation p,
+      #hs-eu-cookie-confirmation #hs-eu-policy-wording,
+      #hs-eu-cookie-confirmation #hs-eu-cookie-disclaimer {
+        margin: 0 0 10px !important;
+        padding: 0 !important;
+      }
+
+      #hs-eu-cookie-confirmation h1,
+      #hs-eu-cookie-confirmation h2,
+      #hs-eu-cookie-confirmation h3,
+      #hs-eu-cookie-confirmation h4,
+      #hs-eu-cookie-confirmation strong {
+        font-size: 13px !important;
+        line-height: 1.25 !important;
+        font-weight: 800 !important;
+        letter-spacing: 0.02em !important;
+      }
+
+      #hs-eu-cookie-confirmation a {
+        color: var(--sky) !important;
+        text-decoration-color: rgba(136, 215, 255, 0.45) !important;
+      }
+
+      #hs-eu-cookie-confirmation #hs-eu-cookie-confirmation-buttons-area,
+      #hs-eu-cookie-confirmation #hs-eu-confirmation-button-group {
+        display: flex !important;
+        flex-wrap: wrap !important;
+        gap: 10px !important;
+        align-items: center !important;
+        justify-content: flex-start !important;
+        margin-top: 12px !important;
+      }
+
+      #hs-eu-cookie-confirmation button,
+      #hs-eu-cookie-confirmation [role="button"],
+      #hs-eu-cookie-confirmation input[type="button"],
+      #hs-eu-cookie-confirmation input[type="submit"],
+      #hs-eu-cookie-confirmation #hs-eu-confirmation-button,
+      #hs-eu-cookie-confirmation #hs-eu-decline-button,
+      #hs-eu-cookie-confirmation #hs-eu-cookie-settings-button,
+      #hs-eu-cookie-confirmation #hs-eu-confirmation-button-group a {
+        display: inline-flex !important;
+        min-height: 36px !important;
+        align-items: center !important;
+        justify-content: center !important;
+        padding: 8px 13px !important;
+        border: 1px solid rgba(255, 255, 255, 0.16) !important;
+        border-radius: 999px !important;
+        background: rgba(255, 255, 255, 0.08) !important;
+        background-color: rgba(255, 255, 255, 0.08) !important;
+        color: var(--text) !important;
+        text-decoration: none !important;
+        font-family: "Inter", sans-serif !important;
+        font-size: 12px !important;
+        font-weight: 800 !important;
+        letter-spacing: 0.02em !important;
+        box-shadow: none !important;
+      }
+
+      #hs-eu-cookie-confirmation button:hover,
+      #hs-eu-cookie-confirmation [role="button"]:hover,
+      #hs-eu-cookie-confirmation input[type="button"]:hover,
+      #hs-eu-cookie-confirmation input[type="submit"]:hover,
+      #hs-eu-cookie-confirmation #hs-eu-confirmation-button:hover,
+      #hs-eu-cookie-confirmation #hs-eu-decline-button:hover,
+      #hs-eu-cookie-confirmation #hs-eu-cookie-settings-button:hover,
+      #hs-eu-cookie-confirmation #hs-eu-confirmation-button-group a:hover {
+        transform: translateY(-1px);
+        border-color: rgba(156, 255, 99, 0.38) !important;
+      }
+
+      #hs-eu-cookie-confirmation #hs-eu-confirmation-button,
+      #hs-eu-cookie-confirmation button[id*="confirmation"],
+      #hs-eu-cookie-confirmation input[id*="confirmation"] {
+        background: linear-gradient(180deg, #caff8a, var(--lime)) !important;
+        background-color: var(--lime) !important;
+        color: #06110d !important;
+        border-color: transparent !important;
+      }
+
+      #hs-eu-cookie-confirmation #hs-eu-decline-button,
+      #hs-eu-cookie-confirmation #hs-eu-cookie-settings-button {
+        color: rgba(245, 248, 255, 0.92) !important;
+      }
+
+      html.hfviewer-demo-mode #hs-eu-cookie-confirmation,
+      html.hfviewer-demo-mode-2 #hs-eu-cookie-confirmation {
+        display: none !important;
+        visibility: hidden !important;
+        opacity: 0 !important;
+        pointer-events: none !important;
+      }
+
+      @media (max-width: 640px) {
+        #hs-eu-cookie-confirmation {
+          right: auto !important;
+          bottom: 12px !important;
+          left: 50% !important;
+          width: calc(100vw - 24px) !important;
+          min-width: 0 !important;
+          max-width: calc(100vw - 24px) !important;
+          border-radius: 18px !important;
+          transform: translateX(-50%) !important;
+        }
+
+        #hs-eu-cookie-confirmation #hs-eu-cookie-confirmation-inner,
+        #hs-eu-cookie-confirmation .hs-eu-cookie-confirmation-inner {
+          width: 100% !important;
+          min-width: 0 !important;
+          max-width: 100% !important;
+          padding: 15px 16px !important;
+        }
+      }
+
+      html,
+      body {
+        margin: 0;
+        min-height: 100%;
+        background: #050914;
+      }
+
+      body {
+        position: relative;
+        min-height: 100vh;
+        min-height: 100dvh;
+        color: var(--text);
+        font-family: "Inter", sans-serif;
+      }
+
+      body::before {
+        content: "";
+        position: fixed;
+        inset: 0;
+        z-index: 0;
+        pointer-events: none;
+        background:
+          radial-gradient(circle at 14% 18%, rgba(128, 93, 255, 0.18), transparent 24%),
+          radial-gradient(circle at 78% 16%, rgba(156, 255, 99, 0.12), transparent 24%),
+          radial-gradient(circle at 72% 78%, rgba(136, 215, 255, 0.14), transparent 25%),
+          linear-gradient(180deg, #050914 0%, #07111d 52%, #050914 100%);
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
+      }
+
+      body::after {
+        content: "";
+        position: fixed;
+        inset: 0;
+        z-index: 0;
+        pointer-events: none;
+        background-image:
+          linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px),
+          linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px);
+        background-size: 76px 76px;
+        mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.7), transparent 92%);
+      }
+
+      a {
+        color: inherit;
+        text-decoration: none;
+      }
+
+      .page {
+        position: relative;
+        z-index: 1;
+        overflow: hidden;
+      }
+
+      .landing-nav-wrap {
+        width: min(1480px, calc(100% - 52px));
+        margin: 0 auto;
+      }
+
+      .landing-nav-wrap[hidden] {
+        display: none;
+      }
+
+      .glow {
+        position: absolute;
+        border-radius: 999px;
+        filter: blur(24px);
+        opacity: 0.72;
+        pointer-events: none;
+      }
+
+      .glow--left {
+        top: 160px;
+        left: -54px;
+        width: 240px;
+        height: 240px;
+        background: rgba(156, 255, 99, 0.08);
+      }
+
+      .glow--right {
+        top: 260px;
+        right: 5%;
+        width: 280px;
+        height: 280px;
+        background: rgba(136, 215, 255, 0.1);
+      }
+
+      .shell {
+        width: min(1480px, calc(100% - 52px));
+        margin: 0 auto;
+        padding: 22px 0 72px;
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) auto;
+        grid-template-areas: "hero nav";
+        align-items: start;
+        column-gap: 36px;
+      }
+
+      [data-page][hidden] {
+        display: none !important;
+      }
+
+      html.hfviewer-direct-viewer-route body.route-landing,
+      html.hfviewer-direct-viewer-route .page.route-landing {
+        background: var(--bg);
+      }
+
+      html.hfviewer-direct-viewer-route body.route-landing [data-page="landing"],
+      html.hfviewer-direct-viewer-route body.route-landing .landing-footer[data-page="landing"] {
+        display: none !important;
+      }
+
+      /* hfnx boot anti-flash (see head script): until the end-of-document
+         script adds body.hfnx-active, hide EVERY landing section - the hero
+         chrome, gallery rails, community showcase, footer - so nothing paints
+         mid-parse (the showcase's white cards used to flash at the top of
+         the viewport before the hfnx hero existed) */
+      html.hfnx-boot body:not(.hfnx-active) [data-page="landing"],
+      html.hfnx-boot body:not(.hfnx-active) .landing-nav-wrap {
+        display: none !important;
+      }
+      /* ...and the landing page container itself: even empty it holds ~94px
+         of padding during boot, and its jump to full height at activation
+         was the last CLS source on the landing (not on direct viewer routes,
+         where the page div hosts the early viewer placeholder) */
+      html.hfnx-boot:not(.hfviewer-direct-viewer-route) body:not(.hfnx-active) .page.route-landing {
+        display: none !important;
+      }
+
+      /* CLS guard: these sections sit below the hfnx grid, but the grid gets
+         its height asynchronously (models.json) - if they render before it,
+         they first paint high in the viewport and then jump ~2000px down.
+         Keep them out of layout until the grid has rendered cards. */
+      body.hfnx-active:not(.hfnx-grid-ready) [data-page="landing"]:not(main.hero) {
+        display: none !important;
+      }
+      /* the ambient glows must not move when the landing container swaps
+         from the boot shell to the full hfnx layout (their top values equal
+         their settled viewport position, so fixed is visually identical) */
+      html.hfnx-boot .glow,
+      body.hfnx-active [data-page="landing"] .glow {
+        position: fixed;
+      }
+
+      /* early LCP hero shell: same title and typography as the hfnx hero so
+         the largest contentful paint happens at first paint instead of after
+         the whole document parses; replaced in place at activation */
+      .hfnx-boot-hero {
+        display: none;
+      }
+      /* never on direct model/family routes - the landing (and its hero)
+         stays hidden there */
+      html.hfviewer-direct-viewer-route .hfnx-boot-hero {
+        display: none !important;
+      }
+      html.hfnx-boot body:not(.hfnx-active) .hfnx-boot-hero {
+        display: block;
+        /* matches the settled hfnx hero h1 position (y=112) so the swap to
+           the real hero does not shift the title */
+        padding: 112px 24px 0;
+        text-align: center;
+      }
+      html.hfnx-boot body:not(.hfnx-active) .hfnx-boot-hero h1 {
+        margin: 0 auto;
+        white-space: nowrap;
+        max-width: none;
+        width: 100%;
+        color: var(--text, #f5f8ff);
+        font-size: clamp(1.3rem, 4.2vw, 3.3rem);
+        font-weight: 800;
+        line-height: 1.04;
+        letter-spacing: -0.04em;
+      }
+      html.hfnx-boot body:not(.hfnx-active) .hfnx-boot-hero h1 em {
+        font-style: normal;
+        color: var(--lime, #9cff63);
+      }
+
+      .landing-footer {
+        grid-column: 1 / -1;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        padding: 12px 0 0;
+        color: var(--muted);
+        font-size: 0.9rem;
+        line-height: 1.5;
+        text-align: center;
+      }
+
+      .landing-footer[hidden] {
+        display: none;
+      }
+
+      .landing-footer a {
+        color: var(--muted-strong);
+        text-decoration: underline;
+        text-decoration-color: rgba(197, 208, 227, 0.36);
+        text-underline-offset: 0.2em;
+      }
+
+      .landing-footer a:hover,
+      .landing-footer a:focus-visible {
+        color: var(--text);
+        text-decoration-color: rgba(245, 248, 255, 0.6);
+      }
+
+      .nav {
+        grid-area: nav;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+        gap: 18px;
+        margin-right: -14px;
+        padding-top: 6px;
+        padding-bottom: 0;
+      }
+
+      .nav[hidden] {
+        display: none;
+      }
+
+      .brand {
+        display: inline-flex;
+        align-items: center;
+        gap: 14px;
+        width: max-content;
+        max-width: none;
+      }
+
+      .brand-stack {
+        position: relative;
+        display: inline-flex;
+        flex-direction: column;
+        align-items: flex-end;
+        gap: 10px;
+      }
+
+      .brand-stack::after {
+        content: "";
+        position: absolute;
+        top: 100%;
+        left: -22px;
+        right: -22px;
+        height: 38px;
+        pointer-events: auto;
+      }
+      /* the bridge is a mouse-travel affordance for the dropdown; on touch
+         devices it just swallows taps on whatever wraps beneath the brand
+         (Catalog/Embed/Extension on phones) */
+      @media (hover: none) {
+        .brand-stack::after { display: none; }
+      }
+
+      .brand-stack__trigger {
+        position: relative;
+        z-index: 2;
+        width: 100%;
+        min-height: 52px;
+        align-items: center;
+        justify-content: flex-start;
+        transition: opacity 180ms ease;
+      }
+
+      .brand-stack__menu {
+        position: absolute;
+        top: calc(100% + 12px);
+        right: 0;
+        display: grid;
+        gap: 12px;
+        width: max-content;
+        justify-items: stretch;
+        overflow: visible;
+        opacity: 0;
+        transform: translateY(-6px);
+        pointer-events: none;
+        transition: opacity 220ms ease, transform 220ms ease;
+      }
+
+      .brand-stack__menu::before {
+        content: "";
+        position: absolute;
+        left: -22px;
+        right: -22px;
+        top: -28px;
+        height: 34px;
+      }
+
+      @media (hover: hover) {
+        .brand-stack:hover .brand-stack__menu,
+        .brand-stack:focus-within .brand-stack__menu {
+          opacity: 1;
+          transform: translate(0, 0);
+          pointer-events: auto;
+        }
+      }
+      /* touch (landing only): the trigger tap-toggles the menu via is-open */
+      .brand-stack.is-open .brand-stack__menu {
+        opacity: 1;
+        transform: translate(0, 0);
+        pointer-events: auto;
+      }
+
+      .brand-stack:hover .brand-stack__trigger:not(:hover),
+      .brand-stack:focus-within .brand-stack__trigger:not(:focus-visible),
+      .brand-stack:has(.brand-stack__item:hover) .brand-stack__trigger,
+      .brand-stack:has(.brand-stack__item:focus-visible) .brand-stack__trigger,
+      .brand-stack:has(.brand-stack__item.is-nearest) .brand-stack__trigger {
+        opacity: 0.62;
+      }
+
+      .brand-stack__item {
+        width: 100%;
+        min-height: 52px;
+        align-items: center;
+        opacity: 0.72;
+        transition: opacity 180ms ease, transform 180ms ease;
+      }
+
+      .brand-stack__item .brand__sub {
+        line-height: 1.08;
+      }
+
+      .brand-stack__item:hover,
+      .brand-stack__item:focus-visible,
+      .brand-stack__item.is-nearest {
+        opacity: 1;
+        transform: translateY(-1px);
+        outline: none;
+      }
+
+      .brand__mark {
+        width: 44px;
+        height: 44px;
+        min-width: 44px;
+        flex: 0 0 44px;
+        aspect-ratio: 1 / 1;
+        border-radius: 14px;
+        background:
+          radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.38), transparent 18%),
+          linear-gradient(135deg, rgba(156, 255, 99, 0.95), rgba(136, 215, 255, 0.9));
+        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.26);
+      }
+
+      .brand__text {
+        display: grid;
+        gap: 3px;
+        min-width: max-content;
+        flex: 0 0 auto;
+        overflow: visible;
+      }
+
+      .brand__name {
+        font-family: "Inter", sans-serif;
+        font-size: 1.04rem;
+        font-weight: 700;
+        letter-spacing: 0.03em;
+        text-transform: lowercase;
+      }
+
+      .brand__sub {
+        color: var(--muted);
+        font-size: 0.76rem;
+        letter-spacing: 0.16em;
+        text-transform: uppercase;
+      }
+
+      .brand__mark--deploy {
+        background:
+          radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.34), transparent 18%),
+          linear-gradient(135deg, rgba(83, 135, 255, 0.94), rgba(120, 227, 142, 0.9));
+      }
+
+      .brand__mark--hub {
+        background:
+          radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.34), transparent 18%),
+          linear-gradient(135deg, rgba(255, 173, 74, 0.96), rgba(83, 226, 196, 0.88));
+      }
+
+      .brand__mark--models {
+        background:
+          radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.34), transparent 18%),
+          linear-gradient(135deg, rgba(255, 111, 145, 0.94), rgba(255, 209, 92, 0.9));
+      }
+
+      .pill {
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        padding: 11px 16px;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.04);
+        border: 1px solid var(--stroke);
+        color: var(--muted-strong);
+        font-size: 0.88rem;
+        line-height: 1.1;
+      }
+
+      button.pill {
+        font-family: inherit;
+        font-size: 0.88rem;
+        line-height: 1.1;
+        cursor: pointer;
+      }
+
+      .pill:disabled {
+        cursor: default;
+        opacity: 0.74;
+      }
+
+      .pill--outline {
+        color: var(--text);
+        border-color: var(--stroke-strong);
+      }
+
+      .pill::before {
+        content: "";
+        width: 8px;
+        height: 8px;
+        border-radius: 999px;
+        background: var(--lime);
+      }
+
+      .pill--icon::before {
+        content: none;
+      }
+
+      .pill__icon {
+        display: inline-flex;
+        width: 17px;
+        height: 17px;
+        flex: 0 0 auto;
+      }
+
+      .pill__icon svg {
+        width: 100%;
+        height: 100%;
+      }
+
+      .pill__label--mobile,
+      .pill__label--mobile-arrow,
+      .pill__label--short {
+        display: none;
+      }
+
+      .pill__customize-link {
+        text-decoration: underline;
+        text-underline-offset: 3px;
+      }
+
+      .pill__icon--desktop {
+        display: inline-flex;
+      }
+
+      .pill--home {
+        gap: 10px;
+      }
+
+      .pill--home::before,
+      .pill--back-home::before,
+      .pill--hf-link::before {
+        content: none;
+      }
+
+      .pill--back-home {
+        gap: 9px;
+      }
+
+      .pill--back-home .pill__icon {
+        color: currentColor;
+      }
+
+      .pill--hf-link .pill__icon {
+        display: inline-flex;
+        color: #ffffff;
+      }
+
+      .viewer-bookmark-button {
+        --bookmark-accent: #88d7ff;
+      }
+
+      .viewer-bookmark-button[hidden],
+      .viewer-community-articles__bookmark[hidden] {
+        display: none !important;
+      }
+
+      .viewer-bookmark-button::before {
+        content: none;
+      }
+
+      .viewer-bookmark-button__icon {
+        display: inline-flex;
+        width: 16px;
+        height: 16px;
+        flex: 0 0 auto;
+        color: currentColor;
+      }
+
+      .viewer-bookmark-button__icon svg {
+        width: 100%;
+        height: 100%;
+        display: block;
+        fill: currentColor;
+      }
+
+      .viewer-bookmark-button.is-bookmarked {
+        border-color: rgba(156, 255, 99, 0.32);
+        background:
+          radial-gradient(circle at 50% 0%, rgba(156, 255, 99, 0.2), transparent 64%),
+          linear-gradient(180deg, rgba(156, 255, 99, 0.15), rgba(136, 215, 255, 0.055)),
+          rgba(7, 16, 29, 0.76);
+        color: #e7ffd8;
+      }
+
+      .viewer-route__actions .pill {
+        white-space: nowrap;
+      }
+
+      .viewer-route__actions--home-icon .pill--home {
+        width: 44px;
+        height: 44px;
+        padding: 0;
+        justify-content: center;
+        gap: 0;
+      }
+
+      .viewer-route__actions--home-icon .pill--home .pill__label--desktop {
+        display: none;
+      }
+
+      .viewer-route__actions--hf-icon .pill--hf-link {
+        width: 44px;
+        height: 44px;
+        padding: 0;
+        justify-content: center;
+        gap: 0;
+      }
+
+      .viewer-route__actions--hf-icon .pill--hf-link .pill__label--desktop {
+        display: none;
+      }
+
+      .viewer-route__actions--embed-short #viewer-model-card-btn .pill__label--full,
+      .viewer-route__actions--write-short #viewer-write-article-btn .pill__label--full {
+        display: none;
+      }
+
+      .viewer-route__actions--embed-short #viewer-model-card-btn .pill__label--short,
+      .viewer-route__actions--write-short #viewer-write-article-btn .pill__label--short {
+        display: inline;
+      }
+
+      .viewer-route__actions--embed-short #viewer-model-card-btn {
+        min-width: 0 !important;
+      }
+
+      .viewer-route__actions--embed-icon #viewer-model-card-btn {
+        width: 44px;
+        min-width: 44px !important;
+        height: 44px;
+        padding: 0;
+        justify-content: center;
+        gap: 0;
+      }
+
+      .viewer-route__actions--embed-icon #viewer-model-card-btn .pill__label--full,
+      .viewer-route__actions--embed-icon #viewer-model-card-btn .pill__label--short {
+        display: none;
+      }
+
+      /* --- Release-watch affordances (pill, popover, notify upsell) ----- */
+      .viewer-watch-button[hidden],
+      .owner-gallery-watch[hidden] {
+        display: none !important;
+      }
+
+      .viewer-watch-button__icon {
+        display: inline-flex;
+        width: 15px;
+        height: 15px;
+        flex: 0 0 auto;
+        color: currentColor;
+      }
+
+      .viewer-watch-button__icon svg {
+        width: 100%;
+        height: 100%;
+        display: block;
+        fill: currentColor;
+      }
+
+      .viewer-watch-button .pill__label--full {
+        display: inline-block;
+        max-width: 180px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        vertical-align: bottom;
+      }
+
+      .viewer-watch-button .pill__label--short {
+        display: none;
+      }
+
+      .viewer-watch-button.is-watching,
+      .owner-gallery-watch.is-watching {
+        border-color: rgba(156, 255, 99, 0.32);
+        background:
+          radial-gradient(circle at 50% 0%, rgba(156, 255, 99, 0.2), transparent 64%),
+          linear-gradient(180deg, rgba(156, 255, 99, 0.15), rgba(136, 215, 255, 0.055)),
+          rgba(7, 16, 29, 0.76);
+        color: #e7ffd8;
+      }
+
+      /* Subtle glass hover for the release-watch pill, matching the other
+         top-bar action pills. Kept off the .is-watching active state so the
+         green "watching" affordance still reads. */
+      .viewer-watch-button:not(.is-watching):hover,
+      .viewer-watch-button:not(.is-watching):focus-visible {
+        border-color: rgba(255, 255, 255, 0.26);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05)),
+          rgba(11, 22, 38, 0.85);
+        color: #f4f8ff;
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.14),
+          0 0 0 1px rgba(255, 255, 255, 0.06);
+      }
+
+      .viewer-route__actions--watch-short .viewer-watch-button .pill__label--full {
+        display: none;
+      }
+
+      .viewer-route__actions--watch-short .viewer-watch-button .pill__label--short {
+        display: inline;
+      }
+
+      .viewer-route__actions--watch-icon .viewer-watch-button {
+        width: 44px;
+        min-width: 44px !important;
+        height: 44px;
+        padding: 0;
+        justify-content: center;
+        gap: 0;
+      }
+
+      .viewer-route__actions--watch-icon .viewer-watch-button .pill__label--full,
+      .viewer-route__actions--watch-icon .viewer-watch-button .pill__label--short {
+        display: none;
+      }
+
+      .viewer-route__actions--bookmark-icon .viewer-bookmark-button {
+        width: 44px;
+        min-width: 44px !important;
+        height: 44px;
+        padding: 0;
+        justify-content: center;
+        gap: 0;
+      }
+
+      .viewer-route__actions--bookmark-icon .viewer-bookmark-button .pill__label {
+        display: none;
+      }
+
+      .viewer-route__actions--discuss-icon #viewer-discuss-btn {
+        width: 44px;
+        min-width: 44px !important;
+        height: 44px;
+        padding: 0;
+        justify-content: center;
+        gap: 0;
+      }
+
+      .viewer-route__actions--discuss-icon #viewer-discuss-btn .pill__label {
+        display: none;
+      }
+
+      /* Hover / focus affordance for the top-bar action pills (dark theme):
+         brighten the border + surface a touch so the row reads as interactive.
+         Applies to every pill in the row, Discuss included. */
+      .viewer-route__actions .pill {
+        transition:
+          border-color 140ms ease,
+          background-color 140ms ease,
+          box-shadow 140ms ease,
+          color 140ms ease;
+      }
+
+      .viewer-route__actions .pill:hover,
+      .viewer-route__actions .pill:focus-visible {
+        border-color: rgba(255, 255, 255, 0.26);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05)),
+          rgba(11, 22, 38, 0.85);
+        color: #f4f8ff;
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.14),
+          0 0 0 1px rgba(255, 255, 255, 0.06);
+      }
+
+      .viewer-route__actions .pill:focus-visible {
+        outline: none;
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.14),
+          0 0 0 2px rgba(9, 15, 25, 0.9),
+          0 0 0 4px rgba(255, 255, 255, 0.55);
+      }
+
+      /* Mobile: HF / embed / watch / bookmark are all icon-only so the whole
+         action row fits on one line on 360px-class devices. */
+      @media (max-width: 860px) {
+        .viewer-route__actions .viewer-bookmark-button,
+        .viewer-route__actions .viewer-watch-button,
+        .viewer-route__actions #viewer-discuss-btn,
+        .viewer-route__actions #viewer-model-card-btn {
+          width: 44px;
+          min-width: 44px !important;
+          height: 44px;
+          padding: 0;
+          justify-content: center;
+          gap: 0;
+        }
+
+        .viewer-route__actions .viewer-bookmark-button .pill__label,
+        .viewer-route__actions .viewer-watch-button .pill__label--full,
+        .viewer-route__actions .viewer-watch-button .pill__label--short,
+        .viewer-route__actions #viewer-discuss-btn .pill__label,
+        .viewer-route__actions #viewer-model-card-btn .pill__label--full,
+        .viewer-route__actions #viewer-model-card-btn .pill__label--short {
+          display: none;
+        }
+      }
+
+      .owner-gallery-watch {
+        margin: 10px 0 4px;
+        /* the head is a grid: the inline axis needs justify-self, or the
+           pill stretches to the full column width */
+        justify-self: start;
+        width: fit-content;
+      }
+
+      .hf-watch-popover {
+        position: absolute;
+        z-index: 1200;
+        width: min(360px, calc(100vw - 24px));
+        padding: 16px 18px;
+        border: 1px solid rgba(156, 255, 99, 0.28);
+        border-radius: 16px;
+        background:
+          linear-gradient(120deg, rgba(156, 255, 99, 0.07), rgba(136, 215, 255, 0.05)),
+          rgba(7, 14, 26, 0.97);
+        box-shadow:
+          0 24px 70px rgba(0, 0, 0, 0.55),
+          0 0 0 1px rgba(255, 255, 255, 0.04);
+        text-align: left;
+      }
+
+      .hf-watch-popover::after {
+        content: "";
+        position: absolute;
+        top: -6.5px;
+        left: var(--watch-popover-tip-x, 50%);
+        width: 11px;
+        height: 11px;
+        transform: translateX(-50%) rotate(45deg);
+        background: rgb(13, 22, 32);
+        border-left: 1px solid rgba(156, 255, 99, 0.28);
+        border-top: 1px solid rgba(156, 255, 99, 0.28);
+        border-right: 0;
+        border-bottom: 0;
+        /* only the protruding half: the inner half painted over the box's
+           translucent background showed as a dark diamond */
+        clip-path: polygon(-2px -2px, calc(100% + 2px) -2px, calc(100% + 2px) 28%, 28% calc(100% + 2px), -2px calc(100% + 2px));
+        pointer-events: none;
+      }
+
+      .hf-watch-popover__close {
+        position: absolute;
+        top: 10px;
+        right: 12px;
+        width: 26px;
+        height: 26px;
+        border: none;
+        border-radius: 8px;
+        background: none;
+        cursor: pointer;
+        color: var(--muted, #91a0ba);
+        font-size: 17px;
+        line-height: 26px;
+        padding: 0;
+      }
+
+      .hf-watch-popover__close:hover {
+        color: var(--text, #f5f8ff);
+        background: rgba(255, 255, 255, 0.06);
+      }
+
+      .hf-watch-popover__title {
+        margin: 0 0 4px;
+        padding-right: 26px;
+        font-size: 15px;
+        font-weight: 700;
+        color: var(--text, #f5f8ff);
+      }
+
+      .hf-watch-popover__sub {
+        margin: 0 0 12px;
+        font-size: 13px;
+        color: var(--muted, #91a0ba);
+        line-height: 1.5;
+      }
+
+      .hf-watch-popover__row {
+        display: flex;
+        gap: 8px;
+        flex-wrap: wrap;
+      }
+
+      .hf-watch-popover__email {
+        flex: 1 1 160px;
+        padding: 10px 14px;
+        border-radius: 11px;
+        background: rgba(255, 255, 255, 0.05);
+        border: 1px solid var(--stroke, rgba(255, 255, 255, 0.1));
+        color: var(--text, #f5f8ff);
+        font: 14px "Inter", sans-serif;
+        outline: none;
+        min-width: 0;
+      }
+
+      .hf-watch-popover__email:focus {
+        border-color: rgba(156, 255, 99, 0.45);
+      }
+
+      .hf-watch-popover__btn {
+        padding: 10px 18px;
+        border: 0;
+        border-radius: 11px;
+        cursor: pointer;
+        background: var(--lime, #9cff63);
+        color: #07100d;
+        font: 700 14px "Inter", sans-serif;
+        white-space: nowrap;
+      }
+
+      .hf-watch-popover__btn:disabled {
+        opacity: 0.55;
+        cursor: default;
+      }
+
+      .hf-watch-popover__btn--ghost {
+        background: rgba(255, 255, 255, 0.07);
+        color: var(--text, #f5f8ff);
+      }
+
+      .hf-watch-popover__optin {
+        display: flex;
+        gap: 6px;
+        align-items: flex-start;
+        margin-top: 11px;
+        color: var(--muted, #91a0ba);
+        font-size: 12px;
+        line-height: 1.5;
+        cursor: pointer;
+      }
+
+      .hf-watch-popover__optin input {
+        margin-top: 2px;
+        accent-color: var(--lime, #9cff63);
+      }
+
+      .hf-watch-popover__optin a {
+        color: var(--muted-strong, #c5d0e3);
+        text-decoration: underline;
+      }
+
+      .hf-watch-popover__feedback {
+        margin: 10px 0 0;
+        font-size: 13px;
+        color: var(--lime, #9cff63);
+      }
+
+      .hf-watch-popover__feedback.is-error {
+        color: #ff9d9d;
+      }
+
+      .hf-watch-popover__meta {
+        margin: 8px 0 0;
+        font-size: 12px;
+        color: var(--muted, #91a0ba);
+        line-height: 1.5;
+      }
+
+      .hf-watch-popover__meta a {
+        color: var(--muted-strong, #c5d0e3);
+        text-decoration: underline;
+      }
+
+      .hf-watch-popover__meta button {
+        border: 0;
+        padding: 0;
+        background: none;
+        cursor: pointer;
+        color: var(--muted-strong, #c5d0e3);
+        font: inherit;
+        text-decoration: underline;
+      }
+
+      .hf-watch-popover__recent {
+        margin: 0 0 12px;
+        padding: 9px 11px 10px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        border-radius: 12px;
+        background: rgba(255, 255, 255, 0.03);
+      }
+
+      .hf-watch-popover__recent-label {
+        margin: 0 0 5px;
+        font-size: 11px;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+        color: var(--muted, #91a0ba);
+      }
+
+      .hf-watch-popover__recent-item {
+        display: flex;
+        align-items: baseline;
+        justify-content: space-between;
+        gap: 12px;
+        padding: 3px 0;
+        color: var(--text, #f5f8ff);
+        font-size: 13px;
+        text-decoration: none;
+      }
+
+      .hf-watch-popover__recent-item:hover .hf-watch-popover__recent-name {
+        text-decoration: underline;
+      }
+
+      .hf-watch-popover__recent-name {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        min-width: 0;
+      }
+
+      .hf-watch-popover__recent-when {
+        flex: none;
+        font-size: 12px;
+        color: var(--muted, #91a0ba);
+      }
+
+      .hf-watch-popover__recent-all {
+        display: inline-block;
+        margin-top: 5px;
+        font-size: 12px;
+        color: var(--muted-strong, #c5d0e3);
+        text-decoration: underline;
+      }
+
+      .hf-login-popover__btn {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: 9px;
+        width: 100%;
+        padding: 11px 16px;
+        border: 0;
+        border-radius: 11px;
+        cursor: pointer;
+        background: #ffffff;
+        color: #111827;
+        font: 700 14px "Inter", sans-serif;
+        transition: transform 0.14s ease, filter 0.14s ease;
+      }
+
+      .hf-login-popover__btn:hover:not(:disabled),
+      .hf-login-popover__btn:focus-visible:not(:disabled) {
+        transform: translateY(-1px);
+        filter: brightness(0.97);
+        outline: none;
+      }
+
+      .hf-login-popover__btn:disabled {
+        opacity: 0.6;
+        cursor: default;
+      }
+
+      .hf-login-popover__btn img {
+        width: 22px;
+        height: 20px;
+        display: block;
+      }
+
+      .hf-watch-upsell {
+        margin-top: 10px;
+        display: flex;
+        gap: 10px;
+        align-items: center;
+        flex-wrap: wrap;
+      }
+
+      .hf-watch-upsell__text {
+        margin: 0;
+        font-size: 13px;
+        color: var(--muted-strong, #c5d0e3);
+      }
+
+      .hf-watch-upsell__btn {
+        display: inline-flex;
+        align-items: center;
+        gap: 7px;
+        padding: 9px 16px;
+        border-radius: 999px;
+        border: 1px solid rgba(156, 255, 99, 0.4);
+        background: rgba(156, 255, 99, 0.1);
+        color: var(--lime, #9cff63);
+        font: 700 13px "Inter", sans-serif;
+        cursor: pointer;
+        transition: background 0.14s ease, border-color 0.14s ease;
+      }
+
+      .hf-watch-upsell__btn:hover:not(:disabled) {
+        background: rgba(156, 255, 99, 0.18);
+        border-color: rgba(156, 255, 99, 0.6);
+      }
+
+      .hf-watch-upsell__btn:disabled {
+        opacity: 0.55;
+        cursor: default;
+      }
+
+      .hf-watch-upsell__icon {
+        display: inline-flex;
+        width: 14px;
+        height: 14px;
+      }
+
+      .hf-watch-upsell__icon svg {
+        width: 100%;
+        height: 100%;
+        fill: currentColor;
+      }
+
+      .hf-watch-upsell__done {
+        color: var(--lime, #9cff63);
+        font-size: 13px;
+        font-weight: 600;
+      }
+
+      .hero {
+        grid-area: hero;
+        padding-top: 0;
+      }
+
+      .hero__content {
+        position: relative;
+        z-index: 2;
+        max-width: min(1180px, 100%);
+      }
+
+      .hero__media {
+        position: relative;
+        z-index: 1;
+        display: none;
+      }
+
+      .hero-video-card {
+        position: relative;
+        isolation: isolate;
+        height: 100%;
+        border-radius: 34px;
+        padding: 1px;
+        background:
+          linear-gradient(135deg, rgba(156, 255, 99, 0.42), rgba(136, 215, 255, 0.28) 42%, rgba(255, 255, 255, 0.08)),
+          rgba(255, 255, 255, 0.06);
+        box-shadow:
+          0 42px 110px rgba(0, 0, 0, 0.46),
+          0 0 0 1px rgba(255, 255, 255, 0.07),
+          0 0 80px rgba(136, 215, 255, 0.1);
+      }
+
+      .hero-video-card::before,
+      .hero-video-card::after {
+        content: "";
+        position: absolute;
+        pointer-events: none;
+        border-radius: inherit;
+      }
+
+      .hero-video-card::before {
+        inset: -18px;
+        z-index: -1;
+        background:
+          radial-gradient(circle at 78% 18%, rgba(136, 215, 255, 0.22), transparent 38%),
+          radial-gradient(circle at 16% 82%, rgba(156, 255, 99, 0.16), transparent 35%);
+        filter: blur(20px);
+        opacity: 0.74;
+      }
+
+      .hero-video-card::after {
+        inset: 1px;
+        z-index: 2;
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
+      }
+
+      .hero-video-card__inner {
+        position: relative;
+        overflow: hidden;
+        height: 100%;
+        border-radius: 33px;
+        background:
+          radial-gradient(circle at 50% 0%, rgba(136, 215, 255, 0.14), transparent 50%),
+          linear-gradient(180deg, rgba(9, 17, 30, 0.96), rgba(4, 8, 15, 0.98));
+      }
+
+      .hero-video-card__video {
+        display: block;
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+      }
+
+      .eyebrow {
+        display: inline-flex;
+        align-items: center;
+        gap: 12px;
+        padding: 9px 14px;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.04);
+        border: 1px solid var(--stroke);
+        color: var(--muted-strong);
+        font-size: 0.79rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .eyebrow::before {
+        content: "";
+        flex: 0 0 10px;
+        width: 10px;
+        min-width: 10px;
+        height: 10px;
+        min-height: 10px;
+        aspect-ratio: 1 / 1;
+        border-radius: 999px;
+        background: var(--lime);
+        box-shadow: 0 0 0 8px rgba(156, 255, 99, 0.09);
+      }
+
+      .hero h1 {
+        margin: 26px 0 18px;
+        font-family: "Inter", sans-serif;
+        font-size: clamp(4.2rem, 6vw, 6.8rem);
+        line-height: 0.93;
+        letter-spacing: -0.06em;
+        max-width: 10.5ch;
+      }
+
+      .hero h1 span {
+        color: var(--lime);
+      }
+
+      .hero__lede {
+        max-width: 56ch;
+        margin: 0 0 30px;
+        color: var(--muted-strong);
+        font-size: 1.14rem;
+        line-height: 1.75;
+      }
+
+      .cta {
+        position: relative;
+        z-index: 3;
+        padding: 20px;
+        border-radius: 30px;
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02)),
+          var(--panel-strong);
+        border: 1px solid rgba(156, 255, 99, 0.2);
+        box-shadow: var(--shadow);
+        overflow: visible;
+        transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
+      }
+
+      .cta::before {
+        content: "";
+        position: absolute;
+        inset: 0;
+        border-radius: inherit;
+        pointer-events: none;
+        background: linear-gradient(90deg, rgba(156, 255, 99, 0.12), rgba(136, 215, 255, 0.08), transparent 60%);
+      }
+
+      .cta--active {
+        z-index: 24;
+        border-color: rgba(156, 255, 99, 0.42);
+        box-shadow:
+          var(--shadow),
+          0 0 0 1px rgba(156, 255, 99, 0.18),
+          0 0 40px rgba(156, 255, 99, 0.12);
+        transform: translateY(-2px);
+      }
+
+      .cta__label {
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 16px;
+        color: var(--muted-strong);
+        font-size: 0.95rem;
+        margin-bottom: 14px;
+      }
+
+      .cta__hint {
+        color: var(--muted);
+        font-size: 0.88rem;
+      }
+
+      .cta__row {
+        position: relative;
+        z-index: 2;
+        display: grid;
+        grid-template-columns: 1fr auto auto;
+        gap: 14px;
+      }
+
+      .input-stack {
+        display: grid;
+        min-width: 0;
+        position: relative;
+        z-index: 40;
+      }
+
+      .input-shell {
+        position: relative;
+      }
+
+      .input-shell svg {
+        position: absolute;
+        left: 18px;
+        top: 50%;
+        width: 24px;
+        height: 24px;
+        color: #80ccce;
+        display: block;
+        pointer-events: none;
+        transform: translateY(-50%);
+      }
+
+      .input-shell input {
+        width: 100%;
+        height: 82px;
+        border-radius: 24px;
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        background: rgba(4, 9, 17, 0.88);
+        color: var(--text);
+        padding: 0 26px 0 58px;
+        font-family: "Inter", sans-serif;
+        font-size: 1.08rem;
+        outline: none;
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.05);
+        transition: border-color 160ms ease, border-radius 160ms ease;
+      }
+
+      .input-shell input::placeholder {
+        color: rgba(197, 208, 227, 0.5);
+      }
+
+      .input-shell input[aria-invalid="true"] {
+        border-color: rgba(255, 130, 130, 0.72);
+        box-shadow:
+          inset 0 0 0 1px rgba(255, 130, 130, 0.16),
+          0 0 0 1px rgba(255, 130, 130, 0.1);
+      }
+
+      .input-feedback {
+        position: relative;
+        z-index: 3;
+        margin: 10px 2px 0;
+        padding: 11px 14px;
+        border: 1px solid rgba(255, 161, 161, 0.28);
+        border-radius: 16px;
+        background:
+          linear-gradient(180deg, rgba(70, 25, 32, 0.74), rgba(34, 13, 20, 0.72)),
+          rgba(18, 8, 12, 0.9);
+        color: #ffd5d5;
+        font-size: 0.91rem;
+        line-height: 1.45;
+        box-shadow:
+          0 14px 34px rgba(0, 0, 0, 0.26),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      }
+
+      .input-feedback[hidden] {
+        display: none;
+      }
+
+      .cta__button {
+        position: relative;
+        overflow: hidden;
+        isolation: isolate;
+        height: 82px;
+        padding: 0 34px;
+        border: 0;
+        border-radius: 24px;
+        background: linear-gradient(135deg, var(--lime), #baff82);
+        color: var(--ink);
+        font-family: "Inter", sans-serif;
+        font-size: 1.06rem;
+        font-weight: 700;
+        letter-spacing: 0.01em;
+        cursor: pointer;
+        box-shadow:
+          0 18px 42px rgba(156, 255, 99, 0.18),
+          inset 0 -1px 0 rgba(0, 0, 0, 0.18);
+        transition:
+          transform 180ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          background 180ms ease,
+          color 180ms ease,
+          box-shadow 180ms ease;
+      }
+
+      .cta__button::before {
+        content: "";
+        position: absolute;
+        inset: -1px;
+        border-radius: inherit;
+        pointer-events: none;
+        opacity: 0;
+        background:
+          radial-gradient(circle at 24% 16%, rgba(255, 255, 255, 0.56), transparent 30%),
+          linear-gradient(120deg, rgba(255, 255, 255, 0.2), rgba(156, 255, 99, 0.04) 48%, rgba(136, 215, 255, 0.18));
+        transition: opacity 180ms ease;
+      }
+
+      .cta__button:hover,
+      .cta__button:focus-visible {
+        transform: translateY(-3px) scale(1.012);
+        background: linear-gradient(135deg, #b2ff73, #d8ff9a);
+        color: #05110d;
+        box-shadow:
+          0 24px 58px rgba(156, 255, 99, 0.28),
+          0 0 0 1px rgba(216, 255, 154, 0.16),
+          inset 0 -1px 0 rgba(0, 0, 0, 0.18);
+      }
+
+      .cta__button:hover::before,
+      .cta__button:focus-visible::before {
+        opacity: 1;
+      }
+
+      .cta__button:focus-visible {
+        outline: 2px solid rgba(186, 255, 130, 0.5);
+        outline-offset: 4px;
+      }
+
+      .cta__button--secondary {
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02)),
+          rgba(8, 15, 28, 0.94);
+        color: var(--text);
+        box-shadow:
+          0 18px 42px rgba(7, 14, 28, 0.22),
+          inset 0 -1px 0 rgba(255, 255, 255, 0.04);
+      }
+
+      .cta__button--secondary::before {
+        background:
+          radial-gradient(circle at 24% 18%, rgba(136, 215, 255, 0.24), transparent 32%),
+          linear-gradient(120deg, rgba(255, 255, 255, 0.12), rgba(136, 215, 255, 0.1) 50%, rgba(156, 255, 99, 0.11));
+      }
+
+      .cta__button--secondary:hover,
+      .cta__button--secondary:focus-visible {
+        border-color: rgba(136, 215, 255, 0.34);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(136, 215, 255, 0.035)),
+          rgba(10, 19, 34, 0.98);
+        color: #f8fbff;
+        box-shadow:
+          0 24px 54px rgba(6, 13, 26, 0.34),
+          0 0 0 1px rgba(136, 215, 255, 0.1),
+          0 0 34px rgba(136, 215, 255, 0.12),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      }
+
+      .cta__button--secondary:disabled {
+        cursor: default;
+        opacity: 0.62;
+        box-shadow: none;
+        transform: none;
+      }
+
+      .hf-models-launch {
+        position: relative;
+        z-index: 2;
+        display: inline-flex;
+        flex-wrap: nowrap;
+        align-items: center;
+        gap: 12px;
+        margin-top: 14px;
+        padding: 20px;
+        border-radius: 30px;
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02)),
+          var(--panel-strong);
+        border: 1px solid rgba(156, 255, 99, 0.2);
+        box-shadow: var(--shadow);
+      }
+
+      .proof__item.hf-models-launch {
+        display: grid;
+        align-content: start;
+        gap: 10px;
+        margin-top: 0;
+        padding: 16px 18px;
+        border-radius: 20px;
+      }
+
+      .hf-models-launch[hidden] {
+        display: none !important;
+      }
+
+      .hf-models-launch::before {
+        content: "";
+        position: absolute;
+        inset: 0;
+        border-radius: inherit;
+        pointer-events: none;
+        background: linear-gradient(90deg, rgba(156, 255, 99, 0.12), rgba(136, 215, 255, 0.08), transparent 60%);
+      }
+
+      .hf-models-launch__button,
+      .hf-models-login__button,
+      .hf-models-dashboard__button {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: 10px;
+        min-height: 52px;
+        border: 1px solid rgba(255, 210, 86, 0.28);
+        border-radius: 18px;
+        background:
+          linear-gradient(135deg, rgba(255, 214, 91, 0.18), rgba(255, 255, 255, 0.05)),
+          rgba(7, 14, 26, 0.88);
+        color: #fff4c2;
+        font-family: "Inter", sans-serif;
+        font-size: 0.98rem;
+        font-weight: 760;
+        letter-spacing: -0.01em;
+        cursor: pointer;
+        box-shadow: 0 16px 40px rgba(0, 0, 0, 0.24);
+      }
+
+      .hf-models-launch__button {
+        position: relative;
+        z-index: 2;
+        overflow: hidden;
+        isolation: isolate;
+        flex: 0 0 auto;
+        padding: 0 20px;
+        transition:
+          transform 180ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          border-color 180ms ease,
+          background 180ms ease,
+          color 180ms ease,
+          box-shadow 180ms ease;
+      }
+
+      .hf-models-launch__button::after {
+        content: "";
+        position: absolute;
+        inset: -1px;
+        border-radius: inherit;
+        opacity: 0;
+        pointer-events: none;
+        background:
+          radial-gradient(circle at 22% 18%, rgba(255, 236, 158, 0.34), transparent 31%),
+          linear-gradient(118deg, rgba(255, 218, 91, 0.22), rgba(255, 255, 255, 0.08) 42%, rgba(136, 215, 255, 0.14));
+        transition: opacity 180ms ease;
+      }
+
+      .hf-models-launch__button:hover,
+      .hf-models-launch__button:focus-visible {
+        transform: translateY(-3px) scale(1.01);
+        border-color: rgba(255, 223, 118, 0.56);
+        background:
+          linear-gradient(135deg, rgba(255, 222, 103, 0.25), rgba(255, 255, 255, 0.075)),
+          rgba(9, 17, 31, 0.95);
+        color: #fff9da;
+        box-shadow:
+          0 22px 50px rgba(0, 0, 0, 0.31),
+          0 0 0 1px rgba(255, 224, 128, 0.08),
+          0 0 34px rgba(255, 204, 75, 0.14);
+      }
+
+      .hf-models-launch__button:hover::after,
+      .hf-models-launch__button:focus-visible::after {
+        opacity: 1;
+      }
+
+      .hf-models-launch__button img {
+        transition:
+          transform 180ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          filter 180ms ease;
+      }
+
+      .hf-models-launch__button > * {
+        position: relative;
+        z-index: 1;
+      }
+
+      .hf-models-launch__button:hover img,
+      .hf-models-launch__button:focus-visible img {
+        transform: translateY(-1px) scale(1.04) rotate(-2deg);
+        filter: drop-shadow(0 7px 12px rgba(255, 213, 86, 0.22));
+      }
+
+      .hf-models-launch__button:focus-visible {
+        outline: 2px solid rgba(255, 232, 144, 0.46);
+        outline-offset: 3px;
+      }
+
+      .proof__item.hf-models-launch .hf-models-launch__button {
+        width: 100%;
+        min-height: 46px;
+        padding: 0 14px;
+        border-radius: 16px;
+      }
+
+      .hf-models-launch__button img,
+      .hf-models-login__button img {
+        height: 25px;
+        width: auto;
+        aspect-ratio: 95 / 88;
+        flex: 0 0 auto;
+        object-fit: contain;
+      }
+
+      .hf-models-launch__hint {
+        position: relative;
+        z-index: 2;
+        color: rgba(197, 208, 227, 0.72);
+        flex: 0 1 auto;
+        font-size: 0.91rem;
+        font-weight: 400;
+        min-width: 0;
+      }
+
+      .proof__item.hf-models-launch .hf-models-launch__hint {
+        font-size: 0.86rem;
+        line-height: 1.45;
+      }
+
+      .hf-models-launch__hint strong {
+        color: rgba(255, 255, 255, 0.96);
+      }
+
+      .hf-models-launch__button {
+        text-decoration: none;
+      }
+
+      .hf-models-page {
+        position: relative;
+        z-index: 2;
+        box-sizing: border-box;
+        display: grid;
+        align-items: start;
+        gap: 24px;
+        min-height: 100vh;
+        min-height: 100dvh;
+        padding: clamp(28px, 5vw, 58px);
+      }
+
+      .hf-article-login-page {
+        align-content: center;
+        align-items: center;
+        padding-top: clamp(14px, 2vw, 28px);
+        padding-bottom: clamp(14px, 2vw, 28px);
+        min-height: calc(100dvh - clamp(22px, 3.4vw, 44px));
+      }
+
+      .hf-models-page:not(.hf-article-login-page) {
+        align-content: center;
+        align-items: center;
+        padding: clamp(14px, 2.2vw, 24px) clamp(24px, 4.4vw, 52px);
+      }
+
+      .hf-models-page[hidden] {
+        display: none;
+      }
+
+      .hf-models-page.is-feature-exiting {
+        position: fixed;
+        inset: 0;
+        z-index: 30;
+        overflow: hidden;
+        pointer-events: none;
+        animation: hf-feature-dashboard-exit 780ms cubic-bezier(0.2, 0.78, 0.2, 1) both;
+      }
+
+      .hf-models-page.is-feature-transition-ready {
+        position: fixed;
+        inset: 0;
+        z-index: 30;
+        overflow: hidden;
+        pointer-events: none;
+      }
+
+      .page.route-hf-models .shell {
+        display: block;
+        width: 100%;
+        padding: 0;
+        grid-template-columns: none;
+        grid-template-areas: none;
+      }
+
+      .page.route-hf-models {
+        overflow: visible;
+      }
+
+      .page.route-hf-feature-preview .shell {
+        display: block;
+        width: 100%;
+        padding: 0;
+        grid-template-columns: none;
+        grid-template-areas: none;
+      }
+
+      .page.route-hf-article-login .shell,
+      .page.route-hf-article-picker .shell {
+        display: block;
+        width: 100%;
+        padding: clamp(8px, 1vw, 14px) 0 clamp(8px, 1vw, 12px);
+        grid-template-columns: none;
+        grid-template-areas: none;
+      }
+
+      .hf-models-shell {
+        box-sizing: border-box;
+        display: grid;
+        align-content: start;
+        align-self: start;
+        gap: 26px;
+        width: min(1180px, 100%);
+        min-width: 0;
+        margin: 0 auto;
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-shell {
+        width: min(1240px, 100%);
+      }
+
+      .hf-models-page:not(.hf-article-login-page)::before {
+        content: "";
+        position: fixed;
+        inset: 0;
+        z-index: -1;
+        pointer-events: none;
+        background:
+          radial-gradient(circle at 84% 20%, rgba(59, 202, 223, 0.1), transparent 30%),
+          radial-gradient(circle at 8% 0%, rgba(126, 75, 255, 0.18), transparent 34%),
+          linear-gradient(135deg, rgba(17, 14, 43, 0.5) 0%, #060c1e 68%, rgba(2, 7, 15, 0.86) 100%);
+      }
+
+      .hf-article-login-page::before {
+        content: "";
+        position: fixed;
+        inset: 0;
+        z-index: -1;
+        pointer-events: none;
+        background:
+          radial-gradient(circle at 14% 10%, rgba(125, 78, 255, 0.18), transparent 36%),
+          radial-gradient(circle at 84% 30%, rgba(67, 213, 239, 0.13), transparent 34%),
+          linear-gradient(180deg, rgba(3, 7, 18, 0.18), rgba(2, 7, 15, 0.82));
+      }
+
+      .hf-models-login,
+      .hf-models-loading,
+      .hf-models-dashboard {
+        box-sizing: border-box;
+        max-width: 100%;
+        min-width: 0;
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 30px;
+        background:
+          radial-gradient(circle at 18% 0%, rgba(255, 214, 91, 0.12), transparent 34%),
+          linear-gradient(180deg, rgba(10, 19, 34, 0.88), rgba(4, 9, 17, 0.9));
+        box-shadow:
+          0 24px 70px rgba(0, 0, 0, 0.32),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      }
+
+      .hf-models-login {
+        position: relative;
+        display: grid;
+        align-content: start;
+        align-self: start;
+        gap: 0;
+        justify-self: center;
+        padding: clamp(24px, 5vw, 44px);
+        width: min(760px, 100%);
+        max-width: 760px;
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-login {
+        zoom: 0.9;
+        isolation: isolate;
+        overflow: hidden;
+        width: min(980px, 100%);
+        max-width: 980px;
+        min-height: min(570px, calc(100dvh - clamp(28px, 4.4vw, 48px)));
+        padding: clamp(10px, 1vw, 14px) clamp(22px, 2.6vw, 32px);
+        border-color: rgba(125, 151, 215, 0.36);
+        border-radius: clamp(30px, 4vw, 48px);
+        background:
+          radial-gradient(ellipse at 100% 0%, #060c1e 0 29%, rgba(6, 12, 30, 0.97) 38%, rgba(6, 12, 30, 0) 56%),
+          radial-gradient(ellipse at 100% 100%, #040918 0 27%, rgba(4, 9, 24, 0.95) 39%, rgba(4, 9, 24, 0) 58%),
+          radial-gradient(circle at 18% 18%, rgba(123, 89, 255, 0.2), transparent 36%),
+          radial-gradient(circle at 76% 46%, rgba(68, 210, 239, 0.075), transparent 32%),
+          linear-gradient(135deg, rgba(17, 23, 50, 0.94), #070d1e 58%, #070d1e 100%);
+        box-shadow:
+          0 34px 100px rgba(0, 0, 0, 0.44),
+          inset 0 1px 0 rgba(255, 255, 255, 0.11),
+          inset 0 0 0 1px rgba(255, 255, 255, 0.035);
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-login::before {
+        content: "";
+        position: absolute;
+        inset: 1px;
+        z-index: -1;
+        border-radius: inherit;
+        pointer-events: none;
+        background:
+          linear-gradient(90deg, rgba(148, 116, 255, 0.12), transparent 38%, rgba(6, 12, 30, 0.04)),
+          repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.02) 0 1px, transparent 1px 86px),
+          repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.014) 0 1px, transparent 1px 86px);
+        mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.86), rgba(0, 0, 0, 0.48));
+      }
+
+      .hf-models-login__layout {
+        display: grid;
+        grid-template-columns: minmax(0, 0.82fr) minmax(500px, 0.88fr);
+        align-items: center;
+        gap: clamp(0px, 1.8vw, 28px);
+        width: 100%;
+      }
+
+      .hf-models-login__copy {
+        position: relative;
+        z-index: 3;
+        display: grid;
+        align-content: center;
+        gap: clamp(9px, 1.1vw, 15px);
+        min-width: 0;
+      }
+
+      .hf-models-login__eyebrow-pill {
+        display: inline-flex;
+        align-items: center;
+        gap: 12px;
+        width: fit-content;
+        max-width: 100%;
+        min-height: 44px;
+        padding: 0 18px 0 10px;
+        border: 1px solid rgba(139, 255, 176, 0.16);
+        border-radius: 999px;
+        background:
+          linear-gradient(90deg, rgba(121, 255, 158, 0.13), rgba(134, 160, 255, 0.055)),
+          rgba(14, 22, 44, 0.72);
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.08),
+          0 16px 38px rgba(0, 0, 0, 0.26);
+        color: rgba(139, 255, 176, 0.92);
+        font-size: 0.78rem;
+        font-weight: 820;
+        letter-spacing: 0.24em;
+        text-transform: uppercase;
+      }
+
+      .hf-models-login__eyebrow-icon {
+        display: inline-grid;
+        place-items: center;
+        width: 30px;
+        height: 30px;
+        flex: 0 0 auto;
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 35% 28%, rgba(255, 255, 255, 0.34), transparent 32%),
+          linear-gradient(135deg, rgba(120, 255, 150, 0.94), rgba(47, 175, 91, 0.88));
+        box-shadow:
+          0 0 0 6px rgba(120, 255, 150, 0.08),
+          0 0 30px rgba(120, 255, 150, 0.32);
+      }
+
+      .hf-models-login__eyebrow-icon img {
+        width: 20px;
+        height: 18px;
+        object-fit: contain;
+        filter: saturate(0) brightness(0) invert(1);
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-login__eyebrow-pill {
+        gap: 9px;
+        min-height: 36px;
+        padding: 0 14px 0 7px;
+        font-size: 0.68rem;
+        letter-spacing: 0.2em;
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-login__eyebrow-icon {
+        width: 25px;
+        height: 25px;
+        box-shadow:
+          0 0 0 4px rgba(120, 255, 150, 0.07),
+          0 0 22px rgba(120, 255, 150, 0.26);
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-login__eyebrow-icon img {
+        width: 17px;
+        height: 15px;
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-login h2 {
+        position: relative;
+        z-index: 2;
+        max-width: none;
+        width: max-content;
+        padding-right: 0.1em;
+        font-size: clamp(2.85rem, 3.6vw, 4.05rem);
+        line-height: 1.02;
+        letter-spacing: -0.08em;
+        white-space: nowrap;
+        text-wrap: nowrap;
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-login h2 span,
+      .hf-article-login-page .hf-models-login h2 span {
+        color: #a278ff;
+        background: linear-gradient(92deg, #7e5cff 4%, #b978ff 48%, #7b6cff 96%);
+        -webkit-background-clip: text;
+        background-clip: text;
+        -webkit-text-fill-color: transparent;
+        text-shadow: 0 18px 44px rgba(111, 78, 255, 0.34);
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-login h2 span {
+        display: inline-block;
+        padding-right: 0.08em;
+        padding-bottom: 0.14em;
+        margin-bottom: -0.14em;
+      }
+
+      .hf-models-login__lead {
+        margin: -2px 0 0;
+        color: rgba(203, 214, 236, 0.8);
+        font-size: clamp(0.95rem, 1.12vw, 1.08rem);
+        line-height: 1.45;
+      }
+
+      .hf-models-login__allows {
+        margin: 0;
+        color: rgba(247, 250, 255, 0.94);
+        font-size: 0.96rem;
+        font-weight: 780;
+      }
+
+      .hf-models-login__features {
+        display: grid;
+        max-width: 510px;
+        margin: 0;
+        padding: 0;
+        list-style: none;
+      }
+
+      .hf-models-login__feature {
+        display: grid;
+        grid-template-columns: 46px minmax(0, 1fr);
+        align-items: center;
+        gap: 14px;
+        min-width: 0;
+        padding: 7px 0;
+        border-bottom: 1px solid rgba(197, 208, 227, 0.11);
+        color: rgba(224, 234, 249, 0.9);
+        font-size: clamp(0.93rem, 1.08vw, 1.02rem);
+        line-height: 1.28;
+      }
+
+      .hf-models-login__feature:last-child {
+        border-bottom-color: transparent;
+      }
+
+      .hf-models-login__feature-icon {
+        display: grid;
+        place-items: center;
+        width: 46px;
+        height: 46px;
+        border-radius: 12px;
+        background: rgba(20, 18, 61, 0.96);
+        box-shadow:
+          0 12px 22px rgba(0, 0, 0, 0.25),
+          inset 0 -14px 26px rgba(5, 6, 24, 0.22);
+      }
+
+      .hf-models-login__feature img {
+        width: 33px;
+        height: 33px;
+        border-radius: 0;
+        object-fit: contain;
+        background: transparent;
+        filter: drop-shadow(0 8px 14px rgba(76, 42, 180, 0.22));
+      }
+
+      .hf-models-login__feature:first-child img {
+        width: 30px;
+        height: 30px;
+      }
+
+      .hf-models-login__visual {
+        position: absolute;
+        inset: 0 0 0 auto;
+        z-index: 1;
+        display: grid;
+        align-items: center;
+        justify-items: end;
+        justify-self: end;
+        min-width: 0;
+        width: min(58%, 670px);
+        min-height: 0;
+        margin: 0;
+        pointer-events: none;
+      }
+
+      .hf-models-login__visual::before {
+        content: "";
+        position: absolute;
+        inset: 8% 0 4%;
+        border-radius: 44px;
+        background:
+          radial-gradient(circle at 75% 40%, rgba(65, 236, 226, 0.18), transparent 34%),
+          radial-gradient(circle at 42% 50%, rgba(126, 85, 255, 0.18), transparent 38%);
+        filter: blur(28px);
+        pointer-events: none;
+      }
+
+      .hf-models-login__visual img {
+        position: relative;
+        width: min(124%, 690px);
+        max-width: none;
+        height: auto;
+        margin-right: 0;
+        object-fit: contain;
+        transform: translate(clamp(8px, 1.2vw, 18px), clamp(4px, 0.8vw, 12px));
+        transform-origin: 100% 0;
+        filter: drop-shadow(0 34px 64px rgba(0, 0, 0, 0.36));
+        -webkit-mask-image: linear-gradient(
+          90deg,
+          transparent 0%,
+          rgba(0, 0, 0, 0.08) 3%,
+          rgba(0, 0, 0, 0.58) 11%,
+          #000 23%,
+          #000 100%
+        );
+        mask-image: linear-gradient(
+          90deg,
+          transparent 0%,
+          rgba(0, 0, 0, 0.08) 3%,
+          rgba(0, 0, 0, 0.58) 11%,
+          #000 23%,
+          #000 100%
+        );
+      }
+
+      .hf-models-loading {
+        display: grid;
+        align-content: start;
+        align-self: start;
+        gap: 18px;
+        justify-self: center;
+        padding: clamp(24px, 5vw, 44px);
+        width: min(760px, 100%);
+        max-width: 760px;
+      }
+
+      .hf-models-login .eyebrow {
+        justify-self: start;
+        width: max-content;
+        max-width: 100%;
+      }
+
+      .hf-models-loading .eyebrow {
+        justify-self: start;
+        width: max-content;
+        max-width: 100%;
+      }
+
+      .hf-models-login[hidden],
+      .hf-models-loading[hidden],
+      .hf-models-dashboard[hidden] {
+        display: none;
+      }
+
+      .hf-models-login h2,
+      .hf-models-loading h2,
+      .hf-models-dashboard h2 {
+        margin: 0;
+        color: var(--text);
+        font-size: clamp(2rem, 4vw, 3.6rem);
+        line-height: 0.94;
+        letter-spacing: -0.07em;
+      }
+
+      .hf-models-login p,
+      .hf-models-loading p,
+      .hf-models-dashboard__intro,
+      .hf-models-dashboard__notice {
+        margin: 0;
+        color: rgba(197, 208, 227, 0.76);
+        font-size: 1rem;
+        line-height: 1.6;
+      }
+
+      .hf-models-login__actions {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 12px;
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-login__actions {
+        align-items: center;
+        flex-wrap: nowrap;
+      }
+
+      .hf-models-login .hf-models-login__optin,
+      .hf-article-login .hf-models-login__optin {
+        display: flex; align-items: flex-start; gap: 11px;
+        margin: 0; max-width: 460px; cursor: pointer;
+        font-size: 14px; line-height: 1.55; color: var(--muted-strong, #c5d0e3);
+        text-align: left;
+      }
+      .hf-models-login__optin input {
+        margin: 2px 0 0; width: 18px; height: 18px; flex: none;
+        accent-color: #9cff63; cursor: pointer;
+      }
+      .hf-models-login__optin:hover { color: var(--muted-strong, #c5d0e3); }
+
+      .hf-models-login .hf-models-login__notice {
+        max-width: 620px;
+        color: rgba(197, 208, 227, 0.52);
+        font-size: 0.78rem;
+        line-height: 1.45;
+      }
+
+      .hf-models-login .hf-models-login__notice a {
+        color: #fff4c2;
+        text-underline-offset: 0.2em;
+      }
+
+      .hf-article-login-page .hf-models-shell {
+        align-self: center;
+        width: min(1380px, 100%);
+      }
+
+      .hf-article-login-page .hf-models-login {
+        isolation: isolate;
+        overflow: hidden;
+        width: min(1380px, 100%);
+        max-width: 1380px;
+        min-height: min(764px, calc(100dvh - clamp(64px, 8vw, 92px)));
+        padding: clamp(28px, 3.9vw, 54px) clamp(30px, 4.2vw, 58px) clamp(14px, 1.7vw, 22px);
+        border-color: rgba(124, 151, 218, 0.36);
+        border-radius: clamp(30px, 3.8vw, 46px);
+        background:
+          radial-gradient(ellipse at 100% 0%, #060c1e 0 29%, rgba(6, 12, 30, 0.97) 38%, rgba(6, 12, 30, 0) 56%),
+          radial-gradient(circle at 18% 18%, rgba(123, 89, 255, 0.19), transparent 36%),
+          radial-gradient(circle at 80% 42%, rgba(67, 215, 241, 0.11), transparent 34%),
+          linear-gradient(135deg, rgba(14, 22, 48, 0.94), rgba(3, 9, 21, 0.96) 54%, rgba(2, 10, 18, 0.99));
+        box-shadow:
+          0 34px 100px rgba(0, 0, 0, 0.44),
+          inset 0 1px 0 rgba(255, 255, 255, 0.11),
+          inset 0 0 0 1px rgba(255, 255, 255, 0.035);
+      }
+
+      .hf-article-login-page .hf-models-login::before {
+        content: "";
+        position: absolute;
+        inset: 1px;
+        z-index: -1;
+        border-radius: inherit;
+        pointer-events: none;
+        background:
+          linear-gradient(90deg, rgba(148, 116, 255, 0.12), transparent 34%, rgba(88, 217, 240, 0.1)),
+          repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.026) 0 1px, transparent 1px 86px),
+          repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 86px);
+        mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.88), rgba(0, 0, 0, 0.42));
+      }
+
+      .hf-article-login-page .hf-models-login:not(.is-invite) {
+        align-content: start;
+      }
+
+      .hf-article-login__head {
+        position: relative;
+        z-index: 3;
+        display: flex;
+        align-items: flex-start;
+        justify-content: space-between;
+        gap: 20px;
+      }
+
+      .hf-article-login:not(.is-invite) .hf-article-login__head {
+        display: none;
+      }
+
+      .page.route-hf-article-login .blogs-with-graphs,
+      .page.route-hf-article-picker .blogs-with-graphs,
+      .page.route-hf-models .blogs-with-graphs,
+      .page.route-hf-feature-preview .blogs-with-graphs,
+      body.route-hf-feature-preview .blogs-with-graphs {
+        display: none !important;
+      }
+
+      .hf-article-login__head .eyebrow {
+        position: relative;
+        display: inline-flex;
+        align-items: center;
+        gap: 14px;
+        flex: 0 0 auto;
+        min-height: 47px;
+        padding: 0 20px 0 13px;
+        border: 1px solid rgba(184, 198, 226, 0.16);
+        border-radius: 999px;
+        background: rgba(15, 24, 45, 0.72);
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.09),
+          0 16px 38px rgba(0, 0, 0, 0.28);
+        color: rgba(232, 238, 252, 0.9);
+        font-size: 0.88rem;
+        font-weight: 760;
+        letter-spacing: 0.18em;
+        text-transform: uppercase;
+      }
+
+      .hf-article-login__head .eyebrow::before {
+        content: "";
+        width: 18px;
+        height: 18px;
+        flex: 0 0 auto;
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 36% 30%, rgba(255, 255, 255, 0.42), transparent 35%),
+          linear-gradient(135deg, rgba(142, 255, 95, 0.95), rgba(45, 171, 76, 0.9));
+        box-shadow:
+          0 0 0 9px rgba(139, 255, 95, 0.08),
+          0 0 26px rgba(139, 255, 95, 0.32);
+      }
+
+      .hf-article-login__layout {
+        display: grid;
+        grid-template-columns: minmax(500px, 0.98fr) minmax(470px, 1.02fr);
+        align-items: center;
+        gap: clamp(8px, 1.8vw, 28px);
+        width: 100%;
+      }
+
+      .hf-article-login__copy-column {
+        position: relative;
+        z-index: 3;
+        display: grid;
+        align-self: start;
+        align-content: center;
+        gap: clamp(16px, 1.9vw, 26px);
+        min-width: 0;
+        max-width: 680px;
+      }
+
+      .hf-article-login-page .hf-models-login:not(.is-invite) .hf-article-login__copy-column {
+        align-self: start;
+      }
+
+      .hf-article-login-page .hf-models-login h2 {
+        max-width: 680px;
+        font-size: clamp(2.25rem, 3vw, 2.65rem);
+        line-height: 0.98;
+        letter-spacing: -0.08em;
+        text-wrap: balance;
+      }
+
+      .hf-article-login.is-invite #hf-article-login-title {
+        max-width: 100%;
+        color: rgba(166, 178, 197, 0.62);
+        overflow-wrap: break-word;
+        word-break: normal;
+      }
+
+      .hf-article-login.is-invite #hf-article-login-title strong {
+        color: var(--text);
+        font-weight: 860;
+      }
+
+      .hf-article-login.is-invite #hf-article-login-title strong {
+        overflow-wrap: anywhere;
+        word-break: break-word;
+      }
+
+      .hf-article-login__model {
+        display: inline-flex;
+        align-items: center;
+        width: fit-content;
+        max-width: min(46%, 330px);
+        min-height: 47px;
+        padding: 0 22px;
+        border-radius: 999px;
+        border: 1px solid rgba(91, 156, 239, 0.46);
+        background: rgba(8, 20, 43, 0.64);
+        color: rgba(237, 245, 255, 0.94);
+        font-size: clamp(0.92rem, 1.1vw, 1.14rem);
+        font-weight: 760;
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.09),
+          0 14px 42px rgba(47, 129, 255, 0.12);
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .hf-article-login__copy {
+        display: grid;
+        gap: clamp(10px, 1.25vw, 17px);
+      }
+
+      .hf-article-login__copy a {
+        color: #fff4c2;
+        font-weight: 760;
+        text-underline-offset: 0.2em;
+      }
+
+      .hf-article-login__feature-list {
+        display: grid;
+        gap: 0;
+        margin: 2px 0 0;
+        padding: 0;
+        list-style: none;
+        max-width: 420px;
+        color: rgba(224, 234, 249, 0.91);
+        font-size: clamp(1rem, 1.24vw, 1.18rem);
+      }
+
+      .hf-article-login__feature-list li {
+        position: relative;
+        min-height: 62px;
+        padding: 10px 0 10px 42px;
+        border-bottom: 1px solid rgba(197, 208, 227, 0.1);
+        line-height: 1.42;
+      }
+
+      .hf-article-login__feature-list li::before {
+        content: "";
+        position: absolute;
+        left: 7px;
+        top: 20px;
+        width: 12px;
+        height: 12px;
+        border-radius: 999px;
+        background: linear-gradient(135deg, rgba(154, 255, 92, 0.98), rgba(61, 184, 85, 0.92));
+        box-shadow:
+          0 0 0 8px rgba(142, 255, 82, 0.06),
+          0 0 22px rgba(142, 255, 82, 0.4);
+      }
+
+      .hf-article-login__feature-list li:last-child {
+        border-bottom-color: transparent;
+      }
+
+      .hf-article-login__example {
+        margin: -3px 0 0;
+        max-width: 570px;
+        color: rgba(197, 208, 227, 0.76);
+        font-size: clamp(0.98rem, 1.15vw, 1.08rem);
+        line-height: 1.5;
+      }
+
+      .hf-article-login.is-invite h2 {
+        color: rgba(166, 178, 197, 0.62);
+        font-weight: 560;
+        overflow-wrap: break-word;
+        word-break: normal;
+      }
+
+      .hf-article-login.is-invite h2 strong {
+        color: rgba(235, 248, 255, 0.98);
+        font-weight: 900;
+        overflow-wrap: anywhere;
+        word-break: break-word;
+      }
+
+      .hf-article-login__visual {
+        position: relative;
+        z-index: 1;
+        display: grid;
+        align-self: stretch;
+        align-items: center;
+        justify-items: end;
+        min-width: 0;
+        min-height: clamp(460px, 48vw, 650px);
+        margin: clamp(-24px, -2vw, -10px) 0 clamp(-34px, -2.5vw, -18px) clamp(-72px, -4.4vw, -28px);
+      }
+
+      .hf-article-login__visual::before {
+        content: "";
+        position: absolute;
+        inset: 12% 0 2% 18%;
+        border-radius: 50%;
+        background:
+          radial-gradient(circle at 72% 42%, rgba(92, 218, 246, 0.2), transparent 38%),
+          radial-gradient(circle at 46% 58%, rgba(134, 85, 255, 0.24), transparent 42%);
+        filter: blur(32px);
+        opacity: 0.8;
+        pointer-events: none;
+      }
+
+      .hf-article-login__visual img {
+        position: relative;
+        width: min(100%, 850px);
+        max-width: none;
+        height: auto;
+        object-fit: contain;
+        transform: translateX(clamp(-48px, -4.2vw, -22px));
+        transform-origin: 100% 50%;
+        filter: drop-shadow(0 36px 70px rgba(0, 0, 0, 0.4));
+      }
+
+      .hf-article-picker-page {
+        position: relative;
+        z-index: 2;
+        box-sizing: border-box;
+        display: grid;
+        min-height: 100vh;
+        min-height: 100dvh;
+        padding: clamp(24px, 4vw, 48px);
+      }
+
+      .hf-watchlist-page {
+        min-height: 100vh;
+        padding: clamp(28px, 5vw, 56px) clamp(18px, 4vw, 48px) 80px;
+        max-width: 1180px;
+        margin: 0 auto;
+      }
+      .hf-watchlist-page[hidden] { display: none !important; }
+      .hf-watchlist-head { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; }
+      .hf-watchlist-head h1 { margin: 0; font-size: clamp(28px, 4vw, 40px); letter-spacing: -0.04em; }
+      .hf-watchlist-lede { color: var(--muted, #91a0ba); font-size: 15px; margin: 10px 0 22px; max-width: 640px; }
+      .hf-watchlist-search {
+        width: 100%; max-width: 460px; padding: 13px 18px 13px 44px;
+        background: rgba(255, 255, 255, 0.05) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235c6b81' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 15px center / 17px 17px;
+        border: 1px solid rgba(156, 255, 99, 0.22); border-radius: 14px;
+        color: var(--text, #f5f8ff); font: 500 15px "Inter", sans-serif; outline: none;
+      }
+      .hf-watchlist-search:focus { border-color: rgba(156, 255, 99, 0.55); }
+      .hf-watchlist-status { color: var(--muted, #91a0ba); font-size: 12.5px; margin: 12px 0 0; min-height: 18px; }
+      .hf-watchlist-grid {
+        margin-top: 22px;
+        display: grid; gap: 14px;
+        grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
+      }
+      .hf-watchlist-card {
+        position: relative;
+        display: flex; flex-direction: column; align-items: center; gap: 10px;
+        padding: 26px 18px 18px;
+        border: 1px solid var(--stroke, rgba(255,255,255,0.1)); border-radius: 22px;
+        background: rgba(255, 255, 255, 0.04);
+        text-align: center;
+        transition: border-color 160ms ease, transform 160ms ease, background 160ms ease;
+      }
+      .hf-watchlist-card:hover { border-color: rgba(156, 255, 99, 0.35); transform: translateY(-3px); }
+      .hf-watchlist-card__logo {
+        width: 84px; height: 84px; border-radius: 22px; object-fit: cover;
+        background: rgba(136, 215, 255, 0.12);
+        box-shadow: 0 14px 34px rgba(0, 0, 0, 0.35);
+      }
+      .hf-watchlist-card__logo--user { border-radius: 50%; }
+      .hf-watchlist-card__logo--letter {
+        display: flex; align-items: center; justify-content: center;
+        font-size: 32px; font-weight: 800; color: #88d7ff;
+      }
+      .hf-watchlist-card__name { font-weight: 800; font-size: 16.5px; letter-spacing: -0.02em; word-break: break-word; }
+      .hf-watchlist-card__facts { color: var(--muted-strong, #c5d0e3); font-size: 12.5px; line-height: 1.55; }
+      .hf-watchlist-card__facts b { color: var(--text, #f5f8ff); }
+      .hf-watchlist-card__stats { color: var(--muted, #91a0ba); font-size: 11.5px; display: flex; gap: 10px; }
+      .hf-watchlist-card__watch {
+        margin-top: 4px;
+        padding: 8px 20px; border-radius: 999px; cursor: pointer;
+        border: 1px solid rgba(156, 255, 99, 0.4);
+        background: transparent; color: var(--lime, #9cff63);
+        font: 700 12.5px "Inter", sans-serif; letter-spacing: 0.02em;
+        transition: background 150ms ease, color 150ms ease;
+      }
+      .hf-watchlist-card__watch:hover { background: rgba(156, 255, 99, 0.12); }
+      .hf-watchlist-card__watch.is-watching {
+        background: var(--lime, #9cff63); color: #07100d; border-color: var(--lime, #9cff63);
+      }
+      .hf-watchlist-empty { color: var(--muted, #91a0ba); margin-top: 26px; }
+      /* landing search CTA: green bell pill in the results status row */
+      .hfnx-watchcta {
+        display: inline-flex; align-items: center; gap: 7px;
+        margin-left: 12px; padding: 7px 16px; border-radius: 999px; cursor: pointer;
+        border: 1px solid rgba(156, 255, 99, 0.5);
+        background: rgba(156, 255, 99, 0.12);
+        color: var(--lime, #9cff63);
+        font: 600 13px "Inter", sans-serif;
+        vertical-align: middle;
+        transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
+      }
+      .hfnx-watchcta:hover:not(:disabled):not(.is-watching),
+      .hfnx-watchcta:focus-visible:not(:disabled):not(.is-watching) {
+        background: rgba(156, 255, 99, 0.2);
+        border-color: rgba(156, 255, 99, 0.72);
+        outline: none;
+      }
+      .hfnx-watchcta__icon { display: inline-flex; width: 13px; height: 13px; flex: 0 0 auto; color: currentColor; }
+      .hfnx-watchcta__icon svg { width: 100%; height: 100%; display: block; fill: currentColor; }
+      .hfnx-watchcta.is-watching {
+        cursor: default;
+        border-color: rgba(156, 255, 99, 0.32);
+        background:
+          radial-gradient(circle at 50% 0%, rgba(156, 255, 99, 0.2), transparent 64%),
+          linear-gradient(180deg, rgba(156, 255, 99, 0.15), rgba(136, 215, 255, 0.055)),
+          rgba(7, 16, 29, 0.76);
+        color: #e7ffd8;
+      }
+      .hfnx-watchcta:disabled { opacity: 0.6; cursor: wait; }
+
+      .hf-article-picker-page[hidden] {
+        display: none;
+      }
+
+      .hf-article-picker-page::before {
+        content: "";
+        position: fixed;
+        inset: 0;
+        z-index: -1;
+        pointer-events: none;
+        background:
+          radial-gradient(circle at 12% 12%, rgba(123, 89, 255, 0.18), transparent 32%),
+          radial-gradient(circle at 88% 18%, rgba(92, 218, 246, 0.13), transparent 34%),
+          linear-gradient(145deg, rgba(4, 9, 20, 0.98), rgba(5, 11, 24, 0.98) 48%, rgba(2, 8, 16, 0.99));
+      }
+
+      .hf-article-picker-shell {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
+        gap: clamp(20px, 3vw, 34px);
+        width: min(1220px, 100%);
+        margin: 0 auto;
+        align-self: center;
+      }
+
+      .hf-article-picker-panel,
+      .hf-article-picker-aside {
+        box-sizing: border-box;
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 32px;
+        background:
+          radial-gradient(circle at 18% 0%, rgba(156, 255, 99, 0.1), transparent 28%),
+          linear-gradient(180deg, rgba(9, 18, 34, 0.9), rgba(4, 9, 18, 0.94));
+        box-shadow:
+          0 26px 78px rgba(0, 0, 0, 0.34),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      }
+
+      .hf-article-picker-panel {
+        display: grid;
+        align-content: start;
+        gap: 22px;
+        min-width: 0;
+        padding: clamp(24px, 3.6vw, 42px);
+      }
+
+      .hf-article-picker-head {
+        display: grid;
+        gap: 12px;
+      }
+
+      .hf-article-picker-head .eyebrow {
+        justify-self: start;
+      }
+
+      .hf-article-picker-head h2 {
+        margin: 0;
+        max-width: 760px;
+        color: var(--text);
+        font-size: clamp(2.2rem, 4.4vw, 4.6rem);
+        line-height: 0.95;
+        letter-spacing: -0.08em;
+      }
+
+      .hf-article-picker-head h2 span {
+        color: #9cff63;
+        background: linear-gradient(94deg, #b9ff76 4%, #83ffad 50%, #88d7ff 100%);
+        -webkit-background-clip: text;
+        background-clip: text;
+        -webkit-text-fill-color: transparent;
+        text-shadow: 0 18px 42px rgba(105, 255, 160, 0.22);
+      }
+
+      .hf-article-picker-lede {
+        margin: 0;
+        max-width: 760px;
+        color: rgba(207, 219, 238, 0.78);
+        font-size: clamp(1rem, 1.4vw, 1.12rem);
+        line-height: 1.62;
+      }
+
+      .hf-article-picker-type-grid {
+        display: grid;
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+        gap: 12px;
+      }
+
+      .hf-article-picker-type {
+        display: grid;
+        gap: 6px;
+        min-width: 0;
+        padding: 14px 16px;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 20px;
+        background: rgba(255, 255, 255, 0.035);
+      }
+
+      .hf-article-picker-type strong {
+        color: rgba(239, 249, 255, 0.96);
+        font-size: 0.78rem;
+        letter-spacing: 0.16em;
+        text-transform: uppercase;
+      }
+
+      .hf-article-picker-type span {
+        color: rgba(198, 211, 231, 0.74);
+        font-size: 0.92rem;
+        line-height: 1.45;
+      }
+
+      .hf-article-picker-search-row {
+        display: flex;
+        align-items: center;
+        gap: 12px;
+      }
+
+      .hf-article-picker-search {
+        box-sizing: border-box;
+        width: 100%;
+        min-height: 56px;
+        padding: 0 18px;
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 18px;
+        background: rgba(0, 0, 0, 0.28);
+        color: rgba(241, 248, 255, 0.96);
+        font: inherit;
+        font-size: 1.02rem;
+        outline: none;
+        transition:
+          border-color 160ms ease,
+          box-shadow 160ms ease,
+          background 160ms ease;
+      }
+
+      .hf-article-picker-search:focus {
+        border-color: rgba(136, 215, 255, 0.42);
+        background: rgba(0, 0, 0, 0.36);
+        box-shadow:
+          0 0 0 4px rgba(136, 215, 255, 0.08),
+          inset 0 1px 0 rgba(255, 255, 255, 0.06);
+      }
+
+      .hf-article-picker-search::placeholder {
+        color: rgba(197, 208, 227, 0.46);
+      }
+
+      .hf-article-picker-status {
+        min-height: 22px;
+        margin: -6px 0 0;
+        color: rgba(197, 208, 227, 0.66);
+        font-size: 0.92rem;
+        line-height: 1.45;
+      }
+
+      .hf-article-picker-actions {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: 12px;
+      }
+
+      .hf-article-picker-results {
+        display: grid;
+        gap: 12px;
+        min-width: 0;
+      }
+
+      .hf-article-picker-empty {
+        margin: 0;
+        padding: 18px;
+        border: 1px dashed rgba(136, 215, 255, 0.18);
+        border-radius: 18px;
+        color: rgba(197, 208, 227, 0.68);
+        background: rgba(255, 255, 255, 0.025);
+      }
+
+      .hf-article-picker-card {
+        display: grid;
+        grid-template-columns: 112px minmax(0, 1fr) auto;
+        gap: 16px;
+        align-items: center;
+        min-width: 0;
+        padding: 12px;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 22px;
+        background:
+          radial-gradient(circle at 7% 0%, rgba(156, 255, 99, 0.07), transparent 28%),
+          rgba(255, 255, 255, 0.035);
+        transition:
+          border-color 160ms ease,
+          background 160ms ease,
+          transform 160ms ease;
+      }
+
+      .hf-article-picker-card:hover {
+        border-color: rgba(136, 215, 255, 0.22);
+        background:
+          radial-gradient(circle at 7% 0%, rgba(156, 255, 99, 0.1), transparent 28%),
+          rgba(255, 255, 255, 0.052);
+        transform: translateY(-1px);
+      }
+
+      .hf-article-picker-card__thumb {
+        display: grid;
+        place-items: center;
+        width: 112px;
+        height: 78px;
+        overflow: hidden;
+        border-radius: 16px;
+        background:
+          radial-gradient(circle at 50% 18%, rgba(136, 215, 255, 0.13), transparent 36%),
+          rgba(0, 0, 0, 0.22);
+      }
+
+      .hf-article-picker-card__thumb img {
+        display: block;
+        max-width: 100%;
+        max-height: 100%;
+        object-fit: contain;
+      }
+
+      .hf-article-picker-card__dot {
+        width: 16px;
+        height: 16px;
+        border-radius: 999px;
+        background: linear-gradient(135deg, #9cff63, #88d7ff);
+        box-shadow:
+          0 0 0 9px rgba(156, 255, 99, 0.07),
+          0 0 28px rgba(136, 215, 255, 0.22);
+      }
+
+      .hf-article-picker-card__body {
+        display: grid;
+        gap: 8px;
+        min-width: 0;
+      }
+
+      .hf-article-picker-card__repo {
+        color: rgba(241, 248, 255, 0.96);
+        font-weight: 820;
+        letter-spacing: -0.025em;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .hf-article-picker-card__meta {
+        color: rgba(197, 208, 227, 0.62);
+        font-size: 0.86rem;
+        line-height: 1.4;
+      }
+
+      .hf-article-picker-badges {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 6px;
+      }
+
+      .hf-article-picker-badge {
+        display: inline-flex;
+        align-items: center;
+        min-height: 24px;
+        padding: 0 9px;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.045);
+        color: rgba(221, 233, 246, 0.82);
+        font-size: 0.68rem;
+        font-weight: 820;
+        letter-spacing: 0.12em;
+        text-transform: uppercase;
+        white-space: nowrap;
+      }
+
+      .hf-article-picker-badge--owner {
+        border-color: rgba(136, 215, 255, 0.24);
+        background: rgba(136, 215, 255, 0.1);
+        color: rgba(205, 244, 255, 0.96);
+      }
+
+      .hf-article-picker-badge--community {
+        border-color: rgba(156, 255, 99, 0.22);
+        background: rgba(156, 255, 99, 0.085);
+        color: rgba(226, 255, 213, 0.94);
+      }
+
+      .hf-article-picker-badge--published {
+        border-color: rgba(255, 214, 91, 0.26);
+        background: rgba(255, 214, 91, 0.09);
+        color: rgba(255, 238, 184, 0.96);
+      }
+
+      .hf-article-picker-badge--not-ready {
+        border-color: rgba(255, 165, 124, 0.24);
+        background: rgba(255, 165, 124, 0.075);
+        color: rgba(255, 221, 204, 0.9);
+      }
+
+      .hf-article-picker-card__button {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        min-height: 40px;
+        padding: 0 16px;
+        border: 1px solid rgba(156, 255, 99, 0.28);
+        border-radius: 999px;
+        background: rgba(156, 255, 99, 0.1);
+        color: rgba(230, 255, 221, 0.96);
+        font: inherit;
+        font-size: 0.82rem;
+        font-weight: 820;
+        letter-spacing: -0.01em;
+        white-space: nowrap;
+        cursor: pointer;
+        transition:
+          border-color 160ms ease,
+          background 160ms ease,
+          box-shadow 160ms ease,
+          transform 160ms ease,
+          opacity 160ms ease;
+      }
+
+      .hf-article-picker-card__button:hover:not(:disabled),
+      .hf-article-picker-card__button:focus-visible:not(:disabled) {
+        border-color: rgba(156, 255, 99, 0.48);
+        background: rgba(156, 255, 99, 0.16);
+        box-shadow: 0 12px 28px rgba(156, 255, 99, 0.1);
+        transform: translateY(-1px);
+        outline: none;
+      }
+
+      .hf-article-picker-card__button:disabled {
+        cursor: default;
+        opacity: 0.58;
+      }
+
+      .hf-article-picker-aside {
+        display: grid;
+        align-content: start;
+        gap: 18px;
+        min-width: 0;
+        padding: 18px;
+      }
+
+      .hf-article-picker-screenshot {
+        display: block;
+        width: 100%;
+        /* the img carries width/height attributes; without this the fixed
+           attribute height wins over the fluid width and squishes the shot */
+        height: auto;
+        border-radius: 22px;
+        border: 1px solid rgba(255, 255, 255, 0.11);
+        background: #07111d;
+        box-shadow:
+          0 18px 54px rgba(0, 0, 0, 0.34),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      }
+
+      .hf-article-picker-aside h3 {
+        margin: 0;
+        color: rgba(241, 248, 255, 0.96);
+        font-size: clamp(1.35rem, 2vw, 1.8rem);
+        line-height: 1.02;
+        letter-spacing: -0.055em;
+      }
+
+      .hf-article-picker-aside p {
+        margin: 0;
+        color: rgba(197, 208, 227, 0.74);
+        line-height: 1.55;
+      }
+
+      @media (max-width: 980px) {
+        .hf-article-picker-page {
+          padding: 20px;
+        }
+
+        .hf-article-picker-shell {
+          grid-template-columns: minmax(0, 1fr);
+        }
+
+        .hf-article-picker-aside {
+          order: -1;
+        }
+      }
+
+      @media (max-width: 640px) {
+        .hf-article-picker-panel {
+          padding: 22px 18px;
+          border-radius: 26px;
+        }
+
+        .hf-article-picker-type-grid {
+          grid-template-columns: minmax(0, 1fr);
+        }
+
+        .hf-article-picker-card {
+          grid-template-columns: 72px minmax(0, 1fr);
+          align-items: start;
+        }
+
+        .hf-article-picker-card__thumb {
+          width: 72px;
+          height: 58px;
+        }
+
+        .hf-article-picker-card__button {
+          grid-column: 1 / -1;
+          justify-self: stretch;
+        }
+      }
+
+      .hf-models-login__button,
+      .hf-models-dashboard__button {
+        padding: 0 22px;
+        text-decoration: none;
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-login__button {
+        flex: 0 1 360px;
+        min-width: 0;
+        white-space: nowrap;
+      }
+
+      .hf-models-page:not(.hf-article-login-page) .hf-models-login__back {
+        flex: 0 0 auto;
+        min-width: 136px;
+        white-space: nowrap;
+      }
+
+      @supports not (zoom: 1) {
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login {
+          transform: scale(0.9);
+          transform-origin: center center;
+        }
+      }
+
+      .hf-models-login__button {
+        position: relative;
+        overflow: hidden;
+        isolation: isolate;
+        transition:
+          transform 180ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          border-color 180ms ease,
+          background 180ms ease,
+          color 180ms ease,
+          box-shadow 180ms ease;
+      }
+
+      .hf-models-login__button::before {
+        content: "";
+        position: absolute;
+        inset: -1px;
+        z-index: 0;
+        border-radius: inherit;
+        opacity: 0;
+        pointer-events: none;
+        background:
+          radial-gradient(circle at 18% 20%, rgba(255, 236, 158, 0.3), transparent 30%),
+          linear-gradient(110deg, rgba(255, 218, 91, 0.24), rgba(255, 255, 255, 0.08) 44%, rgba(255, 196, 78, 0.18));
+        transition: opacity 180ms ease;
+      }
+
+      .hf-models-login__button > * {
+        position: relative;
+        z-index: 1;
+      }
+
+      .hf-models-login__button img {
+        transition:
+          transform 180ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          filter 180ms ease;
+      }
+
+      .hf-models-login__button:hover,
+      .hf-models-login__button:focus-visible {
+        transform: translateY(-2px);
+        border-color: rgba(255, 223, 118, 0.56);
+        background:
+          linear-gradient(135deg, rgba(255, 222, 103, 0.25), rgba(255, 255, 255, 0.075)),
+          rgba(9, 17, 31, 0.95);
+        color: #fff9da;
+        box-shadow:
+          0 22px 48px rgba(0, 0, 0, 0.3),
+          0 0 0 1px rgba(255, 224, 128, 0.08),
+          0 0 34px rgba(255, 204, 75, 0.14);
+      }
+
+      .hf-models-login__button:hover::before,
+      .hf-models-login__button:focus-visible::before {
+        opacity: 1;
+      }
+
+      .hf-models-login__button:hover img,
+      .hf-models-login__button:focus-visible img {
+        transform: translateY(-1px) scale(1.04) rotate(-2deg);
+        filter: drop-shadow(0 7px 12px rgba(255, 213, 86, 0.22));
+      }
+
+      .hf-models-login__button:focus-visible {
+        outline: 2px solid rgba(255, 232, 144, 0.46);
+        outline-offset: 3px;
+      }
+
+      .hf-models-login__back {
+        border-color: rgba(197, 208, 227, 0.12);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018)),
+          rgba(7, 14, 26, 0.74);
+        color: rgba(197, 208, 227, 0.74);
+        box-shadow:
+          0 14px 34px rgba(0, 0, 0, 0.16),
+          inset 0 1px 0 rgba(255, 255, 255, 0.04);
+      }
+
+      .hf-models-login__button[hidden],
+      .hf-models-dashboard__button[hidden] {
+        display: none;
+      }
+
+      @media (min-width: 861px) and (max-height: 700px) {
+        .hf-models-page:not(.hf-article-login-page) {
+          padding-top: clamp(8px, 1.55vw, 14px);
+          padding-bottom: clamp(8px, 1.55vw, 14px);
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login {
+          min-height: min(552px, calc(100dvh - clamp(16px, 3.1vw, 28px)));
+          padding-top: clamp(10px, 1.25vw, 16px);
+          padding-bottom: clamp(10px, 1.25vw, 16px);
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login h2 {
+          font-size: clamp(2.76rem, 3.48vw, 3.86rem);
+          line-height: 1.02;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__copy {
+          gap: clamp(8px, 1.05vh, 13px);
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__lead {
+          font-size: 0.96rem;
+          line-height: 1.4;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__allows {
+          font-size: 0.94rem;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature {
+          grid-template-columns: 43px minmax(0, 1fr);
+          gap: 13px;
+          padding: 6px 0;
+          font-size: 0.96rem;
+          line-height: 1.25;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature-icon {
+          width: 43px;
+          height: 43px;
+          border-radius: 12px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature img {
+          width: 31px;
+          height: 31px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature:first-child img {
+          width: 28px;
+          height: 28px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__visual {
+          min-height: clamp(300px, 75vh, 585px);
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__visual img {
+          width: min(138%, 650px);
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__actions {
+          gap: 12px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__button,
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__back {
+          min-height: 50px;
+          padding-left: 20px;
+          padding-right: 20px;
+        }
+      }
+
+      @media (min-width: 861px) and (max-height: 620px) {
+        .hf-models-page:not(.hf-article-login-page) {
+          padding-top: clamp(6px, 1.15vw, 12px);
+          padding-bottom: clamp(6px, 1.15vw, 12px);
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login {
+          min-height: min(506px, calc(100dvh - clamp(12px, 2.3vw, 22px)));
+          padding-top: clamp(8px, 1vw, 12px);
+          padding-bottom: clamp(8px, 1vw, 12px);
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login h2 {
+          font-size: clamp(2.56rem, 3.25vw, 3.24rem);
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__copy {
+          gap: clamp(7px, 0.95vh, 10px);
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__lead {
+          line-height: 1.34;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature {
+          grid-template-columns: 40px minmax(0, 1fr);
+          gap: 12px;
+          padding: 4px 0;
+          font-size: 0.93rem;
+          line-height: 1.22;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature-icon {
+          width: 40px;
+          height: 40px;
+          border-radius: 11px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature img {
+          width: 29px;
+          height: 29px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature:first-child img {
+          width: 26px;
+          height: 26px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__visual {
+          min-height: clamp(245px, 62vh, 500px);
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__visual img {
+          width: min(132%, 610px);
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__button,
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__back {
+          min-height: 48px;
+        }
+      }
+
+      .hf-models-dashboard {
+        --hf-models-column-title-sticky-top: max(12px, env(safe-area-inset-top));
+        display: grid;
+        gap: 22px;
+        padding: clamp(18px, 4vw, 32px);
+      }
+
+      .hf-models-dashboard__top {
+        display: flex;
+        align-items: start;
+        justify-content: space-between;
+        gap: 18px;
+      }
+
+      .hf-models-dashboard__heading {
+        display: grid;
+        gap: 14px;
+      }
+
+      /* org pills opposite the dashboard title: load an org's public
+         non-gated models on demand, unload with the x */
+      .hf-models-dashboard__orgs {
+        margin-left: auto;
+        display: grid;
+        gap: 8px;
+        justify-items: end;
+        align-self: start;
+        max-width: min(46vw, 560px);
+      }
+      .hf-org-row {
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+        flex-wrap: wrap;
+        gap: 7px;
+      }
+      .hf-org-row__label {
+        color: var(--muted);
+        font-size: 12px;
+        white-space: nowrap;
+      }
+      .hf-org-pill {
+        display: inline-flex;
+        align-items: center;
+        gap: 7px;
+        padding: 4px 11px 4px 5px;
+        border: 1px solid var(--stroke);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.04);
+        color: var(--muted-strong);
+        font: 600 12.5px "Inter", sans-serif;
+        cursor: pointer;
+        transition: border-color 140ms ease, color 140ms ease, background 140ms ease;
+      }
+      .hf-org-pill:hover {
+        border-color: var(--stroke-strong);
+        color: var(--text);
+        background: rgba(255, 255, 255, 0.07);
+      }
+      .hf-org-pill img {
+        width: 20px;
+        height: 20px;
+        border-radius: 6px;
+        object-fit: cover;
+        background: #fff;
+      }
+      .hf-org-pill.is-loaded {
+        border-color: rgba(156, 255, 99, 0.35);
+        color: var(--text);
+      }
+      .hf-org-pill__x {
+        margin-left: 2px;
+        color: var(--muted);
+        font-size: 13px;
+        line-height: 1;
+      }
+      .hf-org-pill.is-loaded:hover .hf-org-pill__x { color: var(--red, #ff7a7a); }
+
+      .hf-models-dashboard__stats {
+        display: flex;
+        align-self: start;
+        flex-wrap: wrap;
+        gap: 9px;
+        align-items: center;
+      }
+
+      .hf-models-dashboard__stat {
+        display: inline-grid;
+        grid-template-columns: auto 1fr;
+        align-items: center;
+        gap: 8px;
+        min-height: 42px;
+        padding: 0 13px;
+        border: 1px solid rgba(136, 215, 255, 0.14);
+        border-radius: 999px;
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
+          rgba(4, 11, 20, 0.72);
+        color: rgba(223, 247, 255, 0.78);
+        font: inherit;
+        font-size: 0.82rem;
+        font-weight: 760;
+        cursor: pointer;
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.06),
+          0 12px 28px rgba(0, 0, 0, 0.16);
+      }
+
+      .hf-models-dashboard__stat[hidden] {
+        display: none;
+      }
+
+      .hf-models-dashboard__stat:hover,
+      .hf-models-dashboard__stat:focus-visible {
+        border-color: rgba(136, 215, 255, 0.28);
+        color: rgba(235, 248, 255, 0.96);
+        outline: none;
+      }
+
+      .hf-models-dashboard__stat-count {
+        display: inline-grid;
+        place-items: center;
+        min-width: 28px;
+        min-height: 28px;
+        padding: 0 8px;
+        border-radius: 999px;
+        background: rgba(156, 255, 99, 0.13);
+        color: rgba(229, 255, 214, 0.96);
+        font-size: 0.88rem;
+        font-weight: 860;
+        box-shadow: inset 0 0 0 1px rgba(156, 255, 99, 0.16);
+      }
+
+      .hf-models-dashboard__user {
+        display: flex;
+        align-items: center;
+        justify-content: end;
+        gap: 12px;
+        min-width: 0;
+        color: rgba(197, 208, 227, 0.72);
+        font-weight: 700;
+        text-align: left;
+      }
+
+      .hf-models-dashboard__user span {
+        min-width: 0;
+        overflow-wrap: anywhere;
+      }
+
+      .hf-models-dashboard__identity {
+        display: grid;
+        justify-items: start;
+        gap: 7px;
+        min-width: 0;
+      }
+
+      .hf-models-dashboard__name {
+        color: rgba(235, 248, 255, 0.88);
+      }
+
+      .hf-models-dashboard__avatar {
+        width: 44px;
+        height: 44px;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.08);
+        object-fit: cover;
+        border: 1.5px solid rgba(235, 248, 255, 0.82);
+        box-shadow:
+          0 10px 24px rgba(0, 0, 0, 0.24),
+          0 0 0 5px rgba(136, 215, 255, 0.07);
+      }
+
+      .hf-models-dashboard__org-list {
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: flex-start;
+        gap: 7px;
+        min-width: 0;
+        max-width: 100%;
+      }
+
+      .hf-models-dashboard__org-chip {
+        display: inline-flex;
+        align-items: center;
+        gap: 6px;
+        min-height: 0;
+        min-width: 0;
+        max-width: 100%;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        color: rgba(235, 248, 255, 0.82);
+        padding: 0;
+        font-size: 0.82rem;
+        overflow-wrap: anywhere;
+      }
+
+      .hf-models-dashboard__org-avatar {
+        width: 22px;
+        height: 22px;
+        flex: 0 0 auto;
+        border: 1px solid rgba(235, 248, 255, 0.62);
+        border-radius: 6px;
+        background: rgba(255, 255, 255, 0.1);
+        object-fit: cover;
+        box-shadow: 0 0 0 3px rgba(136, 215, 255, 0.07);
+      }
+
+      .hf-models-dashboard__org-chip--detected {
+        color: rgba(235, 248, 255, 0.82);
+      }
+
+      .hf-models-dashboard__org-chip button {
+        border: 0;
+        background: transparent;
+        color: inherit;
+        cursor: pointer;
+        font: inherit;
+        padding: 0;
+      }
+
+      .hf-models-dashboard__columns {
+        display: grid;
+        grid-template-columns: repeat(4, minmax(0, 1fr));
+        gap: 16px;
+      }
+
+      .hf-models-dashboard__bookmarks {
+        display: grid;
+        gap: 12px;
+      }
+
+      .hf-models-dashboard__bookmarks .hf-models-column {
+        min-height: 0;
+        background:
+          radial-gradient(circle at 12% 0%, rgba(156, 255, 99, 0.09), transparent 42%),
+          rgba(255, 255, 255, 0.035);
+      }
+
+      .hf-models-dashboard__bookmarks[hidden] {
+        display: none;
+      }
+
+      .hf-bookmarks-page {
+        display: grid;
+        gap: 22px;
+        padding: clamp(18px, 4vw, 32px);
+      }
+
+      .hf-bookmarks-page[hidden] {
+        display: none;
+      }
+
+      .hf-bookmarks-page__top {
+        display: flex;
+        align-items: start;
+        justify-content: space-between;
+        gap: 18px;
+      }
+
+      .hf-bookmarks-page__heading {
+        display: grid;
+        gap: 14px;
+      }
+
+      .hf-bookmarks-page__heading h2 {
+        margin: 0;
+        color: rgba(235, 248, 255, 0.96);
+        font-size: clamp(2rem, 4.5vw, 4.2rem);
+        line-height: 0.96;
+        letter-spacing: -0.07em;
+      }
+
+      .hf-bookmarks-page__intro {
+        margin: 0;
+        color: rgba(197, 208, 227, 0.72);
+        font-size: 1rem;
+        line-height: 1.6;
+      }
+
+      .hf-bookmarks-grid {
+        position: relative;
+        min-height: 220px;
+      }
+
+      .hf-bookmarks-grid .hf-model-card {
+        position: absolute;
+        top: 0;
+        left: 0;
+        will-change: transform;
+      }
+
+      .hf-models-column {
+        display: grid;
+        align-content: start;
+        gap: 12px;
+        min-height: 240px;
+        padding: 14px;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 24px;
+        background: rgba(255, 255, 255, 0.035);
+      }
+
+      .hf-models-column[hidden] {
+        display: none;
+      }
+
+      .hf-models-column h3 {
+        position: sticky;
+        top: var(--hf-models-column-title-sticky-top, 12px);
+        z-index: 9;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 10px;
+        width: 100%;
+        box-sizing: border-box;
+        margin: -4px 0 0;
+        padding: 9px 11px;
+        border: 1px solid rgba(136, 215, 255, 0.13);
+        border-radius: 16px;
+        background:
+          radial-gradient(circle at 12% 0%, rgba(156, 255, 99, 0.08), transparent 42%),
+          linear-gradient(180deg, rgba(7, 14, 25, 0.94), rgba(4, 9, 17, 0.82));
+        backdrop-filter: blur(18px);
+        box-shadow:
+          0 14px 32px rgba(0, 0, 0, 0.22),
+          inset 0 1px 0 rgba(255, 255, 255, 0.06);
+        color: var(--text);
+        font-size: 1rem;
+        letter-spacing: -0.02em;
+      }
+
+      .hf-models-column__intro {
+        margin: -2px 0 0;
+        color: rgba(197, 208, 227, 0.62);
+        font-size: 0.88rem;
+        line-height: 1.45;
+      }
+
+      .hf-models-column__list {
+        display: grid;
+        gap: 10px;
+        container: hf-model-card-list / inline-size;
+      }
+
+      .hf-models-column__list--bookmarks {
+        grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
+        align-items: stretch;
+      }
+
+      .hf-models-empty {
+        padding: 14px;
+        border: 1px dashed rgba(197, 208, 227, 0.18);
+        border-radius: 18px;
+        color: rgba(197, 208, 227, 0.58);
+        font-size: 0.92rem;
+        line-height: 1.5;
+      }
+
+      .hf-model-card {
+        display: grid;
+        gap: 10px;
+        padding: 12px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        border-radius: 18px;
+        background: rgba(4, 9, 17, 0.68);
+        transform-origin: top left;
+      }
+
+      @media (prefers-reduced-motion: reduce) {
+        .hf-models-dashboard__columns {
+          transition: none;
+        }
+      }
+
+      .hf-model-card__repo {
+        color: var(--text);
+        font-size: 0.94rem;
+        font-weight: 800;
+        letter-spacing: -0.02em;
+        overflow-wrap: anywhere;
+      }
+
+      .hf-model-card__meta {
+        color: rgba(197, 208, 227, 0.58);
+        font-size: 0.82rem;
+      }
+
+      .hf-model-card__preview {
+        width: 100%;
+        height: clamp(176px, 20vw, 280px);
+        min-height: 116px;
+        max-height: 280px;
+        border-radius: 14px;
+        background: rgba(255, 255, 255, 0.04);
+        object-fit: contain;
+      }
+
+      .hf-model-card__preview-link {
+        display: block;
+        border-radius: 14px;
+        overflow: hidden;
+      }
+
+      .hf-model-card__preview-link:focus-visible {
+        outline: 2px solid rgba(136, 215, 255, 0.76);
+        outline-offset: 3px;
+      }
+
+      .hf-model-card__preview-link .hf-model-card__preview {
+        display: block;
+      }
+
+      .hf-model-card__actions {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .hf-model-card__showcase-chip {
+        display: inline-flex;
+        align-items: center;
+        gap: 7px;
+        width: fit-content;
+        padding: 3px 10px;
+        border: 1px solid rgba(255, 214, 91, 0.32);
+        border-radius: 999px;
+        background: rgba(255, 214, 91, 0.1);
+        color: rgba(255, 236, 179, 0.92);
+        font-size: 11px;
+        font-weight: 660;
+        letter-spacing: 0.02em;
+        line-height: 1.4;
+        white-space: nowrap;
+      }
+
+      .hf-model-card__showcase-chip::before {
+        content: "";
+        width: 6px;
+        height: 6px;
+        border-radius: 50%;
+        background: rgba(255, 214, 91, 0.8);
+      }
+
+      .hf-model-card__showcase-chip.is-live {
+        border-color: rgba(156, 255, 99, 0.34);
+        background: rgba(156, 255, 99, 0.1);
+        color: rgba(214, 255, 183, 0.95);
+      }
+
+      .hf-model-card__showcase-chip.is-live::before {
+        background: rgba(156, 255, 99, 0.85);
+      }
+
+      .hf-model-card__button {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: 8px;
+        min-height: 40px;
+        padding: 0 14px;
+        border: 1px solid rgba(136, 215, 255, 0.2);
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.08);
+        color: #dff7ff;
+        font: inherit;
+        font-weight: 760;
+        text-align: center;
+        text-decoration: none;
+        cursor: pointer;
+      }
+
+      @container hf-model-card-list (min-width: 360px) {
+        .hf-model-card[data-dashboard-bucket="ready"] {
+          grid-template-columns: minmax(0, 1fr) minmax(136px, 34%);
+          grid-template-areas:
+            "repo repo"
+            "meta meta"
+            "preview actions";
+          align-items: stretch;
+        }
+
+        .hf-model-card[data-dashboard-bucket="ready"] .hf-model-card__repo {
+          grid-area: repo;
+        }
+
+        .hf-model-card[data-dashboard-bucket="ready"] .hf-model-card__meta {
+          grid-area: meta;
+        }
+
+        .hf-model-card[data-dashboard-bucket="ready"] .hf-model-card__preview-link {
+          grid-area: preview;
+          display: flex;
+          min-width: 0;
+          min-height: clamp(190px, 20vw, 280px);
+        }
+
+        .hf-model-card[data-dashboard-bucket="ready"] .hf-model-card__actions {
+          grid-area: actions;
+          display: grid;
+          grid-template-columns: 1fr;
+          grid-auto-rows: max-content;
+          align-content: start;
+          align-self: start;
+          min-width: 0;
+        }
+
+        .hf-model-card[data-dashboard-bucket="ready"] .hf-model-card__button {
+          width: 100%;
+          min-height: 42px;
+          height: auto;
+          padding: 8px 10px;
+          flex-direction: row;
+          white-space: nowrap;
+        }
+      }
+
+      .hf-button-icon {
+        width: 16px;
+        height: 16px;
+        flex: 0 0 auto;
+      }
+
+      .hf-models-dashboard__button--primary {
+        width: 100%;
+        min-height: 64px;
+        border-color: rgba(156, 255, 99, 0.32);
+        background: linear-gradient(135deg, var(--lime), #baff82);
+        color: var(--ink);
+      }
+
+      .hf-models-dashboard__button--secondary {
+        width: 100%;
+        min-height: 58px;
+        border-color: rgba(255, 214, 91, 0.3);
+      }
+
+      .hf-feature-page {
+        position: relative;
+        z-index: 2;
+        height: 100vh;
+        height: 100dvh;
+        min-height: 680px;
+        padding: clamp(22px, 3.2vw, 42px) clamp(18px, 3vw, 46px);
+        overflow: hidden;
+        background:
+          radial-gradient(circle at 83% 0%, rgba(139, 255, 165, 0.16), transparent 34%),
+          radial-gradient(circle at 34% 5%, rgba(88, 80, 255, 0.2), transparent 38%),
+          radial-gradient(circle at 50% 120%, rgba(45, 118, 255, 0.15), transparent 44%),
+          linear-gradient(180deg, #040817 0%, #081120 48%, #020711 100%);
+        opacity: 1;
+      }
+
+      .hf-feature-page::before,
+      .hf-feature-page::after {
+        content: "";
+        position: absolute;
+        pointer-events: none;
+      }
+
+      .hf-feature-page::before {
+        inset: 0;
+        background:
+          linear-gradient(90deg, rgba(0, 0, 0, 0.28), transparent 28%, transparent 68%, rgba(0, 0, 0, 0.22)),
+          radial-gradient(circle at 50% 62%, rgba(136, 215, 255, 0.07), transparent 42%);
+        opacity: 0.9;
+      }
+
+      .hf-feature-page::after {
+        left: 6%;
+        right: 4%;
+        bottom: -18vh;
+        height: 44vh;
+        background:
+          radial-gradient(ellipse at 36% 0%, rgba(135, 176, 255, 0.2), transparent 52%),
+          radial-gradient(ellipse at 62% 5%, rgba(156, 255, 99, 0.11), transparent 48%);
+        filter: blur(28px);
+        opacity: 0.8;
+      }
+
+      .hf-feature-page[hidden] {
+        display: none;
+      }
+
+      .hf-feature-page.is-transition-overlay {
+        position: fixed;
+        inset: 0;
+        z-index: 40;
+        overflow: hidden;
+        animation: hf-feature-page-overlay-in 680ms cubic-bezier(0.2, 0.78, 0.2, 1) both;
+      }
+
+      .hf-feature-page.is-transition-prepared {
+        position: fixed;
+        inset: 0;
+        z-index: 40;
+        overflow: hidden;
+        opacity: 0;
+        animation: none;
+      }
+
+      .hf-feature-page.is-returning-dashboard-prepared,
+      .hf-feature-page.is-returning-dashboard {
+        position: fixed;
+        inset: 0;
+        z-index: 40;
+        overflow: hidden;
+        pointer-events: none;
+      }
+
+      .hf-feature-page.is-returning-dashboard {
+        animation: hf-feature-page-return-out 780ms cubic-bezier(0.2, 0.78, 0.2, 1) both;
+      }
+
+      .hf-feature-page.is-returning-dashboard-snapshot,
+      .hf-feature-page.is-returning-dashboard-snapshot.is-returning-dashboard {
+        position: fixed;
+        inset: 0;
+        z-index: 80;
+        overflow: hidden;
+        pointer-events: none;
+      }
+
+      .hf-feature-page.is-entering .hf-feature-preview-pane,
+      .hf-feature-page.is-entering .hf-feature-action-pane {
+        opacity: 0;
+        transform: translateY(16px);
+      }
+
+      .hf-feature-page.is-flying-card .hf-feature-preview-pane {
+        opacity: 1;
+        transform: none;
+        transition: none;
+      }
+
+      .hf-feature-shell {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) minmax(330px, 390px);
+        align-items: center;
+        gap: clamp(18px, 2.2vw, 36px);
+        width: min(1540px, 100%);
+        height: 100%;
+        min-height: 0;
+        margin: 0 auto;
+      }
+
+      .hf-feature-preview-pane,
+      .hf-feature-action-pane {
+        transition: opacity 340ms ease, transform 340ms ease;
+      }
+
+      .hf-feature-preview-pane {
+        position: relative;
+        display: grid;
+        justify-items: center;
+        align-content: center;
+        gap: 12px;
+        min-width: 0;
+        min-height: 0;
+        overflow: visible;
+        perspective: 1600px;
+        transform-style: preserve-3d;
+      }
+
+      .hf-feature-showcase-stage {
+        --hf-feature-stage-y-offset: 0px;
+        position: relative;
+        display: grid;
+        place-items: start center;
+        width: min(1040px, 100%);
+        height: clamp(540px, calc(100dvh - 132px), 668px);
+        min-height: 0;
+        margin-left: 0;
+        isolation: isolate;
+        perspective: 1650px;
+        transform: translateY(var(--hf-feature-stage-y-offset));
+        transform-style: preserve-3d;
+      }
+
+      .hf-feature-showcase-stage::before,
+      .hf-feature-showcase-stage::after {
+        content: "";
+        position: absolute;
+        pointer-events: none;
+      }
+
+      .hf-feature-showcase-stage::before {
+        left: 2%;
+        right: 2%;
+        bottom: 4px;
+        height: 270px;
+        border-radius: 50%;
+        background:
+          linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, 0.05) 18%, rgba(6, 14, 34, 0.1) 26%, transparent 54%),
+          radial-gradient(ellipse at 52% 22%, rgba(255, 255, 255, 0.36), transparent 10%),
+          radial-gradient(ellipse at 48% 32%, rgba(112, 178, 255, 0.29), transparent 39%),
+          radial-gradient(ellipse at 58% 43%, rgba(156, 255, 99, 0.14), transparent 47%),
+          radial-gradient(ellipse at 50% 70%, rgba(0, 7, 22, 0.66), transparent 66%);
+        filter: blur(24px);
+        opacity: 0.98;
+        transform: rotateX(69deg) translateY(38px);
+        transform-origin: center;
+        z-index: 0;
+      }
+
+      .hf-feature-showcase-stage::after {
+        left: 17%;
+        right: 17%;
+        bottom: 62px;
+        height: 138px;
+        border-radius: 999px;
+        background:
+          radial-gradient(ellipse at 44% 32%, rgba(239, 247, 255, 0.28), transparent 18%),
+          radial-gradient(ellipse at 49% 49%, rgba(4, 10, 24, 0.76), transparent 44%),
+          radial-gradient(ellipse at 56% 60%, rgba(84, 136, 210, 0.24), transparent 68%);
+        filter: blur(19px);
+        opacity: 0.74;
+        transform: rotateX(70deg) translateY(38px);
+        transform-origin: center;
+        z-index: 1;
+      }
+
+      .hf-feature-backdrop-cards {
+        position: absolute;
+        inset: 0;
+        z-index: 2;
+        pointer-events: none;
+        transform-style: preserve-3d;
+      }
+
+      .hf-feature-main-card-wrap {
+        --hf-feature-main-reflection-gap: -32px;
+        --hf-feature-main-reflection-width: 110%;
+        --hf-feature-main-card-y: 12.75px;
+        --hf-feature-card-projection-scale: 1.092715;
+        position: relative;
+        z-index: 8;
+        width: clamp(326px, 18.8vw, 347.5px);
+        overflow: visible;
+        transform: translateY(var(--hf-feature-main-card-y));
+        transform-style: flat;
+        transform-origin: center top;
+        animation: hf-feature-main-card-enter 980ms cubic-bezier(0.18, 0.84, 0.23, 1) 120ms both;
+      }
+
+      .hf-feature-main-card-wrap.is-entered,
+      .hf-feature-page.has-flight-complete .hf-feature-main-card-wrap {
+        animation: none;
+        filter: none !important;
+        opacity: 1;
+        transform: translateY(var(--hf-feature-main-card-y));
+        transform-style: flat;
+      }
+
+      .hf-feature-main-card-wrap.is-entered .hf-feature-showcase-card,
+      .hf-feature-main-card-wrap.is-entered .hf-feature-card-target,
+      .hf-feature-main-card-wrap.is-entered .hf-feature-card-target .community-card__viewer,
+      .hf-feature-page.has-flight-complete .hf-feature-showcase-card,
+      .hf-feature-page.has-flight-complete .hf-feature-card-target,
+      .hf-feature-page.has-flight-complete .hf-feature-card-target .community-card__viewer {
+        filter: none !important;
+        opacity: 1;
+      }
+
+
+      .hf-feature-main-card-wrap::before,
+      .hf-feature-main-card-wrap::after {
+        content: "";
+        position: absolute;
+        pointer-events: none;
+        transform-origin: center;
+      }
+
+      .hf-feature-main-card-wrap::before {
+        left: -18%;
+        right: -18%;
+        bottom: -52px;
+        height: 136px;
+        border-radius: 50%;
+        background:
+          radial-gradient(ellipse at 50% 28%, rgba(255, 255, 255, 0.2), transparent 14%),
+          radial-gradient(ellipse at 50% 43%, rgba(0, 3, 12, 0.66), transparent 42%),
+          radial-gradient(ellipse at 52% 66%, rgba(78, 132, 206, 0.24), transparent 70%);
+        filter: blur(22px);
+        opacity: 0.94;
+        transform: rotateX(72deg) translateZ(-30px);
+        z-index: -1;
+      }
+
+      .hf-feature-main-card-wrap::after {
+        left: 0;
+        right: 0;
+        bottom: -28px;
+        height: 46px;
+        border-radius: 999px;
+        background:
+          radial-gradient(ellipse at 50% 50%, rgba(238, 248, 255, 0.32), rgba(102, 158, 230, 0.14) 44%, transparent 74%);
+        filter: blur(11px);
+        opacity: 0.68;
+        transform: rotateX(72deg) translateZ(-22px);
+        z-index: -1;
+      }
+
+      .hf-feature-card-reflection {
+        position: absolute;
+        top: calc(100% + var(--hf-feature-main-reflection-gap));
+        left: calc((100% - var(--hf-feature-main-reflection-width)) / 2);
+        z-index: -2;
+        width: var(--hf-feature-main-reflection-width);
+        height: min(178px, 20vh);
+        overflow: hidden;
+        border-radius: 32px;
+        pointer-events: none;
+        opacity: 0.84;
+        mix-blend-mode: screen;
+        transform: none;
+        transform-origin: center top;
+        will-change: opacity, transform;
+        clip-path: inset(0 round 32px);
+        -webkit-mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.76) 0%,
+            rgba(0, 0, 0, 0.48) 14%,
+            rgba(0, 0, 0, 0.22) 36%,
+            rgba(0, 0, 0, 0.06) 62%,
+            transparent 92%
+          ),
+          linear-gradient(to right, transparent 0%, #000 6%, #000 94%, transparent 100%);
+        -webkit-mask-composite: source-in;
+        mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.76) 0%,
+            rgba(0, 0, 0, 0.48) 14%,
+            rgba(0, 0, 0, 0.22) 36%,
+            rgba(0, 0, 0, 0.06) 62%,
+            transparent 92%
+          ),
+          linear-gradient(to right, transparent 0%, #000 6%, #000 94%, transparent 100%);
+        mask-composite: intersect;
+      }
+
+      .hf-feature-card-reflection__inner {
+        position: absolute;
+        right: 0;
+        bottom: 100%;
+        left: 0;
+        transform: translateY(-1px) scaleX(1) scaleY(-1);
+        transform-origin: center bottom;
+        filter: blur(5.2px) saturate(0.74) brightness(0.78) contrast(0.92);
+        opacity: 0.88;
+        will-change: filter, opacity;
+        clip-path: inset(0 round 32px);
+      }
+
+      .hf-feature-card-reflection .community-card {
+        min-height: auto;
+        overflow: hidden;
+        border-radius: 32px;
+        clip-path: inset(0 round 32px);
+        border-color: rgba(184, 218, 255, 0.22);
+        background:
+          linear-gradient(180deg, rgba(215, 235, 255, 0.2), rgba(116, 166, 225, 0.08));
+        box-shadow: none;
+      }
+
+      .hf-feature-card-reflection .community-card__viewer {
+        filter: blur(1px) drop-shadow(0 22px 38px rgba(46, 112, 210, 0.18));
+      }
+
+      .hf-feature-card-reflection .community-card__embed,
+      .hf-feature-card-reflection .community-card__top,
+      .hf-feature-card-reflection .community-card__tabs,
+      .hf-feature-card-reflection .community-card__actions {
+        pointer-events: none;
+      }
+
+      .hf-feature-page.is-flying-card .hf-feature-main-card-wrap,
+      .hf-feature-page.has-flight-complete .hf-feature-main-card-wrap {
+        animation: none;
+        transform: translateY(var(--hf-feature-main-card-y));
+      }
+
+      .community-card.hf-feature-showcase-card {
+        --community-card-panel-height: calc(380px * var(--hf-feature-card-projection-scale));
+        --community-card-top-height: calc(54px * var(--hf-feature-card-projection-scale));
+        --community-card-summary-min-height: calc(63px * var(--hf-feature-card-projection-scale));
+        --community-card-embed-min-height: calc(176px * var(--hf-feature-card-projection-scale));
+        flex: 0 0 auto;
+        min-height: auto;
+      }
+
+      .hf-feature-showcase-card {
+        width: 100%;
+        min-height: auto;
+        flex: none;
+        transform-origin: center;
+      }
+
+      .hf-feature-showcase-card.community-card {
+        min-height: auto;
+        height: calc(426px * var(--hf-feature-card-projection-scale));
+        padding: calc(14px * var(--hf-feature-card-projection-scale));
+        border-radius: calc(24px * var(--hf-feature-card-projection-scale));
+      }
+
+      .hf-feature-showcase-card .community-card__top {
+        gap: calc(11px * var(--hf-feature-card-projection-scale));
+        padding-bottom: calc(14px * var(--hf-feature-card-projection-scale));
+      }
+
+      .hf-feature-showcase-card .community-card__avatar {
+        width: calc(38px * var(--hf-feature-card-projection-scale));
+        height: calc(38px * var(--hf-feature-card-projection-scale));
+        flex-basis: calc(38px * var(--hf-feature-card-projection-scale));
+        border-radius: 999px;
+      }
+
+      .hf-feature-showcase-card .community-card__repo {
+        font-size: clamp(
+          calc(1.06rem * var(--hf-feature-card-projection-scale)),
+          calc(1.25vw * var(--hf-feature-card-projection-scale)),
+          calc(1.26rem * var(--hf-feature-card-projection-scale))
+        );
+      }
+
+      .hf-feature-showcase-card .community-card__tabs {
+        gap: calc(18px * var(--hf-feature-card-projection-scale));
+        min-height: calc(38px * var(--hf-feature-card-projection-scale));
+        font-size: calc(0.82rem * var(--hf-feature-card-projection-scale));
+      }
+
+      .hf-feature-showcase-card .community-card__summary {
+        display: -webkit-box;
+        flex: 0 0 auto;
+        min-height: var(--community-card-summary-min-height);
+        height: var(--community-card-summary-min-height);
+        max-height: calc(84px * var(--hf-feature-card-projection-scale));
+        overflow: hidden;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 3;
+        padding: calc(10px * var(--hf-feature-card-projection-scale)) 0
+          calc(12px * var(--hf-feature-card-projection-scale));
+        font-size: calc(0.86rem * var(--hf-feature-card-projection-scale));
+        line-height: 1.48;
+      }
+
+      .hf-feature-showcase-card .community-card__model {
+        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
+      }
+
+      .hf-feature-showcase-card .community-card__embed {
+        flex: 1 1 var(--community-card-embed-min-height);
+        min-height: var(--community-card-embed-min-height);
+        height: auto;
+        padding: calc(8px * var(--hf-feature-card-projection-scale));
+        border-radius: calc(16px * var(--hf-feature-card-projection-scale));
+        clip-path: inset(0 round calc(16px * var(--hf-feature-card-projection-scale)));
+      }
+
+      .hf-feature-showcase-card .community-card__embed .community-card__viewer {
+        border-radius: calc(14px * var(--hf-feature-card-projection-scale));
+        clip-path: inset(0 round calc(14px * var(--hf-feature-card-projection-scale)));
+      }
+
+      .hf-feature-showcase-card .community-card__embed[data-embed-style="summary-card"] .community-card__viewer {
+        aspect-ratio: 1200 / 630;
+        height: auto;
+        max-height: 100%;
+        object-fit: cover;
+      }
+
+      .hf-feature-showcase-card .community-card__actions {
+        gap: calc(12px * var(--hf-feature-card-projection-scale));
+        margin-top: calc(10px * var(--hf-feature-card-projection-scale));
+      }
+
+      .hf-feature-showcase-card .community-card__link {
+        font-size: calc(0.78rem * var(--hf-feature-card-projection-scale));
+      }
+
+      .hf-feature-page.is-flying-card .hf-feature-showcase-card {
+        transition: none;
+      }
+
+      .hf-feature-showcase-card .community-card__panel {
+        height: var(--community-card-panel-height);
+        min-height: 0;
+        overflow: hidden;
+      }
+
+      .hf-feature-showcase-card .community-card__panel--model {
+        flex: 1 1 auto;
+        height: auto;
+        min-height: 0;
+        overflow: visible;
+      }
+
+      .hf-feature-showcase-card .community-card__summary {
+        min-height: var(--community-card-summary-min-height);
+      }
+
+      .hf-feature-card-target {
+        flex: 1 1 var(--community-card-embed-min-height);
+        width: 100%;
+        min-height: var(--community-card-embed-min-height);
+      }
+
+      .hf-feature-card-target.is-flying-destination .community-card__viewer {
+        visibility: hidden;
+      }
+
+      .hf-feature-granularity .viewer-granularity__slider {
+        width: clamp(132px, 16vw, 188px);
+        height: 28px;
+        cursor: pointer;
+        touch-action: none;
+      }
+
+      .hf-feature-card-target.is-loading {
+        position: relative;
+      }
+
+      .hf-feature-card-target.is-loading::after {
+        content: "Loading card...";
+        position: absolute;
+        inset: 0;
+        display: grid;
+        place-items: center;
+        color: #64748b;
+        font-size: 0.82rem;
+        font-weight: 700;
+        background: rgba(248, 250, 252, 0.82);
+      }
+
+      .hf-feature-backdrop-card {
+        --x: 0px;
+        --y: 0px;
+        --z: -260px;
+        --rot-y: 0deg;
+        --rot-z: 0deg;
+        --scale: 0.72;
+        --opacity: 1;
+        --reflection-stack: 1;
+        --reflection-brightness: 0.74;
+        --reflection-y-offset: 4px;
+        --reflection-local-top: 404px;
+        --reflection-gap: 0px;
+        --reflection-height: 178px;
+        --reflection-spread: 32px;
+        --reflection-clip-left: 0%;
+        --reflection-clip-right: 0%;
+        --reflection-scale-y: -0.42;
+        --reflection-blur-boost: 8.8px;
+        --brightness: 0.82;
+        --saturate: 0.84;
+        --card-bg-top: #10233b;
+        --card-bg-bottom: #09182b;
+        --ambient-wash: rgba(86, 132, 196, 0.16);
+        --ambient-edge: rgba(5, 12, 28, 0.4);
+        --floor-wash: #081323;
+        --veil-top: 0.1;
+        --veil-mid: 0.24;
+        --veil-bottom: 0.62;
+        --blur: 0.6px;
+        --delay: 0ms;
+        --stack: 2;
+        position: absolute;
+        left: 50%;
+        top: 54px;
+        width: var(--card-width, 206px);
+        height: var(--card-height, 404px);
+        min-height: var(--card-height, 404px);
+        display: flex;
+        flex-direction: column;
+        box-sizing: border-box;
+        padding: 15px;
+        border: 1px solid rgba(130, 167, 211, 0.28);
+        border-radius: 19px;
+        background:
+          radial-gradient(circle at 50% 8%, var(--ambient-wash), transparent 42%),
+          linear-gradient(180deg, var(--card-bg-top), var(--card-bg-bottom));
+        color: rgba(231, 242, 255, 0.84);
+        box-shadow:
+          0 26px 80px rgba(0, 0, 0, 0.42),
+          inset 0 1px 0 rgba(255, 255, 255, 0.09);
+        opacity: var(--opacity);
+        filter: blur(var(--blur)) saturate(var(--saturate)) brightness(var(--brightness));
+        transform:
+          translateX(-50%)
+          translate3d(var(--x), var(--y), var(--z))
+          rotateY(var(--rot-y))
+          rotateZ(var(--rot-z))
+          scale(var(--scale-x, var(--scale)), var(--scale-y, var(--scale)));
+        transform-origin: center;
+        transform-style: preserve-3d;
+        overflow: hidden;
+        animation: hf-feature-backdrop-card-enter 1050ms cubic-bezier(0.18, 0.84, 0.23, 1) var(--delay) both;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card,
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-reflection {
+        --hf-feature-all-cycle-duration: var(--hf-feature-all-cycle-duration-active, 490ms);
+        --hf-feature-all-cycle-easing: var(--hf-feature-all-cycle-easing-active, cubic-bezier(0.25, 0.8, 0.25, 1));
+        animation: none;
+        transition:
+          filter var(--hf-feature-all-cycle-duration) var(--hf-feature-all-cycle-easing),
+          width var(--hf-feature-all-cycle-duration) var(--hf-feature-all-cycle-easing),
+          height var(--hf-feature-all-cycle-duration) var(--hf-feature-all-cycle-easing),
+          opacity var(--hf-feature-all-cycle-duration) var(--hf-feature-all-cycle-easing),
+          transform var(--hf-feature-all-cycle-duration) var(--hf-feature-all-cycle-easing),
+          box-shadow var(--hf-feature-all-cycle-duration) var(--hf-feature-all-cycle-easing),
+          border-color var(--hf-feature-all-cycle-duration) var(--hf-feature-all-cycle-easing);
+      }
+
+      .hf-feature-page.is-feature-all.is-feature-all-folding .hf-feature-backdrop-card {
+        animation: hf-feature-backdrop-card-enter 1050ms cubic-bezier(0.18, 0.84, 0.23, 1) var(--delay) both;
+        transition: none;
+      }
+
+      .hf-feature-page.is-feature-all.is-feature-all-folding .hf-feature-backdrop-reflection {
+        animation: hf-feature-backdrop-reflection-enter 1120ms cubic-bezier(0.18, 0.84, 0.23, 1) var(--delay) both;
+        transition: none;
+      }
+
+      .hf-feature-page.is-returning-dashboard .hf-feature-backdrop-card {
+        animation: hf-feature-backdrop-card-exit 680ms cubic-bezier(0.32, 0, 0.42, 1) calc(156ms - var(--delay)) both;
+        transition: none;
+      }
+
+      .hf-feature-page.is-returning-dashboard .hf-feature-backdrop-reflection {
+        animation: hf-feature-backdrop-reflection-exit 700ms cubic-bezier(0.32, 0, 0.42, 1) calc(156ms - var(--delay)) both;
+        transition: none;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__top,
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__avatar,
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__repo,
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__tabs,
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__summary,
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__embed,
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__actions {
+        transition: none;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-main-card-wrap {
+        visibility: hidden;
+        pointer-events: none;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-cards {
+        pointer-events: auto;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card:not(.hf-feature-backdrop-card--center),
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-reflection {
+        pointer-events: none;
+        --reflection-z-offset: 0px;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-reflection {
+        clip-path: inset(0 round 19px);
+        -webkit-mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.8) 0%,
+            rgba(0, 0, 0, 0.48) 14%,
+            rgba(0, 0, 0, 0.22) 36%,
+            rgba(0, 0, 0, 0.06) 62%,
+            transparent 92%
+          );
+        mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.8) 0%,
+            rgba(0, 0, 0, 0.48) 14%,
+            rgba(0, 0, 0, 0.22) 36%,
+            rgba(0, 0, 0, 0.06) 62%,
+            transparent 92%
+          );
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card--center:not(.hf-feature-backdrop-card--reflection-inner) {
+        cursor: pointer;
+        pointer-events: auto;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card {
+        padding: 17px;
+        border-radius: 25px;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__top {
+        gap: 12px;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__avatar {
+        width: 42px;
+        height: 42px;
+        flex-basis: 42px;
+        border-radius: 999px;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__repo {
+        font-size: 1.12rem;
+        letter-spacing: -0.03em;
+        line-height: 1.05;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__tabs {
+        gap: 20px;
+        padding-top: 16px;
+        font-size: 0.74rem;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__summary {
+        margin-top: 16px;
+        font-size: 0.94rem;
+        line-height: 1.42;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__embed {
+        margin-top: 16px;
+        padding: 10px;
+        border-radius: 17px;
+        overflow: visible;
+        clip-path: none;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-card__actions {
+        padding-top: 13px;
+        font-size: 0.78rem;
+      }
+
+      .hf-feature-backdrop-card--center {
+        padding: 17px;
+        border-radius: 25px;
+        border-color: rgba(226, 232, 240, 0.98);
+        box-shadow:
+          0 32px 92px rgba(0, 0, 0, 0.34),
+          inset 0 1px 0 rgba(255, 255, 255, 0.98);
+      }
+
+      .hf-feature-backdrop-card--center .hf-feature-backdrop-card__top {
+        gap: 12px;
+      }
+
+      .hf-feature-backdrop-card--center .hf-feature-backdrop-card__avatar {
+        width: 42px;
+        height: 42px;
+        flex-basis: 42px;
+        border-radius: 999px;
+      }
+
+      .hf-feature-backdrop-card--center .hf-feature-backdrop-card__repo {
+        font-size: 1.12rem;
+        letter-spacing: -0.03em;
+        line-height: 1.05;
+      }
+
+      .hf-feature-backdrop-card--center .hf-feature-backdrop-card__tabs {
+        gap: 20px;
+        padding-top: 16px;
+        font-size: 0.74rem;
+      }
+
+      .hf-feature-backdrop-card--center .hf-feature-backdrop-card__summary {
+        margin-top: 16px;
+        font-size: 0.94rem;
+        line-height: 1.42;
+      }
+
+      .hf-feature-backdrop-card--center .hf-feature-backdrop-card__embed {
+        margin-top: 16px;
+        padding: 10px;
+        border-radius: 17px;
+      }
+
+      .hf-feature-backdrop-card--center .hf-feature-backdrop-card__actions {
+        padding-top: 13px;
+        font-size: 0.78rem;
+      }
+
+      .hf-feature-backdrop-card--user {
+        border-color: rgba(226, 232, 240, 0.86);
+        background:
+          radial-gradient(circle at 50% 0%, rgba(136, 215, 255, 0.08), transparent 48%),
+          linear-gradient(180deg, #ffffff, #f4f8fc);
+        color: #172033;
+        box-shadow:
+          0 24px 76px rgba(0, 0, 0, 0.34),
+          inset 0 1px 0 rgba(255, 255, 255, 0.96);
+      }
+
+      .hf-feature-backdrop-card--user::after {
+        background:
+          linear-gradient(110deg, rgba(255, 255, 255, 0.48), transparent 30%, transparent 72%, rgba(136, 215, 255, 0.1)),
+          radial-gradient(ellipse at 50% 48%, transparent 42%, rgba(226, 232, 240, 0.42) 100%);
+      }
+
+      .hf-feature-backdrop-card--user .hf-feature-backdrop-card__top {
+        border-bottom-color: rgba(148, 163, 184, 0.22);
+      }
+
+      .hf-feature-backdrop-card--user .hf-feature-backdrop-card__avatar {
+        background: #eef2f7;
+        box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.08);
+      }
+
+      .hf-feature-backdrop-card--user .hf-feature-backdrop-card__repo {
+        color: #172033;
+      }
+
+      .hf-feature-backdrop-card--user .hf-feature-backdrop-card__tabs {
+        color: #6b7280;
+      }
+
+      .hf-feature-backdrop-card--user .hf-feature-backdrop-card__tabs span:first-child {
+        color: #1f2937;
+      }
+
+      .hf-feature-backdrop-card--user .hf-feature-backdrop-card__summary {
+        color: #4b5563;
+      }
+
+      .hf-feature-backdrop-card--user .hf-feature-backdrop-card__embed {
+        border-color: rgba(226, 232, 240, 0.9);
+        background:
+          radial-gradient(circle at 50% 0%, rgba(136, 215, 255, 0.1), transparent 52%),
+          linear-gradient(180deg, #f8fafc, #eef2f7);
+      }
+
+      .hf-feature-backdrop-card--user .hf-feature-backdrop-card__actions {
+        color: #334155;
+      }
+
+      .hf-feature-backdrop-card:not(.hf-feature-backdrop-card--reflection-inner) {
+        z-index: var(--stack);
+      }
+
+      .hf-feature-backdrop-card::after {
+        content: "";
+        position: absolute;
+        inset: 0;
+        border-radius: inherit;
+        background:
+          linear-gradient(110deg, rgba(255, 255, 255, 0.13), transparent 28%, transparent 72%, rgba(136, 215, 255, 0.08)),
+          radial-gradient(ellipse at 50% 48%, transparent 18%, var(--ambient-edge) 88%),
+          linear-gradient(
+            180deg,
+            rgba(7, 16, 33, var(--veil-top)) 0%,
+            rgba(8, 23, 37, var(--veil-mid)) 54%,
+            rgba(4, 12, 27, var(--veil-bottom)) 100%
+          );
+        pointer-events: none;
+      }
+
+      .hf-feature-backdrop-card.hf-feature-backdrop-card--user::after {
+        background:
+          linear-gradient(110deg, rgba(255, 255, 255, 0.48), transparent 30%, transparent 72%, rgba(136, 215, 255, 0.1)),
+          radial-gradient(ellipse at 50% 48%, transparent 42%, rgba(226, 232, 240, 0.42) 100%);
+      }
+
+      .hf-feature-page.is-feature-all
+        .hf-feature-backdrop-card.hf-feature-backdrop-card--center:not(.hf-feature-backdrop-card--reflection-inner)::after {
+        opacity: 0;
+      }
+
+      .hf-feature-page.is-feature-all
+        .hf-feature-backdrop-card.hf-feature-backdrop-card--center:not(.hf-feature-backdrop-card--reflection-inner)
+        :is(
+          .hf-feature-backdrop-card__top,
+          .hf-feature-backdrop-card__avatar,
+          .hf-feature-backdrop-card__repo,
+          .hf-feature-backdrop-card__tabs,
+          .hf-feature-backdrop-card__summary,
+          .hf-feature-backdrop-card__embed,
+          .hf-feature-backdrop-card__actions
+        ) {
+        opacity: 1;
+        filter: none;
+      }
+
+      .hf-feature-backdrop-reflection {
+        position: absolute;
+        left: 50%;
+        top: calc(54px + var(--reflection-local-top) + var(--reflection-gap));
+        z-index: var(--reflection-stack);
+        width: calc(var(--card-width, 206px) + var(--reflection-spread));
+        height: var(--reflection-height);
+        overflow: hidden;
+        border-radius: 19px;
+        pointer-events: none;
+        opacity: 0.76;
+        filter: blur(calc(var(--blur) + var(--reflection-blur-boost))) saturate(0.48) brightness(var(--reflection-brightness)) contrast(0.68);
+        mix-blend-mode: screen;
+        clip-path: inset(0 var(--reflection-clip-right) 0 var(--reflection-clip-left) round 19px);
+        -webkit-mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.76) 0%,
+            rgba(0, 0, 0, 0.48) 14%,
+            rgba(0, 0, 0, 0.22) 36%,
+            rgba(0, 0, 0, 0.06) 62%,
+            transparent 92%
+          ),
+          linear-gradient(to right, transparent 0%, #000 6%, #000 94%, transparent 100%);
+        -webkit-mask-composite: source-in;
+        mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.76) 0%,
+            rgba(0, 0, 0, 0.48) 14%,
+            rgba(0, 0, 0, 0.22) 36%,
+            rgba(0, 0, 0, 0.06) 62%,
+            transparent 92%
+          ),
+          linear-gradient(to right, transparent 0%, #000 6%, #000 94%, transparent 100%);
+        mask-composite: intersect;
+        transform:
+          translateX(-50%)
+          translate3d(var(--x), var(--y), calc(var(--z) + var(--reflection-z-offset, -24px)))
+          rotateY(var(--rot-y))
+          rotateZ(var(--rot-z))
+          scale(var(--scale-x, var(--scale)), var(--scale-y, var(--scale)));
+        transform-origin: center top;
+        animation: hf-feature-backdrop-reflection-enter 1120ms cubic-bezier(0.18, 0.84, 0.23, 1) var(--delay) both;
+      }
+
+      .hf-feature-backdrop-reflection::after {
+        content: "";
+        position: absolute;
+        inset: 0;
+        border-radius: inherit;
+        background:
+          linear-gradient(
+            180deg,
+            transparent 0%,
+            color-mix(in srgb, var(--floor-wash) 30%, transparent) 42%,
+            color-mix(in srgb, var(--floor-wash) 72%, transparent) 76%,
+            var(--floor-wash) 100%
+          );
+        opacity: 0.28;
+        pointer-events: none;
+      }
+
+      .hf-feature-backdrop-reflection .hf-feature-backdrop-card--reflection-inner {
+        position: absolute;
+        top: auto;
+        right: calc(var(--reflection-spread) / 2);
+        bottom: 100%;
+        left: calc(var(--reflection-spread) / 2);
+        z-index: auto;
+        width: auto;
+        opacity: 1;
+        border-color: rgba(154, 198, 247, 0.12);
+        box-shadow: none;
+        filter: none;
+        mix-blend-mode: normal;
+        clip-path: none;
+        mask-image: none;
+        -webkit-mask-image: none;
+        transform: translateY(-1px) scaleY(-1);
+        transform-origin: center bottom;
+        animation: none;
+      }
+
+      .hf-feature-backdrop-reflection--user {
+        opacity: 0.5;
+        mix-blend-mode: screen;
+        /* the user cards are WHITE - blurred they reflect as a uniform milky
+           slab whose box edges read as sharp cutoffs. Fade faster vertically
+           and wider at the sides so only the contact glow survives. */
+        -webkit-mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.6) 0%,
+            rgba(0, 0, 0, 0.3) 16%,
+            rgba(0, 0, 0, 0.12) 36%,
+            rgba(0, 0, 0, 0.03) 56%,
+            transparent 78%
+          ),
+          linear-gradient(to right, transparent 0%, #000 8%, #000 92%, transparent 100%);
+        -webkit-mask-composite: source-in;
+        mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.6) 0%,
+            rgba(0, 0, 0, 0.3) 16%,
+            rgba(0, 0, 0, 0.12) 36%,
+            rgba(0, 0, 0, 0.03) 56%,
+            transparent 78%
+          ),
+          linear-gradient(to right, transparent 0%, #000 8%, #000 92%, transparent 100%);
+        mask-composite: intersect;
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-reflection--user {
+        clip-path: inset(0 round 19px);
+        -webkit-mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.68) 0%,
+            rgba(0, 0, 0, 0.36) 16%,
+            rgba(0, 0, 0, 0.14) 38%,
+            rgba(0, 0, 0, 0.035) 58%,
+            transparent 80%
+          );
+        mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.68) 0%,
+            rgba(0, 0, 0, 0.36) 16%,
+            rgba(0, 0, 0, 0.14) 38%,
+            rgba(0, 0, 0, 0.035) 58%,
+            transparent 80%
+          );
+      }
+
+      .hf-feature-backdrop-reflection--user .hf-feature-backdrop-card--reflection-inner {
+        border-color: rgba(226, 232, 240, 0.14);
+        background:
+          radial-gradient(circle at 50% 0%, rgba(211, 231, 255, 0.1), transparent 48%),
+          linear-gradient(180deg, rgba(255, 255, 255, 0.4), rgba(203, 213, 225, 0.1));
+      }
+
+      .hf-feature-backdrop-reflection--center {
+        border-radius: 32px;
+        opacity: 0.84;
+        clip-path: inset(0 round 32px);
+      }
+
+      .hf-feature-page.is-feature-all .hf-feature-backdrop-reflection--center {
+        border-radius: 32px;
+        clip-path: inset(0 round 32px);
+        opacity: 0.84;
+        -webkit-mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.8) 0%,
+            rgba(0, 0, 0, 0.5) 14%,
+            rgba(0, 0, 0, 0.23) 36%,
+            rgba(0, 0, 0, 0.065) 62%,
+            transparent 92%
+          );
+        mask-image:
+          linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0.8) 0%,
+            rgba(0, 0, 0, 0.5) 14%,
+            rgba(0, 0, 0, 0.23) 36%,
+            rgba(0, 0, 0, 0.065) 62%,
+            transparent 92%
+          );
+      }
+
+      .hf-feature-backdrop-reflection--center .hf-feature-backdrop-card--reflection-inner {
+        border-radius: 25px;
+        clip-path: inset(0 round 25px);
+      }
+
+      .hf-feature-backdrop-card__top {
+        display: flex;
+        flex: 0 0 auto;
+        align-items: center;
+        gap: 8px;
+        min-width: 0;
+        padding-bottom: 12px;
+        border-bottom: 1px solid rgba(226, 232, 240, 0.12);
+      }
+
+      .hf-feature-backdrop-card__avatar {
+        width: 22px;
+        height: 22px;
+        flex: 0 0 22px;
+        border-radius: 999px;
+        object-fit: cover;
+        background: rgba(226, 232, 240, 0.18);
+        box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1);
+      }
+
+      .hf-feature-backdrop-card__repo {
+        display: -webkit-box;
+        min-width: 0;
+        overflow: hidden;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 2;
+        color: rgba(241, 246, 255, 0.78);
+        font-size: 0.86rem;
+        font-weight: 780;
+        line-height: 1.12;
+        overflow-wrap: anywhere;
+      }
+
+      .hf-feature-backdrop-card__owner {
+        color: rgba(171, 189, 218, 0.58);
+      }
+
+      .hf-feature-backdrop-card__tabs {
+        display: flex;
+        flex: 0 0 auto;
+        gap: 12px;
+        padding: 14px 0 10px;
+        border-bottom: 1px solid rgba(226, 232, 240, 0.1);
+        color: rgba(203, 213, 225, 0.58);
+        font-size: 0.58rem;
+        font-weight: 800;
+      }
+
+      .hf-feature-backdrop-card__tabs span:first-child {
+        position: relative;
+        color: rgba(255, 255, 255, 0.78);
+      }
+
+      .hf-feature-backdrop-card__tabs span:first-child::after {
+        content: "";
+        position: absolute;
+        left: 0;
+        right: 0;
+        bottom: -11px;
+        height: 2px;
+        border-radius: 999px;
+        background: #f7b627;
+      }
+
+      .hf-feature-backdrop-card__embed {
+        display: flex;
+        flex: 1 1 auto;
+        align-items: center;
+        justify-content: center;
+        min-height: 0;
+        height: auto;
+        margin-top: 10px;
+        padding: 8px;
+        overflow: hidden;
+        border: 1px solid rgba(136, 215, 255, 0.12);
+        border-radius: 14px;
+        background:
+          radial-gradient(circle at 50% 8%, rgba(136, 215, 255, 0.12), transparent 48%),
+          rgba(0, 0, 0, 0.24);
+        clip-path: inset(0 round 14px);
+      }
+
+      .hf-feature-backdrop-card__viewer {
+        display: block;
+        width: 100%;
+        height: 100%;
+        min-height: 0;
+        border-radius: 10px;
+        clip-path: inset(0 round 10px);
+        object-fit: contain;
+        filter: drop-shadow(0 14px 22px rgba(0, 0, 0, 0.36));
+      }
+
+      .hf-feature-backdrop-card__embed[data-embed-style="summary-card"] {
+        border-radius: 16px;
+        clip-path: inset(0 round 16px);
+      }
+
+      .hf-feature-backdrop-card__embed[data-embed-style="summary-card"] .hf-feature-backdrop-card__viewer {
+        aspect-ratio: 1200 / 630;
+        height: auto;
+        max-height: 100%;
+        border-radius: 14px;
+        clip-path: inset(0 round 14px);
+        object-fit: cover;
+      }
+
+      .hf-feature-backdrop-card__summary {
+        display: -webkit-box;
+        flex: 0 0 auto;
+        min-height: 0;
+        max-height: 68px;
+        margin: 12px 0 0;
+        overflow: hidden;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 3;
+        color: rgba(203, 213, 225, 0.62);
+        font-size: 0.72rem;
+        line-height: 1.55;
+      }
+
+      .hf-feature-backdrop-card__actions {
+        display: flex;
+        flex: 0 0 auto;
+        justify-content: space-between;
+        gap: 8px;
+        margin-top: 12px;
+        color: rgba(235, 248, 255, 0.72);
+        font-size: 0.58rem;
+        font-weight: 850;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .hf-feature-controls {
+        --hf-feature-controls-offset: 8px;
+        position: relative;
+        z-index: 12;
+        display: grid;
+        gap: 12px;
+        justify-self: center;
+        width: min(390px, 100%);
+        margin-top: var(--hf-feature-controls-offset);
+        margin-left: 0;
+        padding: 14px;
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 22px;
+        background:
+          radial-gradient(circle at 12% 0%, rgba(255, 214, 91, 0.13), transparent 40%),
+          rgba(4, 9, 17, 0.72);
+        box-shadow: 0 18px 42px rgba(0, 0, 0, 0.24);
+      }
+
+      .hf-feature-cycle-btn {
+        position: absolute;
+        top: 50%;
+        z-index: 14;
+        display: grid;
+        width: 46px;
+        height: 46px;
+        place-items: center;
+        border: 1px solid rgba(184, 218, 255, 0.24);
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.2), transparent 54%),
+          rgba(9, 18, 34, 0.62);
+        color: #f8fbff;
+        box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
+        cursor: pointer;
+        transform: translateY(-50%);
+        transition:
+          background 180ms ease,
+          border-color 180ms ease,
+          opacity 180ms ease,
+          transform 180ms ease;
+      }
+
+      .hf-feature-cycle-btn[hidden] {
+        display: none;
+      }
+
+      .hf-feature-cycle-btn:hover,
+      .hf-feature-cycle-btn:focus-visible {
+        border-color: rgba(184, 218, 255, 0.42);
+        background:
+          radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.28), transparent 54%),
+          rgba(16, 30, 52, 0.78);
+        outline: none;
+        transform: translateY(-50%) scale(1.04);
+      }
+
+      .hf-feature-cycle-btn span {
+        display: block;
+        font-size: 2.15rem;
+        font-weight: 760;
+        line-height: 0.7;
+        transform: translateY(-1px);
+      }
+
+      .hf-feature-cycle-btn--prev {
+        left: clamp(18px, 4vw, 70px);
+      }
+
+      .hf-feature-cycle-btn--next {
+        right: clamp(18px, 4vw, 70px);
+      }
+
+      .hf-feature-animated {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: 10px 16px;
+      }
+
+      .hf-feature-animated[hidden] {
+        display: none;
+      }
+
+      .hf-feature-animated__toggle {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        color: rgba(220, 228, 242, 0.9);
+        font-size: 0.9rem;
+        cursor: pointer;
+        user-select: none;
+      }
+
+      .hf-feature-focus {
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        flex: 1 1 220px;
+        min-width: 200px;
+        transition: opacity 140ms ease;
+      }
+
+      .hf-feature-focus.is-disabled {
+        opacity: 0.38;
+        pointer-events: none;
+      }
+
+      .hf-feature-focus__shell {
+        position: relative;
+        flex: 1 1 auto;
+      }
+
+      .hf-feature-focus__shell input {
+        width: 100%;
+        box-sizing: border-box;
+        padding: 7px 10px;
+        border: 1px solid rgba(255, 255, 255, 0.14);
+        border-radius: 10px;
+        background: rgba(0, 0, 0, 0.3);
+        color: #f5f8ff;
+        font: inherit;
+        font-size: 0.88rem;
+        outline: none;
+      }
+
+      .hf-feature-focus__shell input:focus {
+        border-color: rgba(136, 215, 255, 0.45);
+      }
+
+      .hf-feature-focus__search {
+        position: absolute;
+        z-index: 40;
+        top: calc(100% + 6px);
+        left: 0;
+        right: 0;
+        max-height: 230px;
+        overflow-y: auto;
+        padding: 6px;
+        border: 1px solid rgba(255, 255, 255, 0.14);
+        border-radius: 12px;
+        background: #0b1220;
+        box-shadow: 0 18px 42px rgba(0, 0, 0, 0.5);
+      }
+
+      .hf-feature-focus__item {
+        display: block;
+        width: 100%;
+        padding: 7px 9px;
+        border: 0;
+        border-radius: 8px;
+        background: transparent;
+        color: #dce4f2;
+        font: inherit;
+        font-size: 0.86rem;
+        text-align: left;
+        cursor: pointer;
+      }
+
+      .hf-feature-focus__item:hover,
+      .hf-feature-focus__item:focus {
+        background: rgba(136, 215, 255, 0.12);
+      }
+
+      .hf-feature-focus__hint {
+        margin-left: 8px;
+        color: rgba(197, 208, 227, 0.5);
+        font-size: 0.76rem;
+      }
+
+      .hf-feature-granularity.is-dimmed {
+        opacity: 0.38;
+        pointer-events: none;
+      }
+
+      .hf-feature-granularity {
+        display: grid;
+        grid-template-columns: auto minmax(0, 1fr) auto;
+        align-items: center;
+        gap: 10px;
+        min-width: 0;
+        color: rgba(235, 248, 255, 0.88);
+      }
+
+      .hf-feature-granularity[hidden] {
+        display: none;
+      }
+
+      .hf-feature-style {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        gap: 8px;
+        min-width: 0;
+        margin: 0;
+        padding: 0;
+        border: 0;
+      }
+
+      .hf-feature-style label {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: 8px;
+        min-height: 42px;
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.045);
+        color: rgba(235, 248, 255, 0.76);
+        font-size: 0.86rem;
+        font-weight: 760;
+        cursor: pointer;
+      }
+
+      .hf-feature-style label:has(input:checked) {
+        border-color: rgba(255, 214, 91, 0.42);
+        background: rgba(255, 214, 91, 0.14);
+        color: #fff4c2;
+      }
+
+      .hf-feature-style input {
+        width: 14px;
+        height: 14px;
+        accent-color: #ffd65b;
+      }
+
+      .hf-feature-tune-panel {
+        position: fixed;
+        right: 16px;
+        bottom: 66px;
+        z-index: 2147483000;
+        display: grid;
+        gap: 12px;
+        width: min(360px, calc(100vw - 32px));
+        max-height: min(720px, calc(100dvh - 32px));
+        padding: 14px;
+        overflow: auto;
+        border: 1px solid rgba(136, 215, 255, 0.22);
+        border-radius: 22px;
+        background:
+          radial-gradient(circle at 14% 0%, rgba(255, 214, 91, 0.12), transparent 38%),
+          linear-gradient(180deg, rgba(8, 18, 32, 0.96), rgba(3, 8, 17, 0.94));
+        color: rgba(235, 248, 255, 0.9);
+        box-shadow:
+          0 24px 80px rgba(0, 0, 0, 0.46),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        backdrop-filter: blur(18px);
+      }
+
+      .hf-feature-tune-panel[hidden] {
+        display: none;
+      }
+
+      .hf-feature-tune-toggle {
+        position: fixed;
+        top: 16px;
+        right: 392px;
+        z-index: 2147483001;
+        min-height: 38px;
+        padding: 0 14px;
+        border: 1px solid rgba(136, 215, 255, 0.24);
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 14% 0%, rgba(156, 255, 99, 0.16), transparent 46%),
+          rgba(5, 14, 25, 0.92);
+        color: rgba(235, 248, 255, 0.9);
+        font: inherit;
+        font-size: 0.74rem;
+        font-weight: 820;
+        cursor: pointer;
+        box-shadow:
+          0 14px 42px rgba(0, 0, 0, 0.42),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        backdrop-filter: blur(16px);
+      }
+
+      .hf-feature-tune-toggle[aria-expanded="false"] {
+        right: 16px;
+      }
+
+      .hf-feature-tune-toggle[hidden] {
+        display: none;
+      }
+
+      @media (max-width: 820px) {
+        .hf-feature-tune-toggle {
+          right: 16px;
+        }
+      }
+
+      .hf-feature-tune-panel__head {
+        display: flex;
+        align-items: start;
+        justify-content: space-between;
+        gap: 12px;
+      }
+
+      .hf-feature-tune-panel__head strong {
+        display: block;
+        color: #fff;
+        font-size: 0.94rem;
+        letter-spacing: -0.02em;
+      }
+
+      .hf-feature-tune-panel__head span {
+        display: block;
+        margin-top: 3px;
+        color: rgba(197, 208, 227, 0.58);
+        font-size: 0.72rem;
+        line-height: 1.35;
+      }
+
+      .hf-feature-tune-panel__actions {
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: end;
+        gap: 8px;
+      }
+
+      .hf-feature-tune-panel__actions button {
+        min-height: 30px;
+        padding: 0 10px;
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.08);
+        color: rgba(235, 248, 255, 0.86);
+        font: inherit;
+        font-size: 0.72rem;
+        font-weight: 780;
+        cursor: pointer;
+      }
+
+      .hf-feature-tune-panel__fields {
+        display: grid;
+        gap: 10px;
+      }
+
+      .hf-feature-tune-control {
+        display: grid;
+        gap: 6px;
+        padding: 10px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        border-radius: 16px;
+        background: rgba(255, 255, 255, 0.035);
+      }
+
+      .hf-feature-tune-control__top,
+      .hf-feature-tune-control__row {
+        display: grid;
+        align-items: center;
+        gap: 8px;
+      }
+
+      .hf-feature-tune-control__top {
+        grid-template-columns: minmax(0, 1fr) auto auto;
+      }
+
+      .hf-feature-tune-control__row {
+        grid-template-columns: minmax(0, 1fr) 78px;
+      }
+
+      .hf-feature-tune-control__top label {
+        color: rgba(235, 248, 255, 0.86);
+        font-size: 0.78rem;
+        font-weight: 760;
+      }
+
+      .hf-feature-tune-control__value {
+        color: #fff4c2;
+        font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+        font-size: 0.72rem;
+      }
+
+      .hf-feature-tune-control__reset {
+        min-height: 26px;
+        padding: 0 8px;
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.07);
+        color: rgba(235, 248, 255, 0.78);
+        font: inherit;
+        font-size: 0.68rem;
+        font-weight: 780;
+        cursor: pointer;
+      }
+
+      .hf-feature-tune-control__reset:disabled {
+        cursor: default;
+        opacity: 0.44;
+      }
+
+      .hf-feature-tune-control input[type="range"] {
+        width: 100%;
+        accent-color: var(--lime);
+      }
+
+      .hf-feature-tune-control input[type="number"] {
+        width: 100%;
+        min-height: 30px;
+        padding: 0 8px;
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 10px;
+        background: rgba(0, 0, 0, 0.22);
+        color: #fff;
+        font: inherit;
+        font-size: 0.76rem;
+      }
+
+      .hf-feature-tune-panel__hint {
+        margin: 0;
+        color: rgba(197, 208, 227, 0.52);
+        font-size: 0.72rem;
+        line-height: 1.38;
+      }
+
+      .hf-feature-action-pane {
+        position: relative;
+        display: grid;
+        align-content: start;
+        gap: 18px;
+        justify-self: start;
+        min-width: 0;
+        width: min(100%, 390px);
+        padding: clamp(20px, 2.4vw, 28px);
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 34px;
+        background:
+          radial-gradient(circle at 10% 0%, rgba(156, 255, 99, 0.14), transparent 30%),
+          radial-gradient(circle at 86% 0%, rgba(136, 215, 255, 0.11), transparent 36%),
+          linear-gradient(180deg, rgba(10, 21, 36, 0.82), rgba(4, 10, 20, 0.9));
+        backdrop-filter: blur(20px);
+        box-shadow:
+          0 36px 110px rgba(0, 0, 0, 0.42),
+          inset 0 1px 0 rgba(255, 255, 255, 0.1);
+        overflow: hidden;
+      }
+
+      .hf-feature-action-pane::before {
+        content: "";
+        position: absolute;
+        inset: 1px;
+        border-radius: 33px;
+        background:
+          linear-gradient(135deg, rgba(255, 255, 255, 0.07), transparent 28%, transparent 72%, rgba(136, 215, 255, 0.04));
+        pointer-events: none;
+      }
+
+      .hf-feature-back {
+        position: relative;
+        z-index: 1;
+        justify-self: start;
+        min-height: 40px;
+        padding: 0 14px;
+        border: 1px solid rgba(197, 208, 227, 0.12);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.045);
+        color: rgba(197, 208, 227, 0.72);
+        font: inherit;
+        font-size: 0.86rem;
+        font-weight: 720;
+        cursor: pointer;
+      }
+
+      .hf-feature-action-copy {
+        position: relative;
+        z-index: 1;
+        display: grid;
+        gap: 16px;
+        transition: gap 260ms ease;
+      }
+
+      .hf-feature-action-copy .eyebrow {
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        width: 100%;
+        min-height: 38px;
+        padding: 0 18px;
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.045);
+        color: rgba(235, 248, 255, 0.84);
+        letter-spacing: 0.2em;
+      }
+
+      .hf-feature-action-copy .eyebrow::before {
+        content: "";
+        width: 11px;
+        height: 11px;
+        border-radius: 999px;
+        background: #9cff63;
+        box-shadow:
+          0 0 0 5px rgba(156, 255, 99, 0.12),
+          0 0 22px rgba(156, 255, 99, 0.7);
+      }
+
+      .hf-feature-action-copy h2 {
+        margin: 0;
+        color: #ffffff;
+        max-width: 390px;
+        font-size: clamp(3.1rem, 4.1vw, 5rem);
+        line-height: 0.86;
+        letter-spacing: -0.095em;
+        text-shadow:
+          0 1px 0 rgba(255, 255, 255, 0.36),
+          0 24px 46px rgba(0, 0, 0, 0.35);
+      }
+
+      .hf-feature-action-copy h2 span {
+        display: block;
+      }
+
+      .hf-feature-action-copy p,
+      .hf-feature-manual-panel p,
+      .hf-feature-readme-preview p,
+      .hf-feature-feedback {
+        margin: 0;
+        color: rgba(197, 208, 227, 0.74);
+        font-size: 1rem;
+        line-height: 1.65;
+      }
+
+      .hf-feature-action-copy p a {
+        color: rgba(224, 247, 255, 0.96);
+        font-weight: 760;
+        text-decoration-color: rgba(136, 215, 255, 0.46);
+        text-underline-offset: 0.18em;
+      }
+
+      .hf-feature-action-copy p a:hover,
+      .hf-feature-action-copy p a:focus-visible {
+        color: #ffffff;
+        text-decoration-color: rgba(156, 255, 99, 0.72);
+      }
+
+      .hf-feature-action-copy p {
+        max-height: 8rem;
+        overflow: hidden;
+        opacity: 1;
+        transform: translateY(0);
+        transition:
+          max-height 280ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          opacity 180ms ease,
+          transform 240ms ease;
+      }
+
+      .hf-feature-action-pane.is-manual-open .hf-feature-action-copy {
+        gap: 10px;
+      }
+
+      .hf-feature-action-pane.is-manual-open .hf-feature-action-copy p,
+      #hf-feature-action-description.is-manual-collapsed {
+        max-height: 0;
+        opacity: 0;
+        transform: translateY(-6px);
+        pointer-events: none;
+      }
+
+      .hf-feature-action-grid {
+        position: relative;
+        z-index: 1;
+        display: flex;
+        flex-wrap: wrap;
+        align-items: flex-start;
+        gap: 12px;
+        transition: gap 260ms cubic-bezier(0.2, 0.78, 0.2, 1);
+      }
+
+      .hf-feature-action {
+        position: relative;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: 9px;
+        min-height: 50px;
+        padding: 0 18px;
+        border: 1px solid rgba(136, 215, 255, 0.2);
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.08);
+        color: #dff7ff;
+        font: inherit;
+        font-weight: 780;
+        text-decoration: none;
+        cursor: pointer;
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
+        transform: translateY(0) scale(1);
+        transition:
+          transform 160ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          border-color 160ms ease,
+          background 160ms ease,
+          box-shadow 160ms ease,
+          color 160ms ease;
+      }
+
+      .hf-feature-action-label {
+        min-width: 0;
+      }
+
+      .hf-feature-action--primary {
+        border-color: rgba(156, 255, 99, 0.34);
+        background: linear-gradient(135deg, var(--lime), #baff82);
+        color: var(--ink);
+        box-shadow:
+          0 14px 34px rgba(156, 255, 99, 0.2),
+          inset 0 1px 0 rgba(255, 255, 255, 0.48);
+      }
+
+      .hf-feature-action--manual {
+        border-color: rgba(255, 214, 91, 0.34);
+        background: rgba(255, 214, 91, 0.08);
+        color: #fff4c2;
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
+      }
+
+      #hf-feature-manual-btn {
+        max-width: 320px;
+        max-height: 58px;
+        overflow: hidden;
+        white-space: nowrap;
+        transition:
+          max-width 300ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          max-height 300ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          min-height 300ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          padding 300ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          border-width 220ms ease,
+          border-color 180ms ease,
+          background 180ms ease,
+          box-shadow 180ms ease,
+          color 180ms ease,
+          opacity 180ms ease,
+          transform 220ms cubic-bezier(0.2, 0.78, 0.2, 1);
+      }
+
+      .hf-feature-action-pane.is-manual-open .hf-feature-action-grid {
+        gap: 12px;
+      }
+
+      .hf-feature-action-pane.is-manual-open #hf-feature-manual-btn {
+        max-width: 0;
+        max-height: 0;
+        min-height: 0;
+        padding: 0;
+        border-width: 0;
+        border-color: transparent;
+        background: transparent;
+        box-shadow: none;
+        opacity: 0;
+        transform: translateY(-6px) scale(0.96);
+        pointer-events: none;
+      }
+
+      .hf-feature-action-pane.is-manual-open #hf-feature-auto-btn {
+        margin-top: 10px;
+      }
+
+      .hf-feature-action--copy {
+        border-color: rgba(136, 215, 255, 0.28);
+        background: rgba(136, 215, 255, 0.1);
+        color: #e7fbff;
+      }
+
+      .hf-feature-action:hover:not(:disabled),
+      .hf-feature-action:focus-visible:not(:disabled) {
+        transform: translateY(-1px) scale(1.01);
+        border-color: rgba(224, 247, 255, 0.45);
+        box-shadow:
+          0 13px 28px rgba(0, 0, 0, 0.28),
+          inset 0 1px 0 rgba(255, 255, 255, 0.22);
+        outline: none;
+      }
+
+      .hf-feature-action--primary:hover:not(:disabled),
+      .hf-feature-action--primary:focus-visible:not(:disabled) {
+        border-color: rgba(231, 255, 199, 0.72);
+        background: linear-gradient(135deg, #b9ff7a, #ddffbc);
+        box-shadow:
+          0 18px 38px rgba(156, 255, 99, 0.26),
+          inset 0 1px 0 rgba(255, 255, 255, 0.56);
+      }
+
+      .hf-feature-action--manual:hover:not(:disabled),
+      .hf-feature-action--manual:focus-visible:not(:disabled) {
+        border-color: rgba(255, 230, 137, 0.58);
+        background: rgba(255, 214, 91, 0.14);
+        color: #fff8d9;
+      }
+
+      .hf-feature-action--copy:hover:not(:disabled),
+      .hf-feature-action--copy:focus-visible:not(:disabled) {
+        border-color: rgba(136, 215, 255, 0.54);
+        background: rgba(136, 215, 255, 0.16);
+        color: #ffffff;
+      }
+
+      .hf-feature-action:active:not(:disabled) {
+        transform: translateY(1px) scale(0.985);
+        box-shadow:
+          0 7px 16px rgba(0, 0, 0, 0.2),
+          inset 0 1px 0 rgba(255, 255, 255, 0.14);
+      }
+
+      .hf-feature-action:disabled {
+        cursor: wait;
+        opacity: 0.62;
+      }
+
+      .hf-feature-action[hidden] {
+        display: none !important;
+      }
+
+      .hf-feature-action.is-loading::after {
+        content: "";
+        width: 0.9em;
+        height: 0.9em;
+        border: 2px solid currentColor;
+        border-right-color: transparent;
+        border-radius: 999px;
+        animation: hf-feature-spin 760ms linear infinite;
+      }
+
+      .hf-feature-manual-panel,
+      .hf-feature-readme-preview {
+        position: relative;
+        z-index: 1;
+        display: grid;
+        gap: 12px;
+        min-width: 0;
+        padding: 16px;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 24px;
+        background: rgba(255, 255, 255, 0.04);
+        animation: hf-feature-panel-in 260ms ease both;
+      }
+
+      .hf-feature-manual-panel {
+        flex: 1 0 100%;
+        width: 100%;
+        grid-column: 1 / -1;
+        max-height: 760px;
+        overflow: hidden;
+        opacity: 1;
+        transform-origin: top left;
+        transition:
+          max-height 320ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          opacity 220ms ease,
+          transform 280ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          padding 280ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          border-color 220ms ease,
+          background 220ms ease;
+      }
+
+      .hf-feature-manual-panel.is-collapsing {
+        display: grid;
+        max-height: 0;
+        padding-top: 0;
+        padding-bottom: 0;
+        border-color: transparent;
+        background: transparent;
+        opacity: 0;
+        transform: translateY(-8px) scaleY(0.98);
+        pointer-events: none;
+      }
+
+      .hf-feature-manual-panel[hidden]:not(.is-collapsing),
+      .hf-feature-readme-preview[hidden] {
+        display: none;
+      }
+
+      .hf-feature-panel-head,
+      .hf-feature-preview-head {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 14px;
+        min-width: 0;
+      }
+
+      .hf-feature-panel-head h3,
+      .hf-feature-preview-head h3 {
+        margin: 0;
+        color: var(--text);
+        font-size: 1rem;
+      }
+
+      .hf-feature-panel-head a {
+        color: #fff4c2;
+        font-size: 0.84rem;
+        font-weight: 760;
+        white-space: nowrap;
+      }
+
+      .hf-feature-manual-close {
+        min-height: 30px;
+        padding: 0 11px;
+        border: 1px solid rgba(197, 208, 227, 0.14);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.055);
+        color: rgba(235, 248, 255, 0.78);
+        font: inherit;
+        font-size: 0.75rem;
+        font-weight: 760;
+        cursor: pointer;
+        transition:
+          transform 150ms ease,
+          border-color 150ms ease,
+          background 150ms ease,
+          color 150ms ease;
+      }
+
+      .hf-feature-manual-close:hover,
+      .hf-feature-manual-close:focus-visible {
+        border-color: rgba(224, 247, 255, 0.38);
+        background: rgba(255, 255, 255, 0.095);
+        color: #ffffff;
+        outline: none;
+        transform: translateY(-1px);
+      }
+
+      .hf-feature-manual-close:active {
+        transform: translateY(1px) scale(0.98);
+      }
+
+      .hf-feature-readme-fallback {
+        display: grid;
+        gap: 12px;
+        padding: 16px;
+        border: 1px solid rgba(255, 214, 91, 0.18);
+        border-radius: 18px;
+        background:
+          radial-gradient(circle at 8% 0%, rgba(255, 214, 91, 0.12), transparent 42%),
+          rgba(255, 255, 255, 0.045);
+      }
+
+      .hf-feature-readme-fallback strong {
+        color: #fff4c2;
+      }
+
+      .hf-feature-readme-steps {
+        display: grid;
+        gap: 8px;
+        margin: 0;
+        padding-left: 1.2em;
+        color: rgba(235, 248, 255, 0.78);
+        font-size: 0.92rem;
+        line-height: 1.5;
+      }
+
+      .hf-feature-readme-steps li {
+        padding-left: 2px;
+      }
+
+      .hf-feature-readme-steps li::marker {
+        color: #ffd65b;
+        font-weight: 800;
+      }
+
+      .hf-feature-readme-step-button {
+        min-height: 34px;
+        margin: 0 4px;
+        padding: 0 12px;
+        font-size: 0.78rem;
+        line-height: 1;
+        vertical-align: middle;
+      }
+
+      .hf-feature-readme-steps li > .hf-feature-readme-step-button:first-child {
+        margin-left: 0;
+      }
+
+      .hf-feature-readme-inline-link {
+        color: #fff4c2;
+        font-weight: 800;
+        text-decoration: none;
+        border-bottom: 1px solid rgba(255, 214, 91, 0.45);
+      }
+
+      .hf-feature-readme-inline-link:hover,
+      .hf-feature-readme-inline-link:focus-visible {
+        color: #ffffff;
+        border-bottom-color: rgba(255, 255, 255, 0.72);
+        outline: none;
+      }
+
+      .hf-feature-manual-actions {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 10px;
+      }
+
+      .hf-feature-readme-preview pre {
+        max-height: min(54vh, 620px);
+        min-height: 240px;
+        margin: 0;
+        padding: 16px;
+        overflow: auto;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 18px;
+        background: rgba(0, 0, 0, 0.28);
+        color: #e8f7ff;
+        font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+        font-size: 0.82rem;
+        line-height: 1.55;
+        white-space: pre-wrap;
+      }
+
+      .hf-feature-placement-screen {
+        position: relative;
+        z-index: 6;
+        width: min(100%, 1500px);
+        margin: 0 auto;
+        animation: hf-feature-panel-in 260ms ease both;
+      }
+
+      .hf-feature-placement-screen[hidden] {
+        display: none;
+      }
+
+      .hf-feature-page.is-placing-readme {
+        height: auto;
+        min-height: 100dvh;
+        overflow: auto;
+      }
+
+      .hf-feature-page.is-placing-readme .hf-feature-shell {
+        display: none;
+      }
+
+      .hf-feature-placement-shell {
+        display: grid;
+        gap: 18px;
+        min-height: min(860px, calc(100dvh - 64px));
+        padding: clamp(16px, 2vw, 24px);
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 36px;
+        background:
+          radial-gradient(circle at 12% 0%, rgba(156, 255, 99, 0.13), transparent 30%),
+          radial-gradient(circle at 82% 8%, rgba(136, 215, 255, 0.13), transparent 36%),
+          linear-gradient(180deg, rgba(9, 20, 35, 0.9), rgba(3, 8, 16, 0.94));
+        box-shadow:
+          0 42px 130px rgba(0, 0, 0, 0.44),
+          inset 0 1px 0 rgba(255, 255, 255, 0.11);
+      }
+
+      .hf-feature-placement-screen.is-placement-variant-split .hf-feature-placement-shell {
+        grid-template-columns: minmax(300px, 400px) minmax(0, 1fr);
+        grid-template-rows: auto minmax(0, 1fr);
+        align-items: stretch;
+        height: min(920px, calc(100dvh - 44px));
+        min-height: min(720px, calc(100dvh - 44px));
+      }
+
+      .hf-feature-placement-head {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) auto;
+        align-items: start;
+        gap: 18px;
+      }
+
+      .hf-feature-placement-screen.is-placement-variant-split .hf-feature-placement-head {
+        grid-column: 1;
+        grid-row: 1;
+        grid-template-columns: 1fr;
+        align-content: start;
+      }
+
+      .hf-feature-placement-actions {
+        display: inline-flex;
+        align-items: center;
+        justify-content: flex-end;
+        gap: 10px;
+      }
+
+      .hf-feature-placement-screen.is-placement-variant-split .hf-feature-placement-actions {
+        justify-content: flex-start;
+        flex-wrap: wrap;
+        margin-top: 8px;
+      }
+
+      .hf-feature-placement-move-stack {
+        display: grid;
+        grid-template-columns: minmax(148px, 1fr);
+        gap: 7px;
+      }
+
+      .hf-feature-placement-screen .hf-feature-back {
+        min-height: 38px;
+        padding: 0 16px;
+        border-radius: 10px;
+        border-color: rgba(197, 208, 227, 0.16);
+        background: rgba(255, 255, 255, 0.05);
+        color: rgba(216, 225, 241, 0.86);
+        font-size: 0.84rem;
+        font-weight: 640;
+        letter-spacing: 0.012em;
+        transition:
+          background 160ms ease,
+          border-color 160ms ease,
+          color 160ms ease;
+      }
+
+      .hf-feature-placement-screen .hf-feature-placement-move-stack .hf-feature-back {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: 8px;
+        width: 100%;
+        padding-inline: 14px;
+        text-align: center;
+      }
+
+      /* the display rule above must not resurrect [hidden] buttons (the
+         move-ALL pair only exists in the feature-all flow) */
+      .hf-feature-placement-screen .hf-feature-placement-move-stack .hf-feature-back[hidden] {
+        display: none;
+      }
+
+      .hf-feature-placement-move-stack .hf-feature-move-icon {
+        width: 14px;
+        height: 14px;
+        flex: none;
+        opacity: 0.85;
+      }
+
+      .hf-feature-placement-move-stack .hf-feature-action {
+        width: 100%;
+      }
+
+      .hf-feature-placement-screen .hf-feature-back:hover,
+      .hf-feature-placement-screen .hf-feature-back:focus-visible {
+        border-color: rgba(197, 208, 227, 0.3);
+        background: rgba(255, 255, 255, 0.09);
+        color: #ffffff;
+        outline: none;
+      }
+
+      .hf-feature-placement-screen .hf-feature-action {
+        min-height: 42px;
+        padding: 0 20px;
+        border-radius: 12px;
+        font-size: 0.92rem;
+        letter-spacing: 0.012em;
+      }
+
+      .hf-feature-placement-screen .hf-feature-action--primary {
+        border-radius: 12px;
+      }
+
+      .hf-feature-placement-head .eyebrow {
+        width: fit-content;
+        min-height: 30px;
+        padding: 0 12px;
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.045);
+        color: rgba(235, 248, 255, 0.84);
+        font-size: 0.68rem;
+        letter-spacing: 0.18em;
+      }
+
+      .hf-feature-placement-head h2 {
+        margin: 8px 0 0;
+        color: #ffffff;
+        font-size: clamp(2.1rem, 3.1vw, 4rem);
+        line-height: 0.96;
+        letter-spacing: -0.07em;
+      }
+
+      .hf-feature-placement-head h2 + p {
+        margin-top: clamp(12px, 1.2vw, 18px);
+      }
+
+      .hf-feature-placement-head p,
+      .hf-feature-placement-readme-head p {
+        margin: 0;
+        color: rgba(197, 208, 227, 0.72);
+        font-size: 0.92rem;
+        line-height: 1.5;
+      }
+
+      .hf-feature-placement-status {
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        width: fit-content;
+        min-height: 38px;
+        padding: 0 14px;
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 999px;
+        background: rgba(0, 0, 0, 0.24);
+        color: rgba(235, 248, 255, 0.82);
+        font-size: 0.86rem;
+        font-weight: 720;
+      }
+
+      .hf-feature-placement-status[hidden] {
+        display: none;
+      }
+
+      .hf-feature-placement-screen.is-placement-variant-split .hf-feature-placement-status {
+        grid-column: 1;
+        grid-row: 2;
+        align-self: start;
+        max-width: 100%;
+      }
+
+      .hf-feature-spinner {
+        width: 15px;
+        height: 15px;
+        border: 2px solid rgba(235, 248, 255, 0.78);
+        border-right-color: transparent;
+        border-radius: 999px;
+        animation: hf-feature-spin 760ms linear infinite;
+      }
+
+      @keyframes hf-feature-spin {
+        to {
+          transform: rotate(1turn);
+        }
+      }
+
+      .hf-feature-placement-workspace {
+        display: grid;
+        grid-template-columns: minmax(220px, 0.22fr) minmax(0, 1fr);
+        gap: 18px;
+        min-height: 0;
+      }
+
+      .hf-feature-placement-screen.is-placement-variant-split .hf-feature-placement-workspace {
+        grid-column: 2;
+        grid-row: 1 / span 2;
+        min-height: 0;
+      }
+
+      .hf-feature-placement-workspace--full {
+        grid-template-columns: minmax(0, 1fr);
+      }
+
+      .hf-feature-placement-side,
+      .hf-feature-placement-readme {
+        min-width: 0;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 28px;
+        background:
+          radial-gradient(circle at 15% 0%, rgba(136, 215, 255, 0.08), transparent 42%),
+          rgba(255, 255, 255, 0.04);
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      }
+
+      .hf-feature-placement-side {
+        display: grid;
+        align-content: start;
+        gap: 14px;
+        padding: 16px;
+      }
+
+      .hf-feature-placement-side[hidden] {
+        display: none;
+      }
+
+      .hf-feature-placement-models {
+        display: grid;
+        gap: 8px;
+        max-height: 190px;
+        overflow: auto;
+        padding-right: 4px;
+        scrollbar-color: rgba(136, 215, 255, 0.28) transparent;
+        scrollbar-width: thin;
+      }
+
+      .hf-feature-placement-models[hidden] {
+        display: none;
+      }
+
+      .hf-feature-placement-model {
+        display: grid;
+        grid-template-columns: 28px minmax(0, 1fr);
+        align-items: center;
+        gap: 10px;
+        width: 100%;
+        min-height: 42px;
+        padding: 7px 9px;
+        border: 1px solid rgba(136, 215, 255, 0.14);
+        border-radius: 14px;
+        background: rgba(255, 255, 255, 0.045);
+        color: rgba(235, 248, 255, 0.8);
+        font: inherit;
+        font-size: 0.8rem;
+        font-weight: 720;
+        text-align: left;
+        cursor: pointer;
+      }
+
+      .hf-feature-placement-model.is-active {
+        border-color: rgba(156, 255, 99, 0.42);
+        background: rgba(156, 255, 99, 0.1);
+        color: #ffffff;
+      }
+
+      .hf-feature-placement-model img {
+        width: 28px;
+        height: 28px;
+        border-radius: 999px;
+        object-fit: cover;
+      }
+
+      .hf-feature-placement-model span {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .hf-feature-placement-readme {
+        display: grid;
+        grid-template-rows: auto minmax(0, 1fr);
+        padding: 16px;
+        overflow: hidden;
+      }
+
+      .hf-feature-placement-screen.is-placement-variant-split .hf-feature-placement-readme {
+        min-height: 0;
+        height: 100%;
+      }
+
+      .hf-feature-placement-readme-head {
+        display: flex;
+        align-items: start;
+        justify-content: space-between;
+        gap: 14px;
+        padding-bottom: 12px;
+      }
+
+      .hf-feature-placement-readme-head h3 {
+        margin: 0 0 4px;
+        color: #ffffff;
+        font-size: 1.08rem;
+      }
+
+      .hf-feature-placement-canvas {
+        --hf-feature-placement-doc-zoom: 0.6;
+        display: flex;
+        align-items: flex-start;
+        justify-content: center;
+        min-height: 0;
+        overflow: auto;
+        padding: 10px 16px 16px;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        color: #0f172a;
+        scrollbar-color: #94a3b8 transparent;
+        scrollbar-width: thin;
+      }
+
+      .hf-feature-placement-screen.is-placement-variant-split .hf-feature-placement-canvas {
+        max-height: 100%;
+        overscroll-behavior: contain;
+      }
+
+      .hf-feature-placement-canvas::-webkit-scrollbar,
+      .hf-feature-placement-models::-webkit-scrollbar {
+        width: 9px;
+        height: 9px;
+      }
+
+      .hf-feature-placement-canvas::-webkit-scrollbar-thumb,
+      .hf-feature-placement-models::-webkit-scrollbar-thumb {
+        border-radius: 999px;
+        background: rgba(148, 163, 184, 0.62);
+      }
+
+      .hf-feature-placement-doc {
+        display: grid;
+        gap: 0;
+        width: min(880px, 100%);
+        min-width: min(680px, 100%);
+        margin: 0 auto;
+        padding: 34px 42px 46px;
+        border: 1px solid rgba(203, 213, 225, 0.76);
+        border-radius: 30px;
+        background: #ffffff;
+        box-shadow:
+          0 28px 90px rgba(15, 23, 42, 0.16),
+          0 1px 0 rgba(255, 255, 255, 0.92) inset;
+        box-sizing: border-box;
+        transform-origin: top center;
+        zoom: var(--hf-feature-placement-doc-zoom, 0.52);
+      }
+
+      .hf-feature-placement-doc.is-compressed-bottom {
+        align-self: start;
+      }
+
+      .hf-feature-placement-canvas.is-unrolling-placement .hf-feature-placement-doc {
+        animation: hf-feature-placement-unroll 360ms cubic-bezier(0.16, 1, 0.3, 1) both;
+      }
+
+      @keyframes hf-feature-placement-unroll {
+        from {
+          opacity: 0.82;
+          transform: translateY(-18px);
+        }
+        to {
+          opacity: 1;
+          transform: translateY(0);
+        }
+      }
+
+      .hf-feature-placement-torn-divider {
+        position: relative;
+        height: 74px;
+        margin: 10px -42px 16px;
+        overflow: hidden;
+        background:
+          linear-gradient(135deg, transparent 0 14px, rgba(226, 232, 240, 0.84) 14px 16px, transparent 16px 32px) 0 0 / 32px 32px,
+          linear-gradient(225deg, transparent 0 14px, rgba(226, 232, 240, 0.84) 14px 16px, transparent 16px 32px) 0 100% / 32px 32px;
+        opacity: 0.92;
+      }
+
+      .hf-feature-placement-torn-divider::before {
+        content: "";
+        position: absolute;
+        inset: 23px 34px;
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 50% 50%, rgba(148, 163, 184, 0.28), transparent 62%),
+          linear-gradient(90deg, transparent, rgba(148, 163, 184, 0.26), transparent);
+        filter: blur(4px);
+      }
+
+      @supports not (zoom: 1) {
+        .hf-feature-placement-doc {
+          transform: scale(var(--hf-feature-placement-doc-zoom, 0.52));
+        }
+      }
+
+      .hf-feature-placement-slot {
+        position: relative;
+        display: grid;
+        place-items: center;
+        min-height: 0;
+        height: 0;
+        margin: 0;
+        padding: 0;
+        overflow: visible;
+        border: 0;
+        border-radius: 16px;
+        color: #0369a1;
+        font-size: 0.72rem;
+        font-weight: 800;
+        letter-spacing: 0.06em;
+        text-transform: uppercase;
+        pointer-events: none;
+        transition:
+          min-height 240ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          margin 240ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          background 220ms ease,
+          border-color 220ms ease,
+          box-shadow 220ms ease;
+      }
+
+      .hf-feature-placement-canvas.is-dragging-placement .hf-feature-placement-slot,
+      .hf-feature-placement-slot.is-active {
+        pointer-events: auto;
+      }
+
+      .hf-feature-placement-slot::before {
+        content: "Release to place graph";
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        z-index: 1;
+        padding: 16px 24px;
+        border: 1px solid rgba(3, 105, 161, 0.22);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.9);
+        opacity: 0;
+        transform: translate(-50%, -50%) scale(0.96);
+        box-shadow: 0 18px 42px rgba(15, 23, 42, 0.14);
+        font-size: clamp(1.35rem, 2.35vw, 2.2rem);
+        letter-spacing: 0.045em;
+        transition:
+          opacity 160ms ease,
+          transform 220ms cubic-bezier(0.2, 0.78, 0.2, 1);
+        white-space: nowrap;
+      }
+
+      .hf-feature-placement-slot::after {
+        content: "";
+        position: absolute;
+        inset: -18px 0;
+        border-radius: 18px;
+        background: transparent;
+      }
+
+      .hf-feature-placement-slot-hit {
+        position: absolute;
+        inset: -18px 0;
+        display: block;
+        border-radius: 18px;
+      }
+
+      .hf-feature-placement-slot.is-active .hf-feature-placement-slot-hit {
+        display: none;
+      }
+
+      .hf-feature-placement-slot.is-active {
+        height: auto;
+        min-height: 0;
+        margin: 12px 0;
+        pointer-events: auto;
+        cursor: default;
+      }
+
+      .hf-feature-placement-slot.is-drag-over {
+        height: auto;
+        min-height: var(--hf-feature-placement-slot-height, 210px);
+        margin: 12px 0;
+        border: 1px dashed rgba(3, 105, 161, 0.28);
+        border-color: rgba(3, 105, 161, 0.28);
+        background:
+          radial-gradient(circle at 50% 0%, rgba(14, 165, 233, 0.12), transparent 48%),
+          rgba(14, 165, 233, 0.08);
+        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7);
+      }
+
+      .hf-feature-placement-slot.is-active:not(.is-drag-over) {
+        background: transparent;
+        box-shadow: none;
+      }
+
+      .hf-feature-placement-slot.is-active,
+      .hf-feature-placement-slot.is-drag-over {
+        justify-items: stretch;
+        text-align: left;
+      }
+
+      .hf-feature-placement-slot.is-drag-over::before {
+        opacity: 1;
+        transform: translate(-50%, -50%) scale(1);
+      }
+
+      .hf-feature-placement-screen.is-placement-variant-split.is-balanced-drop-mode
+        .hf-feature-placement-slot.is-drag-over {
+        min-height: calc(var(--hf-feature-placement-slot-height, 210px) * 0.5);
+      }
+
+      .hf-feature-placement-balanced-before {
+        transform: translateY(calc(var(--hf-feature-placement-slot-height, 210px) * -0.5));
+      }
+
+      .hf-feature-placement-balanced-before,
+      .hf-feature-placement-block,
+      .hf-feature-placement-slot,
+      .hf-feature-placement-torn-divider {
+        transition:
+          transform 240ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          min-height 240ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          margin 240ms cubic-bezier(0.2, 0.78, 0.2, 1),
+          background 220ms ease,
+          border-color 220ms ease,
+          box-shadow 220ms ease;
+      }
+
+      .hf-feature-placement-insert-preview {
+        position: relative;
+        z-index: 2;
+        display: grid;
+        gap: 10px;
+        justify-self: start;
+        width: min(560px, 100%);
+        max-width: 100%;
+        margin: 12px 0;
+        padding: 0;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        text-align: left;
+        text-transform: none;
+        letter-spacing: normal;
+        cursor: grab;
+        user-select: none;
+        will-change: transform, opacity, filter;
+        transition:
+          opacity 180ms ease,
+          transform 360ms cubic-bezier(0.16, 1, 0.3, 1),
+          filter 220ms ease;
+      }
+
+      .hf-feature-placement-drag-marker {
+        position: fixed;
+        z-index: 64;
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        margin: 0;
+        padding: 15px 26px 16px;
+        border: 1px solid rgba(156, 255, 99, 0.42);
+        border-radius: 18px;
+        background: linear-gradient(180deg, rgba(24, 39, 27, 0.97), rgba(9, 19, 13, 0.97));
+        color: rgba(228, 255, 205, 0.98);
+        font-family: "Inter", sans-serif;
+        font-size: 16px;
+        font-weight: 720;
+        letter-spacing: 0.004em;
+        line-height: 1.25;
+        white-space: nowrap;
+        cursor: pointer;
+        user-select: none;
+        opacity: 1;
+        box-shadow:
+          0 30px 64px rgba(0, 0, 0, 0.58),
+          0 12px 26px rgba(0, 0, 0, 0.44),
+          inset 0 1px 0 rgba(255, 255, 255, 0.12);
+        transform: translate(-50%, -100%);
+        transition: opacity 200ms ease;
+      }
+
+      .hf-feature-placement-drag-marker::after {
+        content: "";
+        position: absolute;
+        left: 50%;
+        bottom: -7.5px;
+        width: 15px;
+        height: 15px;
+        margin-left: -7.5px;
+        transform: rotate(45deg);
+        background: rgba(9, 19, 13, 0.97);
+        border-right: 1px solid rgba(156, 255, 99, 0.42);
+        border-bottom: 1px solid rgba(156, 255, 99, 0.42);
+        border-bottom-right-radius: 4px;
+      }
+
+      .hf-feature-placement-drag-marker.is-pointing-up {
+        transform: translate(-50%, 0);
+      }
+
+      .hf-feature-placement-drag-marker.is-pointing-up::after {
+        bottom: auto;
+        top: -7.5px;
+        background: linear-gradient(315deg, transparent 46%, rgba(24, 39, 27, 0.97) 46%);
+        border: 0;
+        border-left: 1px solid rgba(156, 255, 99, 0.42);
+        border-top: 1px solid rgba(156, 255, 99, 0.42);
+        border-top-left-radius: 4px;
+      }
+
+      .hf-feature-placement-drag-marker.is-side {
+        transform: translate(0, -50%);
+      }
+
+      .hf-feature-placement-drag-marker.is-side::after {
+        left: -7.5px;
+        right: auto;
+        top: 50%;
+        bottom: auto;
+        margin-left: 0;
+        margin-top: -7.5px;
+        background: linear-gradient(225deg, transparent 46%, rgba(24, 39, 27, 0.97) 46%);
+        border: 0;
+        border-left: 1px solid rgba(156, 255, 99, 0.42);
+        border-bottom: 1px solid rgba(156, 255, 99, 0.42);
+        border-bottom-left-radius: 4px;
+      }
+
+      .hf-feature-placement-drag-marker__arrow {
+        display: none;
+        font-size: 16px;
+        line-height: 1;
+        color: rgba(156, 255, 99, 0.95);
+      }
+
+      .hf-feature-placement-drag-marker.is-offscreen .hf-feature-placement-drag-marker__arrow {
+        display: inline;
+      }
+
+      .hf-feature-placement-drag-marker.is-offscreen.is-pointing-up
+        .hf-feature-placement-drag-marker__arrow::before {
+        content: "\2191";
+      }
+
+      .hf-feature-placement-drag-marker.is-offscreen:not(.is-pointing-up)
+        .hf-feature-placement-drag-marker__arrow::before {
+        content: "\2193";
+      }
+
+      .hf-feature-placement-drag-marker.is-hidden {
+        opacity: 0;
+        pointer-events: none;
+      }
+
+      .hf-feature-placement-insert-preview:active {
+        cursor: grabbing;
+      }
+
+      .hf-feature-placement-insert-preview.is-dragging {
+        opacity: 0.62;
+        transform: scale(0.985);
+        filter: saturate(0.9);
+      }
+
+      .hf-feature-placement-drag-ghost {
+        position: fixed;
+        left: -10000px;
+        top: -10000px;
+        z-index: -1;
+        pointer-events: none;
+        opacity: 0.96;
+        transform: none !important;
+        /* zoom is set inline to the doc zoom so the drag image shows the
+           card exactly as it renders in the README (title size included) */
+      }
+
+      .hf-feature-placement-drag-ghost .hf-feature-placement-insert-preview {
+        width: 100%;
+        margin: 0;
+        transform: none !important;
+      }
+
+      .hf-feature-placement-drag-ghost .hf-feature-placement-insert-heading,
+      .hf-feature-placement-drag-ghost .hf-feature-placement-insert-preview img {
+        flex: none;
+        max-width: none;
+        max-height: none;
+        transform: none !important;
+      }
+
+      .hf-feature-placement-insert-heading {
+        margin: 0 0 2px -8px;
+        width: fit-content;
+        max-width: 100%;
+        padding: 5px 8px 0.38em;
+        border: 1px solid transparent;
+        border-bottom-color: rgba(148, 163, 184, 0.32);
+        border-radius: 12px;
+        color: #0f172a;
+        font-size: clamp(1.55rem, 3.3vw, 2.25rem);
+        font-weight: 760;
+        letter-spacing: -0.045em;
+        line-height: 1.15;
+        text-transform: none;
+        cursor: text;
+        outline: none;
+        transition:
+          background 160ms ease,
+          border-color 160ms ease,
+          box-shadow 160ms ease;
+      }
+
+      .hf-feature-placement-insert-heading:hover,
+      .hf-feature-placement-insert-heading:focus {
+        border-color: rgba(37, 99, 235, 0.18);
+        box-shadow: 0 0 0 4px rgba(14, 165, 233, 0.07);
+        background: rgba(14, 165, 233, 0.045);
+      }
+
+      .hf-feature-placement-insert-preview img {
+        display: block;
+        width: auto;
+        max-width: min(560px, 100%);
+        height: auto;
+        max-height: 270px;
+        border-radius: 16px;
+        object-fit: contain;
+        background: transparent;
+        filter: drop-shadow(0 18px 30px rgba(15, 23, 42, 0.16));
+        pointer-events: none;
+        transform: translateZ(0) scale(1);
+        transition:
+          filter 180ms ease,
+          transform 180ms cubic-bezier(0.2, 0.78, 0.2, 1);
+        user-select: none;
+      }
+
+      .hf-feature-placement-insert-preview:hover img {
+        filter: drop-shadow(0 30px 46px rgba(15, 23, 42, 0.22));
+        transform: translateY(-2px) scale(1.018);
+      }
+
+      .hf-feature-placement-insert-preview.is-dragging img {
+        filter: drop-shadow(0 16px 24px rgba(15, 23, 42, 0.14));
+        transform: translateY(0) scale(1);
+      }
+
+      .hf-feature-placement-block {
+        padding: 8px 0;
+        border-bottom: 0;
+      }
+
+      .hf-feature-placement-block:last-child {
+        border-bottom: 0;
+      }
+
+      .hf-feature-placement-block--heading {
+        padding-top: 16px;
+      }
+
+      .hf-feature-placement-block h1,
+      .hf-feature-placement-block h2,
+      .hf-feature-placement-block h3,
+      .hf-feature-placement-block h4,
+      .hf-feature-placement-block h5,
+      .hf-feature-placement-block h6,
+      .hf-feature-placement-block p,
+      .hf-feature-placement-block pre,
+      .hf-feature-placement-block blockquote,
+      .hf-feature-placement-block ul,
+      .hf-feature-placement-block ol,
+      .hf-feature-placement-block table,
+      .hf-feature-placement-block figure {
+        margin: 0;
+      }
+
+      .hf-feature-placement-block h1,
+      .hf-feature-placement-block h2 {
+        padding-bottom: 0.28em;
+        border-bottom: 1px solid rgba(148, 163, 184, 0.28);
+        color: #0f172a;
+        font-size: clamp(1.35rem, 2.7vw, 2.15rem);
+        font-weight: 760;
+        letter-spacing: -0.045em;
+        line-height: 1.12;
+      }
+
+      .hf-feature-placement-block h3,
+      .hf-feature-placement-block h4,
+      .hf-feature-placement-block h5,
+      .hf-feature-placement-block h6 {
+        color: #0f172a;
+        font-size: clamp(1rem, 1.8vw, 1.45rem);
+        font-weight: 740;
+        letter-spacing: -0.025em;
+        line-height: 1.15;
+      }
+
+      .hf-feature-placement-block p,
+      .hf-feature-placement-block li,
+      .hf-feature-placement-block blockquote {
+        color: #334155;
+        font-size: 0.9rem;
+        line-height: 1.55;
+      }
+
+      .hf-feature-placement-block--placeholder {
+        padding-block: 5px;
+      }
+
+      .hf-feature-placement-ellipsis {
+        width: fit-content;
+        max-width: 100%;
+        padding: 3px 0;
+        color: #64748b;
+        font-size: 1rem;
+        font-weight: 700;
+        letter-spacing: 0.06em;
+        line-height: 1;
+      }
+
+      .hf-feature-placement-image-preview {
+        display: grid;
+        justify-items: start;
+        gap: 8px;
+      }
+
+      .hf-feature-placement-image-preview img {
+        display: block;
+        max-width: min(620px, 100%);
+        max-height: 280px;
+        border-radius: 10px;
+        object-fit: contain;
+      }
+
+      .hf-feature-placement-block ul,
+      .hf-feature-placement-block ol {
+        padding-left: 1.45em;
+      }
+
+      .hf-feature-placement-block a {
+        color: #2563eb;
+        text-decoration-color: rgba(37, 99, 235, 0.35);
+        text-underline-offset: 0.16em;
+      }
+
+      .hf-feature-placement-block code {
+        padding: 0.08em 0.32em;
+        border-radius: 0.38em;
+        background: rgba(15, 23, 42, 0.07);
+        color: #0f172a;
+        font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
+        font-size: 0.9em;
+      }
+
+      .hf-feature-placement-block pre {
+        max-height: 180px;
+        overflow: hidden;
+        padding: 12px;
+        border-radius: 14px;
+        background: #0f172a;
+        color: #dbeafe;
+        font-size: 0.76rem;
+        line-height: 1.45;
+      }
+
+      .hf-feature-placement-block pre code {
+        display: block;
+        padding: 0;
+        background: transparent;
+        color: inherit;
+        white-space: pre-wrap;
+      }
+
+      .hf-feature-placement-block blockquote {
+        padding: 10px 13px;
+        border-left: 4px solid #cbd5e1;
+        background: rgba(241, 245, 249, 0.72);
+      }
+
+      .hf-feature-placement-block table {
+        display: table;
+        width: 100%;
+        border-collapse: collapse;
+        border: 1px solid #cbd5e1;
+        border-radius: 10px;
+        font-size: 0.82rem;
+        table-layout: fixed;
+      }
+
+      .hf-feature-placement-block th,
+      .hf-feature-placement-block td {
+        padding: 8px 10px;
+        border: 1px solid #cbd5e1;
+        color: #334155;
+        text-align: left;
+        vertical-align: top;
+      }
+
+      .hf-feature-placement-block th {
+        background: #f1f5f9;
+        color: #0f172a;
+        font-weight: 760;
+      }
+
+      .hf-feature-placement-block img {
+        max-width: 100%;
+        max-height: 280px;
+        border-radius: 10px;
+        object-fit: contain;
+      }
+
+      .hf-feature-placement-block figure {
+        display: grid;
+        justify-items: start;
+        gap: 6px;
+      }
+
+      .hf-feature-placement-block hr {
+        width: 100%;
+        height: 1px;
+        margin: 6px 0;
+        border: 0;
+        background: rgba(148, 163, 184, 0.38);
+      }
+
+      .hf-feature-fly-card {
+        position: fixed;
+        z-index: 10000;
+        pointer-events: none;
+        overflow: hidden;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        contain: layout style paint;
+        will-change: left, top, width, height, opacity;
+        visibility: hidden;
+      }
+
+      .hf-feature-fly-card img {
+        display: block;
+        width: 100%;
+        height: 100%;
+        object-fit: contain;
+        object-position: center center;
+      }
+
+      /* morphing flight: the clone carries the dashboard-art look on one
+         layer and the framed showcase-card look on another, crossfading
+         mid-flight so it takes off matching the READY card and lands
+         matching the community-card preview exactly */
+      .hf-feature-fly-card__layer {
+        position: absolute; inset: 0;
+        transition: opacity 620ms ease 140ms;
+      }
+      .hf-feature-fly-card__layer img {
+        width: 100%; height: 100%; object-fit: contain; object-position: center;
+      }
+      .hf-feature-fly-card__layer--well {
+        border-radius: 12px;
+        background:
+          radial-gradient(circle at 50% 0%, rgba(136, 215, 255, 0.12), transparent 52%),
+          radial-gradient(circle at 20% 12%, rgba(156, 255, 99, 0.1), transparent 32%),
+          linear-gradient(180deg, rgba(9, 16, 29, 0.92), rgba(5, 9, 20, 0.98)), #050914;
+      }
+      .hf-feature-fly-card__layer--well img { padding: 6.9% 6.2% 5.5%; box-sizing: border-box; }
+      .hf-feature-fly-card__layer--end { opacity: 0; }
+      .hf-feature-fly-card.is-morphing .hf-feature-fly-card__layer--start { opacity: 0; }
+      .hf-feature-fly-card.is-morphing .hf-feature-fly-card__layer--end { opacity: 1; }
+
+      .hf-feature-cycle-clone {
+        margin: 0 !important;
+        pointer-events: none;
+        transform-origin: center center;
+        animation: none !important;
+        transition: none !important;
+        will-change: left, top, width, height, opacity, filter;
+      }
+
+      .hf-feature-cycle-clone--fixed {
+        position: fixed;
+        z-index: 9999;
+        transform: none !important;
+      }
+
+      .hf-feature-cycle-clone * {
+        pointer-events: none !important;
+      }
+
+      .hf-feature-cycle-clone img {
+        opacity: 1 !important;
+        visibility: visible !important;
+      }
+
+      .hf-feature-cycle-clone .hf-feature-backdrop-reflection,
+      .hf-feature-cycle-clone .hf-feature-card-reflection {
+        display: none !important;
+      }
+
+      .hf-feature-cycle-stage-overlay {
+        position: absolute;
+        inset: 0;
+        z-index: 18;
+        pointer-events: none;
+        transform-style: preserve-3d;
+      }
+
+      .hf-feature-cycle-stage-overlay .hf-feature-backdrop-card,
+      .hf-feature-cycle-stage-overlay .hf-feature-backdrop-reflection {
+        animation: none !important;
+        transition: none !important;
+      }
+
+      .hf-feature-cycle-stage-overlay .hf-feature-backdrop-card--user:not(.hf-feature-backdrop-card--reflection-inner) {
+        background:
+          radial-gradient(circle at 50% 0%, rgba(136, 215, 255, 0.08), transparent 48%),
+          linear-gradient(180deg, #ffffff, #f4f8fc);
+        mix-blend-mode: normal !important;
+      }
+
+      .hf-feature-page.is-feature-cycle-measuring .hf-feature-backdrop-card,
+      .hf-feature-page.is-feature-cycle-measuring .hf-feature-backdrop-reflection,
+      .hf-feature-page.is-feature-cycle-measuring .hf-feature-backdrop-card__top,
+      .hf-feature-page.is-feature-cycle-measuring .hf-feature-backdrop-card__avatar,
+      .hf-feature-page.is-feature-cycle-measuring .hf-feature-backdrop-card__repo,
+      .hf-feature-page.is-feature-cycle-measuring .hf-feature-backdrop-card__tabs,
+      .hf-feature-page.is-feature-cycle-measuring .hf-feature-backdrop-card__summary,
+      .hf-feature-page.is-feature-cycle-measuring .hf-feature-backdrop-card__embed,
+      .hf-feature-page.is-feature-cycle-measuring .hf-feature-backdrop-card__actions {
+        transition: none !important;
+      }
+
+      .hf-feature-page.is-feature-cycle-animating .hf-feature-main-card-wrap,
+      .hf-feature-page.is-feature-cycle-animating .hf-feature-backdrop-cards {
+        visibility: hidden;
+      }
+
+      .hf-feature-page.is-feature-cycle-animating .hf-feature-cycle-stage-overlay,
+      .hf-feature-page.is-feature-cycle-animating .hf-feature-cycle-clone {
+        visibility: visible;
+      }
+
+      html.hf-feature-cycle-transition::view-transition-old(root) {
+        animation: none;
+        opacity: 0;
+        mix-blend-mode: normal;
+      }
+
+      html.hf-feature-cycle-transition::view-transition-new(root) {
+        animation: none;
+        opacity: 1;
+        mix-blend-mode: normal;
+      }
+
+      html.hf-feature-cycle-transition::view-transition-group(*) {
+        animation-duration: var(--hf-feature-all-cycle-duration-active, 490ms);
+        animation-timing-function: var(--hf-feature-all-cycle-easing-active, cubic-bezier(0.25, 0.8, 0.25, 1));
+      }
+
+      html.hf-feature-cycle-transition::view-transition-image-pair(*) {
+        isolation: isolate;
+      }
+
+      html.hf-feature-cycle-transition::view-transition-old(*),
+      html.hf-feature-cycle-transition::view-transition-new(*) {
+        animation-duration: var(--hf-feature-all-cycle-duration-active, 490ms);
+        animation-timing-function: var(--hf-feature-all-cycle-easing-active, cubic-bezier(0.25, 0.8, 0.25, 1));
+        mix-blend-mode: normal;
+      }
+
+      @keyframes hf-feature-backdrop-card-enter {
+        from {
+          opacity: 0;
+          filter: blur(9px) saturate(0.72);
+          transform:
+            translateX(-50%)
+            translate3d(var(--from-x, 0px), var(--from-y, 46px), -560px)
+            rotateY(var(--from-rot-y, 0deg))
+            rotateZ(var(--from-rot-z, 0deg))
+            scale(var(--from-scale, 0.48));
+        }
+        62% {
+          opacity: 1;
+        }
+        to {
+          opacity: var(--opacity);
+          filter: blur(var(--blur)) saturate(var(--saturate)) brightness(var(--brightness));
+          transform:
+            translateX(-50%)
+            translate3d(var(--x), var(--y), var(--z))
+            rotateY(var(--rot-y))
+            rotateZ(var(--rot-z))
+            scale(var(--scale-x, var(--scale)), var(--scale-y, var(--scale)));
+        }
+      }
+
+      @keyframes hf-feature-backdrop-reflection-enter {
+        from {
+          opacity: 0;
+          filter: blur(calc(var(--blur) + 11px)) saturate(0.48) brightness(0.62);
+          transform:
+            translateX(-50%)
+            translate3d(var(--from-x, 0px), calc(var(--from-y, 46px) + 18px), -610px)
+            rotateY(var(--from-rot-y, 0deg))
+            rotateZ(var(--from-rot-z, 0deg))
+            scale(var(--from-scale, 0.48));
+        }
+        64% {
+          opacity: 0.76;
+        }
+        to {
+          opacity: 0.76;
+          filter: blur(calc(var(--blur) + var(--reflection-blur-boost))) saturate(0.48) brightness(var(--reflection-brightness)) contrast(0.68);
+          transform:
+            translateX(-50%)
+            translate3d(var(--x), var(--y), calc(var(--z) - 24px))
+            rotateY(var(--rot-y))
+            rotateZ(var(--rot-z))
+          scale(var(--scale-x, var(--scale)), var(--scale-y, var(--scale)));
+        }
+      }
+
+      @keyframes hf-feature-backdrop-card-exit {
+        from {
+          opacity: var(--opacity);
+          filter: blur(var(--blur)) saturate(var(--saturate)) brightness(var(--brightness));
+          transform:
+            translateX(-50%)
+            translate3d(var(--x), var(--y), var(--z))
+            rotateY(var(--rot-y))
+            rotateZ(var(--rot-z))
+            scale(var(--scale-x, var(--scale)), var(--scale-y, var(--scale)));
+        }
+        46% {
+          opacity: var(--opacity);
+        }
+        to {
+          opacity: 0;
+          filter: blur(9px) saturate(0.72);
+          transform:
+            translateX(-50%)
+            translate3d(var(--from-x, 0px), var(--from-y, 46px), -560px)
+            rotateY(var(--from-rot-y, 0deg))
+            rotateZ(var(--from-rot-z, 0deg))
+            scale(var(--from-scale, 0.48));
+        }
+      }
+
+      @keyframes hf-feature-backdrop-reflection-exit {
+        from {
+          opacity: 0.76;
+          filter: blur(calc(var(--blur) + var(--reflection-blur-boost))) saturate(0.48) brightness(var(--reflection-brightness)) contrast(0.68);
+          transform:
+            translateX(-50%)
+            translate3d(var(--x), var(--y), calc(var(--z) - 24px))
+            rotateY(var(--rot-y))
+            rotateZ(var(--rot-z))
+            scale(var(--scale-x, var(--scale)), var(--scale-y, var(--scale)));
+        }
+        42% {
+          opacity: 0.76;
+        }
+        to {
+          opacity: 0;
+          filter: blur(calc(var(--blur) + 11px)) saturate(0.48) brightness(0.62);
+          transform:
+            translateX(-50%)
+            translate3d(var(--from-x, 0px), calc(var(--from-y, 46px) + 18px), -610px)
+            rotateY(var(--from-rot-y, 0deg))
+            rotateZ(var(--from-rot-z, 0deg))
+            scale(var(--from-scale, 0.48));
+        }
+      }
+
+      @keyframes hf-feature-main-card-enter {
+        from {
+          opacity: 0;
+          filter: blur(6px);
+          transform: translate3d(0, 94px, -120px) rotateX(7deg) scale(0.86);
+        }
+        62% {
+          opacity: 1;
+          filter: blur(0);
+        }
+        to {
+          opacity: 1;
+          filter: blur(0);
+          transform: translateY(var(--hf-feature-main-card-y)) rotateX(0deg) scale(1);
+        }
+      }
+
+      @keyframes hf-feature-dashboard-exit {
+        from {
+          opacity: 1;
+          filter: blur(0);
+          transform: scale(1);
+        }
+        34% {
+          opacity: 1;
+          filter: blur(0);
+          transform: scale(1);
+        }
+        to {
+          opacity: 0;
+          filter: blur(7px);
+          transform: scale(0.985);
+        }
+      }
+
+      @keyframes hf-feature-page-overlay-in {
+        from {
+          opacity: 0;
+        }
+        to {
+          opacity: 1;
+        }
+      }
+
+      @keyframes hf-feature-page-return-out {
+        from {
+          opacity: 1;
+          filter: blur(0);
+          transform: scale(1);
+        }
+        34% {
+          opacity: 1;
+          filter: blur(0);
+          transform: scale(1);
+        }
+        to {
+          opacity: 0;
+          filter: blur(7px);
+          transform: scale(1.012);
+        }
+      }
+
+      @keyframes hf-feature-panel-in {
+        from {
+          opacity: 0;
+          transform: translateY(10px);
+        }
+        to {
+          opacity: 1;
+          transform: translateY(0);
+        }
+      }
+
+      @keyframes hf-article-visual-skeleton {
+        0% {
+          background-position: -180% 0, center, center, center;
+        }
+        100% {
+          background-position: 180% 0, center, center, center;
+        }
+      }
+
+      @media (max-width: 900px) {
+        .hf-feature-page {
+          height: auto;
+          min-height: 100vh;
+          min-height: 100dvh;
+          padding: max(14px, env(safe-area-inset-top)) clamp(12px, 3.8vw, 22px) calc(24px + env(safe-area-inset-bottom));
+          overflow-x: hidden;
+          overflow-y: auto;
+          -webkit-overflow-scrolling: touch;
+        }
+
+        .hf-feature-page.is-transition-overlay,
+        .hf-feature-page.is-transition-prepared {
+          height: 100vh;
+          height: 100dvh;
+          overflow: hidden;
+        }
+
+        .hf-feature-page::before {
+          background:
+            linear-gradient(180deg, rgba(0, 0, 0, 0.18), transparent 30%, rgba(0, 0, 0, 0.26)),
+            radial-gradient(circle at 50% 26%, rgba(136, 215, 255, 0.08), transparent 48%);
+        }
+
+        .hf-feature-page::after {
+          left: -12%;
+          right: -12%;
+          bottom: 18%;
+          height: 34vh;
+          opacity: 0.56;
+        }
+
+        .hf-feature-shell {
+          grid-template-columns: 1fr;
+          align-items: start;
+          gap: 16px;
+          width: min(560px, 100%);
+          height: auto;
+          min-height: 0;
+        }
+
+        .hf-feature-preview-pane {
+          position: relative;
+          top: auto;
+          align-content: start;
+          gap: 10px;
+          width: 100%;
+        }
+
+        .hf-feature-showcase-stage {
+          width: 100%;
+          height: clamp(444px, 68dvh, 560px);
+          min-height: 0;
+          place-items: start center;
+          perspective: 1180px;
+        }
+
+        .hf-feature-showcase-stage::before {
+          left: -10%;
+          right: -10%;
+          bottom: 6px;
+          height: 210px;
+          filter: blur(22px);
+          opacity: 0.82;
+        }
+
+        .hf-feature-showcase-stage::after {
+          left: 9%;
+          right: 9%;
+          bottom: 52px;
+          height: 104px;
+          filter: blur(17px);
+          opacity: 0.6;
+        }
+
+        .hf-feature-main-card-wrap {
+          width: min(318px, 78vw);
+          transform: translateY(18px);
+          animation: none;
+        }
+
+        .hf-feature-page.is-flying-card .hf-feature-main-card-wrap {
+          transform: translateY(18px);
+        }
+
+        .hf-feature-page.has-flight-complete .hf-feature-main-card-wrap {
+          transform: translateY(18px);
+        }
+
+        .hf-feature-controls {
+          width: 100%;
+          justify-self: center;
+          margin-left: 0;
+          margin-top: -14px;
+          padding: 12px;
+          border-radius: 20px;
+          background:
+            radial-gradient(circle at 12% 0%, rgba(255, 214, 91, 0.1), transparent 42%),
+            linear-gradient(180deg, rgba(8, 17, 31, 0.88), rgba(4, 9, 17, 0.82));
+          backdrop-filter: blur(14px);
+        }
+
+        .hf-feature-backdrop-card {
+          filter: blur(var(--blur)) saturate(var(--saturate)) brightness(0.78);
+        }
+
+        .hf-feature-page.is-feature-all .hf-feature-backdrop-cards {
+          display: none;
+        }
+
+        .hf-feature-action-pane {
+          justify-self: stretch;
+          width: 100%;
+          gap: 16px;
+          padding: clamp(18px, 4.6vw, 24px);
+          border-radius: 28px;
+        }
+
+        .hf-feature-action-pane::before {
+          border-radius: 27px;
+        }
+
+        .hf-feature-back {
+          min-height: 42px;
+        }
+
+        .hf-feature-action-copy {
+          gap: 12px;
+        }
+
+        .hf-feature-action-copy .eyebrow {
+          width: fit-content;
+          max-width: 100%;
+          min-height: 34px;
+          padding: 0 14px;
+          font-size: 0.68rem;
+          letter-spacing: 0.16em;
+        }
+
+        .hf-feature-action-copy h2 {
+          max-width: 330px;
+          font-size: clamp(2.45rem, 13vw, 4.4rem);
+          line-height: 0.88;
+        }
+
+        .hf-feature-action-copy p,
+        .hf-feature-manual-panel p,
+        .hf-feature-readme-preview p,
+        .hf-feature-feedback {
+          font-size: 0.94rem;
+          line-height: 1.56;
+        }
+
+        .hf-feature-action-grid,
+        .hf-feature-manual-actions {
+          display: grid;
+          grid-template-columns: 1fr 1fr;
+          gap: 10px;
+        }
+
+        .hf-feature-action {
+          min-height: 48px;
+          padding: 0 14px;
+          text-align: center;
+        }
+      }
+
+      @media (max-width: 620px) {
+        .hf-feature-page {
+          padding: max(12px, env(safe-area-inset-top)) 12px calc(20px + env(safe-area-inset-bottom));
+        }
+
+        .hf-feature-showcase-stage {
+          height: clamp(402px, 63dvh, 486px);
+        }
+
+        .hf-feature-backdrop-cards {
+          display: none;
+        }
+
+        .hf-feature-main-card-wrap {
+          --hf-feature-main-reflection-gap: 0px;
+          --hf-feature-main-reflection-width: 104%;
+          --hf-feature-main-card-y: 12px;
+          --hf-feature-card-projection-scale: 1;
+          width: min(296px, 78vw);
+          transform: translateY(12px);
+        }
+
+        .hf-feature-card-reflection {
+          height: min(132px, 17vh);
+          border-radius: 24px;
+          opacity: 0.58;
+          mix-blend-mode: screen;
+        }
+
+        .hf-feature-card-reflection__inner,
+        .hf-feature-card-reflection .community-card {
+          border-radius: 24px;
+          clip-path: inset(0 round 24px);
+        }
+
+        .hf-feature-page.is-flying-card .hf-feature-main-card-wrap {
+          transform: translateY(12px);
+        }
+
+        .hf-feature-page.has-flight-complete .hf-feature-main-card-wrap {
+          transform: translateY(12px);
+        }
+
+        .hf-feature-controls {
+          margin-top: -8px;
+        }
+
+        .hf-feature-granularity {
+          grid-template-columns: 1fr auto;
+          gap: 8px;
+        }
+
+        .hf-feature-granularity .viewer-granularity__slider {
+          grid-column: 1 / -1;
+          grid-row: 2;
+          width: 100%;
+        }
+
+        .hf-feature-granularity .viewer-granularity__value {
+          justify-self: end;
+        }
+
+        .hf-feature-action-pane {
+          padding: 16px;
+          border-radius: 24px;
+        }
+
+        .hf-feature-action-pane::before {
+          border-radius: 23px;
+        }
+
+        .hf-feature-style {
+          grid-template-columns: 1fr;
+        }
+
+        .hf-feature-action-grid,
+        .hf-feature-manual-actions,
+        .hf-feature-action {
+          width: 100%;
+        }
+
+        .hf-feature-action-grid,
+        .hf-feature-manual-actions {
+          grid-template-columns: 1fr;
+        }
+
+        .hf-feature-manual-panel,
+        .hf-feature-readme-preview {
+          padding: 13px;
+          border-radius: 20px;
+        }
+
+        .hf-feature-placement-shell {
+          min-height: auto;
+          padding: 13px;
+          border-radius: 24px;
+        }
+
+        .hf-feature-placement-screen.is-placement-variant-split .hf-feature-placement-shell {
+          grid-template-columns: 1fr;
+          grid-template-rows: auto auto auto;
+          height: auto;
+          min-height: auto;
+        }
+
+        .hf-feature-placement-head {
+          grid-template-columns: 1fr;
+        }
+
+        .hf-feature-placement-screen.is-placement-variant-split .hf-feature-placement-head,
+        .hf-feature-placement-screen.is-placement-variant-split .hf-feature-placement-status,
+        .hf-feature-placement-screen.is-placement-variant-split .hf-feature-placement-workspace {
+          grid-column: auto;
+          grid-row: auto;
+        }
+
+        .hf-feature-placement-head h2 {
+          font-size: clamp(2rem, 11vw, 3.2rem);
+        }
+
+        .hf-feature-placement-workspace {
+          grid-template-columns: 1fr;
+        }
+
+        .hf-feature-placement-side {
+          border-radius: 22px;
+        }
+
+        .hf-feature-placement-readme {
+          min-height: 62dvh;
+          padding: 12px;
+          border-radius: 22px;
+        }
+
+        .hf-feature-placement-readme-head {
+          flex-direction: column;
+        }
+
+        .hf-feature-placement-canvas {
+          --hf-feature-placement-doc-zoom: 0.7;
+          padding: 12px;
+          border-radius: 18px;
+        }
+
+        .hf-feature-placement-slot:hover,
+        .hf-feature-placement-slot.is-active,
+        .hf-feature-placement-slot.is-drag-over {
+          --hf-feature-placement-slot-height: 210px;
+        }
+
+        .hf-feature-readme-fallback {
+          padding: 13px;
+          border-radius: 16px;
+        }
+
+        .hf-feature-readme-preview pre {
+          max-height: 240px;
+          min-height: 126px;
+          font-size: 0.74rem;
+        }
+
+        .hf-feature-panel-head,
+        .hf-feature-preview-head {
+          align-items: stretch;
+          flex-direction: column;
+        }
+      }
+
+      @media (prefers-reduced-motion: reduce) {
+        .hf-feature-page.is-entering .hf-feature-preview-pane,
+        .hf-feature-page.is-entering .hf-feature-action-pane,
+        .hf-feature-preview-pane,
+        .hf-feature-action-pane,
+        .hf-feature-manual-panel,
+        .hf-feature-readme-preview {
+          transition: none;
+          animation: none;
+          transform: none;
+        }
+
+        .hf-feature-main-card-wrap,
+        .hf-feature-backdrop-card {
+          animation: none;
+        }
+      }
+
+      .hf-admin-page {
+        position: relative;
+        z-index: 2;
+        padding: clamp(24px, 4vw, 48px);
+      }
+
+      .hf-admin-page[hidden] {
+        display: none;
+      }
+
+      .hf-admin-shell {
+        display: grid;
+        gap: 20px;
+        width: min(1380px, 100%);
+        margin: 0 auto;
+      }
+
+      .hf-admin-top,
+      .hf-admin-controls,
+      .hf-admin-case,
+      .hf-admin-empty {
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 30px;
+        background:
+          radial-gradient(circle at 16% 0%, rgba(255, 209, 102, 0.11), transparent 32%),
+          linear-gradient(180deg, rgba(10, 19, 34, 0.91), rgba(4, 9, 17, 0.93));
+        box-shadow:
+          0 24px 70px rgba(0, 0, 0, 0.3),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      }
+
+      .hf-admin-top {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 16px;
+        padding: clamp(18px, 3vw, 28px);
+      }
+
+      .hf-admin-top h2 {
+        margin: 0;
+        color: var(--text);
+        font-size: clamp(2rem, 4vw, 3.6rem);
+        line-height: 0.95;
+        letter-spacing: -0.07em;
+      }
+
+      .hf-admin-top p,
+      .hf-admin-status,
+      .hf-admin-case__meta,
+      .hf-admin-case__reason,
+      .hf-admin-empty {
+        margin: 0;
+        color: rgba(197, 208, 227, 0.72);
+        line-height: 1.55;
+      }
+
+      .hf-admin-controls {
+        display: grid;
+        gap: 16px;
+        padding: clamp(16px, 2.4vw, 24px);
+      }
+
+      .hf-admin-action-row,
+      .hf-admin-filter-row,
+      .hf-admin-stats,
+      .hf-admin-case__actions {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: 10px;
+      }
+
+      .hf-admin-action-row {
+        align-items: stretch;
+      }
+
+      .hf-admin-stats {
+        gap: 8px;
+      }
+
+      .hf-admin-stat,
+      .hf-admin-chip {
+        display: inline-flex;
+        align-items: center;
+        gap: 6px;
+        min-height: 32px;
+        padding: 0 11px;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.045);
+        color: rgba(235, 248, 255, 0.82);
+        font-size: 0.78rem;
+        font-weight: 780;
+      }
+
+      .hf-admin-chip--open {
+        color: #fff2b4;
+        border-color: rgba(255, 209, 102, 0.28);
+        background: rgba(255, 209, 102, 0.1);
+      }
+
+      .hf-admin-chip--resolved {
+        color: #c9ffd0;
+        border-color: rgba(156, 255, 99, 0.22);
+        background: rgba(156, 255, 99, 0.08);
+      }
+
+      .hf-admin-chip--hidden {
+        color: #ffd4d4;
+        border-color: rgba(255, 132, 132, 0.2);
+        background: rgba(255, 96, 96, 0.08);
+      }
+
+      .hf-admin-filter {
+        min-height: 38px;
+        padding: 0 13px;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.035);
+        color: rgba(223, 247, 255, 0.76);
+        font: inherit;
+        font-size: 0.88rem;
+        font-weight: 760;
+        cursor: pointer;
+      }
+
+      .hf-admin-filter.is-active {
+        border-color: rgba(156, 255, 99, 0.3);
+        background: rgba(156, 255, 99, 0.12);
+        color: #eaffdc;
+      }
+
+      .hf-admin-list {
+        display: grid;
+        gap: 14px;
+      }
+
+      .hf-admin-empty {
+        padding: 22px;
+        text-align: center;
+      }
+
+      .hf-admin-empty[hidden] {
+        display: none;
+      }
+
+      .hf-admin-case {
+        display: grid;
+        gap: 16px;
+        padding: clamp(16px, 2.4vw, 24px);
+      }
+
+      .hf-admin-case__head {
+        display: flex;
+        align-items: flex-start;
+        justify-content: space-between;
+        gap: 14px;
+      }
+
+      .hf-admin-case__title {
+        display: grid;
+        gap: 8px;
+        min-width: 0;
+      }
+
+      .hf-admin-case__title h3 {
+        margin: 0;
+        color: var(--text);
+        font-size: clamp(1.2rem, 2.2vw, 1.8rem);
+        line-height: 1.1;
+        letter-spacing: -0.04em;
+        overflow-wrap: anywhere;
+      }
+
+      .hf-admin-case__repo {
+        color: #9cff63;
+        font-weight: 820;
+        text-decoration: none;
+        overflow-wrap: anywhere;
+      }
+
+      .hf-admin-case__repo:hover,
+      .hf-admin-case__repo:focus-visible {
+        text-decoration: underline;
+        text-underline-offset: 0.2em;
+      }
+
+      .hf-admin-case__body {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) minmax(280px, 0.45fr);
+        gap: 14px;
+      }
+
+      .hf-admin-case__panel {
+        display: grid;
+        gap: 10px;
+        min-width: 0;
+        padding: 14px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        border-radius: 22px;
+        background: rgba(0, 0, 0, 0.16);
+      }
+
+      .hf-admin-case__panel-title {
+        margin: 0;
+        color: rgba(235, 248, 255, 0.78);
+        font-size: 0.76rem;
+        font-weight: 840;
+        letter-spacing: 0.1em;
+        text-transform: uppercase;
+      }
+
+      .hf-admin-case__excerpt {
+        color: rgba(235, 248, 255, 0.86);
+        line-height: 1.65;
+        overflow-wrap: anywhere;
+      }
+
+      .hf-admin-case__comment {
+        border-left: 3px solid rgba(255, 209, 102, 0.48);
+        padding-left: 12px;
+        color: rgba(235, 248, 255, 0.86);
+        line-height: 1.6;
+      }
+
+      .hf-admin-case__actions {
+        justify-content: flex-end;
+      }
+
+      @media (max-width: 820px) {
+        .hf-admin-top,
+        .hf-admin-case__head {
+          display: grid;
+        }
+
+        .hf-admin-case__body {
+          grid-template-columns: 1fr;
+        }
+
+        .hf-admin-case__actions {
+          justify-content: flex-start;
+        }
+      }
+
+      .hf-article-page {
+        position: relative;
+        z-index: 2;
+        box-sizing: border-box;
+        height: 100vh;
+        height: 100dvh;
+        min-height: 100vh;
+        min-height: 100dvh;
+        padding: 0;
+        overflow: hidden;
+      }
+
+      .hf-article-page[hidden] {
+        display: none;
+      }
+
+      .hf-article-page [hidden] {
+        display: none !important;
+      }
+
+      .page.route-hf-article-editor {
+        height: 100vh;
+        height: 100dvh;
+        min-height: 100vh;
+        min-height: 100dvh;
+        overflow: hidden;
+      }
+
+      .page.route-hf-article-editor .shell {
+        display: block;
+        width: 100%;
+        height: 100%;
+        padding: 0;
+        grid-template-columns: none;
+        grid-template-areas: none;
+      }
+
+      .hf-article-shell {
+        display: grid;
+        grid-template-rows: auto minmax(0, 1fr);
+        gap: 0;
+        width: 100%;
+        height: 100%;
+        margin: 0 auto;
+        min-height: 0;
+      }
+
+      .hf-article-top,
+      .hf-article-editor,
+      .viewer-community-articles {
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 30px;
+        background:
+          radial-gradient(circle at 18% 0%, rgba(156, 255, 99, 0.1), transparent 32%),
+          linear-gradient(180deg, rgba(10, 19, 34, 0.9), rgba(4, 9, 17, 0.92));
+        box-shadow:
+          0 24px 70px rgba(0, 0, 0, 0.3),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      }
+
+      .viewer-community-articles {
+        background:
+          linear-gradient(180deg, rgba(6, 14, 25, 0.96) 0, rgba(5, 13, 24, 0.94) 44rem, rgba(5, 13, 24, 0.94) 100%);
+        isolation: isolate;
+        overflow: clip;
+      }
+
+      .viewer-community-articles::before,
+      .viewer-community-articles::after {
+        content: "";
+        position: absolute;
+        z-index: 0;
+        pointer-events: none;
+        border-radius: 999px;
+      }
+
+      .viewer-community-articles::before {
+        top: -240px;
+        left: clamp(-280px, -18vw, -140px);
+        width: min(820px, 92vw);
+        height: 660px;
+        background:
+          radial-gradient(ellipse at center, rgba(156, 255, 99, 0.14) 0%, rgba(156, 255, 99, 0.1) 24%, rgba(156, 255, 99, 0.04) 50%, rgba(156, 255, 99, 0) 74%);
+      }
+
+      .viewer-community-articles::after {
+        top: -210px;
+        right: clamp(-260px, -16vw, -120px);
+        width: min(780px, 86vw);
+        height: 620px;
+        background:
+          radial-gradient(ellipse at center, rgba(136, 215, 255, 0.1) 0%, rgba(136, 215, 255, 0.066) 28%, rgba(136, 215, 255, 0.026) 54%, rgba(136, 215, 255, 0) 76%);
+      }
+
+      .hf-article-top {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) auto;
+        align-items: stretch;
+        justify-content: space-between;
+        gap: clamp(16px, 2vw, 30px);
+        padding: clamp(12px, 1.65vw, 22px) clamp(16px, 2.2vw, 34px);
+        border-top: 0;
+        border-right: 0;
+        border-left: 0;
+        border-radius: 0 0 28px 28px;
+      }
+
+      .hf-article-top .eyebrow {
+        justify-self: start;
+        margin-bottom: 0;
+        gap: 9px;
+        padding: 0;
+        border-color: transparent;
+        background: transparent;
+        box-shadow: none;
+        font-size: 0.7rem;
+        letter-spacing: 0.13em;
+      }
+
+      .hf-article-top .eyebrow::before {
+        flex-basis: 8px;
+        width: 8px;
+        min-width: 8px;
+        height: 8px;
+        min-height: 8px;
+        box-shadow: 0 0 0 6px rgba(156, 255, 99, 0.08);
+      }
+
+      .hf-article-top__copy {
+        display: grid;
+        align-content: start;
+        gap: 8px;
+        min-width: 0;
+      }
+
+      .hf-article-top:not(.is-intro-open) .hf-article-top__copy {
+        gap: 5px;
+      }
+
+      .hf-article-top__permission[hidden] {
+        display: none;
+      }
+
+      .hf-article-status {
+        margin: 0;
+        color: rgba(197, 208, 227, 0.72);
+        line-height: 1.55;
+      }
+
+      .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;
+      }
+
+      .hf-article-actions {
+        display: flex;
+        flex-wrap: nowrap;
+        align-content: center;
+        align-items: center;
+        gap: 8px;
+        justify-content: flex-end;
+        max-width: min(1120px, 58vw);
+        min-width: min-content;
+      }
+
+      .hf-article-button {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: 8px;
+        min-height: 38px;
+        padding: 0 13px;
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 999px;
+        background:
+          linear-gradient(180deg, rgba(136, 215, 255, 0.11), rgba(136, 215, 255, 0.055)),
+          rgba(4, 11, 20, 0.58);
+        color: #dff7ff;
+        font: inherit;
+        font-size: 0.9rem;
+        font-weight: 760;
+        text-decoration: none;
+        white-space: nowrap;
+        cursor: pointer;
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.08),
+          0 10px 26px rgba(0, 0, 0, 0.16);
+        transition:
+          transform 160ms ease,
+          border-color 160ms ease,
+          background 160ms ease;
+      }
+
+      .hf-article-button:hover,
+      .hf-article-button:focus-visible {
+        border-color: rgba(136, 215, 255, 0.36);
+        background:
+          linear-gradient(180deg, rgba(136, 215, 255, 0.16), rgba(136, 215, 255, 0.08)),
+          rgba(4, 11, 20, 0.68);
+        transform: translateY(-1px);
+      }
+
+      .hf-article-button--ghost {
+        color: rgba(223, 247, 255, 0.76);
+        background: rgba(255, 255, 255, 0.035);
+        border-color: rgba(255, 255, 255, 0.1);
+        box-shadow: none;
+      }
+
+      .hf-article-button--danger {
+        color: #ffd9d9;
+        border-color: rgba(255, 132, 132, 0.22);
+        background: rgba(255, 96, 96, 0.08);
+      }
+
+      .hf-article-button--primary {
+        border-color: rgba(156, 255, 99, 0.32);
+        background: linear-gradient(135deg, var(--lime), #baff82);
+        color: var(--ink);
+        box-shadow:
+          0 18px 38px rgba(156, 255, 99, 0.16),
+          inset 0 1px 0 rgba(255, 255, 255, 0.45);
+      }
+
+      .hf-article-button svg {
+        width: 16px;
+        height: 16px;
+        flex: 0 0 auto;
+      }
+
+      .hf-article-editor {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) minmax(430px, 0.74fr);
+        align-items: stretch;
+        min-height: 0;
+        height: 100%;
+        gap: clamp(10px, 1vw, 16px);
+        padding: clamp(10px, 1.05vw, 16px);
+        overflow: hidden;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        transition:
+          grid-template-columns 340ms cubic-bezier(.2, .8, .2, 1),
+          gap 260ms ease;
+      }
+
+      .hf-article-page.is-reader-preview {
+        height: 100dvh;
+        min-height: 100dvh;
+        overflow: hidden;
+        padding: 0;
+      }
+
+      .hf-article-page.is-reader-preview .hf-article-shell {
+        display: flex;
+        height: 100%;
+        min-width: 0;
+      }
+
+      .hf-article-page.is-reader-preview .hf-article-top {
+        display: none;
+      }
+
+      .hf-article-page.is-reader-preview .hf-article-editor {
+        display: grid;
+        flex: 1 1 auto;
+        grid-template-columns: minmax(0, 1fr) minmax(430px, 0.74fr);
+        align-items: stretch;
+        width: 100%;
+        height: 100%;
+        min-width: 0;
+        min-height: 0;
+        overflow: hidden;
+      }
+
+      .hf-article-reader-preview-inline-host {
+        display: grid;
+        height: 100%;
+        min-height: 0;
+        overflow: hidden;
+      }
+
+      .hf-article-page.is-reader-preview .hf-article-editor__canvas {
+        height: calc(100dvh - clamp(20px, 2.1vw, 32px));
+        min-height: 0;
+        overflow-y: auto;
+        padding: 0;
+      }
+
+      .hf-article-page.is-reader-preview .hf-article-editor__canvas > :not(.hf-article-reader-preview-inline-host) {
+        display: none !important;
+      }
+
+      .hf-article-page.is-reader-preview .hf-article-editor__preview-head {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr);
+        gap: 8px;
+        padding: 4px 4px 0;
+      }
+
+      .hf-article-page.is-reader-preview .hf-article-editor__preview-report {
+        display: none !important;
+      }
+
+      .hf-article-page.is-reader-preview .hf-article-editor__preview {
+        position: sticky;
+        top: clamp(10px, 1vw, 16px);
+        align-self: stretch;
+        grid-template-rows: auto minmax(0, 1fr);
+        height: calc(100dvh - clamp(20px, 2.1vw, 32px));
+        min-height: 0;
+        max-height: calc(100dvh - clamp(20px, 2.1vw, 32px));
+      }
+
+      .hf-article-page.is-reader-preview .hf-article-editor__preview .hf-article-editor__iframe {
+        min-height: 0;
+        height: 100%;
+      }
+
+      .hf-article-reader-preview {
+        min-height: calc(100dvh - clamp(20px, 2.8vw, 36px));
+      }
+
+      .hf-article-reader-preview-inline-host .hf-article-reader-preview {
+        min-height: 0;
+        height: 100%;
+        overflow-y: auto;
+        padding: clamp(14px, 2vw, 24px);
+      }
+
+      .hf-article-reader-preview-inline-host .viewer-community-articles__layout {
+        display: block;
+      }
+
+      .hf-article-reader-preview-inline-host .viewer-community-articles__copy {
+        max-width: min(860px, 100%);
+        margin: 0 auto;
+      }
+
+      .hf-article-editor__canvas,
+      .hf-article-reader-preview,
+      body.route-viewer.route-viewer-article,
+      .page.route-viewer.viewer-community-article-active,
+      .viewer-community-articles,
+      .viewer-community-articles__copy {
+        overflow-anchor: none;
+      }
+
+      .hf-article-reader-preview-inline-host .viewer-community-articles__visual {
+        display: none;
+      }
+
+      .hf-article-preview-exit {
+        position: fixed;
+        top: clamp(12px, 1.65vw, 22px);
+        right: clamp(16px, 2.2vw, 34px);
+        z-index: 96;
+        background: rgba(5, 13, 25, 0.78);
+        border-color: rgba(255, 255, 255, 0.16);
+        backdrop-filter: blur(16px);
+      }
+
+      .hf-article-reader-preview-inline-host .hf-article-preview-exit {
+        position: sticky;
+        top: 0;
+        right: auto;
+        z-index: 40;
+        display: flex;
+        width: fit-content;
+        margin: 0 0 12px auto;
+        box-shadow:
+          0 12px 34px rgba(0, 0, 0, 0.26),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      }
+
+      .hf-article-editor__canvas,
+      .hf-article-editor__preview {
+        display: grid;
+        gap: 14px;
+        min-width: 0;
+        transition:
+          grid-template-columns 340ms cubic-bezier(.2, .8, .2, 1),
+          column-gap 260ms ease,
+          width 340ms cubic-bezier(.2, .8, .2, 1),
+          max-width 340ms cubic-bezier(.2, .8, .2, 1),
+          transform 340ms cubic-bezier(.2, .8, .2, 1),
+          border-color 220ms ease,
+          background 220ms ease;
+      }
+
+      .hf-article-editor__canvas {
+        grid-template-rows: auto max-content;
+        align-content: start;
+        height: 100%;
+        min-height: 0;
+        overflow-x: clip;
+        overflow-y: auto;
+        padding: clamp(10px, 1.1vw, 16px);
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        border-radius: 24px;
+        background:
+          radial-gradient(circle at 0% 0%, rgba(136, 215, 255, 0.07), transparent 30%),
+          rgba(0, 0, 0, 0.14);
+        scrollbar-color: #1b212f transparent;
+        scrollbar-width: thin;
+      }
+
+      .hf-article-editor__canvas::-webkit-scrollbar {
+        width: 8px;
+        height: 8px;
+      }
+
+      .hf-article-editor__canvas::-webkit-scrollbar-track {
+        border-radius: 999px;
+        background: transparent;
+        box-shadow: none;
+      }
+
+      .hf-article-editor__canvas::-webkit-scrollbar-thumb {
+        border-radius: 999px;
+        background: #1b212f;
+        box-shadow: none;
+      }
+
+      .hf-article-editor__canvas::-webkit-scrollbar-thumb:hover {
+        background: #242b3b;
+      }
+
+      .hf-article-editor__canvas::-webkit-scrollbar-corner {
+        background: transparent;
+      }
+
+      .hf-article-editor__preview {
+        --hf-article-preview-info-rail: clamp(260px, 34%, 340px);
+        --hf-article-preview-info-gap: clamp(12px, 1vw, 16px);
+        position: sticky;
+        top: clamp(10px, 1.05vw, 16px);
+        align-self: start;
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) 0px;
+        grid-template-rows: auto minmax(0, 1fr);
+        column-gap: 0;
+        height: 100%;
+        max-height: none;
+        min-height: 0;
+        overflow: hidden;
+        padding: 12px;
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 26px;
+        background: var(--preview-surface);
+        background-color: #07111d;
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
+      }
+
+      .hf-article-editor__preview::after {
+        content: "";
+        position: absolute;
+        top: calc(var(--hf-article-preview-head-height, 92px) + 18px);
+        right: 12px;
+        bottom: 12px;
+        left: 12px;
+        z-index: 2;
+        border: 1px solid rgba(136, 215, 255, 0.13);
+        border-radius: 20px;
+        background:
+          linear-gradient(100deg, transparent 0%, rgba(136, 215, 255, 0.12) 42%, transparent 68%) -180% 0 / 240% 100% no-repeat,
+          radial-gradient(circle at 42% 36%, rgba(156, 255, 99, 0.08), transparent 30%),
+          radial-gradient(circle at 64% 62%, rgba(136, 215, 255, 0.08), transparent 34%),
+          linear-gradient(180deg, rgba(9, 19, 32, 0.96), rgba(3, 8, 16, 0.98));
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.06),
+          0 18px 48px rgba(0, 0, 0, 0.18);
+        opacity: 0;
+        pointer-events: none;
+        transform: scale(0.992);
+        transition:
+          opacity 180ms ease,
+          transform 220ms ease;
+      }
+
+      .hf-article-editor__preview.is-loading-visual::after {
+        opacity: 1;
+        transform: scale(1);
+        animation: hf-article-visual-skeleton 1.45s ease-in-out infinite;
+      }
+
+      .hf-article-editor__preview-head {
+        position: relative;
+        z-index: 3;
+        grid-column: 1;
+        grid-row: 1;
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) auto;
+        gap: 10px;
+        align-items: start;
+        min-width: 0;
+        padding: 4px 4px 0;
+      }
+
+      .hf-article-editor__preview-title-stack {
+        position: relative;
+        grid-column: 1;
+        grid-row: 1;
+        min-height: 44px;
+        min-width: 0;
+      }
+
+      .hf-article-editor__preview-default,
+      .hf-article-editor__preview-node {
+        min-width: 0;
+        transition:
+          opacity 180ms ease,
+          transform 180ms ease;
+      }
+
+      .hf-article-editor__preview-node {
+        position: absolute;
+        inset: 0;
+        display: grid;
+        align-content: center;
+        gap: 5px;
+        opacity: 0;
+        pointer-events: none;
+        transform: translateY(8px);
+      }
+
+      .hf-article-editor__preview-head--node-selected .hf-article-editor__preview-default {
+        opacity: 0;
+        pointer-events: none;
+        transform: translateY(-8px);
+      }
+
+      .hf-article-editor__preview-head--node-selected .hf-article-editor__preview-node {
+        opacity: 1;
+        pointer-events: auto;
+        transform: none;
+      }
+
+      .hf-article-editor__preview-head--node-selected .hf-article-editor__preview-mention {
+        display: inline-flex;
+      }
+
+      .hf-article-editor__preview-kicker {
+        color: rgba(197, 208, 227, 0.56);
+        font-size: 0.72rem;
+        font-weight: 800;
+        letter-spacing: 0.12em;
+        text-transform: uppercase;
+      }
+
+      .hf-article-editor__preview-title {
+        display: block;
+        margin-top: 2px;
+        color: rgba(235, 248, 255, 0.92);
+        font-size: 0.98rem;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .hf-article-editor__preview-node-row {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        min-width: 0;
+      }
+
+      .hf-article-editor__preview-node-name {
+        min-width: 0;
+        color: rgba(235, 248, 255, 0.94);
+        font-family: "SFMono-Regular", "Cascadia Code", "Liberation Mono", Menlo, monospace;
+        font-size: clamp(0.9rem, 2.8vw, 1.08rem);
+        line-height: 1.05;
+        letter-spacing: -0.035em;
+        overflow-wrap: anywhere;
+      }
+
+      .hf-article-editor__preview-mention {
+        display: none;
+        align-items: center;
+        justify-content: center;
+        gap: 6px;
+        flex: 0 0 auto;
+        width: auto;
+        min-width: 106px;
+        min-height: 32px;
+        padding: 0 14px;
+        border: 1px solid rgba(156, 255, 99, 0.28);
+        border-radius: 999px;
+        background: rgba(156, 255, 99, 0.1);
+        color: rgba(226, 255, 213, 0.94);
+        font: inherit;
+        font-size: 0.68rem;
+        font-weight: 820;
+        letter-spacing: 0.11em;
+        text-transform: uppercase;
+        cursor: pointer;
+        transition:
+          background 160ms ease,
+          border-color 160ms ease,
+          color 160ms ease,
+          opacity 160ms ease;
+      }
+
+      .hf-article-editor__preview-mention:hover,
+      .hf-article-editor__preview-mention:focus-visible {
+        background: rgba(156, 255, 99, 0.16);
+        border-color: rgba(156, 255, 99, 0.42);
+        color: #ffffff;
+        outline: none;
+      }
+
+      .hf-article-editor__preview-mention:disabled {
+        cursor: default;
+        opacity: 0.55;
+      }
+
+      .hf-article-editor__preview-mention svg {
+        width: 14px;
+        height: 14px;
+        flex: 0 0 auto;
+      }
+
+      .hf-article-editor__preview-report {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        grid-column: 2;
+        grid-row: 1;
+        justify-self: end;
+        align-self: start;
+        gap: 7px;
+        width: fit-content;
+        min-height: 24px;
+        padding: 0;
+        border: 0;
+        border-radius: 999px;
+        background: transparent;
+        color: rgba(159, 173, 197, 0.78);
+        font: inherit;
+        font-size: 0.8rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+        cursor: pointer;
+        white-space: nowrap;
+        transition:
+          color 160ms ease,
+          opacity 160ms ease,
+          transform 160ms ease;
+      }
+
+      .hf-article-editor__preview-report:hover,
+      .hf-article-editor__preview-report:focus-visible {
+        color: var(--text);
+        opacity: 1;
+        outline: none;
+      }
+
+      .hf-article-editor__preview-report:active {
+        transform: translateY(1px);
+      }
+
+      .hf-article-editor__preview-report-icon,
+      .hf-article-editor__preview-report-icon svg {
+        width: 15px;
+        height: 15px;
+        flex: 0 0 auto;
+        display: inline-block;
+        opacity: 0.76;
+      }
+
+      .hf-article-granularity {
+        display: flex;
+        grid-column: 1 / -1;
+        grid-row: 2;
+        width: 100%;
+        max-width: 100%;
+        justify-content: space-between;
+        border-radius: 18px;
+        background: rgba(9, 15, 28, 0.72);
+        box-sizing: border-box;
+      }
+
+      .hf-article-granularity .viewer-granularity__slider {
+        flex: 1 1 120px;
+        width: auto;
+        min-width: 110px;
+      }
+
+      .hf-article-granularity .viewer-granularity__value {
+        flex: 0 0 7.2ch;
+        width: 7.2ch;
+        min-width: 7.2ch;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .hf-article-field {
+        display: grid;
+        gap: 7px;
+        min-width: 0;
+      }
+
+      .hf-article-field__head {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 12px;
+      }
+
+      .hf-article-field__label {
+        color: rgba(197, 208, 227, 0.7);
+        font-size: 0.78rem;
+        font-weight: 780;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .hf-article-field__budget {
+        color: rgba(197, 208, 227, 0.56);
+        font-size: 0.78rem;
+        font-weight: 650;
+        letter-spacing: 0.01em;
+        text-align: right;
+        white-space: nowrap;
+      }
+
+      .hf-article-field__budget.is-over {
+        color: #ffb8b8;
+      }
+
+      .hf-article-input,
+      .hf-article-textarea,
+      .hf-article-body {
+        width: 100%;
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        border-radius: 18px;
+        background: rgba(0, 0, 0, 0.26);
+        color: var(--text);
+        font: inherit;
+        outline: none;
+      }
+
+      .hf-article-input,
+      .hf-article-textarea {
+        padding: 13px 14px;
+      }
+
+      .hf-article-input {
+        font-size: clamp(1.05rem, 1.55vw, 1.7rem);
+        font-weight: 820;
+        letter-spacing: -0.045em;
+        line-height: 1.08;
+      }
+
+      .hf-article-field--title {
+        gap: 0;
+      }
+
+      .hf-article-field--title .hf-article-input {
+        padding: 0;
+        overflow: hidden;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        text-overflow: ellipsis;
+      }
+
+      .hf-article-field--title .hf-article-input:hover,
+      .hf-article-field--title .hf-article-input:focus {
+        border-radius: 12px;
+        outline: 1px solid rgba(136, 215, 255, 0.38);
+        outline-offset: 6px;
+        background: rgba(136, 215, 255, 0.04);
+        box-shadow: 0 0 0 5px rgba(136, 215, 255, 0.035);
+        cursor: text;
+      }
+
+      .hf-article-field--intro {
+        max-width: 980px;
+        gap: 4px;
+        max-height: 0;
+        overflow: hidden;
+        opacity: 0;
+        pointer-events: none;
+        transform: translateY(-6px);
+        transition:
+          max-height 210ms ease,
+          opacity 170ms ease,
+          transform 210ms ease;
+      }
+
+      .hf-article-top.is-intro-open .hf-article-field--intro {
+        max-height: 124px;
+        opacity: 1;
+        pointer-events: auto;
+        transform: translateY(0);
+      }
+
+      .hf-article-field--intro .hf-article-field__head {
+        gap: 8px;
+      }
+
+      .hf-article-field--intro .hf-article-textarea {
+        min-height: 42px;
+        max-height: 72px;
+        padding: 7px 0 0;
+        overflow: auto;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        color: rgba(197, 208, 227, 0.78);
+        font-size: 0.94rem;
+        line-height: 1.42;
+        resize: none;
+      }
+
+      .hf-article-textarea {
+        min-height: 84px;
+        resize: vertical;
+        line-height: 1.55;
+      }
+
+      .hf-article-body {
+        align-self: stretch;
+        box-sizing: border-box;
+        min-height: var(--hf-article-body-min-height, max(430px, calc(100dvh - 360px)));
+        height: auto;
+        padding: 18px;
+        line-height: 1.75;
+        overflow: visible;
+        overflow-wrap: anywhere;
+        scrollbar-color: #1b212f transparent;
+        scrollbar-width: thin;
+      }
+
+      #hf-article-body {
+        clip-path: inset(0 round 18px);
+      }
+
+      .hf-article-input::selection,
+      .hf-article-textarea::selection,
+      .hf-article-body ::selection,
+      .hf-article-body::selection {
+        background: rgba(255, 210, 126, 0.3);
+        color: rgba(255, 249, 230, 0.98);
+      }
+
+      .hf-article-body::-webkit-scrollbar {
+        width: 8px;
+        height: 8px;
+      }
+
+      .hf-article-body::-webkit-scrollbar-track {
+        border-radius: 999px;
+        background: transparent;
+      }
+
+      .hf-article-body::-webkit-scrollbar-thumb {
+        border-radius: 999px;
+        background: #1b212f;
+      }
+
+      .hf-article-body::-webkit-scrollbar-thumb:hover {
+        background: #242b3b;
+      }
+
+      .hf-article-body::-webkit-scrollbar-corner {
+        background: transparent;
+      }
+
+      .hf-article-body p,
+      .hf-article-body blockquote,
+      .hf-article-body ul,
+      .hf-article-body ol {
+        margin: 0 0 1em;
+      }
+
+      .hf-article-body h2,
+      .hf-article-body h3 {
+        margin: 1.15em 0 0.45em;
+        color: rgba(235, 248, 255, 0.96);
+        letter-spacing: -0.045em;
+        line-height: 1.08;
+      }
+
+      #hf-article-body > :first-child {
+        margin-top: 0;
+      }
+
+      .hf-article-body h2 {
+        font-size: clamp(1.6rem, 3vw, 2.25rem);
+      }
+
+      .hf-article-body h3 {
+        font-size: clamp(1.25rem, 2.2vw, 1.6rem);
+      }
+
+      .hf-article-body blockquote {
+        position: relative;
+        isolation: isolate;
+        padding: 22px 8px 22px 52px;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        color: rgba(231, 243, 252, 0.92);
+        overflow: visible;
+      }
+
+      .hf-article-body blockquote::before {
+        content: "";
+        position: absolute;
+        z-index: 1;
+        top: 50%;
+        left: 19px;
+        width: 10px;
+        height: 10px;
+        border-radius: 999px;
+        background: #9cff63;
+        box-shadow:
+          0 0 0 8px rgba(156, 255, 99, 0.065),
+          0 0 30px rgba(156, 255, 99, 0.36),
+          0 0 72px rgba(136, 215, 255, 0.12);
+        transform: translateY(-50%);
+        pointer-events: none;
+      }
+
+      .hf-article-body blockquote::after {
+        content: "";
+        position: absolute;
+        z-index: 0;
+        top: 50%;
+        left: -82px;
+        width: 274px;
+        height: 154px;
+        border-radius: 999px;
+        opacity: 0.88;
+        background: rgba(156, 255, 99, 0.14);
+        box-shadow:
+          92px -22px 92px rgba(136, 215, 255, 0.13),
+          160px 40px 92px rgba(136, 215, 255, 0.062);
+        filter: blur(24px);
+        transform: translateY(-50%);
+        pointer-events: none;
+      }
+
+      .hf-article-body ul,
+      .hf-article-body ol {
+        padding-left: 1.35em;
+      }
+
+      .hf-article-body li {
+        margin: 0.26em 0;
+      }
+
+      .hf-article-body a,
+      .viewer-community-articles__body a:not(.viewer-node-link) {
+        color: rgba(161, 232, 255, 0.96);
+        text-decoration-color: rgba(136, 215, 255, 0.45);
+        text-underline-offset: 0.16em;
+      }
+
+      .hf-article-body a.viewer-community-articles__muted-link,
+      .viewer-community-articles__body a.viewer-community-articles__muted-link {
+        color: inherit;
+        text-decoration: none;
+        border-radius: 0.45em;
+        transition:
+          color 160ms ease,
+          background 160ms ease,
+          box-shadow 160ms ease;
+      }
+
+      .hf-article-body a.viewer-community-articles__muted-link:hover,
+      .hf-article-body a.viewer-community-articles__muted-link:focus-visible,
+      .viewer-community-articles__body a.viewer-community-articles__muted-link:hover,
+      .viewer-community-articles__body a.viewer-community-articles__muted-link:focus-visible {
+        color: rgba(235, 248, 255, 0.94);
+        text-decoration: none;
+        background: rgba(136, 215, 255, 0.07);
+        box-shadow: 0 0 0 4px rgba(136, 215, 255, 0.06);
+        outline: none;
+      }
+
+      .hf-article-body code,
+      .viewer-community-articles__body code {
+        padding: 0.08em 0.34em;
+        border-radius: 0.45em;
+        border: 1px solid rgba(197, 208, 227, 0.16);
+        background: rgba(1, 7, 14, 0.58);
+        color: rgba(226, 237, 246, 0.92);
+        font-family: "SFMono-Regular", "Cascadia Code", "Liberation Mono", Menlo, monospace;
+        font-size: 0.92em;
+        box-decoration-break: clone;
+        -webkit-box-decoration-break: clone;
+      }
+
+      .hf-article-body .viewer-community-articles__keycap,
+      .viewer-community-articles__body .viewer-community-articles__keycap {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: auto;
+        min-width: 1.58em;
+        height: 1.5em;
+        padding: 0 0.42em;
+        margin: -0.02em 0.08em 0;
+        text-transform: none;
+        vertical-align: 0.03em;
+        white-space: nowrap;
+      }
+
+      .hf-article-body .viewer-community-articles__inline-media,
+      .viewer-community-articles__body .viewer-community-articles__inline-media {
+        display: inline-flex;
+        align-items: center;
+        max-width: min(100%, 24em);
+        height: 1.85em;
+        margin: -0.18em 0.06em -0.26em;
+        border: 1px solid rgba(136, 215, 255, 0.12);
+        border-radius: 0.58em;
+        background:
+          linear-gradient(90deg, rgba(16, 255, 166, 0.08), rgba(136, 215, 255, 0.035)),
+          rgba(0, 7, 13, 0.42);
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.05),
+          0 8px 20px rgba(0, 0, 0, 0.2);
+        overflow: hidden;
+        vertical-align: -0.48em;
+      }
+
+      .hf-article-body .viewer-community-articles__inline-media img,
+      .viewer-community-articles__body .viewer-community-articles__inline-media img {
+        display: block;
+        width: auto;
+        height: 100%;
+        max-width: 100%;
+        object-fit: contain;
+      }
+
+      .hf-article-body .viewer-community-articles__math-var,
+      .viewer-community-articles__body .viewer-community-articles__math-var {
+        white-space: nowrap;
+      }
+
+      .hf-article-body .viewer-community-articles__math-var sub,
+      .viewer-community-articles__body .viewer-community-articles__math-var sub {
+        position: relative;
+        bottom: -0.22em;
+        font-size: 0.68em;
+        line-height: 0;
+      }
+
+      .hf-article-body pre,
+      .viewer-community-articles__body pre {
+        overflow: auto;
+        margin: 1.05em 0;
+        padding: 16px;
+        border: 1px solid rgba(136, 215, 255, 0.14);
+        border-radius: 18px;
+        background:
+          linear-gradient(135deg, rgba(136, 215, 255, 0.08), rgba(156, 255, 99, 0.035)),
+          rgba(1, 7, 14, 0.88);
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
+        scrollbar-color: rgba(136, 215, 255, 0.28) rgba(1, 7, 14, 0.35);
+        scrollbar-width: thin;
+      }
+
+      .hf-article-body pre::-webkit-scrollbar,
+      .viewer-community-articles__body pre::-webkit-scrollbar {
+        width: 10px;
+        height: 10px;
+      }
+
+      .hf-article-body pre::-webkit-scrollbar-track,
+      .viewer-community-articles__body pre::-webkit-scrollbar-track {
+        border-radius: 999px;
+        background: rgba(1, 7, 14, 0.35);
+      }
+
+      .hf-article-body pre::-webkit-scrollbar-thumb,
+      .viewer-community-articles__body pre::-webkit-scrollbar-thumb {
+        border: 2px solid rgba(1, 7, 14, 0.35);
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.28);
+      }
+
+      .hf-article-body pre::-webkit-scrollbar-thumb:hover,
+      .viewer-community-articles__body pre::-webkit-scrollbar-thumb:hover {
+        background: rgba(136, 215, 255, 0.42);
+      }
+
+      .hf-article-body pre code,
+      .viewer-community-articles__body pre code {
+        display: block;
+        min-height: 4.8em;
+        padding: 0;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        color: rgba(232, 246, 255, 0.92);
+        font: 0.88rem/1.42 "SFMono-Regular", "Cascadia Code", "Liberation Mono", Menlo, monospace;
+        tab-size: 2;
+        white-space: pre;
+        box-decoration-break: initial;
+        -webkit-box-decoration-break: initial;
+      }
+
+      .hf-article-body pre code *,
+      .viewer-community-articles__body pre code * {
+        line-height: inherit;
+      }
+
+      .hf-article-body pre code .viewer-node-link,
+      .viewer-community-articles__body pre code .viewer-node-link {
+        display: inline !important;
+        width: auto !important;
+        min-width: 0 !important;
+        margin: 0 !important;
+        padding: 0 !important;
+        border: 0 !important;
+        border-radius: 0 !important;
+        background: transparent !important;
+        box-shadow: none !important;
+        color: rgba(var(--viewer-node-link-text-rgb), 0.96) !important;
+        font: inherit;
+        line-height: inherit !important;
+        vertical-align: baseline !important;
+        white-space: inherit;
+        text-decoration-thickness: 1px;
+        text-underline-offset: 0.17em;
+      }
+
+      .hf-article-body pre code .viewer-node-link:hover,
+      .hf-article-body pre code .viewer-node-link:focus-visible,
+      .hf-article-body pre code .viewer-node-link.is-active,
+      .viewer-community-articles__body pre code .viewer-node-link:hover,
+      .viewer-community-articles__body pre code .viewer-node-link:focus-visible,
+      .viewer-community-articles__body pre code .viewer-node-link.is-active {
+        border-radius: 0 !important;
+        background: transparent !important;
+        box-shadow: none !important;
+        color: rgba(var(--viewer-node-link-text-rgb), 0.98) !important;
+      }
+
+      .viewer-community-articles__inline-code-node,
+      .viewer-community-articles__inline-code-group {
+        display: inline;
+      }
+
+      .viewer-community-articles__inline-code-node .viewer-node-link,
+      .viewer-community-articles__inline-code-group .viewer-node-link {
+        display: inline;
+        box-shadow: none;
+        background: transparent;
+        font: inherit;
+        text-decoration-thickness: 1px;
+        text-underline-offset: 0.17em;
+      }
+
+      .hf-article-body pre code:focus {
+        outline: none;
+      }
+
+      .hf-article-body pre:focus-within {
+        border-color: rgba(136, 215, 255, 0.34);
+        box-shadow:
+          0 0 0 1px rgba(136, 215, 255, 0.08),
+          0 18px 48px rgba(0, 0, 0, 0.22);
+      }
+
+      .hf-article-body pre code:empty::before {
+        content: "# Python code";
+        color: rgba(197, 208, 227, 0.42);
+      }
+
+      .hf-article-code-token--keyword {
+        color: #88d7ff;
+      }
+
+      .hf-article-code-token--builtin {
+        color: #a2ff8a;
+      }
+
+      .hf-article-code-token--definition {
+        color: #ffe7a3;
+      }
+
+      .hf-article-code-token--call {
+        color: #9fe8ff;
+      }
+
+      .hf-article-code-token--property {
+        color: #c8f7ff;
+      }
+
+      .hf-article-code-token--dunder {
+        color: #b7c5ff;
+      }
+
+      .hf-article-code-token--constant {
+        color: #ffb4df;
+      }
+
+      .hf-article-code-token--module {
+        color: #b7ffc7;
+      }
+
+      .hf-article-code-token--decorator {
+        color: #c7a6ff;
+      }
+
+      .hf-article-code-token--string {
+        color: #ffd27e;
+      }
+
+      .hf-article-code-token--number {
+        color: #ff9ecb;
+      }
+
+      .hf-article-code-token--operator,
+      .hf-article-code-token--punctuation {
+        color: rgba(184, 210, 226, 0.72);
+      }
+
+      .hf-article-code-token--comment {
+        color: rgba(197, 208, 227, 0.56);
+        font-style: italic;
+      }
+
+      .hf-article-body:empty::before {
+        content: "Write a model walkthrough, you can use @ to mention layers in the model.";
+        color: rgba(197, 208, 227, 0.45);
+      }
+
+      .hf-article-toolbar {
+        --hf-article-toolbar-scroll-mask-height: calc(clamp(10px, 1.1vw, 16px) + 20px);
+        display: flex;
+        position: sticky;
+        top: 0;
+        z-index: 5;
+        isolation: isolate;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: 6px;
+        overflow: visible;
+        padding: 7px;
+        border: 1px solid rgba(136, 215, 255, 0.1);
+        border-radius: 18px;
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.02)),
+          rgba(2, 8, 16, 0.84);
+        backdrop-filter: blur(16px);
+        box-sizing: border-box;
+        transition:
+          height 280ms cubic-bezier(0.2, 0.8, 0.2, 1),
+          max-height 280ms cubic-bezier(0.2, 0.8, 0.2, 1),
+          padding 220ms ease,
+          gap 220ms ease,
+          border-radius 220ms ease,
+          background 220ms ease,
+          box-shadow 220ms ease;
+      }
+
+      .hf-article-toolbar::before {
+        content: "";
+        position: absolute;
+        right: calc(-1 * clamp(10px, 1.1vw, 16px) - 2px);
+        bottom: calc(100% - 1px);
+        left: calc(-1 * clamp(10px, 1.1vw, 16px) - 2px);
+        z-index: -1;
+        height: var(--hf-article-toolbar-scroll-mask-height);
+        pointer-events: none;
+        background:
+          radial-gradient(circle at 0% 0%, rgba(136, 215, 255, 0.07), transparent 55%),
+          linear-gradient(180deg, rgba(4, 10, 19, 0.98), rgba(3, 9, 18, 0.94));
+        backdrop-filter: blur(10px);
+      }
+
+      .hf-article-toolbar.is-size-morphing {
+        overflow: hidden !important;
+        scrollbar-width: none;
+        will-change: height, max-height;
+      }
+
+      .hf-article-toolbar.is-size-morphing::-webkit-scrollbar {
+        display: none;
+      }
+
+      .hf-article-toolbar__group {
+        display: flex;
+        flex: 0 1 auto;
+        flex-wrap: wrap;
+        min-width: 0;
+        gap: 3px;
+        padding: 3px;
+        border: 1px solid rgba(255, 255, 255, 0.07);
+        border-radius: 14px;
+        background: rgba(2, 8, 16, 0.46);
+      }
+
+      .hf-article-toolbar .hf-article-status {
+        flex: 1 1 130px;
+        min-width: 120px;
+        overflow: hidden;
+        font-size: 0.78rem;
+        text-align: right;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .hf-article-tool {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: 7px;
+        min-height: 30px;
+        padding: 0 8px;
+        border: 0;
+        border-radius: 11px;
+        background: transparent;
+        color: rgba(223, 247, 255, 0.76);
+        font: inherit;
+        font-size: 0.78rem;
+        font-weight: 780;
+        cursor: pointer;
+        transition:
+          background 150ms ease,
+          color 150ms ease,
+          transform 150ms ease;
+      }
+
+      .hf-article-tool:hover,
+      .hf-article-tool:focus-visible,
+      .hf-article-tool.is-active {
+        background: rgba(136, 215, 255, 0.12);
+        color: rgba(235, 248, 255, 0.96);
+        outline: none;
+      }
+
+      .hf-article-tool:active {
+        transform: translateY(1px);
+      }
+
+      .hf-article-tool--accent {
+        background: rgba(156, 255, 99, 0.09);
+        color: rgba(235, 255, 218, 0.94);
+      }
+
+      .hf-article-tool svg,
+      .hf-article-node-icon {
+        width: 17px;
+        height: 17px;
+        flex: 0 0 auto;
+        color: currentColor;
+      }
+
+      .hf-article-tool--icon-only {
+        width: 32px;
+        padding: 0;
+      }
+
+      .hf-article-toolbar-tooltip {
+        position: fixed;
+        z-index: 10000;
+        max-width: min(240px, calc(100vw - 24px));
+        padding: 7px 10px;
+        border: 1px solid rgba(136, 215, 255, 0.22);
+        border-radius: 10px;
+        background:
+          linear-gradient(180deg, rgba(21, 39, 54, 0.98), rgba(5, 13, 22, 0.98));
+        box-shadow:
+          0 14px 34px rgba(0, 0, 0, 0.34),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        color: rgba(235, 248, 255, 0.96);
+        font-size: 0.75rem;
+        font-weight: 760;
+        line-height: 1.2;
+        letter-spacing: 0.01em;
+        pointer-events: none;
+        opacity: 0;
+        transform: translate(-50%, calc(-100% - 8px)) scale(0.98);
+        transition:
+          opacity 120ms ease,
+          transform 120ms ease;
+      }
+
+      .hf-article-toolbar-tooltip::after {
+        content: "";
+        position: absolute;
+        left: 50%;
+        bottom: -5px;
+        width: 9px;
+        height: 9px;
+        border-right: 1px solid rgba(136, 215, 255, 0.22);
+        border-bottom: 1px solid rgba(136, 215, 255, 0.22);
+        background: rgba(5, 13, 22, 0.98);
+        transform: translateX(-50%) rotate(45deg);
+      }
+
+      .hf-article-toolbar-tooltip.is-below::after {
+        top: -5px;
+        bottom: auto;
+        border-right: 0;
+        border-bottom: 0;
+        border-left: 1px solid rgba(136, 215, 255, 0.22);
+        border-top: 1px solid rgba(136, 215, 255, 0.22);
+      }
+
+      .hf-article-toolbar-tooltip.is-visible {
+        opacity: 1;
+        transform: translate(-50%, calc(-100% - 10px)) scale(1);
+      }
+
+      @media (min-width: 981px) {
+        .hf-article-page.is-preview-side-rail-open .hf-article-editor {
+          grid-template-columns: minmax(300px, 0.58fr) minmax(680px, 1.22fr);
+          gap: clamp(8px, 0.8vw, 13px);
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-editor__preview {
+          --hf-article-preview-graph-column: calc(
+            100% - var(--hf-article-preview-info-rail) - var(--hf-article-preview-info-gap)
+          );
+          --hf-article-preview-frame-cut: calc(var(--hf-article-preview-head-height, 92px) + 14px);
+          grid-template-columns: minmax(0, 1fr) var(--hf-article-preview-info-rail);
+          grid-template-rows: auto minmax(0, 1fr);
+          column-gap: var(--hf-article-preview-info-gap);
+          row-gap: 14px;
+          background: var(--preview-surface);
+          background-color: #07111d;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-editor__preview-head {
+          z-index: 3;
+          grid-column: 1;
+          grid-row: 1;
+          align-self: stretch;
+          justify-self: start;
+          width: min(100%, var(--hf-article-preview-graph-slot-width, 100%));
+          min-width: 0;
+          max-width: min(100%, var(--hf-article-preview-graph-slot-width, 100%));
+          box-sizing: border-box;
+          overflow: clip;
+          padding: 4px 4px 0;
+          contain: paint;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-editor__preview-title-stack,
+        .hf-article-page.is-preview-side-rail-open .hf-article-editor__preview-default,
+        .hf-article-page.is-preview-side-rail-open .hf-article-editor__preview-node {
+          min-width: 0;
+          max-width: 100%;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-editor__preview-node-row {
+          display: grid;
+          grid-template-columns: minmax(0, 1fr) minmax(78px, auto);
+          align-items: center;
+          width: 100%;
+          min-width: 0;
+          max-width: 100%;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-editor__preview-node-name {
+          min-width: 0;
+          max-width: 100%;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-editor__preview-mention {
+          justify-self: end;
+          width: auto;
+          min-width: 92px;
+          max-width: min(104px, 100%);
+          padding-inline: 12px;
+          transform: translateZ(0);
+          will-change: transform;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-editor__preview-report {
+          display: none;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-granularity {
+          box-sizing: border-box;
+          display: grid;
+          grid-template-columns: minmax(0, max-content) minmax(54px, 1fr) minmax(5.8ch, auto);
+          align-items: center;
+          justify-content: stretch;
+          gap: 8px;
+          width: 100%;
+          min-width: 0;
+          max-width: 100%;
+          overflow: clip;
+          clip-path: inset(0 round 18px);
+          transform: translateZ(0);
+          will-change: transform;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-granularity .viewer-granularity__label,
+        .hf-article-page.is-preview-side-rail-open .hf-article-granularity .viewer-granularity__value {
+          min-width: 0;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-granularity .viewer-granularity__slider {
+          width: 100%;
+          min-width: 54px;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-granularity .viewer-granularity__value {
+          justify-self: end;
+          flex-basis: auto;
+        }
+
+        .hf-article-page.is-preview-info-open .hf-article-editor__iframe {
+          z-index: 1;
+          grid-column: 1 / -1;
+          grid-row: 1 / 3;
+          height: 100%;
+          min-height: 0;
+          border-color: transparent;
+          background: var(--preview-surface);
+          background-color: #07111d;
+          -webkit-clip-path: var(--hf-article-preview-frame-clip, none);
+          clip-path: var(--hf-article-preview-frame-clip, none);
+        }
+
+        .hf-article-page.is-preview-graph-detail-open .hf-article-editor__iframe {
+          grid-column: 1;
+          grid-row: 2;
+          height: 100%;
+          min-height: 0;
+          border-color: rgba(255, 255, 255, 0.1);
+          filter: saturate(0.94) brightness(0.88);
+          -webkit-clip-path: none;
+          clip-path: none;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-toolbar {
+          flex-wrap: nowrap;
+          align-items: center;
+          gap: 5px;
+          overflow-x: auto;
+          overflow-y: hidden;
+          overscroll-behavior-x: contain;
+          min-height: 68px;
+          padding: 8px;
+          scrollbar-width: none;
+          -webkit-overflow-scrolling: touch;
+          box-shadow:
+            0 0 0 6px rgba(3, 9, 18, 0.86),
+            0 0 0 7px rgba(136, 215, 255, 0.12),
+            0 16px 42px rgba(0, 0, 0, 0.2),
+            inset 0 1px 0 rgba(255, 255, 255, 0.06);
+          transition:
+            height 280ms cubic-bezier(0.2, 0.8, 0.2, 1),
+            max-height 280ms cubic-bezier(0.2, 0.8, 0.2, 1),
+            padding 220ms ease,
+            gap 220ms ease,
+            border-radius 220ms ease,
+            background 220ms ease,
+            box-shadow 220ms ease;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-toolbar::-webkit-scrollbar {
+          display: none;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-toolbar__group {
+          flex: 0 0 auto;
+          flex-wrap: nowrap;
+          align-items: center;
+          gap: 3px;
+          min-height: 52px;
+          padding: 4px;
+          border-radius: 15px;
+          transition:
+            padding 180ms ease,
+            gap 180ms ease,
+            border-radius 180ms ease;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-toolbar .hf-article-status {
+          display: none;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-tool {
+          min-height: 42px;
+          padding: 0 12px;
+          font-size: 0.78rem;
+        }
+
+        .hf-article-page.is-preview-side-rail-open .hf-article-tool--icon-only {
+          width: 42px;
+          padding: 0;
+        }
+      }
+
+      .hf-article-node-icon {
+        width: 16px;
+        height: 16px;
+        color: currentColor;
+      }
+
+      .hf-article-node-menu {
+        position: fixed;
+        z-index: 500;
+        width: min(420px, calc(100vw - 28px));
+        max-height: 320px;
+        overflow: auto;
+        padding: 8px;
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 18px;
+        background: rgba(5, 11, 21, 0.96);
+        box-shadow: 0 24px 70px rgba(0, 0, 0, 0.44);
+        scrollbar-color: rgba(197, 208, 227, 0.26) rgba(255, 255, 255, 0.025);
+        scrollbar-width: thin;
+      }
+
+      .hf-article-node-menu[data-mode="retarget"] {
+        z-index: 560;
+      }
+
+      .hf-article-node-menu::-webkit-scrollbar {
+        width: 10px;
+        height: 10px;
+      }
+
+      .hf-article-node-menu::-webkit-scrollbar-track {
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.025);
+      }
+
+      .hf-article-node-menu::-webkit-scrollbar-thumb {
+        border: 3px solid rgba(5, 11, 21, 0.96);
+        border-radius: 999px;
+        background: rgba(197, 208, 227, 0.24);
+      }
+
+      .hf-article-node-menu::-webkit-scrollbar-thumb:hover {
+        background: rgba(197, 208, 227, 0.34);
+      }
+
+      .hf-article-node-menu::-webkit-scrollbar-corner {
+        background: transparent;
+      }
+
+      .hf-article-node-menu[hidden] {
+        display: none;
+      }
+
+      .hf-article-popover {
+        position: fixed;
+        z-index: 520;
+        width: min(380px, calc(100vw - 28px));
+        padding: 10px;
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 20px;
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.025)),
+          rgba(5, 11, 21, 0.97);
+        box-shadow: 0 24px 74px rgba(0, 0, 0, 0.48);
+        backdrop-filter: blur(18px);
+      }
+
+      .hf-article-popover[hidden] {
+        display: none;
+      }
+
+      .hf-article-popover__form {
+        display: grid;
+        gap: 10px;
+      }
+
+      .hf-article-popover__head,
+      .hf-article-popover__actions {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 10px;
+      }
+
+      .hf-article-popover__head strong {
+        color: rgba(235, 248, 255, 0.96);
+        font-size: 0.9rem;
+        letter-spacing: -0.01em;
+      }
+
+      .hf-article-popover__close {
+        display: inline-grid;
+        place-items: center;
+        width: 28px;
+        height: 28px;
+        border: 0;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.07);
+        color: rgba(223, 247, 255, 0.8);
+        font: inherit;
+        font-size: 1.25rem;
+        line-height: 1;
+        cursor: pointer;
+      }
+
+      .hf-article-popover__close:hover,
+      .hf-article-popover__close:focus-visible {
+        background: rgba(136, 215, 255, 0.14);
+        color: rgba(235, 248, 255, 0.98);
+        outline: none;
+      }
+
+      .hf-article-popover__field {
+        display: grid;
+        gap: 5px;
+      }
+
+      .hf-article-popover__field span {
+        color: rgba(197, 208, 227, 0.62);
+        font-size: 0.72rem;
+        font-weight: 760;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .hf-article-popover__field input,
+      .hf-article-popover__field textarea {
+        width: 100%;
+        padding: 10px 11px;
+        border: 1px solid rgba(255, 255, 255, 0.11);
+        border-radius: 13px;
+        background: rgba(0, 0, 0, 0.26);
+        color: rgba(235, 248, 255, 0.94);
+        font: inherit;
+        font-size: 0.9rem;
+        outline: none;
+      }
+
+      .hf-article-popover__field textarea {
+        min-height: min(42vh, 360px);
+        resize: vertical;
+        font-family: "SFMono-Regular", "Cascadia Code", "Liberation Mono", Menlo, monospace;
+        font-size: 0.82rem;
+        line-height: 1.45;
+        white-space: pre;
+        overflow: auto;
+        tab-size: 2;
+      }
+
+      .hf-article-popover__field input:focus,
+      .hf-article-popover__field textarea:focus {
+        border-color: rgba(136, 215, 255, 0.42);
+        box-shadow: 0 0 0 3px rgba(136, 215, 255, 0.1);
+      }
+
+      .hf-article-popover__field input[readonly],
+      .hf-article-popover__field textarea[readonly] {
+        color: rgba(197, 208, 227, 0.62);
+        cursor: default;
+      }
+
+      .hf-article-popover--markdown {
+        width: min(720px, calc(100vw - 28px));
+        max-width: calc(100vw - 28px);
+      }
+
+      .hf-article-node-configure {
+        position: fixed;
+        z-index: 515;
+        display: inline-grid;
+        place-items: center;
+        width: 22px;
+        height: 22px;
+        border: 0;
+        border-radius: 999px;
+        background: rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.28);
+        color: rgba(var(--viewer-node-link-text-rgb, 201, 227, 238), 0.92);
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
+        cursor: pointer;
+        opacity: 0;
+        pointer-events: none;
+        transform: scale(0.9);
+        transition:
+          opacity 140ms ease,
+          transform 160ms cubic-bezier(0.2, 0.9, 0.2, 1),
+          background 160ms ease;
+      }
+
+      .hf-article-node-configure:not([hidden]) {
+        opacity: 0.78;
+        pointer-events: auto;
+        transform: scale(1);
+      }
+
+      .hf-article-node-configure:hover,
+      .hf-article-node-configure:focus-visible {
+        opacity: 1;
+        background: rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.42);
+        outline: none;
+      }
+
+      .hf-article-node-configure svg {
+        width: 13px;
+        height: 13px;
+      }
+
+      .hf-article-popover__hint {
+        margin: -2px 2px 0;
+        color: rgba(197, 208, 227, 0.58);
+        font-size: 0.76rem;
+        line-height: 1.4;
+      }
+
+      .hf-article-popover__button {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        min-height: 32px;
+        padding: 0 12px;
+        border: 0;
+        border-radius: 999px;
+        font: inherit;
+        font-size: 0.78rem;
+        font-weight: 780;
+        cursor: pointer;
+      }
+
+      .hf-article-popover__button--ghost {
+        background: rgba(255, 255, 255, 0.07);
+        color: rgba(223, 247, 255, 0.74);
+      }
+
+      .hf-article-popover__button--primary {
+        background: linear-gradient(135deg, #a9ff68, #5edbff);
+        color: #07100c;
+        box-shadow: 0 10px 26px rgba(94, 219, 255, 0.18);
+      }
+
+      .hf-article-node-option {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        width: 100%;
+        padding: 10px 11px;
+        border: 0;
+        border-radius: 13px;
+        background: transparent;
+        color: var(--text);
+        text-align: left;
+        cursor: pointer;
+      }
+
+      .hf-article-node-option:hover,
+      .hf-article-node-option:focus-visible {
+        background: rgba(136, 215, 255, 0.1);
+      }
+
+      .hf-article-node-menu.is-pointer-hover-locked .hf-article-node-option:hover {
+        background: transparent;
+      }
+
+      .hf-article-node-option.is-active {
+        background: rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.14);
+      }
+
+      .hf-article-node-option__swatch {
+        width: 12px;
+        height: 12px;
+        flex: 0 0 auto;
+        border: 1px solid rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.8);
+        border-radius: 4px;
+        background: rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.72);
+        box-shadow:
+          0 0 0 3px rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.14),
+          0 8px 18px rgba(0, 0, 0, 0.22);
+      }
+
+      .hf-article-node-option__copy {
+        display: grid;
+        min-width: 0;
+        gap: 4px;
+      }
+
+      .hf-article-node-option__label {
+        justify-self: start;
+      }
+
+      .hf-article-node-option__meta {
+        display: flex;
+        align-items: center;
+        min-width: 0;
+        gap: 6px;
+      }
+
+      .hf-article-node-option__type,
+      .hf-article-editor__node-token-type {
+        max-width: 16rem;
+        overflow: hidden;
+        border: 1px solid rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.26);
+        border-radius: 999px;
+        background: rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.12);
+        color: rgba(var(--viewer-node-link-text-rgb, 201, 227, 238), 0.94);
+        font-size: 0.72em;
+        font-weight: 760;
+        letter-spacing: 0.015em;
+        line-height: 1;
+        padding: 0.22em 0.48em;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .hf-article-node-option__ref {
+        overflow: hidden;
+        color: rgba(197, 208, 227, 0.55);
+        font-size: 0.82rem;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .hf-article-node-screen-frame {
+        position: fixed;
+        left: 0;
+        top: 0;
+        z-index: 90;
+        width: 0;
+        height: 0;
+        opacity: 0;
+        pointer-events: none;
+        overflow: hidden;
+        border-radius: 24px;
+        transform: translate3d(0, 0, 0) scale(1);
+        transform-origin: center;
+        transition:
+          opacity 140ms ease,
+          transform 240ms ease;
+      }
+
+      .hf-article-node-screen-frame.is-visible {
+        opacity: 1;
+        transform: translate3d(0, 0, 0) scale(1);
+      }
+
+      .hf-article-node-screen-frame__inner {
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 100%;
+        height: 100%;
+        transform-origin: center;
+        animation: hfArticleNodeFrameBreathe 1850ms ease-in-out infinite;
+      }
+
+      .hf-article-node-screen-frame__corner {
+        --hf-article-node-frame-size: 22px;
+        --hf-article-node-frame-thickness: 3px;
+        position: absolute;
+        width: var(--hf-article-node-frame-size);
+        height: var(--hf-article-node-frame-size);
+        border-color: rgba(255, 255, 255, 0.98);
+        filter:
+          drop-shadow(0 0 1px rgba(0, 0, 0, 0.95))
+          drop-shadow(0 2px 4px rgba(0, 0, 0, 0.55))
+          drop-shadow(0 0 10px rgba(var(--viewer-node-link-underline-rgb, 136, 215, 255), 0.26));
+      }
+
+      .hf-article-node-screen-frame__corner--tl {
+        left: 0;
+        top: 0;
+        border-left: var(--hf-article-node-frame-thickness) solid;
+        border-top: var(--hf-article-node-frame-thickness) solid;
+        border-top-left-radius: 8px;
+      }
+
+      .hf-article-node-screen-frame__corner--tr {
+        right: 0;
+        top: 0;
+        border-right: var(--hf-article-node-frame-thickness) solid;
+        border-top: var(--hf-article-node-frame-thickness) solid;
+        border-top-right-radius: 8px;
+      }
+
+      .hf-article-node-screen-frame__corner--br {
+        right: 0;
+        bottom: 0;
+        border-right: var(--hf-article-node-frame-thickness) solid;
+        border-bottom: var(--hf-article-node-frame-thickness) solid;
+        border-bottom-right-radius: 8px;
+      }
+
+      .hf-article-node-screen-frame__corner--bl {
+        left: 0;
+        bottom: 0;
+        border-left: var(--hf-article-node-frame-thickness) solid;
+        border-bottom: var(--hf-article-node-frame-thickness) solid;
+        border-bottom-left-radius: 8px;
+      }
+
+      .hf-article-frame-tooltip {
+        --tooltip-bg: #111422;
+        --tooltip-border: #2f354a;
+        --tooltip-tip-size: 8px;
+        --tooltip-tip-x: 50%;
+        position: fixed;
+        z-index: 2147483400;
+        width: max-content;
+        max-width: calc(100vw - 16px);
+        padding: 0.35rem 0.55rem;
+        border: 1px solid var(--tooltip-border);
+        border-radius: 8px;
+        background: var(--tooltip-bg);
+        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
+        color: var(--base-content, #edf2ff);
+        font-size: 0.85rem;
+        line-height: normal;
+        white-space: nowrap;
+        pointer-events: none;
+        opacity: 0;
+        transition: opacity 0.12s ease;
+      }
+
+      .hf-article-frame-tooltip.is-visible {
+        opacity: 1;
+      }
+
+      .hf-article-frame-tooltip::after {
+        content: "";
+        position: absolute;
+        left: var(--tooltip-tip-x);
+        width: var(--tooltip-tip-size);
+        height: var(--tooltip-tip-size);
+        background: var(--tooltip-bg);
+        border: 1px solid var(--tooltip-border);
+        pointer-events: none;
+        transform: translateX(-50%) rotate(45deg);
+      }
+
+      .hf-article-frame-tooltip[data-tooltip-placement="top"]::after {
+        bottom: calc(var(--tooltip-tip-size) * -0.5 - 1px);
+        border-left: 0;
+        border-top: 0;
+        clip-path: polygon(calc(100% + 2px) -2px, calc(100% + 2px) calc(100% + 2px), -2px calc(100% + 2px));
+      }
+
+      .hf-article-frame-tooltip[data-tooltip-placement="bottom"]::after {
+        top: calc(var(--tooltip-tip-size) * -0.5 - 1px);
+        border-right: 0;
+        border-bottom: 0;
+        clip-path: polygon(-2px -2px, calc(100% + 2px) -2px, -2px calc(100% + 2px));
+      }
+
+      .hf-article-frame-tooltip.info-panel__tooltip--multiline {
+        max-width: min(380px, calc(100vw - 32px));
+        white-space: pre-line;
+        line-height: 1.36;
+      }
+
+      .hf-article-frame-tooltip .info-panel__tooltip-list {
+        margin: 0;
+        padding-left: 1.15rem;
+        white-space: normal;
+      }
+
+      .hf-article-frame-tooltip .info-panel__tooltip-list li {
+        margin: 0.08rem 0;
+      }
+
+      .hf-article-frame-tooltip strong {
+        color: #f8fafc;
+        font-weight: 700;
+      }
+
+      .hf-article-frame-tooltip .info-panel__tooltip-key {
+        display: inline-grid;
+        align-items: center;
+        justify-content: center;
+        width: 1.58em;
+        min-width: 1.58em;
+        height: 1.58em;
+        margin: 0 0.15rem;
+        border: 1px solid rgba(255, 255, 255, 0.95);
+        border-bottom-color: rgba(148, 163, 184, 0.8);
+        border-radius: 0.45em;
+        background:
+          radial-gradient(circle at 50% 12%, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0) 48%),
+          linear-gradient(180deg, #f8fafc 0%, #dbe3ee 62%, #b4c0ce 100%);
+        color: #0f172a;
+        font-family: ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Consolas, monospace;
+        font-size: 0.78em;
+        font-weight: 900;
+        letter-spacing: 0.015em;
+        line-height: 1;
+        text-transform: uppercase;
+        vertical-align: middle;
+      }
+
+      @keyframes hfArticleNodeFrameBreathe {
+        0%,
+        100% {
+          transform: scale(1);
+        }
+        50% {
+          transform: scale(1.018);
+        }
+      }
+
+      .hf-article-editor__node-token {
+        display: inline-flex;
+        align-items: center;
+        gap: 0.35em;
+        margin: 0 0.05em;
+        padding: 0 0.18em;
+        border: 0;
+        border-radius: 10px;
+        background: rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.08);
+        font: inherit;
+        cursor: pointer;
+        vertical-align: baseline;
+        transition:
+          padding 140ms ease,
+          color 120ms ease,
+          text-decoration-color 120ms ease,
+          background 120ms ease,
+          box-shadow 120ms ease;
+      }
+
+      .hf-article-editor__node-token.is-configure-visible {
+        padding-right: calc(22px + 0.34em);
+      }
+
+      .hf-article-editor__node-token.is-active {
+        background: rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.18);
+        box-shadow: 0 0 0 2px rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.18);
+      }
+
+      .hf-article-editor__node-token-label {
+        min-width: 0;
+      }
+
+      .hf-article-editor__node-token-type {
+        font-size: 0.68em;
+        transform: translateY(-0.02em);
+      }
+
+      .hf-article-editor__media,
+      .viewer-community-articles__media {
+        display: grid;
+        gap: 8px;
+        min-width: 0;
+        max-width: 100%;
+        box-sizing: border-box;
+        margin: 14px 0;
+        padding: 12px;
+        border: 1px solid rgba(136, 215, 255, 0.14);
+        border-radius: 18px;
+        background: rgba(0, 0, 0, 0.18);
+      }
+
+      .hf-article-editor__media img,
+      .viewer-community-articles__media img {
+        width: min(100%, 720px);
+        max-width: 100%;
+        border-radius: 14px;
+      }
+
+      .hf-article-editor__media audio,
+      .viewer-community-articles__media audio,
+      .hf-article-editor__media video,
+      .viewer-community-articles__media video {
+        width: min(100%, 720px);
+        max-width: 100%;
+        border-radius: 14px;
+        color-scheme: dark;
+        accent-color: rgba(136, 215, 255, 0.95);
+        background:
+          linear-gradient(180deg, rgba(136, 215, 255, 0.08), rgba(156, 255, 99, 0.035)),
+          rgba(1, 7, 14, 0.74);
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.06),
+          0 12px 30px rgba(0, 0, 0, 0.16);
+      }
+
+      .hf-article-editor__media audio::-webkit-media-controls-panel,
+      .viewer-community-articles__media audio::-webkit-media-controls-panel {
+        border-radius: 14px;
+        background:
+          linear-gradient(180deg, rgba(136, 215, 255, 0.12), rgba(156, 255, 99, 0.04)),
+          rgb(5, 12, 22);
+        color: rgba(235, 248, 255, 0.92);
+      }
+
+      .hf-article-editor__media audio::-webkit-media-controls-current-time-display,
+      .hf-article-editor__media audio::-webkit-media-controls-time-remaining-display,
+      .viewer-community-articles__media audio::-webkit-media-controls-current-time-display,
+      .viewer-community-articles__media audio::-webkit-media-controls-time-remaining-display {
+        color: rgba(224, 240, 251, 0.82);
+        text-shadow: none;
+      }
+
+      .hf-article-editor__media audio::-webkit-media-controls-enclosure,
+      .viewer-community-articles__media audio::-webkit-media-controls-enclosure {
+        border-radius: 14px;
+      }
+
+      .hf-article-editor__media video,
+      .viewer-community-articles__media video {
+        justify-self: center;
+        width: auto;
+        max-width: min(100%, 520px);
+        max-height: min(78vh, 860px);
+      }
+
+      .hf-article-editor__media-video,
+      .viewer-community-articles__media-video {
+        position: relative;
+        width: min(100%, 760px);
+        aspect-ratio: 16 / 9;
+        overflow: hidden;
+        border-radius: 14px;
+        background: rgba(0, 0, 0, 0.42);
+      }
+
+      .hf-article-editor__media-video iframe,
+      .viewer-community-articles__media-video iframe {
+        position: absolute;
+        inset: 0;
+        width: 100%;
+        height: 100%;
+        border: 0;
+      }
+
+      .hf-article-editor__media figcaption,
+      .viewer-community-articles__media figcaption {
+        color: rgba(197, 208, 227, 0.68);
+        font-size: 0.88rem;
+      }
+
+      .hf-article-editor__media figcaption[contenteditable="true"] {
+        min-height: 1.4em;
+        padding: 5px 7px;
+        border-radius: 10px;
+        color: rgba(197, 208, 227, 0.74);
+        outline: none;
+        cursor: text;
+        transition:
+          background 140ms ease,
+          box-shadow 140ms ease,
+          color 140ms ease;
+      }
+
+      .hf-article-editor__media figcaption[contenteditable="true"]:empty::before {
+        content: attr(data-placeholder);
+        color: rgba(197, 208, 227, 0.42);
+        pointer-events: none;
+      }
+
+      .hf-article-editor__media figcaption[contenteditable="true"]:hover,
+      .hf-article-editor__media figcaption[contenteditable="true"]:focus {
+        background: rgba(255, 210, 126, 0.055);
+        box-shadow: inset 0 0 0 1px rgba(255, 210, 126, 0.16);
+        color: rgba(232, 241, 250, 0.86);
+      }
+
+      .hf-article-editor__html-block,
+      .viewer-community-articles__html-block {
+        display: grid;
+        gap: 10px;
+        margin: 18px 0;
+        overflow: hidden;
+        border: 1px solid rgba(136, 215, 255, 0.14);
+        border-radius: 20px;
+        background:
+          linear-gradient(180deg, rgba(136, 215, 255, 0.075), rgba(156, 255, 99, 0.025)),
+          rgba(0, 0, 0, 0.2);
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
+      }
+
+      .hf-article-editor__html-block {
+        padding: 12px;
+      }
+
+      .viewer-community-articles__html-block {
+        padding: 0;
+        background: transparent;
+      }
+
+      /* First-party (admin/builtin) custom HTML renders inline instead of in
+         the sandbox iframe: plain flow content, no frame chrome. */
+      .viewer-community-articles__html-inline {
+        width: 100%;
+        min-width: 0;
+      }
+      .viewer-community-articles__html-block:has(> .viewer-community-articles__html-inline) {
+        border: 0;
+        background: none;
+        box-shadow: none;
+        overflow: visible;
+      }
+
+      @media (max-width: 980px) {
+        .viewer-community-articles__html-block {
+          margin: 16px 0;
+          border: 0;
+          border-radius: 0;
+          background: transparent;
+          box-shadow: none;
+        }
+
+        .viewer-community-articles__html-block .hf-article-custom-html__frame {
+          border-radius: 18px;
+        }
+      }
+
+      .hf-article-editor__html-block.is-delete-armed {
+        border-color: rgba(255, 210, 126, 0.62);
+        box-shadow:
+          0 0 0 1px rgba(255, 210, 126, 0.22),
+          0 18px 54px rgba(255, 210, 126, 0.08);
+      }
+
+      .hf-article-editor__media,
+      .hf-article-editor__table-set,
+      .hf-article-editor__html-block,
+      .hf-article-body .hf-article-editor__code-block {
+        position: relative;
+      }
+
+      .hf-article-editor__media.is-delete-armed,
+      .hf-article-editor__table-set.is-delete-armed,
+      .hf-article-editor__html-block.is-delete-armed,
+      .hf-article-body .hf-article-editor__code-block.is-delete-armed {
+        overflow: visible;
+        border-color: rgba(255, 210, 126, 0.62);
+        box-shadow:
+          0 0 0 1px rgba(255, 210, 126, 0.22),
+          0 18px 54px rgba(255, 210, 126, 0.08);
+      }
+
+      .hf-article-editor__media.is-delete-armed::before,
+      .hf-article-editor__table-set.is-delete-armed::before,
+      .hf-article-editor__html-block.is-delete-armed::before,
+      .hf-article-body .hf-article-editor__code-block.is-delete-armed::before {
+        content: attr(data-delete-label);
+        position: absolute;
+        right: 16px;
+        top: 0;
+        z-index: 4;
+        padding: 5px 9px;
+        border: 1px solid rgba(255, 210, 126, 0.32);
+        border-radius: 999px;
+        background:
+          linear-gradient(180deg, rgba(255, 236, 179, 0.13), rgba(255, 210, 126, 0.06)),
+          rgba(8, 10, 16, 0.96);
+        color: rgba(255, 236, 189, 0.94);
+        font-size: 0.72rem;
+        font-weight: 820;
+        letter-spacing: 0.035em;
+        line-height: 1;
+        pointer-events: none;
+        text-transform: uppercase;
+        transform: translateY(calc(-100% - 7px));
+        white-space: nowrap;
+        box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
+      }
+
+      .hf-article-editor__html-head {
+        display: flex;
+        align-items: flex-start;
+        justify-content: space-between;
+        gap: 12px;
+      }
+
+      .hf-article-editor__html-title {
+        display: grid;
+        gap: 3px;
+      }
+
+      .hf-article-editor__html-title strong {
+        color: rgba(235, 248, 255, 0.95);
+        font-size: 0.92rem;
+        letter-spacing: -0.015em;
+      }
+
+      .hf-article-editor__caret-slot {
+        position: relative;
+        min-height: 24px;
+        margin: 4px 0;
+        padding: 2px 0;
+        border: 0;
+        border-radius: 13px;
+        background: transparent;
+        box-shadow: none;
+        outline: none;
+        transition: min-height 160ms ease;
+      }
+
+      .hf-article-editor__caret-slot[data-empty="true"]::before {
+        content: "";
+        position: absolute;
+        left: 0;
+        right: 0;
+        top: 50%;
+        height: 1px;
+        border-radius: 999px;
+        background: linear-gradient(90deg, transparent, rgba(255, 210, 126, 0.72) 14%, rgba(255, 210, 126, 0.92) 50%, rgba(255, 210, 126, 0.72) 86%, transparent);
+        box-shadow:
+          0 0 10px rgba(255, 210, 126, 0.2),
+          0 1px 0 rgba(255, 255, 255, 0.08);
+        pointer-events: none;
+        opacity: 0;
+        transform: translateY(-50%) scaleX(0.92);
+        transform-origin: center;
+        transition:
+          opacity 160ms ease,
+          transform 160ms ease;
+      }
+
+      .hf-article-editor__caret-slot[data-empty="true"]:hover,
+      .hf-article-editor__caret-slot[data-empty="true"]:focus,
+      .hf-article-editor__caret-slot[data-empty="true"]:focus-within {
+        background: transparent;
+        box-shadow: none;
+        min-height: 24px;
+      }
+
+      .hf-article-editor__caret-slot[data-empty="true"]:hover::before,
+      .hf-article-editor__caret-slot[data-empty="true"]:focus::before,
+      .hf-article-editor__caret-slot[data-empty="true"]:focus-within::before {
+        opacity: 1;
+        transform: translateY(-50%) scaleX(1);
+      }
+
+      .hf-article-editor__html-code-shell {
+        position: relative;
+        box-sizing: border-box;
+        height: 260px;
+        min-height: 220px;
+        max-height: 420px;
+        overflow: hidden;
+        border: 1px solid rgba(136, 215, 255, 0.13);
+        border-radius: 16px;
+        background:
+          radial-gradient(circle at 15% 0%, rgba(136, 215, 255, 0.12), transparent 34%),
+          linear-gradient(180deg, rgba(2, 14, 27, 0.92), rgba(1, 7, 14, 0.78));
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.055),
+          inset 0 -1px 0 rgba(0, 0, 0, 0.32);
+      }
+
+      .hf-article-editor__html-code-shell:focus-within {
+        border-color: rgba(136, 215, 255, 0.38);
+        box-shadow:
+          0 0 0 3px rgba(136, 215, 255, 0.09),
+          inset 0 1px 0 rgba(255, 255, 255, 0.065),
+          inset 0 -1px 0 rgba(0, 0, 0, 0.32);
+      }
+
+      .hf-article-editor__html-highlight,
+      .hf-article-editor__html-source {
+        position: absolute;
+        inset: 0;
+        box-sizing: border-box;
+        width: 100%;
+        height: 100%;
+        margin: 0;
+        padding: 12px 13px;
+        border: 0;
+        font-family: "SFMono-Regular", "Cascadia Code", "Liberation Mono", Menlo, monospace;
+        font-size: 13.5px;
+        font-variant-ligatures: none;
+        font-feature-settings: "liga" 0, "calt" 0;
+        font-weight: 500;
+        letter-spacing: 0;
+        line-height: 20px;
+        outline: none;
+        tab-size: 2;
+        white-space: pre;
+        overflow-wrap: normal;
+        word-break: normal;
+      }
+
+      .hf-article-editor__html-highlight {
+        z-index: 1;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        overflow: hidden;
+        color: rgba(224, 238, 255, 0.88);
+        pointer-events: none;
+      }
+
+      .hf-article-body .hf-article-editor__html-highlight {
+        margin: 0;
+        padding: 12px 13px;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        overflow: hidden;
+      }
+
+      .hf-article-editor__html-highlight code {
+        display: block;
+        min-width: max-content;
+        min-height: 0;
+        margin: 0;
+        padding: 0;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        color: inherit;
+        font: inherit;
+        letter-spacing: inherit;
+        line-height: inherit;
+        white-space: pre;
+      }
+
+      .hf-article-body .hf-article-editor__html-highlight code {
+        min-height: 0;
+        color: inherit;
+        font: inherit;
+      }
+
+      .hf-article-editor__html-source {
+        z-index: 3;
+        display: block;
+        overflow: auto;
+        background: transparent;
+        color: transparent;
+        -webkit-text-fill-color: transparent;
+        caret-color: rgba(235, 248, 255, 0.96);
+        resize: none;
+        scrollbar-gutter: stable;
+      }
+
+      .hf-article-editor__html-source:focus {
+        outline: none;
+      }
+
+      .hf-article-editor__html-source::selection {
+        background: rgba(136, 215, 255, 0.28);
+        -webkit-text-fill-color: rgba(235, 248, 255, 0.96);
+        color: rgba(235, 248, 255, 0.96);
+      }
+
+      .hf-article-editor__html-source::placeholder {
+        color: rgba(157, 180, 205, 0.34);
+        -webkit-text-fill-color: rgba(157, 180, 205, 0.34);
+      }
+
+      .hf-article-editor__html-source::-webkit-scrollbar {
+        width: 10px;
+        height: 10px;
+      }
+
+      .hf-article-editor__html-source::-webkit-scrollbar-track {
+        background: rgba(255, 255, 255, 0.025);
+        border-radius: 999px;
+      }
+
+      .hf-article-editor__html-source::-webkit-scrollbar-thumb {
+        border: 2px solid transparent;
+        border-radius: 999px;
+        background: rgba(197, 208, 227, 0.28);
+        background-clip: padding-box;
+      }
+
+      .hf-article-editor__html-source::-webkit-scrollbar-thumb:hover {
+        background: rgba(197, 208, 227, 0.42);
+        background-clip: padding-box;
+      }
+
+      .hf-article-editor__html-token--comment {
+        color: rgba(137, 159, 183, 0.68);
+        font-style: italic;
+      }
+
+      .hf-article-editor__html-token--punctuation {
+        color: rgba(133, 165, 198, 0.8);
+      }
+
+      .hf-article-editor__html-token--tag {
+        color: #78d7ff;
+        font-weight: 720;
+      }
+
+      .hf-article-editor__html-token--attr {
+        color: #a6e87d;
+      }
+
+      .hf-article-editor__html-token--string {
+        color: #ffd38a;
+      }
+
+      .hf-article-editor__html-token--number {
+        color: #ffb8f2;
+      }
+
+      .hf-article-editor__html-token--keyword {
+        color: #bca7ff;
+        font-weight: 720;
+      }
+
+      .hf-article-editor__html-token--property {
+        color: #91e5ff;
+      }
+
+      .hf-article-editor__html-token--selector {
+        color: #f4a8ff;
+      }
+
+      .hf-article-editor__html-token--function {
+        color: #8ef0c8;
+      }
+
+      .hf-article-editor__html-token--operator {
+        color: rgba(247, 250, 255, 0.68);
+      }
+
+      .hf-article-editor__html-preview-label {
+        color: rgba(197, 208, 227, 0.55);
+        font-size: 0.72rem;
+        font-weight: 780;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .hf-article-custom-html__frame {
+        display: block;
+        width: 100%;
+        height: 360px;
+        min-height: 40px;
+        max-height: 2600px;
+        box-sizing: border-box;
+        overflow: hidden;
+        border: 0;
+        border-radius: 16px;
+        background: rgba(1, 7, 14, 0.5);
+      }
+
+      .hf-article-custom-html__frame[data-custom-html-active="1"][data-custom-html-display-ready="0"] {
+        opacity: 0;
+        visibility: hidden;
+      }
+
+      .hf-article-editor__html-block.is-custom-html-sandbox-loading .hf-article-editor__html-preview-label::after {
+        content: " · loading interactive sandbox";
+        color: rgba(136, 215, 255, 0.62);
+        font-weight: 720;
+        letter-spacing: 0.045em;
+      }
+
+      .hf-article-custom-html__frame-wrap {
+        position: relative;
+        display: block;
+        width: 100%;
+        min-width: 0;
+      }
+
+      .hf-article-custom-html__touch-scroll-shield {
+        display: none;
+      }
+
+      .viewer-community-articles__html-block .hf-article-custom-html__frame {
+        border-radius: 18px;
+      }
+
+      @media (min-width: 981px) {
+        body.route-viewer-article #viewer-granularity {
+          display: none !important;
+        }
+      }
+
+      .viewer-editorial__deployment-wrap,
+      .viewer-community-articles__html-block .hf-article-custom-html__frame {
+        scrollbar-color: rgba(197, 208, 227, 0.3) transparent;
+        scrollbar-width: thin;
+      }
+
+      .viewer-editorial__deployment-wrap::-webkit-scrollbar,
+      .viewer-community-articles__html-block .hf-article-custom-html__frame::-webkit-scrollbar {
+        width: 10px;
+        height: 10px;
+      }
+
+      .viewer-editorial__deployment-wrap::-webkit-scrollbar-track,
+      .viewer-community-articles__html-block .hf-article-custom-html__frame::-webkit-scrollbar-track {
+        border-radius: 999px;
+        background: transparent;
+      }
+
+      .viewer-editorial__deployment-wrap::-webkit-scrollbar-thumb,
+      .viewer-community-articles__html-block .hf-article-custom-html__frame::-webkit-scrollbar-thumb {
+        border: 2px solid transparent;
+        border-radius: 999px;
+        background: rgba(197, 208, 227, 0.3);
+        background-clip: padding-box;
+      }
+
+      .viewer-editorial__deployment-wrap::-webkit-scrollbar-thumb:hover,
+      .viewer-community-articles__html-block .hf-article-custom-html__frame::-webkit-scrollbar-thumb:hover {
+        background: rgba(197, 208, 227, 0.42);
+        background-clip: padding-box;
+      }
+
+      .hf-article-custom-html__node-links {
+        position: relative;
+        z-index: 1;
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+        align-items: center;
+        padding: 0 4px 4px;
+      }
+
+      .hf-article-custom-html__node-links--hidden {
+        position: absolute;
+        width: 1px;
+        height: 1px;
+        margin: -1px;
+        padding: 0;
+        overflow: hidden;
+        clip: rect(0 0 0 0);
+        clip-path: inset(50%);
+        white-space: nowrap;
+      }
+
+      .hf-article-custom-html__node-links::before {
+        content: "Graph links";
+        flex: 0 0 auto;
+        color: rgba(197, 208, 227, 0.52);
+        font-size: 0.68rem;
+        font-weight: 820;
+        letter-spacing: 0.1em;
+        text-transform: uppercase;
+      }
+
+      .hf-article-custom-html__node-link {
+        display: inline-flex;
+        align-items: center;
+        min-height: 30px;
+        padding: 4px 10px;
+        border: 1px solid rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.35);
+        border-radius: 999px;
+        background:
+          linear-gradient(180deg, rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.14), rgba(var(--viewer-node-link-underline-rgb, 104, 164, 196), 0.055)),
+          rgba(1, 7, 14, 0.48);
+        text-decoration: none;
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.08),
+          0 10px 26px rgba(0, 0, 0, 0.16);
+      }
+
+      .hf-article-custom-html__launch {
+        display: grid;
+        gap: 8px;
+        place-items: center;
+        min-height: 180px;
+        padding: 24px;
+        border: 1px solid rgba(136, 215, 255, 0.16);
+        border-radius: 18px;
+        background:
+          radial-gradient(circle at 50% 0%, rgba(136, 215, 255, 0.13), transparent 44%),
+          rgba(1, 7, 14, 0.52);
+        color: rgba(235, 248, 255, 0.9);
+        text-align: center;
+      }
+
+      .hf-article-custom-html__launch strong {
+        font-size: 0.94rem;
+        letter-spacing: -0.01em;
+      }
+
+      .hf-article-custom-html__launch span {
+        max-width: 34rem;
+        color: rgba(197, 208, 227, 0.7);
+        font-size: 0.86rem;
+        line-height: 1.45;
+      }
+
+      .hf-article-custom-html__launch button {
+        appearance: none;
+        border: 1px solid rgba(136, 215, 255, 0.28);
+        border-radius: 999px;
+        padding: 9px 14px;
+        background: linear-gradient(135deg, rgba(136, 215, 255, 0.22), rgba(156, 255, 99, 0.13));
+        color: rgba(235, 248, 255, 0.95);
+        cursor: pointer;
+        font: inherit;
+        font-size: 0.78rem;
+        font-weight: 820;
+        letter-spacing: 0.05em;
+        text-transform: uppercase;
+        transition:
+          transform 140ms ease,
+          border-color 140ms ease,
+          box-shadow 140ms ease;
+      }
+
+      .hf-article-custom-html__launch button:hover,
+      .hf-article-custom-html__launch button:focus-visible {
+        border-color: rgba(136, 215, 255, 0.48);
+        box-shadow: 0 14px 30px rgba(0, 0, 0, 0.22);
+        transform: translateY(-1px);
+      }
+
+      .hf-article-editor__table-set,
+      .viewer-community-articles__table-set {
+        margin: 18px 0;
+      }
+
+      .viewer-community-articles__table-set {
+        justify-self: start;
+        width: fit-content;
+        max-width: 100%;
+      }
+
+      .hf-article-editor__table-set {
+        padding: 14px;
+        border: 1px solid rgba(136, 215, 255, 0.12);
+        border-radius: 22px;
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.012)),
+          rgba(0, 0, 0, 0.16);
+      }
+
+      .hf-article-editor__table-set .viewer-editorial__deployment-table {
+        min-width: min(720px, 100%);
+        overflow: hidden;
+        border-collapse: separate;
+        border-spacing: 0;
+        border-radius: 18px;
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.015)),
+          rgba(8, 13, 23, 0.84);
+        clip-path: inset(0 round 18px);
+      }
+
+      .hf-article-editor__table-set .viewer-editorial__deployment-wrap {
+        position: relative;
+        box-sizing: border-box;
+        overflow: visible;
+        border: 0;
+        background: transparent;
+      }
+
+      .hf-article-table-row-delete-layer {
+        position: absolute;
+        inset: 0 auto 0 -28px;
+        width: 24px;
+        pointer-events: none;
+      }
+
+
+      .viewer-community-articles__table-set .viewer-editorial__deployment-wrap {
+        justify-self: start;
+        width: fit-content;
+        max-width: 100%;
+      }
+
+      .viewer-community-articles__table-set .viewer-editorial__deployment-table {
+        width: auto;
+        min-width: 0;
+        table-layout: auto;
+      }
+
+      .viewer-community-articles__table-set .viewer-editorial__deployment-table th,
+      .viewer-community-articles__table-set .viewer-editorial__deployment-table td {
+        min-width: min(6.8rem, 24vw);
+        max-width: min(24ch, 30vw);
+        padding-inline: 12px;
+        white-space: normal;
+        overflow-wrap: anywhere;
+        word-break: normal;
+        vertical-align: top;
+      }
+
+      .viewer-community-articles__table-set .viewer-editorial__deployment-table th:first-child,
+      .viewer-community-articles__table-set .viewer-editorial__deployment-table td:first-child {
+        min-width: min(8.2rem, 30vw);
+      }
+
+      @media (max-width: 640px) {
+        .viewer-community-articles__table-set,
+        .viewer-community-articles__table-set .viewer-editorial__deployment-wrap {
+          width: 100%;
+        }
+
+        .viewer-community-articles__table-set .viewer-editorial__deployment-table {
+          width: max-content;
+          min-width: max(100%, calc(var(--hf-article-table-columns, 1) * 7.2rem));
+        }
+
+        .viewer-community-articles__table-set .viewer-editorial__deployment-table th,
+        .viewer-community-articles__table-set .viewer-editorial__deployment-table td {
+          min-width: clamp(6.8rem, 34vw, 9.6rem);
+          max-width: clamp(8.5rem, 44vw, 13rem);
+        }
+
+      }
+
+      .hf-article-editor__table-set[contenteditable="false"] {
+        user-select: text;
+      }
+
+      .hf-article-editor__table-set.is-delete-armed,
+      .hf-article-editor__table-set.is-delete-armed * {
+        user-select: none;
+      }
+
+      .hf-article-editor__table-set.is-delete-armed {
+        border-color: rgba(255, 210, 126, 0.62);
+        box-shadow:
+          0 0 0 1px rgba(255, 210, 126, 0.22),
+          0 18px 54px rgba(255, 210, 126, 0.08);
+      }
+
+      .hf-article-table-editbar {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: 8px;
+      }
+
+      .hf-article-table-title {
+        min-width: min(260px, 100%);
+        flex: 1 1 220px;
+        min-height: 34px;
+        padding: 0 12px;
+        border: 1px solid rgba(136, 215, 255, 0.14);
+        border-radius: 999px;
+        background: rgba(3, 10, 20, 0.62);
+        color: rgba(235, 248, 255, 0.92);
+        font: inherit;
+        font-size: 0.86rem;
+        font-weight: 760;
+        outline: none;
+      }
+
+      .hf-article-table-title:focus-visible,
+      .hf-article-table-action:focus-visible {
+        border-color: rgba(136, 215, 255, 0.45);
+        outline: none;
+      }
+
+      .hf-article-table-action {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        min-height: 34px;
+        padding: 0 11px;
+        border: 1px solid rgba(136, 215, 255, 0.14);
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.08);
+        color: rgba(223, 247, 255, 0.82);
+        font: inherit;
+        font-size: 0.78rem;
+        font-weight: 780;
+        cursor: pointer;
+        transition:
+          border-color 140ms ease,
+          background 140ms ease,
+          color 140ms ease,
+          transform 140ms ease;
+      }
+
+      .hf-article-table-action:hover {
+        border-color: rgba(136, 215, 255, 0.32);
+        background: rgba(136, 215, 255, 0.13);
+        color: rgba(235, 248, 255, 0.96);
+        transform: translateY(-1px);
+      }
+
+      .hf-article-table-tab {
+        display: inline-flex;
+        align-items: center;
+        min-height: 32px;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.05);
+        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
+        overflow: hidden;
+        transition:
+          background 120ms ease,
+          box-shadow 120ms ease;
+      }
+
+      .hf-article-table-tab.is-active {
+        background: rgba(136, 215, 255, 0.14);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.22);
+      }
+
+      .hf-article-table-tab .viewer-editorial__deployment-filter {
+        min-height: 32px;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        padding-right: 7px;
+      }
+
+      .hf-article-table-tab .viewer-editorial__deployment-filter:hover,
+      .hf-article-table-tab .viewer-editorial__deployment-filter:focus-visible,
+      .hf-article-table-tab .viewer-editorial__deployment-filter.is-active {
+        background: transparent;
+        box-shadow: none;
+      }
+
+      .hf-article-table-remove {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: 24px;
+        height: 24px;
+        margin-right: 5px;
+        border: 0;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.055);
+        color: rgba(220, 231, 247, 0.62);
+        font: inherit;
+        font-size: 0.9rem;
+        font-weight: 820;
+        line-height: 1;
+        cursor: pointer;
+        transition:
+          background 120ms ease,
+          color 120ms ease,
+          transform 120ms ease;
+      }
+
+      .hf-article-table-remove:hover,
+      .hf-article-table-remove:focus-visible {
+        background: rgba(255, 116, 116, 0.16);
+        color: rgba(255, 226, 226, 0.96);
+        outline: none;
+        transform: scale(1.04);
+      }
+
+      .hf-article-editor__table-cell {
+        position: relative;
+        min-width: 96px;
+        cursor: text;
+        outline: none;
+        transition:
+          background 120ms ease,
+          box-shadow 120ms ease;
+      }
+
+      .hf-article-editor__table-cell:focus-visible {
+        box-shadow: inset 0 0 0 2px rgba(136, 215, 255, 0.38);
+      }
+
+      .hf-article-editor__table-cell:empty::before {
+        content: attr(data-placeholder);
+        color: rgba(197, 208, 227, 0.38);
+        pointer-events: none;
+      }
+
+      .hf-article-table-structure-delete {
+        position: absolute;
+        z-index: 3;
+        display: inline-grid;
+        place-items: center;
+        width: 22px;
+        height: 22px;
+        padding: 0;
+        border: 1px solid rgba(197, 208, 227, 0.16);
+        border-radius: 999px;
+        background:
+          linear-gradient(180deg, rgba(197, 208, 227, 0.095), rgba(197, 208, 227, 0.035)),
+          rgba(9, 14, 23, 0.9);
+        color: rgba(197, 208, 227, 0.56);
+        cursor: pointer;
+        font: inherit;
+        font-size: 15px;
+        font-weight: 860;
+        line-height: 1;
+        opacity: 0;
+        pointer-events: none;
+        transform: scale(0.92);
+        transition:
+          opacity 120ms ease,
+          transform 120ms ease,
+          border-color 120ms ease,
+          background 120ms ease,
+          color 120ms ease;
+      }
+
+      .hf-article-table-delete-row {
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%) scale(0.92);
+      }
+
+      .hf-article-table-delete-column {
+        right: 8px;
+        top: 50%;
+        transform: translateY(-50%) scale(0.92);
+      }
+
+      .hf-article-table-structure-delete.is-visible,
+      .hf-article-table-structure-delete:hover,
+      .hf-article-table-structure-delete:focus-visible {
+        opacity: 1;
+        pointer-events: auto;
+      }
+
+      .hf-article-table-delete-row.is-visible,
+      .hf-article-table-delete-row:hover,
+      .hf-article-table-delete-row:focus-visible {
+        transform: translate(-50%, -50%) scale(1);
+      }
+
+      .hf-article-table-delete-column.is-visible,
+      .hf-article-table-delete-column:hover,
+      .hf-article-table-delete-column:focus-visible {
+        transform: translateY(-50%) scale(1);
+      }
+
+      .hf-article-table-structure-delete:hover,
+      .hf-article-table-structure-delete:focus-visible {
+        border-color: rgba(255, 134, 134, 0.48);
+        background:
+          linear-gradient(180deg, rgba(255, 134, 134, 0.18), rgba(255, 134, 134, 0.08)),
+          rgba(15, 11, 15, 0.96);
+        color: rgba(255, 238, 238, 0.98);
+        outline: none;
+      }
+
+      .hf-article-editor__table-cell.is-delete-row-preview,
+      .hf-article-editor__table-cell.is-delete-column-preview {
+        background: rgba(255, 95, 95, 0.1);
+        box-shadow:
+          inset 0 1px 0 rgba(255, 125, 125, 0.18),
+          inset 0 -1px 0 rgba(255, 125, 125, 0.18),
+          inset 1px 0 0 rgba(255, 125, 125, 0.16),
+          inset -1px 0 0 rgba(255, 125, 125, 0.16);
+      }
+
+      .hf-article-editor__iframe,
+      .viewer-community-articles__iframe {
+        width: 100%;
+        min-height: min(620px, calc(100vh - 220px));
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 24px;
+        background: var(--preview-surface);
+        background-color: #07111d;
+      }
+
+      .hf-article-editor__preview .hf-article-editor__iframe {
+        position: relative;
+        z-index: 1;
+        grid-column: 1;
+        grid-row: 2;
+        height: 100%;
+        min-height: 0;
+        display: block;
+        box-sizing: border-box;
+        background: var(--preview-surface);
+        background-color: #07111d;
+        opacity: 1;
+        transition: opacity 190ms ease;
+      }
+
+      .hf-article-editor__preview.is-loading-visual .hf-article-editor__iframe {
+        opacity: 0;
+      }
+
+      .viewer-community-articles {
+        display: grid;
+        gap: 18px;
+        padding: clamp(18px, 3vw, 28px);
+        position: relative;
+      }
+
+      .viewer-community-articles[hidden] {
+        display: none;
+      }
+
+      .viewer-community-articles__layout {
+        position: relative;
+        z-index: 1;
+        display: grid;
+        grid-template-columns: minmax(0, 0.92fr) minmax(420px, 0.8fr);
+        gap: 18px;
+        align-items: start;
+        transition:
+          grid-template-columns 280ms cubic-bezier(.2, .8, .2, 1),
+          gap 280ms ease;
+      }
+
+      .viewer-community-articles.is-split.is-visual-info-open .viewer-community-articles__layout {
+        grid-template-columns: minmax(320px, 0.7fr) minmax(680px, 1.22fr);
+      }
+
+      .viewer-community-articles.is-split.is-graph-issue-open .viewer-community-articles__layout {
+        grid-template-columns: minmax(320px, 0.7fr) minmax(680px, 1.22fr);
+      }
+
+      .viewer-community-articles__copy {
+        --viewer-article-copy-pad-y: clamp(18px, 2.2vw, 28px);
+        --viewer-article-copy-pad-left: clamp(18px, 2.2vw, 28px);
+        --viewer-article-copy-pad-right: clamp(18px, 2.2vw, 28px);
+        display: grid;
+        gap: 16px;
+        min-width: 0;
+        position: relative;
+        padding:
+          var(--viewer-article-copy-pad-y)
+          var(--viewer-article-copy-pad-right)
+          var(--viewer-article-copy-pad-y)
+          var(--viewer-article-copy-pad-left);
+        border: 1px solid rgba(136, 215, 255, 0.13);
+        border-radius: 30px;
+        background:
+          linear-gradient(180deg, rgba(9, 18, 31, 0.82) 0, rgba(4, 9, 17, 0.76) 680px, rgba(4, 9, 17, 0.76) 100%);
+        box-shadow:
+          0 26px 72px rgba(0, 0, 0, 0.24),
+          inset 0 1px 0 rgba(255, 255, 255, 0.07);
+        overflow: visible;
+        -webkit-clip-path: inset(0 round 30px);
+        clip-path: inset(0 round 30px);
+      }
+
+      .viewer-community-articles__copy::before {
+        content: "";
+        position: absolute;
+        inset: 0;
+        pointer-events: none;
+        border-radius: inherit;
+        background:
+          radial-gradient(ellipse at -14% -10%, rgba(136, 215, 255, 0.1) 0, rgba(136, 215, 255, 0.072) 20%, rgba(136, 215, 255, 0) 56%),
+          radial-gradient(ellipse at 112% -8%, rgba(156, 255, 99, 0.072) 0, rgba(156, 255, 99, 0.052) 18%, rgba(156, 255, 99, 0) 54%),
+          linear-gradient(135deg, rgba(255, 255, 255, 0.09), transparent 28%, transparent 70%, rgba(136, 215, 255, 0.08));
+        opacity: 0.42;
+      }
+
+      .viewer-community-articles__head {
+        position: relative;
+        z-index: 1;
+        display: block;
+        min-width: 0;
+        width: 100%;
+        max-width: 100%;
+        box-sizing: border-box;
+        padding-top: clamp(4px, 0.5vw, 8px);
+      }
+
+      .viewer-community-articles__headline {
+        width: 100%;
+        max-width: 100%;
+        min-width: 0;
+      }
+
+      .viewer-community-articles__head .eyebrow {
+        padding: 0;
+        border: 0;
+        background: transparent;
+        box-shadow: none;
+        margin-bottom: 10px;
+      }
+
+      .viewer-community-articles__headline {
+        min-width: 0;
+        max-width: 100%;
+      }
+
+      .viewer-community-articles h3 {
+        max-width: 100%;
+        margin: 0;
+        max-width: 100%;
+        color: var(--text);
+        font-size: clamp(1.8rem, 3.2vw, 3rem);
+        line-height: 1;
+        letter-spacing: -0.06em;
+        overflow-wrap: break-word;
+        word-break: normal;
+      }
+
+      .viewer-community-articles__title-regular {
+        color: rgba(235, 248, 255, 0.86);
+        font-weight: 520;
+        letter-spacing: -0.045em;
+      }
+
+      .viewer-community-articles__head-actions {
+        display: flex;
+        align-items: flex-start;
+        justify-content: flex-end;
+        gap: 10px;
+        position: absolute;
+        top: -10px;
+        right: 0;
+        min-width: 0;
+      }
+
+      .viewer-community-articles__hide-toggle,
+      .viewer-community-articles__show-toggle {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: 8px;
+        min-height: 38px;
+        padding: 0 13px;
+        border: 1px solid rgba(136, 215, 255, 0.22);
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 18% 0%, rgba(156, 255, 99, 0.12), transparent 52%),
+          linear-gradient(180deg, rgba(136, 215, 255, 0.13), rgba(136, 215, 255, 0.055)),
+          rgba(7, 16, 29, 0.78);
+        color: rgba(238, 246, 255, 0.9);
+        box-shadow:
+          0 12px 30px rgba(0, 0, 0, 0.2),
+          inset 0 1px 0 rgba(255, 255, 255, 0.1);
+        cursor: pointer;
+        font: 780 0.72rem/1 "Space Grotesk", sans-serif;
+        letter-spacing: 0.12em;
+        text-transform: uppercase;
+        white-space: nowrap;
+        transition:
+          transform 240ms cubic-bezier(.2, .8, .2, 1),
+          width 240ms cubic-bezier(.2, .8, .2, 1),
+          padding 240ms cubic-bezier(.2, .8, .2, 1),
+          border-color 180ms ease,
+          background 180ms ease,
+          box-shadow 180ms ease,
+          opacity 180ms ease;
+      }
+
+      .viewer-community-articles:not(.is-split) .viewer-community-articles__hide-toggle,
+      .viewer-community-articles:not(.is-split) .viewer-community-articles__hide-float-tab {
+        display: none !important;
+      }
+
+      @keyframes viewerArticleHideFloatPop {
+        0% {
+          opacity: 0;
+          transform: translate(-100%, -50%) translateX(10px) scale(0.94);
+        }
+        100% {
+          opacity: 1;
+          transform: translate(-100%, -50%) translateX(0) scale(1);
+        }
+      }
+
+      .viewer-community-articles__hide-toggle:hover,
+      .viewer-community-articles__hide-toggle:focus-visible,
+      .viewer-community-articles__show-toggle:hover,
+      .viewer-community-articles__show-toggle:focus-visible {
+        outline: none;
+        border-color: rgba(156, 255, 99, 0.34);
+        background:
+          radial-gradient(circle at 22% 0%, rgba(156, 255, 99, 0.2), transparent 56%),
+          linear-gradient(180deg, rgba(136, 215, 255, 0.18), rgba(136, 215, 255, 0.07)),
+          rgba(9, 20, 36, 0.9);
+        box-shadow:
+          0 16px 38px rgba(0, 0, 0, 0.26),
+          0 0 0 5px rgba(156, 255, 99, 0.055),
+          inset 0 1px 0 rgba(255, 255, 255, 0.12);
+      }
+
+      .viewer-community-articles__sidebar-icon {
+        flex: 0 0 auto;
+        width: 17px;
+        height: 17px;
+      }
+
+      .viewer-community-articles__hide-float-tab {
+        position: fixed;
+        top: var(--viewer-community-article-hide-top, 72px);
+        left: var(--viewer-community-article-hide-left, 50vw);
+        z-index: 920;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: 42px;
+        height: 54px;
+        padding: 0;
+        border: 1px solid rgba(136, 215, 255, 0.2);
+        border-left-color: rgba(136, 215, 255, 0.24);
+        border-right-color: rgba(255, 255, 255, 0.08);
+        border-radius: 24px 8px 8px 24px;
+        background:
+          radial-gradient(circle at 8% 50%, rgba(136, 215, 255, 0.14), transparent 62%),
+          linear-gradient(90deg, rgba(8, 18, 32, 0.97), rgba(14, 32, 50, 0.9));
+        color: rgba(238, 246, 255, 0.92);
+        box-shadow:
+          0 34px 92px rgba(0, 0, 0, 0.64),
+          0 16px 42px rgba(0, 0, 0, 0.42),
+          inset 1px 0 0 rgba(255, 255, 255, 0.12);
+        cursor: pointer;
+        opacity: 0;
+        visibility: hidden;
+        pointer-events: none;
+        transform: translate(-100%, -50%) scale(0.94);
+        transform-origin: right center;
+        transition:
+          opacity 170ms ease,
+          visibility 0ms linear 170ms,
+          transform 240ms cubic-bezier(.2, .8, .2, 1),
+          border-color 160ms ease,
+          background 160ms ease,
+          box-shadow 160ms ease;
+      }
+
+      .viewer-community-articles__hide-float-tab:hover,
+      .viewer-community-articles__hide-float-tab:focus-visible {
+        outline: none;
+        border-color: rgba(156, 255, 99, 0.42);
+        border-right-color: rgba(255, 255, 255, 0.1);
+        background:
+          radial-gradient(circle at 8% 50%, rgba(156, 255, 99, 0.28), transparent 64%),
+          linear-gradient(90deg, rgba(10, 24, 40, 0.98), rgba(18, 42, 62, 0.94));
+        box-shadow:
+          0 32px 88px rgba(0, 0, 0, 0.62),
+          0 0 0 11px rgba(156, 255, 99, 0.08),
+          0 0 42px rgba(156, 255, 99, 0.2),
+          inset 1px 0 0 rgba(255, 255, 255, 0.16);
+        transform: translate(-100%, -50%) scale(1);
+      }
+
+      .viewer-community-articles__hide-float-tab .viewer-community-articles__sidebar-icon {
+        width: 19px;
+        height: 19px;
+      }
+
+      .viewer-community-articles.is-hide-toggle-floating.is-hide-float-positioned:not(.is-article-hidden) .viewer-community-articles__hide-float-tab {
+        opacity: 1;
+        visibility: visible;
+        pointer-events: auto;
+        animation: viewerArticleHideFloatPop 220ms cubic-bezier(.2, .8, .2, 1);
+        transition-delay: 0ms, 0ms, 0ms, 0ms, 0ms, 0ms;
+      }
+
+      .viewer-community-articles.is-split:not(.is-article-hidden) .viewer-community-articles__visual-dots,
+      .viewer-community-articles.is-split:not(.is-article-hidden) .viewer-community-articles__show-toggle {
+        display: none;
+      }
+
+      .viewer-community-articles.is-hide-toggle-floating:not(.is-article-hidden) .viewer-community-articles__hide-toggle {
+        opacity: 0;
+        pointer-events: none;
+      }
+
+      .viewer-community-articles.is-hide-toggle-floating:not(.is-article-hidden) .viewer-community-articles__hide-toggle span {
+        position: absolute;
+        width: 1px;
+        height: 1px;
+        overflow: hidden;
+        clip: rect(0 0 0 0);
+        white-space: nowrap;
+      }
+
+      .viewer-community-articles__dek,
+      .viewer-community-articles__body,
+      .viewer-community-articles__comments {
+        position: relative;
+        z-index: 1;
+        min-width: 0;
+
+        width: 100%;
+        max-width: 100%;
+        box-sizing: border-box;
+
+        color: rgba(235, 248, 255, 0.88);
+        line-height: 1.75;
+        overflow-wrap: break-word;
+      }
+
+      .viewer-community-articles__body > * {
+        max-width: 100%;
+        box-sizing: border-box;
+      }
+
+      .viewer-community-articles__byline {
+        position: relative;
+        z-index: 1;
+        display: flex;
+        align-items: center;
+        gap: 12px;
+        color: rgba(197, 208, 227, 0.68);
+      }
+
+      .viewer-community-articles__byline a {
+        color: rgba(161, 232, 255, 0.88);
+        text-decoration: none;
+      }
+
+      .viewer-community-articles__byline-title,
+      .viewer-community-articles__byline-username {
+        line-height: 1.35;
+      }
+
+      .viewer-community-articles__byline-username {
+        margin-top: 1px;
+      }
+
+      .viewer-community-articles__byline a:hover,
+      .viewer-community-articles__byline a:focus-visible {
+        color: rgba(235, 248, 255, 0.98);
+        text-decoration: underline;
+        text-underline-offset: 0.16em;
+      }
+
+      .viewer-community-articles__byline-title-link {
+        color: inherit !important;
+        text-decoration: none !important;
+        border-radius: 0.45em;
+        transition:
+          color 160ms ease,
+          background 160ms ease,
+          box-shadow 160ms ease;
+      }
+
+      .viewer-community-articles__byline-title-link:hover,
+      .viewer-community-articles__byline-title-link:focus-visible {
+        color: rgba(235, 248, 255, 0.94) !important;
+        text-decoration: none !important;
+        background: rgba(136, 215, 255, 0.07);
+        box-shadow: 0 0 0 4px rgba(136, 215, 255, 0.06);
+        outline: none;
+      }
+
+      .viewer-community-articles__date {
+        margin-top: 4px;
+        color: rgba(197, 208, 227, 0.76);
+        font-size: 0.72rem;
+        font-weight: 800;
+        letter-spacing: 0.12em;
+        text-transform: uppercase;
+      }
+
+      .hf-blog-preview {
+        width: min(100%, 1040px);
+        margin: clamp(24px, 5vw, 62px) auto clamp(42px, 7vw, 92px);
+        padding: 0 clamp(14px, 3.2vw, 30px);
+        box-sizing: border-box;
+      }
+
+      .hf-blog-preview__copy {
+        --viewer-article-copy-pad-left: clamp(22px, 4vw, 48px);
+        --viewer-article-copy-pad-right: clamp(22px, 4vw, 48px);
+        width: 100%;
+        max-width: none;
+        margin: 0 auto;
+        min-height: auto;
+      }
+
+      .hf-blog-preview__copy::before {
+        border-radius: inherit;
+      }
+
+      .hf-blog-preview__head {
+        gap: 18px;
+      }
+
+      .hf-blog-preview__head .pill {
+        white-space: nowrap;
+      }
+
+      .hf-blog-preview__eyebrow-break {
+        display: none;
+      }
+
+      .hf-blog-preview #hf-blog-preview-title {
+        font-family: "Inter", sans-serif;
+        font-size: clamp(2.1rem, 3.4vw, 3.5rem);
+        line-height: 0.98;
+        letter-spacing: -0.05em;
+      }
+
+      .hf-blog-preview .viewer-community-articles__byline,
+      .hf-blog-preview .viewer-community-articles__dek,
+      .hf-blog-preview .viewer-community-articles__body {
+        width: min(100%, 760px);
+        max-width: 760px;
+        margin-left: auto;
+        margin-right: auto;
+      }
+
+      .hf-blog-preview .viewer-community-articles__body {
+        color: rgba(232, 242, 250, 0.91);
+        font-size: clamp(1.01rem, 1.42vw, 1.13rem);
+      }
+
+      .hf-blog-preview .viewer-community-articles__media {
+        width: min(100%, 900px);
+        max-width: 900px;
+        margin: 22px auto;
+        padding: clamp(8px, 1.8vw, 13px);
+        border-radius: 24px;
+        background:
+          linear-gradient(180deg, rgba(136, 215, 255, 0.105), rgba(156, 255, 99, 0.035)),
+          rgba(2, 8, 16, 0.7);
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.1),
+          0 22px 70px rgba(0, 0, 0, 0.28);
+      }
+
+      .hf-blog-preview .viewer-community-articles__media img {
+        display: block;
+        width: 100%;
+        max-width: 100%;
+        border-radius: 17px;
+      }
+
+      /* Portrait walkthrough video: on desktop it sits to the RIGHT of the
+         text instead of spanning the column - the video keeps its own size
+         (max-width 520px / max-height 78vh constraints), the frame shrinks
+         to fit it, and the article text flows alongside. */
+      @media (min-width: 981px) {
+        .hf-blog-preview .viewer-community-articles__media:has(video) {
+          float: right;
+          clear: right;
+          width: auto;
+          /* wide enough that the video keeps its full current size
+             (max-height 78vh -> ~440px wide portrait + frame padding) */
+          max-width: min(52%, 600px);
+          margin: 4px 0 20px 28px;
+        }
+        .hf-blog-preview .viewer-community-articles__body::after {
+          content: "";
+          display: block;
+          clear: both;
+        }
+      }
+
+      @media (max-width: 720px) {
+        .hf-blog-preview {
+          margin-top: 14px;
+          padding-inline: 10px;
+        }
+
+        .hf-blog-preview__copy {
+          --viewer-article-copy-pad-left: 18px;
+          --viewer-article-copy-pad-right: 18px;
+          padding: 22px 18px 28px;
+          border-radius: 28px;
+        }
+
+        .hf-blog-preview__head {
+          display: block;
+          min-height: 64px;
+          padding-top: 0;
+        }
+
+        .hf-blog-preview__head .pill {
+          position: absolute;
+          top: 0;
+          right: 0;
+        }
+
+        .hf-blog-preview__eyebrow {
+          display: inline-flex;
+          flex-direction: row;
+          align-items: center;
+          min-height: 42px;
+          line-height: 1.05;
+        }
+
+        .hf-blog-preview__eyebrow-break {
+          display: block;
+        }
+
+        .hf-blog-preview #hf-blog-preview-title {
+          font-size: clamp(1.72rem, 8vw, 2.52rem);
+          margin: 18px 0 16px;
+          max-width: 100%;
+        }
+
+        .hf-blog-preview .viewer-community-articles__media {
+          width: calc(100% + 18px);
+          max-width: none;
+          margin-left: -9px;
+          margin-right: -9px;
+          border-radius: 20px;
+        }
+      }
+
+      .viewer-community-articles__socials {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 7px;
+        margin-top: 5px;
+      }
+
+      .viewer-community-articles__socials a {
+        display: inline-flex;
+        align-items: center;
+        min-width: 0;
+        max-width: min(340px, 78vw);
+        gap: 6px;
+        padding: 3px 8px 3px 6px;
+        border: 1px solid rgba(235, 248, 255, 0.1);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.035);
+        color: rgba(235, 248, 255, 0.84);
+        font-size: 0.8rem;
+        font-weight: 660;
+        line-height: 1.25;
+        text-decoration: none;
+        transition:
+          border-color 160ms ease,
+          background 160ms ease,
+          color 160ms ease,
+          transform 160ms ease;
+      }
+
+      .viewer-community-articles__socials a:hover,
+      .viewer-community-articles__socials a:focus-visible {
+        border-color: rgba(235, 248, 255, 0.22);
+        background: rgba(255, 255, 255, 0.065);
+        color: rgba(235, 248, 255, 0.96);
+        transform: translateY(-1px);
+      }
+
+      .viewer-community-articles__social-icon {
+        width: 15px;
+        height: 15px;
+        flex: 0 0 auto;
+        color: currentColor;
+      }
+
+      .viewer-community-articles__social-label {
+        min-width: 0;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .viewer-community-articles__avatar {
+        width: 48px;
+        height: 48px;
+        border-radius: 999px;
+        object-fit: cover;
+        border: 1.5px solid rgba(235, 248, 255, 0.82);
+        box-shadow:
+          0 10px 24px rgba(0, 0, 0, 0.24),
+          0 0 0 5px rgba(136, 215, 255, 0.07);
+      }
+
+      .viewer-community-articles__body p {
+        margin: 0 0 1em;
+      }
+
+      .viewer-community-articles__body h2,
+      .viewer-community-articles__body h3 {
+        margin: 1.2em 0 0.45em;
+        color: rgba(235, 248, 255, 0.96);
+        letter-spacing: -0.045em;
+        line-height: 1.08;
+      }
+
+      .viewer-community-articles__body h2 {
+        font-size: clamp(1.45rem, 2.7vw, 2.2rem);
+      }
+
+      .viewer-community-articles__body h3 {
+        font-size: clamp(1.18rem, 2.2vw, 1.55rem);
+      }
+
+      .viewer-community-articles__body blockquote {
+        margin:
+          0
+          calc(-1 * var(--viewer-article-copy-pad-right, clamp(18px, 2.2vw, 28px)))
+          1em
+          calc(-1 * var(--viewer-article-copy-pad-left, clamp(18px, 2.2vw, 28px)));
+        max-width: none;
+        position: relative;
+        isolation: isolate;
+        padding:
+          22px
+          calc(var(--viewer-article-copy-pad-right, clamp(18px, 2.2vw, 28px)) + 8px)
+          22px
+          calc(var(--viewer-article-copy-pad-left, clamp(18px, 2.2vw, 28px)) + 52px);
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        color: rgba(231, 243, 252, 0.92);
+        overflow: visible;
+      }
+
+      .viewer-community-articles__body blockquote::before {
+        content: "";
+        position: absolute;
+        z-index: 1;
+        top: 50%;
+        left: calc(var(--viewer-article-copy-pad-left, clamp(18px, 2.2vw, 28px)) + 19px);
+        width: 10px;
+        height: 10px;
+        border-radius: 999px;
+        background: #9cff63;
+        box-shadow:
+          0 0 0 8px rgba(156, 255, 99, 0.065),
+          0 0 30px rgba(156, 255, 99, 0.36),
+          0 0 72px rgba(136, 215, 255, 0.12);
+        transform: translateY(-50%);
+        pointer-events: none;
+      }
+
+      .viewer-community-articles__body blockquote::after {
+        content: "";
+        position: absolute;
+        z-index: 0;
+        top: 50%;
+        left: -82px;
+        width: 274px;
+        height: 154px;
+        border-radius: 999px;
+        opacity: 0.88;
+        background: rgba(156, 255, 99, 0.14);
+        box-shadow:
+          92px -22px 92px rgba(136, 215, 255, 0.13),
+          160px 40px 92px rgba(136, 215, 255, 0.062);
+        filter: blur(24px);
+        transform: translateY(-50%);
+        pointer-events: none;
+      }
+
+      .viewer-community-articles__body ul,
+      .viewer-community-articles__body ol {
+        margin: 0 0 1em;
+        padding-left: 1.35em;
+      }
+
+      .viewer-community-articles__body li {
+        margin: 0.26em 0;
+      }
+
+      .viewer-community-articles__meta {
+        position: relative;
+        z-index: 1;
+        display: flex;
+        flex-wrap: wrap;
+        gap: 10px;
+        align-items: center;
+      }
+
+      .viewer-community-articles__actions {
+        gap: 12px;
+        padding-top: 10px;
+      }
+
+      /* The first-party hide sets the hidden attribute; the display rules on
+         these classes would otherwise win over the UA's [hidden] default. */
+      .viewer-community-articles__meta[hidden],
+      .viewer-community-articles__comments[hidden],
+      .viewer-community-articles__comment-form[hidden] {
+        display: none !important;
+      }
+
+      .viewer-community-articles__action {
+        min-height: 44px;
+        padding: 0 18px;
+        border-color: rgba(136, 215, 255, 0.22);
+        background:
+          linear-gradient(180deg, rgba(136, 215, 255, 0.14), rgba(136, 215, 255, 0.06)),
+          rgba(7, 16, 29, 0.72);
+        box-shadow:
+          0 14px 34px rgba(0, 0, 0, 0.2),
+          inset 0 1px 0 rgba(255, 255, 255, 0.1);
+      }
+
+      .viewer-community-articles__action:hover,
+      .viewer-community-articles__action:focus-visible {
+        border-color: rgba(136, 215, 255, 0.42);
+        background:
+          linear-gradient(180deg, rgba(136, 215, 255, 0.2), rgba(136, 215, 255, 0.08)),
+          rgba(10, 22, 38, 0.86);
+      }
+
+      .viewer-community-articles__heart {
+        min-width: 82px;
+        color: #ffdfe7;
+        border-color: rgba(255, 122, 158, 0.28);
+        background:
+          radial-gradient(circle at 50% 0%, rgba(255, 122, 158, 0.2), transparent 60%),
+          linear-gradient(180deg, rgba(255, 122, 158, 0.13), rgba(136, 215, 255, 0.055)),
+          rgba(7, 16, 29, 0.76);
+      }
+
+      .viewer-community-articles__heart svg {
+        width: 17px;
+        height: 17px;
+        color: #ff7a9e;
+        filter: drop-shadow(0 0 10px rgba(255, 122, 158, 0.28));
+      }
+
+      .viewer-community-articles__heart-count {
+        color: rgba(235, 248, 255, 0.96);
+        font-weight: 840;
+      }
+
+      .viewer-community-articles__heart.is-heart-updated svg {
+        animation: viewerArticleHeartPulse 520ms cubic-bezier(0.2, 0.9, 0.22, 1);
+      }
+
+      .viewer-community-articles__heart.is-heart-updated .viewer-community-articles__heart-count {
+        animation: viewerArticleHeartCountPop 520ms cubic-bezier(0.2, 0.9, 0.22, 1);
+      }
+
+      .viewer-community-articles__bookmark.is-bookmarked {
+        border-color: rgba(156, 255, 99, 0.34);
+        color: #e7ffd8;
+        background:
+          radial-gradient(circle at 50% 0%, rgba(156, 255, 99, 0.18), transparent 62%),
+          linear-gradient(180deg, rgba(156, 255, 99, 0.14), rgba(136, 215, 255, 0.055)),
+          rgba(7, 16, 29, 0.76);
+      }
+
+      @keyframes viewerArticleHeartPulse {
+        0% {
+          transform: scale(1);
+          filter: drop-shadow(0 0 10px rgba(255, 122, 158, 0.28));
+        }
+        42% {
+          transform: scale(1.22);
+          filter: drop-shadow(0 0 18px rgba(255, 122, 158, 0.62));
+        }
+        100% {
+          transform: scale(1);
+          filter: drop-shadow(0 0 10px rgba(255, 122, 158, 0.28));
+        }
+      }
+
+      @keyframes viewerArticleHeartCountPop {
+        0% {
+          transform: translateY(0);
+        }
+        42% {
+          transform: translateY(-1px) scale(1.08);
+        }
+        100% {
+          transform: translateY(0);
+        }
+      }
+
+      .viewer-community-articles__comment-form {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) auto;
+        gap: 10px;
+        align-items: center;
+        margin-top: 2px;
+        padding: 10px;
+        border: 1px solid rgba(136, 215, 255, 0.13);
+        border-radius: 24px;
+        background:
+          radial-gradient(circle at 0% 0%, rgba(136, 215, 255, 0.08), transparent 34%),
+          rgba(0, 0, 0, 0.18);
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
+      }
+
+      .viewer-community-articles__select,
+      .viewer-community-articles__comment-input {
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        border-radius: 999px;
+        background: rgba(0, 0, 0, 0.26);
+        color: var(--text);
+        padding: 10px 12px;
+      }
+
+      .viewer-community-articles__comment-input {
+        width: 100%;
+        min-height: 44px;
+        padding: 0 16px;
+        border-color: rgba(136, 215, 255, 0.14);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.015)),
+          rgba(1, 5, 12, 0.52);
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.05),
+          0 10px 26px rgba(0, 0, 0, 0.12);
+      }
+
+      .viewer-community-articles__comment-input:focus {
+        border-color: rgba(136, 215, 255, 0.42);
+        outline: none;
+        box-shadow:
+          0 0 0 3px rgba(136, 215, 255, 0.1),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      }
+
+      .viewer-community-articles__comment-submit {
+        min-height: 44px;
+        padding: 0 18px;
+        border-color: rgba(156, 255, 99, 0.26);
+        background:
+          linear-gradient(135deg, rgba(156, 255, 99, 0.24), rgba(136, 215, 255, 0.1)),
+          rgba(8, 18, 30, 0.82);
+        color: rgba(235, 255, 224, 0.96);
+      }
+
+      .viewer-community-articles__visual {
+        --viewer-community-article-frame-clip: none;
+        --viewer-community-article-sticky-top: 18px;
+        --viewer-community-article-sticky-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
+        --graph-issue-panel-gap: 14px;
+        --graph-issue-panel-inset: 12px;
+        --graph-issue-panel-width: clamp(320px, 30vw, 394px);
+        position: sticky;
+        top: var(--viewer-community-article-sticky-top);
+        display: grid;
+        gap: 10px;
+        max-height: calc(100vh - var(--viewer-community-article-sticky-top) - var(--viewer-community-article-sticky-bottom));
+        max-height: calc(100dvh - var(--viewer-community-article-sticky-top) - var(--viewer-community-article-sticky-bottom));
+        opacity: 0;
+        transform: translateX(24px) scale(0.985);
+        transition:
+          opacity 360ms ease,
+          transform 520ms cubic-bezier(.2, .8, .2, 1);
+      }
+
+      .viewer-community-articles__visual::after {
+        content: "";
+        position: absolute;
+        inset: 0;
+        z-index: 3;
+        pointer-events: none;
+        opacity: 0;
+        border: 1px solid rgba(136, 215, 255, 0.12);
+        border-radius: 24px;
+        background:
+          radial-gradient(circle at 20% 8%, rgba(136, 215, 255, 0.16), transparent 32%),
+          radial-gradient(circle at 78% 22%, rgba(156, 255, 99, 0.1), transparent 34%),
+          linear-gradient(180deg, rgba(8, 17, 30, 0.86), rgba(3, 8, 16, 0.92));
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.07),
+          0 24px 64px rgba(0, 0, 0, 0.24);
+        transition: opacity 180ms ease;
+      }
+
+      .viewer-community-articles__visual::before {
+        content: "Loading model view";
+        position: absolute;
+        left: 50%;
+        top: calc(50% + 24px);
+        z-index: 4;
+        pointer-events: none;
+        opacity: 0;
+        transform: translate(-50%, -50%);
+        padding: 10px 14px;
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 999px;
+        background: rgba(2, 7, 14, 0.62);
+        color: rgba(235, 248, 255, 0.82);
+        font-size: 0.74rem;
+        font-weight: 780;
+        letter-spacing: 0.13em;
+        text-transform: uppercase;
+        box-shadow:
+          0 14px 34px rgba(0, 0, 0, 0.22),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        transition: opacity 180ms ease;
+      }
+
+      .viewer-community-articles.is-visual-loading .viewer-community-articles__visual::after,
+      .viewer-community-articles.is-visual-loading .viewer-community-articles__visual::before {
+        opacity: 1;
+      }
+
+      .viewer-community-articles__visual-controls {
+        display: grid;
+        gap: 8px;
+        min-width: 0;
+      }
+
+      .viewer-community-articles__visual-dots {
+        display: none;
+        align-items: center;
+        gap: 8px;
+        flex: 0 0 auto;
+      }
+
+      .viewer-community-articles__visual-dots span {
+        display: block;
+        width: 10px;
+        height: 10px;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.24);
+        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
+      }
+
+      .viewer-community-articles__visual-dots span:first-child {
+        background: rgba(255, 255, 255, 0.24);
+      }
+
+      .viewer-community-articles__visual-dots span:nth-child(2) {
+        background: rgba(255, 255, 255, 0.24);
+      }
+
+      .viewer-community-articles__visual-dots span:last-child {
+        background: rgba(156, 255, 99, 0.88);
+        box-shadow: 0 0 0 3px rgba(156, 255, 99, 0.08);
+      }
+
+      .viewer-community-articles__show-toggle {
+        display: none;
+      }
+
+      .viewer-community-articles__granularity {
+        width: 100%;
+      }
+
+      .viewer-community-articles__visual .viewer-community-articles__iframe {
+        height: calc(100vh - 116px);
+        min-height: 560px;
+      }
+
+      .viewer-community-articles.is-split .viewer-community-articles__visual {
+        grid-template-rows: auto minmax(0, 1fr);
+        height: calc(100vh - var(--viewer-community-article-sticky-top) - var(--viewer-community-article-sticky-bottom));
+        height: calc(100dvh - var(--viewer-community-article-sticky-top) - var(--viewer-community-article-sticky-bottom));
+        opacity: 1;
+        transform: translateX(0) scale(1);
+      }
+
+      .viewer-community-articles.is-split .viewer-community-articles__visual .viewer-community-articles__iframe {
+        height: 100%;
+        min-height: 0;
+      }
+
+      .viewer-community-articles.is-article-hidden {
+        padding: 0 0 max(8px, env(safe-area-inset-bottom));
+        border: 0;
+        background: transparent;
+        box-shadow: none;
+        overflow: visible;
+      }
+
+      .viewer-community-articles.is-article-hidden::before,
+      .viewer-community-articles.is-article-hidden::after {
+        display: none;
+      }
+
+      .viewer-community-articles.is-article-hidden .viewer-community-articles__layout {
+        grid-template-columns: minmax(0, 1fr);
+        gap: 0;
+      }
+
+      .viewer-community-articles.is-article-hidden .viewer-community-articles__copy {
+        display: none;
+      }
+
+      .viewer-community-articles.is-article-hidden .viewer-community-articles__visual {
+        position: relative;
+        top: auto;
+        display: grid;
+        grid-template-rows: auto minmax(0, 1fr);
+        gap: 0;
+        height: min(920px, calc(100vh - 172px));
+        height: min(920px, calc(100dvh - 172px));
+        min-height: min(620px, calc(100vh - 172px));
+        min-height: min(620px, calc(100dvh - 172px));
+        max-height: calc(100vh - 172px);
+        max-height: calc(100dvh - 172px);
+        opacity: 1;
+        transform: none;
+        border-radius: 30px;
+        border: 1px solid rgba(255, 255, 255, 0.09);
+        background: var(--preview-surface);
+        box-shadow:
+          var(--shadow),
+          inset 0 0 0 1px rgba(255, 255, 255, 0.08);
+        overflow: hidden;
+      }
+
+      .viewer-community-articles.is-article-hidden .viewer-community-articles__visual-controls {
+        display: flex;
+        align-items: center;
+        gap: 16px;
+        min-width: 0;
+        padding: 15px 18px;
+        border-bottom: 0;
+        background: linear-gradient(180deg, rgba(5, 9, 20, 0.38), rgba(5, 9, 20, 0.14));
+        backdrop-filter: blur(18px) saturate(1.08);
+      }
+
+      .viewer-community-articles.is-article-hidden .viewer-community-articles__visual-dots,
+      .viewer-community-articles.is-article-hidden .viewer-community-articles__show-toggle {
+        display: inline-flex;
+      }
+
+      .viewer-community-articles:not(.is-article-hidden) .viewer-community-articles__visual-dots {
+        display: none !important;
+      }
+
+      .viewer-community-articles.is-article-hidden .viewer-community-articles__visual-dots .viewer-frame__dot {
+        pointer-events: auto;
+      }
+
+      .viewer-community-articles.is-article-hidden .viewer-community-articles__show-toggle {
+        min-height: 34px;
+        padding: 0 12px;
+      }
+
+      .viewer-community-articles.is-article-hidden .viewer-community-articles__granularity {
+        width: auto;
+        margin-left: auto;
+      }
+
+      .viewer-community-articles.is-article-hidden .viewer-community-articles__visual .viewer-community-articles__iframe {
+        height: 100%;
+        min-height: 0;
+        border: 0;
+        border-radius: 0;
+      }
+
+      .viewer-community-articles.is-article-hidden.is-visual-info-open .viewer-community-articles__visual-controls,
+      .viewer-community-articles.is-article-hidden.is-visual-info-open .viewer-community-articles__visual .viewer-community-articles__iframe {
+        width: 100%;
+      }
+
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route,
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route__head,
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route__intro,
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route__actions {
+        border: 0 !important;
+        border-top: 0 !important;
+        border-bottom: 0 !important;
+        background-image: none !important;
+        box-shadow: none !important;
+      }
+
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route::before,
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route::after,
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route__head::before,
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route__head::after,
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route__intro::before,
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route__intro::after,
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route__actions::before,
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-route__actions::after {
+        display: none !important;
+        content: none !important;
+      }
+
+      body.route-viewer.route-viewer-article .page.route-viewer.viewer-community-article-active .viewer-frame__bar {
+        border-bottom: 0 !important;
+      }
+
+      body.route-viewer.route-viewer-article:not(.route-viewer-article-hidden) .page.route-viewer .viewer-frame {
+        display: none !important;
+        height: 0 !important;
+        min-height: 0 !important;
+        margin: 0 !important;
+        padding: 0 !important;
+        border: 0 !important;
+        background: transparent !important;
+        box-shadow: none !important;
+        overflow: hidden !important;
+      }
+
+      body.route-viewer.viewer-community-article-active.route-viewer-article-hidden {
+        overflow-y: hidden;
+      }
+
+      body.route-viewer.route-viewer-article-hidden .page.route-viewer.viewer-community-article-active,
+      body.route-viewer.route-viewer-article-hidden .page.route-viewer.viewer-community-article-active .shell {
+        height: 100vh;
+        height: 100dvh;
+        min-height: 100vh;
+        min-height: 100dvh;
+        overflow: hidden;
+      }
+
+      body.route-viewer.route-viewer-article-hidden .page.route-viewer.viewer-community-article-active .viewer-route {
+        gap: 20px;
+        min-height: 0;
+      }
+
+      body.route-viewer.route-viewer-article-hidden .page.route-viewer.viewer-community-article-active .viewer-route__head {
+        margin-bottom: 0;
+      }
+
+      body.route-viewer.route-viewer-article-hidden .viewer-route .viewer-frame {
+        display: none !important;
+      }
+
+      /* with the article hidden the graph panel should fill the viewport
+         exactly like the plain model page - flex-fill the route chain
+         instead of the fixed 920px/172px reserve, which left a dead band
+         under the panel (large on tall windows) */
+      body.route-viewer.route-viewer-article-hidden .page.route-viewer.viewer-community-article-active .viewer-route {
+        flex: 1 1 auto;
+      }
+
+      body.route-viewer.route-viewer-article-hidden .page.route-viewer.viewer-community-article-active .viewer-community-articles.is-article-hidden {
+        flex: 1 1 auto;
+        min-height: 0;
+        grid-template-rows: minmax(0, 1fr);
+      }
+
+      body.route-viewer.route-viewer-article-hidden .page.route-viewer.viewer-community-article-active .viewer-community-articles.is-article-hidden .viewer-community-articles__layout {
+        height: 100%;
+        min-height: 0;
+      }
+
+      body.route-viewer.route-viewer-article-hidden .page.route-viewer.viewer-community-article-active .viewer-community-articles.is-article-hidden .viewer-community-articles__visual {
+        height: 100%;
+        min-height: 0;
+        max-height: none;
+      }
+
+      .viewer-community-articles.is-split.is-visual-info-open .viewer-community-articles__visual {
+        grid-template-rows: auto minmax(0, 1fr);
+        height: calc(100vh - var(--viewer-community-article-sticky-top) - var(--viewer-community-article-sticky-bottom));
+        height: calc(100dvh - var(--viewer-community-article-sticky-top) - var(--viewer-community-article-sticky-bottom));
+        min-height: 0;
+      }
+
+      .viewer-community-articles.is-split.is-visual-info-open .viewer-community-articles__visual-controls {
+        position: relative;
+        z-index: 2;
+        grid-column: 1;
+        grid-row: 1;
+        width: var(--viewer-community-article-graph-slot-width, 100%);
+        max-width: 100%;
+      }
+
+      .viewer-community-articles.is-split.is-visual-info-open .viewer-community-articles__visual .viewer-community-articles__iframe {
+        z-index: 1;
+        grid-column: 1;
+        grid-row: 1 / 3;
+        height: 100%;
+        min-height: 0;
+        border-color: transparent;
+        background: transparent;
+        -webkit-clip-path: var(--viewer-community-article-frame-clip, none);
+        clip-path: var(--viewer-community-article-frame-clip, none);
+      }
+
+      .viewer-community-articles.is-split.is-graph-issue-open .viewer-community-articles__visual-controls,
+      .viewer-community-articles.is-split.is-graph-issue-open .viewer-community-articles__visual .viewer-community-articles__iframe {
+        width: calc(
+          100% -
+          min(var(--graph-issue-panel-width), calc(100% - 24px)) -
+          var(--graph-issue-panel-gap) -
+          var(--graph-issue-panel-inset)
+        );
+        max-width: 100%;
+        transition:
+          width 230ms ease,
+          margin-right 230ms ease,
+          clip-path 230ms ease,
+          -webkit-clip-path 230ms ease;
+      }
+
+      .viewer-community-articles__visual > .graph-issue-panel {
+        top: calc(12px + var(--viewer-community-article-report-panel-top, 0px));
+        bottom: 12px;
+        max-height: calc(100% - 24px - var(--viewer-community-article-report-panel-top, 0px));
+      }
+
+      @media (max-width: 980px) {
+        body.route-viewer.route-viewer-article .viewer-community-articles__hide-toggle,
+        body.route-viewer.route-viewer-article .viewer-community-articles__hide-float-tab {
+          display: none !important;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles {
+          gap: 0;
+          padding:
+            clamp(16px, 4vw, 22px) max(12px, env(safe-area-inset-right))
+            24px max(12px, env(safe-area-inset-left));
+          -webkit-clip-path: inset(0 round 30px);
+          clip-path: inset(0 round 30px);
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__layout {
+          display: block;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__visual {
+          display: none;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles.is-article-hidden .viewer-community-articles__layout {
+          display: grid;
+          grid-template-columns: minmax(0, 1fr);
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles.is-article-hidden .viewer-community-articles__copy {
+          display: none;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles.is-article-hidden .viewer-community-articles__visual {
+          display: grid;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__copy {
+          --viewer-article-copy-pad-y: 0px;
+          --viewer-article-outer-pad-left: max(12px, env(safe-area-inset-left));
+          --viewer-article-outer-pad-right: max(12px, env(safe-area-inset-right));
+          --viewer-article-copy-pad-left: calc(max(16px, env(safe-area-inset-left)) + var(--viewer-article-outer-pad-left));
+          --viewer-article-copy-pad-right: calc(max(16px, env(safe-area-inset-right)) + var(--viewer-article-outer-pad-right));
+          --viewer-article-rich-edge-gutter: clamp(8px, 2.2vw, 12px);
+          --viewer-article-rich-breakout-left: calc(max(16px, env(safe-area-inset-left)) + var(--viewer-article-outer-pad-left) - var(--viewer-article-rich-edge-gutter));
+          --viewer-article-rich-breakout-right: calc(max(16px, env(safe-area-inset-right)) + var(--viewer-article-outer-pad-right) - var(--viewer-article-rich-edge-gutter));
+          padding:
+            0 max(16px, env(safe-area-inset-right))
+            0 max(16px, env(safe-area-inset-left));
+          border: 0;
+          border-radius: 0;
+          background: transparent;
+          box-shadow: none;
+          overflow: visible;
+          -webkit-clip-path: none;
+          clip-path: none;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__copy::before {
+          content: none;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__head,
+        body.route-viewer.route-viewer-article .viewer-community-articles__byline,
+        body.route-viewer.route-viewer-article .viewer-community-articles__dek,
+        body.route-viewer.route-viewer-article .viewer-community-articles__body,
+        body.route-viewer.route-viewer-article .viewer-community-articles__meta,
+        body.route-viewer.route-viewer-article .viewer-community-articles__comments {
+          width: 100%;
+          max-width: 100%;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__body pre,
+        body.route-viewer.route-viewer-article .viewer-community-articles__media,
+        body.route-viewer.route-viewer-article .viewer-community-articles__html-block,
+        body.route-viewer.route-viewer-article .viewer-community-articles__table-set {
+          width: calc(100% + var(--viewer-article-rich-breakout-left) + var(--viewer-article-rich-breakout-right));
+          max-width: none;
+          margin-left: calc(-1 * var(--viewer-article-rich-breakout-left));
+          margin-right: calc(-1 * var(--viewer-article-rich-breakout-right));
+          box-sizing: border-box;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__table-set,
+        body.route-viewer.route-viewer-article .viewer-community-articles__table-set .viewer-editorial__deployment-wrap {
+          justify-self: stretch;
+          width: calc(100% + var(--viewer-article-rich-breakout-left) + var(--viewer-article-rich-breakout-right));
+          max-width: none;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__table-set .viewer-editorial__deployment-wrap {
+          width: 100%;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__media img,
+        body.route-viewer.route-viewer-article .viewer-community-articles__media audio,
+        body.route-viewer.route-viewer-article .viewer-community-articles__media video,
+        body.route-viewer.route-viewer-article .viewer-community-articles__media-video {
+          width: 100%;
+          max-width: 100%;
+        }
+      }
+
+      @media (max-width: 1500px) {
+        .hf-article-actions {
+          flex-wrap: wrap;
+          max-width: none;
+          min-width: 0;
+        }
+      }
+
+      @media (max-width: 980px) {
+        .page.route-hf-article-editor {
+          height: auto;
+          min-height: 100dvh;
+          overflow: visible;
+        }
+
+        .page.route-hf-article-editor .shell {
+          height: auto;
+        }
+
+        .hf-article-page {
+          height: auto;
+          min-height: 100dvh;
+          overflow: visible;
+          padding: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) 14px max(8px, env(safe-area-inset-left));
+        }
+
+        .hf-article-shell {
+          height: auto;
+          gap: 8px;
+        }
+
+        .hf-article-top,
+        .hf-article-editor,
+        .viewer-community-articles__layout {
+          grid-template-columns: 1fr;
+        }
+
+        .hf-article-top {
+          display: grid;
+          gap: 10px;
+          padding: 12px;
+          border: 1px solid rgba(136, 215, 255, 0.16);
+          border-radius: 22px;
+        }
+
+        .hf-article-top .eyebrow {
+          font-size: 0.66rem;
+          letter-spacing: 0.12em;
+        }
+
+        .hf-article-top__copy {
+          gap: 6px;
+        }
+
+        .hf-article-field--title .hf-article-input {
+          font-size: clamp(1.12rem, 5.3vw, 1.5rem);
+          line-height: 1.08;
+        }
+
+        .hf-article-top.is-intro-open .hf-article-field--intro {
+          max-height: 100px;
+        }
+
+        .hf-article-field--intro .hf-article-textarea {
+          max-height: 58px;
+          font-size: 0.86rem;
+        }
+
+        .hf-article-actions {
+          display: grid;
+          grid-template-columns: repeat(3, minmax(0, 1fr));
+          width: 100%;
+          gap: 6px;
+          flex-wrap: nowrap;
+          justify-content: flex-start;
+          max-width: none;
+          min-width: 0;
+        }
+
+        .hf-article-button {
+          min-height: 38px;
+          gap: 5px;
+          padding: 0 8px;
+          font-size: 0.76rem;
+        }
+
+        .hf-article-button span {
+          min-width: 0;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+
+        .hf-article-button svg {
+          width: 15px;
+          height: 15px;
+        }
+
+        .hf-article-button--primary {
+          grid-column: 1 / -1;
+          min-height: 42px;
+          font-size: 0.86rem;
+        }
+
+        .hf-article-editor {
+          display: flex;
+          flex-direction: column;
+          gap: 8px;
+          height: auto;
+          overflow: visible;
+          padding: 0;
+        }
+
+        .hf-article-editor__canvas {
+          order: 1;
+          position: relative;
+          isolation: isolate;
+          height: auto;
+          overflow: visible;
+          gap: 8px;
+          min-height: calc(
+            var(--hf-article-mobile-body-top, 0px) +
+            var(--hf-article-mobile-body-height, 54dvh) +
+            16px
+          );
+          padding: 0;
+          border: 0;
+          border-radius: 20px;
+          background: transparent;
+          box-shadow: none;
+        }
+
+        .hf-article-editor__preview {
+          order: 0;
+          position: sticky;
+          top: max(6px, env(safe-area-inset-top));
+          z-index: 7;
+          width: 100%;
+          box-sizing: border-box;
+          height: auto;
+          max-height: none;
+          gap: 8px;
+          padding: 8px;
+          border-radius: 20px;
+        }
+
+        .hf-article-granularity {
+          gap: 7px;
+          padding: 5px 7px;
+          border-radius: 14px;
+        }
+
+        .hf-article-granularity .viewer-granularity__label,
+        .hf-article-granularity .viewer-granularity__value {
+          font-size: 0.68rem;
+        }
+
+        .hf-article-toolbar .hf-article-status {
+          display: none;
+        }
+
+        .hf-article-toolbar {
+          --hf-article-toolbar-scroll-mask-height: 22px;
+          flex-wrap: nowrap;
+          gap: 5px;
+          overflow-x: auto;
+          overflow-y: hidden;
+          overscroll-behavior-x: contain;
+          padding: 6px;
+          margin: 8px 8px 0;
+          border-radius: 16px;
+          top: var(--hf-article-mobile-toolbar-top, 0px);
+          z-index: 8;
+          scrollbar-width: none;
+          -webkit-overflow-scrolling: touch;
+          box-shadow:
+            0 0 0 8px rgba(3, 9, 18, 0.98),
+            0 0 0 9px rgba(136, 215, 255, 0.14),
+            0 16px 42px rgba(0, 0, 0, 0.24),
+            inset 0 1px 0 rgba(255, 255, 255, 0.06);
+        }
+
+        .hf-article-toolbar::-webkit-scrollbar {
+          display: none;
+        }
+
+        .hf-article-toolbar__group {
+          flex: 0 0 auto;
+          flex-wrap: nowrap;
+          gap: 2px;
+          padding: 2px;
+          border-radius: 13px;
+        }
+
+        .hf-article-tool {
+          min-height: 36px;
+          padding: 0 10px;
+          font-size: 0.78rem;
+        }
+
+        .hf-article-tool--icon-only {
+          width: 36px;
+          padding: 0;
+        }
+
+        .hf-article-body {
+          margin: 10px 8px 8px;
+          position: sticky;
+          top: var(
+            --hf-article-mobile-body-top,
+            calc(
+              var(--hf-article-mobile-toolbar-top, 0px) +
+              var(--hf-article-mobile-toolbar-height, 0px) +
+              12px
+            )
+          );
+          z-index: 6;
+          box-sizing: border-box;
+          height: var(--hf-article-mobile-body-height, 54dvh);
+          min-height: min(54dvh, var(--hf-article-mobile-body-height, 54dvh));
+          max-height: var(--hf-article-mobile-body-height, 54dvh);
+          overflow-y: auto;
+          overscroll-behavior: contain;
+          padding: 14px;
+          border-radius: 20px;
+          font-size: 1rem;
+          line-height: 1.68;
+          scrollbar-color: #1b212f transparent;
+          scrollbar-width: thin;
+          scroll-margin-top: calc(
+            var(--hf-article-mobile-toolbar-top, 0px) +
+            var(--hf-article-mobile-toolbar-height, 0px) +
+            12px
+          );
+          transition: padding-top 160ms ease;
+        }
+
+        #hf-article-body {
+          clip-path: inset(0 round 20px);
+        }
+
+        .hf-article-page.is-editor-body-safe-inset .hf-article-body {
+          padding-top: 14px;
+        }
+
+        .hf-article-editor__iframe {
+          height: min(42dvh, 320px);
+          min-height: 250px;
+          width: 100%;
+          border-radius: 17px;
+        }
+
+        .hf-article-node-menu[data-mobile-sheet="true"] {
+          top: auto;
+          right: max(8px, env(safe-area-inset-right));
+          bottom: max(8px, env(safe-area-inset-bottom));
+          left: max(8px, env(safe-area-inset-left));
+          width: auto;
+          max-height: min(54dvh, 430px);
+          padding: 11px;
+          border-radius: 24px 24px 18px 18px;
+          background:
+            radial-gradient(circle at 12% 0%, rgba(156, 255, 99, 0.12), transparent 34%),
+            linear-gradient(180deg, rgba(10, 19, 34, 0.98), rgba(3, 8, 16, 0.98));
+          box-shadow:
+            0 -18px 80px rgba(0, 0, 0, 0.52),
+            inset 0 1px 0 rgba(255, 255, 255, 0.08);
+          backdrop-filter: blur(18px);
+          overscroll-behavior: contain;
+        }
+
+        .hf-article-node-menu[data-mobile-sheet="true"]::before {
+          content: "Mention node";
+          display: block;
+          margin: 0 4px 8px;
+          color: rgba(197, 208, 227, 0.58);
+          font-size: 0.7rem;
+          font-weight: 820;
+          letter-spacing: 0.12em;
+          text-transform: uppercase;
+        }
+
+        .hf-article-node-menu[data-mobile-sheet="true"] .hf-article-node-option {
+          min-height: 58px;
+          padding: 12px;
+          border-radius: 16px;
+        }
+
+        .hf-article-node-menu[data-mobile-sheet="true"] .hf-article-node-option__swatch {
+          width: 16px;
+          height: 16px;
+          border-radius: 5px;
+        }
+
+        .hf-article-node-menu[data-mobile-sheet="true"] .hf-article-node-option__copy {
+          gap: 5px;
+        }
+
+        .hf-article-node-menu[data-mobile-sheet="true"] .hf-article-node-option__label {
+          font-size: 0.98rem;
+        }
+
+        .hf-article-node-menu[data-mobile-sheet="true"] .hf-article-node-option__meta {
+          flex-wrap: wrap;
+        }
+
+        .hf-article-node-menu[data-mobile-sheet="true"] .hf-article-node-option__type {
+          max-width: min(18rem, 68vw);
+        }
+
+        .viewer-community-articles__visual {
+          display: none;
+        }
+
+        .viewer-community-articles__visual .viewer-community-articles__iframe {
+          height: auto;
+          min-height: 520px;
+        }
+
+
+        body.route-viewer.route-viewer-article .viewer-community-articles {
+          gap: 0;
+          padding:
+            clamp(16px, 4vw, 22px) max(12px, env(safe-area-inset-right))
+            24px max(12px, env(safe-area-inset-left));
+          -webkit-clip-path: inset(0 round 30px);
+          clip-path: inset(0 round 30px);
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__layout {
+          display: block;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__visual {
+          display: none;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__copy {
+          --viewer-article-copy-pad-y: 0px;
+          --viewer-article-outer-pad-left: max(12px, env(safe-area-inset-left));
+          --viewer-article-outer-pad-right: max(12px, env(safe-area-inset-right));
+          --viewer-article-copy-pad-left: calc(max(16px, env(safe-area-inset-left)) + var(--viewer-article-outer-pad-left));
+          --viewer-article-copy-pad-right: calc(max(16px, env(safe-area-inset-right)) + var(--viewer-article-outer-pad-right));
+          --viewer-article-rich-edge-gutter: clamp(8px, 2.2vw, 12px);
+          --viewer-article-rich-breakout-left: calc(max(16px, env(safe-area-inset-left)) + var(--viewer-article-outer-pad-left) - var(--viewer-article-rich-edge-gutter));
+          --viewer-article-rich-breakout-right: calc(max(16px, env(safe-area-inset-right)) + var(--viewer-article-outer-pad-right) - var(--viewer-article-rich-edge-gutter));
+          padding:
+            0 max(16px, env(safe-area-inset-right))
+            0 max(16px, env(safe-area-inset-left));
+          border: 0;
+          border-radius: 0;
+          background: transparent;
+          box-shadow: none;
+          overflow: visible;
+          -webkit-clip-path: none;
+          clip-path: none;
+        }
+
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__copy::before {
+          content: none;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__html-block .hf-article-custom-html__touch-scroll-shield,
+        .hf-article-page.is-reader-preview .viewer-community-articles__html-block .hf-article-custom-html__touch-scroll-shield {
+          position: absolute;
+          inset: 0;
+          z-index: 2;
+          display: block;
+          border-radius: inherit;
+          background: transparent;
+          touch-action: auto;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__head,
+        body.route-viewer.route-viewer-article .viewer-community-articles__byline,
+        body.route-viewer.route-viewer-article .viewer-community-articles__dek,
+        body.route-viewer.route-viewer-article .viewer-community-articles__body,
+        body.route-viewer.route-viewer-article .viewer-community-articles__meta,
+        body.route-viewer.route-viewer-article .viewer-community-articles__comments {
+          width: 100%;
+          max-width: 100%;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__body pre,
+        body.route-viewer.route-viewer-article .viewer-community-articles__media,
+        body.route-viewer.route-viewer-article .viewer-community-articles__html-block,
+        body.route-viewer.route-viewer-article .viewer-community-articles__table-set {
+          width: calc(100% + var(--viewer-article-rich-breakout-left) + var(--viewer-article-rich-breakout-right));
+          max-width: none;
+          margin-left: calc(-1 * var(--viewer-article-rich-breakout-left));
+          margin-right: calc(-1 * var(--viewer-article-rich-breakout-right));
+          box-sizing: border-box;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__table-set,
+        body.route-viewer.route-viewer-article .viewer-community-articles__table-set .viewer-editorial__deployment-wrap {
+          justify-self: stretch;
+          width: calc(100% + var(--viewer-article-rich-breakout-left) + var(--viewer-article-rich-breakout-right));
+          max-width: none;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__table-set .viewer-editorial__deployment-wrap {
+          width: 100%;
+        }
+
+        body.route-viewer.route-viewer-article .viewer-community-articles__media img,
+        body.route-viewer.route-viewer-article .viewer-community-articles__media audio,
+        body.route-viewer.route-viewer-article .viewer-community-articles__media video,
+        body.route-viewer.route-viewer-article .viewer-community-articles__media-video {
+          width: 100%;
+          max-width: 100%;
+        }
+
+        body.route-viewer.route-viewer-article .page.route-viewer .viewer-frame__canvas {
+          height: clamp(320px, calc(100svh - 236px), 620px);
+          height: clamp(320px, calc(100dvh - 236px), 620px);
+          min-height: clamp(320px, calc(100svh - 236px), 620px);
+          min-height: clamp(320px, calc(100dvh - 236px), 620px);
+          max-height: clamp(320px, calc(100svh - 236px), 620px);
+          max-height: clamp(320px, calc(100dvh - 236px), 620px);
+
+        }
+
+        body.route-viewer.route-viewer-article .page.route-viewer .viewer-frame__bar {
+          position: relative;
+          z-index: 2;
+          display: flex;
+          align-items: center;
+          justify-content: flex-start;
+          gap: 12px;
+          padding: 13px 14px;
+          border-bottom: 0;
+          background: linear-gradient(180deg, rgba(5, 9, 20, 0.38), rgba(5, 9, 20, 0.14));
+          backdrop-filter: blur(18px) saturate(1.08);
+          pointer-events: auto;
+        }
+
+        body.route-viewer.route-viewer-article .page.route-viewer #viewer-granularity:not([hidden]) {
+          display: flex !important;
+          flex: 0 1 auto;
+          width: auto;
+          min-width: 0;
+          margin-left: 0;
+          padding: 0;
+          border: 0;
+          background: transparent;
+          box-shadow: none;
+          pointer-events: auto;
+        }
+
+        body.route-viewer.route-viewer-article .page.route-viewer #viewer-granularity .viewer-granularity__label {
+          font-size: 0.66rem;
+        }
+
+        .viewer-community-articles__comment-form {
+          grid-template-columns: 1fr;
+        }
+
+        .viewer-community-articles__comment-submit {
+          width: 100%;
+        }
+      }
+
+      @media (max-width: 480px) {
+        .hf-article-button--primary {
+          grid-column: 1 / -1;
+        }
+
+        .hf-article-editor__preview-title {
+          font-size: 0.88rem;
+        }
+
+        .hf-article-editor__preview-node-name {
+          font-size: clamp(1rem, 5.5vw, 1.18rem);
+        }
+
+        .hf-article-editor__preview-mention {
+          min-height: 30px;
+          min-width: 98px;
+          padding: 0 12px;
+          font-size: 0.62rem;
+        }
+      }
+
+      .model-search {
+        position: absolute;
+        top: calc(100% - 1px);
+        right: auto;
+        left: 0;
+        z-index: 240;
+        display: grid;
+        gap: 6px;
+        width: var(--model-search-width, 100%);
+        min-width: 100%;
+        margin-top: 0;
+        padding: 8px;
+        max-height: var(--model-search-max-height, min(52vh, 520px));
+        overflow-y: auto;
+        overscroll-behavior: contain;
+        -webkit-overflow-scrolling: touch;
+        scroll-padding-block: 16px;
+        scrollbar-color: rgba(120, 152, 190, 0.38) rgba(12, 22, 36, 0.2);
+        scrollbar-width: thin;
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 0 0 22px 22px;
+        background:
+          radial-gradient(circle at 16% 0%, rgba(156, 255, 99, 0.13), transparent 36%),
+          linear-gradient(180deg, rgba(12, 22, 36, 0.74), rgba(5, 11, 21, 0.7));
+        backdrop-filter: blur(18px) saturate(138%);
+        -webkit-backdrop-filter: blur(18px) saturate(138%);
+        box-shadow:
+          0 24px 60px rgba(0, 0, 0, 0.34),
+          inset 0 1px 0 rgba(255, 255, 255, 0.11),
+          inset 0 -1px 0 rgba(136, 215, 255, 0.05);
+      }
+
+      .model-search-hit-shield {
+        position: fixed;
+        inset: 0;
+        z-index: 239;
+        border: 0;
+        margin: 0;
+        padding: 0;
+        background: transparent;
+        cursor: default;
+      }
+
+      .model-search-hit-shield[hidden] {
+        display: none;
+      }
+
+      .model-search::-webkit-scrollbar {
+        width: 8px;
+      }
+
+      .model-search::-webkit-scrollbar-track {
+        background:
+          linear-gradient(180deg, rgba(17, 31, 49, 0.28), rgba(5, 11, 21, 0.16));
+        backdrop-filter: blur(18px) saturate(132%);
+        -webkit-backdrop-filter: blur(18px) saturate(132%);
+        border-radius: 999px;
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.05),
+          inset 0 0 0 1px rgba(136, 165, 205, 0.06);
+      }
+
+      .model-search::-webkit-scrollbar-thumb {
+        border: 2px solid rgba(7, 14, 26, 0.72);
+        border-radius: 999px;
+        background:
+          linear-gradient(180deg, rgba(130, 160, 196, 0.48), rgba(82, 107, 145, 0.34));
+      }
+
+      .model-search::-webkit-scrollbar-thumb:hover {
+        background:
+          linear-gradient(180deg, rgba(146, 176, 210, 0.58), rgba(95, 124, 164, 0.42));
+      }
+
+      .model-search[hidden] {
+        display: none;
+      }
+
+      .model-search__status,
+      .model-search__item {
+        border: 0;
+        border-radius: 16px;
+        background: transparent;
+        color: var(--text);
+        font: inherit;
+      }
+
+      .model-search__status {
+        padding: 12px 14px;
+        color: var(--muted);
+        font-size: 0.9rem;
+      }
+
+      .model-search__item {
+        display: grid;
+        gap: 10px;
+        align-items: center;
+        justify-items: start;
+        width: 100%;
+        min-height: 52px;
+        padding: 13px 14px;
+        scroll-margin-block: 16px;
+        text-align: left;
+        touch-action: manipulation;
+        cursor: pointer;
+      }
+
+      .model-search__item--new {
+        animation: model-search-result-reveal 340ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
+        animation-delay: var(--model-search-item-delay, 0ms);
+      }
+
+      @keyframes model-search-result-reveal {
+        from {
+          opacity: 0;
+          transform: translateY(8px) scale(0.985);
+        }
+        to {
+          opacity: 1;
+          transform: translateY(0) scale(1);
+        }
+      }
+
+      .model-search__item.is-active {
+        background:
+          linear-gradient(90deg, rgba(156, 255, 99, 0.12), rgba(136, 215, 255, 0.08)),
+          rgba(255, 255, 255, 0.04);
+      }
+
+      .model-search__repo {
+        display: flex;
+        align-items: center;
+        justify-content: flex-start;
+        gap: 9px;
+        min-width: 0;
+        width: 100%;
+        overflow: hidden;
+        font-weight: 760;
+        letter-spacing: -0.02em;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .model-search__body {
+        display: grid;
+        justify-items: start;
+        width: 100%;
+        min-width: 0;
+        text-align: left;
+      }
+
+      .model-search__repo-text {
+        display: block;
+        min-width: 0;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .model-search__repo-prefix {
+        color: #8d9cb6;
+      }
+
+      .model-search__viewable-dot {
+        flex: 0 0 auto;
+        width: 23px;
+        min-width: 23px;
+        height: 23px;
+        min-height: 23px;
+        aspect-ratio: 1 / 1;
+        border-radius: 999px;
+        background:
+          radial-gradient(circle, var(--lime) 0 4.5px, rgba(156, 255, 99, 0.14) 5px 11.5px, transparent 12px);
+      }
+
+      .model-search__meta {
+        margin-top: 4px;
+        color: rgba(197, 208, 227, 0.7);
+        font-size: 0.82rem;
+      }
+
+      .input-shell input[aria-expanded="true"] {
+        border-bottom-right-radius: 0;
+        border-bottom-left-radius: 0;
+        border-color: rgba(136, 215, 255, 0.18);
+      }
+
+      @media (max-width: 720px) {
+        .model-search {
+          position: absolute;
+          top: calc(100% - 1px);
+          right: auto;
+          left: 0;
+          width: 100%;
+          min-width: 100%;
+          margin-top: 0;
+          max-height: var(--model-search-max-height, min(42vh, 360px));
+          border-radius: 0 0 22px 22px;
+        }
+
+        .model-search--sheet {
+          position: fixed;
+          right: 16px;
+          bottom: calc(var(--model-search-keyboard-offset, 0px) + env(safe-area-inset-bottom) + 12px);
+          left: 16px;
+          z-index: 2147482000;
+          max-height: var(--model-search-sheet-max-height, min(44vh, 360px));
+          margin-top: 0;
+          border-radius: 24px;
+          background:
+            radial-gradient(circle at 14% 0%, rgba(156, 255, 99, 0.17), transparent 38%),
+            rgba(5, 11, 21, 0.72);
+          box-shadow:
+            0 26px 80px rgba(0, 0, 0, 0.48),
+            inset 0 1px 0 rgba(255, 255, 255, 0.07);
+        }
+
+        .model-search-hit-shield--sheet {
+          z-index: 2147481999;
+        }
+      }
+
+      .cta__sub {
+        position: relative;
+        margin-top: 14px;
+        color: var(--muted);
+        font-size: 0.92rem;
+      }
+
+      @media (max-width: 860px) {
+        .cta__sub {
+          display: none;
+        }
+      }
+
+      .proof {
+        position: relative;
+        z-index: 1;
+        display: grid;
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+        gap: 14px;
+        margin-top: 22px;
+      }
+
+      .proof__item {
+        padding: 16px 18px;
+        border-radius: 20px;
+        background: rgba(255, 255, 255, 0.04);
+        border: 1px solid var(--stroke);
+      }
+
+      .proof__value {
+        display: block;
+        font-family: "Inter", sans-serif;
+        font-size: 1.2rem;
+        font-weight: 700;
+        margin-bottom: 5px;
+      }
+
+      .proof__text {
+        color: var(--muted);
+        font-size: 0.88rem;
+        line-height: 1.45;
+      }
+
+      .proof__text strong {
+        color: var(--text);
+        font-weight: 700;
+      }
+
+      .proof__quickstart {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: 9px;
+        width: fit-content;
+        margin-top: 12px;
+        padding: 9px 13px 9px 11px;
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 16% 12%, rgba(129, 248, 185, 0.22), transparent 34%),
+          linear-gradient(135deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
+          rgba(7, 15, 27, 0.78);
+        color: rgba(235, 248, 255, 0.94);
+        font-size: 0.82rem;
+        font-weight: 800;
+        letter-spacing: -0.01em;
+        text-decoration: none;
+        box-shadow:
+          0 14px 34px rgba(7, 14, 28, 0.24),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        transition:
+          border-color 180ms ease,
+          box-shadow 180ms ease,
+          transform 180ms ease;
+      }
+
+      .proof__quickstart:hover,
+      .proof__quickstart:focus-visible {
+        border-color: rgba(129, 248, 185, 0.38);
+        color: #f3fff9;
+        outline: none;
+        box-shadow:
+          0 18px 40px rgba(16, 185, 129, 0.14),
+          0 0 0 1px rgba(129, 248, 185, 0.08),
+          inset 0 1px 0 rgba(255, 255, 255, 0.12);
+        transform: translateY(-1px);
+      }
+
+      .proof__quickstart svg {
+        width: 17px;
+        height: 17px;
+        flex: 0 0 auto;
+      }
+
+      .proof__item .proof__extension-panel {
+        display: none;
+      }
+
+      .proof-extension {
+        display: grid;
+        gap: 12px;
+      }
+
+      .proof-extension__button {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: 9px;
+        width: fit-content;
+        margin-top: 2px;
+        padding: 9px 13px 9px 11px;
+        border: 1px solid rgba(255, 255, 255, 0.14);
+        border-radius: 999px;
+        background:
+          linear-gradient(135deg, rgba(156, 255, 99, 0.24), rgba(136, 215, 255, 0.18)),
+          rgba(8, 15, 28, 0.82);
+        box-shadow:
+          0 14px 34px rgba(7, 14, 28, 0.28),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        color: var(--text);
+        font-family: "Inter", sans-serif;
+        font-size: 0.84rem;
+        font-weight: 700;
+        letter-spacing: 0.01em;
+        line-height: 1;
+        text-decoration: none;
+        transition:
+          border-color 0.2s ease,
+          background 0.2s ease,
+          transform 0.2s ease;
+      }
+
+      .proof-extension__button:hover,
+      .proof-extension__button:focus-visible {
+        border-color: rgba(156, 255, 99, 0.3);
+        background:
+          linear-gradient(135deg, rgba(156, 255, 99, 0.3), rgba(136, 215, 255, 0.22)),
+          rgba(9, 18, 32, 0.9);
+        outline: none;
+        transform: translateY(-1px);
+      }
+
+      .proof-extension__chrome {
+        width: 18px;
+        height: 18px;
+        flex: 0 0 auto;
+        color: #fff;
+      }
+
+      .proof__embed-panel {
+        display: grid;
+        gap: 12px;
+      }
+
+      .can-install-chrome-extension .proof__extension-panel {
+        display: grid;
+      }
+
+      .can-install-chrome-extension .proof__embed-panel {
+        display: none;
+      }
+
+      .proof-embed__button {
+        width: fit-content;
+        min-height: 40px;
+        margin-top: 2px;
+        padding: 8px 14px 8px 9px;
+        font-size: 0.82rem;
+      }
+
+      .proof-embed__button .community-showcase__embed-cta-icon-wrap {
+        width: 27px;
+        height: 27px;
+      }
+
+      .proof-embed__button .community-showcase__embed-cta-icon {
+        width: 16px;
+        height: 16px;
+      }
+
+      .url-magic-demo {
+        --url-demo-current-host-width: 105px;
+        --url-demo-next-host-width: 92px;
+        position: relative;
+        z-index: 0;
+        isolation: isolate;
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        width: min(100%, 390px);
+        height: 38px;
+        margin-top: 13px;
+        padding: 0 13px;
+        overflow: hidden;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 12% 30%, rgba(136, 215, 255, 0.14), transparent 34%),
+          rgba(5, 11, 21, 0.68);
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.07),
+          0 12px 30px rgba(0, 0, 0, 0.18);
+      }
+
+      .url-magic-demo__icon {
+        display: inline-flex;
+        flex: 0 0 auto;
+        width: 16px;
+        height: 15px;
+        color: rgba(229, 242, 255, 0.84);
+      }
+
+      .url-magic-demo__text {
+        position: relative;
+        isolation: isolate;
+        flex: 1 1 auto;
+        min-width: 0;
+        height: 1.35em;
+        overflow: hidden;
+        color: rgba(245, 248, 255, 0.9);
+        font-size: 0.88rem;
+        font-weight: 650;
+        letter-spacing: -0.02em;
+        line-height: 1.35;
+        white-space: nowrap;
+      }
+
+      .url-magic-demo__current-host,
+      .url-magic-demo__typed-host,
+      .url-magic-demo__moving-path,
+      .url-magic-demo__caret {
+        position: absolute;
+        top: 0;
+        left: 0;
+      }
+
+      .url-magic-demo__current-host,
+      .url-magic-demo__typed-host,
+      .url-magic-demo__moving-path {
+        display: inline-flex;
+        align-items: center;
+      }
+
+      .url-magic-demo__current-host {
+        opacity: 1;
+      }
+
+      .url-magic-demo__typed-host {
+        color: #f7fbff;
+        clip-path: inset(0 100% 0 0);
+        opacity: 0;
+      }
+
+      .url-magic-demo__moving-path {
+        color: rgba(197, 208, 227, 0.72);
+        font-weight: 560;
+        transform: translateX(var(--url-demo-current-host-width));
+      }
+
+      .url-magic-demo__host {
+        position: relative;
+        display: inline-flex;
+        align-items: center;
+      }
+
+      .url-magic-demo__host-label {
+        position: relative;
+        z-index: 1;
+      }
+
+      .url-magic-demo__host-selection {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        z-index: 0;
+        height: 1.35em;
+        border-radius: 6px;
+        background: rgba(112, 188, 255, 0.32);
+        box-shadow: 0 0 0 1px rgba(151, 213, 255, 0.18);
+        opacity: 0;
+        transform: scaleX(0);
+        transform-origin: left center;
+      }
+
+      .url-magic-demo__caret {
+        z-index: 3;
+        width: 2px;
+        height: 1.35em;
+        border-radius: 999px;
+        background: #9fe8ff;
+        opacity: 0;
+        transform: translateX(0);
+      }
+
+      @media (prefers-reduced-motion: reduce) {
+        .url-magic-demo__current-host,
+        .url-magic-demo__host-selection,
+        .url-magic-demo__caret {
+          display: none;
+          animation: none;
+        }
+
+        .url-magic-demo__typed-host {
+          clip-path: none;
+          opacity: 1;
+          animation: none;
+        }
+
+        .url-magic-demo__moving-path {
+          animation: none;
+          transform: translateX(var(--url-demo-next-host-width));
+        }
+      }
+
+      .gallery-section {
+        margin-top: 48px;
+      }
+
+      .gallery-section[data-page="landing"],
+      .gallery-section[data-page="owner"],
+      .blogs-with-graphs[data-page="landing"],
+      .community-showcase[data-page="landing"],
+      .products-section[data-page="landing"] {
+        grid-column: 1 / -1;
+      }
+
+      .gallery-section__head {
+        display: grid;
+        gap: 10px;
+        margin-bottom: 20px;
+      }
+
+      .gallery-section__eyebrow {
+        color: var(--muted);
+        font-size: 0.78rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .gallery-section h2 {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: clamp(2rem, 3vw, 3rem);
+        line-height: 1;
+        letter-spacing: -0.04em;
+      }
+
+      .gallery-section p {
+        margin: 0;
+        max-width: 68ch;
+        color: var(--muted-strong);
+        line-height: 1.65;
+      }
+
+      .gallery {
+        position: relative;
+        column-count: 4;
+        column-gap: 16px;
+      }
+
+      .gallery--packed {
+        column-count: unset;
+        column-gap: 0;
+        min-height: 1px;
+      }
+
+      .gallery-card {
+        --gallery-card-preview-width: 100%;
+        display: inline-flex;
+        width: 100%;
+        flex-direction: column;
+        gap: 14px;
+        margin: 0 0 16px;
+        padding: 14px;
+        border: 1px solid var(--stroke);
+        border-radius: 24px;
+        background: rgba(255, 255, 255, 0.04);
+        box-shadow: 0 18px 42px rgba(0, 0, 0, 0.26);
+        cursor: pointer;
+        transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
+        break-inside: avoid;
+      }
+
+      .gallery--packed .gallery-card {
+        position: absolute;
+        margin: 0;
+        break-inside: auto;
+      }
+
+      .gallery-card:hover,
+      .gallery-card:focus-visible {
+        transform: translateY(-4px);
+        border-color: rgba(156, 255, 99, 0.3);
+        box-shadow:
+          0 24px 54px rgba(0, 0, 0, 0.32),
+          0 0 0 1px rgba(156, 255, 99, 0.12);
+        outline: none;
+      }
+
+      .gallery-card.is-selected {
+        outline: none;
+      }
+
+      .gallery-card__art {
+        display: flex;
+        position: relative;
+        align-items: center;
+        justify-content: center;
+        padding: 20px 18px 16px;
+        border-radius: 18px;
+        border: 1px solid rgba(255, 255, 255, 0.07);
+        background: var(--preview-surface);
+        overflow: hidden;
+      }
+
+      .gallery-card__art--pending {
+        min-height: 220px;
+        position: relative;
+      }
+
+      .gallery-card__art--pending::after {
+        content: "Rendering preview";
+        color: var(--muted);
+        font-size: 0.74rem;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .gallery-card__image {
+        width: var(--gallery-card-preview-width, 100%);
+        max-width: none;
+        height: auto;
+        display: block;
+        filter: saturate(0.98) contrast(1.04) drop-shadow(0 16px 26px rgba(0, 0, 0, 0.24));
+      }
+
+      .gallery-card__image--source {
+        display: none;
+      }
+
+      .gallery-card__preview-svg {
+        width: var(--gallery-card-preview-width, 100%);
+        max-width: none;
+        display: block;
+        filter: saturate(0.98) contrast(1.04) drop-shadow(0 16px 26px rgba(0, 0, 0, 0.24));
+      }
+
+      .gallery-card__preview-svg > svg {
+        width: 100%;
+        height: auto;
+        display: block;
+      }
+
+      .gallery-card__art--pending .gallery-card__image {
+        display: none;
+      }
+
+      .gallery-card__meta {
+        display: grid;
+        gap: 7px;
+        padding: 0 4px 4px;
+      }
+
+      .gallery-card__label {
+        display: inline-flex;
+        align-items: center;
+        gap: 9px;
+        color: rgba(245, 248, 255, 0.96);
+        font-family: "Inter", sans-serif;
+        font-size: 1.08rem;
+        font-weight: 700;
+      }
+
+      .gallery-card__label-text {
+        display: inline;
+        min-width: 0;
+      }
+
+      .gallery-card__label-prefix {
+        color: #8d9cb6;
+      }
+
+      .gallery-card__label::before {
+        content: "";
+        width: 8px;
+        min-width: 8px;
+        height: 8px;
+        min-height: 8px;
+        flex: 0 0 8px;
+        aspect-ratio: 1 / 1;
+        border-radius: 999px;
+        background: var(--lime);
+      }
+
+      .gallery-card__sub {
+        color: var(--muted-strong);
+        font-size: 0.88rem;
+        line-height: 1.45;
+      }
+
+      .gallery-card__action {
+        color: var(--sky);
+        font-size: 0.8rem;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .proof__quickstart {
+        display: none;
+        width: fit-content;
+        align-items: center;
+        gap: 9px;
+        margin-top: 14px;
+        padding: 9px 13px 9px 11px;
+        border: 1px solid rgba(129, 248, 185, 0.3);
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 18% 0%, rgba(129, 248, 185, 0.2), transparent 30%),
+          linear-gradient(135deg, rgba(7, 21, 32, 0.9), rgba(11, 45, 52, 0.74));
+        color: #eafff7;
+        font-size: 0.8rem;
+        font-weight: 780;
+        letter-spacing: -0.01em;
+        text-decoration: none;
+        box-shadow:
+          0 12px 28px rgba(16, 185, 129, 0.11),
+          inset 0 1px 0 rgba(255, 255, 255, 0.14);
+        transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
+      }
+
+      .proof__quickstart[aria-hidden="false"] {
+        display: flex;
+      }
+
+      .proof__quickstart:hover,
+      .proof__quickstart:focus-visible {
+        transform: translateY(-1px);
+        border-color: rgba(129, 248, 185, 0.52);
+        box-shadow:
+          0 16px 34px rgba(16, 185, 129, 0.17),
+          0 0 0 1px rgba(129, 248, 185, 0.08),
+          inset 0 1px 0 rgba(255, 255, 255, 0.18);
+        outline: none;
+      }
+
+      .proof__quickstart svg {
+        width: 16px;
+        height: 16px;
+        flex: 0 0 16px;
+      }
+
+      .gallery-card--wide .gallery-card__art {
+        padding-inline: 22px;
+      }
+
+      .gallery-card--full {
+        gap: 16px;
+      }
+
+      .gallery-card--family-wide .gallery-card__art {
+        padding: 18px;
+      }
+
+      .gallery-card__family-strip {
+        display: grid;
+        grid-template-columns: repeat(4, minmax(0, 1fr));
+        gap: 12px;
+        width: 100%;
+      }
+
+      .gallery-card__family-slot {
+        display: grid;
+        gap: 8px;
+        align-items: end;
+        min-width: 0;
+      }
+
+      .gallery-card__family-frame {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        min-height: 188px;
+        padding: 10px 8px;
+        border-radius: 16px;
+        border: 1px solid rgba(255, 255, 255, 0.06);
+        background: rgba(255, 255, 255, 0.018);
+        overflow: hidden;
+      }
+
+      .gallery-card__family-image {
+        display: block;
+        width: 100%;
+        height: 168px;
+        margin: 0 auto;
+        object-fit: contain;
+        object-position: center center;
+        filter: saturate(0.98) contrast(1.04) drop-shadow(0 12px 22px rgba(0, 0, 0, 0.22));
+      }
+
+      .gallery-card__family-size {
+        color: #8d9cb6;
+        font-size: 0.76rem;
+        font-weight: 700;
+        letter-spacing: 0.12em;
+        text-align: center;
+        text-transform: uppercase;
+      }
+
+      .gallery-preview-worker {
+        position: fixed;
+        top: 0;
+        left: -10000px;
+        width: 1800px;
+        height: 1400px;
+        opacity: 0;
+        pointer-events: none;
+        visibility: hidden;
+        border: 0;
+      }
+
+      .blogs-with-graphs {
+        display: grid;
+        gap: 22px;
+        margin-top: 56px;
+      }
+
+      .blogs-with-graphs__head {
+        display: grid;
+        grid-template-columns: minmax(0, max-content) auto;
+        align-items: start;
+        justify-content: space-between;
+        column-gap: 24px;
+        gap: 16px;
+      }
+
+      .blogs-with-graphs__intro {
+        display: grid;
+        gap: 10px;
+        max-width: 760px;
+      }
+
+      .blogs-with-graphs__eyebrow {
+        color: var(--muted);
+        font-size: 0.78rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .blogs-with-graphs h2 {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: clamp(2rem, 3vw, 3rem);
+        line-height: 1;
+        letter-spacing: -0.04em;
+      }
+
+      .blogs-with-graphs__lede {
+        margin: 0;
+        max-width: 62ch;
+        color: var(--muted-strong);
+        font-size: 0.98rem;
+        line-height: 1.65;
+      }
+
+      .blogs-with-graphs__write {
+        position: relative;
+        isolation: isolate;
+        overflow: hidden;
+        display: inline-flex;
+        justify-self: end;
+        align-self: end;
+        width: fit-content;
+        min-height: 46px;
+        align-items: center;
+        justify-content: center;
+        gap: 11px;
+        padding: 0 19px 0 12px;
+        border: 1px solid rgba(129, 248, 185, 0.42);
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 18% 10%, rgba(129, 248, 185, 0.25), transparent 25%),
+          linear-gradient(115deg, rgba(5, 18, 28, 0.98), rgba(17, 91, 75, 0.75), rgba(11, 30, 46, 0.96), rgba(136, 215, 255, 0.16));
+        background-size: 230% 230%;
+        color: #eafff7;
+        font-size: 0.94rem;
+        font-weight: 800;
+        letter-spacing: -0.01em;
+        text-decoration: none;
+        box-shadow:
+          0 16px 38px rgba(16, 185, 129, 0.15),
+          inset 0 1px 0 rgba(255, 255, 255, 0.16);
+        animation: communityCtaGradientDrift 8.4s ease-in-out infinite;
+        transition:
+          border-color 180ms ease,
+          box-shadow 180ms ease,
+          transform 180ms ease;
+      }
+
+      .blogs-with-graphs__write > span,
+      .blogs-with-graphs__write svg {
+        position: relative;
+        z-index: 1;
+      }
+
+      .blogs-with-graphs__write:hover,
+      .blogs-with-graphs__write:focus-visible {
+        border-color: rgba(129, 248, 185, 0.64);
+        box-shadow:
+          0 20px 46px rgba(16, 185, 129, 0.22),
+          0 0 0 1px rgba(129, 248, 185, 0.09),
+          inset 0 1px 0 rgba(255, 255, 255, 0.2);
+        transform: translateY(-1px);
+      }
+
+      .blogs-with-graphs__write:focus-visible {
+        outline: 2px solid rgba(129, 248, 185, 0.42);
+        outline-offset: 3px;
+      }
+
+      .blogs-with-graphs__write-icon {
+        width: 18px;
+        height: 18px;
+        flex: 0 0 auto;
+      }
+
+      .blogs-with-graphs__carousel {
+        position: relative;
+        min-width: 0;
+        margin-top: -8px;
+        padding-top: 8px;
+      }
+
+      .blogs-with-graphs__rail {
+        display: flex;
+        align-items: stretch;
+        gap: 18px;
+        overflow-x: auto;
+        overflow-y: hidden;
+        overflow-anchor: none;
+        padding: 10px 2px 82px;
+        scroll-behavior: auto;
+        scroll-padding-inline: 2px;
+        scroll-snap-type: x proximity;
+        scrollbar-width: none;
+      }
+
+      .blogs-with-graphs__rail.is-drag-scrollable,
+      .community-showcase__rail.is-drag-scrollable {
+        cursor: grab;
+      }
+
+      .blogs-with-graphs__rail.is-drag-scrolling,
+      .community-showcase__rail.is-drag-scrolling {
+        cursor: grabbing;
+        scroll-snap-type: none;
+        user-select: none;
+      }
+
+      .blogs-with-graphs__rail.is-drag-scrolling *,
+      .community-showcase__rail.is-drag-scrolling * {
+        user-select: none;
+      }
+
+      .blogs-with-graphs__rail::-webkit-scrollbar {
+        display: none;
+      }
+
+      .blogs-with-graphs__card {
+        --blogs-card-edge-rgb: 129, 248, 185;
+        --blogs-card-corner-rgb: 136, 215, 255;
+        position: relative;
+        isolation: isolate;
+        overflow: visible;
+        display: grid;
+        flex: 0 0 clamp(364px, 31vw, 438px);
+        grid-template-rows: auto 1fr;
+        min-height: 432px;
+        border: 1px solid rgba(151, 221, 238, 0.26);
+        border-radius: 28px;
+        background:
+          radial-gradient(circle at 12% 0%, rgba(var(--blogs-card-edge-rgb), 0.12), transparent 32%),
+          radial-gradient(circle at 94% 2%, rgba(var(--blogs-card-corner-rgb), 0.1), transparent 34%),
+          radial-gradient(ellipse 52% 5% at 50% 101%, rgba(var(--blogs-card-edge-rgb), 0.105), rgba(var(--blogs-card-edge-rgb), 0.036) 48%, transparent 88%),
+          linear-gradient(151deg, rgba(12, 25, 40, 0.72), rgba(7, 19, 33, 0.86) 58%, rgba(3, 12, 22, 0.92));
+        backdrop-filter: blur(20px) saturate(1.14);
+        -webkit-backdrop-filter: blur(20px) saturate(1.14);
+        color: rgba(245, 248, 255, 0.96);
+        text-decoration: none;
+        box-shadow:
+          0 28px 70px rgba(0, 0, 0, 0.34),
+          0 30px 74px -52px rgba(var(--blogs-card-edge-rgb), 0.28),
+          0 48px 108px -64px rgba(var(--blogs-card-corner-rgb), 0.24),
+          0 0 0 1px rgba(255, 255, 255, 0.018),
+          inset 0 1px 0 rgba(255, 255, 255, 0.18),
+          inset 0 -1px 0 rgba(var(--blogs-card-edge-rgb), 0.115),
+          inset 0 -26px 52px -50px rgba(var(--blogs-card-edge-rgb), 0.52);
+        scroll-snap-align: start;
+        transition:
+          border-color 190ms ease,
+          box-shadow 190ms ease,
+          transform 190ms ease;
+      }
+
+      .blogs-with-graphs__card::before {
+        content: "";
+        position: absolute;
+        inset: 0;
+        z-index: 0;
+        border-radius: inherit;
+        background:
+          radial-gradient(ellipse 50% 6% at 50% 101%, rgba(var(--blogs-card-edge-rgb), 0.21), rgba(var(--blogs-card-edge-rgb), 0.082) 45%, transparent 86%),
+          linear-gradient(0deg, rgba(var(--blogs-card-edge-rgb), 0.052), rgba(var(--blogs-card-edge-rgb), 0.024) 10%, transparent 25%),
+          radial-gradient(circle at 18% 2%, rgba(var(--blogs-card-edge-rgb), 0.12), transparent 42%),
+          linear-gradient(315deg, rgba(var(--blogs-card-corner-rgb), 0.095), transparent 38%);
+        opacity: 0.68;
+        transition: opacity 190ms ease;
+      }
+
+      .blogs-with-graphs__card::after {
+        content: "";
+        position: absolute;
+        left: 58px;
+        right: 58px;
+        bottom: 0;
+        z-index: 3;
+        height: 1px;
+        border-radius: 999px;
+        background: linear-gradient(
+          90deg,
+          transparent 0%,
+          rgba(var(--blogs-card-edge-rgb), 0.02) 6%,
+          rgba(var(--blogs-card-edge-rgb), 0.15) 23%,
+          rgba(var(--blogs-card-edge-rgb), 0.68) 50%,
+          rgba(var(--blogs-card-edge-rgb), 0.15) 77%,
+          rgba(var(--blogs-card-edge-rgb), 0.02) 94%,
+          transparent 100%
+        );
+        box-shadow:
+          0 -3px 9px rgba(var(--blogs-card-edge-rgb), 0.13),
+          0 0 5px rgba(var(--blogs-card-edge-rgb), 0.35),
+          0 5px 15px rgba(var(--blogs-card-edge-rgb), 0.18),
+          0 17px 42px rgba(var(--blogs-card-edge-rgb), 0.12);
+        -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.12) 8%, rgba(0, 0, 0, 0.58) 27%, #000 43%, #000 57%, rgba(0, 0, 0, 0.58) 73%, rgba(0, 0, 0, 0.12) 92%, transparent 100%);
+        mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.12) 8%, rgba(0, 0, 0, 0.58) 27%, #000 43%, #000 57%, rgba(0, 0, 0, 0.58) 73%, rgba(0, 0, 0, 0.12) 92%, transparent 100%);
+        pointer-events: none;
+      }
+
+      .blogs-with-graphs__card[data-blogs-with-graphs-card="deepseek-mhc"] {
+        --blogs-card-edge-rgb: 129, 248, 185;
+        --blogs-card-corner-rgb: 136, 215, 255;
+      }
+
+      .blogs-with-graphs__card[data-blogs-with-graphs-card="liquidai-lfm25-audio"] {
+        --blogs-card-edge-rgb: 112, 255, 170;
+        --blogs-card-corner-rgb: 96, 190, 255;
+      }
+
+      .blogs-with-graphs__card[data-blogs-with-graphs-card="borealis"] {
+        --blogs-card-edge-rgb: 139, 246, 96;
+        --blogs-card-corner-rgb: 34, 211, 238;
+      }
+
+      .blogs-with-graphs__card[data-blogs-with-graphs-card="gemma-4-family"] {
+        --blogs-card-edge-rgb: 136, 215, 255;
+        --blogs-card-corner-rgb: 167, 139, 250;
+      }
+
+      .blogs-with-graphs__card[data-blogs-with-graphs-card="alpamayo-2-super"] {
+        --blogs-card-edge-rgb: 157, 140, 240;
+        --blogs-card-corner-rgb: 74, 157, 240;
+      }
+
+      .blogs-with-graphs__card:hover,
+      .blogs-with-graphs__card:focus-visible {
+        border-color: rgba(var(--blogs-card-edge-rgb), 0.46);
+        box-shadow:
+          0 34px 82px rgba(0, 0, 0, 0.43),
+          0 36px 86px -54px rgba(var(--blogs-card-edge-rgb), 0.32),
+          0 56px 116px -64px rgba(var(--blogs-card-corner-rgb), 0.3),
+          0 0 0 1px rgba(var(--blogs-card-edge-rgb), 0.08),
+          0 0 28px rgba(var(--blogs-card-edge-rgb), 0.048),
+          inset 0 1px 0 rgba(255, 255, 255, 0.22),
+          inset 0 -26px 50px -72px rgba(var(--blogs-card-edge-rgb), 0.3);
+        outline: none;
+        transform: translateY(-3px);
+      }
+
+      .blogs-with-graphs__card:hover::before,
+      .blogs-with-graphs__card:focus-visible::before {
+        opacity: 0.96;
+      }
+
+      .blogs-with-graphs__image-wrap {
+        --blogs-figure-height: 238px;
+        position: relative;
+        z-index: 2;
+        display: grid;
+        min-height: 0;
+        height: var(--blogs-figure-height);
+        align-items: center;
+        justify-content: center;
+        margin: 16px 16px 0;
+        border: 0;
+        border-radius: 22px;
+        background:
+          radial-gradient(circle at 18% 12%, rgba(var(--blogs-card-edge-rgb), 0.1), transparent 34%),
+          radial-gradient(circle at 86% 18%, rgba(var(--blogs-card-corner-rgb), 0.075), transparent 38%),
+          linear-gradient(135deg, rgba(2, 10, 20, 0.78), rgba(6, 17, 29, 0.56));
+        overflow: hidden;
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.08),
+          inset 0 -34px 72px rgba(0, 0, 0, 0.2),
+          0 18px 42px rgba(0, 0, 0, 0.16);
+      }
+
+      .blogs-with-graphs__image-wrap--compact {
+        min-height: 0;
+        height: var(--blogs-figure-height);
+      }
+
+      .blogs-with-graphs__image-wrap::after {
+        content: "";
+        position: absolute;
+        inset: 0;
+        border-radius: inherit;
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.08),
+          inset 0 0 0 1px rgba(255, 255, 255, 0.012),
+          inset 0 -26px 58px rgba(0, 0, 0, 0.18);
+        pointer-events: none;
+      }
+
+      .blogs-with-graphs__image {
+        display: block;
+        width: 100%;
+        height: 238px;
+        object-fit: cover;
+        object-position: center center;
+        filter: saturate(1.04) contrast(1.06);
+      }
+
+      .blogs-with-graphs__image--deepseek {
+        height: 238px;
+      }
+
+      .blogs-with-graphs__live {
+        position: relative;
+        z-index: 1;
+        display: grid;
+        width: 100%;
+        min-height: 238px;
+        place-items: center;
+        padding: 0;
+        pointer-events: none;
+      }
+
+      .blogs-with-graphs__image-wrap--compact .blogs-with-graphs__live {
+        min-height: 238px;
+        padding: 0;
+      }
+
+      .blogs-with-graphs__live--deepseek {
+        min-height: 238px;
+      }
+
+      .blogs-with-graphs__live--gemma {
+        min-height: 238px;
+      }
+
+      .blogs-with-graphs__live--liquidai {
+        width: 100%;
+        min-width: 100%;
+        height: var(--blogs-figure-height);
+        min-height: 238px;
+        justify-self: stretch;
+        align-self: stretch;
+        align-items: stretch;
+      }
+
+      .blogs-with-graphs__live--alpamayo {
+        width: 100%;
+        min-width: 100%;
+        min-height: 238px;
+      }
+
+      .blogs-with-graphs__image--alpamayo {
+        display: block;
+        width: 100%;
+        max-width: none;
+        height: 100%;
+        object-fit: contain;
+        filter: saturate(1.08) contrast(1.05);
+      }
+
+      .blogs-lfm-preview__mini-labels {
+        display: grid;
+        grid-template-columns: repeat(4, minmax(0, 1fr));
+        gap: 8px;
+        margin-top: 7px;
+        color: rgba(224, 241, 255, 0.45);
+        font: 700 8.5px/1 "IBM Plex Mono", "SFMono-Regular", monospace;
+        text-transform: uppercase;
+        letter-spacing: 0.08em;
+      }
+
+      .blogs-lfm-preview__mini-labels span {
+        padding-left: 2px;
+      }
+
+      .blogs-with-graphs__card[data-blogs-with-graphs-card="liquidai-lfm25-audio"] .blogs-with-graphs__image-wrap {
+        align-items: stretch;
+        justify-content: stretch;
+        justify-items: stretch;
+      }
+
+      .blogs-with-graphs__figure {
+        position: relative;
+        display: grid;
+        width: 100%;
+        min-height: 238px;
+        height: 238px;
+        place-items: center;
+        overflow: hidden;
+        color: #edf8ff;
+      }
+
+      .blogs-with-graphs__figure--liquidai {
+        width: 100%;
+        min-width: 100%;
+        height: var(--blogs-figure-height);
+        align-items: stretch;
+        justify-items: stretch;
+        background: transparent;
+      }
+
+      .blogs-with-graphs__live--liquidai > .blogs-lfm-preview {
+        display: none !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-interleave-figure {
+        width: 100% !important;
+        max-width: none !important;
+        min-height: var(--blogs-figure-height) !important;
+        height: var(--blogs-figure-height) !important;
+        margin: 0 !important;
+        border: 0 !important;
+        border-radius: 0 !important;
+        background:
+          radial-gradient(circle at 12% 8%, rgba(156, 255, 99, 0.18), transparent 34%),
+          radial-gradient(circle at 86% 18%, rgba(136, 215, 255, 0.22), transparent 36%),
+          linear-gradient(145deg, rgba(5, 14, 28, 0.3), rgba(3, 8, 16, 0.12)) !important;
+        box-shadow: none !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-int-head {
+        display: none !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-int-stage {
+        height: var(--blogs-figure-height) !important;
+        padding: 9px !important;
+        gap: 6px !important;
+        align-content: stretch !important;
+        grid-template-rows: minmax(0, 1.34fr) minmax(0, 0.92fr) !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-panel {
+        min-height: 0 !important;
+        border-radius: 16px !important;
+        background: linear-gradient(180deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.022)) !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-zoom-panel {
+        display: flex !important;
+        flex-direction: column !important;
+        justify-content: center !important;
+        padding: 5px 9px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-overview-panel {
+        padding: 6px 9px 9px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-panel-top,
+      .blogs-with-graphs__figure--liquidai .lfm-overview-top {
+        display: flex !important;
+        align-items: flex-end !important;
+        justify-content: space-between !important;
+        gap: 8px !important;
+        margin-bottom: 6px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-panel-label,
+      .blogs-with-graphs__figure--liquidai .lfm-overview-title {
+        font-size: 6.9px !important;
+        line-height: 1 !important;
+        letter-spacing: 0.12em !important;
+        white-space: nowrap !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-panel-copy {
+        display: none !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-progress-readout {
+        font-size: 6.7px !important;
+        line-height: 1 !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-zoom-viewport {
+        height: 72px !important;
+        border-radius: 13px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-zoom-viewport::before,
+      .blogs-with-graphs__figure--liquidai .lfm-zoom-viewport::after {
+        width: 22px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-zoom-track {
+        --slot-gap: 3px !important;
+        top: 8px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-slot {
+        grid-template-rows: 8px 47px !important;
+        gap: 4px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-slot-num {
+        font-size: 5.8px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-token-box {
+        border-radius: 8px !important;
+        font-size: 11.5px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-slot--text .lfm-token-box,
+      .blogs-with-graphs__figure--liquidai .lfm-slot--audio .lfm-token-box {
+        padding: 5px 2px !important;
+        row-gap: 1px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-token-piece {
+        font-size: 4.5px !important;
+        line-height: 0.9 !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-token-wave {
+        height: 12px !important;
+        gap: 1px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-token-wave i {
+        width: 1.25px !important;
+        height: calc(var(--h, 10px) * 0.56) !important;
+        max-height: 11px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-cycle-brace {
+        gap: 3px !important;
+        margin-top: 3px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-brace-part {
+        min-height: 13px !important;
+        padding: 2px 5px !important;
+        border-radius: 999px !important;
+        font-size: 5.8px !important;
+        line-height: 1 !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-mini-track-wrap {
+        gap: 4px !important;
+        padding: 6px !important;
+        border-radius: 12px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-mini-row {
+        gap: 4px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-mini-track {
+        gap: 1.5px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-mini-token {
+        min-height: 10px !important;
+        border-radius: 4px !important;
+      }
+
+      .blogs-with-graphs__figure--liquidai .lfm-mini-cycle-labels {
+        margin-top: 4px !important;
+        gap: 5px !important;
+        font-size: 4.7px !important;
+        line-height: 1 !important;
+      }
+
+      .blogs-with-graphs__figure--loading {
+        border: 0;
+        border-radius: 0;
+        background:
+          radial-gradient(circle at 14% 10%, rgba(34, 211, 238, 0.18), transparent 34%),
+          radial-gradient(circle at 88% 16%, rgba(74, 222, 128, 0.13), transparent 32%),
+          linear-gradient(135deg, rgba(4, 10, 20, 0.96), rgba(9, 16, 28, 0.96));
+        color: rgba(197, 208, 227, 0.78);
+        font: 820 0.78rem/1.3 Inter, ui-sans-serif, system-ui, sans-serif;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .blogs-with-graphs__figure .dsv4-res {
+        width: 112%;
+        min-width: 0;
+        gap: 0;
+        padding: 0;
+        border: 0;
+        border-radius: 0;
+        overflow: hidden;
+        background: transparent;
+        box-shadow: none;
+      }
+
+      .blogs-with-graphs__live--deepseek .blogs-with-graphs__figure .dsv4-res {
+        margin: 0 !important;
+        padding: 0 !important;
+        border: 0 !important;
+        border-radius: 0 !important;
+        background: transparent !important;
+        box-shadow: none !important;
+      }
+
+      .blogs-with-graphs__live--deepseek .blogs-with-graphs__figure .dsv4-res::before,
+      .blogs-with-graphs__live--deepseek .blogs-with-graphs__figure .dsv4-res::after {
+        display: none !important;
+      }
+
+      .blogs-with-graphs__figure .dsv4-res .dsv4-figure-title {
+        padding: 0 2px;
+        font-size: 9px;
+        line-height: 1.15;
+      }
+
+      .blogs-with-graphs__figure .dsv4-res .dsv4-scroll {
+        display: grid;
+        width: 100%;
+        height: 238px;
+        place-items: center;
+        overflow: hidden;
+      }
+
+      .blogs-with-graphs__figure .dsv4-res svg {
+        width: 108%;
+        max-width: none;
+        height: 226px;
+      }
+
+      .blogs-with-graphs__live--deepseek .blogs-with-graphs__figure {
+        box-sizing: border-box;
+        padding-inline: clamp(12px, 4vw, 18px);
+      }
+
+      .blogs-with-graphs__live--deepseek .blogs-with-graphs__figure .dsv4-res {
+        width: 100% !important;
+      }
+
+      .blogs-with-graphs__live--deepseek .blogs-with-graphs__figure .dsv4-res svg {
+        width: 100% !important;
+      }
+
+      .blogs-with-graphs__figure--gemma {
+        width: 100%;
+        min-height: 238px;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-figure {
+        width: 100%;
+        margin: 0;
+        padding: 0;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+        overflow: hidden;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg {
+        width: 118%;
+        max-width: none;
+        height: 250px;
+        margin: -6px -14.5% -6px -3.5%;
+        transform: translateY(18px);
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-meta,
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-caption,
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scene--desktop,
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__title:not(.attention-figure__title--mobile),
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__subtitle:not(.attention-figure__subtitle--mobile),
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scale--desktop {
+        display: none;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scene--mobile {
+        display: block;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__title--mobile,
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__subtitle--mobile,
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scale--mobile {
+        display: inline;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__title--mobile {
+        font-size: 27px;
+        letter-spacing: 2px;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__subtitle--mobile {
+        font-size: 13px;
+        letter-spacing: 1.35px;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__row-label {
+        font-size: 16px;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__row-hint,
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scale-label,
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scale-note {
+        font-size: 11.5px;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__repeat-label {
+        font-size: 17px;
+        letter-spacing: 1.2px;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__ratio {
+        font-size: 19px;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scene--mobile .attention-figure__row-hint {
+        display: none;
+      }
+
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scale--mobile .attention-figure__connector--ratio,
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scale--mobile .attention-figure__scale-note,
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scale--mobile .attention-figure__ratio,
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scale--mobile .attention-figure__scale-label[y="446"],
+      .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg .attention-figure__scale--mobile .attention-figure__scale-label[y="490"] {
+        display: none;
+      }
+
+      .blogs-graph-preview {
+        position: relative;
+        display: grid;
+        width: min(100%, 500px);
+        min-height: 222px;
+        color: #edf8ff;
+        font: 700 11px/1.25 Inter, ui-sans-serif, system-ui, sans-serif;
+      }
+
+      .blogs-graph-preview__card {
+        position: relative;
+        overflow: hidden;
+        display: grid;
+        gap: 10px;
+        width: 100%;
+        min-height: inherit;
+        padding: 14px;
+        border: 1px solid rgba(136, 215, 255, 0.08);
+        border-radius: 22px;
+        background:
+          radial-gradient(ellipse at 14% 10%, rgba(34, 211, 238, 0.14), transparent 38%),
+          radial-gradient(ellipse at 88% 16%, rgba(74, 222, 128, 0.1), transparent 36%),
+          linear-gradient(135deg, rgba(4, 10, 20, 0.62), rgba(9, 16, 28, 0.5));
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.075),
+          0 18px 42px rgba(0, 0, 0, 0.14);
+      }
+
+      .blogs-graph-preview__title {
+        color: rgba(238, 246, 255, 0.9);
+        font-size: 12px;
+        font-weight: 850;
+        letter-spacing: -0.02em;
+      }
+
+      .blogs-graph-preview__flow {
+        position: relative;
+        display: grid;
+        grid-template-columns: minmax(82px, 1fr) 26px minmax(104px, 1.18fr) 26px minmax(82px, 1fr);
+        grid-template-rows: repeat(5, minmax(36px, auto));
+        gap: 7px 8px;
+        align-items: center;
+      }
+
+      .blogs-heatmap-preview {
+        --borealis-heat-cell: clamp(36px, 2.55vw, 43px);
+        display: grid;
+        width: 100%;
+        max-width: 100%;
+        min-height: 238px;
+        height: 238px;
+        align-content: center;
+        gap: 8px;
+        padding: 14px 13px;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+      }
+
+      .blogs-heatmap-preview__head {
+        display: flex;
+        align-items: end;
+        justify-content: space-between;
+        gap: 10px;
+        min-width: 0;
+      }
+
+      .blogs-heatmap-preview__title {
+        color: rgba(238, 246, 255, 0.94);
+        font-size: 10px;
+        font-weight: 850;
+        letter-spacing: -0.02em;
+      }
+
+      .blogs-heatmap-preview__note {
+        color: rgba(197, 208, 227, 0.64);
+        font-size: 6.2px;
+        font-weight: 800;
+        letter-spacing: 0.06em;
+        text-align: right;
+        text-transform: uppercase;
+      }
+
+      .blogs-heatmap-preview__grid {
+        display: grid;
+        grid-template-columns: minmax(50px, 62px) repeat(6, var(--borealis-heat-cell));
+        grid-auto-rows: var(--borealis-heat-cell);
+        gap: 3px;
+        align-items: stretch;
+        justify-content: center;
+      }
+
+      .blogs-heatmap-preview__label,
+      .blogs-heatmap-preview__cell {
+        display: grid;
+        min-width: 0;
+        align-items: center;
+        justify-items: center;
+        border: 1px solid rgba(235, 248, 255, 0.08);
+        border-radius: 8px;
+        color: rgba(224, 240, 251, 0.82);
+        font-size: 6px;
+        font-weight: 820;
+        line-height: 1;
+        white-space: nowrap;
+      }
+
+      .blogs-heatmap-preview__label {
+        justify-items: start;
+        padding: 0 5px;
+        background: linear-gradient(180deg, rgba(235, 248, 255, 0.075), rgba(235, 248, 255, 0.03));
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+
+      .blogs-heatmap-preview__label--head {
+        justify-items: center;
+        color: rgba(197, 208, 227, 0.7);
+        font-size: 5.3px;
+        letter-spacing: 0.05em;
+        text-transform: uppercase;
+      }
+
+      .blogs-heatmap-preview__cell {
+        --hue: calc(150 - (var(--heat) * 145));
+        aspect-ratio: 1 / 1;
+        padding: 0;
+        border-color: hsla(var(--hue), 90%, 58%, 0.3);
+        background:
+          radial-gradient(circle at 18% 12%, hsla(var(--hue), 92%, 62%, 0.25), transparent 56%),
+          linear-gradient(180deg, hsla(var(--hue), 88%, 46%, 0.24), hsla(var(--hue), 88%, 34%, 0.13));
+        color: rgba(250, 255, 250, 0.96);
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.1),
+          0 10px 24px rgba(0, 0, 0, 0.12);
+        font-family: "SFMono-Regular", "Cascadia Code", monospace;
+        font-size: 5.8px;
+        letter-spacing: -0.04em;
+      }
+
+      .blogs-heatmap-preview__cell--head {
+        border-color: rgba(235, 248, 255, 0.08);
+        background: rgba(235, 248, 255, 0.055);
+        box-shadow: none;
+        color: rgba(197, 208, 227, 0.72);
+        font-family: Inter, ui-sans-serif, system-ui, sans-serif;
+        font-size: 5px;
+        font-weight: 860;
+        letter-spacing: 0.02em;
+        text-transform: uppercase;
+      }
+
+      .blogs-graph-preview__node {
+        position: relative;
+        z-index: 2;
+        display: grid;
+        gap: 4px;
+        min-height: 46px;
+        align-content: center;
+        padding: 8px 9px;
+        border: 1px solid rgba(var(--node-rgb), 0.36);
+        border-radius: 14px;
+        background:
+          radial-gradient(circle at 18% 0%, rgba(var(--node-rgb), 0.24), transparent 42%),
+          linear-gradient(180deg, rgba(235, 248, 255, 0.09), rgba(235, 248, 255, 0.035));
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.11),
+          0 12px 24px rgba(0, 0, 0, 0.16);
+      }
+
+      .blogs-graph-preview__node strong {
+        color: rgba(247, 252, 255, 0.98);
+        font-size: 11px;
+        line-height: 1.1;
+        letter-spacing: -0.02em;
+      }
+
+      .blogs-graph-preview__node span {
+        color: rgba(197, 208, 227, 0.68);
+        font-size: 8.8px;
+        font-weight: 720;
+      }
+
+      .blogs-graph-preview__tag {
+        justify-self: start;
+        padding: 2px 6px;
+        border-radius: 999px;
+        color: rgba(5, 12, 22, 0.92);
+        background: rgba(var(--node-rgb), 0.9);
+        font-size: 7.6px;
+        font-style: normal;
+        font-weight: 880;
+        letter-spacing: 0.07em;
+        text-transform: uppercase;
+      }
+
+      .blogs-graph-preview__edge {
+        position: relative;
+        z-index: 1;
+        height: 3px;
+        border-radius: 999px;
+        background: linear-gradient(90deg, rgba(var(--edge-a), 0.16), rgba(var(--edge-b), 0.92));
+        animation: blogsGraphPreviewPulse 1.9s ease-in-out infinite;
+      }
+
+      .blogs-graph-preview__edge::after {
+        content: "";
+        position: absolute;
+        right: -2px;
+        top: 50%;
+        width: 8px;
+        height: 8px;
+        border-top: 2px solid rgba(var(--edge-b), 0.94);
+        border-right: 2px solid rgba(var(--edge-b), 0.94);
+        transform: translateY(-50%) rotate(45deg);
+      }
+
+      .blogs-graph-preview__edge--down {
+        width: 3px;
+        height: 18px;
+        justify-self: center;
+        background: linear-gradient(180deg, rgba(var(--edge-a), 0.78), rgba(var(--edge-b), 0.88));
+      }
+
+      .blogs-graph-preview__edge--down::after {
+        right: 50%;
+        top: auto;
+        bottom: -2px;
+        transform: translateX(50%) rotate(135deg);
+      }
+
+      .blogs-graph-preview__stream {
+        position: relative;
+        display: grid;
+        grid-template-columns: repeat(4, 1fr);
+        gap: 5px;
+        align-items: center;
+        min-height: 50px;
+        padding: 9px;
+        border: 1px solid rgba(45, 212, 191, 0.35);
+        border-radius: 16px;
+        background: rgba(8, 20, 30, 0.72);
+      }
+
+      .blogs-graph-preview__stream i {
+        display: block;
+        height: 30px;
+        border-radius: 9px;
+        background:
+          linear-gradient(180deg, rgba(34, 211, 238, 0.22), rgba(74, 222, 128, 0.16)),
+          rgba(14, 34, 49, 0.92);
+        border: 1px solid rgba(148, 239, 231, 0.3);
+        animation: blogsStreamLift 2.4s ease-in-out infinite;
+      }
+
+      .blogs-graph-preview__stream i:nth-child(2) { animation-delay: -0.4s; }
+      .blogs-graph-preview__stream i:nth-child(3) { animation-delay: -0.8s; }
+      .blogs-graph-preview__stream i:nth-child(4) { animation-delay: -1.2s; }
+
+      .blogs-graph-preview__mix {
+        position: relative;
+        display: grid;
+        grid-template-columns: repeat(4, 1fr);
+        gap: 5px;
+        min-height: 54px;
+        padding: 9px;
+        border: 1px solid rgba(245, 158, 11, 0.36);
+        border-radius: 16px;
+        background:
+          radial-gradient(circle at 20% 16%, rgba(245, 158, 11, 0.18), transparent 40%),
+          rgba(15, 23, 42, 0.76);
+      }
+
+      .blogs-graph-preview__mix i {
+        display: block;
+        height: 34px;
+        border-radius: 999px;
+        background: linear-gradient(180deg, rgba(251, 191, 36, 0.82), rgba(245, 158, 11, 0.28));
+        box-shadow: 0 0 18px rgba(245, 158, 11, 0.16);
+        animation: blogsWeightPulse 1.9s ease-in-out infinite;
+      }
+
+      .blogs-graph-preview__mix i:nth-child(2) { animation-delay: -0.35s; }
+      .blogs-graph-preview__mix i:nth-child(3) { animation-delay: -0.7s; }
+      .blogs-graph-preview__mix i:nth-child(4) { animation-delay: -1.05s; }
+
+      .blogs-graph-preview__caption {
+        color: rgba(197, 208, 227, 0.7);
+        font-size: 9px;
+        font-weight: 760;
+        text-align: center;
+      }
+
+      .blogs-graph-preview--deepseek .blogs-graph-preview__card {
+        min-height: 262px;
+      }
+
+      .blogs-graph-preview--deepseek .blogs-graph-preview__mini-flow {
+        display: grid;
+        grid-template-columns: 1fr 26px 1fr;
+        gap: 8px;
+        align-items: center;
+      }
+
+      @keyframes blogsGraphPreviewPulse {
+        0%, 100% { opacity: 0.54; filter: drop-shadow(0 0 0 rgba(136, 215, 255, 0)); }
+        50% { opacity: 1; filter: drop-shadow(0 0 11px rgba(136, 215, 255, 0.28)); }
+      }
+
+      @keyframes blogsStreamLift {
+        0%, 100% { transform: translateY(0); opacity: 0.72; }
+        50% { transform: translateY(-4px); opacity: 1; }
+      }
+
+      @keyframes blogsWeightPulse {
+        0%, 100% { transform: scaleY(0.72); opacity: 0.62; }
+        50% { transform: scaleY(1); opacity: 1; }
+      }
+
+      .blogs-with-graphs__body {
+        position: relative;
+        z-index: 2;
+        display: grid;
+        gap: 12px;
+        padding: 20px 22px 22px;
+      }
+
+      .blogs-with-graphs__kicker {
+        --blogs-article-type-mark: #88d7ff;
+        --blogs-article-type-mark-glow: rgba(136, 215, 255, 0.3);
+        display: inline-flex;
+        width: fit-content;
+        align-items: center;
+        gap: 8px;
+        color: rgba(197, 208, 227, 0.82);
+        font-size: 0.68rem;
+        font-weight: 800;
+        letter-spacing: 0.12em;
+        text-transform: uppercase;
+      }
+
+      .blogs-with-graphs__kicker::before {
+        content: "";
+        width: 8px;
+        min-width: 8px;
+        height: 8px;
+        min-height: 8px;
+        flex: 0 0 8px;
+        aspect-ratio: 1 / 1;
+        border-radius: 999px;
+        background: var(--blogs-article-type-mark);
+        box-shadow: 0 0 16px var(--blogs-article-type-mark-glow);
+      }
+
+      .blogs-with-graphs__kicker--owner::before {
+        width: 13px;
+        min-width: 13px;
+        height: 13px;
+        min-height: 13px;
+        flex-basis: 13px;
+        border-radius: 0;
+        background: var(--blogs-article-type-mark);
+        box-shadow: 0 0 16px var(--blogs-article-type-mark-glow);
+        -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M345 151.2C354.2 143.9 360 132.6 360 120C360 97.9 342.1 80 320 80C297.9 80 280 97.9 280 120C280 132.6 285.9 143.9 295 151.2L226.6 258.8C216.6 274.5 195.3 278.4 180.4 267.2L120.9 222.7C125.4 216.3 128 208.4 128 200C128 177.9 110.1 160 88 160C65.9 160 48 177.9 48 200C48 221.8 65.5 239.6 87.2 240L119.8 457.5C124.5 488.8 151.4 512 183.1 512L456.9 512C488.6 512 515.5 488.8 520.2 457.5L552.8 240C574.5 239.6 592 221.8 592 200C592 177.9 574.1 160 552 160C529.9 160 512 177.9 512 200C512 208.4 514.6 216.3 519.1 222.7L459.7 267.3C444.8 278.5 423.5 274.6 413.5 258.9L345 151.2z'/%3E%3C/svg%3E");
+        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M345 151.2C354.2 143.9 360 132.6 360 120C360 97.9 342.1 80 320 80C297.9 80 280 97.9 280 120C280 132.6 285.9 143.9 295 151.2L226.6 258.8C216.6 274.5 195.3 278.4 180.4 267.2L120.9 222.7C125.4 216.3 128 208.4 128 200C128 177.9 110.1 160 88 160C65.9 160 48 177.9 48 200C48 221.8 65.5 239.6 87.2 240L119.8 457.5C124.5 488.8 151.4 512 183.1 512L456.9 512C488.6 512 515.5 488.8 520.2 457.5L552.8 240C574.5 239.6 592 221.8 592 200C592 177.9 574.1 160 552 160C529.9 160 512 177.9 512 200C512 208.4 514.6 216.3 519.1 222.7L459.7 267.3C444.8 278.5 423.5 274.6 413.5 258.9L345 151.2z'/%3E%3C/svg%3E");
+        -webkit-mask-position: center;
+        mask-position: center;
+        -webkit-mask-repeat: no-repeat;
+        mask-repeat: no-repeat;
+        -webkit-mask-size: contain;
+        mask-size: contain;
+      }
+
+      .blogs-with-graphs__kicker--hfviewer::before {
+        width: 12px;
+        min-width: 12px;
+        height: 12px;
+        min-height: 12px;
+        flex-basis: 12px;
+        border-radius: 4px;
+        background: var(--blogs-article-type-mark);
+        box-shadow: 0 0 16px var(--blogs-article-type-mark-glow);
+      }
+
+      .blogs-with-graphs__title {
+        margin: 0;
+        max-width: 20ch;
+        font-family: "Inter", sans-serif;
+        color: rgba(249, 252, 255, 0.98);
+        font-size: clamp(1.22rem, 1.72vw, 1.58rem);
+        line-height: 1.04;
+        letter-spacing: -0.045em;
+      }
+
+      .blogs-with-graphs__meta {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: 10px;
+        color: rgba(197, 208, 227, 0.82);
+        font-size: 0.84rem;
+        line-height: 1.4;
+      }
+
+      .blogs-with-graphs__avatar {
+        width: 34px;
+        min-width: 34px;
+        height: 34px;
+        min-height: 34px;
+        border-radius: 999px;
+        object-fit: cover;
+        background: rgba(136, 215, 255, 0.12);
+        border: 1px solid rgba(255, 255, 255, 0.2);
+        box-shadow:
+          0 0 0 3px rgba(136, 215, 255, 0.08),
+          0 8px 18px rgba(0, 0, 0, 0.22);
+      }
+
+      .blogs-with-graphs__avatar-stack {
+        display: inline-flex;
+        align-items: center;
+        padding-left: 2px;
+      }
+
+      .blogs-with-graphs__avatar-stack .blogs-with-graphs__avatar + .blogs-with-graphs__avatar {
+        margin-left: -10px;
+      }
+
+      .blogs-with-graphs__avatar-stack .blogs-with-graphs__avatar {
+        position: relative;
+        width: 32px;
+        min-width: 32px;
+        height: 32px;
+        min-height: 32px;
+        box-shadow:
+          0 0 0 3px rgba(7, 19, 33, 0.94),
+          0 8px 18px rgba(0, 0, 0, 0.28);
+      }
+
+      .blogs-with-graphs__avatar-stack .blogs-with-graphs__avatar:nth-child(1) { z-index: 3; }
+      .blogs-with-graphs__avatar-stack .blogs-with-graphs__avatar:nth-child(2) { z-index: 2; }
+      .blogs-with-graphs__avatar-stack .blogs-with-graphs__avatar:nth-child(3) { z-index: 1; }
+
+      .blogs-with-graphs__author {
+        color: rgba(245, 248, 255, 0.92);
+        font-weight: 750;
+      }
+
+      .blogs-with-graphs__open {
+        display: inline-flex;
+        align-items: center;
+        gap: 0.58em;
+        margin-top: 2px;
+        color: rgb(var(--blogs-card-edge-rgb));
+        font-size: 0.72rem;
+        font-weight: 850;
+        letter-spacing: 0.1em;
+        text-transform: uppercase;
+        text-shadow: 0 0 10px rgba(var(--blogs-card-edge-rgb), 0.2);
+      }
+
+      .blogs-with-graphs__open::after {
+        content: "";
+        display: inline-block;
+        width: 1.12em;
+        height: 1.12em;
+        flex: 0 0 auto;
+        background: currentColor;
+        -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
+        mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
+        transform: translateX(0);
+        transition: transform 180ms ease;
+      }
+
+      .blogs-with-graphs__card:hover .blogs-with-graphs__open::after,
+      .blogs-with-graphs__card:focus-visible .blogs-with-graphs__open::after {
+        transform: translateX(2px);
+      }
+
+      .blogs-with-graphs--card-variants {
+        padding-top: 18px;
+      }
+
+      .blogs-with-graphs--card-variants + .blogs-with-graphs--card-variants {
+        margin-top: 38px;
+        padding-top: 34px;
+        border-top: 1px solid rgba(255, 255, 255, 0.07);
+      }
+
+      .blogs-with-graphs--card-variants .blogs-with-graphs__lede {
+        color: rgba(197, 208, 227, 0.76);
+      }
+
+      .blogs-with-graphs--variant-previous .blogs-with-graphs__card {
+        min-height: 430px;
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 30px;
+        background:
+          radial-gradient(circle at 16% 0%, rgba(129, 248, 185, 0.16), transparent 34%),
+          radial-gradient(circle at 88% 4%, rgba(136, 215, 255, 0.16), transparent 34%),
+          linear-gradient(150deg, rgba(6, 16, 29, 0.96), rgba(9, 22, 38, 0.98) 54%, rgba(4, 14, 24, 0.98));
+        box-shadow:
+          0 26px 68px rgba(0, 0, 0, 0.34),
+          inset 0 1px 0 rgba(255, 255, 255, 0.09);
+      }
+
+      .blogs-with-graphs--variant-previous .blogs-with-graphs__card::before {
+        background:
+          linear-gradient(135deg, rgba(129, 248, 185, 0.08), transparent 38%),
+          linear-gradient(315deg, rgba(255, 117, 185, 0.09), transparent 34%);
+        opacity: 0;
+      }
+
+      .blogs-with-graphs--variant-previous .blogs-with-graphs__card::after {
+        display: none;
+      }
+
+      .blogs-with-graphs--variant-previous .blogs-with-graphs__card:hover::before,
+      .blogs-with-graphs--variant-previous .blogs-with-graphs__card:focus-visible::before {
+        opacity: 1;
+      }
+
+      .blogs-with-graphs--variant-previous .blogs-with-graphs__image-wrap {
+        margin: 15px 15px 0;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        border-radius: 22px;
+        background:
+          radial-gradient(circle at 28% 16%, rgba(129, 248, 185, 0.1), transparent 34%),
+          linear-gradient(135deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015));
+      }
+
+      .blogs-with-graphs--variant-previous .blogs-with-graphs__image-wrap::after {
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.12),
+          inset 0 -28px 60px rgba(0, 0, 0, 0.22);
+      }
+
+      .blogs-with-graphs--variant-previous .blogs-with-graphs__body {
+        gap: 12px;
+        padding: 18px 20px 21px;
+      }
+
+      .blogs-with-graphs--variant-previous .blogs-with-graphs__meta {
+        gap: 10px;
+        padding: 0;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+      }
+
+      .blogs-with-graphs--variant-previous .blogs-with-graphs__avatar {
+        width: 30px;
+        min-width: 30px;
+        height: 30px;
+        min-height: 30px;
+      }
+
+      .blogs-with-graphs--variant-previous .blogs-with-graphs__author {
+        font-size: inherit;
+        font-weight: 750;
+      }
+
+      .blogs-with-graphs--variant-author-halo .blogs-with-graphs__card,
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__card,
+      .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__card,
+      .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__card,
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__card,
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__card {
+        min-height: 430px;
+        border: 1px solid rgba(136, 215, 255, 0.18);
+        border-radius: 30px;
+        background:
+          radial-gradient(circle at 16% 0%, rgba(129, 248, 185, 0.16), transparent 34%),
+          radial-gradient(circle at 88% 4%, rgba(136, 215, 255, 0.16), transparent 34%),
+          linear-gradient(150deg, rgba(6, 16, 29, 0.96), rgba(9, 22, 38, 0.98) 54%, rgba(4, 14, 24, 0.98));
+        box-shadow:
+          0 26px 68px rgba(0, 0, 0, 0.34),
+          inset 0 1px 0 rgba(255, 255, 255, 0.09);
+      }
+
+      .blogs-with-graphs--variant-author-halo .blogs-with-graphs__image-wrap,
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__image-wrap,
+      .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__image-wrap,
+      .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__image-wrap,
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__image-wrap,
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__image-wrap {
+        margin: 15px 15px 0;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        border-radius: 22px;
+        background:
+          radial-gradient(circle at 28% 16%, rgba(129, 248, 185, 0.1), transparent 34%),
+          linear-gradient(135deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015));
+      }
+
+      .blogs-with-graphs--variant-author-halo .blogs-with-graphs__meta,
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__meta,
+      .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__meta,
+      .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__meta,
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__meta,
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__meta {
+        gap: 12px;
+        padding: 0;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        box-shadow: none;
+      }
+
+      .blogs-with-graphs--variant-author-halo .blogs-with-graphs__author,
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__author,
+      .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__author,
+      .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__author,
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__author,
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__author {
+        font-size: 1.08rem;
+        font-weight: 850;
+      }
+
+      .blogs-with-graphs--variant-author-halo .blogs-with-graphs__avatar,
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__avatar,
+      .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__avatar,
+      .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__avatar,
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__avatar,
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__avatar {
+        width: 72px;
+        min-width: 72px;
+        height: 72px;
+        min-height: 72px;
+        border: 1px solid rgba(255, 255, 255, 0.28);
+        box-shadow:
+          0 0 0 1px rgba(129, 248, 185, 0.18),
+          0 0 34px rgba(129, 248, 185, 0.16),
+          0 16px 28px rgba(0, 0, 0, 0.28);
+      }
+
+      .blogs-with-graphs--variant-author-halo .blogs-with-graphs__body {
+        position: relative;
+        padding: 46px 22px 22px;
+      }
+
+      .blogs-with-graphs--variant-author-halo .blogs-with-graphs__meta {
+        position: absolute;
+        left: 24px;
+        top: -38px;
+        z-index: 4;
+        align-items: end;
+      }
+
+      .blogs-with-graphs--variant-author-halo .blogs-with-graphs__avatar {
+        width: 82px;
+        min-width: 82px;
+        height: 82px;
+        min-height: 82px;
+      }
+
+      .blogs-with-graphs--variant-author-halo .blogs-with-graphs__meta::after {
+        content: "";
+        position: absolute;
+        left: 18px;
+        bottom: -10px;
+        width: 118px;
+        height: 1px;
+        background: linear-gradient(90deg, rgba(129, 248, 185, 0.46), transparent);
+        pointer-events: none;
+      }
+
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__body {
+        grid-template-columns: 88px minmax(0, 1fr);
+        align-items: start;
+        gap: 9px 16px;
+        padding: 20px 22px 23px;
+      }
+
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__meta {
+        grid-column: 1;
+        grid-row: 1 / span 4;
+        display: grid;
+        justify-items: center;
+        align-content: start;
+        gap: 9px;
+        color: rgba(197, 208, 227, 0.78);
+        font-size: 0.78rem;
+        line-height: 1.18;
+        text-align: center;
+      }
+
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__meta::before {
+        content: "";
+        position: absolute;
+        left: 58px;
+        top: 18px;
+        bottom: 18px;
+        width: 1px;
+        background: linear-gradient(180deg, transparent, rgba(129, 248, 185, 0.32), transparent);
+        pointer-events: none;
+      }
+
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__kicker,
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__title,
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__open {
+        grid-column: 2;
+      }
+
+      .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__avatar {
+        width: 78px;
+        min-width: 78px;
+        height: 78px;
+        min-height: 78px;
+      }
+
+      .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__card {
+        overflow: visible;
+      }
+
+      .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__image-wrap {
+        margin-right: 28px;
+        border-radius: 22px 32px 22px 22px;
+      }
+
+      .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__body {
+        padding: 18px 23px 23px;
+      }
+
+      .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__meta {
+        position: absolute;
+        top: 28px;
+        right: 2px;
+        z-index: 5;
+        flex-direction: column;
+        align-items: center;
+        width: 104px;
+        color: rgba(223, 247, 255, 0.82);
+        font-size: 0.78rem;
+        line-height: 1.16;
+        text-align: center;
+      }
+
+      .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__avatar {
+        width: 88px;
+        min-width: 88px;
+        height: 88px;
+        min-height: 88px;
+      }
+
+      .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__card {
+        grid-template-columns: minmax(0, 1fr) 124px;
+        grid-template-rows: auto 1fr;
+        overflow: visible;
+      }
+
+      .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__image-wrap {
+        grid-column: 1 / -1;
+        grid-row: 1;
+        margin-right: 15px;
+      }
+
+      .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__body {
+        grid-column: 1;
+        grid-row: 2;
+        padding: 18px 0 23px 22px;
+      }
+
+      .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__meta {
+        grid-column: 2;
+        grid-row: 2;
+        align-self: center;
+        justify-self: center;
+        display: grid;
+        justify-items: center;
+        gap: 10px;
+        padding: 0 14px 22px 0;
+        color: rgba(197, 208, 227, 0.82);
+        font-size: 0.82rem;
+        line-height: 1.2;
+        text-align: center;
+      }
+
+      .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__avatar {
+        width: 86px;
+        min-width: 86px;
+        height: 86px;
+        min-height: 86px;
+      }
+
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__body {
+        position: relative;
+        grid-template-columns: minmax(0, 1fr) 112px;
+        gap: 8px 14px;
+        padding: 20px 22px 24px;
+      }
+
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__kicker,
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__title,
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__open {
+        grid-column: 1;
+      }
+
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__meta {
+        position: relative;
+        grid-column: 2;
+        grid-row: 1 / span 4;
+        display: grid;
+        justify-items: center;
+        align-content: center;
+        gap: 10px;
+        color: rgba(197, 208, 227, 0.82);
+        font-size: 0.8rem;
+        line-height: 1.2;
+        text-align: center;
+      }
+
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__meta::before {
+        content: "";
+        position: absolute;
+        inset: -10px 8px auto;
+        height: 86px;
+        border: 1px solid rgba(129, 248, 185, 0.18);
+        border-right-color: transparent;
+        border-bottom-color: rgba(136, 215, 255, 0.12);
+        border-radius: 999px;
+        transform: rotate(-16deg);
+        pointer-events: none;
+      }
+
+      .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__avatar {
+        width: 76px;
+        min-width: 76px;
+        height: 76px;
+        min-height: 76px;
+      }
+
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__card {
+        border-radius: 34px;
+        background:
+          radial-gradient(circle at 20% 4%, rgba(129, 248, 185, 0.15), transparent 32%),
+          radial-gradient(circle at 92% 4%, rgba(136, 215, 255, 0.14), transparent 32%),
+          linear-gradient(150deg, rgba(5, 15, 27, 0.96), rgba(8, 20, 34, 0.98));
+      }
+
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__image-wrap {
+        margin: 18px 18px 0;
+        border-radius: 26px;
+      }
+
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__body {
+        grid-template-columns: 96px minmax(0, 1fr);
+        align-items: center;
+        gap: 10px 16px;
+        padding: 19px 24px 24px;
+      }
+
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__meta {
+        grid-column: 1;
+        grid-row: 1 / span 4;
+        display: grid;
+        justify-items: center;
+        gap: 9px;
+        color: rgba(197, 208, 227, 0.82);
+        font-size: 0.8rem;
+        line-height: 1.2;
+        text-align: center;
+      }
+
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__kicker,
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__title,
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__open {
+        grid-column: 2;
+      }
+
+      .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__avatar {
+        width: 84px;
+        min-width: 84px;
+        height: 84px;
+        min-height: 84px;
+      }
+
+      .community-showcase {
+        display: grid;
+        gap: 20px;
+        margin-top: -20px;
+        /* Pin the single grid track to the container width. Without this the
+           track is auto-sized, so a wide item (e.g. the podium row's nowrap
+           count pills) inflates the track past the page column and every
+           sibling (head, rail, cards) stretches with it off the right edge
+           on phones. Same containment lesson as the embed page. */
+        grid-template-columns: minmax(0, 1fr);
+      }
+
+      .community-showcase__head {
+        display: flex;
+        align-items: end;
+        justify-content: space-between;
+        gap: 24px;
+      }
+
+      .community-showcase__intro {
+        display: grid;
+        gap: 10px;
+        width: 100%;
+      }
+
+      .community-showcase__title-row {
+        display: grid;
+        grid-template-columns: minmax(0, max-content) auto;
+        align-items: end;
+        justify-content: space-between;
+        column-gap: 24px;
+        row-gap: 16px;
+      }
+
+      .community-showcase__eyebrow {
+        color: var(--muted);
+        font-size: 0.78rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .community-showcase h2 {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: clamp(2rem, 3vw, 3rem);
+        line-height: 1;
+        letter-spacing: -0.04em;
+      }
+
+      .community-showcase p {
+        margin: 0;
+      }
+
+      .community-showcase__lede {
+        max-width: 64ch;
+        color: var(--muted-strong);
+        font-size: 0.98rem;
+        line-height: 1.65;
+      }
+
+      .community-showcase__embed-cta {
+        position: relative;
+        isolation: isolate;
+        overflow: hidden;
+        display: inline-flex;
+        justify-self: end;
+        align-self: end;
+        width: fit-content;
+        align-items: center;
+        justify-content: center;
+        gap: 11px;
+        min-height: 46px;
+        padding: 0 18px 0 10px;
+        border: 1px solid rgba(129, 248, 185, 0.4);
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 18% 10%, rgba(129, 248, 185, 0.24), transparent 24%),
+          linear-gradient(115deg, rgba(5, 18, 28, 0.98), rgba(16, 83, 71, 0.72), rgba(9, 25, 39, 0.96), rgba(129, 248, 185, 0.18));
+        background-size: 230% 230%;
+        color: #e9fff8;
+        font-size: 0.94rem;
+        font-weight: 800;
+        letter-spacing: -0.01em;
+        text-decoration: none;
+        box-shadow:
+          0 14px 34px rgba(16, 185, 129, 0.13),
+          inset 0 1px 0 rgba(255, 255, 255, 0.16);
+        animation: communityCtaGradientDrift 7.8s ease-in-out infinite;
+        transition:
+          border-color 180ms ease,
+          box-shadow 180ms ease,
+          transform 180ms ease;
+      }
+
+      .community-showcase__embed-cta::after {
+        content: "";
+        position: absolute;
+        inset: -42% auto -42% -58%;
+        z-index: 0;
+        width: 42%;
+        border-radius: 999px;
+        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.34), transparent);
+        filter: blur(0.2px);
+        transform: skewX(-18deg);
+        animation: communityCtaFastSheen 2.65s cubic-bezier(0.4, 0, 0.2, 1) infinite;
+        z-index: 0;
+        pointer-events: none;
+      }
+
+      /* keep BOTH children above the button's animated background and sheen
+         on every compositor (some Android builds mis-stack filtered/skewed
+         pseudo-elements over static children), and guard the label against
+         any inherited gradient-text fill */
+      .community-showcase__embed-cta > span,
+      .community-showcase__embed-cta .community-showcase__embed-cta-icon-wrap {
+        position: relative;
+        z-index: 1;
+        -webkit-text-fill-color: currentColor;
+      }
+
+      .community-showcase__embed-cta:hover,
+      .community-showcase__embed-cta:focus-visible {
+        border-color: rgba(129, 248, 185, 0.62);
+        box-shadow:
+          0 18px 42px rgba(16, 185, 129, 0.2),
+          0 0 0 1px rgba(129, 248, 185, 0.08),
+          inset 0 1px 0 rgba(255, 255, 255, 0.2);
+        transform: translateY(-1px);
+      }
+
+      .community-showcase__embed-cta:focus-visible {
+        outline: 2px solid rgba(129, 248, 185, 0.42);
+        outline-offset: 3px;
+      }
+
+      .community-showcase__embed-cta-icon-wrap {
+        display: inline-flex;
+        width: 30px;
+        height: 30px;
+        flex: 0 0 auto;
+        align-items: center;
+        justify-content: center;
+        border: 1px solid rgba(129, 248, 185, 0.24);
+        border-radius: 999px;
+        background:
+          radial-gradient(circle at 32% 24%, rgba(255, 255, 255, 0.2), transparent 32%),
+          rgba(2, 14, 22, 0.58);
+        color: #eafff8;
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.12),
+          0 8px 18px rgba(0, 0, 0, 0.18);
+      }
+
+      .community-showcase__embed-cta-icon {
+        display: block;
+        width: 19px;
+        height: 19px;
+        flex: 0 0 auto;
+        color: currentColor;
+      }
+
+      @keyframes communityCtaGradientDrift {
+        0%,
+        100% {
+          background-position: 0% 50%;
+        }
+        50% {
+          background-position: 100% 50%;
+        }
+      }
+
+      @keyframes communityCtaFastSheen {
+        0% {
+          transform: translateX(0) skewX(-18deg);
+          opacity: 0;
+        }
+        16% {
+          opacity: 0.92;
+        }
+        48%,
+        100% {
+          transform: translateX(390%) skewX(-18deg);
+          opacity: 0;
+        }
+      }
+
+      @media (prefers-reduced-motion: reduce) {
+        .blogs-with-graphs__write,
+        .community-showcase__embed-cta,
+        .community-showcase__embed-cta::after {
+          animation: none;
+        }
+      }
+
+      .community-showcase__carousel {
+        position: relative;
+        min-width: 0;
+      }
+
+      .community-showcase__rail {
+        display: flex;
+        align-items: flex-start;
+        gap: 18px;
+        overflow-x: auto;
+        overflow-y: hidden;
+        overflow-anchor: none;
+        padding: 2px 2px 18px;
+        scroll-behavior: auto;
+        scroll-padding-inline: 2px;
+        scroll-snap-type: x proximity;
+        scrollbar-width: none;
+      }
+
+      .community-showcase__rail::-webkit-scrollbar {
+        display: none;
+      }
+
+      .community-showcase__pager {
+        display: none;
+      }
+
+      /*
+       * Top community members podium, below the showcase rail: honors the
+       * three authors with the most embedded graphs in the rail above. The
+       * standings are computed at runtime from the same rail the page shows
+       * (baked cards + the live community_showcase feed), so the podium
+       * stays current whenever the showcase itself updates.
+       */
+      .community-podium {
+        display: grid;
+        gap: 8px;
+        justify-items: center;
+        padding: 10px 12px 2px;
+      }
+
+      .community-podium[hidden] {
+        display: none;
+      }
+
+      .community-podium__eyebrow {
+        color: var(--muted);
+        font-size: 0.8rem;
+        letter-spacing: 0.14em;
+        text-align: center;
+        text-transform: uppercase;
+      }
+
+      .community-podium__cta {
+        color: var(--muted);
+        font-size: 0.92rem;
+        margin: 14px auto 0;
+        max-width: 560px;
+        text-align: center;
+      }
+
+      .community-podium__cta[hidden] {
+        display: none;
+      }
+
+      .community-podium__cta-link {
+        color: var(--lime, #9cff63);
+        font-weight: 600;
+        text-decoration: underline;
+        text-underline-offset: 3px;
+      }
+
+      .community-podium__cta-link:hover,
+      .community-podium__cta-link:focus-visible {
+        filter: brightness(1.15);
+      }
+
+      .community-podium__row {
+        display: flex;
+        align-items: flex-end;
+        justify-content: center;
+        gap: clamp(22px, 5.4vw, 64px);
+        min-width: 0;
+        max-width: 100%;
+      }
+
+      .community-podium__member {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 8px;
+        min-width: 0;
+        padding: 8px 6px 4px;
+        border-radius: 18px;
+        color: var(--text);
+        text-align: center;
+        text-decoration: none;
+        transition: transform 0.22s ease;
+      }
+
+      .community-podium__member:hover,
+      .community-podium__member:focus-visible {
+        transform: translateY(-5px);
+        outline: none;
+      }
+
+      .community-podium__member:focus-visible .community-podium__name {
+        text-decoration: underline;
+      }
+
+      .community-podium__member--rank-1 { order: 2; }
+      .community-podium__member--rank-2 { order: 1; }
+      .community-podium__member--rank-3 { order: 3; }
+
+      .community-podium__figure {
+        position: relative;
+        display: grid;
+        place-items: center;
+        width: var(--podium-figure-size, 118px);
+        height: var(--podium-figure-size, 118px);
+      }
+
+      .community-podium__member--rank-1 .community-podium__figure {
+        --podium-figure-size: 158px;
+        --podium-avatar-size: 88px;
+      }
+
+      .community-podium__member--rank-1 {
+        margin-bottom: 10px;
+      }
+
+      .community-podium__wreath {
+        position: absolute;
+        inset: 0;
+        width: 100%;
+        height: 100%;
+        pointer-events: none;
+      }
+
+      .community-podium__member--rank-1 .community-podium__wreath {
+        filter: drop-shadow(0 0 14px rgba(242, 193, 78, 0.3));
+      }
+
+      .community-podium__avatar {
+        width: var(--podium-avatar-size, 62px);
+        height: var(--podium-avatar-size, 62px);
+        border-radius: 999px;
+        object-fit: cover;
+        background: rgba(255, 255, 255, 0.08);
+        box-shadow:
+          0 0 0 2px var(--podium-medal, rgba(255, 255, 255, 0.35)),
+          0 10px 26px rgba(0, 0, 0, 0.45);
+      }
+
+      .community-podium__avatar--org {
+        /* Roundrect corners reach further out than a circle; pull org
+           avatars in a touch so they clear the wreath leaves. */
+        width: calc(var(--podium-avatar-size, 62px) * 0.88);
+        height: calc(var(--podium-avatar-size, 62px) * 0.88);
+        border-radius: 24%;
+      }
+
+      .community-podium__rank {
+        position: absolute;
+        bottom: 6px;
+        left: 50%;
+        display: grid;
+        place-items: center;
+        width: 24px;
+        height: 24px;
+        border-radius: 999px;
+        background: var(--podium-medal, #cfd8e6);
+        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45);
+        color: #10141d;
+        font-size: 0.76rem;
+        font-weight: 800;
+        transform: translateX(-50%);
+      }
+
+      .community-podium__member--rank-1 .community-podium__rank {
+        width: 27px;
+        height: 27px;
+        font-size: 0.85rem;
+      }
+
+      .community-podium__member--rank-1 { --podium-medal: #f2c14e; }
+      .community-podium__member--rank-2 { --podium-medal: #cfd8e6; }
+      .community-podium__member--rank-3 { --podium-medal: #d08a53; }
+
+      .community-podium__name {
+        max-width: 172px;
+        overflow: hidden;
+        font-size: 0.98rem;
+        font-weight: 700;
+        letter-spacing: -0.01em;
+        overflow-wrap: anywhere;
+      }
+
+      .community-podium__member--rank-1 .community-podium__name {
+        max-width: 208px;
+        font-size: 1.12rem;
+      }
+
+      .community-podium__count {
+        max-width: 100%;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        padding: 4px 11px;
+        border: 1px solid color-mix(in srgb, var(--podium-medal, #cfd8e6) 42%, transparent);
+        border-radius: 999px;
+        background: color-mix(in srgb, var(--podium-medal, #cfd8e6) 10%, rgba(255, 255, 255, 0.03));
+        color: var(--muted-strong);
+        font-size: 0.76rem;
+        font-weight: 600;
+        letter-spacing: 0.01em;
+        white-space: nowrap;
+      }
+
+      @media (max-width: 620px) {
+        .community-podium {
+          padding-inline: 0;
+        }
+
+        .community-podium__row {
+          gap: 6px;
+        }
+
+        .community-podium__figure {
+          --podium-figure-size: 88px;
+          --podium-avatar-size: 46px;
+        }
+
+        .community-podium__member--rank-1 .community-podium__figure {
+          --podium-figure-size: 112px;
+          --podium-avatar-size: 60px;
+        }
+
+        .community-podium__member {
+          padding-inline: 0;
+        }
+
+        .community-podium__name {
+          max-width: 100px;
+          font-size: 0.82rem;
+        }
+
+        .community-podium__member--rank-1 .community-podium__name {
+          max-width: 118px;
+          font-size: 0.93rem;
+        }
+
+        .community-podium__count {
+          /* Scale with the viewport so three "N embedded graphs" pills fit
+             side by side without ellipsis down to 320px wide phones. */
+          padding: 3px 5px;
+          font-size: clamp(0.5rem, 2.45vw, 0.64rem);
+        }
+      }
+
+      @media (max-width: 349px) {
+        /* Ultra-narrow phones: shrink the wreaths proportionally so the
+           gold rank-1 figure stops crowding out the flanking pills. */
+        .community-podium__figure {
+          --podium-figure-size: 76px;
+          --podium-avatar-size: 40px;
+        }
+
+        .community-podium__member--rank-1 .community-podium__figure {
+          --podium-figure-size: 98px;
+          --podium-avatar-size: 52px;
+        }
+      }
+
+      .community-card {
+        --community-card-panel-height: 450px;
+        --community-card-top-height: 58px;
+        --community-card-summary-min-height: 106px;
+        --community-card-embed-min-height: 210px;
+        display: flex;
+        flex: 0 0 clamp(356px, 31vw, 430px);
+        flex-direction: column;
+        min-height: 100%;
+        padding: 18px;
+        border: 1px solid rgba(255, 255, 255, 0.72);
+        border-radius: 24px;
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 249, 252, 0.98));
+        color: #111827;
+        box-shadow:
+          0 24px 60px rgba(0, 0, 0, 0.28),
+          inset 0 1px 0 rgba(255, 255, 255, 0.9);
+        scroll-snap-align: start;
+      }
+
+      .community-card__top {
+        display: flex;
+        align-items: center;
+        gap: 11px;
+        height: var(--community-card-top-height);
+        min-width: 0;
+        padding-bottom: 14px;
+        border-bottom: 1px solid #e5e7eb;
+      }
+
+      .community-card__avatar {
+        width: 38px;
+        height: 38px;
+        flex: 0 0 38px;
+        border-radius: 999px;
+        object-fit: cover;
+        background: #e5e7eb;
+        box-shadow:
+          0 0 0 1px rgba(15, 23, 42, 0.08),
+          0 8px 18px rgba(15, 23, 42, 0.14);
+      }
+
+      /* Organizations use roundrect avatars; individual users stay circular. */
+      .community-card--org .community-card__avatar { border-radius: 10px; }
+
+      .community-card__repo {
+        display: -webkit-box;
+        min-width: 0;
+        overflow: hidden;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 2;
+        color: #111827;
+        font-size: clamp(1.06rem, 1.25vw, 1.26rem);
+        line-height: 1.08;
+        overflow-wrap: anywhere;
+      }
+
+      .community-card__owner {
+        color: #9ca3af;
+        font-weight: 560;
+      }
+
+      .community-card__slash {
+        color: #9ca3af;
+        font-weight: 620;
+      }
+
+      .community-card__model {
+        color: #05070c;
+        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
+        font-weight: 800;
+        letter-spacing: -0.02em;
+      }
+
+      .community-card__tabs {
+        display: flex;
+        align-items: center;
+        gap: 18px;
+        min-height: 42px;
+        border-bottom: 1px solid #e5e7eb;
+        color: #6b7280;
+        font-size: 0.82rem;
+        font-weight: 650;
+      }
+
+      .community-card__tab {
+        align-self: stretch;
+        display: inline-flex;
+        align-items: center;
+        padding: 0;
+        border: 0;
+        border-bottom: 2px solid transparent;
+        background: transparent;
+        color: #6b7280;
+        font: inherit;
+        cursor: pointer;
+      }
+
+      .community-card__tab:hover,
+      .community-card__tab:focus-visible {
+        color: #111827;
+        outline: none;
+      }
+
+      .community-card__tab[aria-selected="true"] {
+        align-self: stretch;
+        display: inline-flex;
+        align-items: center;
+        color: #111827;
+        border-bottom: 2px solid #ff9d00;
+      }
+
+      .community-card__panel {
+        height: var(--community-card-panel-height);
+        min-height: 0;
+        overflow: hidden;
+      }
+
+      .community-card__panel[hidden] {
+        display: none !important;
+      }
+
+      .community-card__panel--model {
+        display: flex;
+        min-height: 0;
+        flex-direction: column;
+      }
+
+      .community-card__panel--data {
+        display: grid;
+        align-content: start;
+        gap: 10px;
+        padding-top: 14px;
+        grid-template-rows: auto minmax(0, 1fr);
+      }
+
+      .community-card__status {
+        color: #64748b;
+        font-size: 0.84rem;
+        line-height: 1.5;
+      }
+
+      .community-card__hf-summary {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 12px;
+        min-width: 0;
+        color: #4b5563;
+        font-size: 0.82rem;
+        font-weight: 650;
+        line-height: 1.35;
+      }
+
+      .community-card__hf-count {
+        flex: 0 0 auto;
+        color: #6b7280;
+        font-size: 0.76rem;
+        font-weight: 560;
+      }
+
+      .community-card__hf-list {
+        min-height: 0;
+        overflow: auto;
+        border: 1px solid #e5e7eb;
+        border-radius: 12px;
+        background: #ffffff;
+        scrollbar-color: #cbd5e1 transparent;
+        scrollbar-width: thin;
+      }
+
+      .community-card__hf-list::-webkit-scrollbar {
+        width: 8px;
+        height: 8px;
+      }
+
+      .community-card__hf-list::-webkit-scrollbar-thumb {
+        border-radius: 999px;
+        background: #cbd5e1;
+      }
+
+      .community-card__hf-row {
+        display: grid;
+        grid-template-columns: minmax(0, 1.18fr) minmax(86px, 0.8fr) max-content;
+        align-items: center;
+        gap: 10px;
+        min-height: 43px;
+        padding: 0 12px;
+        border-bottom: 1px solid #eef2f7;
+        color: #111827;
+        text-decoration: none;
+      }
+
+      .community-card__hf-row:last-child {
+        border-bottom: 0;
+      }
+
+      .community-card__hf-row--head {
+        position: sticky;
+        top: 0;
+        z-index: 1;
+        min-height: 34px;
+        background: #f8fafc;
+        color: #6b7280;
+        font-size: 0.7rem;
+        font-weight: 720;
+        letter-spacing: 0.03em;
+        text-transform: uppercase;
+      }
+
+      .community-card__hf-file-row:hover,
+      .community-card__hf-file-row:focus-visible,
+      .community-card__discussion-row:hover,
+      .community-card__discussion-row:focus-visible {
+        background: #f8fafc;
+        outline: none;
+      }
+
+      .community-card__hf-name {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        min-width: 0;
+      }
+
+      .community-card__hf-icon {
+        position: relative;
+        display: inline-block;
+        width: 18px;
+        height: 18px;
+        flex: 0 0 18px;
+      }
+
+      .community-card__hf-icon--file {
+        background: #64748b;
+        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M304 112L192 112C183.2 112 176 119.2 176 128L176 512C176 520.8 183.2 528 192 528L448 528C456.8 528 464 520.8 464 512L464 272L376 272C336.2 272 304 239.8 304 200L304 112zM444.1 224L352 131.9L352 200C352 213.3 362.7 224 376 224L444.1 224zM128 128C128 92.7 156.7 64 192 64L325.5 64C342.5 64 358.8 70.7 370.8 82.7L493.3 205.3C505.3 217.3 512 233.6 512 250.6L512 512C512 547.3 483.3 576 448 576L192 576C156.7 576 128 547.3 128 512L128 128z'/%3E%3C/svg%3E") center / contain no-repeat;
+        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M304 112L192 112C183.2 112 176 119.2 176 128L176 512C176 520.8 183.2 528 192 528L448 528C456.8 528 464 520.8 464 512L464 272L376 272C336.2 272 304 239.8 304 200L304 112zM444.1 224L352 131.9L352 200C352 213.3 362.7 224 376 224L444.1 224zM128 128C128 92.7 156.7 64 192 64L325.5 64C342.5 64 358.8 70.7 370.8 82.7L493.3 205.3C505.3 217.3 512 233.6 512 250.6L512 512C512 547.3 483.3 576 448 576L192 576C156.7 576 128 547.3 128 512L128 128z'/%3E%3C/svg%3E") center / contain no-repeat;
+      }
+
+      .community-card__hf-icon--directory {
+        width: 17px;
+        height: 13px;
+        margin-top: 3px;
+        border-color: #f59e0b;
+        border-radius: 3px;
+        background: #fef3c7;
+      }
+
+      .community-card__hf-icon--directory::before {
+        content: "";
+        position: absolute;
+        top: -5px;
+        left: 1px;
+        width: 8px;
+        height: 5px;
+        border: 1.5px solid #f59e0b;
+        border-bottom: 0;
+        border-radius: 3px 3px 0 0;
+        background: #fef3c7;
+      }
+
+      .community-card__hf-icon--directory::after {
+        content: none;
+      }
+
+      .community-card__hf-path,
+      .community-card__hf-commit-title,
+      .community-card__hf-commit-date,
+      .community-card__hf-size {
+        min-width: 0;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .community-card__hf-path {
+        color: #111827;
+        font-size: 0.82rem;
+        font-weight: 660;
+      }
+
+      .community-card__hf-commit {
+        display: grid;
+        min-width: 0;
+        gap: 2px;
+      }
+
+      .community-card__hf-commit-title {
+        color: #4b5563;
+        font-size: 0.75rem;
+        font-weight: 560;
+      }
+
+      .community-card__hf-commit-date,
+      .community-card__hf-size {
+        color: #6b7280;
+        font-size: 0.72rem;
+        font-weight: 520;
+      }
+
+      .community-card__hf-size {
+        justify-self: end;
+        max-width: 62px;
+      }
+
+      .community-card__discussion-list .community-card__hf-row {
+        grid-template-columns: minmax(0, 1fr) auto;
+      }
+
+      .community-card__discussion-main {
+        display: grid;
+        min-width: 0;
+        gap: 3px;
+      }
+
+      .community-card__discussion-title {
+        overflow: hidden;
+        color: #111827;
+        font-size: 0.84rem;
+        font-weight: 680;
+        line-height: 1.25;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .community-card__discussion-meta {
+        overflow: hidden;
+        color: #6b7280;
+        font-size: 0.73rem;
+        line-height: 1.35;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .community-card__discussion-state {
+        justify-self: end;
+        padding: 3px 7px;
+        border: 1px solid #d1d5db;
+        border-radius: 999px;
+        color: #4b5563;
+        font-size: 0.7rem;
+        font-weight: 650;
+      }
+
+      .community-card__empty {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        min-height: 0;
+        height: 100%;
+        padding: 20px;
+        border: 1px solid #e5e7eb;
+        border-radius: 12px;
+        background: #ffffff;
+        color: #64748b;
+        font-size: 0.84rem;
+        line-height: 1.55;
+        text-align: center;
+      }
+
+      .community-card__empty-title {
+        color: #111827;
+        font-size: 0.92rem;
+        font-weight: 720;
+      }
+
+      .community-card__empty-copy {
+        margin-top: 5px;
+      }
+
+      .community-card__summary {
+        flex: 0 0 auto;
+        min-height: var(--community-card-summary-min-height);
+        padding: 16px 0 18px;
+        color: #374151;
+        font-size: 0.92rem;
+        line-height: 1.62;
+      }
+
+      .community-card__embed {
+        display: flex;
+        flex: 1 1 312px;
+        align-items: center;
+        justify-content: center;
+        min-height: var(--community-card-embed-min-height);
+        height: auto;
+        padding: 10px;
+        overflow: hidden;
+        border: 1px solid #e5e7eb;
+        border-radius: 16px;
+        background:
+          radial-gradient(circle at 50% 0%, rgba(136, 215, 255, 0.1), transparent 52%),
+          linear-gradient(180deg, #f8fafc, #eef2f7);
+        color: inherit;
+        transition: transform 180ms ease, box-shadow 180ms ease;
+      }
+
+      .community-card__embed:hover,
+      .community-card__embed:focus-visible {
+        transform: translateY(-2px);
+        outline: none;
+      }
+
+      .community-card__viewer {
+        display: block;
+        width: 100%;
+        height: 100%;
+        border-radius: 16px;
+        filter: drop-shadow(0 16px 26px rgba(15, 23, 42, 0.16));
+        object-fit: contain;
+        object-position: center center;
+      }
+
+
+      .community-card__embed-grid {
+
+        flex: 1 1 312px;
+
+        min-height: var(--community-card-embed-min-height);
+
+        display: grid;
+
+        grid-template-columns: 1fr 1fr;
+
+        gap: 8px;
+
+      }
+
+      .community-card__embed-grid .community-card__embed {
+
+        flex: none;
+
+        min-height: 0;
+
+        height: auto;
+
+        padding: 6px;
+
+        border-radius: 12px;
+
+      }
+
+      .community-card__embed-grid .community-card__viewer {
+
+        border-radius: 10px;
+
+        max-height: 158px;
+
+        filter: drop-shadow(0 8px 14px rgba(15, 23, 42, 0.14));
+
+      }
+
+      .community-card__actions {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 12px;
+        margin-top: 14px;
+      }
+
+      .community-card__link {
+        color: #0f172a;
+        font-size: 0.78rem;
+        font-weight: 760;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .community-card__link--muted {
+        color: #64748b;
+      }
+
+      .community-card__link:hover,
+      .community-card__link:focus-visible {
+        color: #0369a1;
+        outline: none;
+      }
+
+      .products-section {
+        margin-top: 52px;
+        display: grid;
+        gap: 20px;
+      }
+
+      .products-section__lede {
+        margin: 0;
+        max-width: none;
+        width: 100%;
+        color: var(--muted-strong);
+        font-size: 1rem;
+        line-height: 1.7;
+        text-align: center;
+      }
+
+      .products-grid {
+        display: grid;
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+        gap: 18px;
+      }
+
+      .product-link {
+        display: inline-flex;
+        align-items: center;
+        gap: 14px;
+        padding: 16px 18px;
+        border-radius: 22px;
+        border: 1px solid var(--stroke);
+        background: rgba(255, 255, 255, 0.04);
+        box-shadow: 0 18px 42px rgba(0, 0, 0, 0.22);
+        transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
+      }
+
+      .product-link:hover,
+      .product-link:focus-visible {
+        transform: translateY(-3px);
+        border-color: rgba(136, 215, 255, 0.26);
+        box-shadow:
+          0 24px 54px rgba(0, 0, 0, 0.28),
+          0 0 0 1px rgba(136, 215, 255, 0.08);
+        outline: none;
+      }
+
+      .product-link__mark {
+        width: 44px;
+        height: 44px;
+        border-radius: 14px;
+        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22);
+        flex: 0 0 auto;
+      }
+
+      .product-link__mark--deploy {
+        background:
+          radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.34), transparent 18%),
+          linear-gradient(135deg, rgba(83, 135, 255, 0.94), rgba(120, 227, 142, 0.9));
+      }
+
+      .product-link__mark--hub {
+        background:
+          radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.34), transparent 18%),
+          linear-gradient(135deg, rgba(255, 173, 74, 0.96), rgba(83, 226, 196, 0.88));
+      }
+
+      .product-link__mark--models {
+        background:
+          radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.34), transparent 18%),
+          linear-gradient(135deg, rgba(255, 111, 145, 0.94), rgba(255, 209, 92, 0.9));
+      }
+
+      .product-link__text {
+        display: grid;
+        gap: 3px;
+        min-width: 0;
+      }
+
+      .product-link__name {
+        font-family: "Inter", sans-serif;
+        font-size: 1.04rem;
+        font-weight: 700;
+        letter-spacing: 0.03em;
+        text-transform: lowercase;
+      }
+
+      .product-link__sub {
+        color: var(--muted);
+        font-size: 0.76rem;
+        letter-spacing: 0.16em;
+        text-transform: uppercase;
+      }
+
+      .all-route {
+        display: grid;
+        gap: 24px;
+        padding-top: 12px;
+      }
+
+      .all-route[hidden] {
+        display: none;
+      }
+
+      .all-route__head {
+        display: flex;
+        align-items: flex-end;
+        justify-content: space-between;
+        gap: 18px;
+        flex-wrap: wrap;
+      }
+
+      .all-route__intro {
+        display: grid;
+        gap: 10px;
+        max-width: 760px;
+      }
+
+      .all-route__eyebrow {
+        color: var(--muted);
+        font-size: 0.8rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .all-route__title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: clamp(2.3rem, 4vw, 4.2rem);
+        line-height: 0.94;
+        letter-spacing: -0.04em;
+      }
+
+      .all-route__lede {
+        margin: 0;
+        color: var(--muted-strong);
+        font-size: 1rem;
+        line-height: 1.65;
+      }
+
+      .all-route__meta {
+        color: var(--muted);
+        font-size: 0.9rem;
+        letter-spacing: 0.04em;
+      }
+
+      .all-route__meta strong {
+        color: var(--text);
+      }
+
+      .all-grid {
+        position: relative;
+        column-count: 4;
+        column-gap: 16px;
+      }
+
+      .all-grid--packed {
+        column-count: unset;
+        column-gap: 0;
+      }
+
+      .all-route__blocked {
+        display: grid;
+        gap: 10px;
+        margin-top: 18px;
+        padding: 16px 18px 18px;
+        border-radius: 22px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(255, 255, 255, 0.03);
+      }
+
+      .all-route__blocked[hidden] {
+        display: none;
+      }
+
+      .all-route__blocked-title {
+        margin: 0;
+        color: var(--muted-strong);
+        font-size: 0.88rem;
+        letter-spacing: 0.06em;
+        text-transform: uppercase;
+      }
+
+      .all-route__blocked-list {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .all-route__blocked-chip {
+        display: inline-flex;
+        align-items: center;
+        min-height: 30px;
+        padding: 6px 10px;
+        border-radius: 999px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(7, 13, 23, 0.82);
+        color: var(--muted-strong);
+        font-size: 0.82rem;
+        line-height: 1.15;
+        white-space: nowrap;
+        transition: border-color 180ms ease, color 180ms ease, transform 180ms ease;
+      }
+
+      .all-route__blocked-chip:hover,
+      .all-route__blocked-chip:focus-visible {
+        color: var(--text);
+        border-color: rgba(136, 215, 255, 0.22);
+        transform: translateY(-1px);
+        outline: none;
+      }
+
+      .top-route {
+        display: grid;
+        gap: 20px;
+        padding-top: 12px;
+      }
+
+      .top-route[hidden] {
+        display: none;
+      }
+
+      .top-route__head {
+        display: flex;
+        align-items: flex-end;
+        justify-content: space-between;
+        gap: 18px;
+        flex-wrap: wrap;
+      }
+
+      .top-route__intro {
+        display: grid;
+        gap: 10px;
+        max-width: 760px;
+      }
+
+      .top-route__eyebrow {
+        color: var(--muted);
+        font-size: 0.8rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .top-route__title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: clamp(2.1rem, 3.8vw, 4rem);
+        line-height: 0.94;
+        letter-spacing: -0.04em;
+      }
+
+      .top-route__lede {
+        margin: 0;
+        color: var(--muted-strong);
+        font-size: 1rem;
+        line-height: 1.65;
+      }
+
+      .top-route__meta {
+        color: var(--muted);
+        font-size: 0.9rem;
+        letter-spacing: 0.04em;
+      }
+
+      .top-route__meta strong {
+        color: var(--text);
+      }
+
+      .top-route__table-wrap {
+        overflow-x: auto;
+        border-radius: 24px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(7, 13, 23, 0.72);
+        box-shadow: 0 22px 54px rgba(0, 0, 0, 0.24);
+      }
+
+      .top-route__table {
+        width: 100%;
+        min-width: 1040px;
+        border-collapse: collapse;
+      }
+
+      .top-route__table thead th {
+        position: sticky;
+        top: 0;
+        z-index: 1;
+        padding: 14px 14px;
+        background: rgba(7, 13, 23, 0.94);
+        color: var(--muted);
+        font-size: 0.78rem;
+        letter-spacing: 0.1em;
+        text-transform: uppercase;
+        text-align: left;
+        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
+      }
+
+      .top-route__table tbody td {
+        padding: 12px 14px;
+        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
+        vertical-align: top;
+        font-size: 0.92rem;
+      }
+
+      .top-route__table tbody tr:last-child td {
+        border-bottom: 0;
+      }
+
+      .top-route__rank {
+        color: var(--muted);
+        white-space: nowrap;
+      }
+
+      .top-route__model-link {
+        color: var(--text);
+        font-weight: 600;
+        text-decoration: none;
+      }
+
+      .top-route__model-link:hover,
+      .top-route__model-link:focus-visible {
+        color: var(--sky);
+        outline: none;
+      }
+
+      .top-route__downloads,
+      .top-route__likes {
+        white-space: nowrap;
+      }
+
+      .top-route__pipeline {
+        color: var(--muted-strong);
+        font-size: 0.86rem;
+      }
+
+      .top-route__status-badge {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        min-width: 108px;
+        min-height: 30px;
+        padding: 6px 10px;
+        border-radius: 999px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        font-size: 0.78rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+        white-space: nowrap;
+      }
+
+      .top-route__status-badge--cached {
+        background: rgba(156, 255, 99, 0.16);
+        border-color: rgba(156, 255, 99, 0.34);
+        color: #baff8f;
+      }
+
+      .top-route__status-badge--gated {
+        background: rgba(255, 214, 93, 0.18);
+        border-color: rgba(255, 214, 93, 0.34);
+        color: #ffe28c;
+      }
+
+      .top-route__status-badge--trust_remote_code {
+        background: rgba(255, 166, 82, 0.18);
+        border-color: rgba(255, 166, 82, 0.34);
+        color: #ffbf7d;
+      }
+
+      .top-route__status-badge--error {
+        background: rgba(255, 111, 145, 0.16);
+        border-color: rgba(255, 111, 145, 0.34);
+        color: #ff9db4;
+      }
+
+      .top-route__status-badge--unchecked {
+        background: rgba(141, 156, 182, 0.14);
+        border-color: rgba(141, 156, 182, 0.26);
+        color: #b9c5d8;
+      }
+
+      .top-route__reason {
+        max-width: 44ch;
+        color: var(--muted-strong);
+        font-size: 0.84rem;
+        line-height: 1.45;
+        word-break: break-word;
+      }
+
+      .top-route__reason--empty {
+        color: rgba(145, 160, 186, 0.72);
+      }
+
+      .top-route__links {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        white-space: nowrap;
+      }
+
+      .top-route__icon-link {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: 34px;
+        height: 34px;
+        border-radius: 12px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(255, 255, 255, 0.03);
+        color: var(--muted-strong);
+        transition: transform 180ms ease, border-color 180ms ease, color 180ms ease;
+      }
+
+      .top-route__icon-link:hover,
+      .top-route__icon-link:focus-visible {
+        transform: translateY(-1px);
+        border-color: rgba(136, 215, 255, 0.26);
+        color: var(--text);
+        outline: none;
+      }
+
+      .top-route__icon-link svg {
+        width: 18px;
+        height: 18px;
+      }
+
+      .release-blog {
+        display: grid;
+        gap: 28px;
+        min-width: 0;
+        padding-top: 12px;
+        -webkit-text-size-adjust: 100%;
+        text-size-adjust: 100%;
+      }
+
+      .release-blog[hidden] {
+        display: none;
+      }
+
+      .release-blog__head {
+        display: grid;
+        gap: 22px;
+        min-width: 0;
+      }
+
+      .release-blog__hero {
+        display: grid;
+        gap: 18px;
+        min-width: 0;
+        padding: 28px;
+        border-radius: 30px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background:
+          radial-gradient(circle at top left, rgba(136, 215, 255, 0.12), transparent 36%),
+          linear-gradient(180deg, rgba(13, 21, 36, 0.94), rgba(7, 13, 23, 0.92));
+        box-shadow: 0 26px 64px rgba(0, 0, 0, 0.28);
+      }
+
+      .release-blog__eyebrow {
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        color: var(--muted);
+        font-size: 0.8rem;
+        letter-spacing: 0.16em;
+        text-transform: uppercase;
+      }
+
+      .release-blog__eyebrow::before {
+        content: "";
+        width: 44px;
+        height: 1px;
+        background: rgba(136, 215, 255, 0.42);
+      }
+
+      .release-blog__title {
+        margin: 0;
+        max-width: 14ch;
+        font-family: "Space Grotesk", sans-serif;
+        font-size: clamp(2.8rem, 6vw, 5.6rem);
+        line-height: 0.94;
+        letter-spacing: -0.05em;
+        overflow-wrap: anywhere;
+      }
+
+      .release-blog__lede {
+        margin: 0;
+        max-width: 72ch;
+        color: var(--muted-strong);
+        font-size: 1.04rem;
+        line-height: 1.72;
+        overflow-wrap: anywhere;
+      }
+
+      .release-blog__cta-row {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 12px;
+      }
+
+      .release-blog__summary-grid {
+        display: grid;
+        grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.85fr);
+        gap: 18px;
+        min-width: 0;
+      }
+
+      .release-blog__summary-card,
+      .release-blog__quote {
+        display: grid;
+        gap: 12px;
+        padding: 20px 22px;
+        border-radius: 24px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(255, 255, 255, 0.04);
+      }
+
+      .release-blog__summary-label,
+      .release-blog__quote-label {
+        color: var(--muted);
+        font-size: 0.76rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .release-blog__summary-text,
+      .release-blog__quote-text {
+        margin: 0;
+        color: var(--text);
+        font-size: 1rem;
+        line-height: 1.68;
+      }
+
+      .release-blog__quote-text {
+        font-family: "Space Grotesk", sans-serif;
+        font-size: 1.22rem;
+        line-height: 1.28;
+        letter-spacing: -0.03em;
+      }
+
+      .release-blog__body {
+        display: grid;
+        gap: 22px;
+        min-width: 0;
+      }
+
+      .release-blog__section {
+        display: grid;
+        gap: 16px;
+        min-width: 0;
+        padding: 26px 28px;
+        border-radius: 28px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(7, 13, 23, 0.72);
+        box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22);
+      }
+
+      .release-blog__section-title {
+        margin: 0;
+        font-family: "Space Grotesk", sans-serif;
+        font-size: clamp(1.5rem, 3vw, 2.2rem);
+        line-height: 1.02;
+        letter-spacing: -0.04em;
+      }
+
+      .release-blog__section p {
+        margin: 0;
+        color: var(--muted-strong);
+        font-size: 0.98rem;
+        line-height: 1.72;
+        overflow-wrap: anywhere;
+      }
+
+      .release-blog__section strong {
+        color: var(--text);
+      }
+
+      .release-blog__section a {
+        color: var(--sky);
+        text-decoration: underline;
+        text-decoration-thickness: 1px;
+        text-underline-offset: 0.16em;
+        overflow-wrap: anywhere;
+        word-break: break-word;
+      }
+
+      .release-blog__section a:hover,
+      .release-blog__section a:focus-visible {
+        color: #b6ebff;
+        outline: none;
+      }
+
+      .release-blog__feature-grid {
+        display: grid;
+        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+        gap: 14px;
+        min-width: 0;
+      }
+
+      .release-blog__feature-card {
+        display: grid;
+        gap: 10px;
+        min-width: 0;
+        padding: 18px;
+        border-radius: 22px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(255, 255, 255, 0.03);
+      }
+
+      .release-blog__feature-title {
+        margin: 0;
+        font-family: "Space Grotesk", sans-serif;
+        font-size: 1.12rem;
+        line-height: 1.08;
+        letter-spacing: -0.03em;
+        overflow-wrap: anywhere;
+      }
+
+      .release-blog__feature-copy {
+        margin: 0;
+        color: var(--muted-strong);
+        font-size: 0.92rem;
+        line-height: 1.6;
+        overflow-wrap: anywhere;
+      }
+
+      .release-blog__media {
+        display: grid;
+        gap: 14px;
+        min-width: 0;
+        padding: 18px;
+        border-radius: 24px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background:
+          radial-gradient(circle at top, rgba(136, 215, 255, 0.09), transparent 52%),
+          rgba(255, 255, 255, 0.025);
+      }
+
+      .release-blog__media-frame {
+        overflow: hidden;
+        min-width: 0;
+        border-radius: 20px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgb(15, 26, 32);
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
+      }
+
+      .release-blog__media-frame--focus-crop {
+        width: min(100%, 420px);
+        margin: 0 auto;
+      }
+
+      .release-blog__media-video {
+        display: block;
+        width: 100%;
+        height: auto;
+      }
+
+      .release-blog__media-caption {
+        margin: 0;
+        color: var(--muted);
+        font-size: 0.9rem;
+        line-height: 1.58;
+        overflow-wrap: anywhere;
+      }
+
+      .release-blog__media-caption--focus-crop {
+        max-width: 420px;
+        margin: 0 auto;
+      }
+
+      .release-blog__list {
+        margin: 0;
+        padding-left: 1.1rem;
+        color: var(--muted-strong);
+        display: grid;
+        gap: 10px;
+        min-width: 0;
+      }
+
+      .release-blog__list li {
+        line-height: 1.62;
+        overflow-wrap: anywhere;
+      }
+
+      .release-blog__footer {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        justify-content: space-between;
+        gap: 12px;
+        color: var(--muted);
+        font-size: 0.88rem;
+      }
+
+      @media (max-width: 860px) {
+        .release-blog__hero,
+        .release-blog__section {
+          padding: 22px 20px;
+          border-radius: 24px;
+        }
+
+        .release-blog__summary-grid {
+          grid-template-columns: 1fr;
+        }
+
+        .release-blog__quote-text {
+          font-size: 1.1rem;
+        }
+      }
+
+      .viewer-route {
+        display: grid;
+        gap: 22px;
+        padding-top: 12px;
+      }
+
+      .viewer-route[hidden] {
+        display: none;
+      }
+
+      .viewer-route__head {
+        position: relative;
+        display: flex;
+        /* The pill row must sit vertically CENTERED on the title text row, not
+           bottom-aligned to the whole two-row intro (eyebrow + title). With
+           flex-end the shorter pill row hugged the title's bottom and read as
+           "sitting low"; center + the desktop margin-top nudge below (equal to
+           the eyebrow region above the title) lands the pill centers on the
+           title center regardless of the title font size. */
+        align-items: center;
+        justify-content: space-between;
+        gap: 18px;
+        flex-wrap: wrap;
+      }
+
+      .viewer-route__intro {
+        flex: 1 1 560px;
+        min-width: 0;
+      }
+
+      .viewer-route__intro-top {
+        display: flex;
+        align-items: center;
+        justify-content: flex-start;
+        gap: 12px;
+        min-width: 0;
+        padding-right: min(42vw, 280px);
+      }
+
+      .viewer-route__intro-links {
+        display: inline-flex;
+        align-items: center;
+        justify-content: flex-end;
+        gap: 14px;
+        min-width: 0;
+      }
+
+      @media (min-width: 861px) {
+        .viewer-route__intro-links {
+          position: absolute;
+          top: -0px;
+          right: 0;
+        }
+        /* Center-align (above) puts the pills on the intro block's midline,
+           which sits half the eyebrow row above the title midline. This
+           margin-top (eyebrow line-height) shifts the pills' centering box down
+           by exactly the eyebrow region so they center on the title text row.
+           Desktop-only: on phones the pills wrap onto their own line and must
+           not gain this offset. */
+        .viewer-route__actions {
+          margin-top: 15px;
+        }
+      }
+
+      @media (max-width: 860px) {
+        .viewer-route__intro-top {
+          padding-right: 0;
+          margin-bottom: 10px;
+        }
+        /* bookmark sits before the embed button on phones */
+        .viewer-route__actions #viewer-bookmark-btn {
+          order: 1;
+        }
+        .viewer-route__actions #viewer-model-card-btn {
+          order: 2;
+        }
+        /* With the watch pill folded into the title chip, keep Embed aligned
+           with the other compact mobile actions instead of letting its label
+           protrude beyond the icon row. */
+        .viewer-route__head.has-title-watch .viewer-route__actions #viewer-model-card-btn {
+          width: 44px !important;
+          min-width: 44px !important;
+          height: 44px;
+          padding: 0 !important;
+          gap: 0 !important;
+          justify-content: center;
+        }
+        .viewer-route__head.has-title-watch
+          .viewer-route__actions
+          #viewer-model-card-btn
+          .pill__label--full,
+        .viewer-route__head.has-title-watch
+          .viewer-route__actions
+          #viewer-model-card-btn
+          .pill__label--short {
+          display: none !important;
+        }
+      }
+
+      .viewer-route__title-row {
+        display: flex;
+        align-items: flex-end;
+        gap: 18px;
+        min-width: 0;
+        flex-wrap: wrap;
+      }
+
+      .viewer-route__eyebrow {
+        display: inline-flex;
+        align-items: center;
+        flex: 0 0 auto;
+        gap: 10px;
+        color: var(--muted);
+        font-size: 0.8rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+        white-space: nowrap;
+      }
+
+      .viewer-route__blog-link {
+        display: none;
+        align-items: center;
+        justify-content: center;
+        gap: 6px;
+        padding: 0;
+        border: 0;
+        background: transparent;
+        color: var(--muted);
+        font: inherit;
+        font-size: 0.8rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+        cursor: pointer;
+        white-space: nowrap;
+      }
+
+      .viewer-route__report-issue {
+        display: none;
+        align-items: center;
+        justify-content: center;
+        gap: 7px;
+        padding: 0;
+        border: 0;
+        background: transparent;
+        color: rgba(159, 173, 197, 0.78);
+        font: inherit;
+        font-size: 0.8rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+        cursor: pointer;
+        white-space: nowrap;
+        transition:
+          color 160ms ease,
+          opacity 160ms ease,
+          transform 160ms ease;
+      }
+
+      .viewer-route__report-issue.is-enabled {
+        display: inline-flex;
+      }
+
+      .viewer-route__report-issue[hidden] {
+        display: none;
+      }
+
+      .viewer-route__report-issue-icon {
+        display: inline-flex;
+        width: 15px;
+        height: 15px;
+        opacity: 0.76;
+      }
+
+      .viewer-route__report-issue-icon svg {
+        display: block;
+        width: 100%;
+        height: 100%;
+      }
+
+      .viewer-route__report-issue:hover,
+      .viewer-route__report-issue:focus-visible {
+        color: var(--text);
+        opacity: 1;
+      }
+
+      .viewer-route__report-issue:active {
+        transform: translateY(1px);
+      }
+
+      .viewer-route__blog-link:hover,
+      .viewer-route__blog-link:focus-visible {
+        color: var(--text);
+      }
+
+      .viewer-route__eyebrow::before {
+        content: "";
+        flex: 0 0 8px;
+        width: 8px;
+        min-width: 8px;
+        height: 8px;
+        min-height: 8px;
+        aspect-ratio: 1 / 1;
+        border-radius: 999px;
+        background: var(--sky);
+        box-shadow: 0 0 0 8px rgba(136, 215, 255, 0.08);
+      }
+
+      .viewer-route__title {
+        --viewer-route-title-max-height: clamp(54px, 8vh, 76px);
+        --viewer-route-title-min-font-size: 16px;
+        margin: 10px 0 10px;
+        font-family: "Space Grotesk", sans-serif;
+        font-size: var(--viewer-route-title-fit-size, clamp(2.8rem, 5vw, 4.8rem));
+        line-height: var(--viewer-route-title-fit-line-height, 0.65);
+        letter-spacing: -0.05em;
+        max-width: none;
+        max-height: var(--viewer-route-title-max-height);
+        width: 100%;
+        min-width: 0;
+        overflow: visible;
+        overflow-wrap: anywhere;
+        word-break: normal;
+      }
+
+      .viewer-route__title-row .viewer-route__title {
+        flex: 1 1 auto;
+        width: auto;
+        max-width: 100%;
+      }
+
+      .viewer-route__title-text {
+        display: inline;
+        min-width: 0;
+      }
+
+      /* The org segment doubles as the watch control, drawn on the prefix span
+         itself so title typography and baseline stay consistent on all viewports. */
+      .viewer-route__title-prefix--watch {
+        white-space: nowrap;
+        /* shallow enough that a wrapped title line below never kisses the chip */
+        padding: 0.02em 0.2em 0.04em 0.2em;
+        border: 1px solid rgba(255, 255, 255, 0.22);
+        border-radius: 0.42em;
+        background: rgba(255, 255, 255, 0.05);
+        margin-right: 0.07em;
+        cursor: pointer;
+        -webkit-tap-highlight-color: transparent;
+        transition:
+          border-color 0.15s ease,
+          background 0.15s ease,
+          box-shadow 0.15s ease;
+      }
+      /* Applied by syncViewerTitleOrgWatch only when the chip's box would
+         collide with the eyebrow above (short names -> huge title font):
+         a line-height:1 inline-block trims the em-box's ascent/descent slack,
+         which is what actually overlaps - the padding is already ~0. */
+      .viewer-route__title-prefix--watch.is-compact-v {
+        display: inline-block;
+        line-height: 1;
+        padding-top: 0;
+        padding-bottom: 0.015em;
+        vertical-align: baseline;
+      }
+      .viewer-route__title-prefix--watch::before {
+        content: "";
+        display: inline-block;
+        width: 0.58em;
+        height: 0.58em;
+        margin-right: 0.2em;
+        background-color: rgba(197, 208, 227, 0.92);
+        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M320 64C302.3 64 288 78.3 288 96L288 99.2C215 114 160 178.6 160 256L160 277.7C160 325.8 143.6 372.5 113.6 410.1L103.8 422.3C98.7 428.6 96 436.4 96 444.5C96 464.1 111.9 480 131.5 480L508.4 480C528 480 543.9 464.1 543.9 444.5C543.9 436.4 541.2 428.6 536.1 422.3L526.3 410.1C496.4 372.5 480 325.8 480 277.7L480 256C480 178.6 425 114 352 99.2L352 96C352 78.3 337.7 64 320 64zM258 528C265.1 555.6 290.2 576 320 576C349.8 576 374.9 555.6 382 528L258 528z'/%3E%3C/svg%3E") center / contain no-repeat;
+        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M320 64C302.3 64 288 78.3 288 96L288 99.2C215 114 160 178.6 160 256L160 277.7C160 325.8 143.6 372.5 113.6 410.1L103.8 422.3C98.7 428.6 96 436.4 96 444.5C96 464.1 111.9 480 131.5 480L508.4 480C528 480 543.9 464.1 543.9 444.5C543.9 436.4 541.2 428.6 536.1 422.3L526.3 410.1C496.4 372.5 480 325.8 480 277.7L480 256C480 178.6 425 114 352 99.2L352 96C352 78.3 337.7 64 320 64zM258 528C265.1 555.6 290.2 576 320 576C349.8 576 374.9 555.6 382 528L258 528z'/%3E%3C/svg%3E") center / contain no-repeat;
+      }
+      .viewer-route__title-prefix--watch:hover,
+      .viewer-route__title-prefix--watch:focus-visible {
+        border-color: rgba(255, 255, 255, 0.34);
+        background: rgba(255, 255, 255, 0.09);
+      }
+      .viewer-route__title-prefix--watch:focus-visible {
+        outline: none;
+        box-shadow: 0 0 0 0.08em rgba(156, 255, 99, 0.25);
+      }
+      .viewer-route__title-prefix--watch.is-watching {
+        border-color: rgba(156, 255, 99, 0.5);
+        background: rgba(156, 255, 99, 0.08);
+        /* org text joins the bell + roundrect in lime so the watching state
+           reads as one unified chip */
+        color: var(--lime, #9cff63);
+      }
+      .viewer-route__title-prefix--watch.is-watching::before {
+        background-color: var(--lime, #9cff63);
+      }
+      .viewer-route__title-prefix--watch.is-watching:hover,
+      .viewer-route__title-prefix--watch.is-watching:focus-visible {
+        border-color: rgba(156, 255, 99, 0.72);
+        background: rgba(156, 255, 99, 0.13);
+      }
+      /* the org chip replaces the actions-row watch pill */
+      .viewer-route__head.has-title-watch .viewer-watch-button {
+        display: none !important;
+      }
+
+      .viewer-route__title-prefix {
+        color: #8d9cb6;
+      }
+
+      .viewer-route__mobile-selection-prefix {
+        color: #8d9cb6;
+      }
+
+      .viewer-route__actions {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 12px;
+        flex: 0 0 auto;
+        /* mobile shrink-to-fit uses the row's max-content width: without a
+           cap the 456px pill row expands the layout viewport to 482px on a
+           390px phone and everything renders ~19% too small */
+        max-width: calc(100vw - 16px);
+      }
+
+      .viewer-route__blog-pill {
+        display: none;
+      }
+
+      .viewer-route__blog-pill::before {
+        content: none;
+      }
+
+      .viewer-blog-float {
+        position: fixed;
+        left: var(--viewer-blog-float-left, 50%);
+        bottom: calc(var(--viewer-blog-float-bottom, 16px) + env(safe-area-inset-bottom, 0px));
+        right: auto;
+        z-index: 48;
+        display: none;
+        align-items: center;
+        min-height: 52px;
+        padding: 0;
+        border-radius: 999px;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        background: rgba(9, 15, 25, 0.92);
+        box-shadow:
+          0 18px 44px rgba(0, 0, 0, 0.34),
+          inset 0 1px 0 rgba(255, 255, 255, 0.06);
+        backdrop-filter: blur(18px);
+        transform: translate(-50%, 12px);
+        opacity: 0;
+        pointer-events: none;
+        transition: opacity 180ms ease, transform 180ms ease;
+      }
+
+      .page.route-viewer-family .viewer-blog-float,
+
+      body.route-viewer.route-viewer-article .page.route-viewer .viewer-blog-float {
+
+        display: inline-flex;
+        bottom: calc(
+          var(--viewer-blog-float-bottom, 16px) +
+          env(safe-area-inset-bottom, 0px) +
+          var(--viewer-blog-float-visual-offset, 0px)
+        );
+        width: auto;
+        max-width: min(
+          calc(var(--viewer-blog-float-visual-width, 100vw) - 40px),
+          calc(100vw - 40px)
+        );
+        transform: translate(-50%, 12px);
+      }
+
+      .viewer-blog-float[hidden] {
+        display: none !important;
+      }
+
+      .viewer-blog-float.is-visible {
+        opacity: 1;
+        transform: translate(-50%, 0);
+        pointer-events: auto;
+      }
+
+      .viewer-blog-float.is-dismissing {
+        opacity: 0;
+        transform: translate(-50%, 12px);
+        pointer-events: none;
+      }
+
+      .viewer-blog-float__cta,
+      .viewer-blog-float__dismiss {
+        border: 0;
+        background: transparent;
+        color: var(--text);
+        font: inherit;
+        cursor: pointer;
+      }
+
+      .viewer-blog-float__cta {
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        min-height: 52px;
+        padding: 0 18px 0 20px;
+        font-family: "Space Grotesk", sans-serif;
+        font-size: 0.84rem;
+        font-weight: 700;
+        letter-spacing: 0.16em;
+        text-transform: uppercase;
+        white-space: nowrap;
+      }
+
+      .viewer-blog-float__cta::before {
+        content: "";
+        width: 8px;
+        height: 8px;
+        border-radius: 999px;
+        background: var(--sky);
+        box-shadow: 0 0 0 7px rgba(136, 215, 255, 0.08);
+      }
+
+      .viewer-blog-float__dismiss {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: 46px;
+        min-height: 52px;
+        padding: 0;
+        border-left: 1px solid rgba(255, 255, 255, 0.08);
+        color: rgba(225, 236, 249, 0.84);
+        font-size: 1rem;
+        font-weight: 700;
+        line-height: 1;
+      }
+
+      .viewer-blog-float__cta:hover,
+      .viewer-blog-float__cta:focus-visible,
+      .viewer-blog-float__dismiss:hover,
+      .viewer-blog-float__dismiss:focus-visible {
+        color: #ffffff;
+        outline: none;
+      }
+
+      .viewer-route__mobile-selection {
+        display: none;
+      }
+
+      .viewer-route__mobile-backlink {
+        display: none;
+      }
+
+      .viewer-route__mobile-backlink-state {
+        position: absolute;
+        inset: 0;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: flex-end;
+        gap: 6px;
+        opacity: 0;
+        pointer-events: none;
+        transform: translateY(6px);
+        text-align: right;
+        transition: opacity 180ms ease, transform 180ms ease;
+      }
+
+      .viewer-route__mobile-backlink-label {
+        color: var(--muted);
+        font-size: 0.72rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .viewer-route__mobile-backlink-text {
+        font-family: "Space Grotesk", sans-serif;
+        font-size: clamp(1.02rem, 4.2vw, 1.26rem);
+        line-height: 1.04;
+        letter-spacing: -0.03em;
+        color: var(--text);
+      }
+
+      .viewer-route__mobile-backlink-state--back {
+        inset: auto 0 auto 0;
+        top: calc(56px - 0.52lh);
+        height: 1.04lh;
+        flex-direction: row;
+        justify-content: flex-end;
+        align-items: center;
+        gap: 0;
+        padding-right: 12px;
+      }
+
+      .viewer-route__mobile-backlink-name {
+        min-width: 0;
+        font-family: "Space Grotesk", sans-serif;
+        font-size: clamp(1.02rem, 4.2vw, 1.26rem);
+        line-height: 1.04;
+        letter-spacing: -0.03em;
+        color: var(--text);
+        white-space: normal;
+        overflow: visible;
+        text-overflow: clip;
+        overflow-wrap: anywhere;
+        word-break: normal;
+      }
+
+      .viewer-route__mobile-selection-name-row {
+        display: flex;
+        align-items: center;
+        gap: 0.35em;
+        max-width: 100%;
+        min-width: 0;
+      }
+
+      .viewer-route__mobile-selection-name {
+        min-width: 0;
+      }
+
+      .viewer-route__mobile-selection-copy {
+        border: none;
+        background: none;
+        padding: 0.1em;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        flex: 0 0 auto;
+        color: #aeb8d3;
+        cursor: pointer;
+        border-radius: 6px;
+        position: relative;
+        transition:
+          background 160ms ease,
+          color 160ms ease;
+      }
+
+      .viewer-route__mobile-selection-copy[hidden] {
+        display: none;
+      }
+
+      .viewer-route__mobile-selection-copy:hover,
+      .viewer-route__mobile-selection-copy:focus-visible {
+        background: rgba(255, 255, 255, 0.08);
+        color: #ffffff;
+      }
+
+      .viewer-route__mobile-selection-copy:disabled {
+        cursor: default;
+        opacity: 0.68;
+      }
+
+      .viewer-route__mobile-selection-copy svg {
+        width: 1em;
+        height: 1em;
+        display: block;
+        fill: currentColor;
+      }
+
+      .viewer-route__mobile-selection-expand {
+        margin-left: auto;
+        border: 1px solid rgba(171, 189, 220, 0.22);
+        background: rgba(255, 255, 255, 0.045);
+        color: rgba(214, 228, 255, 0.88);
+        padding: 0.42rem 0.74rem;
+        border-radius: 999px;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        flex: 0 0 auto;
+        font-size: 0.65rem;
+        line-height: 1;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+        cursor: pointer;
+        transition:
+          background 160ms ease,
+          border-color 160ms ease,
+          color 160ms ease,
+          opacity 160ms ease;
+      }
+
+      .viewer-route__mobile-selection-expand[hidden] {
+        display: none;
+      }
+
+      .viewer-route__mobile-selection-glossary {
+        margin-top: 6px;
+      }
+
+      .viewer-route__mobile-selection-glossary[hidden] {
+        display: none !important;
+      }
+
+      .viewer-route__mobile-selection-glossary-toggle {
+        display: flex;
+        align-items: baseline;
+        gap: 6px;
+        width: 100%;
+        background: none;
+        border: none;
+        padding: 0;
+        cursor: pointer;
+        text-align: left;
+        color: var(--muted-strong, #c5d0e3);
+        font: 12px/1.45 "Inter", sans-serif;
+      }
+
+      .viewer-route__mobile-selection-glossary-toggle strong {
+        color: var(--text, #f5f8ff);
+      }
+
+      #viewer-mobile-selection-glossary-short {
+        overflow: hidden;
+        display: -webkit-box;
+        -webkit-line-clamp: 2;
+        -webkit-box-orient: vertical;
+        min-width: 0;
+        flex: 1 1 auto;
+      }
+
+      .viewer-route__mobile-selection-glossary.is-expanded #viewer-mobile-selection-glossary-short {
+        display: none;
+      }
+
+      .viewer-route__mobile-selection-glossary-chevron {
+        flex: 0 0 auto;
+        align-self: center;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: 26px;
+        height: 26px;
+        border-radius: 9px;
+        background: rgba(255, 255, 255, 0.08);
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        color: var(--muted-strong, #c5d0e3);
+        font-size: 15px;
+        line-height: 1;
+        transition: transform 0.15s ease;
+      }
+
+      .viewer-route__mobile-selection-glossary.is-expanded .viewer-route__mobile-selection-glossary-chevron {
+        transform: rotate(180deg);
+      }
+
+      .viewer-route__mobile-selection-glossary-detail {
+        margin-top: 4px;
+      }
+
+      .viewer-route__mobile-selection-glossary-detail[hidden] {
+        display: none !important;
+      }
+
+      .viewer-route__mobile-selection-glossary-line {
+        margin: 0 0 4px;
+        font-size: 12px;
+        line-height: 1.5;
+        color: var(--lime, #9cff63);
+      }
+
+      .viewer-route__mobile-selection-glossary-text {
+        margin: 0 0 6px;
+        font-size: 12px;
+        line-height: 1.55;
+        color: var(--muted-strong, #c5d0e3);
+      }
+
+      .viewer-route__mobile-selection-glossary-link {
+        font-size: 12px;
+        font-weight: 700;
+        color: var(--sky, #88d7ff);
+        text-decoration: none;
+      }
+
+      .viewer-route__mobile-selection-glossary-link:hover,
+      .viewer-route__mobile-selection-glossary-link:focus-visible {
+        text-decoration: underline;
+      }
+
+      .viewer-route__mobile-selection-expand:hover,
+      .viewer-route__mobile-selection-expand:focus-visible {
+        background: rgba(255, 255, 255, 0.085);
+        border-color: rgba(203, 220, 255, 0.34);
+        color: #ffffff;
+      }
+
+      .viewer-route__mobile-selection-expand:disabled {
+        cursor: default;
+        opacity: 0.62;
+      }
+
+      .viewer-route__copy-tooltip {
+        position: fixed;
+        background: #111422;
+        border: 1px solid #2f354a;
+        color: var(--base-content);
+        border-radius: 8px;
+        padding: 0.35rem 0.55rem;
+        font-size: 0.85rem;
+        line-height: 1.2;
+        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
+        pointer-events: none;
+        z-index: 4000;
+        white-space: nowrap;
+        opacity: 0;
+        transition: opacity 0.15s ease;
+      }
+
+      .viewer-route__copy-tooltip.is-visible {
+        opacity: 1;
+      }
+
+      .viewer-granularity {
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        min-width: 0;
+        padding: 8px 14px;
+        border-radius: 999px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(9, 15, 28, 0.58);
+        color: var(--muted-strong);
+      }
+
+      .viewer-granularity[hidden] {
+        display: none;
+      }
+
+      .viewer-granularity__label {
+        font-size: 0.75rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+        color: var(--muted);
+        white-space: nowrap;
+      }
+
+      .viewer-granularity__value {
+        min-width: 62px;
+        font-size: 0.78rem;
+        font-weight: 700;
+        letter-spacing: 0.06em;
+        text-transform: uppercase;
+        text-align: center;
+      }
+
+      .viewer-granularity__slider {
+        width: 92px;
+        appearance: none;
+        -webkit-appearance: none;
+        background: transparent;
+        cursor: ew-resize;
+      }
+
+      .viewer-granularity__slider::-webkit-slider-runnable-track {
+        height: 6px;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.04);
+        border: 1px solid var(--stroke);
+      }
+
+      .viewer-granularity__slider::-webkit-slider-thumb {
+        -webkit-appearance: none;
+        appearance: none;
+        width: 14px;
+        height: 14px;
+        margin-top: -5px;
+        border-radius: 999px;
+        border: 1px solid rgba(128, 204, 206, 0.45);
+        background: #80ccce;
+        box-shadow: 0 0 0 3px rgba(128, 204, 206, 0.12);
+      }
+
+      .viewer-granularity__slider::-moz-range-track {
+        height: 6px;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.04);
+        border: 1px solid var(--stroke);
+      }
+
+      .viewer-granularity__slider::-moz-range-thumb {
+        width: 14px;
+        height: 14px;
+        border-radius: 999px;
+        border: 1px solid rgba(128, 204, 206, 0.45);
+        background: #80ccce;
+        box-shadow: 0 0 0 3px rgba(128, 204, 206, 0.12);
+      }
+
+      .viewer-family-size {
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        min-width: 0;
+        padding: 8px 14px;
+        border-radius: 999px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(9, 15, 28, 0.58);
+        color: var(--muted-strong);
+      }
+
+      .viewer-family-size--desktop {
+        display: none;
+        align-self: center;
+        min-width: min(340px, 48vw);
+        padding: 12px 18px;
+        gap: 14px;
+      }
+
+      .viewer-family-size[hidden] {
+        display: none;
+      }
+
+      .viewer-family-size__label {
+        font-size: 0.75rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+        color: var(--muted);
+        white-space: nowrap;
+      }
+
+      .viewer-family-size__value {
+        min-width: 40px;
+        font-size: 0.78rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-align: center;
+        text-transform: uppercase;
+      }
+
+      .viewer-family-size__slider {
+        width: 124px;
+        appearance: none;
+        -webkit-appearance: none;
+        background: transparent;
+        cursor: ew-resize;
+      }
+
+      .viewer-family-size--desktop .viewer-family-size__slider {
+        width: min(248px, 28vw);
+      }
+
+      .viewer-family-size--desktop .viewer-family-size__label {
+        font-size: 0.8rem;
+        letter-spacing: 0.16em;
+      }
+
+      .viewer-family-size--desktop .viewer-family-size__value {
+        min-width: 118px;
+        font-size: 0.9rem;
+        letter-spacing: 0.12em;
+        text-align: right;
+      }
+
+      .viewer-family-size--desktop .viewer-family-size__slider::-webkit-slider-runnable-track {
+        height: 8px;
+      }
+
+      .viewer-family-size--desktop .viewer-family-size__slider::-webkit-slider-thumb {
+        width: 18px;
+        height: 18px;
+        margin-top: -6px;
+        box-shadow: 0 0 0 4px rgba(136, 215, 255, 0.12);
+      }
+
+      .viewer-family-size--desktop .viewer-family-size__slider::-moz-range-track {
+        height: 8px;
+      }
+
+      .viewer-family-size--desktop .viewer-family-size__slider::-moz-range-thumb {
+        width: 18px;
+        height: 18px;
+        box-shadow: 0 0 0 4px rgba(136, 215, 255, 0.12);
+      }
+
+      .viewer-family-size__slider::-webkit-slider-runnable-track {
+        height: 6px;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.04);
+        border: 1px solid var(--stroke);
+      }
+
+      .viewer-family-size__slider::-webkit-slider-thumb {
+        -webkit-appearance: none;
+        appearance: none;
+        width: 14px;
+        height: 14px;
+        margin-top: -5px;
+        border-radius: 999px;
+        border: 1px solid rgba(136, 215, 255, 0.42);
+        background: #88d7ff;
+        box-shadow: 0 0 0 3px rgba(136, 215, 255, 0.12);
+      }
+
+      .viewer-family-size__slider::-moz-range-track {
+        height: 6px;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.04);
+        border: 1px solid var(--stroke);
+      }
+
+      .viewer-family-size__slider::-moz-range-thumb {
+        width: 14px;
+        height: 14px;
+        border-radius: 999px;
+        border: 1px solid rgba(136, 215, 255, 0.42);
+        background: #88d7ff;
+        box-shadow: 0 0 0 3px rgba(136, 215, 255, 0.12);
+      }
+
+      .viewer-frame {
+        --graph-issue-panel-gap: 14px;
+        --graph-issue-panel-inset: 12px;
+        --graph-issue-panel-width: clamp(320px, 30vw, 394px);
+        position: relative;
+        display: flex;
+        flex-direction: column;
+        min-height: 0;
+        border-radius: 30px;
+        border: 1px solid rgba(255, 255, 255, 0.09);
+        background: var(--preview-surface);
+        box-shadow: var(--shadow);
+        overflow: hidden;
+      }
+
+      .viewer-frame::before {
+        content: "";
+        position: absolute;
+        inset: 0;
+        pointer-events: none;
+        background-image:
+          linear-gradient(rgba(255, 255, 255, 0.018) 1px, transparent 1px),
+          linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px);
+        background-size: 56px 56px;
+        mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.9), transparent 100%);
+      }
+
+      .viewer-frame__bar {
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: flex-start;
+        gap: 16px;
+        padding: 15px 18px;
+        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
+        background: linear-gradient(180deg, rgba(5, 9, 20, 0.38), rgba(5, 9, 20, 0.14));
+        backdrop-filter: blur(18px) saturate(1.08);
+      }
+
+      body.route-viewer.route-viewer-article .viewer-frame__bar {
+        display: none;
+      }
+
+      .viewer-frame__dots {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        flex: 0 0 auto;
+      }
+
+      .viewer-frame__dot {
+        appearance: none;
+        flex: 0 0 10px;
+        width: 10px;
+        min-width: 10px;
+        height: 10px;
+        min-height: 10px;
+        aspect-ratio: 1 / 1;
+        padding: 0;
+        border: 0;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.24);
+      }
+
+      .viewer-frame__dot--live {
+        background: rgba(156, 255, 99, 0.88);
+      }
+
+      .viewer-frame__dot--fullscreen {
+        position: relative;
+        display: inline-grid;
+        place-items: center;
+        flex: 0 0 30px;
+        width: 30px;
+        height: 30px;
+        margin: -10px -10px;
+        background: transparent;
+        cursor: pointer;
+        z-index: 3;
+      }
+
+      .viewer-frame__dot--fullscreen::before {
+        content: "";
+        width: 10px;
+        height: 10px;
+        border-radius: inherit;
+        background: rgba(156, 255, 99, 0.88);
+        transition: background 150ms ease, box-shadow 150ms ease, transform 150ms ease;
+      }
+
+      .viewer-frame__dot--fullscreen:hover,
+      .viewer-frame__dot--fullscreen:focus-visible {
+        outline: none;
+      }
+
+      .viewer-frame__dot--fullscreen:hover::before,
+      .viewer-frame__dot--fullscreen:focus-visible::before {
+        background: rgba(174, 255, 125, 0.98);
+        box-shadow: 0 0 0 7px rgba(156, 255, 99, 0.15);
+        transform: scale(1.08);
+      }
+
+      .viewer-frame__dot--laser {
+        position: relative;
+        display: inline-grid;
+        place-items: center;
+        flex: 0 0 30px;
+        width: 30px;
+        height: 30px;
+        margin: -10px -10px;
+        background: transparent;
+        cursor: pointer;
+        z-index: 2;
+      }
+
+      .viewer-frame__dot--laser::before {
+        content: "";
+        width: 10px;
+        height: 10px;
+        border-radius: inherit;
+        background: rgba(255, 255, 255, 0.24);
+        transition: background 150ms ease, box-shadow 150ms ease, transform 150ms ease;
+      }
+
+      .viewer-frame__dot--laser:hover,
+      .viewer-frame__dot--laser:focus-visible {
+        outline: none;
+      }
+
+      .viewer-frame__dot--laser:hover::before,
+      .viewer-frame__dot--laser:focus-visible::before,
+      .viewer-frame__dot--laser.viewer-frame__dot--laser-flash::before {
+        background: rgba(255, 56, 76, 0.98);
+        box-shadow: 0 0 0 7px rgba(255, 48, 64, 0.17), 0 0 20px rgba(255, 48, 64, 0.26);
+        transform: scale(1.08);
+      }
+
+      .viewer-frame__demo-title {
+        display: none;
+        align-items: baseline;
+        min-width: 0;
+        max-width: min(64vw, 740px);
+        color: rgba(245, 247, 251, 0.94);
+        font-family: "Space Grotesk", sans-serif;
+        font-size: clamp(1.12rem, 1.66vw, 1.5rem);
+        font-weight: 700;
+        line-height: 1;
+        letter-spacing: -0.045em;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+
+      body.route-viewer.hfviewer-demo-mode-title .viewer-frame__demo-title {
+        display: inline-flex;
+      }
+
+      .viewer-frame__demo-title-text {
+        display: block;
+        min-width: 0;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+
+      .viewer-frame__demo-title-prefix {
+        color: #8d9cb6;
+      }
+
+      .viewer-frame__tooltip {
+        position: fixed;
+        z-index: 2147483200;
+        display: inline-flex;
+        align-items: center;
+        gap: 0;
+        width: max-content;
+        max-width: calc(100vw - 24px);
+        padding: 0.5rem 0.68rem;
+        border: 1px solid rgba(136, 215, 255, 0.2);
+        border-radius: 12px;
+        background:
+          radial-gradient(circle at 18% 0%, rgba(156, 255, 99, 0.12), transparent 38%),
+          rgba(14, 18, 31, 0.94);
+        color: #f8fafc;
+        font-size: 0.85rem;
+        line-height: 1.2;
+        box-shadow:
+          0 16px 40px rgba(0, 0, 0, 0.4),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        opacity: 0;
+        pointer-events: none;
+        transform: translateY(4px);
+        transition: opacity 130ms ease, transform 130ms ease;
+        white-space: nowrap;
+      }
+
+      .viewer-frame__tooltip::after {
+        content: "";
+        position: absolute;
+        left: var(--viewer-frame-tooltip-arrow-left, 50%);
+        bottom: -6px;
+        width: 10px;
+        height: 10px;
+        border-right: 1px solid rgba(136, 215, 255, 0.18);
+        border-bottom: 1px solid rgba(136, 215, 255, 0.18);
+        /* solid composite of the tooltip bg: a translucent beak painted over
+           the translucent box showed as a dark diamond */
+        background: rgb(15, 19, 32);
+        /* outer half + a band past the diagonal so the beak covers the box
+           border underneath - open notch instead of a line across the beak */
+        clip-path: polygon(72% -2px, calc(100% + 2px) -2px, calc(100% + 2px) calc(100% + 2px), -2px calc(100% + 2px), -2px 72%);
+        transform: translateX(-50%) rotate(45deg);
+      }
+
+      .viewer-frame__tooltip--below::after {
+        top: -6px;
+        bottom: auto;
+        border: 0;
+        border-left: 1px solid rgba(136, 215, 255, 0.18);
+        border-top: 1px solid rgba(136, 215, 255, 0.18);
+        clip-path: polygon(-2px -2px, calc(100% + 2px) -2px, calc(100% + 2px) 28%, 28% calc(100% + 2px), -2px calc(100% + 2px));
+      }
+
+      .viewer-frame__tooltip.is-visible {
+        opacity: 1;
+        transform: translateY(0);
+      }
+
+      .viewer-frame__tooltip-key {
+        position: relative;
+        isolation: isolate;
+        display: inline-grid;
+        place-items: center;
+        width: 1.58em;
+        min-width: 1.58em;
+        height: 1.58em;
+        margin: -0.04em 0 0;
+        border: 1px solid rgba(255, 255, 255, 0.96);
+        border-bottom-color: rgba(148, 163, 184, 0.78);
+        border-radius: 0.45em;
+        background:
+          radial-gradient(circle at 50% 12%, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0) 48%),
+          linear-gradient(180deg, #f8fafc 0%, #dbe3ee 62%, #b4c0ce 100%);
+        box-shadow:
+          inset 0 0.08em 0 rgba(255, 255, 255, 0.95),
+          inset 0 -0.08em 0 rgba(15, 23, 42, 0.16),
+          0 0.15em 0 #7c8797,
+          0 0.19em 0.02em rgba(15, 23, 42, 0.7),
+          0 0.34em 0.72em rgba(0, 0, 0, 0.38);
+        color: #0f172a;
+        font-family: ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Consolas, monospace;
+        font-size: 0.78em;
+        font-weight: 900;
+        line-height: 1;
+        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.78);
+        text-transform: uppercase;
+        vertical-align: middle;
+      }
+
+      .viewer-frame__tooltip-key::before {
+        content: "";
+        position: absolute;
+        inset: 0.13em 0.14em 0.26em;
+        border-radius: 0.31em;
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.24) 54%, rgba(148, 163, 184, 0.1));
+        box-shadow:
+          inset 0 0.05em 0 rgba(255, 255, 255, 0.92),
+          inset 0 -0.05em 0 rgba(100, 116, 139, 0.12);
+        pointer-events: none;
+      }
+
+      .viewer-frame__tooltip-key span {
+        position: relative;
+        z-index: 1;
+      }
+
+      .viewer-frame:fullscreen {
+        width: 100vw;
+        height: 100vh;
+        border-radius: 0;
+        border: 0;
+      }
+
+      .viewer-frame:fullscreen .viewer-frame__canvas {
+        height: calc(100vh - 48px);
+        min-height: 0;
+      }
+
+      .viewer-frame:fullscreen .viewer-frame__iframe {
+        height: 100%;
+      }
+
+      .viewer-frame__status {
+        color: var(--muted-strong);
+        font-size: 0.84rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .viewer-frame__bar .viewer-granularity {
+        margin-left: auto;
+      }
+
+      /* Graph navigation history: back/forward pills immediately left of the
+         granularity slider. The nav group takes over the auto margin so the
+         pair (nav + granularity) stays right-aligned as one cluster. */
+      .viewer-nav-history {
+        display: inline-flex;
+        align-items: center;
+        gap: 6px;
+      }
+
+      .viewer-nav-history[hidden] {
+        display: none;
+      }
+
+      .viewer-frame__bar .viewer-nav-history {
+        margin-left: auto;
+      }
+
+      .viewer-frame__bar .viewer-nav-history:not([hidden]) + .viewer-granularity {
+        margin-left: 0;
+      }
+
+      .viewer-nav-history__btn {
+        appearance: none;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: 32px;
+        height: 32px;
+        padding: 0;
+        border-radius: 999px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(9, 15, 28, 0.58);
+        color: var(--muted-strong);
+        cursor: pointer;
+        transition: background 140ms ease, color 140ms ease, border-color 140ms ease;
+      }
+
+      .viewer-nav-history__btn svg {
+        width: 15px;
+        height: 15px;
+        display: block;
+      }
+
+      .viewer-nav-history__btn:hover,
+      .viewer-nav-history__btn:focus-visible {
+        background: rgba(19, 28, 48, 0.78);
+        border-color: rgba(128, 204, 206, 0.35);
+        color: var(--text);
+      }
+
+      .viewer-nav-history__btn:disabled,
+      .viewer-nav-history__btn[aria-disabled="true"] {
+        opacity: 0.32;
+        pointer-events: none;
+        cursor: default;
+      }
+
+      .viewer-frame__canvas {
+        position: relative;
+        min-height: min(76vh, 920px);
+        height: min(76vh, 920px);
+        overflow: hidden;
+        background: var(--preview-surface);
+        transition: margin-right 230ms ease;
+      }
+
+      .viewer-frame__static-preview {
+        position: absolute;
+        inset: 0;
+        z-index: 1;
+        display: grid;
+        place-items: center;
+        overflow: hidden;
+        pointer-events: none;
+        background:
+          radial-gradient(circle at 32% 24%, rgba(136, 215, 255, 0.16), transparent 36%),
+          radial-gradient(circle at 74% 70%, rgba(95, 243, 149, 0.11), transparent 34%),
+          var(--preview-surface);
+        opacity: 0;
+        transform: scale(1.015);
+        transition:
+          opacity 220ms ease,
+          transform 320ms cubic-bezier(0.2, 0.8, 0.2, 1);
+      }
+
+      .viewer-frame__static-preview[hidden] {
+        display: none;
+      }
+
+      .viewer-frame__static-preview.is-visible {
+        opacity: 1;
+        transform: scale(1);
+      }
+
+      .viewer-frame__static-preview-image {
+        display: block;
+        width: 100%;
+        height: 100%;
+        padding: clamp(18px, 4.5vw, 54px);
+        object-fit: contain;
+        filter: drop-shadow(0 28px 54px rgba(0, 0, 0, 0.34));
+      }
+
+      .viewer-frame__static-preview-badge {
+        position: absolute;
+        left: 50%;
+        bottom: clamp(18px, 4vw, 34px);
+        transform: translateX(-50%);
+        display: inline-flex;
+        align-items: center;
+        gap: 9px;
+        padding: 9px 13px;
+        border: 1px solid rgba(255, 255, 255, 0.14);
+        border-radius: 999px;
+        background: rgba(6, 11, 23, 0.7);
+        color: rgba(223, 233, 247, 0.9);
+        font-family: "Space Grotesk", sans-serif;
+        font-size: 0.72rem;
+        font-weight: 700;
+        letter-spacing: 0.12em;
+        text-transform: uppercase;
+        box-shadow:
+          0 14px 38px rgba(0, 0, 0, 0.32),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        backdrop-filter: blur(16px) saturate(1.08);
+      }
+
+      /* real download progress along the badge's bottom edge while the
+         viewer's boot assets stream in (--viewer-warmup-progress, set per
+         chunk received) */
+      .viewer-frame__static-preview-badge::after {
+        content: "";
+        position: absolute;
+        left: 13px;
+        right: 13px;
+        bottom: 3px;
+        height: 2px;
+        border-radius: 2px;
+        background: linear-gradient(90deg, #74f0a3, #88d7ff);
+        transform-origin: left center;
+        transform: scaleX(var(--viewer-warmup-progress, 0));
+        opacity: var(--viewer-warmup-bar-opacity, 0);
+        transition: transform 200ms ease, opacity 200ms ease;
+      }
+
+      .viewer-frame__static-preview-badge::before {
+        content: "";
+        flex: 0 0 7px;
+        width: 7px;
+        min-width: 7px;
+        height: 7px;
+        min-height: 7px;
+        aspect-ratio: 1 / 1;
+        border-radius: 999px;
+        background: #74f0a3;
+        box-shadow: 0 0 12px rgba(116, 240, 163, 0.72);
+      }
+
+      .graph-issue-panel {
+        position: absolute;
+        top: 62px;
+        right: var(--graph-issue-panel-inset);
+        bottom: 12px;
+        z-index: 8;
+        display: flex;
+        flex-direction: column;
+        width: min(var(--graph-issue-panel-width), calc(100% - 24px));
+        max-height: calc(100% - 74px);
+        border: 1px solid rgba(255, 255, 255, 0.11);
+        border-radius: 24px;
+        background:
+          linear-gradient(180deg, rgba(16, 24, 42, 0.9), rgba(8, 13, 25, 0.94)),
+          rgba(8, 13, 25, 0.9);
+        box-shadow: 0 30px 90px rgba(0, 0, 0, 0.44);
+        color: var(--text);
+        overflow: hidden;
+        transform: translateX(calc(100% + 20px));
+        opacity: 0;
+        pointer-events: none;
+        transition:
+          transform 230ms ease,
+          opacity 180ms ease;
+        backdrop-filter: blur(22px) saturate(1.08);
+      }
+
+      @media (min-width: 861px) {
+        .viewer-frame.viewer-frame--graph-issue-open .viewer-frame__canvas {
+          margin-right: calc(
+            min(var(--graph-issue-panel-width), calc(100% - 24px)) +
+            var(--graph-issue-panel-gap) +
+            var(--graph-issue-panel-inset)
+          );
+        }
+      }
+
+      .graph-issue-panel[hidden] {
+        display: none;
+      }
+
+      .graph-issue-panel.is-open {
+        transform: translateX(0);
+        opacity: 1;
+        pointer-events: auto;
+      }
+
+      .graph-issue-panel__header {
+        display: flex;
+        align-items: flex-start;
+        justify-content: space-between;
+        gap: 14px;
+        padding: 18px 18px 12px;
+        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
+      }
+
+      .graph-issue-panel__eyebrow {
+        margin: 0 0 6px;
+        color: var(--muted);
+        font-size: 0.72rem;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .graph-issue-panel__title {
+        margin: 0;
+        font-family: "Space Grotesk", sans-serif;
+        font-size: 1.1rem;
+        line-height: 1.1;
+        letter-spacing: -0.03em;
+      }
+
+      .graph-issue-panel__close {
+        display: inline-grid;
+        place-items: center;
+        width: 32px;
+        height: 32px;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.04);
+        color: var(--muted);
+        cursor: pointer;
+      }
+
+      .graph-issue-panel__close:hover,
+      .graph-issue-panel__close:focus-visible {
+        color: var(--text);
+        border-color: rgba(136, 215, 255, 0.38);
+      }
+
+      .graph-issue-panel__body {
+        display: grid;
+        gap: 14px;
+        padding: 16px 18px 18px;
+        overflow: auto;
+      }
+
+      .graph-issue-panel__field {
+        display: grid;
+        gap: 7px;
+      }
+
+      .graph-issue-panel__label {
+        color: var(--muted-strong);
+        font-size: 0.75rem;
+        letter-spacing: 0.12em;
+        text-transform: uppercase;
+      }
+
+      .graph-issue-panel__textarea,
+      .graph-issue-panel__input {
+        width: 100%;
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        border-radius: 16px;
+        background: rgba(3, 7, 18, 0.5);
+        color: var(--text);
+        font: inherit;
+        font-size: 0.92rem;
+        outline: none;
+        transition:
+          border-color 160ms ease,
+          box-shadow 160ms ease,
+          background 160ms ease;
+      }
+
+      .graph-issue-panel__textarea {
+        min-height: 122px;
+        resize: vertical;
+        padding: 13px 14px;
+        line-height: 1.42;
+      }
+
+      .graph-issue-panel__input {
+        padding: 12px 13px;
+      }
+
+      .graph-issue-panel__textarea:focus-visible,
+      .graph-issue-panel__input:focus-visible {
+        border-color: rgba(136, 215, 255, 0.52);
+        box-shadow: 0 0 0 3px rgba(136, 215, 255, 0.12);
+        background: rgba(5, 11, 25, 0.72);
+      }
+
+      .graph-issue-panel__hint {
+        margin: 0;
+        color: rgba(159, 173, 197, 0.82);
+        font-size: 0.8rem;
+        line-height: 1.42;
+      }
+
+      .graph-issue-panel__actions {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 10px;
+      }
+
+      .graph-issue-panel__button {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        min-height: 40px;
+        padding: 10px 14px;
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.05);
+        color: var(--text);
+        font-family: "Space Grotesk", sans-serif;
+        font-size: 0.78rem;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+        cursor: pointer;
+      }
+
+      .graph-issue-panel__button:hover,
+      .graph-issue-panel__button:focus-visible {
+        border-color: rgba(136, 215, 255, 0.45);
+        background: rgba(136, 215, 255, 0.1);
+      }
+
+      .graph-issue-panel__button[disabled] {
+        opacity: 0.5;
+        cursor: not-allowed;
+      }
+
+      .graph-issue-panel__button--primary {
+        border-color: rgba(136, 215, 255, 0.5);
+        background: rgba(136, 215, 255, 0.15);
+      }
+
+      .graph-issue-panel__attachments {
+        display: grid;
+        gap: 10px;
+      }
+
+      .graph-issue-panel__attachment {
+        display: grid;
+        grid-template-columns: 82px 1fr auto;
+        gap: 10px;
+        align-items: center;
+        padding: 8px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        border-radius: 16px;
+        background: rgba(255, 255, 255, 0.04);
+      }
+
+      .graph-issue-panel__attachment img {
+        display: block;
+        width: 82px;
+        height: 52px;
+        object-fit: cover;
+        border-radius: 10px;
+        background: rgba(0, 0, 0, 0.26);
+      }
+
+      .graph-issue-panel__attachment-title {
+        margin: 0;
+        font-size: 0.86rem;
+      }
+
+      .graph-issue-panel__attachment-meta {
+        margin: 3px 0 0;
+        color: var(--muted);
+        font-size: 0.72rem;
+      }
+
+      .graph-issue-panel__attachment-remove {
+        display: inline-grid;
+        place-items: center;
+        width: 28px;
+        height: 28px;
+        border: 0;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.06);
+        color: var(--muted);
+        cursor: pointer;
+      }
+
+      .graph-issue-panel__checkbox {
+        display: grid;
+        grid-template-columns: auto 1fr;
+        gap: 9px;
+        align-items: start;
+        color: rgba(194, 204, 223, 0.88);
+        font-size: 0.78rem;
+        line-height: 1.35;
+      }
+
+      .graph-issue-panel__checkbox input {
+        width: 17px;
+        height: 17px;
+        margin: 1px 0 0;
+        accent-color: var(--sky);
+      }
+
+      .graph-issue-panel__checkbox a {
+        color: var(--sky);
+      }
+
+      .graph-issue-panel__feedback {
+        margin: 0;
+        min-height: 18px;
+        color: var(--muted-strong);
+        font-size: 0.8rem;
+      }
+
+      .graph-issue-panel__feedback.is-error {
+        color: #ffb6b6;
+      }
+
+      .graph-issue-panel__feedback.is-success {
+        color: #b7f7b8;
+      }
+
+      .graph-issue-capture-overlay {
+        position: absolute;
+        inset: 0;
+        z-index: 10;
+        cursor: crosshair;
+        background: rgba(3, 7, 18, 0.28);
+        user-select: none;
+      }
+
+      .graph-issue-capture-overlay[hidden] {
+        display: none;
+      }
+
+      .graph-issue-capture-overlay::before {
+        content: "Drag to capture the incorrect area";
+        position: absolute;
+        top: 18px;
+        left: 50%;
+        transform: translateX(-50%);
+        padding: 8px 12px;
+        border: 1px solid rgba(136, 215, 255, 0.22);
+        border-radius: 999px;
+        background: rgba(5, 9, 20, 0.78);
+        color: var(--text);
+        font-family: "Space Grotesk", sans-serif;
+        font-size: 0.76rem;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .graph-issue-capture-box {
+        position: absolute;
+        border: 1px solid rgba(136, 215, 255, 0.95);
+        border-radius: 10px;
+        background: rgba(136, 215, 255, 0.12);
+        box-shadow:
+          0 0 0 9999px rgba(0, 0, 0, 0.24),
+          0 18px 50px rgba(0, 0, 0, 0.28);
+        pointer-events: none;
+      }
+
+      @media (max-width: 860px) {
+        .viewer-route__report-issue,
+        .viewer-frame .graph-issue-panel,
+        .viewer-frame .graph-issue-capture-overlay {
+          display: none !important;
+        }
+      }
+
+      .hf-article-editor__preview .graph-issue-panel--article {
+        top: 12px;
+        right: 12px;
+        bottom: 12px;
+        z-index: 12;
+        width: min(390px, calc(100% - 24px));
+        max-height: calc(100% - 24px);
+        transform: translateX(calc(100% + 18px));
+      }
+
+      .hf-article-editor__preview .graph-issue-panel--article.is-open {
+        transform: translateX(0);
+      }
+
+      @media (min-width: 981px) {
+        .hf-article-page.is-preview-graph-detail-open .hf-article-editor__preview .graph-issue-panel--article {
+          position: relative;
+          top: auto;
+          right: auto;
+          bottom: auto;
+          grid-column: 2;
+          grid-row: 1 / 3;
+          z-index: 4;
+          align-self: stretch;
+          width: 100%;
+          max-width: none;
+          height: 100%;
+          max-height: none;
+          transform: translateX(18px);
+        }
+
+        .hf-article-page.is-preview-graph-detail-open .hf-article-editor__preview .graph-issue-panel--article.is-open {
+          transform: translateX(0);
+        }
+      }
+
+      .hf-article-editor__preview .graph-issue-capture-overlay--article {
+        inset: calc(var(--hf-article-preview-head-height, 92px) + 18px) 12px 12px 12px;
+        z-index: 11;
+        border-radius: 20px;
+        overflow: hidden;
+      }
+
+      @media (max-width: 860px) {
+        .hf-article-editor__preview .graph-issue-panel--article {
+          width: calc(100% - 24px);
+        }
+      }
+
+      .viewer-frame__placeholder {
+        position: absolute;
+        inset: 0;
+        z-index: 2;
+        display: grid;
+        align-content: center;
+        justify-items: center;
+        gap: 18px;
+        padding: 24px;
+        background:
+          linear-gradient(180deg, rgba(5, 9, 20, 0.4), rgba(5, 9, 20, 0.16)),
+          var(--preview-surface);
+        text-align: center;
+      }
+
+      .viewer-frame__placeholder[hidden] {
+        display: none;
+      }
+
+      .viewer-frame__placeholder-body {
+        display: grid;
+        gap: 8px;
+        width: min(560px, 100%);
+        padding: 28px 30px;
+        border-radius: 24px;
+        border: 1px solid rgba(255, 255, 255, 0.09);
+        background: rgba(10, 18, 31, 0.58);
+        box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
+        backdrop-filter: blur(18px) saturate(1.05);
+        transition:
+          gap 240ms ease,
+          padding 240ms ease,
+          opacity 220ms ease,
+          transform 220ms ease;
+      }
+
+      .viewer-frame--static-preview-active .viewer-frame__placeholder {
+        background: linear-gradient(180deg, rgba(5, 9, 20, 0.18), rgba(5, 9, 20, 0.05));
+      }
+
+      .viewer-frame--static-preview-active
+        .viewer-frame__placeholder-body:not(.viewer-frame__placeholder-body--notify) {
+        opacity: 0;
+        transform: translateY(10px);
+        pointer-events: none;
+      }
+
+      .viewer-frame__placeholder-copy {
+        display: grid;
+        gap: 0;
+      }
+
+      .viewer-frame__placeholder-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: clamp(1.35rem, 3vw, 1.8rem);
+        font-weight: 700;
+        letter-spacing: -0.03em;
+        overflow: hidden;
+        opacity: 1;
+        transform: translateY(0);
+        max-height: 96px;
+        transition:
+          opacity 220ms ease,
+          transform 220ms ease,
+          max-height 220ms ease,
+          margin 220ms ease;
+      }
+
+      .viewer-frame__placeholder-cta {
+        margin-top: 16px;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 10px;
+      }
+      .viewer-frame__placeholder-cta-lead {
+        margin: 0;
+        color: var(--muted, #91a0ba);
+        font-size: 0.88rem;
+        line-height: 1.5;
+      }
+      .viewer-frame__placeholder-text {
+        margin: 0;
+        color: var(--muted-strong);
+        font-size: 0.95rem;
+        line-height: 1.55;
+        overflow: hidden;
+        opacity: 1;
+        transform: translateY(0);
+        max-height: 160px;
+        transition:
+          opacity 220ms ease,
+          transform 220ms ease,
+          max-height 220ms ease,
+          margin 220ms ease;
+      }
+
+      .viewer-frame__notify {
+        display: grid;
+        gap: 12px;
+        text-align: left;
+        overflow: visible;
+        opacity: 0;
+        transform: translateY(10px);
+        max-height: 0;
+        pointer-events: none;
+        transition:
+          opacity 220ms ease,
+          transform 220ms ease,
+          max-height 220ms ease,
+          margin 220ms ease;
+      }
+
+      .viewer-frame__placeholder-body--notify .viewer-frame__placeholder-text {
+        opacity: 0;
+        transform: translateY(-10px);
+        max-height: 0;
+        margin: 0;
+        pointer-events: none;
+      }
+
+      .viewer-frame__placeholder-body--notify .viewer-frame__notify {
+        opacity: 1;
+        transform: translateY(0);
+        max-height: 820px;
+        pointer-events: auto;
+      }
+
+      .viewer-frame__notify-label {
+        margin: 0;
+        color: var(--muted-strong);
+        font-size: 0.92rem;
+        line-height: 1.45;
+        overflow: hidden;
+        opacity: 1;
+        transform: translateY(0);
+        max-height: 88px;
+        transition:
+          opacity 220ms ease,
+          transform 220ms ease,
+          max-height 220ms ease,
+          margin 220ms ease;
+      }
+
+      .viewer-frame__notify-form {
+        display: grid;
+        gap: 12px;
+        padding: 3px;
+        margin: -3px;
+        overflow: hidden;
+        opacity: 1;
+        transform: translateY(0);
+        max-height: 180px;
+        transition:
+          opacity 220ms ease,
+          transform 220ms ease,
+          max-height 220ms ease,
+          margin 220ms ease,
+          padding 220ms ease;
+      }
+
+      .viewer-frame__notify-row {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) auto;
+        gap: 10px;
+        overflow: hidden;
+        opacity: 1;
+        transform: translateY(0);
+        max-height: 54px;
+        transition:
+          opacity 220ms ease,
+          transform 220ms ease,
+          max-height 220ms ease,
+          margin 220ms ease;
+      }
+
+      .viewer-frame__notify-input {
+        min-width: 0;
+        height: 46px;
+        padding: 0 14px;
+        border-radius: 14px;
+        border: 1px solid rgba(255, 255, 255, 0.14);
+        background: rgba(5, 9, 20, 0.5);
+        color: var(--text);
+        font: inherit;
+        opacity: 1;
+        transition:
+          opacity 180ms ease,
+          height 220ms ease,
+          padding 220ms ease,
+          border-color 220ms ease;
+      }
+
+      .viewer-frame__notify-input::placeholder {
+        color: rgba(197, 208, 227, 0.58);
+      }
+
+      .viewer-frame__notify-input:focus-visible {
+        outline: 2px solid rgba(136, 215, 255, 0.42);
+        outline-offset: 2px;
+      }
+
+      .viewer-frame__notify-button {
+        height: 46px;
+        padding: 0 16px;
+        border: 0;
+        border-radius: 14px;
+        background: linear-gradient(135deg, rgba(136, 215, 255, 0.92), rgba(156, 255, 99, 0.88));
+        color: var(--ink);
+        font: inherit;
+        font-weight: 700;
+        cursor: pointer;
+        opacity: 1;
+        box-shadow: 0 0 0 rgba(136, 215, 255, 0);
+        transition:
+          opacity 180ms ease,
+          height 220ms ease,
+          padding 220ms ease,
+          transform 140ms ease,
+          box-shadow 140ms ease,
+          filter 140ms ease;
+      }
+
+      .viewer-frame__notify-button:hover:not([disabled]),
+      .viewer-frame__notify-button:focus-visible:not([disabled]) {
+        transform: translateY(-1px);
+        filter: brightness(1.04) saturate(1.05);
+        box-shadow: 0 14px 34px rgba(136, 215, 255, 0.2), 0 10px 26px rgba(156, 255, 99, 0.14);
+        outline: none;
+      }
+
+      .viewer-frame__notify-button[disabled] {
+        cursor: wait;
+        opacity: 0.7;
+      }
+
+      .viewer-frame__notify--hf-auth .viewer-frame__notify-row {
+        grid-template-columns: minmax(0, 1fr);
+      }
+
+      .viewer-frame__notify--hf-auth .viewer-frame__notify-input,
+      .viewer-frame__notify--hf-auth .viewer-frame__notify-checkbox {
+        display: none;
+      }
+
+      .viewer-frame__notify--hf-auth .viewer-frame__notify-button {
+        width: 100%;
+      }
+
+      @media (max-width: 560px) {
+        .viewer-frame__placeholder-body--notify {
+          gap: 6px;
+          padding: 18px 18px;
+        }
+
+        .viewer-frame__placeholder-body--notify .viewer-frame__placeholder-title {
+          font-size: clamp(1.12rem, 6.2vw, 1.42rem);
+          line-height: 1.05;
+        }
+
+        .viewer-frame__placeholder-body--notify .viewer-frame__notify {
+          gap: 8px;
+        }
+
+        .viewer-frame__placeholder-body--notify .viewer-frame__notify-label {
+          font-size: 0.82rem;
+          line-height: 1.34;
+          max-height: 68px;
+        }
+
+        .viewer-frame__placeholder-body--notify .viewer-frame__notify-form {
+          gap: 8px;
+        }
+
+        .viewer-frame__notify-row {
+          grid-template-columns: minmax(0, 1fr);
+          gap: 6px;
+          max-height: 90px;
+        }
+
+        .viewer-frame__notify-input,
+        .viewer-frame__notify-button {
+          height: 40px;
+          font-size: 0.82rem;
+        }
+
+        .viewer-frame__notify-button {
+          width: 100%;
+          padding: 0 12px;
+          white-space: nowrap;
+        }
+
+        .viewer-frame__placeholder-body--notify .viewer-frame__notify-checkbox {
+          font-size: 0.72rem;
+          line-height: 1.28;
+          max-height: 80px;
+        }
+      }
+
+      @media (max-width: 560px) and (max-height: 720px) {
+        .viewer-frame__placeholder-body--notify {
+          padding: 14px 16px;
+        }
+
+        .viewer-frame__placeholder-body--notify .viewer-frame__notify-label {
+          font-size: 0.78rem;
+          line-height: 1.28;
+          max-height: 60px;
+        }
+
+        .viewer-frame__notify-row {
+          max-height: 82px;
+        }
+
+        .viewer-frame__notify-input,
+        .viewer-frame__notify-button {
+          height: 37px;
+          font-size: 0.78rem;
+        }
+
+        .viewer-frame__placeholder-body--notify .viewer-frame__notify-checkbox {
+          font-size: 0.68rem;
+          line-height: 1.22;
+          max-height: 70px;
+        }
+      }
+
+      .viewer-frame__notify-feedback {
+        margin: 0;
+        color: var(--muted-strong);
+        font-size: 0.9rem;
+        line-height: 1.45;
+        overflow-wrap: anywhere;
+        transform: translateY(0);
+        transition:
+          font-size 240ms ease,
+          line-height 240ms ease,
+          transform 240ms ease;
+      }
+
+      .viewer-frame__notify-checkbox {
+        color: rgba(197, 208, 227, 0.82);
+        font-size: 0.84rem;
+        line-height: 1.45;
+        overflow: hidden;
+        opacity: 1;
+        transform: translateY(0);
+        max-height: 96px;
+        transition:
+          opacity 220ms ease,
+          transform 220ms ease,
+          max-height 220ms ease,
+          margin 220ms ease;
+      }
+
+      .viewer-frame__notify-checkbox a {
+        color: #88d7ff;
+        text-decoration: none;
+      }
+
+      .viewer-frame__notify-checkbox a:hover,
+      .viewer-frame__notify-checkbox a:focus-visible {
+        text-decoration: underline;
+        text-underline-offset: 0.2em;
+      }
+
+      .viewer-frame__notify-checkbox {
+        display: grid;
+        grid-template-columns: 22px minmax(0, 1fr);
+        gap: 10px;
+        align-items: start;
+        cursor: pointer;
+      }
+
+      .viewer-frame__notify--submitted .viewer-frame__notify-label,
+      .viewer-frame__notify--submitted .viewer-frame__notify-checkbox,
+      .viewer-frame__notify--submitted .viewer-frame__notify-row,
+      .viewer-frame__notify--related-visible .viewer-frame__notify-label,
+      .viewer-frame__notify--related-visible .viewer-frame__notify-checkbox,
+      .viewer-frame__notify--related-visible .viewer-frame__notify-row {
+        opacity: 0;
+        transform: translateY(-8px);
+        max-height: 0;
+        margin: 0;
+        pointer-events: none;
+      }
+
+      .viewer-frame__notify--submitted .viewer-frame__notify-form,
+      .viewer-frame__notify--related-visible .viewer-frame__notify-form {
+        gap: 0;
+      }
+
+      .viewer-frame__placeholder-body--related-visible
+        .viewer-frame__placeholder-title,
+      .viewer-frame__placeholder-body--related-visible
+        .viewer-frame__placeholder-text,
+      .viewer-frame__notify--related-visible .viewer-frame__notify-form {
+        opacity: 0;
+        transform: translateY(-8px);
+        max-height: 0;
+        margin: 0;
+        padding: 0;
+        pointer-events: none;
+      }
+
+      .viewer-frame__notify-checkbox input {
+        appearance: none;
+        width: 22px;
+        height: 22px;
+        margin: 1px 0 0;
+        border-radius: 7px;
+        border: 1px solid rgba(197, 208, 227, 0.72);
+        background: rgba(5, 9, 20, 0.48);
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
+      }
+
+      .viewer-frame__notify-checkbox input:checked {
+        border-color: rgba(136, 215, 255, 0.9);
+        background:
+          linear-gradient(135deg, rgba(136, 215, 255, 0.94), rgba(156, 255, 99, 0.9));
+      }
+
+      .viewer-frame__notify-checkbox input:checked::after {
+        content: "";
+        display: block;
+        width: 10px;
+        height: 6px;
+        margin: 5px auto 0;
+        border-left: 2px solid rgba(1, 6, 12, 0.9);
+        border-bottom: 2px solid rgba(1, 6, 12, 0.9);
+        transform: rotate(-45deg);
+      }
+
+      .viewer-frame__notify-checkbox input:focus-visible {
+        outline: 2px solid rgba(136, 215, 255, 0.42);
+        outline-offset: 2px;
+      }
+
+      .viewer-frame__notify-feedback--error {
+        color: #ffb2b2;
+      }
+
+      .viewer-frame__related {
+        display: grid;
+        gap: 12px;
+        width: min(100%, 840px);
+        margin: 0 auto;
+        text-align: left;
+        opacity: 0;
+        max-height: 0;
+        transform: translateY(18px) scale(0.985);
+        overflow: hidden;
+        filter: blur(6px);
+        pointer-events: none;
+        transition:
+          max-height 640ms cubic-bezier(0.16, 1, 0.3, 1),
+          opacity 420ms ease,
+          transform 640ms cubic-bezier(0.16, 1, 0.3, 1),
+          filter 520ms ease;
+      }
+
+      .viewer-frame__related.is-visible {
+        max-height: 520px;
+        opacity: 1;
+        transform: translateY(0) scale(1);
+        overflow: visible;
+        filter: blur(0);
+        pointer-events: auto;
+      }
+
+      .viewer-frame__related-title {
+        margin: 0;
+        color: rgba(232, 240, 255, 0.94);
+        font-size: 0.88rem;
+        font-weight: 760;
+        letter-spacing: -0.01em;
+      }
+
+      .viewer-frame__related-title-mobile {
+        display: none;
+      }
+
+      .viewer-frame__related-rail {
+        display: grid;
+        grid-auto-flow: column;
+        grid-auto-columns: clamp(238px, 31vw, 270px);
+        gap: 12px;
+        overflow-x: auto;
+        overscroll-behavior-x: contain;
+        scroll-snap-type: x mandatory;
+        padding: 2px 2px 10px;
+        margin: 0 -2px -6px;
+        scrollbar-width: thin;
+        scrollbar-color: rgba(96, 143, 186, 0.42) rgba(8, 14, 28, 0.32);
+      }
+
+      .viewer-frame__related-rail::-webkit-scrollbar {
+        height: 8px;
+      }
+
+      .viewer-frame__related-rail::-webkit-scrollbar-track {
+        border-radius: 999px;
+        background: rgba(8, 14, 28, 0.32);
+      }
+
+      .viewer-frame__related-rail::-webkit-scrollbar-thumb {
+        border-radius: 999px;
+        background: linear-gradient(90deg, rgba(89, 132, 178, 0.5), rgba(122, 160, 206, 0.42));
+      }
+
+      @media (min-width: 641px) {
+        .viewer-frame__placeholder-body--related-visible .viewer-frame__notify {
+          gap: 0;
+        }
+
+        .viewer-frame__placeholder-body--related-visible .viewer-frame__notify-label,
+        .viewer-frame__placeholder-body--related-visible .viewer-frame__notify-form {
+          opacity: 0;
+          transform: translateY(-8px);
+          max-height: 0;
+          margin: 0;
+          padding: 0;
+          pointer-events: none;
+        }
+
+        .viewer-frame__related-rail.viewer-frame__related-rail--static {
+          grid-auto-flow: row;
+          grid-auto-columns: initial;
+          grid-template-columns: repeat(
+            var(--viewer-related-card-count, 3),
+            minmax(0, min(270px, calc((100% - 24px) / 3)))
+          );
+          justify-content: center;
+          overflow-x: visible;
+          overscroll-behavior-x: auto;
+          scroll-snap-type: none;
+          padding-inline: 0;
+          margin-inline: 0;
+          scrollbar-width: auto;
+        }
+
+        .viewer-frame__related-rail.viewer-frame__related-rail--static .viewer-frame__related-card {
+          scroll-snap-align: unset;
+        }
+      }
+
+      .viewer-frame__related-card {
+        display: grid;
+        grid-template-rows: minmax(0, 1fr) auto;
+        gap: 8px;
+        min-width: 0;
+        min-height: 234px;
+        padding: 9px;
+        border: 1px solid rgba(136, 215, 255, 0.14);
+        border-radius: 18px;
+        background:
+          radial-gradient(circle at 20% 0%, rgba(136, 215, 255, 0.12), transparent 40%),
+          linear-gradient(180deg, rgba(9, 16, 31, 0.94), rgba(5, 9, 20, 0.96));
+        color: inherit;
+        box-shadow:
+          0 18px 40px rgba(0, 0, 0, 0.24),
+          inset 0 1px 0 rgba(255, 255, 255, 0.04);
+        cursor: pointer;
+        text-align: left;
+        scroll-snap-align: start;
+        opacity: 0;
+        transform: translateY(18px) scale(0.975);
+        transition:
+          opacity 460ms ease,
+          transform 640ms cubic-bezier(0.16, 1, 0.3, 1),
+          border-color 180ms ease,
+          box-shadow 180ms ease;
+      }
+
+      .viewer-frame__related.is-visible .viewer-frame__related-card {
+        opacity: 1;
+        transform: translateY(0) scale(1);
+      }
+
+      .viewer-frame__related-card:hover,
+      .viewer-frame__related-card:focus-visible {
+        transform: translateY(-2px) scale(1);
+        border-color: rgba(136, 215, 255, 0.28);
+        box-shadow:
+          0 22px 48px rgba(0, 0, 0, 0.3),
+          0 0 0 1px rgba(156, 255, 99, 0.08),
+          inset 0 1px 0 rgba(255, 255, 255, 0.06);
+      }
+
+      .viewer-frame__related-art {
+        position: relative;
+        display: grid;
+        place-items: center;
+        min-width: 0;
+        min-height: 92px;
+        max-height: 180px;
+        height: 100%;
+        overflow: hidden;
+        border-radius: 13px;
+        background: var(--preview-surface);
+      }
+
+      .viewer-frame__related-art--pending::after {
+        content: "Loading...";
+        position: absolute;
+        inset: 0;
+        display: grid;
+        place-items: center;
+        color: rgba(197, 208, 227, 0.66);
+        font-size: 0.72rem;
+        letter-spacing: 0.02em;
+        text-transform: uppercase;
+      }
+
+      .viewer-frame__related-image,
+      .viewer-frame__related-preview-svg,
+      .viewer-frame__related-preview-svg > svg {
+        display: block;
+        width: 100%;
+        height: auto;
+        min-height: 92px;
+        max-height: 180px;
+      }
+
+      .viewer-frame__related-image {
+        object-fit: contain;
+        object-position: center center;
+        min-width: 0;
+        max-width: 100%;
+      }
+
+      .viewer-frame__related-image[hidden] {
+        display: none;
+      }
+
+      .viewer-frame__related-meta {
+        display: grid;
+        gap: 3px;
+        align-self: end;
+      }
+
+      .viewer-frame__related-head {
+        display: grid;
+        grid-template-columns: 26px minmax(0, 1fr);
+        align-items: center;
+        gap: 8px;
+        min-width: 0;
+      }
+
+      .viewer-frame__related-avatar,
+      .viewer-frame__related-avatar-fallback {
+        width: 26px;
+        height: 26px;
+        border-radius: 999px;
+        flex: 0 0 auto;
+      }
+
+      .viewer-frame__related-avatar {
+        display: block;
+        object-fit: cover;
+        background: rgba(255, 255, 255, 0.08);
+        box-shadow:
+          0 0 0 1px rgba(255, 255, 255, 0.52),
+          0 0 0 3px rgba(136, 215, 255, 0.14);
+      }
+
+      .viewer-frame__related-avatar[hidden] {
+        display: none;
+      }
+
+      .viewer-frame__related-avatar-fallback {
+        display: grid;
+        place-items: center;
+        color: rgba(238, 246, 255, 0.86);
+        font-size: 0.72rem;
+        font-weight: 820;
+        background:
+          radial-gradient(circle at 30% 20%, rgba(156, 255, 99, 0.42), transparent 44%),
+          linear-gradient(135deg, rgba(25, 74, 64, 0.92), rgba(8, 22, 38, 0.96));
+        box-shadow:
+          0 0 0 1px rgba(255, 255, 255, 0.42),
+          0 0 0 3px rgba(136, 215, 255, 0.12);
+      }
+
+      .viewer-frame__related-avatar-fallback[hidden] {
+        display: none;
+      }
+
+      .viewer-frame__related-copy {
+        display: grid;
+        gap: 3px;
+        min-width: 0;
+      }
+
+      .viewer-frame__related-repo {
+        display: block;
+        min-width: 0;
+        color: rgba(238, 246, 255, 0.96);
+        font-size: 0.8rem;
+        font-weight: 760;
+        letter-spacing: -0.025em;
+        line-height: 1.2;
+        overflow-wrap: anywhere;
+      }
+
+      .viewer-frame__related-owner {
+        color: #8d9cb6;
+      }
+
+      .viewer-frame__related-repo-text {
+        color: rgba(238, 246, 255, 0.96);
+      }
+
+      .viewer-frame__related-sub {
+        color: rgba(197, 208, 227, 0.72);
+        font-size: 0.72rem;
+        line-height: 1.35;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+
+      @media (max-width: 640px) {
+        .viewer-frame__related {
+          width: 100%;
+          gap: 9px;
+          margin-top: 2px;
+        }
+
+        .viewer-frame__related.is-visible {
+          max-height: 430px;
+        }
+
+        .viewer-frame__related-title {
+          font-size: 0.82rem;
+          line-height: 1.2;
+        }
+
+        .viewer-frame__related-title-desktop {
+          display: none;
+        }
+
+        .viewer-frame__related-title-mobile {
+          display: inline;
+        }
+
+        .viewer-frame__related-rail {
+          grid-auto-columns: minmax(216px, 72vw);
+          gap: 10px;
+          padding-bottom: 4px;
+          margin-bottom: 0;
+        }
+
+        .viewer-frame__related-card {
+          min-height: 0;
+          height: 260px;
+          gap: 6px;
+          padding: 8px;
+          border-radius: 16px;
+        }
+
+        .viewer-frame__related-art {
+          min-height: 106px;
+          max-height: 194px;
+          border-radius: 12px;
+        }
+
+        .viewer-frame__related-image,
+        .viewer-frame__related-preview-svg,
+        .viewer-frame__related-preview-svg > svg {
+          min-height: 106px;
+          max-height: 194px;
+        }
+
+        .viewer-frame__related-head {
+          grid-template-columns: 22px minmax(0, 1fr);
+          gap: 7px;
+        }
+
+        .viewer-frame__related-avatar,
+        .viewer-frame__related-avatar-fallback {
+          width: 22px;
+          height: 22px;
+        }
+
+        .viewer-frame__related-copy {
+          gap: 2px;
+        }
+
+        .viewer-frame__related-repo {
+          font-size: 0.74rem;
+          line-height: 1.15;
+        }
+
+        .viewer-frame__related-sub {
+          font-size: 0.66rem;
+          line-height: 1.25;
+        }
+
+        .viewer-frame__notify-row {
+          grid-template-columns: 1fr;
+          max-height: 90px;
+        }
+
+        .viewer-frame--notify-active .viewer-frame__placeholder {
+          place-items: start center;
+          padding: clamp(0px, 1.2dvh, 10px) 16px 14px;
+        }
+
+        .viewer-frame--notify-active .viewer-frame__placeholder-body {
+          gap: 6px;
+          padding: 22px 20px;
+        }
+
+        .viewer-frame--notify-active .viewer-frame__placeholder-title {
+          font-size: clamp(1.2rem, 7vw, 1.48rem);
+        }
+
+        .viewer-frame__placeholder-body--related-visible
+          .viewer-frame__placeholder-title {
+          display: none;
+        }
+
+        .viewer-frame__placeholder-body--related-visible {
+          display: none;
+        }
+
+        .viewer-frame--notify-active .viewer-frame__placeholder:has(.viewer-frame__related.is-visible) {
+          gap: 0;
+          padding-top: clamp(8px, 2dvh, 16px);
+        }
+
+        .viewer-frame--notify-active .viewer-frame__notify {
+          gap: 10px;
+        }
+
+        .viewer-frame--notify-active .viewer-frame__notify-label {
+          font-size: 0.84rem;
+          line-height: 1.4;
+        }
+
+        .viewer-frame--notify-active .viewer-frame__notify-form {
+          gap: 8px;
+        }
+
+        .viewer-frame--notify-active .viewer-frame__notify-input,
+        .viewer-frame--notify-active .viewer-frame__notify-button {
+          height: 40px;
+        }
+
+        .viewer-frame--notify-active .viewer-frame__notify-checkbox {
+          font-size: 0.76rem;
+          line-height: 1.36;
+        }
+      }
+
+      .viewer-frame__notify--submitted .viewer-frame__notify-input,
+      .viewer-frame__notify--submitted .viewer-frame__notify-button,
+      .viewer-frame__notify--related-visible .viewer-frame__notify-input,
+      .viewer-frame__notify--related-visible .viewer-frame__notify-button {
+        height: 0;
+        padding-top: 0;
+        padding-bottom: 0;
+        border-width: 0;
+        opacity: 0;
+        visibility: hidden;
+        pointer-events: none;
+      }
+
+      .viewer-frame__notify--submitted .viewer-frame__notify-input,
+      .viewer-frame__notify--related-visible .viewer-frame__notify-input {
+        border-color: transparent;
+      }
+
+      .viewer-frame__iframe {
+        position: absolute;
+        inset: 0;
+        z-index: 0;
+        display: block;
+        width: 100%;
+        height: 100%;
+        border: 0;
+        background: transparent;
+      }
+
+      .viewer-replay-canvas-mirror {
+        position: fixed;
+        display: block;
+        left: -10000px;
+        top: -10000px;
+        width: 1px;
+        height: 1px;
+        opacity: 0;
+        pointer-events: none;
+        user-select: none;
+        border: 0;
+        z-index: 18;
+      }
+
+      .viewer-editorial {
+        display: grid;
+        gap: 22px;
+        padding: 26px 28px 30px;
+        border-radius: 30px;
+        border: 1px solid rgba(136, 215, 255, 0.14);
+        background:
+          radial-gradient(circle at top right, rgba(136, 215, 255, 0.14), transparent 34%),
+          linear-gradient(180deg, rgba(8, 14, 25, 0.96), rgba(7, 11, 20, 0.98));
+        box-shadow:
+          0 26px 72px rgba(0, 0, 0, 0.24),
+          inset 0 1px 0 rgba(255, 255, 255, 0.05);
+      }
+
+      .viewer-editorial[hidden] {
+        display: none;
+      }
+
+      .viewer-editorial__hero {
+        display: grid;
+        gap: 12px;
+        max-width: 900px;
+      }
+
+      .viewer-editorial__eyebrow {
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        color: rgba(136, 215, 255, 0.8);
+        font-size: 0.78rem;
+        font-weight: 700;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__eyebrow::before {
+        content: "";
+        flex: 0 0 8px;
+        width: 8px;
+        min-width: 8px;
+        height: 8px;
+        min-height: 8px;
+        aspect-ratio: 1 / 1;
+        border-radius: 999px;
+        background: var(--sky);
+        box-shadow: 0 0 0 8px rgba(136, 215, 255, 0.08);
+      }
+
+      .viewer-editorial__title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: clamp(2.1rem, 3.4vw, 3.5rem);
+        line-height: 0.98;
+        letter-spacing: -0.05em;
+      }
+
+      .viewer-editorial__lede {
+        margin: 0;
+        color: rgba(232, 239, 251, 0.9);
+        font-size: 1.03rem;
+        line-height: 1.72;
+      }
+
+      .viewer-editorial__byline {
+        display: inline-flex;
+        align-items: center;
+        gap: 12px;
+        margin: 4px 0 6px;
+        color: rgba(197, 208, 227, 0.78);
+        font-size: 0.72rem;
+        font-weight: 800;
+        letter-spacing: 0.12em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__byline-avatar {
+        width: 38px;
+        height: 38px;
+        flex: 0 0 auto;
+        border-radius: 999px;
+        object-fit: cover;
+        object-position: 50% 38%;
+        border: 1.5px solid rgba(235, 248, 255, 0.82);
+        box-shadow:
+          0 10px 24px rgba(0, 0, 0, 0.24),
+          0 0 0 5px rgba(136, 215, 255, 0.07);
+      }
+
+      .viewer-editorial__byline-text {
+        display: grid;
+        gap: 4px;
+      }
+
+      .viewer-editorial__byline-author {
+        color: rgba(241, 247, 255, 0.94);
+      }
+
+      .viewer-editorial__byline-separator {
+        display: none;
+      }
+
+      .viewer-editorial__byline-date {
+        color: rgba(197, 208, 227, 0.76);
+      }
+
+      .viewer-editorial__deck {
+        display: grid;
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+        gap: 14px;
+      }
+
+      .viewer-editorial__question-grid {
+        display: grid;
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+        gap: 14px;
+      }
+
+      .viewer-editorial__question-card {
+        display: grid;
+        gap: 10px;
+        padding: 16px 18px 18px;
+        border-radius: 20px;
+        border: 1px solid rgba(136, 215, 255, 0.12);
+        background:
+          linear-gradient(180deg, rgba(136, 215, 255, 0.06), rgba(255, 255, 255, 0.02)),
+          rgba(9, 14, 24, 0.88);
+      }
+
+      .viewer-editorial__question-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: 1rem;
+        letter-spacing: -0.02em;
+      }
+
+      .viewer-editorial__question-copy {
+        margin: 0;
+        color: rgba(232, 239, 251, 0.82);
+        font-size: 0.9rem;
+        line-height: 1.58;
+      }
+
+      .viewer-editorial__question-links {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-editorial__question-link {
+        display: inline-flex;
+        align-items: center;
+        min-height: 32px;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.08);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.12);
+      }
+
+      .viewer-editorial__deck-card {
+        display: grid;
+        gap: 8px;
+        padding: 16px 18px 18px;
+        border-radius: 20px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(255, 255, 255, 0.03);
+      }
+
+      .viewer-editorial__deck-label {
+        color: rgba(136, 215, 255, 0.82);
+        font-size: 0.72rem;
+        font-weight: 700;
+        letter-spacing: 0.12em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__deck-text {
+        color: var(--muted-strong);
+        font-size: 0.9rem;
+        line-height: 1.55;
+      }
+
+      .viewer-editorial__body {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr);
+        gap: 24px;
+        align-items: start;
+      }
+
+      .viewer-editorial__sections {
+        display: grid;
+        gap: 18px;
+      }
+
+      .viewer-editorial__section {
+        display: grid;
+        gap: 10px;
+        padding: 18px 20px 20px;
+        border-radius: 22px;
+        border: 1px solid rgba(255, 255, 255, 0.07);
+        background: rgba(255, 255, 255, 0.024);
+      }
+
+      .viewer-editorial__section-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: 1.08rem;
+        letter-spacing: -0.02em;
+      }
+
+      .viewer-editorial__section-copy {
+        display: grid;
+        gap: 10px;
+      }
+
+      .viewer-editorial__member-grid {
+        display: grid;
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+        gap: 14px;
+      }
+
+      .viewer-editorial__member-card {
+        display: grid;
+        gap: 10px;
+        padding: 16px 18px 18px;
+        border-radius: 20px;
+        border: 1px solid rgba(255, 255, 255, 0.07);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.02)),
+          rgba(8, 13, 23, 0.84);
+      }
+
+      .viewer-editorial__member-tag {
+        display: inline-flex;
+        align-items: center;
+        min-height: 26px;
+        width: fit-content;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.1);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.14);
+        color: rgba(214, 241, 255, 0.88);
+        font-size: 0.72rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__member-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: 1.02rem;
+        letter-spacing: -0.02em;
+      }
+
+      .viewer-editorial__member-copy {
+        margin: 0;
+        color: rgba(232, 239, 251, 0.82);
+        font-size: 0.92rem;
+        line-height: 1.6;
+      }
+
+      .viewer-editorial__member-links {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-editorial__member-link {
+        display: inline-flex;
+        align-items: center;
+        min-height: 32px;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.08);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.12);
+      }
+
+      .viewer-editorial__level-grid {
+        display: grid;
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+        gap: 14px;
+      }
+
+      .viewer-editorial__level-card {
+        display: grid;
+        gap: 10px;
+        padding: 16px 18px 18px;
+        border-radius: 20px;
+        border: 1px solid rgba(255, 255, 255, 0.07);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015)),
+          rgba(8, 13, 23, 0.84);
+      }
+
+      .viewer-editorial__level-tag {
+        display: inline-flex;
+        align-items: center;
+        min-height: 26px;
+        width: fit-content;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.1);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.14);
+        color: rgba(214, 241, 255, 0.88);
+        font-size: 0.72rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__level-copy {
+        margin: 0;
+        color: rgba(232, 239, 251, 0.82);
+        font-size: 0.92rem;
+        line-height: 1.6;
+      }
+
+      .viewer-editorial__level-meta {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-editorial__level-pill {
+        display: inline-flex;
+        align-items: center;
+        min-height: 24px;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.045);
+        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
+        color: rgba(219, 233, 247, 0.8);
+        font-size: 0.73rem;
+        font-weight: 600;
+        letter-spacing: 0.02em;
+      }
+
+      .viewer-editorial__level-question {
+        margin: 0;
+        color: rgba(196, 214, 232, 0.72);
+        font-size: 0.82rem;
+        line-height: 1.5;
+      }
+
+      .viewer-editorial__level-links {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-editorial__level-link {
+        display: inline-flex;
+        align-items: center;
+        min-height: 32px;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.08);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.12);
+      }
+
+      .viewer-editorial__trail-grid {
+        display: grid;
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+        gap: 14px;
+      }
+
+      .viewer-editorial__trail-card {
+        display: grid;
+        gap: 10px;
+        padding: 16px 18px 18px;
+        border-radius: 20px;
+        border: 1px solid rgba(255, 255, 255, 0.07);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015)),
+          rgba(8, 13, 23, 0.84);
+      }
+
+      .viewer-editorial__trail-tag {
+        display: inline-flex;
+        align-items: center;
+        min-height: 26px;
+        width: fit-content;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.1);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.14);
+        color: rgba(214, 241, 255, 0.88);
+        font-size: 0.72rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__trail-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: 1.02rem;
+        letter-spacing: -0.02em;
+      }
+
+      .viewer-editorial__trail-copy {
+        margin: 0;
+        color: rgba(232, 239, 251, 0.82);
+        font-size: 0.92rem;
+        line-height: 1.6;
+      }
+
+      .viewer-editorial__trail-path {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: 8px;
+      }
+
+      .viewer-editorial__trail-link {
+        display: inline-flex;
+        align-items: center;
+        min-height: 32px;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.08);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.12);
+      }
+
+      .viewer-editorial__trail-arrow {
+        color: rgba(168, 200, 228, 0.62);
+        font-size: 0.8rem;
+        line-height: 1;
+      }
+
+      .viewer-editorial__myth-grid {
+        display: grid;
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+        gap: 14px;
+      }
+
+      .viewer-editorial__myth-card {
+        display: grid;
+        gap: 10px;
+        padding: 16px 18px 18px;
+        border-radius: 20px;
+        border: 1px solid rgba(255, 255, 255, 0.07);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015)),
+          rgba(8, 13, 23, 0.84);
+      }
+
+      .viewer-editorial__myth-tag {
+        display: inline-flex;
+        align-items: center;
+        min-height: 26px;
+        width: fit-content;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(255, 208, 120, 0.09);
+        box-shadow: inset 0 0 0 1px rgba(255, 208, 120, 0.14);
+        color: rgba(255, 232, 191, 0.9);
+        font-size: 0.72rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__myth-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: 1.02rem;
+        letter-spacing: -0.02em;
+      }
+
+      .viewer-editorial__myth-copy {
+        margin: 0;
+        color: rgba(232, 239, 251, 0.82);
+        font-size: 0.92rem;
+        line-height: 1.6;
+      }
+
+      .viewer-editorial__myth-links {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-editorial__myth-link {
+        display: inline-flex;
+        align-items: center;
+        min-height: 32px;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(255, 208, 120, 0.07);
+        box-shadow: inset 0 0 0 1px rgba(255, 208, 120, 0.12);
+      }
+
+      .viewer-editorial__compare-grid {
+        display: grid;
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+        gap: 14px;
+      }
+
+      .viewer-editorial__compare-card {
+        display: grid;
+        gap: 10px;
+        padding: 16px 18px 18px;
+        border-radius: 20px;
+        border: 1px solid rgba(255, 255, 255, 0.07);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015)),
+          rgba(8, 13, 23, 0.84);
+      }
+
+      .viewer-editorial__compare-tag {
+        display: inline-flex;
+        align-items: center;
+        min-height: 26px;
+        width: fit-content;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.09);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.14);
+        color: rgba(214, 241, 255, 0.88);
+        font-size: 0.72rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__compare-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: 1.02rem;
+        letter-spacing: -0.02em;
+      }
+
+      .viewer-editorial__compare-copy {
+        margin: 0;
+        color: rgba(232, 239, 251, 0.82);
+        font-size: 0.92rem;
+        line-height: 1.6;
+      }
+
+      .viewer-editorial__compare-links {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-editorial__compare-link {
+        display: inline-flex;
+        align-items: center;
+        min-height: 32px;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.08);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.12);
+      }
+
+      .viewer-editorial__faq-grid {
+        display: grid;
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+        gap: 14px;
+      }
+
+      .viewer-editorial__faq-card {
+        display: grid;
+        gap: 10px;
+        padding: 16px 18px 18px;
+        border-radius: 20px;
+        border: 1px solid rgba(255, 255, 255, 0.07);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015)),
+          rgba(8, 13, 23, 0.84);
+      }
+
+      .viewer-editorial__faq-tag {
+        display: inline-flex;
+        align-items: center;
+        min-height: 26px;
+        width: fit-content;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(157, 239, 183, 0.08);
+        box-shadow: inset 0 0 0 1px rgba(157, 239, 183, 0.14);
+        color: rgba(216, 249, 226, 0.9);
+        font-size: 0.72rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__faq-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: 1.02rem;
+        letter-spacing: -0.02em;
+      }
+
+      .viewer-editorial__faq-copy {
+        margin: 0;
+        color: rgba(232, 239, 251, 0.82);
+        font-size: 0.92rem;
+        line-height: 1.6;
+      }
+
+      .viewer-editorial__faq-links {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-editorial__faq-link {
+        display: inline-flex;
+        align-items: center;
+        min-height: 32px;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(157, 239, 183, 0.07);
+        box-shadow: inset 0 0 0 1px rgba(157, 239, 183, 0.12);
+      }
+
+      .viewer-editorial__claim-grid {
+        display: grid;
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+        gap: 14px;
+      }
+
+      .viewer-editorial__claim-card {
+        display: grid;
+        gap: 10px;
+        padding: 16px 18px 18px;
+        border-radius: 20px;
+        border: 1px solid rgba(255, 255, 255, 0.07);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015)),
+          rgba(8, 13, 23, 0.84);
+      }
+
+      .viewer-editorial__claim-tag {
+        display: inline-flex;
+        align-items: center;
+        min-height: 26px;
+        width: fit-content;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(255, 214, 122, 0.09);
+        box-shadow: inset 0 0 0 1px rgba(255, 214, 122, 0.16);
+        color: rgba(255, 242, 210, 0.92);
+        font-size: 0.72rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__claim-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: 1.02rem;
+        letter-spacing: -0.02em;
+      }
+
+      .viewer-editorial__claim-copy {
+        margin: 0;
+        color: rgba(232, 239, 251, 0.82);
+        font-size: 0.92rem;
+        line-height: 1.6;
+      }
+
+      .viewer-editorial__claim-links {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-editorial__claim-link {
+        display: inline-flex;
+        align-items: center;
+        min-height: 32px;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(255, 214, 122, 0.07);
+        box-shadow: inset 0 0 0 1px rgba(255, 214, 122, 0.12);
+      }
+
+      .viewer-editorial__meaning-grid {
+        display: grid;
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+        gap: 14px;
+      }
+
+      .viewer-editorial__meaning-card {
+        display: grid;
+        gap: 10px;
+        padding: 16px 18px 18px;
+        border-radius: 20px;
+        border: 1px solid rgba(255, 255, 255, 0.07);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015)),
+          rgba(8, 13, 23, 0.84);
+      }
+
+      .viewer-editorial__meaning-tag {
+        display: inline-flex;
+        align-items: center;
+        min-height: 26px;
+        width: fit-content;
+        padding: 0 10px;
+        border-radius: 999px;
+        font-size: 0.72rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__meaning-tag.is-positive {
+        background: rgba(136, 215, 255, 0.09);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.16);
+        color: rgba(225, 244, 255, 0.92);
+      }
+
+      .viewer-editorial__meaning-tag.is-caution {
+        background: rgba(255, 181, 107, 0.09);
+        box-shadow: inset 0 0 0 1px rgba(255, 181, 107, 0.16);
+        color: rgba(255, 236, 211, 0.92);
+      }
+
+      .viewer-editorial__meaning-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: 1.02rem;
+        letter-spacing: -0.02em;
+      }
+
+      .viewer-editorial__meaning-copy {
+        margin: 0;
+        color: rgba(232, 239, 251, 0.82);
+        font-size: 0.92rem;
+        line-height: 1.6;
+      }
+
+      .viewer-editorial__meaning-links {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-editorial__meaning-link {
+        display: inline-flex;
+        align-items: center;
+        min-height: 32px;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.07);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.12);
+      }
+
+      .viewer-editorial__paragraph {
+        margin: 0;
+        color: rgba(232, 239, 251, 0.84);
+        font-size: 0.98rem;
+        line-height: 1.78;
+      }
+
+      .viewer-editorial__paragraph strong {
+        color: var(--text);
+      }
+
+      .viewer-editorial__footnote-ref {
+        margin-left: 2px;
+        font-size: 0.72em;
+        line-height: 0;
+        vertical-align: super;
+        white-space: nowrap;
+      }
+
+      .viewer-editorial__footnote-ref a,
+      .viewer-editorial__source-link {
+        color: rgba(201, 227, 238, 0.94);
+        text-decoration-line: underline;
+        text-decoration-color: rgba(104, 164, 196, 0.72);
+        text-decoration-thickness: 1.2px;
+        text-underline-offset: 0.16em;
+      }
+
+      .viewer-editorial__footnote-ref a:hover,
+      .viewer-editorial__footnote-ref a:focus-visible,
+      .viewer-editorial__source-link:hover,
+      .viewer-editorial__source-link:focus-visible {
+        color: rgba(226, 239, 247, 0.98);
+        text-decoration-color: rgba(136, 215, 255, 0.96);
+        outline: none;
+      }
+
+      .viewer-editorial__deployment-block {
+        display: grid;
+        gap: 12px;
+      }
+
+      .viewer-editorial__deployment-controls {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-editorial__deployment-filter {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        min-height: 32px;
+        padding: 0 12px;
+        border: 0;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.05);
+        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
+        color: rgba(220, 231, 247, 0.84);
+        font: inherit;
+        font-size: 0.78rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+        cursor: pointer;
+        transition:
+          background 120ms ease,
+          box-shadow 120ms ease,
+          color 120ms ease,
+          transform 120ms ease;
+      }
+
+      .viewer-editorial__deployment-filter:hover,
+      .viewer-editorial__deployment-filter:focus-visible {
+        background: rgba(136, 215, 255, 0.1);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.18);
+        color: rgba(236, 245, 255, 0.96);
+        outline: none;
+      }
+
+      .viewer-editorial__deployment-filter.is-active {
+        background: rgba(136, 215, 255, 0.14);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.22);
+        color: rgba(243, 248, 255, 0.98);
+      }
+
+      .viewer-editorial__deployment-wrap {
+        overflow-x: auto;
+        border-radius: 22px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.015)),
+          rgba(8, 13, 23, 0.84);
+      }
+
+      .viewer-editorial__deployment-table {
+        width: 100%;
+        min-width: 920px;
+        border-collapse: collapse;
+      }
+
+      .viewer-community-articles__body ul,
+      .viewer-community-articles__body ol {
+        list-style-position: outside;
+      }
+
+      .viewer-community-articles__body ul {
+        list-style-type: disc;
+      }
+
+      .viewer-community-articles__body ol {
+        list-style-type: decimal;
+      }
+
+      .viewer-editorial__deployment-table thead th {
+        padding: 13px 16px;
+        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
+        background: rgba(255, 255, 255, 0.035);
+        color: rgba(197, 208, 227, 0.84);
+        font-family: "Inter", sans-serif;
+        font-size: 0.72rem;
+        font-weight: 700;
+        letter-spacing: 0.1em;
+        text-align: left;
+        text-transform: uppercase;
+        vertical-align: top;
+      }
+
+      .viewer-editorial__deployment-table tbody td {
+        padding: 14px 16px;
+        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
+        color: rgba(232, 239, 251, 0.84);
+        font-size: 0.92rem;
+        line-height: 1.58;
+        vertical-align: top;
+      }
+
+      .viewer-editorial__deployment-table tbody tr:last-child td {
+        border-bottom: 0;
+      }
+
+      .viewer-editorial__deployment-table tbody tr.is-hidden {
+        display: none;
+      }
+
+      .viewer-editorial__deployment-table tbody tr:hover td {
+        background: rgba(255, 255, 255, 0.02);
+      }
+
+      .viewer-editorial__deployment-table strong {
+        color: rgba(245, 248, 255, 0.98);
+      }
+
+      .viewer-editorial__deployment-note {
+        margin: 0;
+        color: rgba(197, 208, 227, 0.76);
+        font-size: 0.84rem;
+        line-height: 1.58;
+      }
+
+      .viewer-editorial__sources {
+        display: grid;
+        gap: 10px;
+        padding-top: 6px;
+      }
+
+      .viewer-editorial__sources-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: 0.98rem;
+        letter-spacing: -0.02em;
+      }
+
+      .viewer-editorial__sources-list {
+        display: grid;
+        gap: 8px;
+        margin: 0;
+        padding-left: 18px;
+        color: rgba(197, 208, 227, 0.8);
+        font-size: 0.88rem;
+        line-height: 1.55;
+      }
+
+      .newsletter-card {
+        position: relative;
+        display: grid;
+        grid-template-columns: auto minmax(0, 1fr);
+        gap: 20px;
+        align-items: center;
+        padding: 22px;
+        overflow: hidden;
+        border-radius: 26px;
+        border: 1px solid rgba(136, 215, 255, 0.2);
+        background:
+          radial-gradient(circle at 8% 0%, rgba(157, 239, 183, 0.16), transparent 32%),
+          radial-gradient(circle at 96% 18%, rgba(136, 215, 255, 0.2), transparent 30%),
+          linear-gradient(135deg, #0b1523, #060c16);
+        background-color: #060c16;
+        box-shadow:
+          0 22px 70px rgba(0, 0, 0, 0.26),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      }
+
+      .newsletter-card::after {
+        content: "";
+        position: absolute;
+        inset: auto -12% -42% 36%;
+        height: 150px;
+        pointer-events: none;
+        background: linear-gradient(90deg, transparent, rgba(136, 215, 255, 0.16), transparent);
+        filter: blur(24px);
+        transform: rotate(-8deg);
+      }
+
+      .viewer-editorial__newsletter {
+        margin-top: 30px;
+      }
+
+      .newsletter-card__avatar {
+        width: 88px;
+        height: 88px;
+        border-radius: 999px;
+        object-fit: cover;
+        object-position: 50% 38%;
+        border: 2px solid rgba(235, 248, 255, 0.88);
+        box-shadow:
+          0 14px 34px rgba(0, 0, 0, 0.3),
+          0 0 0 8px rgba(136, 215, 255, 0.08);
+      }
+
+      .newsletter-card__body {
+        position: relative;
+        z-index: 1;
+        display: grid;
+        gap: 12px;
+      }
+
+      .newsletter-card__kicker {
+        margin: 0;
+        color: rgba(157, 239, 183, 0.9);
+        font-size: 0.76rem;
+        font-weight: 800;
+        letter-spacing: 0.12em;
+        text-transform: uppercase;
+      }
+
+      .newsletter-card__title {
+        margin: 0;
+        max-width: 760px;
+        font-family: "Inter", sans-serif;
+        font-size: clamp(1.35rem, 2.2vw, 2.15rem);
+        line-height: 1.04;
+        letter-spacing: -0.04em;
+      }
+
+      .newsletter-card__subtitle {
+        margin: 0;
+        color: rgba(217, 231, 244, 0.78);
+        font-size: 0.96rem;
+        line-height: 1.55;
+      }
+
+      .newsletter-form {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 10px;
+        align-items: flex-start;
+      }
+
+      .newsletter-form__input {
+        flex: 1 1 240px;
+        min-width: 0;
+        min-height: 48px;
+        padding: 0 15px;
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        border-radius: 16px;
+        background: rgba(255, 255, 255, 0.07);
+        color: rgba(246, 250, 255, 0.98);
+        font: inherit;
+        outline: none;
+        transition:
+          border-color 140ms ease,
+          box-shadow 140ms ease,
+          background 140ms ease;
+      }
+
+      .newsletter-form__input::placeholder {
+        color: rgba(194, 211, 229, 0.66);
+      }
+
+      .newsletter-form__input:focus {
+        border-color: rgba(136, 215, 255, 0.62);
+        background: rgba(255, 255, 255, 0.09);
+        box-shadow: 0 0 0 4px rgba(136, 215, 255, 0.12);
+      }
+
+      .newsletter-form__button {
+        min-height: 48px;
+        padding: 0 20px;
+        border: 0;
+        border-radius: 16px;
+        background: linear-gradient(135deg, #88d7ff, #9defb7);
+        color: #06101c;
+        font: inherit;
+        font-weight: 850;
+        letter-spacing: -0.01em;
+        cursor: pointer;
+        box-shadow:
+          0 16px 36px rgba(68, 173, 218, 0.22),
+          inset 0 1px 0 rgba(255, 255, 255, 0.45);
+        transition:
+          transform 140ms ease,
+          filter 140ms ease,
+          box-shadow 140ms ease;
+      }
+
+      .newsletter-form__button:hover,
+      .newsletter-form__button:focus-visible {
+        filter: brightness(1.04);
+        transform: translateY(-1px);
+        outline: none;
+        box-shadow:
+          0 20px 42px rgba(68, 173, 218, 0.28),
+          inset 0 1px 0 rgba(255, 255, 255, 0.52);
+      }
+
+      .newsletter-form__button:disabled {
+        cursor: wait;
+        filter: grayscale(0.35) brightness(0.86);
+        transform: none;
+      }
+
+      .newsletter-form__feedback {
+        flex-basis: 100%;
+        min-height: 1.2em;
+        margin: 0;
+        color: rgba(157, 239, 183, 0.92);
+        font-size: 0.86rem;
+        line-height: 1.45;
+      }
+
+      .newsletter-form__feedback[hidden] {
+        display: none;
+      }
+
+      .newsletter-form__feedback.is-error {
+        color: rgba(255, 181, 107, 0.94);
+      }
+
+      .newsletter-form__fineprint {
+        flex-basis: 100%;
+        margin: -2px 0 0;
+        color: rgba(217, 231, 244, 0.62);
+        font-size: 0.78rem;
+        line-height: 1.45;
+      }
+
+      .newsletter-form__fineprint a {
+        color: rgba(136, 215, 255, 0.92);
+        text-decoration: none;
+      }
+
+      .newsletter-form__fineprint a:hover,
+      .newsletter-form__fineprint a:focus-visible {
+        text-decoration: underline;
+      }
+
+      html.newsletter-modal-open,
+      body.newsletter-modal-open {
+        overflow: hidden !important;
+        overscroll-behavior: contain;
+      }
+
+      .newsletter-modal[hidden] {
+        display: none;
+      }
+
+      .newsletter-modal {
+        position: fixed;
+        inset: 0;
+        z-index: 80;
+        display: grid;
+        place-items: center;
+        padding:
+          calc(24px + env(safe-area-inset-top, 0px))
+          24px
+          calc(24px + env(safe-area-inset-bottom, 0px));
+        --newsletter-backdrop-alpha: 0.24;
+        --newsletter-backdrop-blur: 0.8px;
+        --newsletter-card-opacity: 1;
+        --newsletter-card-y: 0px;
+        --newsletter-card-scale: 1;
+        pointer-events: auto;
+      }
+
+      .newsletter-modal.is-scroll-revealing {
+        pointer-events: none;
+      }
+
+      .newsletter-modal.is-scroll-revealing .newsletter-modal__close[data-newsletter-dismiss],
+      .newsletter-modal.is-scroll-revealing .newsletter-form__input,
+      .newsletter-modal.is-scroll-revealing .newsletter-form__button {
+        pointer-events: auto;
+      }
+
+      .newsletter-modal__backdrop {
+        position: absolute;
+        inset: 0;
+        background: rgba(1, 6, 12, var(--newsletter-backdrop-alpha));
+        backdrop-filter: blur(var(--newsletter-backdrop-blur));
+      }
+
+      .newsletter-modal__card {
+        position: relative;
+        z-index: 1;
+        width: min(520px, 100%);
+        padding: 30px;
+        border-radius: 30px;
+        border: 1px solid rgba(255, 255, 255, 0.16);
+        background:
+          radial-gradient(circle at 50% 0%, rgba(136, 215, 255, 0.18), transparent 32%),
+          linear-gradient(180deg, #09121f, #060b14);
+        background-color: #060b14;
+        box-shadow:
+          0 34px 100px rgba(0, 0, 0, 0.46),
+          inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        opacity: var(--newsletter-card-opacity);
+        transform: translate3d(0, var(--newsletter-card-y), 0) scale(var(--newsletter-card-scale));
+        transform-origin: center bottom;
+        will-change: transform;
+      }
+
+      .newsletter-modal__close {
+        position: absolute;
+        top: 16px;
+        right: 16px;
+        display: inline-grid;
+        place-items: center;
+        width: 38px;
+        height: 38px;
+        border: 0;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.07);
+        color: rgba(231, 240, 249, 0.86);
+        font: inherit;
+        font-size: 1.5rem;
+        line-height: 1;
+        cursor: pointer;
+      }
+
+      .newsletter-modal__close:hover,
+      .newsletter-modal__close:focus-visible {
+        background: rgba(255, 255, 255, 0.12);
+        color: rgba(255, 255, 255, 0.98);
+        outline: none;
+      }
+
+      .newsletter-modal__content {
+        display: grid;
+        justify-items: center;
+        gap: 14px;
+        text-align: center;
+      }
+
+      .newsletter-modal__avatar {
+        width: 96px;
+        height: 96px;
+        border-radius: 999px;
+        object-fit: cover;
+        object-position: 50% 38%;
+        border: 2px solid rgba(235, 248, 255, 0.9);
+        box-shadow:
+          0 16px 36px rgba(0, 0, 0, 0.32),
+          0 0 0 9px rgba(136, 215, 255, 0.09);
+      }
+
+      .newsletter-modal__title {
+        margin: 8px 0 0;
+        font-family: "Inter", sans-serif;
+        font-size: clamp(1.7rem, 6vw, 2.35rem);
+        line-height: 1.05;
+        letter-spacing: -0.055em;
+      }
+
+      .newsletter-modal__subtitle {
+        margin: 0;
+        max-width: 360px;
+        color: rgba(210, 226, 241, 0.76);
+        font-size: 1rem;
+        line-height: 1.55;
+      }
+
+      .newsletter-modal .newsletter-form {
+        width: 100%;
+        display: grid;
+        gap: 10px;
+        margin-top: 6px;
+      }
+
+      .newsletter-modal .newsletter-form__input,
+      .newsletter-modal .newsletter-form__button {
+        width: 100%;
+      }
+
+      .viewer-editorial__attention-figure {
+        display: grid;
+        gap: 12px;
+        margin: 4px 0 6px;
+        padding: 16px 16px 14px;
+        border-radius: 22px;
+        border: 1px solid rgba(136, 215, 255, 0.14);
+        background:
+          radial-gradient(circle at 12% 18%, rgba(156, 255, 99, 0.08), transparent 30%),
+          radial-gradient(circle at 86% 0%, rgba(136, 215, 255, 0.12), transparent 26%),
+          linear-gradient(180deg, rgba(10, 18, 31, 0.92), rgba(7, 13, 23, 0.96));
+        box-shadow:
+          inset 0 1px 0 rgba(255, 255, 255, 0.04),
+          0 18px 40px rgba(0, 0, 0, 0.2);
+        overflow: hidden;
+      }
+
+      .viewer-editorial__attention-svg {
+        display: block;
+        width: 100%;
+        height: auto;
+        overflow: visible;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__scene--mobile {
+        display: none;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__title {
+        fill: rgba(245, 248, 255, 0.96);
+        font-family: "Inter", sans-serif;
+        font-size: 22px;
+        font-weight: 700;
+        letter-spacing: 2.8px;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__title--mobile,
+      .viewer-editorial__attention-svg .attention-figure__subtitle--mobile,
+      .viewer-editorial__attention-svg .attention-figure__scale--mobile {
+        display: none;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__subtitle {
+        fill: rgba(197, 208, 227, 0.76);
+        font-family: "Inter", sans-serif;
+        font-size: 11px;
+        font-weight: 600;
+        letter-spacing: 2.4px;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__row-label {
+        fill: rgba(245, 248, 255, 0.9);
+        font-family: "Inter", sans-serif;
+        font-size: 14px;
+        font-weight: 700;
+        letter-spacing: 0.2px;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__row-label--full {
+        fill: rgba(255, 229, 186, 0.96);
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__row-hint,
+      .viewer-editorial__attention-svg .attention-figure__scale-label,
+      .viewer-editorial__attention-svg .attention-figure__scale-note {
+        fill: rgba(197, 208, 227, 0.76);
+        font-family: "Inter", sans-serif;
+        font-size: 10px;
+        font-weight: 600;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__row-hint,
+      .viewer-editorial__attention-svg .attention-figure__scale-label {
+        letter-spacing: 1.7px;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__query-guide {
+        stroke: rgba(136, 215, 255, 0.34);
+        stroke-width: 1.25;
+        stroke-dasharray: 4 5;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__query-label {
+        fill: rgba(136, 215, 255, 0.94);
+        font-family: "Inter", sans-serif;
+        font-size: 11px;
+        font-weight: 700;
+        letter-spacing: 1.8px;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__connector {
+        stroke: rgba(197, 208, 227, 0.38);
+        stroke-width: 1.5;
+        stroke-linecap: round;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__repeat-bracket {
+        stroke: rgba(197, 208, 227, 0.46);
+        stroke-width: 1.5;
+        stroke-linecap: round;
+        stroke-linejoin: round;
+        fill: none;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__repeat-label {
+        fill: rgba(197, 208, 227, 0.84);
+        font-family: "Inter", sans-serif;
+        font-size: 16px;
+        font-weight: 700;
+        letter-spacing: 1.6px;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__token-base,
+      .viewer-editorial__attention-svg .attention-figure__token-base use {
+        fill: rgba(145, 160, 186, 0.16);
+        stroke: rgba(255, 255, 255, 0.08);
+        stroke-width: 1;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__token-attended,
+      .viewer-editorial__attention-svg .attention-figure__token-attended use {
+        fill: rgba(156, 255, 99, 0.9);
+        stroke: rgba(228, 255, 214, 0.42);
+        stroke-width: 1;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__token-query,
+      .viewer-editorial__attention-svg .attention-figure__token-query use {
+        fill: rgba(136, 215, 255, 0.98);
+        stroke: rgba(224, 246, 255, 0.6);
+        stroke-width: 1;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__track {
+        fill: rgba(255, 255, 255, 0.045);
+        stroke: rgba(255, 255, 255, 0.09);
+        stroke-width: 1;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__track-fill {
+        fill: rgba(156, 255, 99, 0.92);
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__track-dot {
+        fill: rgba(156, 255, 99, 1);
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__ratio {
+        fill: rgba(255, 241, 211, 0.96);
+        font-family: "Inter", sans-serif;
+        font-size: 18px;
+        font-weight: 700;
+        letter-spacing: 0.4px;
+      }
+
+      .viewer-editorial__attention-meta {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-editorial__attention-pill {
+        display: inline-flex;
+        align-items: center;
+        min-height: 28px;
+        padding: 0 10px;
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.045);
+        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
+        color: rgba(225, 236, 249, 0.86);
+        font-size: 0.73rem;
+        font-weight: 700;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+
+      .viewer-editorial__attention-caption {
+        margin: 0;
+        color: rgba(197, 208, 227, 0.82);
+        font-size: 0.84rem;
+        line-height: 1.56;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__window--s1,
+      .viewer-editorial__attention-svg .attention-figure__window--s2,
+      .viewer-editorial__attention-svg .attention-figure__window--s3,
+      .viewer-editorial__attention-svg .attention-figure__window--s4,
+      .viewer-editorial__attention-svg .attention-figure__window--s5,
+      .viewer-editorial__attention-svg .attention-figure__window--full,
+      .viewer-editorial__attention-svg .attention-figure__track-fill,
+      .viewer-editorial__attention-svg .attention-figure__track-dot,
+      .viewer-editorial__attention-svg .attention-figure__connector--ratio {
+        opacity: 0.18;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__window--s1 {
+        animation: attention-window-s1 6.8s ease-in-out infinite;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__window--s2 {
+        animation: attention-window-s2 6.8s ease-in-out infinite;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__window--s3 {
+        animation: attention-window-s3 6.8s ease-in-out infinite;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__window--s4 {
+        animation: attention-window-s4 6.8s ease-in-out infinite;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__window--s5 {
+        animation: attention-window-s5 6.8s ease-in-out infinite;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__window--full {
+        animation: attention-window-full 6.8s ease-in-out infinite;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__query-token {
+        animation: attention-query-pulse 6.8s ease-in-out infinite;
+        transform-origin: 607px 0px;
+      }
+
+      .viewer-editorial__attention-svg .attention-figure__track-fill,
+      .viewer-editorial__attention-svg .attention-figure__track-dot,
+      .viewer-editorial__attention-svg .attention-figure__connector--ratio {
+        animation: attention-ratio-pulse 6.8s ease-in-out infinite;
+      }
+
+      @keyframes attention-window-s1 {
+        0%,
+        6%,
+        100% {
+          opacity: 0.16;
+        }
+        8%,
+        16% {
+          opacity: 1;
+        }
+      }
+
+      @keyframes attention-window-s2 {
+        0%,
+        14%,
+        100% {
+          opacity: 0.16;
+        }
+        18%,
+        26% {
+          opacity: 1;
+        }
+      }
+
+      @keyframes attention-window-s3 {
+        0%,
+        24%,
+        100% {
+          opacity: 0.16;
+        }
+        28%,
+        36% {
+          opacity: 1;
+        }
+      }
+
+      @keyframes attention-window-s4 {
+        0%,
+        34%,
+        100% {
+          opacity: 0.16;
+        }
+        38%,
+        46% {
+          opacity: 1;
+        }
+      }
+
+      @keyframes attention-window-s5 {
+        0%,
+        44%,
+        100% {
+          opacity: 0.16;
+        }
+        48%,
+        56% {
+          opacity: 1;
+        }
+      }
+
+      @keyframes attention-window-full {
+        0%,
+        52%,
+        100% {
+          opacity: 0.12;
+        }
+        58%,
+        78% {
+          opacity: 1;
+        }
+      }
+
+      @keyframes attention-query-pulse {
+        0%,
+        100% {
+          opacity: 0.92;
+        }
+        14%,
+        34%,
+        62%,
+        74% {
+          opacity: 1;
+        }
+        52% {
+          opacity: 0.78;
+        }
+      }
+
+      @keyframes attention-ratio-pulse {
+        0%,
+        52%,
+        100% {
+          opacity: 0.16;
+        }
+        58%,
+        78% {
+          opacity: 1;
+        }
+      }
+
+      @media (prefers-reduced-motion: reduce) {
+        .viewer-editorial__attention-svg .attention-figure__window--s1,
+        .viewer-editorial__attention-svg .attention-figure__window--s2,
+        .viewer-editorial__attention-svg .attention-figure__window--s3,
+        .viewer-editorial__attention-svg .attention-figure__window--s4,
+        .viewer-editorial__attention-svg .attention-figure__window--s5,
+        .viewer-editorial__attention-svg .attention-figure__window--full,
+        .viewer-editorial__attention-svg .attention-figure__query-token,
+        .viewer-editorial__attention-svg .attention-figure__track-fill,
+        .viewer-editorial__attention-svg .attention-figure__track-dot,
+        .viewer-editorial__attention-svg .attention-figure__connector--ratio {
+          animation: none;
+        }
+
+        .viewer-editorial__attention-svg .attention-figure__window--s1,
+        .viewer-editorial__attention-svg .attention-figure__window--s2,
+        .viewer-editorial__attention-svg .attention-figure__window--s3,
+        .viewer-editorial__attention-svg .attention-figure__window--s4,
+        .viewer-editorial__attention-svg .attention-figure__window--s5,
+        .viewer-editorial__attention-svg .attention-figure__window--full,
+        .viewer-editorial__attention-svg .attention-figure__track-fill,
+        .viewer-editorial__attention-svg .attention-figure__track-dot,
+        .viewer-editorial__attention-svg .attention-figure__connector--ratio {
+          opacity: 1;
+        }
+      }
+
+      .viewer-editorial__aside {
+        display: grid;
+        gap: 14px;
+        position: sticky;
+        top: 22px;
+      }
+
+      .viewer-editorial__aside-card {
+        display: grid;
+        gap: 10px;
+        padding: 18px 18px 20px;
+        border-radius: 22px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        background:
+          linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)),
+          rgba(7, 13, 23, 0.92);
+      }
+
+      .viewer-editorial__aside-title {
+        margin: 0;
+        font-family: "Inter", sans-serif;
+        font-size: 1rem;
+        letter-spacing: -0.02em;
+      }
+
+      .viewer-editorial__aside-text,
+      .viewer-editorial__aside-list {
+        margin: 0;
+        color: var(--muted-strong);
+        font-size: 0.9rem;
+        line-height: 1.65;
+      }
+
+      .viewer-editorial__aside-list {
+        display: grid;
+        gap: 10px;
+        padding-left: 18px;
+      }
+
+      .viewer-node-link {
+        --viewer-node-link-underline-rgb: 104, 164, 196;
+        --viewer-node-link-text-rgb: 201, 227, 238;
+        color: rgba(var(--viewer-node-link-text-rgb), 0.96);
+        text-decoration-line: underline;
+        text-decoration-color: rgba(var(--viewer-node-link-underline-rgb), 0.74);
+        text-decoration-thickness: 1.5px;
+        text-underline-offset: 0.19em;
+        text-decoration-skip-ink: none;
+        transition:
+          color 120ms ease,
+          text-decoration-color 120ms ease,
+          background 120ms ease,
+          box-shadow 120ms ease;
+      }
+
+      .viewer-node-link:hover,
+      .viewer-node-link:focus-visible,
+      .viewer-node-link.is-active {
+        color: rgba(var(--viewer-node-link-text-rgb), 0.98);
+        text-decoration-color: rgba(var(--viewer-node-link-underline-rgb), 0.96);
+        background: rgba(var(--viewer-node-link-underline-rgb), 0.09);
+        box-shadow: 0 0 0 6px rgba(var(--viewer-node-link-underline-rgb), 0.09);
+        border-radius: 10px;
+        outline: none;
+      }
+
+      .viewer-node-link.is-return-target {
+        animation: viewer-node-link-pulse 900ms ease;
+      }
+
+      @keyframes viewer-node-link-pulse {
+        0% {
+          box-shadow: 0 0 0 0 rgba(136, 215, 255, 0);
+          background: rgba(136, 215, 255, 0);
+        }
+        35% {
+          box-shadow: 0 0 0 10px rgba(136, 215, 255, 0.14);
+          background: rgba(136, 215, 255, 0.12);
+        }
+        100% {
+          box-shadow: 0 0 0 0 rgba(136, 215, 255, 0);
+          background: rgba(136, 215, 255, 0);
+        }
+      }
+
+      .viewer-crosslink-portals {
+        position: absolute;
+        inset: 0;
+        pointer-events: none;
+        z-index: 30;
+        overflow: visible;
+      }
+
+      .viewer-crosslink-portal {
+        position: absolute;
+        width: 92px;
+        height: 92px;
+        padding: 0;
+        border-radius: 999px;
+        border: 1px solid rgba(255, 255, 255, 0.14);
+        background: transparent;
+        box-shadow: 0 18px 42px rgba(4, 7, 16, 0.45);
+        transform: translate(-50%, -50%);
+        opacity: 0;
+        pointer-events: none;
+        cursor: pointer;
+        transition:
+          opacity 120ms ease,
+          transform 180ms ease,
+          left 240ms ease,
+          top 240ms ease,
+          box-shadow 180ms ease,
+          background 180ms ease;
+        --viewer-crosslink-portal-blur: 8px;
+      }
+
+      .viewer-crosslink-portal--sample {
+        width: 184px;
+        height: 184px;
+        transform: translate(-50%, -50%) scale(0.94);
+        transition:
+          opacity 120ms ease,
+          transform 120ms ease,
+          box-shadow 120ms ease,
+          box-shadow 120ms ease;
+      }
+
+      .viewer-crosslink-portal--sample.is-visible {
+        transform: translate(-50%, -50%) scale(1);
+      }
+
+      .viewer-crosslink-portal--sample:hover {
+        background: transparent;
+      }
+
+      .viewer-crosslink-portal.is-tracking-node {
+        transition:
+          opacity 140ms ease,
+          transform 180ms ease,
+          box-shadow 180ms ease,
+          background 180ms ease;
+      }
+
+      .viewer-crosslink-portal.is-visible {
+        opacity: 1;
+        pointer-events: auto;
+      }
+
+      .viewer-crosslink-portal.is-occluded {
+        opacity: 0;
+        pointer-events: none;
+      }
+
+      .viewer-crosslink-portal:hover {
+        background: transparent;
+        box-shadow: 0 26px 60px rgba(4, 7, 16, 0.72);
+      }
+
+      .viewer-crosslink-portal__content {
+        position: absolute;
+        inset: 0;
+        display: block;
+        border-radius: 999px;
+        overflow: hidden;
+      }
+
+      .viewer-crosslink-portal__backdrop {
+        position: absolute;
+        inset: 0;
+        border-radius: inherit;
+        background: rgba(7, 12, 22, 0.22);
+        backdrop-filter: blur(var(--viewer-crosslink-portal-blur)) saturate(1.1);
+        -webkit-backdrop-filter: blur(var(--viewer-crosslink-portal-blur)) saturate(1.1);
+      }
+
+      .viewer-crosslink-portal--sample .viewer-crosslink-portal__backdrop {
+        background: rgba(7, 12, 22, 0.2);
+        backdrop-filter: blur(calc(var(--viewer-crosslink-portal-blur) + 2px)) saturate(1.14);
+        -webkit-backdrop-filter: blur(calc(var(--viewer-crosslink-portal-blur) + 2px)) saturate(1.14);
+      }
+
+      .viewer-crosslink-portal:hover .viewer-crosslink-portal__backdrop {
+        background: rgba(33, 40, 56, 0.3);
+      }
+
+      .viewer-crosslink-portal__canvas,
+      .viewer-crosslink-portal__text-preview {
+        position: absolute;
+        inset: 0;
+        width: 100%;
+        height: 100%;
+        display: block;
+        background: transparent;
+      }
+
+      .viewer-crosslink-portal__text-preview {
+        overflow: hidden;
+        border-radius: inherit;
+        color: #f5f8ff;
+      }
+
+      .viewer-crosslink-portal__text-scale {
+        position: absolute;
+        inset: 0;
+        width: 100%;
+        height: 100%;
+        overflow: visible;
+        pointer-events: none;
+        transform-origin: top left;
+        will-change: transform;
+      }
+
+      .viewer-crosslink-portal__article-snapshot {
+        position: absolute;
+        top: 0;
+        left: 0;
+        margin: 0 !important;
+        pointer-events: none;
+        user-select: none;
+      }
+
+      .viewer-crosslink-portal__article-snapshot,
+      .viewer-crosslink-portal__article-snapshot * {
+        box-sizing: border-box;
+      }
+
+      .viewer-crosslink-portal__article-snapshot [id] {
+        scroll-margin: 0 !important;
+      }
+
+      .viewer-crosslink-portal__article-snapshot .viewer-node-link {
+        pointer-events: none;
+      }
+
+      .viewer-crosslink-portal__article-snapshot .viewer-node-link:focus-visible {
+        outline: none;
+      }
+
+      .viewer-crosslink-portal__snippet {
+        display: grid;
+        gap: 10px;
+        padding: 22px 24px 24px;
+        color: rgba(244, 248, 255, 0.92);
+        font-family: "Inter", sans-serif;
+      }
+
+      .viewer-crosslink-portal__snippet-eyebrow {
+        color: rgba(136, 215, 255, 0.8);
+        font-size: 11px;
+        font-weight: 700;
+        letter-spacing: 0.14em;
+        text-transform: uppercase;
+      }
+
+      .viewer-crosslink-portal__snippet-title {
+        font-family: "Inter", sans-serif;
+        font-size: 20px;
+        line-height: 1.02;
+        letter-spacing: -0.03em;
+      }
+
+      .viewer-crosslink-portal__snippet-meta {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+
+      .viewer-crosslink-portal__snippet-pill {
+        display: inline-flex;
+        align-items: center;
+        min-height: 28px;
+        padding: 0 12px;
+        border-radius: 999px;
+        background: rgba(136, 215, 255, 0.12);
+        box-shadow: inset 0 0 0 1px rgba(136, 215, 255, 0.18);
+        color: rgba(234, 246, 255, 0.9);
+        font-size: 12px;
+        font-weight: 600;
+        letter-spacing: 0.01em;
+      }
+
+      .viewer-crosslink-portal__snippet-node {
+        color: rgba(206, 232, 255, 0.8);
+        font-size: 12px;
+        font-weight: 500;
+        letter-spacing: 0.01em;
+      }
+
+      .viewer-crosslink-portal__snippet-copy {
+        font-size: 15px;
+        line-height: 1.72;
+        color: rgba(233, 240, 251, 0.84);
+      }
+
+      .viewer-crosslink-portal__snippet-copy > * {
+        position: relative;
+      }
+
+      .viewer-crosslink-portal__snippet-copy .viewer-editorial__paragraph {
+        margin: 0;
+        font-size: 0.92rem;
+        line-height: 1.58;
+      }
+
+      .viewer-crosslink-portal__snippet-copy .viewer-editorial__paragraph + .viewer-editorial__paragraph {
+        margin-top: 10px;
+      }
+
+      .viewer-crosslink-portal__snippet-copy .viewer-editorial__aside-text {
+        margin: 0;
+        font-size: 0.92rem;
+        line-height: 1.58;
+      }
+
+      .viewer-crosslink-portal__snippet-copy .viewer-editorial__aside-list {
+        margin: 0;
+        padding-left: 18px;
+        font-size: 0.92rem;
+        line-height: 1.58;
+      }
+
+      .viewer-crosslink-portal__snippet-copy .viewer-editorial__aside-text + .viewer-editorial__aside-list,
+      .viewer-crosslink-portal__snippet-copy .viewer-editorial__aside-list + .viewer-editorial__aside-text,
+      .viewer-crosslink-portal__snippet-copy .viewer-editorial__aside-list + .viewer-editorial__aside-list {
+        margin-top: 10px;
+      }
+
+      .viewer-crosslink-portal__snippet-copy .viewer-editorial__aside-list li + li {
+        margin-top: 6px;
+      }
+
+      .viewer-crosslink-portal__snippet-copy .is-snippet-context-block {
+        opacity: 0.7;
+      }
+
+      .viewer-crosslink-portal__snippet-copy .is-snippet-focus-block {
+        margin-left: -10px;
+        margin-right: -10px;
+        padding: 10px 12px;
+        background:
+          linear-gradient(180deg, rgba(136, 215, 255, 0.12), rgba(24, 40, 70, 0.26));
+        border-radius: 14px;
+        box-shadow:
+          inset 0 0 0 1px rgba(136, 215, 255, 0.22),
+          0 12px 32px rgba(2, 6, 14, 0.18);
+        opacity: 1;
+      }
+
+      .viewer-crosslink-portal__snippet-copy strong {
+        color: #ffffff;
+      }
+
+      .viewer-crosslink-portal__snippet-copy .viewer-node-link {
+        pointer-events: none;
+      }
+
+      .viewer-crosslink-portal__snippet-copy .viewer-node-link.is-snippet-focus {
+        color: #ffffff;
+        text-decoration-color: rgba(156, 255, 99, 0.94);
+        background: rgba(136, 215, 255, 0.09);
+        box-shadow: 0 0 0 6px rgba(136, 215, 255, 0.09);
+        border-radius: 10px;
+      }
+
+      .viewer-crosslink-portal__arrow {
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        width: 24px;
+        height: 18px;
+        transform-origin: center center;
+      }
+
+      .viewer-crosslink-portal__arrow svg {
+        width: 100%;
+        height: 100%;
+        display: block;
+      }
+
+      .viewer-crosslink-portal__arrow path {
+        fill: rgba(255, 255, 255, 0.9);
+      }
+
+      .debug-version-badge {
+        position: fixed;
+        top: 8px;
+        right: 8px;
+        left: auto;
+        z-index: 10000;
+        display: grid;
+        width: max-content;
+        max-width: min(360px, calc(100vw - 16px));
+        gap: 3px;
+        padding: 7px 26px 7px 9px;
+        border: 1px solid rgba(136, 215, 255, 0.3);
+        border-radius: 12px;
+        background: rgba(5, 9, 20, 0.82);
+        box-shadow: 0 10px 28px rgba(0, 0, 0, 0.26);
+        color: rgba(245, 247, 251, 0.88);
+        font-family: "Inter", sans-serif;
+        font-size: 10px;
+        line-height: 1.2;
+        pointer-events: auto;
+        backdrop-filter: blur(12px) saturate(1.08);
+      }
+
+      .debug-version-badge--hidden {
+        width: auto;
+        border-radius: 999px;
+        gap: 0;
+        padding: 4px;
+      }
+
+      .debug-version-badge--hidden .debug-version-badge__line {
+        display: none;
+      }
+
+      .debug-version-badge__line {
+        display: grid;
+        grid-template-columns: auto minmax(0, 1fr);
+        gap: 5px;
+        min-width: 0;
+      }
+
+      .debug-version-badge__label {
+        flex: 0 0 auto;
+        color: rgba(136, 215, 255, 0.78);
+        font-weight: 700;
+        letter-spacing: 0.05em;
+        text-transform: uppercase;
+      }
+
+      .debug-version-badge__label::after {
+        content: ":";
+      }
+
+      .debug-version-badge__value {
+        min-width: 0;
+        overflow: hidden;
+        color: rgba(245, 247, 251, 0.9);
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .debug-version-badge__toggle {
+        position: absolute;
+        top: -5px;
+        right: -5px;
+        display: grid;
+        place-items: center;
+        width: 18px;
+        height: 18px;
+        padding: 0;
+        border: 1px solid rgba(136, 215, 255, 0.45);
+        border-radius: 999px;
+        background: rgba(8, 14, 27, 0.94);
+        color: rgba(245, 247, 251, 0.94);
+        cursor: pointer;
+        font: 700 11px/1 "Inter", sans-serif;
+        pointer-events: auto;
+      }
+
+      .debug-version-badge__toggle:focus-visible {
+        outline: 2px solid rgba(136, 215, 255, 0.7);
+        outline-offset: 2px;
+      }
+
+      body.route-viewer {
+        overflow: hidden;
+      }
+
+      body.route-viewer.hfviewer-demo-mode {
+        overflow: hidden;
+      }
+
+      body.route-viewer.route-viewer-article {
+        overflow-x: hidden;
+        overflow-y: auto;
+      }
+
+      .page.route-viewer {
+        min-height: 100vh;
+        height: 100vh;
+        min-height: 100dvh;
+        height: 100dvh;
+        overflow: hidden;
+      }
+
+      body.route-viewer.route-viewer-article .page.route-viewer {
+        height: auto;
+        min-height: 100vh;
+        min-height: 100dvh;
+        overflow: visible;
+      }
+
+      .page.route-viewer .shell {
+        width: min(1320px, calc(100% - 52px));
+      }
+
+      .page.route-viewer .shell {
+        min-height: 0;
+        height: 100%;
+        box-sizing: border-box;
+        display: flex;
+        flex-direction: column;
+        align-items: stretch;
+        grid-template-columns: none;
+        grid-template-areas: none;
+        column-gap: 0;
+        padding: 22px 0 24px;
+      }
+
+      body.route-viewer.hfviewer-demo-mode .page.route-viewer .shell {
+        padding-top: clamp(8px, 1.2vh, 14px);
+      }
+
+      body.route-viewer.route-viewer-article .page.route-viewer .shell {
+        height: auto;
+        min-height: 100vh;
+        min-height: 100dvh;
+      }
+
+      .page.route-viewer .viewer-route {
+        flex: 1 1 auto;
+        min-height: 0;
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        gap: 20px;
+        padding-top: 0;
+      }
+
+      body.route-viewer.hfviewer-demo-mode .page.route-viewer .viewer-route {
+        gap: 0;
+      }
+
+      body.route-viewer.route-viewer-article .page.route-viewer .viewer-route {
+        flex: 0 0 auto;
+        overflow: visible;
+      }
+
+      .page.route-viewer .viewer-route__head {
+        flex: 0 0 auto;
+      }
+
+      body.route-viewer.hfviewer-demo-mode .page.route-viewer .viewer-route__head {
+        display: none !important;
+      }
+
+      body.route-viewer.hfviewer-demo-mode-2 .page.route-viewer .viewer-route__actions,
+      body.route-viewer.hfviewer-demo-mode-2 .page.route-viewer .viewer-route__intro-links {
+        display: none !important;
+      }
+
+      .page.route-viewer .viewer-frame {
+        flex: 1 1 auto;
+      }
+
+      body.route-viewer.route-viewer-article .page.route-viewer .viewer-frame {
+        flex: 0 0 auto;
+      }
+
+      .page.route-viewer .viewer-frame__canvas {
+        flex: 1 1 auto;
+        min-height: 0;
+        height: auto;
+      }
+
+      body.route-viewer.route-viewer-family {
+        overflow-y: auto;
+      }
+
+      body.route-viewer.viewer-community-article-active {
+        overflow-y: auto;
+      }
+
+      body.route-viewer.route-viewer-article .page.route-viewer #viewer-write-article-btn,
+      body.route-viewer.route-viewer-article .page.route-viewer #viewer-community-article-write {
+        display: none !important;
+      }
+
+      .page.route-viewer.viewer-community-article-active {
+        min-height: 100vh;
+        height: auto;
+        min-height: 100dvh;
+        overflow: visible;
+      }
+
+      .page.route-viewer.viewer-community-article-active .shell {
+        min-height: 100vh;
+        height: auto;
+      }
+
+      .page.route-viewer.viewer-community-article-active .viewer-route,
+      .page.route-viewer.viewer-community-article-active .viewer-frame {
+        flex: 0 0 auto;
+      }
+
+      .page.route-viewer.viewer-community-article-active .viewer-frame {
+        display: none !important;
+      }
+
+      .page.route-viewer.viewer-community-article-active .viewer-frame__canvas {
+        min-height: clamp(344px, 50dvh, 500px);
+      }
+
+      @media (max-width: 980px) {
+        body.route-viewer.route-viewer-article:not(.route-viewer-article-hidden) .page.route-viewer.viewer-community-article-active .viewer-frame {
+          display: flex !important;
+          height: auto !important;
+          min-height: 0 !important;
+          margin: 0 !important;
+          padding: 0 !important;
+          border: 1px solid rgba(255, 255, 255, 0.09) !important;
+          background: var(--preview-surface) !important;
+          box-shadow: var(--shadow) !important;
+          overflow: hidden !important;
+        }
+
+        body.route-viewer.route-viewer-article:not(.route-viewer-article-hidden) .page.route-viewer.viewer-community-article-active .viewer-frame__bar {
+          display: flex !important;
+        }
+      }
+
+      @media (min-width: 981px) {
+        .page.route-viewer.viewer-community-article-active .viewer-route {
+          flex: 0 0 auto;
+          min-height: auto;
+          gap: 20px;
+        }
+
+        .page.route-viewer.viewer-community-article-active .viewer-route__head {
+          margin-bottom: 0;
+        }
+
+        .page.route-viewer.viewer-community-article-active .viewer-route__blog-link,
+        .page.route-viewer.viewer-community-article-active .viewer-route__blog-pill,
+        .page.route-viewer.viewer-community-article-active .viewer-blog-float {
+          display: none !important;
+        }
+      }
+
+      .page.route-viewer.route-viewer-family {
+        min-height: 100vh;
+        height: auto;
+        min-height: 100dvh;
+        overflow: visible;
+      }
+
+      .page.route-viewer.route-viewer-family .shell {
+        min-height: 100vh;
+        height: auto;
+      }
+
+      .page.route-viewer.route-viewer-family .viewer-route {
+        flex: 0 0 auto;
+        min-height: auto;
+        gap: 20px;
+      }
+
+      .page.route-viewer.route-viewer-family .viewer-frame {
+        flex: 0 0 auto;
+      }
+
+      .page.route-viewer.route-viewer-family .viewer-frame__canvas {
+        min-height: clamp(460px, 74vh, 860px);
+      }
+
+      @media (min-width: 861px) {
+        body.route-landing,
+        .page.route-landing {
+          --landing-hero-video-width: clamp(325px, calc(9vw + 210px), 374px);
+          --landing-hero-gap: clamp(34px, 4vw, 74px);
+        }
+
+        body.route-landing .landing-nav-wrap,
+        .page.route-landing .landing-nav-wrap {
+          position: absolute;
+          top: 22px;
+          left: 0;
+          right: 0;
+          width: min(1560px, calc(100% - 52px));
+          z-index: 4;
+          pointer-events: none;
+        }
+
+        body.route-landing .landing-nav-wrap .nav,
+        .page.route-landing .landing-nav-wrap .nav {
+          pointer-events: auto;
+          margin-right: 0;
+          padding-top: 0;
+          padding-right: calc(var(--landing-hero-video-width) + var(--landing-hero-gap));
+          justify-content: flex-end;
+        }
+
+        body.route-landing .brand-stack,
+        .page.route-landing .brand-stack {
+          width: var(--brand-stack-expanded-width, max-content);
+          min-width: 0;
+          align-items: flex-end;
+        }
+
+        body.route-landing .brand-stack__menu,
+        .page.route-landing .brand-stack__menu {
+          width: var(--brand-stack-expanded-width, max-content);
+          transform: translate(var(--brand-stack-collapsed-offset, 0px), -6px);
+          transition: none;
+        }
+
+        body.route-landing .brand-stack__trigger,
+        .page.route-landing .brand-stack__trigger {
+          width: max-content;
+          max-width: 100%;
+          align-self: flex-end;
+          transform: translateX(0);
+          transition: none;
+          will-change: transform;
+        }
+
+        body.route-landing .brand-stack.brand-stack--ready .brand-stack__menu,
+        .page.route-landing .brand-stack.brand-stack--ready .brand-stack__menu {
+          transition: opacity 220ms ease, transform 220ms ease;
+        }
+
+        body.route-landing .brand-stack.brand-stack--ready .brand-stack__trigger,
+        .page.route-landing .brand-stack.brand-stack--ready .brand-stack__trigger {
+          transition: transform 220ms ease, opacity 180ms ease;
+        }
+
+        body.route-landing .brand-stack:hover .brand-stack__trigger,
+        body.route-landing .brand-stack:focus-within .brand-stack__trigger,
+        .page.route-landing .brand-stack:hover .brand-stack__trigger,
+        .page.route-landing .brand-stack:focus-within .brand-stack__trigger {
+          transform: translateX(calc(var(--brand-stack-collapsed-offset, 0px) * -1));
+        }
+
+        body.route-landing .brand-stack:hover .brand-stack__menu,
+        body.route-landing .brand-stack:focus-within .brand-stack__menu,
+        .page.route-landing .brand-stack:hover .brand-stack__menu,
+        .page.route-landing .brand-stack:focus-within .brand-stack__menu {
+          transform: translate(0, 0);
+        }
+
+        body.route-landing .shell,
+        .page.route-landing .shell {
+          width: min(1560px, calc(100% - 52px));
+          grid-template-columns: minmax(0, 1fr);
+          grid-template-areas: "hero";
+          position: relative;
+        }
+
+        body.route-landing .hero__content,
+        .page.route-landing .hero__content {
+          max-width: 850px;
+          padding-right: 0;
+        }
+
+        body.route-landing .hero,
+        .page.route-landing .hero {
+          display: grid;
+          grid-template-columns: minmax(0, 1fr) var(--landing-hero-video-width);
+          column-gap: var(--landing-hero-gap);
+          row-gap: 22px;
+          align-items: start;
+          padding-top: 0;
+        }
+
+        body.route-landing .hero__media,
+        .page.route-landing .hero__media {
+          display: block;
+          min-width: 0;
+          align-self: stretch;
+          justify-self: end;
+          width: var(--landing-hero-video-width);
+        }
+
+        body.route-landing .hero .proof,
+        .page.route-landing .hero .proof {
+          grid-column: 1 / -1;
+          margin-top: 0;
+        }
+
+        body.route-landing .hero h1,
+        .page.route-landing .hero h1 {
+          max-width: 10.5ch;
+        }
+
+        body.route-landing .hero__lede,
+        .page.route-landing .hero__lede {
+          max-width: 56ch;
+        }
+      }
+
+      @media (max-width: 860px) {
+        .landing-nav-wrap {
+          width: min(100% - 28px, 100%);
+          margin: 0 auto;
+          padding-top: 22px;
+        }
+
+        .shell {
+          width: min(100% - 28px, 100%);
+          display: block;
+        }
+
+        body.route-landing .shell,
+        .page.route-landing .shell {
+          padding-top: 0;
+        }
+
+        .nav {
+          justify-content: flex-start;
+          flex-wrap: wrap;
+          margin-right: 0;
+          padding-top: 0;
+          padding-bottom: 24px;
+        }
+
+        .brand-stack {
+          align-items: flex-start;
+        }
+
+        .brand-stack__menu {
+          position: static;
+          display: none;
+          transform: none;
+          opacity: 1;
+          pointer-events: auto;
+          padding-top: 2px;
+        }
+
+        .brand-stack.is-open .brand-stack__menu {
+          display: grid;
+        }
+
+        .brand-stack__trigger,
+        .brand-stack__item,
+        .brand-stack__item:hover,
+        .brand-stack__item:focus-visible {
+          opacity: 1;
+        }
+
+        .brand-stack:hover .brand-stack__trigger:not(:hover),
+        .brand-stack:focus-within .brand-stack__trigger:not(:focus-visible),
+        .brand-stack:has(.brand-stack__item:hover) .brand-stack__trigger,
+        .brand-stack:has(.brand-stack__item:focus-visible) .brand-stack__trigger,
+        .brand-stack.is-open .brand-stack__trigger {
+          opacity: 1;
+        }
+
+        .cta__row {
+          grid-template-columns: 1fr;
+        }
+
+        .cta__button {
+          width: 100%;
+        }
+
+        .hf-models-launch {
+          display: grid;
+          width: 100%;
+        }
+
+        .hf-models-launch__button {
+          width: 100%;
+        }
+
+        .hf-models-launch__hint {
+          font-size: 0.88rem;
+          line-height: 1.4;
+        }
+
+        .hf-models-page {
+          gap: 16px;
+          padding: 22px 12px 34px;
+        }
+
+        .page.route-hf-models,
+        .page.route-hf-models .shell,
+        .hf-models-page:not(.hf-article-login-page) {
+          max-width: 100vw;
+          overflow-x: hidden;
+        }
+
+        .page.route-hf-article-login,
+        .page.route-hf-article-login .shell,
+        .hf-article-login-page {
+          max-width: 100vw;
+          overflow-x: hidden;
+        }
+
+        .hf-models-shell {
+          gap: 16px;
+          width: 100%;
+        }
+
+        .hf-models-login,
+        .hf-models-loading,
+        .hf-models-dashboard {
+          border-radius: 22px;
+          box-shadow:
+            0 18px 48px rgba(0, 0, 0, 0.28),
+            inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        }
+
+        .hf-models-dashboard {
+          display: flex;
+          flex-direction: column;
+          gap: 16px;
+          padding: 18px 14px;
+        }
+
+        .hf-models-login,
+        .hf-models-loading {
+          padding: 22px 18px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login {
+          zoom: 1;
+          width: 100%;
+          max-width: 100%;
+          min-height: 0;
+          padding: 18px 14px 20px;
+          border-radius: 28px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__layout {
+          grid-template-columns: 1fr;
+          gap: 0;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__copy {
+          gap: 11px;
+          width: 100%;
+          max-width: 100%;
+        }
+
+        .hf-models-login__eyebrow-pill {
+          min-height: 42px;
+          padding: 0 14px 0 8px;
+          gap: 9px;
+          font-size: 0.68rem;
+          letter-spacing: 0.18em;
+        }
+
+        .hf-models-login__eyebrow-icon {
+          width: 30px;
+          height: 30px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login h2 {
+          width: 100%;
+          max-width: 100%;
+          padding-right: 0;
+          font-size: clamp(2.05rem, 10.8vw, 2.95rem);
+          line-height: 1;
+          letter-spacing: -0.072em;
+          white-space: normal;
+          text-wrap: balance;
+          overflow: visible;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login h2 span {
+          padding-right: 0.06em;
+          padding-bottom: 0.1em;
+          margin-bottom: -0.1em;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__lead {
+          font-size: 0.98rem;
+          line-height: 1.45;
+          max-width: 100%;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__allows {
+          font-size: 0.95rem;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__features {
+          max-width: 100%;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature {
+          grid-template-columns: 44px minmax(0, 1fr);
+          gap: 12px;
+          padding: 8px 0;
+          font-size: 0.92rem;
+          line-height: 1.28;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature span {
+          min-width: 0;
+          overflow-wrap: break-word;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature-icon {
+          width: 44px;
+          height: 44px;
+          border-radius: 10px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature img {
+          width: 31px;
+          height: 31px;
+          border-radius: 0;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__feature:first-child img {
+          width: 28px;
+          height: 28px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__visual {
+          display: none;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__actions {
+          display: grid;
+          grid-template-columns: 1fr;
+          gap: 9px;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__button,
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__back {
+          width: 100%;
+          min-width: 0;
+          justify-content: center;
+          white-space: normal;
+        }
+
+        .hf-models-page:not(.hf-article-login-page) .hf-models-login__notice {
+          max-width: 100%;
+          overflow-wrap: break-word;
+        }
+
+        .hf-article-login-page .hf-models-shell,
+        .hf-article-login-page .hf-models-login,
+        .hf-article-login-page .hf-article-login__copy,
+        .hf-article-login-page .hf-article-login__copy p,
+        .hf-article-login-page .hf-article-login__feature-list,
+        .hf-article-login-page .hf-article-login__feature-list li {
+          width: 100%;
+          max-width: 100%;
+          min-width: 0;
+          overflow-wrap: anywhere;
+        }
+
+        .hf-article-login-page .hf-models-login {
+          justify-self: stretch;
+          overflow: hidden;
+          min-height: 0;
+          padding: 22px 16px 24px;
+          border-radius: 28px;
+        }
+
+        .hf-article-login__head {
+          display: grid;
+          justify-content: stretch;
+          gap: 10px;
+        }
+
+        .hf-article-login__head .eyebrow {
+          min-height: 42px;
+          padding: 0 14px 0 10px;
+          gap: 11px;
+          font-size: 0.7rem;
+          letter-spacing: 0.16em;
+        }
+
+        .hf-article-login__head .eyebrow::before {
+          width: 15px;
+          height: 15px;
+        }
+
+        .hf-article-login__layout {
+          grid-template-columns: 1fr;
+          gap: 8px;
+        }
+
+        .hf-article-login__copy-column {
+          gap: 15px;
+          max-width: 100%;
+        }
+
+        .hf-models-login h2,
+        .hf-models-loading h2,
+        .hf-models-dashboard h2 {
+          font-size: clamp(2.1rem, 13vw, 3rem);
+          letter-spacing: -0.08em;
+        }
+
+        .hf-article-login-page .hf-models-login h2 {
+          max-width: 100%;
+          font-size: clamp(2.1rem, 10.8vw, 2.65rem);
+          line-height: 0.95;
+          letter-spacing: -0.085em;
+          overflow-wrap: anywhere;
+          word-break: normal;
+        }
+
+        .hf-article-login-page .hf-models-login h2 strong {
+          overflow-wrap: anywhere;
+          word-break: normal;
+        }
+
+        .hf-models-dashboard h2 {
+          font-size: clamp(2.05rem, 10.5vw, 2.65rem);
+        }
+
+        .hf-article-login.is-invite #hf-article-login-title {
+          font-size: clamp(1.72rem, 9.4vw, 2.55rem);
+          line-height: 0.98;
+          letter-spacing: -0.065em;
+        }
+
+        .hf-article-login__model {
+          max-width: 100%;
+          min-height: 40px;
+          padding: 0 14px;
+          font-size: 0.82rem;
+        }
+
+        .hf-models-login__actions {
+          display: grid;
+          grid-template-columns: 1fr;
+          gap: 9px;
+        }
+
+        .hf-models-login__button,
+        .hf-models-dashboard__button {
+          width: 100%;
+          justify-content: center;
+          min-height: 44px;
+          padding: 0 14px;
+        }
+
+        .hf-article-login__copy {
+          gap: 12px;
+        }
+
+        .hf-article-login__feature-list {
+          gap: 0;
+        }
+
+        .hf-article-login__feature-list li {
+          min-height: 0;
+          padding: 11px 0 11px 32px;
+          line-height: 1.42;
+        }
+
+        .hf-article-login__feature-list li::before {
+          left: 4px;
+          top: 16px;
+          width: 9px;
+          height: 9px;
+        }
+
+        .hf-article-login__example {
+          font-size: 0.94rem;
+          line-height: 1.45;
+        }
+
+        .hf-article-login__visual {
+          min-height: 0;
+          margin: 0 -10px -14px;
+          justify-items: center;
+        }
+
+        .hf-article-login__visual img {
+          width: min(112%, 520px);
+          max-width: none;
+          transform: none;
+        }
+
+        .hf-models-login p,
+        .hf-models-loading p,
+        .hf-models-dashboard__intro,
+        .hf-models-dashboard__notice {
+          font-size: 0.94rem;
+          line-height: 1.45;
+        }
+
+        .hf-models-dashboard__heading {
+          gap: 10px;
+        }
+
+        .hf-models-dashboard__stats {
+          position: sticky;
+          top: max(10px, env(safe-area-inset-top));
+          z-index: 8;
+          display: grid;
+          grid-auto-columns: minmax(92px, 1fr);
+          grid-auto-flow: column;
+          gap: 7px;
+          overflow-x: auto;
+          width: 100%;
+          max-width: 100%;
+          box-sizing: border-box;
+          margin: 0;
+          padding: 8px;
+          border: 1px solid rgba(136, 215, 255, 0.11);
+          border-radius: 22px;
+          background:
+            radial-gradient(circle at 18% 0%, rgba(136, 215, 255, 0.13), transparent 38%),
+            linear-gradient(180deg, rgba(7, 14, 25, 0.94), rgba(4, 9, 17, 0.84));
+          box-shadow:
+            0 18px 42px rgba(0, 0, 0, 0.2),
+            inset 0 1px 0 rgba(255, 255, 255, 0.055);
+          scrollbar-width: none;
+          -webkit-overflow-scrolling: touch;
+          transition:
+            background 180ms ease,
+            border-color 180ms ease,
+            box-shadow 180ms ease;
+        }
+
+        .hf-models-dashboard__stats::-webkit-scrollbar {
+          display: none;
+        }
+
+        .hf-models-dashboard__stats.is-mobile-docked {
+          border-color: rgba(136, 215, 255, 0.17);
+          background:
+            radial-gradient(circle at 18% 0%, rgba(136, 215, 255, 0.16), transparent 40%),
+            linear-gradient(180deg, rgba(7, 14, 25, 0.98), rgba(4, 9, 17, 0.9));
+          box-shadow:
+            0 22px 46px rgba(0, 0, 0, 0.28),
+            inset 0 1px 0 rgba(255, 255, 255, 0.07);
+        }
+
+        .hf-models-dashboard.hf-models-dashboard--stats-docked .hf-models-dashboard__columns {
+          margin-top: 0;
+        }
+
+        .hf-models-dashboard.hf-models-dashboard--stats-docked {
+          --hf-models-column-title-sticky-top: calc(var(--hf-models-stats-dock-gap, 72px) + max(10px, env(safe-area-inset-top)) + 8px);
+        }
+
+        .hf-models-dashboard__stat {
+          grid-template-columns: 1fr;
+          justify-items: start;
+          gap: 2px;
+          min-height: 58px;
+          padding: 8px 10px;
+          border-radius: 18px;
+          font-size: 0.74rem;
+          line-height: 1.12;
+        }
+
+        .hf-models-dashboard__stat-count {
+          min-width: 30px;
+          min-height: 28px;
+          font-size: 0.96rem;
+        }
+
+        .hf-models-dashboard__user {
+          align-items: center;
+          justify-content: flex-start;
+          gap: 10px;
+          padding: 10px;
+          border: 1px solid rgba(136, 215, 255, 0.12);
+          border-radius: 20px;
+          background:
+            radial-gradient(circle at 0% 0%, rgba(136, 215, 255, 0.09), transparent 40%),
+            rgba(4, 11, 20, 0.52);
+          font-size: 0.96rem;
+          line-height: 1.28;
+        }
+
+        .hf-models-dashboard__identity {
+          gap: 6px;
+        }
+
+        .hf-models-dashboard__avatar {
+          width: 50px;
+          height: 50px;
+          flex: 0 0 auto;
+        }
+
+        .hf-models-dashboard__button {
+          width: 100%;
+          min-height: 50px;
+          padding: 0 16px;
+          border-radius: 16px;
+          font-size: 0.96rem;
+          line-height: 1.18;
+          white-space: normal;
+        }
+
+        .hf-models-dashboard__button--secondary {
+          min-height: 54px;
+        }
+
+        .hf-models-dashboard__org-list {
+          gap: 8px;
+        }
+
+        .hf-models-dashboard__org-chip {
+          min-height: 0;
+          padding: 0;
+          font-size: 0.82rem;
+        }
+
+        .hf-models-column {
+          scroll-margin-top: 92px;
+          min-height: 0;
+          gap: 10px;
+          padding: 12px;
+          border-radius: 22px;
+          background:
+            linear-gradient(180deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.024)),
+            rgba(4, 10, 19, 0.58);
+        }
+
+        .hf-models-column h3 {
+          gap: 8px;
+          padding: 9px 10px;
+          font-size: 1.1rem;
+        }
+
+        .hf-models-column h3[data-count]::after {
+          content: attr(data-count);
+          display: inline-grid;
+          place-items: center;
+          min-width: 28px;
+          min-height: 28px;
+          padding: 0 8px;
+          border: 1px solid rgba(136, 215, 255, 0.14);
+          border-radius: 999px;
+          color: rgba(223, 247, 255, 0.72);
+          font-size: 0.78rem;
+          letter-spacing: 0;
+          background: rgba(255, 255, 255, 0.04);
+        }
+
+        .hf-model-card {
+          gap: 9px;
+          padding: 12px;
+          border-radius: 18px;
+          background:
+            radial-gradient(circle at 0% 0%, rgba(136, 215, 255, 0.08), transparent 42%),
+            rgba(2, 8, 16, 0.78);
+        }
+
+        .hf-model-card__repo {
+          font-size: 0.95rem;
+          line-height: 1.16;
+        }
+
+        .hf-model-card__meta {
+          font-size: 0.76rem;
+          line-height: 1.35;
+        }
+
+        .hf-model-card__preview {
+          min-height: 0;
+          height: 144px;
+          max-height: 144px;
+          border-radius: 16px;
+          object-fit: contain;
+          background:
+            radial-gradient(circle at 50% 12%, rgba(136, 215, 255, 0.08), transparent 48%),
+            rgba(255, 255, 255, 0.035);
+        }
+
+        .hf-model-card__preview-link {
+          border-radius: 16px;
+          background: rgba(255, 255, 255, 0.025);
+        }
+
+        .hf-model-card__actions {
+          display: grid;
+          grid-template-columns: repeat(2, minmax(0, 1fr));
+          gap: 7px;
+        }
+
+        .hf-model-card__button {
+          width: 100%;
+          min-height: 42px;
+          padding: 0 10px;
+          font-size: 0.82rem;
+          line-height: 1.16;
+        }
+
+        .hf-model-card[data-dashboard-bucket="not_ready"] .hf-model-card__actions {
+          grid-template-columns: 1fr;
+        }
+
+        .hf-model-card[data-dashboard-bucket="not_ready"] .hf-model-card__button {
+          min-height: 46px;
+        }
+
+        .hf-model-card[data-dashboard-bucket="ready"],
+        .hf-model-card[data-dashboard-bucket="featured"],
+        .hf-model-card[data-dashboard-bucket="bookmarks"] {
+          grid-template-columns: minmax(0, 1fr) minmax(102px, 31%);
+          grid-template-areas:
+            "repo repo"
+            "meta meta"
+            "preview actions";
+          align-items: stretch;
+        }
+
+        .hf-model-card[data-dashboard-bucket="ready"] .hf-model-card__repo,
+        .hf-model-card[data-dashboard-bucket="featured"] .hf-model-card__repo,
+        .hf-model-card[data-dashboard-bucket="bookmarks"] .hf-model-card__repo {
+          grid-area: repo;
+        }
+
+        .hf-model-card[data-dashboard-bucket="ready"] .hf-model-card__meta,
+        .hf-model-card[data-dashboard-bucket="featured"] .hf-model-card__meta,
+        .hf-model-card[data-dashboard-bucket="bookmarks"] .hf-model-card__meta {
+          grid-area: meta;
+        }
+
+        .hf-model-card[data-dashboard-bucket="ready"] .hf-model-card__preview-link,
+        .hf-model-card[data-dashboard-bucket="featured"] .hf-model-card__preview-link,
+        .hf-model-card[data-dashboard-bucket="bookmarks"] .hf-model-card__preview-link {
+          grid-area: preview;
+          display: flex;
+          min-width: 0;
+          min-height: 144px;
+        }
+
+        .hf-model-card[data-dashboard-bucket="ready"] .hf-model-card__actions,
+        .hf-model-card[data-dashboard-bucket="featured"] .hf-model-card__actions,
+        .hf-model-card[data-dashboard-bucket="bookmarks"] .hf-model-card__actions {
+          grid-area: actions;
+          grid-template-columns: 1fr;
+          grid-auto-rows: minmax(0, 1fr);
+          align-content: stretch;
+          height: 100%;
+          min-width: 0;
+        }
+
+        .hf-model-card[data-dashboard-bucket="ready"] .hf-model-card__button,
+        .hf-model-card[data-dashboard-bucket="featured"] .hf-model-card__button,
+        .hf-model-card[data-dashboard-bucket="bookmarks"] .hf-model-card__button {
+          min-height: 0;
+          height: 100%;
+          padding: 8px 8px;
+          flex-direction: column;
+        }
+
+        .hf-models-login__actions {
+          display: grid;
+          grid-template-columns: 1fr;
+        }
+
+        .hf-models-login__actions .hf-models-login__button,
+        .hf-models-login__actions .hf-models-login__back {
+          width: 100%;
+        }
+
+        .hf-models-dashboard__top {
+          display: grid;
+          gap: 12px;
+        }
+
+        .hf-models-dashboard__columns {
+          grid-template-columns: 1fr;
+        }
+
+        body.route-landing .cta__sub,
+        .page.route-landing .cta__sub {
+          display: none;
+        }
+
+        .proof {
+          grid-template-columns: 1fr;
+        }
+
+        .proof__extension-panel {
+          display: none;
+        }
+
+        .can-install-chrome-extension .proof__extension-panel {
+          display: none;
+        }
+
+        .proof__embed-panel {
+          display: grid;
+        }
+
+        .can-install-chrome-extension .proof__embed-panel {
+          display: grid;
+        }
+
+        .proof-embed__button {
+          width: 100%;
+        }
+
+        .products-grid {
+          grid-template-columns: 1fr;
+        }
+
+        .blogs-with-graphs {
+          margin-top: 44px;
+        }
+
+        .blogs-with-graphs__head {
+          grid-template-columns: 1fr;
+          align-items: start;
+          justify-content: start;
+        }
+
+        .blogs-with-graphs__write {
+          justify-self: start;
+          align-self: start;
+          min-height: 44px;
+          padding-right: 16px;
+          font-size: 0.88rem;
+        }
+
+        .blogs-with-graphs__carousel {
+          margin-right: -18px;
+        }
+
+        .blogs-with-graphs__rail {
+          gap: 14px;
+          padding: 10px 18px 74px 0;
+          scroll-padding-inline: 0 18px;
+          scroll-snap-type: x mandatory;
+          scrollbar-width: none;
+        }
+
+        .blogs-with-graphs__rail::-webkit-scrollbar {
+          display: none;
+        }
+
+        .blogs-with-graphs__card {
+          flex-basis: min(84vw, 340px);
+          min-height: 414px;
+          border-radius: 24px;
+        }
+
+        .blogs-with-graphs__image-wrap {
+          --blogs-figure-height: 224px;
+          min-height: 0;
+          height: var(--blogs-figure-height);
+          margin: 12px 12px 0;
+          border-radius: 20px;
+        }
+
+        .blogs-with-graphs__image-wrap--compact {
+          min-height: 0;
+          height: var(--blogs-figure-height);
+        }
+
+        .blogs-with-graphs__image {
+          height: 224px;
+        }
+
+        .blogs-with-graphs__image--deepseek {
+          height: 224px;
+        }
+
+        .blogs-with-graphs__live {
+          min-height: 224px;
+          padding: 0;
+        }
+
+        .blogs-with-graphs__image-wrap--compact .blogs-with-graphs__live {
+          min-height: 224px;
+          padding: 0;
+        }
+
+        .blogs-with-graphs__live--deepseek {
+          min-height: 224px;
+        }
+
+        .blogs-with-graphs__live--gemma {
+          min-height: 224px;
+        }
+
+        .blogs-with-graphs__figure {
+          min-height: 224px;
+          height: 224px;
+        }
+
+        .blogs-with-graphs__figure .dsv4-res {
+          width: 124%;
+        }
+
+        .blogs-with-graphs__figure .dsv4-res .dsv4-scroll {
+          height: 224px;
+        }
+
+        .blogs-with-graphs__figure .dsv4-res svg {
+          width: 112%;
+          height: 218px;
+        }
+
+        .blogs-with-graphs__figure--gemma .viewer-editorial__attention-svg {
+          width: 118%;
+          height: 238px;
+          margin: -4px -14.5% -4px -3.5%;
+          transform: translateY(16px);
+        }
+
+        .blogs-heatmap-preview {
+          --borealis-heat-cell: clamp(29px, 9vw, 35px);
+          min-height: 224px;
+          height: 224px;
+          padding: 12px 10px;
+        }
+
+        .blogs-heatmap-preview__grid {
+          grid-template-columns: minmax(42px, 52px) repeat(6, var(--borealis-heat-cell));
+        }
+
+        .blogs-graph-preview {
+          min-height: 190px;
+        }
+
+        .blogs-graph-preview__card {
+          min-height: 190px;
+          padding: 11px;
+        }
+
+        .blogs-graph-preview__flow {
+          grid-template-columns: 1fr;
+          grid-template-rows: none;
+        }
+
+        .blogs-graph-preview__node,
+        .blogs-graph-preview__edge {
+          grid-column: 1 !important;
+          grid-row: auto !important;
+        }
+
+        .blogs-graph-preview__edge {
+          width: 3px;
+          height: 16px;
+          justify-self: center;
+          background: linear-gradient(180deg, rgba(var(--edge-a), 0.72), rgba(var(--edge-b), 0.9));
+        }
+
+        .blogs-graph-preview__edge::after {
+          right: 50%;
+          top: auto;
+          bottom: -2px;
+          transform: translateX(50%) rotate(135deg);
+        }
+
+        .blogs-heatmap-preview {
+          --borealis-heat-cell: clamp(20px, 5.7vw, 25px);
+          min-height: 164px;
+          padding: 10px;
+          border-radius: 18px;
+        }
+
+        .blogs-heatmap-preview__head {
+          gap: 6px;
+        }
+
+        .blogs-heatmap-preview__title {
+          font-size: 10.5px;
+        }
+
+        .blogs-heatmap-preview__note {
+          font-size: 6.5px;
+        }
+
+        .blogs-heatmap-preview__grid {
+          grid-template-columns: minmax(48px, 58px) repeat(6, var(--borealis-heat-cell));
+          gap: 3px;
+        }
+
+        .blogs-heatmap-preview__label {
+          padding: 0 5px;
+          font-size: 6.4px;
+        }
+
+        .blogs-heatmap-preview__label--head,
+        .blogs-heatmap-preview__cell--head {
+          font-size: 5.2px;
+        }
+
+        .blogs-heatmap-preview__cell {
+          border-radius: 7px;
+          font-size: 6.1px;
+        }
+
+        .blogs-graph-preview--deepseek .blogs-graph-preview__card {
+          min-height: 220px;
+        }
+
+        .blogs-graph-preview--deepseek .blogs-graph-preview__mini-flow {
+          grid-template-columns: 1fr;
+        }
+
+        .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__body,
+        .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__card,
+        .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__body,
+        .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__body {
+          grid-template-columns: minmax(0, 1fr);
+          padding: 15px 17px 19px;
+        }
+
+        .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__kicker,
+        .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__title,
+        .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__open,
+        .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__meta,
+        .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__image-wrap,
+        .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__body,
+        .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__meta,
+        .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__kicker,
+        .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__title,
+        .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__open,
+        .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__meta,
+        .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__kicker,
+        .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__title,
+        .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__open,
+        .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__meta {
+          grid-column: auto;
+          grid-row: auto;
+        }
+
+        .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__meta,
+        .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__meta,
+        .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__meta,
+        .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__meta {
+          flex-direction: row;
+          justify-self: start;
+          text-align: left;
+        }
+
+        .blogs-with-graphs--variant-signature-rail .blogs-with-graphs__meta::before,
+        .blogs-with-graphs--variant-byline-orbit .blogs-with-graphs__meta::before {
+          display: none;
+        }
+
+        .blogs-with-graphs--variant-author-halo .blogs-with-graphs__meta,
+        .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__meta {
+          position: static;
+          width: auto;
+          flex-direction: row;
+          align-items: center;
+          text-align: left;
+        }
+
+        .blogs-with-graphs--variant-author-halo .blogs-with-graphs__body {
+          padding-top: 18px;
+        }
+
+        .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__image-wrap,
+        .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__image-wrap,
+        .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__image-wrap {
+          margin: 12px 12px 0;
+          border-radius: 19px;
+        }
+
+        .blogs-with-graphs--variant-author-halo .blogs-with-graphs__avatar,
+        .blogs-with-graphs--variant-corner-portrait .blogs-with-graphs__avatar,
+        .blogs-with-graphs--variant-editorial-cutout .blogs-with-graphs__avatar,
+        .blogs-with-graphs--variant-studio-plate .blogs-with-graphs__avatar {
+          width: 68px;
+          min-width: 68px;
+          height: 68px;
+          min-height: 68px;
+        }
+
+        .blogs-with-graphs__body {
+          padding: 15px 17px 19px;
+        }
+
+        .blogs-with-graphs__title {
+          max-width: 17ch;
+          font-size: 1.3rem;
+        }
+
+        .community-showcase {
+          margin-top: -20px;
+        }
+
+        .community-showcase__head {
+          align-items: start;
+        }
+
+        .community-showcase__title-row {
+          grid-template-columns: 1fr;
+          align-items: start;
+          justify-content: start;
+        }
+
+        .community-showcase__embed-cta {
+          justify-self: start;
+          align-self: start;
+        }
+
+        .community-showcase__carousel {
+          margin-right: -18px;
+        }
+
+        .community-showcase__rail {
+          gap: 14px;
+          padding: 2px 18px 16px 0;
+          scroll-padding-inline: 0 18px;
+          scroll-snap-type: x mandatory;
+          scrollbar-width: none;
+        }
+
+        .community-showcase__rail::-webkit-scrollbar {
+          display: none;
+        }
+
+        .community-showcase__pager {
+          display: none;
+        }
+
+        .community-card {
+          --community-card-panel-height: 424px;
+          --community-card-top-height: 58px;
+          --community-card-summary-min-height: 104px;
+          --community-card-embed-min-height: 188px;
+          flex-basis: min(76vw, 330px);
+          padding: 16px;
+          border-radius: 22px;
+          scroll-snap-align: start;
+        }
+
+        .community-card__summary {
+          font-size: 0.9rem;
+        }
+
+        .community-card__embed {
+          flex-basis: 286px;
+        }
+
+        .community-card__panel {
+          height: 424px;
+        }
+
+        .community-card__tabs {
+          gap: 14px;
+          overflow: hidden;
+          white-space: nowrap;
+        }
+
+        .community-card__hf-row {
+          grid-template-columns: minmax(0, 1fr) max-content;
+        }
+
+        .community-card__hf-commit,
+        .community-card__hf-row--head .community-card__hf-size {
+          display: none;
+        }
+
+        .all-route__head {
+          align-items: flex-start;
+        }
+
+        .gallery {
+          column-count: 2;
+        }
+
+        .all-grid {
+          column-count: 2;
+        }
+
+        .hero h1 {
+          font-size: clamp(3.2rem, 15vw, 4.8rem);
+        }
+
+        .viewer-route__title {
+          --viewer-route-title-max-height: 76px;
+          --viewer-route-title-min-font-size: 10px;
+          font-size: var(--viewer-route-title-fit-size, clamp(2.2rem, 10vw, 3.4rem));
+        }
+
+        .viewer-route__head {
+          position: relative;
+          align-items: center;
+          min-height: 72px;
+        }
+
+        .viewer-route__intro,
+        .viewer-route__actions {
+          transition: opacity 180ms ease, transform 180ms ease;
+        }
+
+        .viewer-route__mobile-selection {
+          position: absolute;
+          inset: 0;
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          gap: 6px;
+          opacity: 0;
+          pointer-events: none;
+          transform: translateY(6px);
+          transition: opacity 180ms ease, transform 180ms ease;
+        }
+
+        .viewer-route__mobile-selection-label {
+          color: var(--muted);
+          font-size: 0.72rem;
+          letter-spacing: 0.14em;
+          text-transform: uppercase;
+        }
+
+        .viewer-route__mobile-selection-name {
+          font-family: "Space Grotesk", sans-serif;
+          font-size: clamp(1.08rem, 4.6vw, 1.34rem);
+          line-height: 1.08;
+          letter-spacing: -0.03em;
+          color: var(--text);
+          white-space: normal;
+          overflow: visible;
+          text-overflow: clip;
+          overflow-wrap: anywhere;
+          word-break: normal;
+        }
+
+        .viewer-route__mobile-selection-copy {
+          font-size: clamp(1.08rem, 4.6vw, 1.34rem);
+        }
+
+        .viewer-route__mobile-selection-expand {
+          font-size: 0.62rem;
+        }
+
+        .viewer-route__mobile-selection-name-segment {
+          display: inline;
+        }
+
+        /* expanded glossary: the panel leaves overlay mode - the faded intro
+           underneath stops sizing the head, the content defines the height and
+           the graph rises to absorb what used to be dead space. If the panel
+           would still get too tall, the NODE header row steps aside too. */
+        .viewer-route__head.has-glossary-expanded {
+          min-height: 0;
+        }
+        .viewer-route__head.has-glossary-expanded .viewer-route__intro,
+        .viewer-route__head.has-glossary-expanded .viewer-route__actions,
+        .viewer-route__head.has-glossary-expanded .viewer-route__mobile-backlink {
+          display: none;
+        }
+        .viewer-route__head.has-glossary-expanded .viewer-route__mobile-selection {
+          position: static;
+          inset: auto;
+          flex: 1 1 100%;
+          width: 100%;
+          justify-content: flex-start;
+        }
+        .viewer-route__mobile-selection.is-glossary-maximized .viewer-route__mobile-selection-label,
+        .viewer-route__mobile-selection.is-glossary-maximized .viewer-route__mobile-selection-name-row {
+          display: none;
+        }
+
+        .viewer-route__head.viewer-route__head--mobile-selection-active .viewer-route__intro,
+        .viewer-route__head.viewer-route__head--mobile-selection-active .viewer-route__actions {
+          opacity: 0;
+          transform: translateY(-8px);
+          pointer-events: none;
+        }
+
+        .viewer-route__head.viewer-route__head--mobile-selection-active .viewer-route__mobile-selection {
+          opacity: 1;
+          transform: none;
+          pointer-events: auto;
+        }
+
+        .viewer-route__mobile-backlink {
+          position: absolute;
+          inset: 0 102px 0 0;
+          display: block;
+          opacity: 0;
+          pointer-events: none;
+          transition: opacity 180ms ease;
+        }
+
+        .viewer-route__head.viewer-route__head--mobile-backlink-active .viewer-route__intro {
+          opacity: 0;
+          transform: translateY(-8px);
+          pointer-events: none;
+        }
+
+        .viewer-route__head.viewer-route__head--mobile-backlink-active .viewer-route__mobile-selection {
+          opacity: 0;
+          transform: translateY(6px);
+          pointer-events: none;
+        }
+
+        .viewer-route__head.viewer-route__head--mobile-backlink-active .viewer-route__mobile-backlink {
+          opacity: 1;
+          pointer-events: auto;
+          cursor: pointer;
+        }
+
+        .viewer-route__head.viewer-route__head--mobile-backlink-active ~ .viewer-blog-float {
+          display: none !important;
+        }
+
+        .page.route-viewer-family .viewer-route__blog-link,
+        .page.route-viewer.viewer-community-article-active .viewer-route__blog-link {
+          display: inline-flex;
+        }
+
+        .viewer-route__head.viewer-route__head--mobile-backlink-back-active .viewer-route__mobile-backlink-state--back,
+        .viewer-route__head.viewer-route__head--mobile-backlink-node-active .viewer-route__mobile-backlink-state--node {
+          opacity: 1;
+          transform: none;
+        }
+
+        .viewer-route__actions .pill {
+          font-size: 0.82rem;
+        }
+
+        .page.route-viewer-family .viewer-route__actions {
+          width: 100%;
+          align-items: center;
+          justify-content: flex-start;
+        }
+
+        .page.route-viewer-family .viewer-route__actions #viewer-hf-link,
+        .page.route-viewer-family .viewer-route__actions #viewer-model-card-btn {
+          display: none;
+        }
+
+        #viewer-write-article-btn,
+        #viewer-community-article-write {
+          display: none;
+        }
+
+        body.route-viewer-article #viewer-write-article-btn,
+        body.route-viewer-article #viewer-community-article-write {
+          display: none !important;
+        }
+
+        .page.route-viewer-family .viewer-family-size--mobile {
+          display: inline-flex;
+          flex: 1 1 auto;
+          max-width: calc(100% - 56px);
+          justify-content: space-between;
+          padding: 0;
+          border: 0;
+          background: transparent;
+          box-shadow: none;
+        }
+
+        .page.route-viewer-family .viewer-family-size--mobile .viewer-family-size__slider {
+          flex: 1 1 auto;
+          min-width: 0;
+          max-width: 148px;
+        }
+
+        body.route-viewer.route-viewer-family {
+          overflow-y: auto;
+        }
+
+        .page.route-viewer.route-viewer-family {
+          height: auto;
+          overflow: visible;
+        }
+
+        .page.route-viewer.route-viewer-family .shell {
+          height: auto;
+          min-height: 100dvh;
+          padding-bottom: 28px;
+        }
+
+        .page.route-viewer.route-viewer-family .viewer-frame__canvas {
+          min-height: clamp(360px, 58vh, 620px);
+        }
+
+        body.route-viewer.viewer-notify-active {
+          overflow-y: auto;
+        }
+
+        body.route-viewer.viewer-notify-active .page.route-viewer {
+          height: auto;
+          min-height: 100dvh;
+          overflow: visible;
+        }
+
+        body.route-viewer.viewer-notify-active .page.route-viewer .shell {
+          height: auto;
+          min-height: 100dvh;
+        }
+
+        body.route-viewer.viewer-notify-active .page.route-viewer .viewer-route,
+        body.route-viewer.viewer-notify-active .page.route-viewer .viewer-frame {
+          flex: 0 0 auto;
+        }
+
+        body.route-viewer.viewer-notify-active .page.route-viewer .viewer-frame__canvas {
+          min-height: clamp(344px, 50dvh, 500px);
+        }
+
+        .viewer-editorial {
+          gap: 18px;
+          padding: 22px 20px 24px;
+          border-radius: 24px;
+        }
+
+        .viewer-editorial__deck,
+        .viewer-editorial__question-grid,
+        .viewer-editorial__member-grid,
+        .viewer-editorial__level-grid,
+        .viewer-editorial__trail-grid,
+        .viewer-editorial__myth-grid,
+        .viewer-editorial__compare-grid,
+        .viewer-editorial__faq-grid,
+        .viewer-editorial__claim-grid,
+        .viewer-editorial__meaning-grid,
+        .viewer-editorial__body {
+          grid-template-columns: 1fr;
+        }
+
+        .viewer-editorial__aside {
+          position: static;
+        }
+
+        .viewer-editorial__sections {
+          gap: 26px;
+        }
+
+        .viewer-editorial__section {
+          padding: 0;
+          border: 0;
+          border-radius: 0;
+          background: none;
+          box-shadow: none;
+        }
+
+        .viewer-editorial__section + .viewer-editorial__section {
+          padding-top: 24px;
+          border-top: 1px solid rgba(255, 255, 255, 0.08);
+        }
+
+        .viewer-editorial__section-copy {
+          gap: 12px;
+        }
+
+        .viewer-editorial__section-title {
+          font-size: 1.16rem;
+        }
+
+        .viewer-editorial__title {
+          font-size: clamp(1.72rem, 8vw, 2.52rem);
+        }
+
+        .viewer-editorial__byline {
+          align-items: center;
+          margin: 4px 0 6px;
+        }
+
+        .viewer-editorial__lede,
+        .viewer-editorial__paragraph {
+          font-size: 0.94rem;
+          line-height: 1.72;
+        }
+
+        .viewer-editorial__deployment-filter {
+          min-height: 34px;
+          padding-inline: 12px;
+          font-size: 0.74rem;
+        }
+
+        .viewer-editorial__deployment-table {
+          min-width: 760px;
+        }
+
+        .viewer-editorial__deployment-table thead th,
+        .viewer-editorial__deployment-table tbody td {
+          padding: 12px 14px;
+        }
+
+        .viewer-editorial__sources-list {
+          font-size: 0.84rem;
+        }
+
+        .newsletter-card {
+          grid-template-columns: 1fr;
+          justify-items: center;
+          gap: 16px;
+          padding: 22px 18px;
+          text-align: center;
+        }
+
+        .newsletter-card__avatar {
+          width: 78px;
+          height: 78px;
+        }
+
+        .newsletter-form,
+        .newsletter-card .newsletter-form {
+          width: 100%;
+          display: grid;
+        }
+
+        .newsletter-form__input,
+        .newsletter-form__button {
+          width: 100%;
+        }
+
+        .newsletter-modal {
+          align-items: center;
+          padding:
+            calc(14px + env(safe-area-inset-top, 0px))
+            14px
+            calc(14px + env(safe-area-inset-bottom, 0px));
+        }
+
+        .newsletter-modal__card {
+          padding: 28px 20px 22px;
+          border-radius: 26px;
+        }
+
+        .newsletter-modal__avatar {
+          width: 82px;
+          height: 82px;
+        }
+
+        .viewer-editorial__attention-figure {
+          margin-inline: -16px;
+          padding: 20px 0 18px;
+          border-radius: 20px;
+        }
+
+        .viewer-editorial__section--attention {
+          padding-inline: 0;
+        }
+
+        .viewer-editorial__section--attention .viewer-editorial__section-copy {
+          gap: 14px;
+        }
+
+        .viewer-editorial__attention-svg {
+          width: calc(100% + 32px);
+          margin-left: -16px;
+        }
+
+        .viewer-editorial__attention-svg .attention-figure__title,
+        .viewer-editorial__attention-svg .attention-figure__subtitle,
+        .viewer-editorial__attention-svg .attention-figure__scale--desktop {
+          display: none;
+        }
+
+        .viewer-editorial__attention-svg .attention-figure__title--mobile,
+        .viewer-editorial__attention-svg .attention-figure__subtitle--mobile,
+        .viewer-editorial__attention-svg .attention-figure__scale--mobile {
+          display: inline;
+        }
+
+        .viewer-editorial__attention-svg .attention-figure__title--mobile {
+          font-size: 32px;
+          letter-spacing: 2.2px;
+        }
+
+        .viewer-editorial__attention-svg .attention-figure__subtitle--mobile {
+          font-size: 15px;
+          letter-spacing: 1.4px;
+        }
+
+        .viewer-editorial__attention-svg .attention-figure__row-label {
+          font-size: 18px;
+        }
+
+        .viewer-editorial__attention-svg .attention-figure__row-hint,
+        .viewer-editorial__attention-svg .attention-figure__scale-label,
+        .viewer-editorial__attention-svg .attention-figure__scale-note {
+          font-size: 13px;
+        }
+
+        .viewer-editorial__attention-svg .attention-figure__repeat-label {
+          font-size: 20px;
+          letter-spacing: 1.2px;
+        }
+
+        .viewer-editorial__attention-svg .attention-figure__ratio {
+          font-size: 22px;
+        }
+
+        .viewer-editorial__attention-svg .attention-figure__scene--desktop {
+          display: none;
+        }
+
+        .viewer-editorial__attention-svg .attention-figure__scene--mobile {
+          display: block;
+        }
+
+        .viewer-editorial__attention-caption {
+          font-size: 0.9rem;
+          line-height: 1.62;
+          padding-inline: 20px;
+        }
+
+        .viewer-editorial__attention-meta {
+          padding-inline: 20px;
+        }
+
+        .viewer-editorial__attention-pill {
+          font-size: 0.78rem;
+        }
+
+        .viewer-crosslink-portal {
+          width: 82px;
+          height: 82px;
+        }
+
+        .viewer-crosslink-portal--sample {
+          width: 82px;
+          height: 82px;
+        }
+
+        .viewer-frame__bar {
+          gap: 12px;
+          padding: 13px 14px;
+        }
+
+        .viewer-frame__status {
+          flex: 0 0 auto;
+          min-width: 0;
+          white-space: nowrap;
+          font-size: 0.76rem;
+        }
+
+        .viewer-frame__bar .viewer-granularity {
+          margin-left: 0;
+          flex: 0 1 auto;
+          min-width: 0;
+          width: auto;
+        }
+
+        /* The compact bar has no room for the nav pills; mobile falls back
+           to in-graph gestures (desktop always shows them). */
+        .viewer-frame__bar .viewer-nav-history {
+          display: none;
+        }
+
+        .viewer-granularity {
+          width: auto;
+          justify-content: flex-start;
+        }
+
+        .viewer-granularity__value {
+          display: none;
+        }
+
+        .viewer-granularity__slider {
+          flex: 0 1 96px;
+          min-width: 0;
+          width: 92px;
+          max-width: 104px;
+        }
+
+        .pill--home {
+          width: 44px;
+          height: 44px;
+          padding: 0;
+          justify-content: center;
+          gap: 0;
+          background: transparent;
+          border-color: transparent;
+          box-shadow: none;
+          color: var(--text);
+        }
+
+        .pill--home::before {
+          content: none;
+        }
+
+        .pill--home .pill__icon--desktop {
+          display: none;
+        }
+
+        .pill--home .pill__label--desktop {
+          display: none;
+        }
+
+        .pill--home .pill__label--mobile-arrow {
+          display: inline;
+          font-size: 1.18rem;
+          line-height: 1;
+        }
+
+        .pill--home:hover,
+        .pill--home:focus-visible,
+        .pill--home:active {
+          background: rgba(255, 255, 255, 0.06);
+          border-color: var(--stroke-strong);
+        }
+
+        .pill--hf-link {
+          gap: 8px;
+        }
+
+        .pill--hf-link::before {
+          content: none;
+        }
+
+        .pill--hf-link .pill__icon {
+          display: inline-flex;
+          width: 18px;
+          height: 18px;
+          color: #ffffff;
+        }
+
+        .pill--hf-link .pill__label--desktop {
+          display: none;
+        }
+
+        .hero {
+          padding-top: 28px;
+        }
+
+        body.route-landing .hero__media,
+        .page.route-landing .hero__media {
+          display: block;
+          width: 100%;
+          margin: 18px 0 0;
+        }
+
+        body.route-landing .hero-video-card,
+        .page.route-landing .hero-video-card {
+          border-radius: 30px;
+          box-shadow:
+            0 30px 82px rgba(0, 0, 0, 0.42),
+            0 0 0 1px rgba(255, 255, 255, 0.07),
+            0 0 60px rgba(136, 215, 255, 0.1);
+        }
+
+        body.route-landing .hero-video-card__inner,
+        .page.route-landing .hero-video-card__inner {
+          border-radius: 29px;
+        }
+
+        body.route-landing .hero-video-card__video,
+        .page.route-landing .hero-video-card__video {
+          width: 100%;
+          height: auto;
+          aspect-ratio: 129 / 198;
+          object-fit: contain;
+          object-position: center;
+        }
+
+        body.route-landing #cta-model-card-btn,
+        .page.route-landing #cta-model-card-btn {
+          display: none;
+        }
+
+        .gallery-card__family-strip {
+          grid-template-columns: repeat(2, minmax(0, 1fr));
+        }
+      }
+
+      @media (min-width: 861px) {
+        .viewer-route__head {
+          flex-wrap: nowrap;
+        }
+
+        .page.route-viewer-family .viewer-route__head {
+          position: relative;
+          align-items: center;
+          min-height: 92px;
+        }
+
+        .page.route-viewer-family .viewer-route__intro {
+          transition: opacity 180ms ease, transform 180ms ease;
+        }
+
+        .page.route-viewer-family .viewer-route__mobile-selection {
+          position: absolute;
+          inset: 0 72px 0 0;
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          gap: 7px;
+          opacity: 0;
+          pointer-events: none;
+          transform: translateY(6px);
+          transition: opacity 180ms ease, transform 180ms ease;
+        }
+
+        .page.route-viewer-family .viewer-route__mobile-selection-label {
+          color: var(--muted);
+          font-size: 0.74rem;
+          letter-spacing: 0.14em;
+          text-transform: uppercase;
+        }
+
+        .page.route-viewer-family .viewer-route__mobile-selection-name {
+          max-width: min(980px, 100%);
+          font-family: "Inter", sans-serif;
+          font-size: clamp(1.35rem, 3.1vw, 2.45rem);
+          line-height: 1.02;
+          letter-spacing: -0.045em;
+          color: var(--text);
+          overflow-wrap: anywhere;
+        }
+
+        .page.route-viewer-family .viewer-route__mobile-selection-copy {
+          font-size: clamp(1.35rem, 3.1vw, 2.45rem);
+        }
+
+        .page.route-viewer-family .viewer-route__mobile-selection-expand {
+          font-size: 0.68rem;
+          padding: 0.46rem 0.82rem;
+        }
+
+        .page.route-viewer-family
+          .viewer-route__head.viewer-route__head--mobile-selection-active
+          .viewer-route__intro {
+          opacity: 0;
+          transform: translateY(-8px);
+          pointer-events: none;
+        }
+
+        .page.route-viewer-family
+          .viewer-route__head.viewer-route__head--mobile-selection-active
+          .viewer-route__mobile-selection {
+          opacity: 1;
+          transform: none;
+          pointer-events: auto;
+        }
+
+        .page.route-viewer-family .viewer-route__mobile-backlink {
+          position: absolute;
+          inset: 0 108px 0 0;
+          display: block;
+          opacity: 0;
+          pointer-events: none;
+          transition: opacity 180ms ease;
+        }
+
+        .page.route-viewer-family
+          .viewer-route__head.viewer-route__head--mobile-backlink-active
+          .viewer-route__intro {
+          opacity: 0;
+          transform: translateY(-8px);
+          pointer-events: none;
+        }
+
+        .page.route-viewer-family
+          .viewer-route__head.viewer-route__head--mobile-backlink-active
+          .viewer-route__mobile-selection {
+          opacity: 0;
+          transform: translateY(6px);
+          pointer-events: none;
+        }
+
+        .page.route-viewer-family
+          .viewer-route__head.viewer-route__head--mobile-backlink-active
+          .viewer-route__mobile-backlink {
+          opacity: 1;
+        }
+
+        .page.route-viewer-family
+          .viewer-route__head.viewer-route__head--mobile-backlink-back-active
+          .viewer-route__mobile-backlink-state--back,
+        .page.route-viewer-family
+          .viewer-route__head.viewer-route__head--mobile-backlink-node-active
+          .viewer-route__mobile-backlink-state--node {
+          opacity: 1;
+          transform: none;
+        }
+
+        .viewer-route__title {
+          white-space: nowrap;
+        }
+
+        .page.route-viewer-family .viewer-family-size--mobile {
+          display: none;
+        }
+
+        .page.route-viewer-family .viewer-family-size--desktop {
+          display: inline-flex;
+        }
+
+        .page.route-viewer-family #viewer-hf-link,
+        .page.route-viewer-family #viewer-model-card-btn {
+          display: none;
+        }
+
+        .page.route-viewer-family .viewer-route__blog-pill,
+        .page.route-viewer.viewer-community-article-active .viewer-route__blog-pill {
+          display: inline-flex;
+        }
+
+        .page.route-viewer.route-viewer-family .viewer-frame__canvas {
+          min-height: clamp(500px, 66vh, 820px);
+        }
+
+        .viewer-editorial__body {
+          grid-template-columns: minmax(0, 1.34fr) minmax(260px, 0.82fr);
+        }
+      }
+
+      @media (max-width: 620px) {
+        .gallery {
+          column-count: 1;
+        }
+
+        .all-grid {
+          column-count: 1;
+        }
+      }
+
+      .laser-layer {
+        position: fixed;
+        inset: 0;
+        z-index: 260;
+        display: none;
+        pointer-events: none;
+      }
+
+      body.laser-active .laser-layer {
+        display: block;
+      }
+
+      body.laser-active,
+      body.laser-active * {
+        cursor: none !important;
+      }
+
+      body.laser-active iframe {
+        pointer-events: none !important;
+      }
+    
\ No newline at end of file