/* Apple Ledger V2: screen-only presentation layer. Business and print rules stay unchanged. */
@media screen {
  :root {
    --bg: #f5f5f7;
    --panel: #ffffff;
    --panel-2: #fafafc;
    --line: #d2d2d7;
    --line-strong: #b8b8bd;
    --text: #1d1d1f;
    --muted: #505a5e;
    --primary: #0a7f5a;
    --primary-2: #066b4b;
    --success: #0a7f5a;
    --warning: #8a6100;
    --danger: #9f403d;
    --info: #007aff;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.035);
    --radius: 8px;
    --radius-sm: 6px;
    --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei UI", "Microsoft YaHei", sans-serif;
  }

  html,
  body {
    background: var(--bg) !important;
    color: var(--text);
    font-family: var(--font);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }

  body {
    line-height: 1.45;
  }

  button,
  input,
  select,
  textarea {
    border-radius: 6px;
  }

  button:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible,
  summary:focus-visible,
  [tabindex]:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
  }

  input:focus,
  select:focus,
  textarea:focus {
    border-color: #0a7f5a;
    box-shadow: 0 0 0 3px rgba(10, 127, 90, 0.12);
  }

  .app {
    background: var(--bg) !important;
  }

  .sidebar {
    width: 212px !important;
    overscroll-behavior-y: auto;
    border-right: 1px solid var(--line) !important;
    background: #ecedef !important;
    color: var(--text) !important;
  }

  .sidebar::-webkit-scrollbar-thumb {
    background: #c7c7cc;
  }

  .sidebar .brand {
    min-height: 70px;
    padding: 13px 16px !important;
    border-bottom: 1px solid var(--line) !important;
  }

  .sidebar .brand-mark {
    width: 34px !important;
    height: 34px !important;
    border: 1px solid rgba(10, 127, 90, 0.14) !important;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  }

  .sidebar .brand-copy h1 {
    color: var(--text) !important;
    font-size: 14px !important;
    font-weight: 650 !important;
  }

  .sidebar .brand-copy p {
    color: var(--muted) !important;
  }

  .side-nav {
    padding: 12px 10px !important;
  }

  .side-nav .nav-group + .nav-group {
    margin-top: 5px;
  }

  .side-nav .nav-label {
    display: none;
  }

  .side-nav .nav-btn {
    min-height: 40px;
    gap: 10px !important;
    padding: 8px 10px !important;
    color: #3f464d !important;
    font-size: 13px;
    font-weight: 500;
    transition: none !important;
  }

  .side-nav .nav-btn:hover {
    border-color: transparent !important;
    background: #e2e3e6 !important;
    color: var(--text) !important;
  }

  .side-nav .nav-btn.active {
    border-color: #0a7f5a !important;
    background: #0a7f5a !important;
    color: #fff !important;
    box-shadow: 0 1px 2px rgba(0, 76, 52, 0.16) !important;
  }

  .side-nav .nav-btn.active::before {
    display: none !important;
  }

  .side-nav .nav-icon,
  .side-nav .nav-icon svg,
  .side-nav .nav-btn:hover .nav-icon,
  .side-nav .nav-btn.active .nav-icon {
    color: currentColor !important;
  }

  .side-nav .nav-arrow {
    color: #5f6065 !important;
  }

  .side-nav .nav-btn.active .nav-arrow {
    color: rgba(255, 255, 255, 0.78) !important;
  }

  .sidebar-utility {
    gap: 7px !important;
    padding: 10px !important;
    border-top: 1px solid var(--line) !important;
  }

  .sidebar-save-state {
    color: var(--muted) !important;
  }

  .sidebar .pill {
    border-color: #c8d9d3 !important;
    background: #f4faf7 !important;
    color: #17654f !important;
  }

  .sidebar-lock-button,
  .sidebar-utility > button {
    border: 1px solid transparent !important;
    background: transparent !important;
    color: #55565b !important;
  }

  .sidebar-lock-button:hover,
  .sidebar-utility > button:hover {
    border-color: transparent !important;
    background: #e2e3e6 !important;
    color: var(--text) !important;
  }

  .sidebar-account {
    border: 1px solid #d7d7dc;
    background: rgba(255, 255, 255, 0.58);
  }

  .sidebar-avatar {
    border-color: #c8d9d3;
    background: #e1f0ea;
    color: #0a6549;
  }

  .sidebar-account strong {
    color: var(--text);
  }

  .sidebar-account small {
    color: var(--muted);
  }

  .sidebar-account-menu-button {
    color: var(--muted) !important;
  }

  .sidebar-account-menu-button:hover,
  .sidebar-account-menu-button[aria-expanded="true"] {
    background: #e2e3e6 !important;
    color: var(--text) !important;
  }

  .sidebar-account-menu {
    border-color: var(--line);
    background: #fff;
    box-shadow: 0 16px 36px rgba(29, 29, 31, 0.16);
  }

  .sidebar-account-menu-head {
    border-bottom-color: var(--line);
  }

  .sidebar-account-menu-head strong,
  .sidebar-account-menu > button strong {
    color: var(--text);
  }

  .sidebar-account-menu-head small,
  .sidebar-account-menu > button small,
  .sidebar-account-menu > button svg {
    color: var(--muted);
  }

  .sidebar-account-menu > button {
    border-bottom-color: #ececef !important;
    color: var(--text) !important;
  }

  .sidebar-account-menu > button:hover {
    background: #f5f5f7 !important;
  }

  .main {
    margin-left: 212px;
    padding-top: 52px !important;
    padding-bottom: 22px !important;
    background: var(--bg) !important;
  }

  .product-topbar {
    left: 212px;
    height: 52px;
    min-height: 52px;
    padding: 7px 22px;
    border-bottom-color: var(--line);
    background: #fff;
  }

  .product-company-context strong {
    font-size: 13px;
    font-weight: 650;
  }

  .product-icon-button,
  .product-lock-button {
    min-height: 34px;
    border-color: transparent !important;
    border-radius: 6px !important;
    background: transparent !important;
  }

  .product-icon-button {
    width: 34px;
  }

  .product-icon-button:hover,
  .product-lock-button:hover {
    border-color: transparent !important;
    background: #f1f1f3 !important;
  }

  .main > .topbar,
  .main > #moduleShell,
  .main > #quoteSection,
  .main > #quotePreviewSection,
  .main > #costSection,
  .main > #costPreview {
    width: calc(100% - 44px);
    max-width: none;
  }

  .main > .topbar {
    min-height: 68px;
    padding: 8px 0 6px !important;
  }

  body:has(#workbenchTab:not(.hidden)) .main > .topbar .top-status {
    position: absolute;
    top: 11px;
    left: 104px;
    justify-content: flex-start;
  }

  .workspace-heading .eyebrow {
    display: none;
  }

  .workspace-heading h1 {
    font-size: 27px !important;
    font-weight: 650 !important;
    line-height: 1.2;
  }

  .workspace-heading p {
    margin-top: 4px !important;
    font-size: 12px !important;
  }

  .pill {
    border-radius: 5px !important;
  }

  .cloud-sync-pill.cloud-online,
  .pill.final,
  .pill.success {
    border-color: #b7ddcf !important;
    background: #e9f6f0 !important;
    color: #0a6d4e !important;
  }

  .section,
  .dashboard-panel,
  .workbench-panel,
  .fixed-panel,
  .designer-card,
  .contract-editor,
  .payment-ledger,
  .order-management-list,
  .customer-directory-wrap,
  .customer-orders-wrap,
  .dashboard-ledger-wrap,
  .cost-table-wrap,
  .fixed-table-wrap {
    border-color: var(--line) !important;
    border-radius: 8px !important;
    box-shadow: var(--shadow) !important;
  }

  .dashboard-composition-panel .cost-legend {
    overscroll-behavior-y: auto;
  }

  @media (min-width: 961px) {
    #ordersTab .order-browser {
      min-height: max(560px, calc(100vh - 220px));
    }
  }

  #workbenchTab {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.82fr);
    gap: 14px;
  }

  #businessDashboard {
    display: contents;
  }

  #businessDashboard > .dashboard-toolbar,
  #workbenchPage,
  #businessDashboard > .dashboard-kpis {
    grid-column: 1 / -1;
  }

  #businessDashboard > .dashboard-toolbar {
    grid-row: 1;
    position: absolute;
    top: -56px;
    right: 0;
    left: 0;
    z-index: 2;
  }

  #workbenchPage {
    grid-row: 2;
    margin-top: -28px;
  }

  #businessDashboard > .dashboard-kpis {
    grid-row: 3;
  }

  #businessDashboard > .dashboard-primary-grid,
  #businessDashboard > .dashboard-secondary-grid {
    display: contents;
  }

  .dashboard-trend-panel {
    grid-column: 1;
    grid-row: 4;
  }

  .dashboard-material-panel {
    grid-column: 2;
    grid-row: 4;
  }

  .dashboard-composition-panel {
    grid-column: 1;
    grid-row: 5;
  }

  .dashboard-receivable-panel {
    grid-column: 2;
    grid-row: 5;
  }

  #businessDashboard > :nth-child(5) {
    grid-column: 1 / -1;
    grid-row: 6;
  }

  #businessDashboard > :nth-child(6) {
    grid-column: 1 / -1;
    grid-row: 7;
  }

  .dashboard-toolbar {
    min-height: 38px;
  }

  .dashboard-toolbar > .left {
    margin-left: auto;
    gap: 8px;
  }

  .dashboard-toolbar > .right {
    position: absolute;
    top: 58px;
    right: 0;
    margin: 0;
  }

  .dashboard-toolbar > .right .workflow-official {
    padding-right: 0 !important;
    border-color: transparent !important;
    background: transparent !important;
    color: var(--muted) !important;
  }

  .dashboard-toolbar > .right .pill:not(.workflow-official):not(.warn) {
    display: none;
  }

  .dashboard-segment {
    padding: 2px !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: #e9e9ec !important;
  }

  .dashboard-segment button {
    min-width: 56px;
    min-height: 30px;
    padding: 5px 11px;
    border-radius: 4px !important;
    font-size: 12px;
  }

  .dashboard-toolbar select {
    min-height: 34px;
    border-radius: 6px !important;
    font-size: 12px;
  }

  .workbench-overview {
    min-height: 46px;
    justify-content: flex-start !important;
    gap: 14px;
    padding: 9px 12px !important;
    padding-right: 250px !important;
    border-width: 0 0 1px !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  .workbench-statuses {
    gap: 20px;
    font-size: 11px;
  }

  .workbench-statuses .workbench-date {
    order: -1;
  }

  .workbench-overview > button {
    margin-left: 0;
  }

  .workbench-statuses > span + span {
    position: relative;
  }

  .workbench-statuses > span + span::before {
    position: absolute;
    left: -11px;
    width: 1px;
    height: 12px;
    background: var(--line);
    content: "";
  }

  .dashboard-kpis {
    display: grid !important;
    grid-template-columns: minmax(250px, 1.18fr) repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(2, minmax(98px, auto));
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    box-shadow: var(--shadow);
  }

  .dashboard-kpi,
  .dashboard-kpi:nth-child(n) {
    display: flex;
    min-height: 98px;
    flex-direction: column;
    justify-content: center;
    padding: 16px 34px 14px 16px !important;
    border: 0 !important;
    border-right: 1px solid var(--line) !important;
    border-bottom: 1px solid var(--line) !important;
    background: #fff !important;
  }

  .dashboard-kpi:nth-child(1) { grid-area: 1 / 2; }
  .dashboard-kpi:nth-child(2) { grid-area: 1 / 3; }
  .dashboard-kpi:nth-child(3) { grid-area: 1 / 4; border-right: 0 !important; }
  .dashboard-kpi:nth-child(4) { grid-area: 2 / 2; border-bottom: 0 !important; }
  .dashboard-kpi:nth-child(5) {
    grid-area: 1 / 1 / 3 / 2;
    min-height: 196px;
    padding: 24px 40px 22px 22px !important;
    border-bottom: 0 !important;
    background: #fafafc !important;
  }
  .dashboard-kpi:nth-child(6) { grid-area: 2 / 3; border-bottom: 0 !important; }
  .dashboard-kpi:nth-child(7) { grid-area: 2 / 4; border-right: 0 !important; border-bottom: 0 !important; }

  .dashboard-kpi:hover,
  .dashboard-kpi:nth-child(5):hover {
    background: #f5f5f7 !important;
  }

  .dashboard-kpi span {
    margin-bottom: 8px !important;
    color: var(--muted) !important;
    font-size: 12px !important;
    font-weight: 400;
  }

  .dashboard-kpi strong,
  .dashboard-kpi.income strong,
  .dashboard-kpi.balance strong,
  .dashboard-kpi.outstanding strong {
    color: var(--text);
    font-family: var(--font);
    font-size: 18px !important;
    font-weight: 550;
    font-variant-numeric: tabular-nums;
    line-height: 1.15;
  }

  .dashboard-kpi:nth-child(5) strong {
    font-size: 32px !important;
    font-weight: 650;
  }

  .dashboard-kpi small {
    margin-top: 8px !important;
    color: var(--muted) !important;
    font-size: 12px !important;
    line-height: 1.6;
    white-space: normal;
  }

  .dashboard-kpi:nth-child(5) small {
    color: #0a7f5a !important;
    white-space: normal;
  }

  .dashboard-kpi-open {
    top: 15px !important;
    right: 14px !important;
    color: #c4c4c8 !important;
  }

  .dashboard-panel {
    min-width: 0;
    border: 1px solid var(--line) !important;
    background: #fff !important;
  }

  .dashboard-panel-head {
    min-height: 52px;
    padding: 12px 14px !important;
    border-bottom-color: #e7e7ea !important;
  }

  .dashboard-panel-head > div > strong,
  .dashboard-panel-head > strong {
    color: var(--text);
    font-size: 14px;
    font-weight: 650;
  }

  .dashboard-chart-legend b {
    color: var(--muted) !important;
    font-size: 10px;
    font-weight: 500;
  }

  .dashboard-chart-legend b:first-child::before {
    background: #0a7f5a;
  }

  .dashboard-chart-legend b:last-child::before {
    background: #1d1d1f;
  }

  .dashboard-trend-panel .trend-chart {
    height: 252px !important;
    margin: 6px 14px 12px !important;
  }

  .dashboard-trend-panel .trend-chart line {
    stroke: #e7e7ea !important;
    stroke-width: 1 !important;
  }

  .dashboard-trend-panel .trend-chart path:first-of-type {
    stroke: #0a7f5a !important;
    stroke-width: 1.8 !important;
  }

  .dashboard-trend-panel .trend-chart path:last-of-type {
    stroke: #1d1d1f !important;
    stroke-width: 1.6 !important;
  }

  .dashboard-trend-panel .trend-chart circle {
    display: none;
  }

  .dashboard-trend-panel .trend-chart text {
    fill: var(--muted) !important;
    font-size: 11px;
  }

  .dashboard-material-panel .dashboard-panel-head > button {
    display: none;
  }

  .board-usage-bars {
    display: grid;
    min-height: 270px;
    align-content: start;
    grid-template-columns: 1fr;
    gap: 22px;
    padding: 22px 16px 20px;
  }

  .board-usage-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto 5px;
    gap: 7px 12px;
    text-align: left;
  }

  .board-usage-item span,
  .board-usage-item strong {
    font-size: 11px;
    font-weight: 500;
  }

  .board-usage-item strong {
    grid-column: 2;
    grid-row: 1;
    color: var(--text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-variant-numeric: tabular-nums;
  }

  .board-usage-track {
    display: block;
    width: 100%;
    min-height: 4px;
    grid-column: 1 / -1;
    grid-row: 2;
    overflow: hidden;
    border: 0;
    border-radius: 2px;
    background: #e5e5e9;
  }

  .board-usage-track i {
    display: block;
    width: var(--usage, 0%);
    height: 4px !important;
    border-radius: 2px;
    background: #1d1d1f !important;
  }

  .board-usage-item:nth-child(2) .board-usage-track i {
    background: #8e8e93 !important;
  }

  .board-usage-item:nth-child(3) .board-usage-track i {
    background: #c7c7cc !important;
  }

  .dashboard-composition-panel .cost-composition {
    min-height: 270px;
  }

  .dashboard-composition-panel .cost-legend {
    scrollbar-color: #b8b8bd transparent;
  }

  .dashboard-composition-panel .cost-legend::-webkit-scrollbar-thumb {
    background: #b8b8bd;
  }

  .dashboard-receivable-panel .dashboard-receivable-list {
    min-height: 270px;
  }

  .dashboard-receivable-row.head {
    background: #fafafc !important;
  }

  .dashboard-ledger,
  .customer-directory,
  .customer-orders,
  .cost-table,
  .fixed-table,
  table {
    font-variant-numeric: tabular-nums;
  }

  th {
    background: #f5f5f7 !important;
    color: #55565b !important;
  }

  tbody tr:hover td {
    background: #fafafc;
  }

  .order-filter-tabs button.active,
  .customer-directory-row.active,
  .system-tools-nav button.active {
    border-color: #abd4c5 !important;
    background: #e8f4ef !important;
    color: #086b4d !important;
  }

  @media (max-width: 1180px) {
    .dashboard-kpis {
      grid-template-columns: minmax(230px, 1.08fr) repeat(3, minmax(0, 1fr)) !important;
    }

    .dashboard-kpi,
    .dashboard-kpi:nth-child(n) {
      padding-right: 28px !important;
      padding-left: 13px !important;
    }

    .dashboard-kpi strong,
    .dashboard-kpi.income strong,
    .dashboard-kpi.balance strong,
    .dashboard-kpi.outstanding strong {
      font-size: 16px !important;
    }
  }

  @media (max-width: 960px) {
    .main {
      margin-left: 0;
    }

    .product-topbar {
      left: 0;
    }

    #workbenchTab {
      grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.9fr);
    }
  }

  @media (max-width: 800px) {
    #workbenchTab {
      grid-template-columns: 1fr;
    }

    #businessDashboard > .dashboard-toolbar {
      position: static;
      grid-column: 1;
      grid-row: 1;
    }

    #workbenchPage {
      grid-column: 1;
      grid-row: 2;
      margin-top: 0;
    }

    #businessDashboard > .dashboard-kpis {
      grid-column: 1;
      grid-row: 3;
    }

    .dashboard-toolbar {
      min-height: auto;
    }

    .dashboard-toolbar > .left {
      width: 100%;
      margin-left: 0;
      flex-wrap: wrap;
      overflow: visible;
    }

    .workbench-overview {
      padding-right: 12px !important;
    }

    .dashboard-toolbar > .right {
      display: none;
    }

    .dashboard-trend-panel {
      grid-column: 1;
      grid-row: 4;
    }

    .dashboard-material-panel {
      grid-column: 1;
      grid-row: 5;
    }

    .dashboard-composition-panel {
      grid-column: 1;
      grid-row: 6;
    }

    .dashboard-receivable-panel {
      grid-column: 1;
      grid-row: 7;
    }

    #businessDashboard > :nth-child(5) {
      grid-column: 1;
      grid-row: 8;
    }

    #businessDashboard > :nth-child(6) {
      grid-column: 1;
      grid-row: 9;
    }

    .dashboard-kpis {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      grid-template-rows: auto !important;
    }

    .dashboard-kpi:nth-child(n) {
      grid-area: auto;
      min-height: 96px;
      border-right: 1px solid var(--line) !important;
      border-bottom: 1px solid var(--line) !important;
    }

    .dashboard-kpi:nth-child(5) {
      grid-column: 1 / -1;
      grid-row: 1;
      min-height: 140px;
    }

    .dashboard-kpi:nth-child(even):not(:nth-child(5)),
    .dashboard-kpi:last-child {
      border-right: 0 !important;
    }

    .dashboard-kpi:last-child {
      grid-column: 1 / -1;
      border-bottom: 0 !important;
    }
  }

  @media (max-width: 560px) {
    .main > .topbar,
    .main > #moduleShell,
    .main > #quoteSection,
    .main > #quotePreviewSection,
    .main > #costSection,
    .main > #costPreview {
      width: min(100% - 24px, 1200px);
    }

    .dashboard-kpis {
      grid-template-columns: 1fr !important;
    }

    .dashboard-kpi:nth-child(n),
    .dashboard-kpi:nth-child(5),
    .dashboard-kpi:last-child {
      grid-column: 1;
      border-right: 0 !important;
      border-bottom: 1px solid var(--line) !important;
    }

    .dashboard-kpi:last-child {
      border-bottom: 0 !important;
    }
  }
}