.mobile-only {
  display: none !important;
}

@media (max-width: 768px) {
  :root {
    --mobile-app-blue: #1769e8;
    --mobile-app-ink: #111827;
    --mobile-app-muted: #607086;
    --mobile-app-border: #d9e1ec;
    --mobile-app-surface: #ffffff;
    --mobile-app-canvas: #f3f6fa;
    --mobile-app-nav-height: 66px;
  }

  html,
  body {
    max-width: 100%;
    overflow-x: clip;
  }

  body:not(.login-body):not(.template-studio-body) {
    background: var(--mobile-app-canvas);
    padding-bottom: calc(var(--mobile-app-nav-height) + 18px + env(safe-area-inset-bottom));
  }

  body.mobile-sheet-open {
    overflow: hidden;
  }

  .mobile-only {
    display: initial !important;
  }

  body > header:not(.mobile-app-header) .navbar {
    display: none !important;
  }

  body > .container {
    max-width: none;
    padding-inline: 12px;
  }

  .mobile-app-header {
    align-items: center;
    background: var(--mobile-app-surface);
    border-bottom: 1px solid var(--mobile-app-border);
    display: flex !important;
    height: 58px;
    justify-content: space-between;
    padding: 7px 12px;
    position: sticky;
    top: 0;
    z-index: 1040;
  }

  .mobile-app-brand {
    align-items: center;
    color: var(--mobile-app-ink);
    display: flex;
    gap: 10px;
    min-height: 44px;
    min-width: 0;
    text-decoration: none;
  }

  .mobile-app-brand img {
    border-radius: 7px;
    flex: 0 0 auto;
    height: 40px;
    object-fit: contain;
    width: 40px;
  }

  .mobile-app-brand span {
    display: grid;
    min-width: 0;
  }

  .mobile-app-brand strong {
    font-size: 0.94rem;
    line-height: 1.1;
  }

  .mobile-app-brand small {
    color: var(--mobile-app-muted);
    font-size: 0.72rem;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-header-action,
  .mobile-sheet-close {
    align-items: center;
    background: #fff;
    border: 1px solid var(--mobile-app-border);
    border-radius: 7px;
    color: #27364a;
    display: flex;
    flex: 0 0 44px;
    height: 44px;
    justify-content: center;
    padding: 0;
    width: 44px;
  }

  .mobile-header-action:hover,
  .mobile-header-action:focus,
  .mobile-header-action:focus-visible,
  .mobile-sheet-close:hover,
  .mobile-sheet-close:focus,
  .mobile-sheet-close:focus-visible {
    background: #f3f7fd;
    border-color: #9db6da;
    color: #145fc7;
  }

  .mobile-bottom-nav {
    align-items: stretch;
    background: rgba(255, 255, 255, 0.98);
    border-top: 1px solid var(--mobile-app-border);
    bottom: 0;
    display: flex !important;
    height: calc(var(--mobile-app-nav-height) + env(safe-area-inset-bottom));
    justify-content: space-around;
    left: 0;
    padding: 5px 6px env(safe-area-inset-bottom);
    position: fixed;
    right: 0;
    z-index: 1035;
  }

  .mobile-bottom-nav > a,
  .mobile-bottom-nav > button {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 7px;
    color: #607086;
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    font-size: 0.68rem;
    font-weight: 800;
    gap: 3px;
    justify-content: center;
    min-height: 54px;
    min-width: 54px;
    padding: 4px 5px;
    text-decoration: none;
  }

  .mobile-bottom-nav .app-icon {
    height: 21px;
    width: 21px;
  }

  .mobile-bottom-nav > [aria-current="page"] {
    background: #eaf2ff;
    color: #075dcc;
  }

  .mobile-more-sheet {
    bottom: 0;
    display: flex !important;
    flex-direction: column;
    justify-content: flex-end;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1100;
  }

  .mobile-more-sheet[hidden] {
    display: none !important;
  }

  .mobile-sheet-backdrop {
    background: rgba(15, 23, 42, 0.48);
    border: 0;
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
  }

  .mobile-sheet-panel {
    background: #fff;
    border-radius: 8px 8px 0 0;
    max-height: min(78vh, 620px);
    overflow-y: auto;
    padding: 8px 16px calc(16px + env(safe-area-inset-bottom));
    position: relative;
  }

  .mobile-sheet-panel::before {
    background: #c7d0dc;
    border-radius: 2px;
    content: "";
    display: block;
    height: 4px;
    margin: 0 auto 6px;
    width: 38px;
  }

  .mobile-sheet-panel > header {
    align-items: center;
    border-bottom: 1px solid #e7ebf1;
    display: flex;
    justify-content: space-between;
    padding: 8px 0 12px;
  }

  .mobile-sheet-panel > header div {
    display: grid;
  }

  .mobile-sheet-panel > header span,
  .mobile-sheet-account span {
    color: var(--mobile-app-muted);
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
  }

  .mobile-sheet-panel > header strong {
    font-size: 1.25rem;
  }

  .mobile-sheet-panel nav {
    display: grid;
    padding-top: 8px;
  }

  .mobile-sheet-product {
    align-items: center;
    background: #f5f8fc;
    border: 1px solid #e0e6ee;
    border-radius: 7px;
    display: flex;
    gap: 10px;
    margin-top: 10px;
    padding: 10px;
  }

  .mobile-sheet-product img {
    border-radius: 6px;
    height: 36px;
    object-fit: contain;
    width: 36px;
  }

  .mobile-sheet-product > div {
    display: grid;
    min-width: 0;
  }

  .mobile-sheet-product strong {
    color: var(--mobile-app-ink);
    font-size: 0.8rem;
    overflow-wrap: anywhere;
  }

  .mobile-sheet-product span {
    color: var(--mobile-app-muted);
    font-size: 0.68rem;
  }

  .mobile-sheet-panel nav > a {
    align-items: center;
    border-bottom: 1px solid #edf0f4;
    color: var(--mobile-app-ink);
    display: flex;
    font-weight: 750;
    gap: 12px;
    min-height: 52px;
    padding: 4px 2px;
    text-decoration: none;
  }

  .mobile-sheet-panel nav > a .app-icon {
    color: #356da9;
    height: 20px;
    width: 20px;
  }

  .mobile-sheet-account {
    background: #f5f8fc;
    border: 1px solid #e0e6ee;
    border-radius: 7px;
    display: grid;
    margin: 10px 0 4px;
    padding: 10px 12px;
  }

  .mobile-upload-sources {
    display: grid !important;
    gap: 8px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }

  .mobile-upload-sources button {
    align-items: center;
    background: #fff;
    border: 1px solid #cfd9e7;
    border-radius: 7px;
    color: #1b2a3f;
    display: flex;
    flex-direction: column;
    font-size: 0.72rem;
    font-weight: 800;
    gap: 6px;
    justify-content: center;
    min-height: 70px;
    min-width: 0;
    padding: 8px 4px;
  }

  .mobile-upload-sources button:focus-visible,
  .mobile-bottom-nav > *:focus-visible,
  .mobile-header-action:focus-visible {
    outline: 3px solid rgba(23, 105, 232, 0.28);
    outline-offset: 1px;
  }

  .process-page:not(.has-result) {
    padding-top: 18px;
  }

  .process-header {
    gap: 12px;
  }

  .process-header h1 {
    font-size: 1.55rem;
  }

  .process-header .ops-header-actions {
    display: none;
  }

  .process-upload {
    gap: 10px;
    grid-template-columns: 1fr;
  }

  .process-dropzone {
    min-height: 150px;
    padding: 20px 16px;
    text-align: center;
  }

  .process-dropzone > div {
    align-items: center;
  }

  .process-submit {
    min-height: 50px;
    width: 100%;
  }

  .loading-card {
    margin: 12px;
    max-width: calc(100vw - 24px);
  }

  .process-page.has-result {
    padding: 12px 0 18px;
  }

  .result-header {
    align-items: stretch;
    border-radius: 7px;
    gap: 10px;
    grid-template-columns: minmax(0, 1fr);
    margin-bottom: 12px;
    padding: 12px;
    position: static;
  }

  .result-file {
    min-width: 0;
  }

  .result-file h1 {
    font-size: 1rem;
    overflow-wrap: anywhere;
  }

  .result-file-icon {
    height: 42px;
    width: 42px;
  }

  .result-status {
    align-items: flex-start;
    justify-self: stretch;
  }

  .result-status-detail {
    display: flex;
  }

  .result-key-facts {
    display: flex;
    gap: 20px;
  }

  .result-header-actions {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .result-header-actions > * {
    justify-content: center;
    min-height: 44px;
    min-width: 0;
    overflow: hidden;
    padding-inline: 9px;
    white-space: nowrap;
    width: 100%;
  }

  .result-header-actions > :only-child,
  .result-header-actions > .result-action-process {
    grid-column: 1 / -1;
  }

  .result-header-actions:not(:has(.result-action-template)) .result-action-review,
  .result-header-actions:not(:has(.result-action-review)) .result-action-template {
    grid-column: 1 / -1;
  }

  .result-header-actions .mobile-action-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .desktop-action-label {
    display: none !important;
  }

  .result-workspace {
    border-radius: 7px;
    overflow: visible;
  }

  .result-tabs {
    background: #fff;
    border: 1px solid var(--mobile-app-border);
    border-radius: 7px 7px 0 0;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    overflow: hidden;
    padding: 0 4px;
    position: sticky;
    scrollbar-width: none;
    top: 58px;
    z-index: 1020;
  }

  .result-tabs::-webkit-scrollbar {
    display: none;
  }

  .result-tabs button {
    font-size: 0.68rem;
    gap: 3px;
    height: 50px;
    min-width: 0;
    padding: 0 4px;
    width: 100%;
  }

  .result-tabs button .app-icon {
    display: none;
  }

  .summary-layout {
    display: block;
  }

  .summary-section {
    border-bottom: 1px solid #e3e8ef;
    border-right: 0;
    padding: 14px 13px;
  }

  .summary-section header {
    margin-bottom: 8px;
  }

  .summary-values > div {
    align-items: start;
    gap: 14px;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    min-height: 40px;
    padding-block: 8px;
  }

  .summary-values dd {
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    overflow-wrap: anywhere;
    text-align: right;
    width: 100%;
  }

  .summary-values > .summary-schema {
    gap: 4px;
    grid-template-columns: minmax(0, 1fr);
  }

  .summary-schema dd,
  .summary-schema code {
    max-width: 100%;
    text-align: left;
    white-space: normal;
    word-break: break-word;
  }

  .validation-section {
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1fr);
  }

  .validation-counts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .summary-item-preview {
    padding: 14px 13px;
  }

  .summary-item-preview .section-heading {
    align-items: flex-start;
    gap: 8px;
  }

  .summary-item-preview .text-action {
    min-height: 44px;
  }

  .summary-item-preview .table-scroll {
    display: none;
  }

  .summary-item-cards {
    display: grid !important;
    gap: 9px;
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .summary-item-cards > li {
    background: #fff;
    border: 1px solid #d9e1eb;
    border-radius: 7px;
    overflow: hidden;
  }

  .summary-item-cards > li > header {
    align-items: center;
    background: #f7f9fc;
    border-bottom: 1px solid #e5eaf1;
    display: grid;
    gap: 9px;
    grid-template-columns: 26px minmax(0, 1fr);
    margin: 0;
    padding: 9px 10px;
  }

  .summary-item-cards > li > header span {
    background: #e8f1ff;
    border-radius: 5px;
    color: #075dcc;
    display: grid;
    font-size: 0.7rem;
    font-weight: 800;
    height: 26px;
    place-items: center;
    width: 26px;
  }

  .summary-item-cards > li > header strong {
    font-size: 0.78rem;
    overflow-wrap: anywhere;
  }

  .summary-item-cards dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
    padding: 4px 10px 8px;
  }

  .summary-item-cards dl > div {
    display: grid;
    min-width: 0;
    padding: 7px 4px;
  }

  .summary-item-cards dt {
    color: var(--mobile-app-muted);
    font-size: 0.62rem;
    font-weight: 700;
    text-transform: uppercase;
  }

  .summary-item-cards dd {
    color: var(--mobile-app-ink);
    font-size: 0.75rem;
    font-weight: 750;
    margin: 0;
    overflow-wrap: anywhere;
  }

  .result-panel-toolbar {
    align-items: stretch;
    gap: 10px;
    padding: 13px;
  }

  .result-panel-toolbar h2 {
    font-size: 1.05rem;
  }

  .toolbar-actions {
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(0, 1fr) 44px 44px;
    width: 100%;
  }

  .toolbar-actions [data-toggle-item-columns] {
    grid-column: 1 / -1;
    min-height: 44px;
    width: 100%;
  }

  .toolbar-actions .compact-search {
    grid-column: 1;
    min-height: 44px;
    width: 100%;
  }

  .toolbar-actions .icon-button {
    height: 44px;
    width: 44px;
  }

  .item-table-scroll {
    margin: 0;
    overflow: visible;
    padding: 10px;
    width: 100%;
  }

  .pms-item-table,
  .pms-item-table tbody {
    display: block;
    min-width: 0;
    width: 100%;
  }

  .pms-item-table thead {
    display: none;
  }

  .pms-item-table tbody {
    display: grid;
    gap: 10px;
  }

  .pms-item-table [data-item-row] {
    background: #fff;
    border: 1px solid #d9e1eb;
    border-radius: 7px;
    box-shadow: 0 3px 12px rgba(30, 48, 74, 0.06);
    display: grid;
    overflow: hidden;
  }

  .pms-item-table [data-item-row] > td {
    align-items: center;
    background: #fff;
    border: 0;
    border-bottom: 1px solid #edf0f4;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(105px, 0.85fr) minmax(0, 1.15fr);
    min-height: 48px;
    padding: 4px 10px;
    position: static;
    width: 100%;
  }

  .pms-item-table [data-item-row] > td::before {
    color: #65758b;
    content: attr(data-label);
    font-size: 0.68rem;
    font-weight: 850;
    text-align: left;
    text-transform: uppercase;
  }

  .pms-item-table [data-item-row] > td.sticky-index {
    display: none;
  }

  .pms-item-table:not(.show-all-columns) [data-item-row] > td[data-mobile-priority="secondary"] {
    display: none;
  }

  .pms-item-table.show-all-columns [data-item-row] > td[data-mobile-priority="secondary"] {
    display: grid;
  }

  .pms-item-table [data-item-row] > td[data-label="Product name"] {
    background: #f7faff;
  }

  .pms-item-table .editable-cell {
    grid-template-columns: minmax(0, 1fr) 44px;
    min-height: 44px;
  }

  .pms-item-table .cell-value,
  .pms-item-table .cell-edit,
  .pms-item-table .cell-restore {
    min-height: 44px;
  }

  .pms-item-table .cell-value {
    overflow-wrap: anywhere;
    text-align: right;
    white-space: normal;
  }

  .item-reconciliation {
    margin: 0 10px 12px;
  }

  .review-mobile-switch button {
    min-height: 44px;
  }

  .document-pane,
  .field-pane {
    height: calc(100dvh - 232px);
    min-height: 430px;
  }

  .correction-dialog {
    border-radius: 8px 8px 0 0;
    margin: auto 0 0;
    max-height: calc(100dvh - 58px);
    max-width: none;
    width: 100%;
  }

  .correction-dialog::backdrop {
    background: rgba(15, 23, 42, 0.48);
  }

  .correction-dialog footer {
    padding-bottom: calc(14px + env(safe-area-inset-bottom));
  }

  .ops-page {
    padding: 18px 0;
  }

  .ops-page-header {
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 18px;
  }

  .ops-page-header h1 {
    font-size: 1.55rem;
  }

  .ops-page-header p {
    font-size: 0.84rem;
  }

  .ops-header-actions {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .ops-header-actions > * {
    min-height: 44px;
    min-width: 0;
    width: 100%;
  }

  .ops-summary-strip {
    border-radius: 7px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 14px;
  }

  .ops-summary-strip > div {
    min-height: 70px;
    min-width: 0;
    padding: 10px 8px;
  }

  .ops-summary-strip strong {
    font-size: 1.1rem;
  }

  .ops-summary-strip span {
    font-size: 0.65rem;
    overflow-wrap: anywhere;
  }

  .ops-table-tools {
    align-items: stretch;
    background: transparent;
    border: 0;
    display: grid;
    gap: 8px;
    padding: 0 0 10px;
  }

  .ops-table-tools label,
  .ops-table-tools input {
    min-height: 44px;
    width: 100%;
  }

  .ops-table-tools > span {
    justify-self: start;
  }

  .ops-segmented-filter {
    max-width: 100%;
    overflow-x: auto;
  }

  .ops-segmented-filter button {
    flex: 0 0 auto;
    min-height: 44px;
  }

  .ops-table-wrap {
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: visible;
  }

  .ops-table,
  .ops-table tbody {
    display: block;
    min-width: 0;
    width: 100%;
  }

  .ops-table thead {
    display: none;
  }

  .ops-table tbody {
    display: grid;
    gap: 10px;
  }

  .ops-table tbody > tr {
    background: #fff;
    border: 1px solid #d9e1eb;
    border-radius: 7px;
    box-shadow: 0 3px 12px rgba(30, 48, 74, 0.06);
    display: grid;
    overflow: visible;
  }

  .ops-table tbody > tr[hidden] {
    display: none;
  }

  .ops-table tbody > tr > td {
    align-items: center;
    border: 0;
    border-bottom: 1px solid #edf0f4;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(92px, 0.7fr) minmax(0, 1.3fr);
    min-height: 48px;
    overflow-wrap: anywhere;
    padding: 7px 11px;
    width: 100%;
  }

  .ops-table tbody > tr > td::before {
    color: #65758b;
    content: attr(data-label);
    font-size: 0.66rem;
    font-weight: 850;
    letter-spacing: 0;
    text-transform: uppercase;
  }

  .ops-table tbody > tr > td:first-child {
    background: #f7faff;
    border-radius: 7px 7px 0 0;
    display: block;
  }

  .ops-table tbody > tr > td:first-child::before {
    display: block;
    margin-bottom: 8px;
  }

  .ops-document-cell {
    min-width: 0;
  }

  .ops-document-cell > span:last-child {
    min-width: 0;
  }

  .ops-document-cell strong,
  .api-request-id,
  .api-prefix {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .ops-table .ops-row-actions {
    align-items: center;
    border-bottom: 0;
    display: flex;
    justify-content: flex-end;
    min-height: 58px;
    padding: 7px 10px;
  }

  .ops-table .ops-row-actions::before {
    margin-right: auto;
  }

  .ops-table .ops-row-actions .ops-button {
    min-height: 44px;
  }

  .ops-action-menu > summary,
  .ops-icon-link {
    align-items: center;
    display: inline-flex;
    height: 44px;
    justify-content: center;
    min-width: 44px;
  }

  .ops-action-menu > div {
    max-width: calc(100vw - 44px);
    min-width: min(260px, calc(100vw - 44px));
    right: 0;
  }

  #template-library .ops-action-menu > div {
    left: auto;
    right: 0;
  }

  .api-create-panel,
  .api-section {
    border-radius: 7px;
    padding: 14px;
  }

  .mobile-api-create-toggle {
    align-items: center;
    background: #fff;
    border: 0;
    color: var(--mobile-app-ink);
    display: grid !important;
    gap: 10px;
    grid-template-columns: 32px minmax(0, 1fr) 18px;
    min-height: 52px;
    padding: 0;
    text-align: left;
    width: 100%;
  }

  .mobile-api-create-toggle:hover,
  .mobile-api-create-toggle:focus,
  .mobile-api-create-toggle:focus-visible {
    background: #fff;
    color: #145fc7;
    outline: 3px solid rgba(23, 105, 232, 0.18);
    outline-offset: 3px;
  }

  .mobile-api-create-toggle > .app-icon {
    color: #1769e8;
    height: 24px;
    width: 24px;
  }

  .mobile-api-create-toggle > span:nth-child(2) {
    display: grid;
    min-width: 0;
  }

  .mobile-api-create-toggle strong {
    font-size: 0.84rem;
  }

  .mobile-api-create-toggle small {
    color: var(--mobile-app-muted);
    font-size: 0.67rem;
    overflow-wrap: anywhere;
  }

  .mobile-api-create-state::before {
    color: #607086;
    content: "+";
    font-size: 1.35rem;
    font-weight: 500;
  }

  .api-create-panel.mobile-expanded .mobile-api-create-state::before {
    content: "−";
  }

  .api-create-panel:not(.mobile-expanded) .api-create-content {
    display: none;
  }

  .api-create-panel.mobile-expanded .api-create-content {
    border-top: 1px solid #e5eaf1;
    margin-top: 12px;
    padding-top: 14px;
  }

  .api-create-form {
    grid-template-columns: 1fr;
  }

  .api-create-form input,
  .api-create-form button {
    min-height: 44px;
  }

  .api-key-value {
    align-items: stretch;
    flex-direction: column;
  }

  .api-key-value code {
    overflow-wrap: anywhere;
  }

  .api-clients-page .ops-table tbody > tr > td,
  .api-activity-table tbody > tr > td {
    grid-template-columns: minmax(84px, 0.65fr) minmax(0, 1.35fr);
  }

  .ops-page pre {
    max-width: 100%;
    overflow-x: auto;
  }

  .ops-page .row > [class*="col-"] {
    min-width: 0;
  }

  #template-library tbody > tr,
  #unmapped-layouts tbody > tr {
    grid-template-areas: none;
    grid-template-columns: 1fr;
  }

  #template-library tbody > tr > td,
  #unmapped-layouts tbody > tr > td {
    align-self: stretch;
    display: grid !important;
    grid-area: auto !important;
    padding: 7px 11px;
  }

  #template-library tbody > tr > td:first-child,
  #unmapped-layouts tbody > tr > td:first-child {
    display: block !important;
  }

  #template-library .ops-status {
    justify-self: start;
    max-width: none;
  }

  #template-library .ops-row-actions,
  #unmapped-layouts .ops-row-actions {
    display: flex !important;
    justify-content: flex-end;
  }

  .api-activity-table:not(.mobile-expanded) tbody > tr:nth-child(n + 11) {
    display: none;
  }

  .mobile-activity-toggle {
    margin-top: 10px;
    min-height: 46px;
    width: 100%;
  }

  .template-studio-body {
    background: #edf2f8;
    overflow: hidden;
  }

  .template-studio {
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
    padding-bottom: calc(64px + env(safe-area-inset-bottom));
  }

  .template-studio .studio-commandbar {
    align-items: center;
    background: #fff;
    display: flex;
    height: 58px;
    padding: 7px 10px;
    position: relative;
  }

  .template-studio .studio-title {
    flex: 1 1 auto;
    min-width: 0;
  }

  .template-studio .studio-title > div {
    display: grid;
    min-width: 0;
  }

  .template-studio .studio-title > div > span {
    display: none;
  }

  .template-studio .studio-title input {
    border: 0;
    font-size: 0.98rem;
    height: 44px;
    min-width: 0;
    padding: 0 6px;
    width: 100%;
  }

  .template-studio .studio-status {
    display: none;
  }

  .template-studio .studio-actions {
    align-items: center;
    background: rgba(255, 255, 255, 0.98);
    border-top: 1px solid var(--mobile-app-border);
    bottom: 0;
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    height: calc(64px + env(safe-area-inset-bottom));
    left: 0;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
    position: fixed;
    right: 0;
    width: 100%;
    z-index: 1080;
  }

  .template-studio .studio-actions .studio-button {
    font-size: 0.74rem;
    height: 46px;
    min-width: 0;
    padding: 0 8px;
    width: 100%;
  }

  .template-studio .studio-context,
  .template-studio .studio-message {
    min-height: 36px;
    overflow: hidden;
    padding: 7px 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .template-studio .studio-workflow {
    display: flex;
    min-height: 58px;
    overflow-x: auto;
    padding: 0 4px;
    scrollbar-width: none;
  }

  .template-studio .studio-workflow::-webkit-scrollbar,
  .studio-mobile-switcher::-webkit-scrollbar {
    display: none;
  }

  .template-studio .studio-workflow > button {
    flex: 0 0 46px;
    min-height: 58px;
    padding: 6px 4px;
  }

  .template-studio .studio-workflow > button > span {
    height: 28px;
    width: 28px;
  }

  .template-studio .studio-workflow small {
    display: none;
  }

  .template-studio .studio-workflow strong {
    display: none;
  }

  .template-studio .studio-workflow > button.active {
    flex-basis: 150px;
  }

  .template-studio .studio-workflow > button.active strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .studio-mobile-switcher {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid var(--mobile-app-border);
    display: flex !important;
    gap: 4px;
    min-height: 54px;
    overflow-x: auto;
    padding: 5px 8px;
    scrollbar-width: none;
  }

  .studio-mobile-switcher button {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 7px;
    color: #607086;
    display: flex;
    flex: 0 0 auto;
    font-size: 0.7rem;
    font-weight: 800;
    gap: 6px;
    height: 44px;
    justify-content: center;
    min-width: 86px;
    padding: 0 10px;
  }

  .studio-mobile-switcher button.active {
    background: #eaf2ff;
    color: #075dcc;
  }

  .studio-mobile-switcher .app-icon {
    height: 18px;
    width: 18px;
  }

  .template-studio .studio-workspace {
    display: block;
    height: calc(100dvh - 210px);
    min-height: 0;
    overflow: hidden;
  }

  .template-studio .studio-samples,
  .template-studio .studio-document,
  .template-studio .studio-inspector {
    display: none !important;
  }

  .template-studio[data-mobile-studio-pane="samples"] .studio-samples {
    display: block !important;
  }

  .template-studio[data-mobile-studio-pane="document"] .studio-document {
    display: grid !important;
  }

  .template-studio[data-mobile-studio-pane="fields"] .studio-inspector,
  .template-studio[data-mobile-studio-pane="table"] .studio-inspector,
  .template-studio[data-mobile-studio-pane="settings"] .studio-inspector,
  .template-studio[data-mobile-studio-pane="test"] .studio-inspector {
    display: flex !important;
  }

  .template-studio .studio-samples,
  .template-studio .studio-document,
  .template-studio .studio-inspector {
    border: 0;
    height: 100%;
    min-height: 0;
    width: 100%;
  }

  .template-studio .studio-samples {
    overflow-y: auto;
    padding-bottom: 12px;
  }

  .template-studio .studio-sample {
    min-height: 64px;
  }

  .template-studio .studio-document {
    grid-template-rows: auto minmax(0, 1fr) auto;
  }

  .template-studio .studio-document-toolbar {
    align-items: stretch;
    display: grid;
    gap: 6px;
    grid-template-columns: 1fr;
    padding: 6px 8px;
  }

  .template-studio .studio-segmented,
  .template-studio .studio-zoom {
    display: flex;
    max-width: 100%;
    overflow-x: auto;
  }

  .template-studio .studio-document-toolbar button,
  .template-studio .studio-document-toolbar select {
    flex: 0 0 auto;
    min-height: 44px;
    min-width: 44px;
  }

  .template-studio .studio-canvas-scroll {
    height: auto;
    min-height: 0;
    padding: 12px;
  }

  .template-studio .studio-document-footer {
    min-height: 48px;
    padding: 4px 8px;
  }

  .template-studio .studio-document-footer > span:not(.studio-page-navigation) {
    display: none;
  }

  .template-studio .studio-page-navigation {
    justify-content: center;
    width: 100%;
  }

  .template-studio .studio-inspector {
    flex-direction: column;
    overflow: hidden;
  }

  .template-studio .studio-tabs {
    display: none;
  }

  .template-studio .studio-tab-panel.active {
    height: 100%;
    overflow-y: auto;
    padding-bottom: 18px;
  }

  .template-studio .studio-pane-heading {
    background: #fff;
    min-height: 52px;
    position: sticky;
    top: 0;
    z-index: 4;
  }

  .template-studio button:not(.studio-text-box),
  .template-studio input:not([type="hidden"]),
  .template-studio select {
    min-height: 44px !important;
  }

  .template-studio .studio-icon-button {
    height: 44px !important;
    min-width: 44px;
    width: 44px !important;
  }

  .template-studio textarea {
    min-height: 84px;
  }

  .template-studio .studio-field-list button {
    min-height: 54px;
  }

  .template-studio .studio-rule-editor {
    padding-bottom: 18px;
  }

  .template-studio .studio-source-picker:not([hidden]) {
    background: #fff;
    border: 1px solid #d3dce8;
    border-radius: 8px 8px 0 0;
    bottom: calc(64px + env(safe-area-inset-bottom));
    box-shadow: 0 -14px 40px rgba(15, 23, 42, 0.2);
    left: 0;
    max-height: 66dvh;
    overflow-y: auto;
    padding: 16px;
    position: fixed;
    right: 0;
    z-index: 1090;
  }

  .template-studio .studio-source-picker > div:last-child {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .template-studio .studio-source-picker button {
    width: 100%;
  }

  .template-studio .studio-column-list-header {
    display: none;
  }

  .template-studio .studio-column-card {
    gap: 8px;
    grid-template-columns: minmax(0, 1fr) 44px;
    padding: 10px;
  }

  .template-studio .studio-column-identity {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    overflow: hidden;
    width: 100%;
  }

  .template-studio .studio-column-identity > span:last-child {
    min-width: 0;
  }

  .template-studio .studio-column-identity strong,
  .template-studio .studio-column-identity small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .template-studio .studio-column-remove {
    grid-column: 2;
    grid-row: 1;
  }

  .template-studio .studio-column-card > select,
  .template-studio .studio-custom-column,
  .template-studio .studio-date-column-settings {
    grid-column: 1 / -1;
    width: 100%;
  }

  .template-studio .studio-date-column-settings,
  .template-studio .studio-column-card > :not(label):not(button) {
    max-width: 100%;
  }

  .template-studio .studio-row-defaults #item-default-list {
    grid-template-columns: 1fr;
  }

  .template-studio .studio-test-table-wrap {
    max-width: 100%;
    overflow-x: auto;
  }

  .template-studio .studio-test-json pre,
  .template-studio .studio-advanced pre {
    max-width: 100%;
    overflow-x: auto;
  }
}

@media (max-width: 380px) {
  .template-studio .studio-context {
    display: none;
  }

  .template-studio .studio-workspace {
    height: calc(100dvh - 174px);
  }

  .studio-mobile-switcher button {
    min-width: 78px;
    padding-inline: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-more-sheet,
  .mobile-sheet-panel {
    scroll-behavior: auto;
    transition: none !important;
  }
}