/* Screen only: PDF layouts keep their own typography and page geometry. */
.sidebar-close,
.sidebar-backdrop,
.mobile-table-sort,
.mobile-scale-axis,
.mobile-table-tools { display: none; }

@media screen and (max-width: 900px) {
  html.snp-menu-open { overflow: hidden; }
  html.snp-menu-open body {
    position: fixed;
    top: var(--snp-menu-scroll-y, 0);
    width: 100%;
    overflow: hidden;
  }

  .snp-dashboard :is(.dashboard-main, .dashboard-view, .panel, .field) { min-width: 0; }
  .snp-dashboard .dashboard-view.active { gap: 24px; }
  .snp-dashboard .dashboard-view > .data-panel { margin-top: 0; }
  .snp-dashboard .dashboard-content {
    padding: 28px 24px 40px;
    min-height: calc(100svh - 60px);
  }
  .snp-dashboard .dashboard-content::before { background-attachment: scroll; }
  .snp-dashboard .sidebar {
    inset: 0 auto 0 0;
    z-index: 210;
    width: min(330px, calc(100vw - 48px));
    height: 100vh;
    height: 100dvh;
    padding: 24px 18px max(16px, env(safe-area-inset-bottom));
    transform: translateX(-105%);
    transition: transform .2s ease, visibility .2s;
    visibility: hidden;
    overscroll-behavior: contain;
  }
  .snp-dashboard .sidebar.open { transform: none; visibility: visible; }
  .snp-dashboard .sidebar-brand { padding-right: 40px; }
  .snp-dashboard .sidebar-close {
    position: absolute;
    top: 14px;
    right: 12px;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid var(--theme-sidebar-border);
    border-radius: 6px;
    background: var(--theme-sidebar-account-bg);
    color: var(--theme-sidebar-text);
  }
  .snp-dashboard .sidebar-backdrop:not([hidden]) {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 200;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgb(var(--ink-rgb) / .5);
  }
  .snp-dashboard .sidebar-nav {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .snp-dashboard .nav-item { min-height: 50px; font-size: 16px; }
  .snp-dashboard .sidebar-search :is(input, button) { height: 44px; font-size: 16px; }
  .snp-dashboard .sidebar-search-control { grid-template-columns: minmax(0, 1fr) 44px; }
  .snp-dashboard .sidebar-footer { flex-shrink: 0; }
  .snp-dashboard .user-dropdown { max-height: calc(100dvh - 110px); overflow-y: auto; }
  .snp-dashboard .user-dropdown :is(button, a) { min-height: 48px; font-size: 15px; }
  .snp-dashboard .mobile-dashboard-bar {
    z-index: 80;
    min-height: 60px;
    padding: 8px 16px;
    background: var(--theme-sidebar-bg);
    color: var(--theme-sidebar-text);
    border-color: var(--theme-sidebar-divider);
    font-size: 16px;
    gap: 12px;
  }
  .snp-dashboard [data-mobile-page-title] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .snp-dashboard .sidebar-toggle {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    color: inherit;
    border-color: var(--theme-sidebar-border);
    background: var(--theme-sidebar-account-bg);
  }
  .snp-dashboard:fullscreen .dashboard-main {
    display: flex;
    flex-direction: column;
    height: 100dvh;
  }
  .snp-dashboard:fullscreen .mobile-dashboard-bar { flex-shrink: 0; }
  .snp-dashboard:fullscreen .dashboard-content {
    flex: 1;
    height: auto;
    min-height: 0;
    overflow-y: auto;
  }
  .snp-dashboard .dashboard-breadcrumb {
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 20px;
    font-size: 14px;
    overflow-wrap: anywhere;
  }
  .snp-dashboard .breadcrumb-home {
    min-width: 36px;
    min-height: 36px;
    display: grid;
    place-items: center;
  }
  .snp-dashboard .page-heading h1,
  #view-dashboard .page-heading h1,
  #view-animal .animal-page-heading h1 {
    font-size: 28px;
    line-height: 1.2;
    overflow-wrap: anywhere;
  }
  .snp-dashboard .page-heading,
  #view-dashboard .page-heading,
  #view-animal .animal-page-heading { gap: 16px; margin-bottom: 0; align-items: flex-start; }
  .snp-dashboard .page-heading p,
  #view-animal .animal-page-heading p { font-size: 15px; line-height: 1.5; }
  .snp-dashboard :is(.button, .text-button) {
    min-height: 44px;
    padding: 10px 14px;
    font-size: 14px;
    line-height: 1.4;
    white-space: normal;
  }
  .snp-dashboard .field label { font-size: 14px; line-height: 1.4; }
  .snp-dashboard .field :is(input, select),
  .snp-dashboard :is(.snp-choice-button, .snp-choice-search) { min-height: 46px; font-size: 16px; }
  .snp-dashboard .snp-choice-label { font-size: 16px; }
  .snp-dashboard .snp-choice-option { min-height: 44px; padding: 10px 12px; font-size: 16px; white-space: normal; }
  .snp-dashboard .snp-choice-panel { max-width: 100%; max-height: calc(100dvh - 100px); overflow-y: auto; }
  .snp-dashboard :is(.filter-grid, .advanced-filters) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 12px;
  }
  #view-ceip .module-filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .snp-dashboard .filter-actions { grid-column: 1 / -1; flex-wrap: wrap; }
  .snp-dashboard .filter-panel { padding: 0; margin-bottom: 0; }
  .snp-dashboard .table-wrap { max-width: 100%; overscroll-behavior-x: contain; }
  .snp-dashboard .data-table { font-size: 15px; }
  .snp-dashboard .pagination { gap: 12px; padding-top: 18px; font-size: 14px; flex-wrap: wrap; }
  .snp-dashboard .pagination button { width: 44px; height: 44px; }
  #view-dashboard .dashboard-columns > .panel { padding: 22px; }
  .snp-dashboard .panel-heading h2,
  .snp-dashboard .dashboard-table-panel .panel-heading h2 { font-size: 20px; line-height: 1.3; }
  .snp-dashboard .info-list :is(dt, dd) { font-size: 15px; line-height: 1.5; overflow-wrap: anywhere; }

  #view-animal #animal-page-details { gap: 24px; }
  #view-animal #animal-page-certificate { margin-top: 0; }
  #view-animal .animal-genetic-layout { gap: 24px; }
  #view-animal .animal-genetic-layout > .animal-report { grid-row: 1; }
  #view-animal .animal-genetic-layout > .genetic-report-section { grid-row: 2; }
  #view-animal .animal-report-grid,
  #view-animal .animal-genetic-layout .animal-report-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  #view-animal .animal-report-card { padding: 0; }
  #view-animal .animal-report-card h4 { padding: 14px 16px; font-size: 15px; line-height: 1.4; gap: 8px; }
  #view-animal .animal-report-facts,
  #view-animal .animal-genetic-layout .animal-report-facts { padding: 16px; gap: 18px 12px; }
  #view-animal .animal-report-facts dt { font-size: 13px; line-height: 1.4; font-weight: 500; }
  #view-animal .animal-report-facts dd,
  #view-animal .animal-genetic-layout .animal-report-facts dd { font-size: 17px; line-height: 1.4; overflow-wrap: anywhere; }
  #view-animal .animal-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  #view-animal .animal-summary > div { min-height: 82px; padding: 14px 16px; }
  #view-animal .animal-summary > div::before { display: none; }
  #view-animal .animal-summary span { font-size: 13px; }
  #view-animal .animal-summary strong { font-size: 19px; line-height: 1.4; overflow-wrap: anywhere; }
  #view-animal .animal-detail-section h3 { font-size: 21px; line-height: 1.3; }
  #view-animal .animal-page-nav-button,
  .snp-dashboard.snp-theme-light #view-animal .animal-page-nav-button {
    top: auto;
    bottom: max(16px, env(safe-area-inset-bottom));
    width: 48px;
    height: 48px;
    transform: none;
    z-index: 90;
    background: var(--surface);
    color: var(--green-900);
    border: 1px solid var(--line);
    border-radius: 6px;
    box-shadow: var(--shadow);
  }
  #animal-page-prev { left: 16px; }
  #animal-page-next { right: 16px; }
  #view-animal { padding-bottom: 64px; }
  #view-animal .ceip-screen-layout .ceip-identity .ceip-animal-facts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 0;
    gap: 18px 12px;
  }
  #view-animal .ceip-screen-layout :is(.ceip-identity, .ceip-evaluation) { padding: 20px; min-width: 0; }
  #view-animal .ceip-screen-layout .ceip-identity { grid-row: 1; }
  #view-animal .ceip-screen-layout .ceip-evaluation { grid-row: 2; border-bottom: 0; border-top: 1px solid var(--line); }
  #view-animal .ceip-screen-layout .ceip-section-heading > div { flex-wrap: wrap; gap: 8px; }
  #view-animal .ceip-screen-layout .ceip-section-heading h4 { font-size: 21px; }
  #view-animal .ceip-screen-layout .ceip-section-heading span { font-size: 13px; text-align: left; }
  #view-animal .ceip-screen-layout .ceip-lineage-item { padding: 14px; gap: 6px; }
  #view-animal .ceip-screen-layout :is(.ceip-lineage-item, .ceip-validation-box) span { font-size: 13px; }
  #view-animal .ceip-screen-layout :is(.ceip-lineage-item, .ceip-validation-box) strong { font-size: 17px; line-height: 1.4; }
  #view-animal .ceip-screen-layout :is(.ceip-lineage-item, .ceip-validation-box) small { font-size: 13px; line-height: 1.5; }
  #view-animal .ceip-screen-layout .ceip-validation-box { flex-direction: row; padding: 14px; gap: 14px; }
  .snp-dashboard .account-profile-copy h2 { font-size: 22px; overflow-wrap: anywhere; }
  .snp-dashboard :is(.account-profile-copy p, .account-file-name) { font-size: 15px; overflow-wrap: anywhere; }
  .snp-dashboard .modal-panel { max-height: calc(100dvh - 48px); overflow-y: auto; }
  .snp-dashboard :is(.glossary, .ceip-legend p) { font-size: 15px; line-height: 1.6; }
}

