/* Universe UI: measured from the production inventory and sales lists, 2026-10-21.
   Screen-only presentation. No table widths, business states or print layout changes. */
@media screen {
  :root {
    --universe-font: "Yu Gothic UI", Meiryo, system-ui, sans-serif;
    --universe-text: #151515;
    --universe-muted: #5c6972;
    --universe-line: #e4e9ed;
    --universe-border: #cbd3d8;
    --universe-canvas: #f4f4f3;
    --universe-heading: #ededeb;
    --universe-accent: #08709f;
    --universe-accent-soft: #edf7fc;
    --universe-row: 40px;
    --universe-cell-font: 11px;
  }
  body { font-family: var(--universe-font) !important; }
  body .app-shell { font-family: var(--universe-font); color: var(--universe-text); font-size: 13px; line-height: 1.5; }
  body .app-shell :is(button,input,select,textarea) { font-family: var(--universe-font) !important; }
  body .app-shell :is(.content,.workspace,.main-content) { background-color: var(--universe-canvas); }
  body .app-shell :is(h1,.page-title) { font-size: 20px !important; line-height: 1.4; font-weight: 800; letter-spacing: 0; }
  body .app-shell :is(h2,.table-toolbar h2,.panel-head h2,.topbar h2) { font-size: 15px !important; line-height: 1.45; font-weight: 800; letter-spacing: 0; }
  body .app-shell h3 { font-size: 13px; line-height: 1.45; }
  body .app-shell :is(.panel,.table-card,.card,.settings-card) { border-color: var(--universe-border); border-radius: 4px; box-shadow: 0 1px 2px #00000008; }
  body .app-shell :is(.table-toolbar,.panel-head,.table-card > header,.settings-card > header) { padding: 10px 12px; border-bottom-color: var(--universe-line); }
  body .app-shell :is(.table-toolbar,.panel-head,.topbar) p { color: var(--universe-muted); font-size: 11px !important; line-height: 1.5; }

  /* Only ordinary data lists: calendar grids, document sheets and diagrams retain their layout. */
  body .app-shell .table-wrap > table { border-collapse: collapse; font-family: var(--universe-font); }
  body .app-shell .table-wrap > table > :is(thead,tbody,tfoot) > tr > :is(th,td) {
    box-sizing: border-box; height: var(--universe-row) !important;
    padding: 5px 6px !important; font-size: var(--universe-cell-font) !important;
    line-height: 1.35 !important; vertical-align: middle; text-align: center;
    border-bottom: 1px solid var(--universe-line); border-right-color: var(--universe-line);
  }
  body .app-shell .table-wrap > table > thead > tr > th {
    background: var(--universe-heading) !important; color: #272727 !important; font-weight: 700;
  }
  body .app-shell .table-wrap > table > tbody > tr:hover > td { background-color: var(--universe-accent-soft); }
  body .app-shell .table-wrap > table :is(button,select,input:not([type=checkbox]):not([type=radio])) {
    font-size: 11px !important; line-height: 1.35 !important; border-radius: 3px;
  }
  body .app-shell .table-wrap > table :is(button,select) { min-height: 28px; }
  body .app-shell .table-wrap > table :is(.text-left,.align-left) { text-align: left; }
  body .app-shell .table-wrap > table :is(.numeric,.money,.amount,.text-right,.align-right) { text-align: right; font-variant-numeric: tabular-nums; }
  body .app-shell .table-wrap > table td :is(small,.muted) { font-size: 10px; }

  body .app-shell :is(.filters,.filter-bar,.search-grid,.form-grid,.settings-form,.simple-deal-form) label { font-size: 11px; line-height: 1.5; font-weight: 700; min-width: 0; }
  body .app-shell :is(.filters,.filter-bar,.search-grid,.form-grid,.settings-form,.simple-deal-form) :is(input:not([type=checkbox]):not([type=radio]),select,textarea) {
    box-sizing: border-box; min-width: 0; max-width: 100%; min-height: 32px;
    padding: 6px 8px; border: 1px solid #aeb8be; border-radius: 3px; background: #fff; color: #18232b; font-size: 12px; line-height: 1.45;
  }
  body .app-shell :is(input,select,textarea):focus-visible { outline: 2px solid #1595ce; outline-offset: 1px; }
  body .app-shell :is(button,a):focus-visible { outline: 2px solid #1595ce; outline-offset: 2px; }
  body .app-shell :is(.primary,button.primary,.button-primary,.btn-primary) { background: var(--universe-accent) !important; border-color: var(--universe-accent) !important; color: #fff !important; border-radius: 3px; font-weight: 700; }
  body .app-shell :is(.table-toolbar,.filters,.filter-bar,.search-grid,.form-actions,.modal-actions,.panel-actions) > button { font-size: 12px; min-height: 32px; border-radius: 3px; }
  body .app-shell button:disabled { cursor: not-allowed; }
  body .app-shell :is(.sidebar,.side-nav) { background: #191d20 !important; color: #fff; }
  body .app-shell .sidebar :is(button.active,a.active,[aria-current=page]) { background: #273c47 !important; color: #fff !important; border-color: #1595ce; }

  /* DB and appraisal already share these shell/component classes. */
  body main.app-shell .content { background: var(--universe-canvas); }
  body main.app-shell .topbar { border-bottom: 1px solid var(--universe-border); background: #fff; }
  body main.app-shell .topbar :is(h1,h2) { font-size: 20px !important; }
  body main.app-shell :is(.spec-grid,.form-grid) { gap: 10px 12px; }
  body main.app-shell :is(.panel-head,.table-card > header) { background: #fff; }
  body main.app-shell :is(.eyebrow,.section-no) { color: var(--universe-accent); }
}
@media screen and (max-width: 760px) {
  :root { --universe-row: 44px; --universe-cell-font: 12px; }
  body .app-shell :is(h1,.page-title) { font-size: 18px !important; }
  body .app-shell :is(.filters,.filter-bar,.search-grid,.form-grid,.settings-form,.simple-deal-form) label { font-size: 12px; }
  /* Avoid iOS focus zoom and keep touch targets usable. */
  body main.app-shell :is(input:not([type=checkbox]):not([type=radio]),select,textarea),
  body .app-shell :is(.filters,.filter-bar,.search-grid,.form-grid,.settings-form,.simple-deal-form) :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { min-height: 44px; font-size: 16px !important; }
  body main.app-shell :is(.content,.panel,.modal-actions) button:not(.icon):not([aria-label*=閉じる]) { min-height: 44px; }
  body .app-shell .table-wrap > table :is(button,select) { min-height: 36px; }
}
