/* Shared spreadsheet density. Loaded last so legacy page skins cannot enlarge
   controls independently. Feature modules use these tokens for their geometry.
   Keep the root font size intact: browser text enlargement must still work. */
:root {
  --ui-text: .875rem; /* 14px */
  --ui-control: .8125rem; /* 13px */
  --ui-meta: .75rem; /* 12px */
  --ui-heading: 1.375rem; /* 22px */
  --ui-section: 1rem;
  --grid-text-line: 1.125rem;
  --grid-row-height: 46px;
  --grid-head-height: 34px;
  --grid-control-height: 28px;
}

body { font-size: var(--ui-text); line-height: 1.45; }
button, input, select, textarea { font-family: var(--font-ui); }
.main-content { padding: 0 18px 24px; }
.topbar { height: 48px; }
.breadcrumbs, .account-label { font-size: var(--ui-control); }
.project-heading { padding: 16px 0 14px; gap: 12px; }
.project-heading h1 { font-size: var(--ui-heading); line-height: 1.35; font-weight: 650; letter-spacing: 0; }
.project-heading p { font-size: var(--ui-control); line-height: 1.45; }
.eyebrow { font-size: var(--ui-meta); margin-bottom: 4px; }
.primary-btn, .secondary-btn, .heading-actions .primary-btn, .heading-actions .secondary-btn {
  min-height: 32px; padding: 6px 10px; font-size: var(--ui-control); line-height: 1.35;
  font-weight: 550; border-radius: 5px; box-shadow: none;
}
.board-card { border-radius: 6px; box-shadow: none; }
.board-tabs { height: 40px; padding: 0 12px; gap: 22px; }
.board-tab { height: 40px; padding: 0 3px; font-size: var(--ui-text); font-weight: 600; }
.board-action { font-size: var(--ui-control); }
.outline-toolbar { min-height: 38px; padding: 4px 10px; gap: 8px; }
.outline-toolbar button { min-height: 28px; padding: 4px 7px; font-size: var(--ui-control); font-weight: 500; border-radius: 4px; }
.outline-hint, .table-hint, .table-total { font-size: var(--ui-meta); }
.table-footer { min-height: 38px; height: auto; padding: 8px 12px; gap: 12px; }
.add-row { font-size: var(--ui-control); }
.board-card > .bulk-bar { min-height: 40px; height: 40px; padding: 5px 10px; gap: 8px; }
.bulk-bar strong, .bulk-bar button, .bulk-bar select { font-size: var(--ui-control); }
.bulk-bar button, .bulk-bar select { min-height: 30px; height: 30px; }

/* Shared popover shell and controls retain their arrows and focus treatment. */
.floating-menu { border-radius: 8px; }
.status-menu.floating-menu { --floating-preferred-width: 176px; width: 176px; padding: 10px; }
.status-menu .status-option { height: 28px; min-height: 28px; font-size: var(--ui-control); font-weight: 550; }
.assignee-menu-head strong, .dependency-menu-head strong { font-size: var(--ui-text); }
.assignee-option, .dependency-task-name, .dependency-owner-select { font-size: var(--ui-control); }
.assignee-menu-head span, .assignee-menu-hint, .dependency-menu-head span { font-size: var(--ui-meta); }
.assignee-option { min-height: 34px; padding: 5px 8px; }
.outline-menu button { min-height: 32px; font-size: var(--ui-control); }

