/* Layout adaptations only: keep the shared type scale and desktop composition. */
.mobile-menu-toggle { display: none; }
.menu-close { display: none; }
button, input, select, textarea { touch-action: manipulation; }
.order-content .muted { display: flex; flex-wrap: wrap; gap: .25rem; }
.modal h3, .modal p, .store-preview-card p { overflow-wrap: anywhere; }
.modal-head h2 { min-width: 0; overflow-wrap: anywhere; }
.modal-head > button { flex-shrink: 0; }
/* The old sign-in columns need at least 800px; switch before they overflow. */
@media (max-width: 900px) {
  .metrics { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem 0; }
  .metric:nth-child(n) { padding: .75rem 1rem; min-height: 6.5rem; }
  .metric:nth-child(odd) { padding-left: 0; }
  .metric:nth-child(even) { border-right: 0; }
  .metric:nth-child(n+3) { border-top: 1px solid var(--line); padding-top: 1rem; }
  .store-layout { display: flex; flex-direction: column; }
  .auth-shell { display: block; }
  .auth-story { display: none; }
  .auth-panel { padding-left: max(1.5rem,env(safe-area-inset-left)); padding-right: max(1.5rem,env(safe-area-inset-right)); min-height: 100dvh; padding-top: 1.875rem; padding-bottom: max(1.25rem,env(safe-area-inset-bottom)); justify-content: flex-start; }
  .auth-mobile-brand { display: block; margin: 0 auto 2rem; width: 100%; max-width: 24.375rem; }
  .auth-mobile-brand small { display: block; }
  .auth-content { max-width: 24.375rem; margin: 0 auto; }
  .auth-footer { margin-top: auto; padding-top: 2rem; }
}
@media (max-width: 767px) {
  :root { --type-page: 1.5rem; --type-number: 1.75rem; }
  .topbar { position: sticky; top: 0; z-index: 20; min-height: 4.25rem; padding: max(.5rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) .5rem max(1rem,env(safe-area-inset-left)); grid-template-columns: minmax(0,1fr) auto auto; gap: 0 .625rem; align-items: center; background: #f5f2ebf5; backdrop-filter: blur(12px); }
  .wordmark { grid-column: 1; grid-row: 1; font-size: 1.625rem; }
  .top-account { grid-column: 2; grid-row: 1; }
  .topbar .account-button { min-width: 2.75rem; min-height: 2.75rem; justify-content: center; }
  .topbar .account-name, .account-button > svg { display: none; }
  .account-avatar { width: 2rem; height: 2rem; }
  .mobile-menu-toggle { display: inline-flex; grid-column: 3; grid-row: 1; align-items: center; gap: .375rem; min-height: 2.75rem; padding: .5rem; border: 1px solid var(--line); border-radius: .375rem; }
  .mobile-menu-toggle svg { width: 1.25rem; height: 1.25rem; }
  .topnav { display: none; grid-column: 1 / -1; grid-row: 2; min-height: 0; overflow: visible; }
  .topbar:has(.mobile-menu-toggle[aria-expanded=true]) .topnav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .25rem .75rem; padding: .75rem 0 .25rem; border-top: 1px solid var(--line); margin-top: .5rem; }
  .mobile-menu-toggle[aria-expanded=true] .menu-lines { display: none; }
  .mobile-menu-toggle[aria-expanded=true] .menu-close { display: block; }
  .nav-link { padding: .625rem .5rem; justify-content: flex-start; white-space: normal; }
  .nav-link.active { background: #e7e4d9; border-radius: .25rem; }
  .nav-link:after { display: none; }
  .studio-main { padding: 1.25rem max(1rem,env(safe-area-inset-right)) max(1.5rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left)); }
  .page-heading { flex-wrap: wrap; align-items: flex-start; gap: .75rem; }
  .page-heading p { max-width: none; }
  .page-heading > div:has(h1) { flex-basis: 100%; }
  .heading-actions { max-width: 100%; }
  .heading-actions:empty { display: none; }
  .primary, .secondary, .text-link, .quiet, .offer-actions button, .modal-head > button, .auth-reset-row button { min-height: 2.75rem; }
  .primary, .secondary { white-space: normal; overflow-wrap: anywhere; }
  .icon-button, .modal-head > button { min-width: 2.75rem; }
  .metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .metric { min-width: 0; }
  .filter-tabs { flex-wrap: wrap; gap: .25rem .75rem; overflow: visible; }
  .filter-tabs button { padding: .625rem .25rem; }
  .toolbar { flex-wrap: wrap; align-items: flex-end; }
  .search-wrap { flex-basis: 100%; max-width: none; }
  .toolbar > select { width: 100%; }
  .product-grid, .manage-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .product-controls { align-items: flex-start; }
  .inventory button { min-height: 2.75rem; width: 2.75rem; }
  .compact.offer-card { grid-template-columns: 4.25rem minmax(0,1fr); }
  .compact .offer-actions { grid-column: 1 / -1; grid-row: 3; display: flex; justify-content: flex-end; border-top: 1px solid var(--line); padding-top: .75rem; margin-top: .5rem; gap: .75rem; }
  .compact .offer-actions button { flex: 1; }
  .offer-price { max-width: 100%; }
  .order-top { flex-wrap: wrap; gap: .5rem; }
  .order-content { flex-wrap: wrap; }
  .order-content > div:not(.catalog-photo) { flex-basis: calc(100% - 6.5rem); min-width: 0; }
  .order-content > button { width: 100%; margin: .5rem 0 0; }
  .store-layout { display: flex; flex-direction: column; }
  .two { grid-template-columns: minmax(0,1fr); gap: 0; }
  .settings-form, .store-preview-card { padding: 1.25rem 1rem; }
  .store-preview-card button { max-width: 100%; }
  .finance-card { padding: 1.25rem 1rem; min-width: 0; }
  .payout-breakdown > div { flex-wrap: wrap; gap: .25rem .75rem; }
  .payout-breakdown dd { margin-left: auto; }
  .sales-title-row h2 { flex-basis: 100%; }
  .sales-mode-switch { width: 100%; }
  .sales-mode-switch button { flex: 1; }
  .sales-analytics, .daily-sales { padding: 1.25rem 1rem; }
  .sales-chart-points { --sales-point-min: 2.75rem; }
  .sales-chart-scroll { scroll-padding-inline: .25rem; }
  .sales-day-control { width: 100%; }
  .sales-day-control label { flex: 1; min-width: 0; }
  .sales-day-control input { width: 100%; min-width: 0; }
  .sales-picker { flex-basis: 100%; min-width: 0; }
  .sales-picker input { width: 100%; min-width: 0; }
  /* Card rows retain every table field instead of shrinking type or clipping columns. */
  .pricing-table, .payout-history-table { white-space: normal; }
  :is(.pricing-table,.payout-history-table) thead { display: none; }
  :is(.pricing-table,.payout-history-table) tbody { display: grid; gap: 1rem; }
  :is(.pricing-table,.payout-history-table) tr { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem 1rem; padding: 1rem; border: 1px solid var(--line); border-radius: .5rem; }
  :is(.pricing-table,.payout-history-table) :is(td,td:first-child,td:last-child) { display: flex; flex-direction: column; align-items: flex-start; gap: .25rem; border: 0; padding: 0; min-width: 0; max-width: none; white-space: normal; }
  :is(.pricing-table,.payout-history-table) td::before { color: var(--muted); font-size: var(--type-caption); font-weight: var(--weight-regular); }
  :is(.pricing-table,.payout-history-table) td:first-child { grid-column: 1 / -1; }
  :is(.pricing-table,.payout-history-table) .numeric-cell { align-items: flex-end; text-align: right; }
  .pricing-table td:first-child button { min-height: 2.75rem; text-align: left; font-size: var(--type-body); }
  .pricing-table td:nth-child(2)::before { content: '出品価格'; }
  .pricing-table td:nth-child(3)::before { content: '提案価格'; }
  .pricing-table td:nth-child(4)::before { content: '変化'; }
  .pricing-table td:nth-child(5) { grid-column: 1 / -1; overflow-wrap: anywhere; }
  .pricing-table td:nth-child(5)::before { content: '参考情報'; }
  .payout-history-table td:first-child::before { content: '振込日'; }
  .payout-history-table td:nth-child(2)::before { content: '商品売上'; }
  .payout-history-table td:nth-child(3)::before { content: '手数料'; }
  .payout-history-table td:nth-child(4)::before { content: '振込額'; }
  .payout-history-table td:nth-child(5)::before { content: '状態'; }
  dialog { width: calc(100% - 1.5rem); max-height: calc(100dvh - 1.5rem); margin: auto; overflow: auto; scroll-padding-block: 4.5rem 1rem; }
  .modal { padding: 0 1rem max(1rem,env(safe-area-inset-bottom)); }
  .modal-head { position: sticky; top: 0; z-index: 2; margin: 0 -1rem 1.25rem; padding: .75rem 1rem; background: var(--paper); border-bottom: 1px solid var(--line); }
  .actions, .actions.spread, .actions.spread > div { width: 100%; gap: .75rem; }
  .actions > :is(.primary,.secondary), .actions.spread > div > button { flex: 1; }
  .actions.spread > div { display: flex; flex-wrap: wrap; }
  .modal-product { align-items: flex-start; }
  .modal-product > div:not(.catalog-photo) { flex: 1; }
  .preview-items { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #toast { bottom: max(1rem,env(safe-area-inset-bottom)); }
}
@media (max-width: 359px) {
  .product-grid, .manage-grid, .preview-items { grid-template-columns: minmax(0,1fr); }
  .metrics { grid-template-columns: minmax(0,1fr); gap: 0; }
  .metric:nth-child(n) { min-height: 0; padding: .875rem 0; border: 0; border-bottom: 1px solid var(--line); }
  .metric:last-child { border-bottom: 0; }
  .pricing-table tr { grid-template-columns: minmax(0,1fr); }
  .pricing-table td:nth-child(n) { grid-column: 1; }
}
@media (max-height: 500px) and (max-width: 900px) {
  .topbar { position: static; }
  dialog { max-height: calc(100dvh - 1rem); }
}