/* ============================================================
   Team Management System — Responsive V2
   Bright Swiss information workspace / responsive overrides only
   Load after style.css and the desktop V2 stylesheet.
   ============================================================ */

:root {
  --ops-blue: #155eef;
  --ops-blue-deep: #0b3ea8;
  --ops-violet: #6c5ce7;
  --ops-coral: #f04452;
  --ops-coral-soft: #fff1f2;
  --ops-ink: #101828;
  --ops-muted: #667085;
  --ops-line: #dfe3eb;
  --ops-line-strong: #c7cfdd;
  --ops-canvas: #f6f8fc;
  --ops-surface: #ffffff;
  --ops-bottom-nav-h: 68px;
}

@media (max-width: 768px) {
  .ops-section-actions { gap: 10px; }
  .ops-section-actions .ops-feedback-link { font-size: 11px; }
  .issue-archive-page { width: 100%; }
  .issue-archive-head { min-height: 0; align-items: flex-start; padding: 4px 0 16px; }
  .issue-archive-head h1 { font-size: 30px; }
  .issue-archive-head p { max-width: 25ch; line-height: 1.55; }
  .issue-archive-head .btn { min-width: 44px; min-height: 44px; padding: 0 12px; }
  .issue-archive-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .issue-archive-summary > div { min-height: 72px; align-items: center; padding: 14px; }
  .issue-archive-summary strong { font-size: 26px; }
  .issue-archive-filter { grid-template-columns: 1fr 1fr; gap: 8px; }
  .issue-archive-search { grid-column: 1 / -1; }
  .issue-archive-filter :is(input, select),
  .issue-archive-filter .btn { min-height: 44px; }
  .issue-filter-reset { min-height: 44px; justify-content: center; }
  .issue-archive-ledger { margin: 12px -1px 0; }
  .issue-archive-ledger > header { align-items: flex-start; flex-direction: column; gap: 5px; padding: 12px 14px; }
  .issue-archive-row { grid-template-columns: minmax(0, 1fr) 44px; }
  .issue-archive-main { grid-template-columns: 42px minmax(0, 1fr) 16px; gap: 10px; padding: 14px 10px; }
  .issue-archive-index { font-size: 17px; }
  .issue-archive-time { display: none; }
  .issue-archive-state { grid-column: 2; display: flex; align-items: center; gap: 8px; margin-top: 7px; text-align: left; }
  .issue-archive-state b { margin: 0; }
  .issue-archive-main > i { grid-column: 3; grid-row: 1 / span 2; }
  .issue-archive-delete { margin: 16px 6px 16px 0; }
  .issue-archive-ledger > footer { justify-content: space-between; }
  .issue-detail-delete span { display: none; }
  .project-issue-open { max-width: 240px; }
  .project-event-toolbar { align-items: stretch; }
  .project-event-toolbar > .muted { flex: 1 0 100%; line-height: 1.55; }
  .project-event-toolbar .spacer { display: none; }
  .project-event-toolbar .btn { flex: 1 1 calc(33.333% - 6px); justify-content: center; min-height: 44px; }
  .project-event-timeline .tl-item { padding-left: 23px; }
  .project-event-issue-head { align-items: flex-start; gap: 9px; padding: 10px 12px; }
  .project-event-issue-head > div { flex-wrap: wrap; row-gap: 5px; }
  .project-event-issue-main { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 13px; }
  .project-event-issue-main dl { grid-template-columns: 60px minmax(0, 1fr); padding: 11px 0 0; border-top: 1px solid var(--border); border-left: 0; }
  .project-event-issue-files { padding: 11px 12px; }
  .project-event-issue .project-event-issue-files .issue-attachment-list,
  .project-issue-table-files .issue-attachment-list { grid-template-columns: minmax(0, 1fr); }
  .project-event-issue > footer { min-height: 46px; padding: 8px 12px; }
  .project-issue-table-files { max-width: 240px; }
  .report-attachment-list { grid-template-columns: 1fr; }
  .report-attachment-item { min-height: 52px; }
  .report-attachment-item > button { width: 44px; }
}

/* V2 layout hooks. Desktop visual ownership stays in the main V2 theme;
   these declarations make the named regions predictable at breakpoints. */
.ops-dashboard,
.project-workflow,
.workflow-layout,
.project-shell-head {
  min-width: 0;
}

.ops-priority,
.ops-approvals,
.ops-risk,
.ops-task-strip,
.ops-projects,
.ops-command-grid,
.ops-lower-grid,
.ops-project-table-wrap,
.workflow-rail,
.workflow-layout > * {
  min-width: 0;
}

.ops-task-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.workflow-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  align-items: start;
}

.workflow-rail {
  scrollbar-width: thin;
  scrollbar-color: var(--ops-blue) var(--ops-canvas);
}

.workflow-rail::-webkit-scrollbar {
  height: 6px;
}

.workflow-rail::-webkit-scrollbar-track {
  background: var(--ops-canvas);
}

.workflow-rail::-webkit-scrollbar-thumb {
  background: var(--ops-blue);
}

/* Approved palette: blue/violet for state, coral only for exceptions.
   Retire yellow/green semantics inside the redesigned workbench. */
:is(.ops-dashboard, .project-workflow) :is(.tag.green, .success-text, .feed-dot.green),
.project-workflow :is(.stage-chip.done, .progress-fill:not(.overdue)) {
  border-color: #b9c9fa !important;
  background: #eef3ff !important;
  color: var(--ops-blue-deep) !important;
}

:is(.ops-dashboard, .project-workflow) :is(.tag.orange, .warn-text, .feed-dot.orange) {
  border-color: #ffc4ca !important;
  background: var(--ops-coral-soft) !important;
  color: #c51f35 !important;
}

:is(.ops-dashboard, .project-workflow) :is(.tag.red, .danger-text, .feed-dot.red),
.project-workflow :is(.progress-fill.overdue, .pbar-fill.overdue) {
  border-color: var(--ops-coral) !important;
  background: var(--ops-coral) !important;
  color: #ffffff !important;
}

/* ============================================================
   Tablet — 769–1180 px
   ============================================================ */
