
@layer responsive {
  @media (min-width: 2000px) and (min-height: 1100px) {
    .identity-gate__art > *,
    .identity-gate__content > .identity-card {
      zoom: 1.18;
    }

    .identity-gate {
      padding-inline: clamp(110px, 7vw, 220px);
    }
  }

  @media (min-width: 2800px) and (min-height: 1500px) {
    .identity-gate__art > *,
    .identity-gate__content > .identity-card {
      zoom: 1.4;
    }

    .identity-gate__foot,
    .identity-gate__rail {
      zoom: 1.18;
    }
  }

  @media (min-width: 3600px) and (min-height: 1900px) {
    .identity-gate__art > *,
    .identity-gate__content > .identity-card {
      zoom: 1.55;
    }
  }

  @media (max-width: 1260px) {
    :root {
      --sidebar-width: 224px;
    }

    .capacity-panel { grid-column: span 7; }
    .metric-stack { grid-column: span 5; grid-template-columns: repeat(3, 1fr); }
    .metric-card { min-height: 170px; }
    .route-panel { grid-column: span 12; min-height: 480px; }
    .route-map { max-width: 760px; margin-inline: auto; }
    .provider-list { grid-template-columns: repeat(2, 1fr); }
    .provider-row:nth-child(odd) { border-right: 1px solid var(--line); padding-right: 18px; }
    .provider-row:nth-child(even) { padding-left: 18px; }
    .activity-panel { grid-column: span 8; }
    .notice-panel { grid-column: span 4; }
    .quick-panel { grid-column: span 12; }
    .model-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @media (max-width: 980px) {
    :root {
      --sidebar-width: 232px;
      --topbar-height: 64px;
    }

    .app-shell { display: block; }
    .workspace { width: 100%; }
    .workspace::before {
      position: fixed;
      z-index: 45;
      inset: 0;
      background: rgba(2, 6, 7, 0.68);
      content: "";
      opacity: 0;
      pointer-events: none;
      transition: opacity 260ms ease;
    }
    body.nav-open .workspace::before { opacity: 1; pointer-events: auto; }
    .sidebar { transform: translateX(-105%); box-shadow: 24px 0 80px rgba(0, 0, 0, 0.38); }
    .sidebar.is-open { transform: translateX(0); }
    .topbar { padding-inline: 18px; }
    .profile-menu { right: 18px; }
    .menu-button { display: flex; width: 40px; height: 40px; align-items: center; justify-content: center; flex-direction: column; gap: 6px; border: 1px solid var(--line); }
    .menu-button span { width: 16px; height: 1px; background: var(--text-1); }
    .breadcrumb { margin-right: auto; }
    .command-button { min-width: 40px; width: 40px; justify-content: center; padding: 0; }
    .command-button span, .command-button kbd { display: none; }
    .network-pill { display: none; }
    .view { padding-inline: 20px; }
    .page-masthead { gap: 24px; grid-template-columns: minmax(180px, .62fr) minmax(300px, 1.2fr) minmax(120px, .34fr); }
    .hero-signature { width: min(100%, 235px); }
    .signature-caption span { display: none; }
    .model-toolbar { flex-wrap: wrap; padding: 14px; }
    .search-field { width: 100%; min-width: 0; border-right: 0; border-bottom: 1px solid var(--line); }
    .model-toolbar .filter-group { margin-right: auto; }
    .credential-card, .endpoint-card { grid-column: span 12; }
    .create-key-card, .security-note { grid-column: span 6; }
    .identity-gate {
      padding-inline: 64px 46px;
      column-gap: 22px;
      grid-template-columns: minmax(290px, 0.7fr) minmax(460px, 1.3fr);
    }
    .identity-art__signature { width: min(100%, 292px); }
    .identity-geometry { left: -66px; width: min(43vw, 490px); }
    .identity-art__note { bottom: 7%; }
    .identity-card { width: min(100%, 570px); padding-left: 58px; }
    .identity-gate__foot { right: 46px; left: 64px; }
  }

  /* 窄平板提前重组页首，避免第三列的数据章越出画布。 */
  @media (max-width: 820px) {
    .page-masthead { min-height: 0; align-items: center; gap: 16px 18px; padding: 8px 0 22px; grid-template-columns: minmax(0, 1fr) auto; }
    .page-masthead--sacred { min-height: 0; padding-top: 12px; }
    .masthead-art { grid-column: 1; grid-row: 1; }
    .hero-signature { width: min(100%, 210px); }
    .signature-caption { max-width: 210px; }
    .masthead-copy { padding: 15px 0 0; grid-column: 1 / -1; grid-row: 2; border-top: 1px solid var(--line); border-left: 0; }
    .masthead-title { margin-top: 7px; }
    .masthead-title h1, .page-masthead--sacred .masthead-title h1 { font-size: 31px; }
    .page-whisper { margin-top: 5px; }
    .time-block, .record-privacy, .sacred-orbit, .key-sigil, .masthead-progress { grid-column: 2; grid-row: 1; }
    .time-block { min-width: 124px; align-items: end; justify-items: end; padding-left: 14px; }
    .time-block b { font-size: 18px; }
    .record-privacy { min-width: 150px; padding: 10px 11px; }
    .record-privacy svg { width: 23px; height: 23px; }
    .sacred-orbit { width: 108px; height: 108px; }
    .sacred-orbit::before { inset: 11px; }
    .sacred-orbit::after { inset: 29px; }
    .sacred-orbit i:nth-child(1) { inset: 44px; }
    .sacred-orbit i:nth-child(2) { left: -10px; width: 128px; }
    .sacred-orbit i:nth-child(3) { top: -10px; height: 128px; }
    .sacred-orbit > b { font-size: 18px; }
    .key-sigil { width: 104px; height: 104px; }
    .key-sigil::before { inset: 11px; }
    .key-sigil::after { height: 124px; }
    .key-sigil span { width: 124px; }
    .key-sigil i { width: 34px; height: 34px; }
    .masthead-progress { width: 112px; height: 86px; padding: 12px 14px; }
  }

  @media (max-width: 760px) {
    .capacity-panel, .metric-stack, .route-panel, .activity-panel, .notice-panel, .quick-panel { grid-column: span 12; }
    .capacity-panel { min-height: 500px; }
    .metric-stack { grid-template-columns: 1fr; }
    .route-panel { min-height: 500px; }
    .provider-list { grid-template-columns: 1fr; }
    .provider-row:nth-child(n) { padding-inline: 0; border-right: 0; }
    .activity-panel, .notice-panel, .quick-panel { min-height: auto; }
    .notice-panel { min-height: 310px; }
    .model-grid { grid-template-columns: 1fr; }
    .model-card--featured { grid-column: span 1; }
    .model-card--featured .model-card__body, .model-card--featured .model-card__foot { max-width: 100%; }
    .model-card--featured::after { right: -58px; bottom: -58px; width: 145px; height: 145px; transform: none; }
    .model-toolbar .filter-group { width: 100%; overflow-x: auto; }
    .model-count { display: none; }
    .record-privacy { min-width: 0; }
    .record-stats { grid-template-columns: repeat(2, 1fr); }
    .record-stats > div:nth-child(2) { border-right: 0; }
    .record-stats > div:nth-child(-n + 2) { border-bottom: 1px solid var(--line); }
    .records-toolbar { align-items: stretch; flex-direction: column; padding: 14px; }
    .records-toolbar .filter-group { width: 100%; overflow-x: auto; padding-bottom: 2px; }
    .records-toolbar .filter-group button { flex: 0 0 auto; }
    .compact-search { width: 100%; min-height: 40px; border-top: 1px solid var(--line); border-left: 0; }
    .create-key-card, .security-note { grid-column: span 12; }
    .credential-grid { grid-template-columns: repeat(2, 1fr); }
    .credential-grid > div:nth-child(2) { border-right: 0; }
    .credential-grid > div:nth-child(-n + 2) { border-bottom: 1px solid var(--line); }
    .security-note { grid-template-columns: 72px 1fr; }
    .guide-layout { grid-template-columns: 1fr; }
    .guide-index { position: static; }
    .error-grid { grid-template-columns: 1fr; }
    .identity-gate {
      min-height: 100svh;
      align-content: start;
      padding: 116px 20px 78px;
      grid-template-columns: minmax(0, 1fr);
      background: var(--canvas);
    }
    .identity-gate::before { top: -62px; right: -176px; width: 520px; height: 460px; clip-path: polygon(18% 0, 100% 0, 100% 76%, 64% 100%, 0 81%, 4% 23%); }
    .identity-gate::after { right: -168px; bottom: -80px; width: 480px; }
    .identity-gate__rail { display: none; }
    .identity-gate__art { position: absolute; z-index: -1; inset: 0; display: block; padding: 0; }
    .identity-art__signature { position: absolute; top: 27px; left: 22px; width: min(58vw, 226px); }
    .identity-art__signature::after { right: -54px; width: 64%; }
    .identity-art__signature > span { display: none; }
    .identity-geometry { position: absolute; top: -74px; right: -176px; left: auto; width: 370px; max-height: none; opacity: 0.48; }
    .identity-art__note { display: none; }
    .identity-gate__content { justify-items: center; }
    .identity-card { width: min(100%, 570px); padding: 40px 34px 35px 46px; }
    .identity-card::before { inset: 18px -20px -16px 18px; }
    .identity-gate__foot { right: 20px; bottom: 22px; left: 20px; }
    .identity-gate__foot b { display: none; }
  }

  @media (max-width: 520px) {
    .profile-chip > span:not(.profile-chip__avatar), .profile-chip > svg { display: none; }
    .breadcrumb span, .breadcrumb i { display: none; }
    .view { padding-top: 24px; padding-inline: 14px; }
    .page-masthead { gap: 14px 12px; }
    .hero-signature { width: min(100%, 180px); }
    .signature-caption { max-width: 180px; font-size: 6px; }
    .masthead-title { align-items: flex-start; flex-direction: column; gap: 3px; }
    .masthead-title h1, .page-masthead--sacred .masthead-title h1 { font-size: 29px; }
    .view-heading .lede { font-size: 13px; }
    .capacity-panel { min-height: 460px; padding-inline: 12px; }
    .capacity-orbit { margin-top: 32px; }
    .capacity-meta { grid-template-columns: 1fr 1fr; }
    .capacity-meta .meter { display: none; }
    .route-panel, .activity-panel, .quick-panel { padding: 18px 14px; }
    .route-map { margin-inline: -18px; }
    .activity-legend span { display: none; }
    .activity-chart { gap: 2px; }
    .model-toolbar .filter-group button { padding-inline: 10px; }
    .model-card { min-height: 300px; padding: 18px; }
    .record-stats > div { min-height: 96px; padding-inline: 14px; }
    .record-stats b { font-size: 23px; }
    .data-state-strip { gap: 11px; padding-right: 12px; grid-template-columns: 25px minmax(0, 1fr); }
    .data-state-strip > button { padding: 8px 0 2px 36px; grid-column: 1 / -1; border-top: 1px solid var(--line); border-left: 0; }
    .credential-card, .create-key-card, .endpoint-card, .security-note { padding: 20px; }
    .credential-name { align-items: flex-start; flex-direction: column; margin-block: 32px; }
    .credential-grid { grid-template-columns: 1fr; }
    .credential-grid > div:nth-child(n) { min-height: 58px; padding-left: 0; border-right: 0; border-bottom: 1px solid var(--line); }
    .credential-grid > div:last-child { border-bottom: 0; }
    .security-note { grid-template-columns: 1fr; }
    .security-note__number { font-size: 48px; }
    .guide-content { padding: 24px 18px; }
    .modal__dialog { padding: 32px 24px 26px; }
    .profile-menu { right: 14px; }
    .identity-gate { padding: 104px 14px 72px; }
    .identity-art__signature { top: 23px; left: 17px; width: 188px; }
    .identity-geometry { top: -54px; right: -164px; width: 330px; }
    .identity-card { padding: 31px 21px 28px 27px; }
    .identity-card::before { inset: 14px -9px -12px 15px; }
    .identity-card::after { clip-path: polygon(0 6%, 7% 0, 94% 0, 100% 10%, 98% 90%, 89% 100%, 4% 97%, 0 81%); }
    .identity-card__head h1, .identity-status h1 { font-size: 27px; }
    .identity-card__intro { font-size: 11px; }
    .identity-card__index { min-width: 52px; }
    .identity-mode-switch { margin-top: 22px; }
    .identity-mode-switch button { padding-inline: 21px 8px; }
    .identity-mode-switch button:last-child { transform: translateY(5px); }
    .identity-form { gap: 14px; margin-top: 23px; }
    .identity-field { padding-left: 14px; }
    .identity-field::after { left: 14px; }
    .identity-field > span { font-size: 5px; }
    .identity-field input { height: 42px; }
    .identity-submit { width: min(72%, 230px); }
    .identity-status__mark { width: 108px; height: 96px; margin: 25px 0 19px -9px; }
    .identity-status__meta { grid-template-columns: 1fr; margin-block: 23px 21px; }
    .identity-status__meta div { min-height: 42px; padding-left: 12px; grid-template-columns: 58px 1fr; align-items: center; }
    .identity-status__meta div:nth-child(n) { transform: none; }
    .identity-gate__foot { right: 14px; left: 14px; gap: 10px; }
    .identity-gate__foot p { margin-left: auto; }
  }

  @media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
      scroll-behavior: auto !important;
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
    }

    .boot-sequence {
      display: none;
    }

    .reveal {
      opacity: 1;
      transform: none;
    }

  }
}