/* Other views follow the same scale, rather than oversized dashboard cards. */
.gantt-view, .flat-calendar.calendar-view, .smart-list-view { padding: 14px; font-size: var(--ui-text); }
.gantt-toolbar h2, .flat-calendar .calendar-toolbar h2, .smart-list-head h2 { font-size: var(--ui-heading); font-weight: 650; }
.gantt-toolbar p, .flat-calendar .calendar-subtitle, .smart-list-head p { font-size: var(--ui-control); }
.gantt-toolbar { padding-bottom: 10px; gap: 12px; }
.gantt-toolbar-actions label, .gantt-toolbar-actions select, .gantt-toolbar-actions .secondary-btn { font-size: var(--ui-control); }
.gantt-toolbar-actions select { min-width: 140px; min-height: 32px; padding: 5px 28px 5px 9px; }
.gantt-toolbar-actions .secondary-btn { min-height: 32px; padding: 6px 10px; }
.gantt-legend { font-size: var(--ui-meta); padding: 8px 0; gap: 10px; }
.gantt-range, .gantt-beijing-today { font-size: var(--ui-meta); }
.gantt-header, .gantt-days, .gantt-day-header, .gantt-label-head { height: 44px; }
.gantt-label-head { font-size: var(--ui-control); }
.gantt-day-header strong { font-size: var(--ui-text); }
.gantt-day-header small { font-size: var(--ui-meta); }
.gantt-day-header.today strong { width: 22px; height: 22px; border-radius: 4px; }
.gantt-row, .gantt-task-label, .gantt-track { min-height: 46px; }
.gantt-task-label { padding: 5px 10px; gap: 7px; }
.gantt-task-copy { gap: 1px; }
.gantt-task-copy strong { font-size: var(--ui-text); line-height: var(--grid-text-line); font-weight: 550; }
.gantt-task-copy small, .gantt-dependency-count { font-size: var(--ui-meta); line-height: 1rem; }
.gantt-bar { top: 10px; height: 26px; border-radius: 4px; padding: 0 7px; }
.gantt-bar strong, .gantt-bar small { font-size: var(--ui-meta); font-weight: 550; }
.gantt-group-label { height: 30px; font-size: var(--ui-control); }
.gantt-today-line { top: 44px; }
.flat-calendar .calendar-toolbar { margin-bottom: 12px; }
.flat-calendar .calendar-weekdays span { padding: 7px; font-size: var(--ui-control); }
.flat-calendar .calendar-day { min-height: 100px; padding: 7px; }
.flat-calendar .calendar-day-number { font-size: var(--ui-text); }
.flat-calendar .calendar-task { min-height: 26px; padding: 4px 6px; font-size: var(--ui-control); }
.flat-calendar .calendar-actions button { font-size: var(--ui-control); }
.smart-list-head { padding-bottom: 10px; }
.smart-list-columns { padding: 8px 12px; font-size: var(--ui-control); }
.smart-task-row { padding: 9px 12px; gap: 10px; }
.smart-task-main strong { font-size: var(--ui-text); font-weight: 550; }
.smart-task-main small, .smart-task-project, .smart-task-due, .smart-task-label { font-size: var(--ui-control); }

.modal-head h2, .drawer-head h2, .profile-drawer-head h2, .project-members-head h2,
.project-feishu-settings h2, .auth-card h2 { font-size: 1.25rem; line-height: 1.4; font-weight: 650; }
.task-modal label, .project-modal label, .project-member-form label, .profile-form label { font-size: var(--ui-control); }
.task-modal input, .task-modal select, .task-modal textarea,
.project-modal input, .project-modal select, .project-modal textarea,
.profile-form input { padding: 8px 10px; font-size: var(--ui-text); }
.project-members-head .project-members-intro, .project-modal-intro { font-size: var(--ui-control); }
.project-members-section-title strong, .project-member-identity strong, .project-member-candidate-copy strong { font-size: var(--ui-text); }
.project-member-identity small, .project-member-candidate-copy small, .project-member-department-head strong { font-size: var(--ui-meta); }
.project-member-row { min-height: 52px; padding-top: 6px; padding-bottom: 6px; }
.notification-title { font-size: var(--ui-text); font-weight: 600; }
.notification-body, .notification-task-link { font-size: var(--ui-control); }
.notification-time { font-size: var(--ui-meta); }
.confirm-dialog-copy h2 { font-size: var(--ui-section); }
.confirm-dialog-copy p, .confirm-dialog-actions button { font-size: var(--ui-text); }
.task-detail-page { padding: 18px 0 24px; font-size: var(--ui-text); }
.td-header { margin-bottom: 14px; }
.td-header h1 { font-size: var(--ui-heading); font-weight: 650; }
.td-card { padding: 16px; border-radius: 7px; }
.td-card h2 { font-size: var(--ui-section); }
.td-section-head { margin-bottom: 14px; }
.td-field { margin-bottom: 12px; gap: 5px; }
.td-field :is(input,select), .td-date-control { min-height: 36px; padding: 7px 10px; }
.td-button { min-height: 34px; padding: 6px 10px; }
.td-field > span, .td-section-head p, .td-header .td-eyebrow { font-size: var(--ui-control); }