@media (min-width: 769px) and (max-width: 1180px) {
  :root {
    --sidebar-w: 196px;
  }

  .sidebar {
    width: var(--sidebar-w);
  }

  .sidebar .brand {
    padding-inline: 14px;
  }

  .nav {
    padding-inline: 7px;
  }

  .nav-item {
    min-height: 44px;
    padding-inline: 10px;
  }

  .main {
    padding: 24px clamp(16px, 2.2vw, 30px) 40px;
  }

  .shell-v2 .topbar {
    grid-template-columns: var(--sidebar-w) minmax(160px, 1fr) auto 44px 42px auto;
    gap: 12px;
    padding-right: 16px;
  }

  .shell-v2 .topbar:not(:has(.topbar-create)) {
    grid-template-columns: var(--sidebar-w) minmax(160px, 1fr) 44px 42px auto;
  }

  .topbar-date { display: none; }
  .topbar-feedback { width: 44px; padding: 0; }
  .topbar-feedback span { display: none; }

  .ops-dashboard {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }

  .ops-command-grid {
    display: grid;
    grid-template-columns: minmax(230px, .72fr) minmax(0, 1.28fr);
    grid-template-areas:
      "priority approvals"
      "risk risk";
    gap: 14px;
  }

  .ops-priority { grid-area: priority; }
  .ops-approvals { grid-area: approvals; }
  .ops-risk { grid-area: risk; }
  .ops-risk-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ops-risk-list > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }

  .ops-task-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ops-project-heading {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .ops-project-heading h2,
  .ops-project-heading > button {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  .ops-stage-metrics {
    order: 3;
    flex: 1 0 100%;
  }

  .ops-project-filters {
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  }

  .workflow-layout {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .workflow-layout > :last-child {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  .workflow-rail {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  .project-workflow .stage-flow,
  .workflow-rail > :is(.workflow-steps, .stage-flow) {
    min-width: 860px;
    flex-wrap: nowrap;
  }

  :is(button, .btn, .tab, .nav-item, .approval-entry, input, select),
  :is(.ops-dashboard, .project-workflow) :is(a, [role="button"]) {
    min-height: 44px;
  }

  .toolbar input,
  .toolbar select,
  .filter-bar input,
  .filter-bar select {
    max-width: 100%;
  }

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

  .pj-filter-search {
    grid-column: span 2;
  }

  .pj-filter-actions {
    align-self: end;
  }
}

/* ============================================================
   Phone — designed for a 390 px viewport, not a compressed desktop
   ============================================================ */
@media (max-width: 768px) {
  html {
    min-width: 320px;
    scroll-padding-bottom: calc(var(--ops-bottom-nav-h) + env(safe-area-inset-bottom));
  }

  body {
    overflow-x: hidden;
    background: var(--ops-canvas);
    padding-bottom: env(safe-area-inset-bottom);
  }

  .layout {
    width: 100%;
    min-width: 0;
  }

  .topbar {
    width: 100%;
    min-width: 0;
    padding: env(safe-area-inset-top) 10px 0;
    gap: 7px;
  }

  .shell-v2 .topbar {
    grid-template-columns: minmax(0, 1fr) 44px 44px 44px 44px !important;
  }

  .shell-v2 .topbar:not(:has(.topbar-create)) {
    grid-template-columns: minmax(0, 1fr) 44px 44px 44px !important;
  }

  .topbar-brand {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
  }

  .tb-brand-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .topbar-search,
  .topbar-date,
  .sidebar-toggle {
    display: none !important;
  }

  .topbar-create {
    flex: 0 0 44px;
    width: 44px !important;
    min-width: 44px;
    padding-inline: 0 !important;
    overflow: hidden;
    font-size: 0 !important;
  }

  .topbar-create i {
    font-size: 18px;
  }

  .approval-entry,
  .topbar-feedback,
  .topbar-user,
  .tb-user {
    flex: 0 0 auto;
    min-width: 44px;
  }

  .approval-entry {
    width: 44px;
    height: 44px;
  }

  .topbar-feedback {
    width: 44px;
    min-width: 44px;
    height: 44px;
    padding: 0;
  }

  .topbar-feedback span { display: none; }

  .notification-center {
    width: 100vw;
    height: 100dvh;
    border-left: 0;
  }

  .feedback-drawer,
  .issue-workflow-drawer {
    width: 100vw;
    height: 100dvh;
    border-left: 0;
  }

  .sidebar {
    display: none !important;
  }

  .main {
    width: 100%;
    max-width: none;
    min-width: 0;
    padding: 16px 12px calc(var(--ops-bottom-nav-h) + 24px + env(safe-area-inset-bottom));
  }

  /* Bottom navigation is the primary mobile navigation surface. */
  .mobile-nav {
    left: 0;
    right: 0;
    bottom: 0;
    height: calc(var(--ops-bottom-nav-h) + env(safe-area-inset-bottom));
    padding: 0 0 env(safe-area-inset-bottom);
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid var(--ops-line-strong);
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 -10px 28px rgba(16, 24, 40, .08);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }

  .mn-item {
    min-width: 0;
    min-height: 44px;
    padding: 7px 4px 5px;
    border-right-color: var(--ops-line);
    border-top-width: 3px;
    touch-action: manipulation;
  }

  .mn-item > span {
    font-size: 10px;
    line-height: 1;
  }

  .mn-item em {
    max-width: 100%;
    overflow: hidden;
    font-size: 12px;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mn-item.active {
    border-top-color: var(--ops-blue);
    color: var(--ops-blue);
    background: #f6f8ff;
  }

  .mn-badge {
    top: 5px;
    right: calc(50% - 30px);
    min-width: 18px;
    min-height: 18px;
    padding: 0 5px;
    border: 2px solid #ffffff;
    background: var(--ops-coral);
    color: #ffffff;
    line-height: 14px;
  }

  /* Every mobile action is reachable without precision tapping. */
  :is(button, .btn, input, select, textarea, .tab, .approval-entry, .nav-item),
  :is(.ops-dashboard, .project-workflow, .mobile-menu-panel) :is(a, [role="button"]) {
    min-height: 44px;
  }

  .btn-sm,
  button.btn-sm {
    min-height: 44px;
    padding: 9px 13px;
  }

  input,
  select,
  textarea {
    font-size: 16px;
  }

  /* Workbench becomes a single action queue in priority order. */
  .ops-dashboard {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .ops-page-head { order: 0; }
  .ops-dashboard > .ops-notice { order: 1; }
  .ops-command-grid { order: 2; }
  .ops-task-strip { order: 3; }
  .ops-projects { order: 4; }
  .ops-lower-grid { order: 5; }

  .ops-command-grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .ops-priority { order: 1; }
  .ops-approvals { order: 2; }
  .ops-risk { order: 3; }

  .ops-dashboard > :is(section, article, div),
  .ops-priority,
  .ops-approvals,
  .ops-risk,
  .ops-task-strip,
  .ops-projects {
    width: 100%;
    min-width: 0;
  }

  .ops-priority {
    display: grid;
    grid-template-columns: minmax(78px, auto) minmax(0, 1fr);
    grid-template-areas:
      "number title"
      "counts counts";
    align-items: center;
    gap: 14px;
    padding: 18px 14px;
    border: 1px solid var(--ops-line);
    border-top: 3px solid var(--ops-blue);
    background: var(--ops-surface);
  }

  .ops-priority :is(.ops-priority-number, .priority-number, .hero-number) {
    grid-area: number;
    height: auto;
    margin: 0;
    overflow: visible;
    font-size: clamp(54px, 18vw, 76px);
    line-height: .88;
    letter-spacing: -.07em;
  }

  .ops-priority h2 {
    grid-area: title;
    margin: 0;
    font-size: 22px;
  }

  .ops-count-list {
    grid-area: counts;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
  }

  .ops-count-list > button {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 7px 0;
    border: 0;
    border-bottom: 1px solid var(--ops-line);
    background: transparent;
    text-align: left;
  }

  .ops-approvals :is(.approval-row, .approval-card, .ops-approval-row) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    min-height: 0;
    padding: 14px 0;
  }

  .ops-todo-row {
    min-height: 74px;
    grid-template-columns: 34px minmax(0, 1fr) auto 14px;
    gap: 9px;
  }

  .ops-todo-row .ops-row-index { min-height: 44px; }

  .ops-public-notice { min-height: 0; }
  .ops-public-row { min-height: 84px; grid-template-columns: 36px minmax(0, 1fr) auto; padding: 10px 0; }
  .ops-public-controls > button { width: 44px; height: 44px; }
  .ops-public-controls { grid-template-columns: 44px minmax(0, 1fr) auto 44px; }

  .ops-approvals,
  .ops-risk {
    padding: 14px;
    border: 1px solid var(--ops-line);
    background: var(--ops-surface);
  }

  .ops-approvals {
    border-left: 3px solid var(--ops-blue);
  }

  .ops-approvals .approval-card-index {
    display: none;
  }

  .ops-approvals :is(.approval-actions, .approval-card-actions),
  .ops-approvals .ops-approval-row > .btn {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .ops-approvals :is(.approval-actions, .approval-card-actions) .btn {
    width: 100%;
  }

  .ops-approvals .ops-approval-row > .btn {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .ops-risk {
    display: flex;
    flex-direction: column;
    gap: 0;
    border-left: 4px solid var(--ops-coral);
  }

  .ops-risk :is(.risk-item, .quiet-item, .reminder-item, .ops-risk-row) {
    min-height: 64px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 12px;
    padding: 12px;
    border-bottom: 1px solid var(--ops-line);
  }

  .ops-task-strip {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin: 0;
    border: 0;
    background: transparent;
  }

  .ops-task-strip > :is(a, button, div, article),
  .ops-dashboard .todo-item {
    min-height: 68px;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
  }

  .ops-task-strip .btn,
  .ops-dashboard .todo-item .btn {
    min-width: 88px;
  }

  /* Existing dashboard receives the same action-first behavior while V2
     markup is being adopted. */
  .dash-head,
  .page-head {
    align-items: flex-start;
    gap: 12px;
  }

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

  .dash-actions .btn:first-child:last-child,
  .page-actions .btn:first-child:last-child {
    grid-column: 1 / -1;
  }

  .dash-actions .btn,
  .page-actions .btn {
    width: 100%;
    margin: 0;
  }

  .dash-section,
  .dash-grid,
  .dash-main {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .todo-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .todo-item {
    min-height: 68px;
  }

  .approval-row {
    align-items: flex-start;
    gap: 10px;
  }

  .approval-actions {
    flex: 0 0 100%;
    width: 100%;
  }

  .ops-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
  }

  .ops-page-head h1 {
    font-size: clamp(26px, 8vw, 34px);
    line-height: 1.08;
  }

  .ops-page-head p {
    margin-top: 5px;
    color: var(--ops-muted);
    font-size: 12px;
  }

  .ops-text-link {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 4px;
    border: 0;
    background: transparent;
    color: var(--ops-blue);
  }

  .ops-notice {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 12px;
  }

  .ops-notice .btn {
    min-width: 84px;
  }

  .ops-section-title {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
  }

  .ops-section-title > :is(button, a) {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 0;
    background: transparent;
    color: var(--ops-blue);
  }

  .ops-project-head {
    border-bottom: 1px solid var(--ops-line);
  }

  .ops-project-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 12px;
    min-height: 0;
    padding: 12px;
  }

  .ops-project-heading h2 {
    min-width: 0;
    font-size: 16px;
  }

  .ops-project-heading > button {
    justify-self: end;
    min-height: 44px;
  }

  .ops-stage-metrics {
    grid-column: 1 / -1;
    width: calc(100% + 24px);
    margin-inline: -12px;
    padding-inline: 12px;
  }

  .ops-stage-metric:first-child { border-left: 0; padding-left: 0; }

  .ops-project-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 12px;
  }

  .ops-project-filters label > span {
    margin-bottom: 6px;
    font-size: 11px;
  }

  .ops-project-filters select,
  .ops-project-filters > .btn {
    height: 44px;
    min-height: 44px;
  }

  .ops-project-filters > .btn {
    width: 100%;
  }

  .ops-lower-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .pj-list-page .tabs {
    margin-right: 0;
  }

  .pj-filter-panel {
    margin-bottom: 14px;
  }

  .pj-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 14px 12px;
  }

  .pj-filter-search,
  .pj-filter-actions {
    grid-column: 1 / -1;
  }

  .pj-filter-field input,
  .pj-filter-field select,
  .pj-filter-actions .btn {
    height: 44px;
  }

  .pj-filter-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pj-filter-summary {
    flex-wrap: wrap;
    gap: 7px;
    padding: 10px 12px;
  }

  .pj-result-count {
    flex: 0 0 100%;
    margin-right: 0;
  }

  .pj-summary-chip {
    flex: 1 1 80px;
  }

  /* Project list: a readable record card, never an 11-column strip. */
  :is(.ops-projects, .project-list-v2) .tbl-wrap,
  .dash-tbl {
    margin: 0;
    overflow: visible !important;
    border: 0;
    background: transparent;
  }

  .project-list-v2.pj-table-wrap {
    margin: 0;
    overflow: visible !important;
    border: 0;
    background: transparent;
  }

  :is(.ops-projects, .project-list-v2) table.tbl,
  .dash-tbl table.p-tbl {
    display: block;
    min-width: 0 !important;
    width: 100%;
    background: transparent;
  }

  :is(.ops-projects, .project-list-v2) table.tbl :is(thead, tbody),
  .dash-tbl table.p-tbl :is(thead, tbody) {
    display: block;
    width: 100%;
  }

  :is(.ops-projects, .project-list-v2) table.tbl thead,
  .dash-tbl table.p-tbl thead {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  :is(.ops-projects, .project-list-v2) table.tbl tr,
  .dash-tbl table.p-tbl tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(112px, auto);
    gap: 8px 14px;
    width: 100%;
    margin-bottom: 10px;
    padding: 14px;
    border: 1px solid var(--ops-line);
    border-left: 4px solid var(--ops-blue);
    background: var(--ops-surface);
  }

  :is(.ops-projects, .project-list-v2) table.tbl tr:has(.danger-text),
  .dash-tbl table.p-tbl tr:has(.overdue) {
    border-left-color: var(--ops-coral);
  }

  :is(.ops-projects, .project-list-v2) table.tbl td,
  .dash-tbl table.p-tbl td {
    position: static !important;
    display: grid;
    grid-template-columns: minmax(72px, auto) minmax(0, 1fr);
    align-items: start;
    gap: 8px;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent !important;
    box-shadow: none !important;
    text-align: left;
    white-space: normal;
  }

  :is(.ops-projects, .project-list-v2) table.tbl td::before,
  .dash-tbl table.p-tbl td::before {
    content: attr(data-label);
    color: var(--ops-muted);
    font-size: 11px;
    font-weight: 500;
    line-height: 1.55;
  }

  /* Fallback labels for the current 11-column project list. New markup may
     provide data-label and will override these strings automatically. */
  .project-list-v2 table.tbl:not(.pj-table) td:nth-child(1)::before { content: "编号"; }
  .project-list-v2 table.tbl:not(.pj-table) td:nth-child(2)::before { content: "项目"; }
  .project-list-v2 table.tbl:not(.pj-table) td:nth-child(3)::before { content: "客户"; }
  .project-list-v2 table.tbl:not(.pj-table) td:nth-child(4)::before { content: "负责人"; }
  .project-list-v2 table.tbl:not(.pj-table) td:nth-child(5)::before { content: "阶段"; }
  .project-list-v2 table.tbl:not(.pj-table) td:nth-child(6)::before { content: "成本"; }
  .project-list-v2 table.tbl:not(.pj-table) td:nth-child(7)::before { content: "报价"; }
  .project-list-v2 table.tbl:not(.pj-table) td:nth-child(8)::before { content: "成交价"; }
  .project-list-v2 table.tbl:not(.pj-table) td:nth-child(9)::before { content: "毛利率"; }
  .project-list-v2 table.tbl:not(.pj-table) td:nth-child(10)::before { content: "报价日期"; }
  .project-list-v2 table.tbl:not(.pj-table) td:nth-child(11)::before { content: "操作"; }

  /* Dashboard project cards have six fields and a full-width title/progress. */
  .dash-tbl table.p-tbl td:nth-child(1)::before { content: "项目"; }
  .dash-tbl table.p-tbl td:nth-child(2)::before { content: "负责人"; }
  .dash-tbl table.p-tbl td:nth-child(3)::before { content: "当前阶段"; }
  .dash-tbl table.p-tbl td:nth-child(4)::before { content: "进度"; }
  .dash-tbl table.p-tbl td:nth-child(5)::before { content: "下一节点"; }
  .dash-tbl table.p-tbl td:first-child,
  .dash-tbl table.p-tbl td:nth-child(4) {
    grid-column: 1 / -1;
  }

  :is(.ops-projects, .project-list-v2) table.tbl td:first-child,
  :is(.ops-projects, .project-list-v2) table.tbl td:nth-child(2) {
    grid-column: 1 / -1;
  }

  :is(.ops-projects, .project-list-v2) table.tbl td:last-child {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--ops-line);
  }

  :is(.ops-projects, .project-list-v2) table.tbl td:last-child::before {
    width: 100%;
  }

  :is(.ops-projects, .project-list-v2) table.tbl td:last-child .btn {
    flex: 1 1 120px;
  }

  .project-list-v2 .pj-table tbody tr.is-overdue {
    border-left-color: var(--ops-coral);
  }

  .project-list-v2 .pj-table tbody tr.is-due-soon {
    border-left-color: var(--ops-violet);
  }

  .project-list-v2 .pj-table td {
    height: auto !important;
  }

  .project-list-v2 .pj-table .pj-project-name {
    white-space: normal;
  }

  .project-list-v2 .pj-table .pj-finance-grid {
    width: 100%;
  }

  .project-list-v2 .pj-table .empty {
    display: block !important;
    grid-column: 1 / -1;
  }

  .project-list-v2 .pj-table .empty::before {
    display: none;
  }

  /* Current V2 dashboard table uses its own semantic class. */
  .ops-project-table-wrap {
    width: 100%;
    overflow: visible;
  }

  .ops-project-table {
    display: block;
    width: 100%;
    min-width: 0;
    border-collapse: separate;
  }

  .ops-project-table :is(thead, tbody) {
    display: block;
    width: 100%;
  }

  .ops-project-table thead { position: static; height: auto; overflow: visible; white-space: normal; }
  .ops-project-table thead tr { display: block; width: 100%; }
  .ops-project-table thead th { display: none; }
  .ops-project-table thead th:nth-child(5) {
    width: 100%;
    height: auto;
    display: block;
    padding: 7px 12px;
  }
  .ops-project-th > .ops-sort-header-label { font-size: 0; }
  .ops-project-th > .ops-sort-header-label::after { content: '项目排序'; font-size: 11px; }
  .ops-project-sort-inline { margin-left: auto; }
  .ops-project-sort-inline select { width: min(46vw, 150px); height: 44px; font-size: 11px; }
  .ops-project-sort-inline .ops-sort-direction { width: 44px; height: 44px; }

  .ops-project-table tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(108px, auto);
    gap: 8px 14px;
    width: 100%;
    margin-bottom: 10px;
    padding: 14px;
    border: 1px solid var(--ops-line);
    border-left: 4px solid var(--ops-blue);
    background: var(--ops-surface);
  }

  .ops-project-table tbody tr:has(.overdue) {
    border-left-color: var(--ops-coral);
  }

  .ops-project-table tbody tr:has(.due-soon) {
    border-left-color: var(--ops-violet);
  }

  .ops-project-table td {
    display: grid;
    grid-template-columns: minmax(72px, auto) minmax(0, 1fr);
    align-items: start;
    gap: 8px;
    min-width: 0;
    height: auto !important;
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
  }

  .ops-project-table td::before {
    color: var(--ops-muted);
    font-size: 11px;
    font-weight: 500;
    line-height: 1.55;
  }

  .ops-project-table td:nth-child(1)::before { content: "项目"; }
  .ops-project-table td:nth-child(2)::before { content: "负责人"; }
  .ops-project-table td:nth-child(3)::before { content: "当前阶段"; }
  .ops-project-table td:nth-child(4)::before { content: "优先级"; }
  .ops-project-table td:nth-child(5)::before { content: "流程进度"; }
  .ops-project-table td:nth-child(6)::before { content: "节点预警"; }
  .ops-project-table td:nth-child(7)::before { content: "下一节点"; }

  .ops-project-table td:nth-child(1),
  .ops-project-table td:nth-child(5) {
    grid-column: 1 / -1;
  }

  .ops-project-table td > :is(b, small) {
    min-width: 0;
  }

  .ops-project-table td > :is(b, small, a, div, span) {
    grid-column: 2;
  }

  .ops-project-table td small {
    color: var(--ops-muted);
    overflow-wrap: anywhere;
  }

  .ops-project-table td:nth-child(6) {
    align-content: start;
  }

  .ops-project-table .ops-project-warning {
    min-height: 26px;
  }

  .ops-project-table .empty {
    display: block;
    grid-column: 1 / -1;
    padding: 22px 12px;
    text-align: center;
  }

  .ops-project-table .empty::before { display: none; }

  .ops-project-table .ops-progress-rail {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100%;
    display: grid !important;
    grid-template-columns: repeat(14, minmax(14px, 1fr));
    gap: 2px;
    overflow: hidden;
  }

  .ops-project-table .ops-progress-step {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    font-size: 8px;
    line-height: 1;
  }

  /* Project flow: a vertical, inspectable sequence on a phone. */
  .project-shell-head {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .project-shell-head :is(.project-title, h1) {
    overflow-wrap: anywhere;
    font-size: clamp(25px, 8vw, 34px);
    line-height: 1.08;
  }

  .project-shell-head :is(.project-meta, .project-kpis) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .project-shell-head :is(.project-actions, .page-actions) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .project-workflow {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }

  .workflow-layout {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }

  .workflow-layout > :is(.workflow-main, main, section) { order: 1; }
  .workflow-layout > :is(.workflow-side, aside) { order: 2; }

  .workflow-rail {
    width: 100%;
    overflow: visible;
    padding: 4px 0;
  }

  .workflow-rail > :is(.workflow-steps, .stage-flow),
  .project-workflow .stage-flow {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0;
  }

  .workflow-rail :is(.workflow-step, .stage-chip),
  .project-workflow .stage-flow .stage-chip {
    position: relative;
    width: 100%;
    min-height: 62px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border: 0;
    border-left: 1px solid var(--ops-line-strong);
    border-bottom: 1px solid var(--ops-line);
    background: var(--ops-surface);
  }

  .workflow-rail :is(.workflow-step, .stage-chip)::before,
  .project-workflow .stage-flow .stage-chip::before {
    content: "";
    width: 12px;
    height: 12px;
    justify-self: center;
    border: 2px solid var(--ops-line-strong);
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 0 0 6px #ffffff;
  }

  .workflow-rail :is(.workflow-step.done, .stage-chip.done)::before,
  .project-workflow .stage-flow .stage-chip.done::before {
    border-color: var(--ops-blue);
    background: var(--ops-blue);
  }

  .workflow-rail :is(.workflow-step.active, .workflow-step.doing, .stage-chip.doing)::before,
  .project-workflow .stage-flow .stage-chip.doing::before {
    width: 16px;
    height: 16px;
    border-color: var(--ops-violet);
    background: #ffffff;
    box-shadow: 0 0 0 5px #eeeaff;
  }

  .workflow-rail :is(.workflow-step.active, .workflow-step.doing, .stage-chip.doing),
  .project-workflow .stage-flow .stage-chip.doing {
    border-left: 4px solid var(--ops-violet);
    background: #f7f5ff;
    color: #4d3fc1;
  }

  .project-workflow .tabs {
    margin-right: 0;
    padding-bottom: 2px;
    scroll-snap-type: x proximity;
  }

  .project-workflow .tab {
    min-width: max-content;
    scroll-snap-align: start;
  }

  .project-workflow :is(.panel, .dash-panel),
  .ops-dashboard :is(.panel, .dash-panel) {
    margin-bottom: 0;
    padding: 15px 13px;
  }

  /* Bottom-sheet menu respects the device safe area. */
  .mobile-menu-mask {
    padding-top: env(safe-area-inset-top);
  }

  .mobile-menu-panel {
    max-height: calc(88dvh - env(safe-area-inset-top));
    padding-bottom: env(safe-area-inset-bottom);
    overscroll-behavior: contain;
  }

  .mobile-menu-item,
  .mobile-menu-head button {
    min-height: 48px;
    touch-action: manipulation;
  }
}

@media (max-width: 420px) {
  .topbar {
    padding-top: env(safe-area-inset-top);
  }

  .main {
    padding-inline: 10px;
  }

  .ops-priority {
    grid-template-columns: 70px minmax(0, 1fr);
    gap: 10px;
  }

  .ops-dashboard :is(.panel-head, .approval-card-title, .approval-card-meta) {
    align-items: flex-start;
  }

  .ops-dashboard .approval-card-meta {
    grid-template-columns: 1fr;
  }

  .project-shell-head :is(.project-meta, .project-kpis) {
    grid-template-columns: 1fr;
  }

  .pj-filter-grid {
    grid-template-columns: 1fr;
  }

  .pj-filter-field,
  .pj-filter-search,
  .pj-filter-actions {
    grid-column: 1;
  }

  .issue-facts,
  .issue-assign-grid {
    grid-template-columns: 1fr;
  }

  .issue-facts > div,
  .issue-facts > div:nth-child(even) {
    padding-inline: 0;
    border-right: 0;
  }

  :is(.ops-projects, .project-list-v2) table.tbl tr,
  .dash-tbl table.p-tbl tbody tr,
  .ops-project-table tbody tr {
    grid-template-columns: 1fr;
  }

  :is(.ops-projects, .project-list-v2) table.tbl td,
  .dash-tbl table.p-tbl td,
  .ops-project-table td {
    grid-column: 1 !important;
  }
}

/* Short landscape phones: retain content above the bottom navigation. */
@media (max-width: 900px) and (max-height: 520px) and (orientation: landscape) {
  .mobile-nav {
    --ops-bottom-nav-h: 56px;
  }

  .mobile-menu-panel {
    max-height: calc(94dvh - env(safe-area-inset-top));
  }
}

/* ============================================================
   Presentation / large screen — readable at distance, one page scroll only
   ============================================================ */
@media (min-width: 1181px) {
  .screen-wrap {
    height: auto !important;
    min-height: 100vh;
    overflow: visible !important;
    padding: clamp(26px, 2.2vw, 48px);
    background: var(--ops-canvas);
    color: var(--ops-ink);
  }

  .screen-wrap .sc-header,
  .screen-wrap .sc-alert {
    flex: none;
  }

  .screen-wrap .sc-header {
    min-height: clamp(92px, 8vh, 128px);
    border-bottom-color: var(--ops-blue);
  }

  .screen-wrap .sc-main-title {
    font-size: clamp(34px, 2.35vw, 54px);
  }

  .screen-wrap .sc-heading span,
  .screen-wrap .sc-date {
    font-size: clamp(14px, .9vw, 20px);
  }

  .screen-wrap .sc-clock {
    font-size: clamp(38px, 2.7vw, 64px);
  }

  /* Exceptions remain directly below the title and use the only urgent hue. */
  .screen-wrap .sc-alert {
    order: 0;
    min-height: 62px;
    margin: clamp(16px, 1.4vw, 28px) 0;
    border: 1px solid #ffc4ca;
    border-left: 7px solid var(--ops-coral);
    background: #ffffff;
  }

  .screen-wrap .sc-alert-label {
    min-width: 150px;
    justify-content: center;
    background: #28345b;
    color: #ffffff;
    font-size: clamp(14px, .9vw, 19px);
    font-weight: 700;
  }

  .screen-wrap .sc-alert-items {
    overflow: visible;
    flex-wrap: wrap;
  }

  .screen-wrap .sc-alert-item {
    display: flex;
    align-items: center;
    min-height: 60px;
    padding: 12px clamp(16px, 1.3vw, 28px);
    font-size: clamp(14px, .85vw, 19px);
  }

  .screen-wrap .sc-alert-item.over,
  .screen-wrap .sc-warn {
    color: #c51f35;
  }

  .screen-wrap .sc-body {
    flex: none !important;
    min-height: 0;
    grid-template-columns: minmax(260px, .82fr) minmax(520px, 1.55fr) minmax(300px, 1fr);
    align-items: start;
    gap: clamp(16px, 1.25vw, 28px);
  }

  .screen-wrap :is(.sc-col, .sc-panel, .sc-panel-fill) {
    min-height: 0;
    overflow: visible !important;
  }

  .screen-wrap .sc-col {
    gap: clamp(16px, 1.25vw, 28px);
  }

  .screen-wrap .sc-panel {
    padding: clamp(20px, 1.5vw, 34px);
    border-color: var(--ops-line-strong);
  }

  .screen-wrap .sc-panel-title {
    margin-bottom: clamp(18px, 1.3vw, 28px);
    padding-bottom: clamp(12px, .9vw, 18px);
    font-size: clamp(18px, 1.05vw, 24px);
  }

  .screen-wrap .sc-big-num b {
    font-size: clamp(62px, 4.6vw, 104px);
  }

  .screen-wrap .sc-big-num span {
    font-size: clamp(24px, 2vw, 44px);
  }

  .screen-wrap .sc-sub,
  .screen-wrap .sc-chip,
  .screen-wrap .sc-table :is(th, td) {
    font-size: clamp(14px, .82vw, 19px);
  }

  .screen-wrap .sc-chip {
    min-height: 34px;
    padding: 6px 10px;
  }

  /* No nested mini scrollbars: content participates in the page flow. */
  .screen-wrap :is(.sc-proj-list, .sc-table) {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
  }

  .screen-wrap .sc-table table {
    width: 100%;
  }

  .screen-wrap .sc-table th {
    position: static;
  }

  .screen-wrap .sc-proj {
    padding: clamp(18px, 1.35vw, 30px) 0;
  }

  .screen-wrap .sc-proj-name {
    font-size: clamp(18px, 1.05vw, 25px);
    line-height: 1.25;
  }

  .screen-wrap .sc-proj-pct {
    font-size: clamp(28px, 1.7vw, 40px);
  }

  .screen-wrap .sc-proj-bar {
    height: clamp(8px, .55vw, 13px);
  }

  .screen-wrap .sc-seg {
    height: clamp(12px, .7vw, 17px);
  }

  .screen-wrap .sc-seg.done,
  .screen-wrap .sc-proj-fill {
    background: var(--ops-blue);
  }

  .screen-wrap .sc-seg.doing {
    background: var(--ops-violet);
  }

  .screen-wrap .sc-seg.todo {
    background: #dfe3eb;
  }

  .screen-wrap .sc-seg-lab {
    margin-top: 6px;
    color: #596579;
    font-size: clamp(12px, .7vw, 16px);
  }

  .screen-wrap .sc-chip.ok {
    border-color: #b9c9fa;
    background: #eef3ff;
    color: var(--ops-blue-deep);
  }

  .screen-wrap :is(.sc-chip.miss, .sc-tag.over, .sc-proj-fill.over) {
    border-color: var(--ops-coral);
    background: var(--ops-coral);
    color: #ffffff;
  }
}

@media (min-width: 2000px) {
  .screen-wrap {
    padding-inline: clamp(48px, 3.4vw, 88px);
  }

  .screen-wrap .sc-body {
    grid-template-columns: minmax(360px, .86fr) minmax(760px, 1.6fr) minmax(420px, 1fr);
    gap: clamp(28px, 1.5vw, 44px);
  }

  .screen-wrap .sc-panel {
    border-width: 2px;
  }
}

/* Motion and focus remain accessible on every device. */
:is(.ops-dashboard, .project-workflow, .mobile-nav, .mobile-menu-panel, .screen-wrap)
  :is(button, a, input, select, textarea, [role="button"]):focus-visible {
  outline: 3px solid rgba(21, 94, 239, .34);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* Personnel directory and permissions: tablet + phone reflow. */
@media (max-width: 1180px) {
  .permission-module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .permission-user-card > summary { grid-template-columns: 36px minmax(140px, .8fr) auto minmax(130px, 1fr) 22px; gap: 9px; }
  .employee-record-head { grid-template-columns: 38px minmax(160px, .8fr) minmax(220px, 1.2fr); }
}

@media (max-width: 768px) {
  .employee-directory-toolbar { display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; gap: 8px; }
  .employee-directory-toolbar .system-table-search { width: 100%; }
  .employee-directory-count { padding: 0 2px; }
  .employee-directory-toolbar .spacer { display: none; }
  .employee-data-actions,
  .employee-data-actions > summary,
  .employee-directory-toolbar > .btn { width: 100%; }
  .employee-data-actions > summary,
  .employee-directory-toolbar > .btn { min-height: 44px; }
  .employee-data-actions > div { position: static; width: 100%; margin-top: 6px; box-shadow: none; }
  .employee-data-actions > div .btn { min-height: 44px; }
  .employee-record-head { grid-template-columns: 34px minmax(0, 1fr); gap: 8px; padding: 13px 12px; }
  .employee-record-status { grid-column: 1 / -1; justify-content: flex-start; padding-top: 3px; }
  .employee-record-facts { grid-template-columns: minmax(0, 1fr); }
  .employee-record-facts > div { min-height: 54px; padding: 10px 12px; border-right: 0; border-bottom: 1px solid var(--border); }
  .employee-record-facts > div:last-child { border-bottom: 0; }
  .employee-record-controls { min-height: 54px; align-items: stretch; flex-direction: column; padding: 8px; }
  .employee-profile-link,
  .employee-more-actions,
  .employee-more-actions > summary { width: 100%; min-height: 44px; }
  .employee-profile-link { justify-content: center; }
  .employee-more-actions > div { display: grid; grid-template-columns: minmax(0, 1fr); }
  .employee-more-actions > div button { width: 100%; min-height: 44px; }

  .permission-toolbar { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 12px; }
  .permission-toolbar .system-table-search { width: 100%; }
  .permission-toolbar .system-table-search input { min-height: 44px; }
  .permission-toolbar > div { padding: 10px 0 0; border-top: 1px solid var(--border); border-left: 0; }
  .permission-user-card > summary {
    min-height: 96px;
    grid-template-columns: 34px minmax(0, 1fr) 24px;
    grid-template-rows: auto auto auto;
    gap: 5px 9px;
    padding: 12px;
  }
  .permission-user-index { grid-row: 1 / 4; align-self: start; margin-top: 2px; }
  .permission-user-name { grid-column: 2; grid-row: 1; }
  .permission-user-card > summary > .tag { grid-column: 2; grid-row: 2; justify-self: start; }
  .permission-user-summary { grid-column: 2; grid-row: 3; justify-self: start; }
  .permission-user-card > summary > .ph-caret-down { grid-column: 3; grid-row: 1; }
  .permission-user-body { padding: 12px; }
  .permission-level { align-items: stretch; flex-direction: column; gap: 10px; }
  .permission-level select,
  .permission-level-static { width: 100%; min-height: 44px; }
  .permission-module-grid { grid-template-columns: minmax(0, 1fr); }
  .permission-module { min-height: 82px; }
  .permission-module select { min-height: 44px; }
  .permission-save { align-items: stretch; flex-direction: column; }
  .permission-save .btn { width: 100%; min-height: 44px; justify-content: center; }
}

@media (max-width: 1360px) {
  .permission-console { grid-template-columns: minmax(0, 1fr); }
  .permission-role-panel { position: static; }
  .permission-role-panel > header { grid-template-columns: minmax(180px, 1fr) minmax(220px, 1fr); align-items: end; }
  .permission-role-panel > header > div { grid-column: 1 / -1; }
  .permission-role-panel .permission-user-list { max-height: 286px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: auto; }
  .permission-role-panel .permission-user-card:nth-child(odd) { border-right: 1px solid var(--border); }
}

@media (max-width: 768px) {
  .permission-console { gap: 12px; }
  .permission-role-panel > header { grid-template-columns: minmax(0, 1fr); padding: 12px; }
  .permission-role-panel > header > div { grid-column: 1; }
  .permission-role-panel .permission-user-list { display: flex; max-height: none; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x proximity; }
  .permission-role-panel .permission-user-card { min-width: min(78vw, 272px); flex: 0 0 min(78vw, 272px); border-right: 1px solid var(--border); border-bottom: 0; scroll-snap-align: start; }
  .permission-role-panel .permission-user-card > summary {
    min-height: 92px;
    grid-template-columns: 32px minmax(0, 1fr) 18px;
    grid-template-rows: auto auto auto;
    gap: 3px 8px;
    padding: 11px;
  }
  .permission-role-panel .permission-user-index { grid-column: 1; grid-row: 1 / 4; }
  .permission-role-panel .permission-user-name { grid-column: 2; grid-row: 1; }
  .permission-role-panel .permission-user-card > summary > .tag { grid-column: 2; grid-row: 2; }
  .permission-role-panel .permission-user-summary { grid-column: 2; grid-row: 3; }
  .permission-role-panel .permission-user-card > summary > .ph-caret-right { grid-column: 3; grid-row: 1 / 4; }
  .permission-editor-head { min-height: 76px; padding: 12px; }
  .permission-editor-folio { font-size: 24px; }
  .permission-editor-head h3 { font-size: 16px; }
  .permission-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .permission-overview > div { min-height: 68px; padding: 10px 12px; }
  .permission-overview > div:nth-child(2) { border-right: 0; }
  .permission-overview > div:nth-child(-n+2) { border-bottom: 1px solid var(--border); }
  .permission-overview strong { font-size: 22px; }
  .permission-editor > .permission-level { align-items: stretch; flex-direction: column; gap: 9px; padding: 12px; }
  .permission-editor > .permission-level select,
  .permission-editor > .permission-level .permission-level-static { width: 100%; min-height: 44px; }
  .permission-template { grid-template-columns: minmax(0, 1fr); gap: 9px; padding: 12px; }
  .permission-template > label { grid-template-columns: minmax(0, 1fr); }
  .permission-template select,
  .permission-template .btn { min-height: 44px; }
  .permission-template .btn { justify-content: center; }
  .permission-matrix-toolbar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 10px 12px; }
  .permission-matrix-toolbar .system-table-search { grid-column: 1 / -1; width: 100%; }
  .permission-matrix-toolbar .system-table-search input,
  .permission-matrix-toolbar .btn { min-height: 44px; }
  .permission-matrix-toolbar .spacer { display: none; }
  .permission-matrix-toolbar .btn { min-width: 0; justify-content: center; }
  .permission-matrix-header { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .permission-matrix-header > div { grid-column: 1 / -1; padding: 10px 12px; border-bottom: 1px solid var(--border); }
  .permission-matrix-header > label { min-height: 44px; }
  .permission-matrix-header > label:nth-child(2) { border-left: 0; }
  .permission-module-group > summary {
    grid-template-columns: minmax(0, 1fr) auto 20px;
    grid-template-rows: auto auto;
    gap: 8px;
    padding: 10px 12px;
  }
  .permission-module-group > summary > div:first-child { grid-column: 1; grid-row: 1; }
  .permission-group-count { grid-column: 2; grid-row: 1; }
  .permission-module-group > summary > .ph-caret-down { grid-column: 3; grid-row: 1; }
  .permission-group-actions { grid-column: 1 / -1; grid-row: 2; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; min-height: 44px; border-top: 1px solid var(--border); }
  .permission-group-actions label:first-child { border-left: 0; }
  .permission-matrix-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .permission-module-copy { grid-column: 1 / -1; padding: 11px 12px; border-bottom: 1px solid var(--border); }
  .permission-capability { min-height: 48px; }
  .permission-capability:nth-of-type(1) { border-left: 0; }
  .permission-editor > .permission-save { align-items: stretch; flex-direction: column; gap: 8px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); }
  .permission-editor > .permission-save .btn { width: 100%; min-height: 44px; justify-content: center; }

  .permission-console-v2 .permission-matrix-scroll { overflow: visible; }
  .permission-console-v2 .permission-scroll-proxy { display: none !important; }
  .permission-console-v2 .permission-operation-header { display: none; }
  .permission-console-v2 .permission-module-group { min-width: 0; }
  .permission-console-v2 .permission-module-group > summary.permission-module-summary {
    min-height: 74px;
    grid-template-columns: 40px minmax(0, 1fr) 20px;
    grid-template-rows: auto auto;
    gap: 6px 9px;
    padding: 8px 10px 8px 0;
  }
  .permission-console-v2 .permission-module-index { grid-column: 1; grid-row: 1 / 3; }
  .permission-console-v2 .permission-module-heading { grid-column: 2; grid-row: 1; }
  .permission-console-v2 .permission-module-heading small { white-space: normal; }
  .permission-console-v2 .permission-group-count { grid-column: 2; grid-row: 2; justify-self: start; }
  .permission-console-v2 .permission-module-all {
    grid-column: 2;
    grid-row: 2;
    justify-self: end;
    min-height: 30px;
    padding-right: 0;
  }
  .permission-console-v2 .permission-module-summary > .ph-caret-down { grid-column: 3; grid-row: 1 / 3; }
  .permission-console-v2 .permission-function-row {
    min-width: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .permission-console-v2 .permission-function-copy {
    grid-column: 1 / -1;
    min-height: 48px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
  }
  .permission-console-v2 .permission-operation-cell {
    min-height: 46px;
    justify-content: flex-start;
    padding: 0 14px;
    border-bottom: 1px solid var(--border);
  }
  .permission-console-v2 .permission-operation-cell:nth-of-type(odd) { border-left: 0; }
  .permission-console-v2 .permission-operation-cell:last-child { grid-column: 1 / -1; border-bottom: 0; }
}

@media (max-width: 520px) {
  .permission-editor-head { align-items: flex-start; }
  .permission-editor-head > .tag { margin-top: 3px; }
  .permission-editor-head p { max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .permission-matrix-header > div small { line-height: 1.4; }
}

/* Approval center: compact review flow without blind actions. */
@media (max-width: 1100px) {
  .approval-secondary-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
}

@media (max-width: 768px) {
  .approval-center-v2 { padding-bottom: calc(20px + env(safe-area-inset-bottom)); }
  .approval-center-head { min-height: 0; grid-template-columns: minmax(0, 1fr); align-items: stretch; gap: 16px; padding: 4px 0 16px; }
  .approval-center-head h1 { font-size: 28px; }
  .approval-center-head p { font-size: 11px; }
  .approval-center-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .approval-center-metrics > div { min-width: 0; padding: 11px 9px; }
  .approval-center-metrics b { font-size: 20px; }
  .approval-work-section { margin-top: 12px; border-radius: 4px; }
  .approval-work-section > header { min-height: 46px; padding: 0 11px; }
  .approval-work-card > summary {
    min-height: 102px;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    grid-template-rows: auto auto auto;
    align-items: start;
    gap: 6px 8px;
    padding: 12px 10px;
  }
  .approval-work-index { grid-column: 1; grid-row: 1 / 4; padding-top: 2px; }
  .approval-work-title { grid-column: 2; grid-row: 1; }
  .approval-work-card > summary > .tag { grid-column: 3; grid-row: 1; }
  .approval-priority { grid-column: 2; grid-row: 2; justify-self: start; }
  .approval-work-flow { grid-column: 2 / 4; grid-row: 3; align-self: center; }
  .approval-work-flow b,
  .approval-work-flow small { white-space: normal; line-height: 1.45; }
  .approval-work-card > summary > .ph-caret-down { grid-column: 3; grid-row: 2; align-self: center; }
  .approval-work-detail { padding: 10px; }
  .approval-detail-grid { grid-template-columns: minmax(0, 1fr); }
  .approval-detail-grid > div { min-height: 54px; }
  .approval-detail-actions { align-items: stretch; flex-direction: column; }
  .approval-detail-actions .btn,
  .approval-detail-actions .btn:first-child { width: 100%; min-height: 44px; justify-content: center; margin-right: 0; }
  .approval-compact-empty { min-height: 46px; padding: 8px 10px; }
  .approval-compact-empty span { display: none; }
  .approval-round-card > summary {
    min-height: 88px;
    grid-template-columns: 26px minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    align-items: start;
    gap: 7px;
    padding: 11px 10px;
  }
  .approval-round-index { grid-column: 1; grid-row: 1 / 3; }
  .approval-round-card > summary > span:nth-child(2) { grid-column: 2; grid-row: 1; }
  .approval-round-card > summary > .tag { grid-column: 3; grid-row: 1; }
  .approval-round-card > summary > span:nth-child(4) { grid-column: 2; grid-row: 2; }
  .approval-round-card > summary > .ph-caret-down { grid-column: 3; grid-row: 2; }
  .approval-round-events { padding: 6px 10px 10px; }
  .approval-round-events > div { padding-left: 0; }
  .approval-round-level { position: static; width: auto; display: block; margin-bottom: 5px; }
}

/* Integration safeguards for the V2 project flow. */
@media (max-width: 768px) {
  .project-primary-tabs {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  .project-primary-tabs::-webkit-scrollbar { display: none; }
  .project-primary-tab { flex: 1 1 25%; min-width: 78px; flex-direction: column; gap: 1px; padding-inline: 4px; font-size: 10px; line-height: 1.15; }
  .project-primary-tab > span { white-space: nowrap; }
  .project-more-menu { position: fixed; inset: auto 12px calc(var(--ops-bottom-nav-h) + 14px) 12px; width: auto; max-height: 64dvh; overflow-y: auto; }

  .workflow-overview,
  .approval-page-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 14px;
  }

  .workflow-overview p,
  .approval-page-head p { max-width: none; }

  .project-title-line { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
  .project-title-line .project-title { margin-right: 0; }
  .project-priority { width: max-content; margin: -5px 0 12px; }

  .workflow-overview-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  .workflow-gantt-button { min-height: 44px; }

  .workflow-health {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .workflow-health > span { min-width: 0; }

  .workflow-current-card {
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 6px 14px;
    padding: 22px 18px;
    scroll-margin-top: 82px;
  }

  .workflow-stage-count strong { font-size: 46px; }
  .workflow-stage-count span { margin-left: 5px; font-size: 12px; }
  .workflow-current-copy h3 { font-size: 27px; }
  .workflow-current-copy p { font-size: 12px; }
  .workflow-alert { grid-column: 1 / -1; }

  .workflow-facts {
    grid-template-columns: minmax(0, 1fr);
    margin-top: 18px;
  }

  .workflow-facts > div,
  .workflow-facts > div:first-child {
    padding: 12px 0;
    border-right: 0;
    border-bottom: 1px solid var(--ops-line);
  }

  .workflow-facts > div:last-child { border-bottom: 0; }
  .workflow-facts b { overflow: visible; text-overflow: clip; white-space: normal; }
  .workflow-current-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .workflow-current-actions .btn { width: 100%; min-width: 0; padding-inline: 8px; }

  .workflow-gantt-details,
  .workflow-gantt-inner,
  .workflow-gantt-inner > .panel,
  .workflow-gantt-inner .gantt { max-width: 100%; overflow: hidden; }

  .project-business-nav {
    width: 100%;
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
    padding: 8px;
  }

  .project-business-nav::-webkit-scrollbar,
  .project-business-subnav::-webkit-scrollbar,
  .project-file-stage-filter::-webkit-scrollbar { display: none; }
  .project-business-label { display: none; }
  .project-business-group { min-width: 0; min-height: 48px; grid-template-columns: 30px minmax(0, 1fr) auto; padding-inline: 8px; }
  .project-business-group > i { width: 30px; height: 30px; }
  .project-business-group > span { overflow: hidden; font-size: 11px; text-overflow: ellipsis; }
  .project-business-subnav {
    width: 100%;
    min-height: 48px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 6px 8px;
    scrollbar-width: none;
  }
  .project-business-subnav > span { display: none; }
  .project-business-subnav button { min-height: 38px; }

  .project-files-head,
  .business-doc-head { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 13px; }
  .project-files-summary { width: 100%; display: flex; align-items: baseline; gap: 9px; }
  .project-files-summary strong { font-size: 22px; }
  .project-files-summary span { margin-top: 0; }
  .business-doc-head-actions { width: 100%; display: grid; grid-template-columns: 92px minmax(0, 1fr); }
  .business-doc-head .btn { width: 100%; }
  .business-doc-count { min-width: 0; }
  .project-file-stage-filter { flex-wrap: nowrap; overflow-x: auto; margin-inline: -2px; scrollbar-width: none; }
  .project-file-stage-filter button { min-height: 42px; }
  .project-upload-bar { grid-template-columns: minmax(0, 1fr); align-items: stretch; padding: 15px; }
  .project-upload-copy { margin-bottom: 3px; }
  .project-upload-bar select,
  .project-upload-bar > .btn { min-height: 46px; }
  .project-upload-guide { grid-template-columns: 38px minmax(0, 1fr); }
  .project-upload-guide > i:last-child { display: none; }
  .project-file-node > summary {
    min-height: 84px;
    grid-template-columns: 72px minmax(0, 1fr) 34px 16px;
    gap: 9px;
    padding: 12px;
  }
  .project-file-node-stat { display: none; }
  .project-file-node-title small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .project-file-node-body { padding: 6px; }
  .project-file-row {
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: start;
    gap: 11px;
    padding: 14px;
  }
  .project-file-icon { width: 42px; height: 42px; }
  .project-file-actions { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) 44px; }
  .project-file-actions .btn { min-height: 44px; }
  .project-file-actions .btn-danger { width: 44px; }
  .project-file-meta { gap: 5px 9px; }
  .business-doc-library-head { display: block; padding: 17px 15px; }
  .business-doc-library-head > span { display: block; margin-top: 8px; }
  .business-doc-group { padding: 0 15px 18px; }
  .business-doc-group > header { min-height: 72px; }
  .business-doc-group > header p { max-width: 250px; }
  .business-doc-grid { grid-template-columns: minmax(0, 1fr); }
  .business-doc-card { min-height: 178px; }
  .business-doc-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  .business-doc-actions .btn { width: 100%; min-height: 44px; }
  .business-doc-help { padding-inline: 15px; }
  .document-prep-mask { align-items: flex-end; padding: 0; }
  .document-prep-modal {
    width: 100vw !important;
    max-width: none !important;
    height: min(94dvh, 900px);
    max-height: 94dvh;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    border-width: 1px 0 0;
    box-shadow: none;
  }
  .document-prep-head { min-height: 88px; grid-template-columns: 66px minmax(0, 1fr) 42px; flex: 0 0 auto; }
  .document-prep-folio { font-size: 34px; }
  .document-prep-head > div:nth-child(2) { padding: 14px 12px; }
  .document-prep-head h3 { font-size: 18px; }
  .document-prep-head p { max-height: 34px; overflow: hidden; font-size: 9px; }
  .document-prep-body { min-height: 0; display: block; flex: 1 1 auto; overflow: auto; }
  .document-prep-source { padding: 17px 15px; border-right: 0; border-bottom: 1px solid #cfd4df; }
  .document-prep-source > h4 { margin: 6px 0 13px; font-size: 16px; }
  .document-prep-source dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .document-prep-source dl > div { display: block; min-height: 58px; padding: 8px; border-right: 1px solid #dfe3ea; }
  .document-prep-source dl > div:nth-child(even) { border-right: 0; }
  .document-prep-source dd { margin-top: 4px; font-size: 10px; text-align: left; }
  .document-prep-lock { margin-top: 12px; }
  .document-prep-form { padding: 18px 15px 24px; }
  .document-prep-fields { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .document-prep-field.full { grid-column: 1; }
  .document-prep-field input, .document-prep-field select, .document-prep-field textarea { min-height: 46px; font-size: 16px; }
  .document-prep-option { min-height: 68px; }
  .document-prep-presentation > header { display: block; }
  .document-prep-presentation > header small { display: block; margin-top: 3px; }
  .document-prep-foot { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; flex: 0 0 auto; padding: 11px 15px calc(11px + env(safe-area-inset-bottom)); }
  .document-prep-foot > div:last-child { display: grid; grid-template-columns: 82px minmax(0, 1fr); }
  .document-prep-foot .btn { width: 100%; min-height: 46px; }
  .document-prep-foot .btn-primary { min-width: 0; }
  .workflow-gantt-launch { display: grid; grid-template-columns: minmax(0, 1fr); }
  .workflow-gantt-launch > .btn { width: 100%; min-height: 44px; }
  .gantt-modal { width: 100vw; height: 100dvh; max-height: none; border-radius: 0; }
  .gantt-modal .modal-head { padding-inline: 15px; }
  .gantt-modal-body { padding-inline: 10px; }
  .gantt-modal .modal-foot { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .gantt-modal .modal-foot .btn { width: 100%; }
}

@media (min-width: 769px) and (max-width: 1180px) {
  .project-business-nav { overflow-x: auto; }
  .project-business-label { display: none; }
  .project-business-group { flex: 0 0 152px; }
  .project-upload-bar { grid-template-columns: minmax(260px, 1fr) repeat(2, minmax(150px, .65fr)); }
  .project-upload-bar > .btn { grid-column: 3; }
  .business-doc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .document-prep-modal { width: min(960px, calc(100vw - 36px)) !important; }
  .document-prep-body { grid-template-columns: 270px minmax(0, 1fr); }
  .document-prep-source { padding-inline: 20px; }
}

/* ============================================================
   Screen V2 — Swiss operations wall
   One blue accent, cold neutral surfaces, hairline information grid.
   ============================================================ */
.screen-wrap.screen-v2 {
  --sc-v2-blue: #002fa7;
  --sc-v2-ink: #15171d;
  --sc-v2-muted: #646a76;
  --sc-v2-line: #d6d9e0;
  --sc-v2-soft: #f1f3f6;
  width: 100%;
  height: 100vh !important;
  min-height: 680px;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: clamp(12px, 1.35vh, 20px);
  margin: 0;
  padding: clamp(18px, 1.7vw, 34px);
  overflow: hidden !important;
  border: 0;
  border-radius: 0;
  background: #f7f7f8;
  color: var(--sc-v2-ink);
  font-family: "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
  box-shadow: none;
  animation: none;
}

.screen-v2 *,
.screen-v2 *::before,
.screen-v2 *::after { box-sizing: border-box; }

.screen-v2 :is(h1, h2, h3, p, ol) { margin: 0; }

.sc-v2-header {
  min-height: clamp(68px, 8vh, 98px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 28px;
  padding-bottom: clamp(12px, 1.3vh, 18px);
  border-bottom: 4px solid var(--sc-v2-blue);
}

.sc-v2-identity { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: clamp(12px, 1vw, 20px); }
.sc-v2-identity > div { min-width: 0; }
.sc-v2-logo { width: clamp(42px, 3.4vw, 68px); height: clamp(42px, 3.4vw, 68px); display: block; object-fit: contain; color: var(--sc-v2-blue); font-size: clamp(42px, 3.4vw, 68px); }
.sc-v2-identity h1 {
  overflow: hidden;
  color: var(--sc-v2-ink);
  font-size: clamp(30px, 2.45vw, 50px);
  font-weight: 720;
  line-height: 1;
  letter-spacing: -.045em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sc-v2-identity p {
  margin-top: 9px;
  color: var(--sc-v2-muted);
  font-size: clamp(11px, .72vw, 15px);
}

.sc-v2-datetime {
  display: grid;
  grid-template-columns: auto auto;
  align-items: baseline;
  gap: clamp(18px, 1.8vw, 36px);
  font-variant-numeric: tabular-nums;
}
.sc-v2-datetime span { color: var(--sc-v2-muted); font-size: clamp(13px, .82vw, 17px); }
.sc-v2-datetime strong { color: var(--sc-v2-ink); font-size: clamp(30px, 2.45vw, 50px); font-weight: 650; line-height: .9; letter-spacing: -.045em; }
.sc-v2-preview-exit {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 10px;
  border: 1px solid var(--sc-v2-line);
  border-radius: 4px;
  background: #fff;
  color: var(--sc-v2-blue);
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.sc-v2-preview-exit:hover { border-color: var(--sc-v2-blue); }

.sc-v2-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--sc-v2-line);
  border-left: 1px solid var(--sc-v2-line);
  background: #fff;
}
.sc-v2-kpis > article {
  min-width: 0;
  min-height: clamp(82px, 10.5vh, 120px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto 1fr;
  align-items: end;
  gap: 4px 14px;
  padding: clamp(12px, 1vw, 20px);
  border-right: 1px solid var(--sc-v2-line);
  border-bottom: 1px solid var(--sc-v2-line);
  background: #fff;
}
.sc-v2-kpis > article.is-active { background: var(--sc-v2-blue); color: #fff; }
.sc-v2-kpis article > span {
  grid-column: 1 / -1;
  align-self: start;
  color: var(--sc-v2-muted);
  font-size: clamp(11px, .7vw, 14px);
  font-weight: 650;
}
.sc-v2-kpis article > b {
  align-self: end;
  color: var(--sc-v2-ink);
  font-size: clamp(38px, 3.4vw, 68px);
  font-weight: 680;
  font-variant-numeric: tabular-nums;
  line-height: .8;
  letter-spacing: -.065em;
}
.sc-v2-kpis article > b i { margin-left: 4px; color: var(--sc-v2-muted); font-size: .42em; font-style: normal; font-weight: 550; letter-spacing: -.03em; }
.sc-v2-kpis article > b.is-word { padding-bottom: 4px; font-size: clamp(25px, 2vw, 40px); letter-spacing: -.04em; }
.sc-v2-kpis article > small { align-self: end; justify-self: end; color: var(--sc-v2-muted); font-size: clamp(10px, .66vw, 13px); text-align: right; }
.sc-v2-kpis > article.is-active :is(span, b, small, b i) { color: #fff; }

.sc-v2-grid {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.72fr) minmax(420px, .78fr);
  gap: clamp(12px, 1.25vw, 22px);
}

.sc-v2-panel {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 1px solid var(--sc-v2-line);
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}

.sc-v2-panel-head {
  min-height: clamp(46px, 5.4vh, 62px);
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 0 clamp(12px, 1vw, 18px);
  border-bottom: 1px solid var(--sc-v2-line);
}
.sc-v2-panel-head > span { color: var(--sc-v2-blue); font-size: clamp(20px, 1.55vw, 31px); font-weight: 680; font-variant-numeric: tabular-nums; letter-spacing: -.06em; }
.sc-v2-panel-head h2 { color: var(--sc-v2-ink); font-size: clamp(14px, .92vw, 19px); font-weight: 680; letter-spacing: -.02em; }
.sc-v2-panel-head p { color: var(--sc-v2-muted); font-size: clamp(10px, .67vw, 13px); }

.sc-v2-projects { display: flex; flex-direction: column; }
.sc-v2-project-grid {
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(5, minmax(0, 1fr));
  flex: 1 1 auto;
}
.sc-v2-project {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: clamp(32px, 2.3vw, 46px) minmax(0, 1fr);
  gap: clamp(8px, .7vw, 14px);
  padding: clamp(8px, .8vw, 15px);
  border-right: 1px solid var(--sc-v2-line);
  border-bottom: 1px solid var(--sc-v2-line);
  background: #fff;
}
.sc-v2-project:nth-child(even) { border-right: 0; }
.sc-v2-project.is-risk { border-left: 5px solid var(--sc-v2-blue); }
.sc-v2-project-index { color: var(--sc-v2-blue); font-size: clamp(17px, 1.2vw, 24px); font-weight: 650; font-variant-numeric: tabular-nums; letter-spacing: -.05em; }
.sc-v2-project-main { min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.sc-v2-project-main header { min-width: 0; display: flex; align-items: baseline; gap: 10px; }
.sc-v2-project-main h3 { flex: 1; overflow: hidden; color: var(--sc-v2-ink); font-size: clamp(13px, .84vw, 17px); font-weight: 680; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.sc-v2-project-main header strong { flex: 0 0 auto; color: var(--sc-v2-blue); font-size: clamp(17px, 1.2vw, 25px); font-weight: 680; font-variant-numeric: tabular-nums; letter-spacing: -.04em; }
.sc-v2-project-main > p { overflow: hidden; margin-top: 4px; color: var(--sc-v2-muted); font-size: clamp(9px, .58vw, 12px); text-overflow: ellipsis; white-space: nowrap; }
.sc-v2-stage-track { height: clamp(7px, .65vh, 10px); display: flex; gap: 2px; margin-top: clamp(6px, .65vh, 10px); }
.sc-v2-stage-track > :is(span, i) { min-width: 4px; height: 100%; flex: 1 1 0; border: 1px solid var(--sc-v2-line); background: var(--sc-v2-soft); }
.sc-v2-stage-track > span.done { border-color: var(--sc-v2-blue); background: var(--sc-v2-blue); }
.sc-v2-stage-track > span.doing { border: 2px solid var(--sc-v2-blue); background: #fff; }
.sc-v2-project-main footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 5px; color: var(--sc-v2-muted); font-size: clamp(9px, .56vw, 11px); }
.sc-v2-project-main footer b { color: var(--sc-v2-muted); font-weight: 600; white-space: nowrap; }
.sc-v2-project.is-risk footer b { color: var(--sc-v2-blue); }

.sc-v2-rail {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1.15fr) minmax(0, .66fr) minmax(0, 1fr);
  gap: clamp(10px, 1vh, 16px);
}
.sc-v2-alerts { display: flex; flex-direction: column; }
.sc-v2-alerts ol { min-height: 0; display: grid; grid-template-rows: repeat(5, minmax(0, 1fr)); flex: 1; padding: 0; list-style: none; }
.sc-v2-alerts li {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 5px 12px;
  border-bottom: 1px solid var(--sc-v2-line);
}
.sc-v2-alerts li:last-child { border-bottom: 0; }
.sc-v2-alerts li.is-overdue { border-left: 4px solid var(--sc-v2-blue); }
.sc-v2-row-number { color: var(--sc-v2-blue); font-size: 11px; font-variant-numeric: tabular-nums; }
.sc-v2-alerts li > span:nth-child(2) { min-width: 0; }
.sc-v2-alerts li b, .sc-v2-alerts li small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-v2-alerts li b { color: var(--sc-v2-ink); font-size: clamp(10px, .7vw, 14px); }
.sc-v2-alerts li small { margin-top: 2px; color: var(--sc-v2-muted); font-size: clamp(9px, .56vw, 11px); }
.sc-v2-alerts li strong { color: var(--sc-v2-blue); font-size: clamp(10px, .63vw, 12px); white-space: nowrap; }

.sc-v2-today { display: flex; flex-direction: column; }
.sc-v2-today-grid { min-height: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); flex: 1; }
.sc-v2-today-grid > div { min-width: 0; padding: clamp(8px, .75vw, 14px); border-right: 1px solid var(--sc-v2-line); }
.sc-v2-today-grid > div:last-child { border-right: 0; }
.sc-v2-today-grid h3, .sc-v2-duty h3 { color: var(--sc-v2-muted); font-size: clamp(9px, .58vw, 11px); font-weight: 650; }
.sc-v2-today-grid p { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 7px; }
.sc-v2-today-grid p span { padding: 2px 6px; border: 1px solid var(--sc-v2-blue); color: var(--sc-v2-blue); font-size: clamp(9px, .58vw, 11px); font-weight: 650; }
.sc-v2-today-grid p em, .sc-v2-rest { color: var(--sc-v2-muted); font-size: clamp(10px, .62vw, 12px); font-style: normal; }
.sc-v2-rest { display: grid; place-items: center; flex: 1; }

.sc-v2-rail-bottom { min-width: 0; min-height: 0; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(150px, .75fr); gap: clamp(10px, .8vw, 14px); }
.sc-v2-month, .sc-v2-duty { display: flex; flex-direction: column; }
.sc-v2-month table { width: 100%; border-collapse: collapse; table-layout: fixed; flex: 1; }
.sc-v2-month th, .sc-v2-month td { padding: 4px 7px; border-right: 1px solid var(--sc-v2-line); border-bottom: 1px solid var(--sc-v2-line); color: var(--sc-v2-muted); font-size: clamp(8px, .53vw, 10px); text-align: right; }
.sc-v2-month th:first-child, .sc-v2-month td:first-child { width: 34%; color: var(--sc-v2-ink); text-align: left; }
.sc-v2-month th:last-child, .sc-v2-month td:last-child { border-right: 0; }
.sc-v2-month tbody tr:last-child td { border-bottom: 0; }
.sc-v2-month tbody td:not(:first-child) { color: var(--sc-v2-blue); font-weight: 650; font-variant-numeric: tabular-nums; }
.sc-v2-duty > div { min-height: 0; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 5px; flex: 1; padding: 8px 10px; border-bottom: 1px solid var(--sc-v2-line); }
.sc-v2-duty > div:last-child { border-bottom: 0; }
.sc-v2-duty p { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.sc-v2-duty p > span { min-width: 0; display: flex; justify-content: space-between; gap: 5px; font-size: clamp(8px, .53vw, 10px); }
.sc-v2-duty p b { overflow: hidden; color: var(--sc-v2-ink); font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.sc-v2-duty p small { color: var(--sc-v2-muted); white-space: nowrap; }
.sc-v2-duty p em { color: var(--sc-v2-muted); font-size: 10px; font-style: normal; }

.sc-v2-empty { min-height: 64px; display: grid !important; place-items: center; color: var(--sc-v2-muted); font-size: clamp(11px, .7vw, 14px); text-align: center; }
.sc-v2-project-grid > .sc-v2-empty { grid-column: 1 / -1; grid-row: 1 / -1; }
.sc-v2-alerts li.sc-v2-empty { grid-row: 1 / -1; grid-template-columns: 1fr; }

@media (min-width: 1181px) and (max-height: 800px) {
  .screen-wrap.screen-v2 { min-height: 640px; padding-block: 14px; gap: 10px; }
  .sc-v2-header { min-height: 58px; padding-bottom: 10px; }
  .sc-v2-kpis > article { min-height: 72px; padding-block: 9px; }
  .sc-v2-panel-head { min-height: 42px; }
  .sc-v2-project { padding-block: 6px; }
  .sc-v2-project-main > p { margin-top: 2px; }
  .sc-v2-project-main footer { margin-top: 3px; }
}

@media (max-width: 1180px) {
  .screen-wrap.screen-v2 {
    height: auto !important;
    min-height: 100vh;
    overflow: visible !important;
  }
  .sc-v2-grid { grid-template-columns: 1fr; }
  .sc-v2-project-grid { grid-template-rows: none; }
  .sc-v2-project { min-height: 112px; }
  .sc-v2-rail { grid-template-rows: none; }
  .sc-v2-rail-bottom { min-height: 270px; }
}

@media (max-width: 720px) {
  .screen-wrap.screen-v2 { padding: 12px; }
  .sc-v2-header { grid-template-columns: 1fr; align-items: start; }
  .sc-v2-datetime { grid-template-columns: auto auto; justify-content: space-between; }
  .sc-v2-preview-exit { grid-column: 1 / -1; justify-self: end; }
  .sc-v2-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sc-v2-project-grid { grid-template-columns: 1fr; }
  .sc-v2-project:nth-child(even) { border-right: 1px solid var(--sc-v2-line); }
  .sc-v2-rail-bottom { grid-template-columns: 1fr; min-height: 0; }
  .sc-v2-month, .sc-v2-duty { min-height: 280px; }
}

/* System settings responsive shell */
@media (min-width: 769px) and (max-width: 1180px) {
  .system-settings-layout { grid-template-columns: 210px minmax(0, 1fr); gap: 14px; }
  .system-settings-nav button { grid-template-columns: 22px minmax(0, 1fr); }
  .system-settings-nav button > i:last-child { display: none; }
  .brand-settings-grid { grid-template-columns: 1fr; }
  .brand-live-preview { max-width: 520px; }
}

@media (max-width: 768px) {
  .system-page { width: 100%; }
  .system-page-head { min-height: 0; align-items: flex-start; padding: 4px 0 16px; }
  .system-page-head h1 { font-size: 26px; }
  .system-page-head p { max-width: 26ch; }
  .system-page-head > span { display: none; }
  .system-settings-layout { display: block; }
  .system-settings-nav {
    position: static;
    display: flex;
    gap: 8px;
    margin: 0 -12px 12px;
    padding: 0 12px 10px;
    overflow-x: auto;
    border: 0;
    border-bottom: 1px solid var(--ops-line);
    border-radius: 0;
    background: transparent;
    scrollbar-width: none;
  }
  .system-settings-nav::-webkit-scrollbar { display: none; }
  .system-settings-nav section { min-width: max-content; display: flex; gap: 8px; padding: 0; border: 0; }
  .system-settings-nav h2 { display: none; }
  .system-settings-nav button {
    width: auto;
    min-width: max-content;
    min-height: 44px;
    display: inline-flex;
    gap: 7px;
    padding: 0 12px;
    border: 1px solid var(--ops-line);
    border-left-width: 1px;
    background: #fff;
  }
  .system-settings-nav button.active { border-color: var(--ops-blue); }
  .system-settings-nav button span { display: inline; }
  .system-settings-nav button b { font-size: 12px; }
  .system-settings-nav button small,
  .system-settings-nav button > i:last-child { display: none; }
  .system-workspace { overflow: visible; border: 0; border-radius: 0; background: transparent; }
  .system-workspace-head { min-height: 68px; padding: 12px; border: 1px solid var(--ops-line); background: #fff; }
  .system-workspace-head > i { width: 36px; height: 36px; }
  .system-workspace-head h2 { font-size: 18px; }
  .system-workspace-body { padding: 12px 0 0; background: transparent; }
  .system-card { padding: 16px; }
  .system-form-grid { grid-template-columns: 1fr; gap: 14px; }
  .system-field.full { grid-column: 1; }
  .system-field > input { min-height: 44px; }
  .system-form-actions { display: grid; grid-template-columns: 1fr; }
  .system-form-actions .btn { width: 100%; min-height: 44px; justify-content: center; }
  .brand-settings-grid { grid-template-columns: 1fr; }
  .brand-preview-screen { min-height: 220px; }
  .brand-preview-screen > strong { font-size: 30px; }
  .system-stat-strip > div { min-height: 68px; display: grid; gap: 4px; padding: 12px; }
  .system-stat-strip b { font-size: 23px; }
  .system-toolbar { align-items: stretch; flex-direction: column; }
  .system-toolbar .spacer { display: none; }
  .system-table-search { width: 100%; }
  .system-toolbar .btn { min-height: 44px; justify-content: center; }
  .system-table-wrap { width: 100%; overflow-x: auto; }
  .system-workspace .tbl { min-width: 680px; }
  .system-table-wrap:has(.system-mobile-cards) { overflow: visible; border: 0; background: transparent; }
  .system-workspace .tbl.system-mobile-cards { min-width: 0; display: block; background: transparent; }
  .system-mobile-cards tbody { display: grid; gap: 10px; }
  .system-mobile-cards tr:first-child { display: none; }
  .system-mobile-cards tr:not(:first-child) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px 14px;
    padding: 14px;
    border: 1px solid var(--ops-line);
    border-radius: 6px;
    background: #fff;
  }
  .system-mobile-cards td {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    padding: 0;
    border: 0;
    white-space: normal;
  }
  .system-mobile-cards td::before { color: var(--ops-muted); font-size: 10px; font-weight: 650; letter-spacing: .04em; }
  .system-users-table td:nth-child(1)::before { content: "用户名"; }
  .system-users-table td:nth-child(2)::before { content: "显示姓名"; }
  .system-users-table td:nth-child(3)::before { content: "关联员工"; }
  .system-users-table td:nth-child(4)::before { content: "角色"; }
  .system-users-table td:nth-child(5)::before { content: "状态"; }
  .system-users-table td:nth-child(6)::before { content: "创建时间"; }
  .system-users-table td:nth-child(7),
  .system-employees-table td:nth-child(8),
  .system-logs-table td:nth-child(6) { grid-column: 1 / -1; }
  .system-users-table td:nth-child(7)::before,
  .system-employees-table td:nth-child(8)::before { content: "操作"; }
  .system-employees-table td:nth-child(1)::before { content: "姓名"; }
  .system-employees-table td:nth-child(2)::before { content: "工种"; }
  .system-employees-table td:nth-child(3)::before { content: "级别"; }
  .system-employees-table td:nth-child(4)::before { content: "直属上级"; }
  .system-employees-table td:nth-child(5)::before { content: "电话"; }
  .system-employees-table td:nth-child(6)::before { content: "状态"; }
  .system-employees-table td:nth-child(7)::before { content: "资料"; }
  .system-employees-table td:nth-child(8) { flex-direction: row; flex-wrap: wrap; }
  .system-employees-table td:nth-child(8)::before { width: 100%; }
  .system-logs-table td:nth-child(1)::before { content: "时间"; }
  .system-logs-table td:nth-child(2)::before { content: "操作人"; }
  .system-logs-table td:nth-child(3)::before { content: "动作"; }
  .system-logs-table td:nth-child(4)::before { content: "对象"; }
  .system-logs-table td:nth-child(5)::before { content: "对象 ID"; }
  .system-logs-table td:nth-child(6)::before { content: "详情"; }
  .backup-primary { grid-template-columns: 44px minmax(0, 1fr); }
  .backup-primary .btn { grid-column: 1 / -1; min-height: 44px; justify-content: center; }
  .backup-path { grid-template-columns: 1fr; }
  .backup-path code { width: 100%; overflow-wrap: anywhere; white-space: normal; }
  .approval-version-snapshot > header { align-items: flex-start; }
  .approval-version-snapshot dl { grid-template-columns: 1fr; }
  .approval-version-snapshot dl > div,
  .approval-version-snapshot dl > div:nth-child(3n) { border-right: 0; }
}

/* Planned tasks: tablet and phone retain the date-led Swiss ledger. */
@media (max-width: 1180px) {
  .pt-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pt-summary > button { min-height: 96px; }
  .pt-summary > button:nth-child(2) { border-right: 0; }
  .pt-summary > button:nth-child(-n+2) { border-bottom: 1px solid var(--border-strong); }
  .pt-toolbar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pt-scope, .pt-search { grid-column: span 2; }
  .pt-filter-end { grid-column: span 2; justify-content: flex-start; }
  .pt-task-row { grid-template-columns: 76px minmax(0, 1fr) auto; }
  .pt-task-context { grid-column: 2; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding-top: 0; border-left: 0; }
  .pt-task-actions { grid-column: 3; grid-row: 1 / span 2; }
  .pt-date-block { grid-row: 1 / span 2; }
}

@media (max-width: 768px) {
  .pt-page-head { min-height: 0; align-items: stretch; gap: 15px; padding-bottom: 17px; }
  .pt-page-head h1 { font-size: 29px; }
  .pt-page-head p { font-size: 12px; line-height: 1.65; }
  .pt-page-head .pt-create { flex: 0 0 auto; min-width: 112px; }
  .pt-summary { margin-bottom: 12px; }
  .pt-summary > button { min-height: 88px; padding: 13px 14px 12px; }
  .pt-summary strong { font-size: 35px; }
  .pt-workspace { overflow: visible; border-inline: 0; }
  .pt-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px; }
  .pt-scope, .pt-search, .pt-filter-end { grid-column: 1 / -1; }
  .pt-filter-end { justify-content: space-between; }
  .pt-list-head { padding-inline: 12px; }
  .pt-list-head > span { display: none; }
  .pt-task-list { padding: 0 12px; }
  .pt-task-row { min-height: 0; grid-template-columns: 66px minmax(0, 1fr); padding: 12px 0; }
  .pt-date-block { grid-column: 1; grid-row: 1; justify-content: flex-start; padding: 8px 12px 8px 0; }
  .pt-date-block strong { font-size: 34px; }
  .pt-task-main { grid-column: 2; grid-row: 1; padding: 4px 0 8px 13px; }
  .pt-task-main h3 { white-space: normal; }
  .pt-task-context { grid-column: 1 / -1; grid-row: 2; grid-template-columns: 1fr; gap: 6px; padding: 10px 0; border-top: 1px solid var(--border); }
  .pt-task-actions { grid-column: 1 / -1; grid-row: 3; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 4px 0 0; }
  .pt-task-actions .btn { min-width: 0; min-height: 44px; justify-content: center; }
  .pt-task-actions .btn span { display: inline; }
  .pt-empty { min-height: 240px; }
  .pt-form-modal { width: 100vw; max-width: none; height: 100dvh; max-height: none; border: 0; border-radius: 0; }
  .pt-form-modal .modal-head { padding-top: max(15px, env(safe-area-inset-top)); }
  .pt-form-modal .notification-close,
  .pt-detail-drawer .notification-close,
  .pt-action-modal .notification-close { width: 44px; height: 44px; flex: 0 0 44px; }
  .pt-form-modal .modal-body { max-height: none; padding: 16px 14px; }
  .pt-form-modal .modal-foot { padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
  .pt-form-grid { grid-template-columns: 1fr; }
  .pt-form-grid label.full { grid-column: 1; }
  .pt-form-grid :is(input, select), .pt-reminder-grid .custom { min-height: 44px; }
  .pt-assignee-grid, .pt-reminder-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pt-form-section-head { align-items: flex-start; flex-direction: column; gap: 3px; }
  .pt-attachment-upload .pt-form-section-head { align-items: stretch; gap: 10px; }
  .pt-attachment-picker { width: 100%; min-height: 44px; justify-content: center; }
  .pt-attachment-item { min-height: 52px; }
  .feedback-drawer.pt-detail-drawer { width: 100vw; height: 100dvh; }
  .pt-detail-drawer > header { min-height: 86px; padding-top: max(14px, env(safe-area-inset-top)); }
  .pt-detail-drawer > header h3 { max-width: calc(100vw - 100px); font-size: 19px; }
  .pt-detail-drawer .feedback-body { padding: 15px; }
  .pt-detail-facts { grid-template-columns: 1fr; }
  .pt-detail-facts > div, .pt-detail-facts > div:nth-child(even) { padding-inline: 0; border-right: 0; }
  .pt-detail-drawer > footer { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
  .pt-detail-drawer > footer > span { display: none; }
  .pt-detail-drawer > footer .btn { min-width: 0; min-height: 44px; }
  .pt-action-modal { width: calc(100vw - 24px); }
  .pt-action-modal textarea { min-height: 120px; }
}

@media (max-width: 520px) {
  .project-event-toolbar .btn { flex-basis: calc(50% - 5px); }
  .project-event-toolbar .btn:first-of-type { flex-basis: 100%; }
  .project-event-issue-head small { flex-basis: 100%; }
  .project-event-issue-status { margin-top: 1px; }
  .project-event-issue > footer > span { display: none; }
  .project-event-issue > footer { justify-content: flex-end; }
  .pt-page-head { flex-direction: column; }
  .pt-page-head .pt-create { width: 100%; }
  .pt-toolbar { grid-template-columns: 1fr; }
  .pt-toolbar > *, .pt-scope, .pt-search, .pt-filter-end { grid-column: 1; }
  .pt-toolbar > label > span { font-size: 11px; }
  .pt-toolbar :is(input, select), .pt-scope { min-height: 44px; }
  .pt-filter-end { align-items: stretch; flex-direction: column; }
  .pt-deleted-toggle { width: 100%; }
  .pt-filter-end .btn { width: 100%; justify-content: center; }
  .pt-assignee-grid, .pt-reminder-grid { grid-template-columns: 1fr; }
  .pt-assignee-self { align-items: flex-start; flex-direction: column; }
  .pt-assignee-self strong { min-height: 44px; }
  .pt-history li > div > div { align-items: flex-start; flex-direction: column; gap: 2px; }
  .planned-employee-tasks button { min-height: 56px; }
}