@media screen and (max-width: 680px) {
  .snp-dashboard .dashboard-content { padding: 20px 16px 32px; }
  .snp-dashboard :is(.page-heading .toolbar, .animal-page-actions, #animal-page-extra-actions) { width: 100%; flex-wrap: wrap; }
  .snp-dashboard :is(.toolbar, #animal-page-extra-actions) .button { flex: 1 1 auto; }
  #view-dashboard .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 0; }
  #view-dashboard .metric-card {
    grid-template-columns: 32px minmax(0, 1fr);
    column-gap: 10px;
    min-height: 110px;
    padding: 16px 12px;
    border-radius: 8px;
  }
  #view-dashboard .metric-icon { width: 32px; height: 32px; }
  #view-dashboard .metric-card::before { display: none; }
  #view-dashboard .metric-card .metric-icon {
    position: static;
    transform: none;
    grid-row: 1 / 3;
    grid-column: 1;
    align-self: center;
    background: var(--green-20);
    border-radius: 6px;
    color: var(--green-900);
  }
  #view-dashboard .metric-card > span:not(.metric-icon),
  #view-dashboard .metric-card strong { grid-column: 2; }
  #view-dashboard .metric-card > span:not(.metric-icon) { font-size: 14px; line-height: 1.4; }
  #view-dashboard .metric-card strong { font-size: 24px; line-height: 1.2; overflow-wrap: anywhere; }
  #view-dashboard .page-heading .update-chip { flex-wrap: wrap; justify-content: start; border-radius: 6px; font-size: 13px; padding: 10px 12px; }
  .snp-dashboard .advanced-filters .field:has(> input[type="search"]),
  .snp-dashboard .filter-grid > button { grid-column: 1 / -1; }
  .snp-dashboard .filter-actions .button { flex: 1; }
  .snp-dashboard .dashboard-table-panel,
  #view-dashboard .dashboard-columns > .panel { padding: 18px 16px; border-radius: 8px; }
  .snp-dashboard .dashboard-table-panel .panel-heading { gap: 8px; align-items: start; flex-wrap: wrap; }
  .snp-dashboard .table-result-summary { font-size: 14px; line-height: 1.5; }
  .snp-dashboard .mobile-table-sort { display: grid; gap: 6px; margin: 12px 0 18px; color: var(--muted); font-size: 13px; }
  .snp-dashboard .mobile-sort-select {
    width: 100%;
    min-height: 44px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 4px;
    color: var(--ink);
    background: var(--surface);
    font: inherit;
    font-size: 16px;
  }
  .snp-dashboard .mobile-record-table,
  .snp-dashboard .mobile-record-table tbody,
  #view-animal .mobile-trait-table,
  #view-animal .mobile-trait-table tbody { display: block; width: 100%; min-width: 0; }
  .snp-dashboard .mobile-record-table thead,
  #view-animal .mobile-trait-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .snp-dashboard .mobile-record-table tbody > tr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
  }
  .snp-dashboard .mobile-record-table td {
    display: block;
    min-width: 0;
    border: 0;
    padding: 6px 0;
    font-size: 16px;
    line-height: 1.5;
    white-space: normal;
    overflow-wrap: anywhere;
    text-align: left;
  }
  .snp-dashboard .mobile-record-table td::before,
  #view-animal .mobile-trait-table td::before {
    display: block;
    content: attr(data-label);
    margin-bottom: 3px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
  }
  .snp-dashboard .mobile-record-table :is(td:first-child, td[colspan], td:has(.ceip-row-actions), td:has(.ceip-validation-link)) { grid-column: 1 / -1; }
  .snp-dashboard .mobile-record-table :is(td:first-child, td[colspan], td:has(.ceip-row-actions))::before { display: none; }
  .snp-dashboard .mobile-record-table .animal-link { max-width: 100%; min-height: 44px; font-size: 18px; line-height: 1.4; text-align: left; white-space: normal; overflow-wrap: anywhere; }
  .snp-dashboard .ceip-row-actions { flex-wrap: wrap; gap: 8px; }
  .snp-dashboard .ceip-row-actions .button { flex: 1; }
  .snp-dashboard .mobile-record-table .ceip-code { font-size: 14px; white-space: normal; overflow-wrap: anywhere; }
  .snp-dashboard .mobile-record-table .ceip-validation-link { display: inline-flex; align-items: center; min-height: 44px; }
  .snp-dashboard .info-list > div { display: grid; gap: 6px; padding: 14px 0; }
  .snp-dashboard .info-list dd { text-align: left; }

  #view-animal .animal-report-grid,
  #view-animal .animal-genetic-layout .animal-report-grid { grid-template-columns: minmax(0, 1fr); }
  #view-animal .animal-report-facts,
  #view-animal .animal-genetic-layout .animal-report-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #view-animal .animal-report-facts-identification,
  #view-animal .animal-genetic-layout .animal-report-facts-identification { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #view-animal .animal-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #view-animal #animal-page-details > .animal-detail-section,
  #view-animal .animal-genetic-layout > .genetic-report-section { padding: 18px 16px; border-radius: 8px; }
  #view-animal .detail-table-wrap { border: 0; border-radius: 0; }
  #view-animal .mobile-trait-table tbody > tr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 8px;
    padding: 16px 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
  }
  #view-animal .mobile-trait-table td,
  #view-animal .ceip-screen-layout .mobile-trait-table td {
    display: block;
    width: auto;
    min-width: 0;
    padding: 0 !important;
    border: 0;
    background: transparent;
    font-size: 15px;
    line-height: 1.5;
    white-space: normal;
    overflow-wrap: anywhere;
    text-align: left;
  }
  #view-animal .mobile-trait-table :is(td:first-child, td:nth-child(6)) { grid-column: 1 / -1; }
  #view-animal .mobile-trait-table td:first-child,
  #view-animal .mobile-trait-table td:first-child strong { font-size: 17px; color: var(--green-900); }
  #view-animal .mobile-trait-table :is(td:first-child, td:nth-child(6))::before,
  #view-animal .mobile-trait-table :is(.table-scroll-cell, tfoot) { display: none !important; }
  #view-animal .mobile-trait-table .genetic-scale { display: block; width: 100%; height: 22px; }
  #view-animal .mobile-trait-table .mobile-scale-axis { display: block; position: relative; width: 100%; height: 24px; margin: 0 0 2px; color: var(--muted); }
  #view-animal .mobile-scale-axis span { top: 0; color: inherit; font-size: 11px; line-height: 1; }
  #view-animal .mobile-scale-axis line { stroke: var(--border-strong); stroke-width: .4; vector-effect: non-scaling-stroke; }
  #view-animal .mobile-table-long .mobile-table-tools {
    position: sticky;
    display: flex;
    justify-content: flex-end;
    z-index: 4;
    height: 44px;
    pointer-events: none;
    background: transparent;
  }
  #view-animal .mobile-table-tools-top { top: 68px; }
  #view-animal .mobile-table-tools-bottom { bottom: 76px; }
  #view-animal .mobile-table-tools .table-anchor-button {
    width: 44px;
    height: 44px;
    pointer-events: auto;
    background: var(--surface);
    color: var(--green-900);
    border: 1px solid var(--line);
    border-radius: 6px;
  }
  #view-animal .ceip-screen-layout .ceip-lineage-grid { grid-template-columns: minmax(0, 1fr); }
  #view-animal .ceip-screen-layout .ceip-lineage-item { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; padding: 0 0 16px; }
  #view-animal .ceip-screen-layout :is(.ceip-identity, .ceip-evaluation) { padding: 18px 16px; }
  #view-animal .ceip-animal-facts > div[data-fact-label="Nascimento"] { grid-column: span 2; }
  .snp-dashboard .account-profile-main { grid-template-columns: 64px minmax(0, 1fr); gap: 16px; }
  .snp-dashboard .account-avatar-preview { width: 64px; height: 64px; }
  .snp-dashboard .account-photo-actions { display: flex; flex-wrap: wrap; }

  .snp-auth,
  .snp-public-validation { padding: 24px 16px; }
  .snp-auth-card,
  .snp-validation-card { padding: 24px 20px; min-width: 0; }
  .snp-auth h1,
  .snp-public-validation h1 { font-size: 26px; line-height: 1.3; overflow-wrap: anywhere; }
  .snp-auth .field label,
  .snp-public-validation label { font-size: 14px; }
  .snp-auth .field input,
  .snp-public-validation input { width: 100%; min-width: 0; min-height: 48px; font-size: 16px; }
  .snp-auth .button,
  .snp-public-validation .button { min-height: 48px; font-size: 16px; white-space: normal; }
  .snp-auth .snp-check { min-height: 44px; font-size: 15px; }
  .snp-public-certificate { padding: 22px 18px; }
  .snp-public-certificate-header,
  .snp-public-certificate-grid,
  .snp-public-certificate-footer { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .snp-public-certificate-header h2 { font-size: 21px; line-height: 1.4; }
  .snp-public-certificate-grid dd { font-size: 18px; overflow-wrap: anywhere; }
  .snp-public-certificate-grid dt,
  .snp-public-certificate p,
  .snp-public-certificate-footer span { font-size: 15px; line-height: 1.5; }
}

@media screen and (prefers-reduced-motion: reduce) {
  .snp-dashboard .sidebar { transition: none; }
}