/* One stable presentation contract for public, administrator and agent entry points.
 * Important rules are in the first declared layer: they do not depend on skin specificity.
 * Containers never animate geometry; image effects run once after successful decode. */
@layer zcodStablePresentation {
  :is(.auth-overlay,.detail-overlay,.legal-overlay,.modal,.gate,.shot-lightbox),
  :is(.auth-panel,.detail-panel,.legal-panel,.modal-card,.gate-card,.zl-card,.auth-screen,.zc-auth,.zc-row,.zl-row) {
    animation:none !important; transform:none !important;
    transition-property:opacity !important;
    transition-duration:140ms !important;
  }
  :is(.auth-panel,.zl-card,.gate-card) :is(form,.zc-pane>div,.zc-row,.zl-row) {
    animation:none !important; transform:none !important;
  }
  :is(.auth-panel,.zl-card,.gate-card) :is(button,a):is(:hover,:active) {transform:none !important;}
  #auth-overlay .auth-panel[data-account="zc"] {
    width:min(440px,calc(100vw - 32px)) !important;
    border-radius:24px !important;
    height:min(600px,calc(var(--account-viewport-height,100dvh) - 32px)) !important;
    max-height:calc(var(--account-viewport-height,100dvh) - 32px) !important;
  }
  #auth-overlay .auth-panel[data-account="zc"]::before,
  #auth-overlay .auth-panel[data-account="zc"]::after {animation:none !important;will-change:auto !important;}
  #auth-overlay .zc-status {height:54px !important;min-height:54px !important;margin:0 !important;line-height:18px !important;}
  .zl-card {height:700px !important;min-height:700px !important;}
  .zl-card .zl-status {height:36px !important;min-height:36px !important;line-height:18px !important;}
  .gate-card .gate-status {display:block !important;height:54px !important;min-height:54px !important;line-height:18px !important;flex:0 0 54px !important;margin-top:14px !important;margin-bottom:0 !important;}
  .zl-swtip {height:44px !important;min-height:44px !important;}
  /* The close tile is an opaque dark-red corner cutout, distinct from every theme.
   * Geometry is owned by zcodCornerGeometry, matching the inset poster contour.
   * Keep the full 44px target and the existing dark-red appearance. */
  #software-detail :is(.detail-summary-preview,.detail-gallery,.detail-shot,.detail-shot>img) {border-radius:14px !important;}
  #software-detail .detail-topbar {background:inherit !important;}
  #software-detail [data-detail-close] {
    border:0 !important;box-shadow:none !important;
    background:#842c38 !important;color:#fff !important;
    transition:background-color 160ms ease-out,color 160ms ease-out !important;
    transform:none !important;
  }
  #software-detail [data-detail-close]:is(:hover,:focus-visible) {background:#ad3d4d !important;color:#fff !important;}
  #software-detail [data-detail-close]:active {background:#71242f !important;}
  @media(prefers-reduced-motion:reduce) {#software-detail [data-detail-close] {transition:none !important;}}
  #software-detail .detail-panel[data-detail-pending="true"] {visibility:hidden !important;pointer-events:none !important;}
  #software-detail:has(.detail-panel[data-detail-pending="true"])::after {
    content:"正在加载…";position:absolute;inset:0;display:grid;place-items:center;
    color:var(--n-text,var(--text));pointer-events:none;
  }
  .home-card-media > img[hidden] {display:none !important;}
  html.zc-media-managed img[data-zc-image-state] {transition:none !important;}
  html.zc-media-managed img[data-zc-image-state="error"] {opacity:1 !important;animation:none !important;}
  html.zc-media-managed img[data-zc-image-state="pending"] {opacity:0 !important;animation:none !important;}
  html.zc-media-managed img[data-zc-image-state="ready"] {animation:zc-image-reveal 220ms ease-out !important;}
  @keyframes zc-image-reveal {from {opacity:0;filter:blur(4px)} to {opacity:1;filter:blur(0)}}
  @media(prefers-reduced-motion:reduce) {html.zc-media-managed img[data-zc-image-state="ready"] {animation:none !important;}}

}

/* Only the legal reader scrolls its text; its title and close stay visible. */
@layer zcodStablePresentation {
  #legal-overlay {--legal-inset:clamp(12px,3vw,24px);padding:var(--legal-inset) !important;}
  #legal-overlay .legal-panel {
    display:grid !important;grid-template-rows:auto minmax(0,1fr) auto !important;
    gap:16px !important;width:min(640px,100%) !important;min-height:0 !important;
    height:min(80dvh,720px) !important;max-height:calc(100dvh - 2*var(--legal-inset)) !important;
    overflow:hidden !important;padding:24px !important;
  }
  #legal-overlay [data-legal-title] {margin:0 !important;min-width:0 !important;overflow-wrap:anywhere !important;}
  #legal-overlay [data-legal-body] {
    min-height:0 !important;min-width:0 !important;overflow-y:auto !important;overflow-x:hidden !important;
    overscroll-behavior:contain !important;scrollbar-gutter:stable;overflow-wrap:anywhere !important;
    padding:2px 8px 2px 2px !important;outline-offset:2px !important;
  }
  #legal-overlay [data-legal-body]:focus-visible {outline:2px solid var(--blue) !important;}
  #legal-overlay .legal-section {margin:0 0 18px !important;}
  #legal-overlay .legal-body h3 {margin:0 0 6px !important;font-size:1em !important;font-weight:700 !important;line-height:1.6 !important;color:inherit !important;}
  #legal-overlay .legal-body p {margin:0 0 14px !important;}
  #legal-overlay .legal-section > p:last-child {margin-bottom:0 !important;}
  #legal-overlay [data-legal-close] {margin:0 !important;justify-self:end !important;min-height:44px !important;min-width:88px !important;}
  @media(max-width:480px), (max-height:480px) {
    #legal-overlay .legal-panel {padding:16px !important;gap:12px !important;}
  }
}