@media (min-width: 761px) {
  .app-shell > .workspace-sidebar { width: 216px; min-width: 216px; flex-basis: 216px; padding: 10px 12px 16px; }
  .workspace-sidebar .workspace-brand { min-height: 0; margin-bottom: 8px; padding: 0 4px 8px; gap: 3px; }
  .workspace-brand img { width: 112px; max-width: 112px; max-height: 38px; }
  .workspace-sidebar .workspace-nav { margin-bottom: 8px; }
  .workspace-sidebar .projects-section { margin-top: 6px; }
  .workspace-brand span { font-size: var(--ui-meta); }
  .workspace-nav-link { min-height: 34px; padding: 7px; font-size: var(--ui-control); }
  .sidebar-section { margin-top: 18px; }
  .project-item, .sidebar-link { min-height: 34px; padding: 7px 8px; font-size: var(--ui-control); }
  .new-project-btn { min-height: 34px; padding: 7px 10px; font-size: var(--ui-control); }
  .project-count, .link-count { font-size: var(--ui-meta); }
}

@media (max-width: 760px) {
  /* Keep mobile touch targets and 16px form input text (avoids iOS zoom).
     Only the dense data grid scrolls; the page itself still fits the screen. */
  .main-content { padding: 0 12px 20px; }
  .topbar { height: 50px; }
  .project-heading { padding: 12px 0; }
  .heading-actions button, .outline-toolbar button, .board-tab { min-height: 36px; }
  .outline-hint { display: none; }
  .table-hint { display: none; }
  .task-detail-page { padding: 12px 0; }
  .gantt-view, .flat-calendar.calendar-view, .smart-list-view { padding: 10px; }
  .modal-backdrop input:not([type=checkbox]), .modal-backdrop select, .modal-backdrop textarea,
  .auth-card input, .profile-form input, .td-field :is(input,select,textarea), .td-molecule-add input {
    font-size: 1rem;
  }
}

/* Keep everyday project actions at the left, lifecycle actions at the right. */
.main-content > .project-heading { flex-wrap: wrap; }
.main-content > .project-heading > .project-heading-copy { flex: 1 0 100%; }
.main-content > .project-heading > .heading-actions { display: flex; flex-wrap: wrap; width: 100%; align-items: center; }
.main-content > .project-heading > .heading-actions > button { flex: 0 0 auto; width: auto; }
.main-content > .project-heading .heading-actions #projectMembershipBtn { margin-left: auto; }

.main-content > .project-heading .heading-actions #projectMembershipBtn.primary-btn { background: var(--b-600); color: var(--acc-fg); }
.main-content > .project-heading .heading-actions #projectMembershipBtn.primary-btn:hover { background: var(--b-700); }

/* Compact project information above the task workspace. */
.project-info-heading { display:flex; align-items:center; flex-wrap:wrap; gap:12px; font-size:12px; margin:6px 0; color:var(--mut); }
.project-info-heading strong { color:var(--mut); }
.project-info-heading .secondary-btn { padding:3px 10px; min-height:28px; font-size:12px; }
#projectInfoForm textarea { display:block; width:100%; min-height:76px; resize:vertical; padding:10px; border:1px solid var(--line); border-radius:8px; font:inherit; font-size:13px; margin-bottom:8px; }
#projectInfoForm > div { display:flex; gap:8px; margin-bottom:8px; }
#projectInfoForm[hidden], #newProjectBtn[hidden], #editProjectInfo[hidden] { display:none !important; }
.project-description-wrap { width:min(780px,100%); }
.project-info-heading, #projectInfoForm { flex:0 0 100%; min-width:0; }
#projectInfoForm:not([hidden]) ~ #currentProjectDescription, #projectInfoForm:not([hidden]) ~ #toggleProjectDescription { display:none; }
#projectInfoInput { box-sizing:border-box; }

.assignee-project-role { display:inline-block; margin-left:6px; color:var(--acc); font-size:11px; }
