/* 全系統共用的版面整理；只處理呈現，不改業務資料或流程。 */
:root {
  --control-height: 44px;
  --workspace-gap: 24px;
  --workspace-card-radius: 14px;
}

body { line-height: 1.65; }
main [hidden] { display: none !important; }
h1 { font-size: clamp(1.75rem, 2.6vw, 2.25rem); line-height: 1.3; }
h2 { font-size: clamp(1.15rem, 1.8vw, 1.4rem); line-height: 1.45; }
h3 { font-size: 1.05rem; line-height: 1.5; }

.content-page { padding: 32px clamp(24px, 3vw, 44px) 56px; }
.hero { padding: 40px clamp(24px, 3vw, 44px) 56px; }
.page-context-bar { padding-inline: clamp(24px, 3vw, 44px); }
.page-heading { gap: 20px; margin-bottom: 28px; align-items: start; }
.page-heading > div { min-width: 0; }
.page-heading h1 { margin: 6px 0 10px; overflow-wrap: anywhere; }
.page-heading p { margin: 0; max-width: 65ch; color: var(--muted); line-height: 1.65; }
.page-heading > .button, .page-heading > .button-row { flex: 0 0 auto; }
.page-heading > .button-row { align-self: start; }
.section-gap { margin-top: 28px; }
.section-heading { align-items: center; flex-wrap: wrap; }
.section-heading > div { min-width: 0; }
.section-heading h2 { margin: 0; }
.section-heading p { margin: 6px 0 0; }

.button, .button.compact, .form-actions .button,
.step-applicability-form .button, .file-preview-remove {
  min-width: 0;
  min-height: 44px;
  height: auto;
  padding: 10px 16px;
  flex: 0 0 auto;
  align-self: start;
  line-height: 1.4;
  font-weight: 700;
}
.button.compact { width: fit-content; }
.button:disabled { opacity: .6; cursor: not-allowed; }
.button-row, .form-actions, .step-actions, .control-actions,
.activity-heading-actions, .finance-list-actions {
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  min-width: 0;
}
.button-row > form, .finance-list-actions > form { margin: 0; min-width: 0; }
.button-row > .helper-text, .button-row > .save-progress {
  flex: 1 1 180px;
  min-width: 0;
  font-size: .85rem;
  overflow-wrap: anywhere;
}
.form-actions, .confirm-form { padding-top: 16px; }
.form-actions { border-top: 1px solid var(--line); }
.form-actions .button { min-width: 0; }
.form-card > .button, .form-card > button,
.compact-form > .button, .compact-form > button,
.form-grid > .button, .form-grid > button { justify-self: start; align-self: end; }
.report-actions { width: auto; grid-template-columns: repeat(2, minmax(0, auto)); align-items: start; }
.project-report-actions { display: flex; align-items: start; flex-wrap: wrap; gap: 12px; }
.project-report-actions > .button { flex: 0 0 auto; width: auto; }
.file-picker-actions .button { width: 100%; }

.record-card, .form-card { border-radius: var(--workspace-card-radius); }
.record-card { padding: 20px; }
.record-card h2 { margin: 10px 0 8px; font-size: 1.15rem; line-height: 1.5; }
.record-card h3 { margin: 0 0 8px; }
.record-card p { margin: 0 0 10px; }
.record-card small { display: block; line-height: 1.6; }
.record-card .badge, .record-card .status { width: fit-content; max-width: 100%; }
.record-card > .button { margin-top: 6px; }
.activity-record, .recipient-record { gap: 10px; }
.recipient-record h2, .recipient-record p { margin: 0; }
.recipient-record .button { margin-top: 8px; }
.card-grid { gap: 20px; }
.payment-list, .income-flow-list, .gmail-insight-list, .work-list { gap: 20px; }
.form-card { gap: 24px; padding: clamp(20px, 2.5vw, 32px); align-items: start; }
.form-card > *, .form-grid > *, .choice-grid > *, .detail-grid > *,
.two-column > *, .result-list > *, .table-wrap { min-width: 0; }
.form-card > h2, .form-card-heading h2 { margin: 0; }
.form-card > p { margin: 0; }
.form-card fieldset { min-width: 0; padding-bottom: 24px; }
.form-card fieldset > p, fieldset > small { margin: 12px 0 0; display: block; color: var(--muted); }
legend { margin-bottom: 16px; line-height: 1.5; }
.form-grid { gap: 24px 20px; }
label { min-width: 0; gap: 8px; font-weight: 650; line-height: 1.5; }
label > small, .helper-text { font-size: .88rem; font-weight: 400; line-height: 1.65; }
input:not([type=checkbox]):not([type=radio]), select, textarea {
  min-width: 0;
  max-width: 100%;
  line-height: 1.5;
}
input[type=date], input[type=datetime-local], input[type=time] {
  display: block;
  inline-size: 100%;
  min-inline-size: 0;
  -webkit-appearance: none;
}
textarea { min-height: 128px; }
textarea.workspace-textarea { max-height: none; overflow-y: hidden; }
label:has(> input[type=checkbox]), label:has(> input[type=radio]) {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  column-gap: 12px;
  row-gap: 4px;
  align-items: start;
}
label:has(> input[type=checkbox]) > :not(input),
label:has(> input[type=radio]) > :not(input) { grid-column: 2; min-width: 0; overflow-wrap: anywhere; }
label > input[type=checkbox], label > input[type=radio] { grid-column: 1; align-self: start; margin-top: 3px; }
.inline-check { line-height: 1.6; }
.choice { padding: 14px; }
.choice span { margin-left: 0; font-size: .85rem; line-height: 1.6; }
.choice b { line-height: 1.5; }
.readonly-code { max-width: 100%; overflow-wrap: anywhere; }

.filter-bar { grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)) auto auto; gap: 16px; margin: 0; }
.filter-bar .button { width: auto; }
.list-filter-card { padding: 20px; gap: 16px; }
.list-search-row { gap: 12px; }
.list-pagination, .work-pagination { gap: 12px; }
.list-pagination > div, .work-pagination > div { flex-wrap: wrap; gap: 12px; }
.form-card details.section-gap { margin-top: 0; }
.form-card details.section-gap > summary { padding-block: 10px; min-height: 44px; cursor: pointer; color: var(--forest); font-weight: 700; }
.form-card details.section-gap[open] > .form-grid { margin-top: 16px; }
.batch-actions { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) auto; }
.payment-summary h2 { margin: 0; }
.payment-summary p { margin: 0; }
.payment-meta { gap: 6px; line-height: 1.6; }
.payment-row > .button { width: fit-content; justify-self: end; align-self: center; }
.finance-period-summary { min-width: 0; overflow-wrap: anywhere; }
.badge, .status, .person { line-height: 1.5; }
.metric-card strong, .payment-summary h2, .income-flow-amount { font-variant-numeric: tabular-nums; }
.detail-grid { gap: 20px; }
.detail-grid div { gap: 8px; }
.detail-grid strong { font-size: 1rem; line-height: 1.6; overflow-wrap: anywhere; }
dl > div { min-width: 0; }
dd { overflow-wrap: anywhere; }

.table-wrap { max-width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; }
.table-wrap:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.table-wrap table { font-size: .9rem; }
.table-wrap.is-wide table { min-width: 580px; }
th, td { padding: 14px 12px; line-height: 1.6; overflow-wrap: anywhere; }
th { font-size: .8rem; background: var(--surface); }
tbody tr:last-child td { border-bottom: 0; }

.panel-summary { padding: 22px 24px; }
.panel-body { padding: 0 24px 24px; }
.activity-panel .panel-summary h2 { font-size: 1.3rem; line-height: 1.5; }
.workflow-step-summary { min-height: 68px; }
.workflow-step-summary .step-number { min-height: 68px; }
.workflow-step-summary .step-summary-copy { padding-block: 14px; }
.workflow-step .step-content { padding: 0 20px 24px 60px; }
.accounting-forms form:first-child label { white-space: normal; }
.step-applicability-form { gap: 10px; flex-wrap: wrap; }
.step-applicability-form .button { min-width: 0; }
.step-record-heading { gap: 16px; }
.step-record-heading > div { min-width: 0; }
.section-summary span, .income-step > summary span { line-height: 1.6; }
.gmail-insight { gap: 16px; padding: 20px; }
.gmail-insight-heading { gap: 20px; }
.gmail-insight-meta { gap: 8px 20px; }
.gmail-task-confirm { gap: 12px; }
.transcript-panel { gap: 24px; }
.transcript-progress, .transcript-status-actions { gap: 12px; }
.work-row { min-width: 0; }
.work-row > * { min-width: 0; }
.work-title { gap: 8px; }
.ai-save-output-form { gap: 16px; margin-top: 24px; }
.ai-input-card, .ai-draft-card { gap: 24px; }
.ai-draft-card pre { max-width: 100%; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.75; }
.empty-state-guided { min-height: 180px; padding: 28px 24px; }
.environment-label { margin-bottom: 16px; }
.environment-label small { font-size: .72rem; }
.sidebar footer { padding-top: 16px; }
.sidebar nav { gap: 12px; }
.sidebar-logout { min-height: 44px; }
.sidebar nav a[aria-current=page] { color: var(--ink); background: var(--sand); }

@media (max-width: 1100px) {
  .filter-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-bar .search-field { grid-column: 1 / -1; }
  .filter-bar .button { justify-self: start; }
  .two-column, .costing-calculator { grid-template-columns: minmax(0, 1fr); }
  .page-heading { flex-wrap: wrap; }
}

@media (max-width: 760px) {
  .content-page, .content-page.activity-page { padding: 24px 18px 88px; }
  .hero { padding: 104px 18px 88px; }
  .page-context-bar { padding-inline: 18px; }
  .page-heading { gap: 16px; margin-bottom: 24px; }
  .page-heading > .button-row { width: 100%; display: flex; flex-direction: row; }
  .page-heading .button { width: auto; }
  .page-heading h1 { font-size: 1.75rem; }
  .form-card { gap: 24px; padding: 20px 16px; }
  .record-card { padding: 18px; }
  .form-grid { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .button, .button.compact, .step-applicability-form .button { min-height: 44px; padding: 10px 14px; }
  .form-actions, .step-actions, .project-report-actions,
  .finance-list-actions, .ai-save-output-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    align-items: start;
  }
  .form-actions > .button, .step-actions > .button,
  .project-report-actions > .button, .finance-list-actions .button,
  .ai-save-output-form > .button { width: 100%; min-width: 0; flex: none; }
  .button-row:not(.project-report-actions):not(.form-actions) { flex-direction: row; flex-wrap: wrap; }
  .button-row:not(.project-report-actions):not(.form-actions) > .button { width: auto; flex: 0 1 auto; }
  .button-row > .helper-text, .button-row > .save-progress { flex-basis: 100%; }
  .filter-bar { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .filter-bar .button { width: auto; }
  .batch-actions { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .list-search-row { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
  .list-search-row .button { width: auto; }
  .list-filter-card { padding: 16px; }
  .payment-row { padding: 16px; }
  .payment-row > .button { justify-self: start; }
  .payment-row .payment-summary h2 { margin: 0; }
  .panel-summary { padding: 20px 18px; }
  .panel-body { padding: 0 18px 20px; }
  .workflow-step .step-content { padding: 0 16px 20px; }
  .workflow-step-summary { padding-right: 44px; gap: 10px; }
  .workflow-step-summary .step-summary-copy { padding-block: 12px; }
  .workflow-step-summary .step-summary-status { justify-self: start; }
  .step-applicability-form { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .step-applicability-form > span { flex-basis: 100%; }
  .control-actions .button { flex: none; }
  .gmail-insight { padding: 18px; }
  .gmail-task-confirm { gap: 16px; }
  .gmail-task-confirm .button { min-width: 0; }
  .table-wrap.is-wide table { min-width: 540px; }
  .sidebar { max-height: 100dvh; }
  .sidebar nav { flex: 1 1 auto; min-height: 0; }
  .sidebar footer { flex: 0 0 auto; padding-bottom: env(safe-area-inset-bottom); }
}

@media (max-width: 380px) {
  .content-page, .content-page.activity-page { padding-inline: 14px; }
  .form-card { padding-inline: 14px; }
  .record-card { padding-inline: 16px; }
  .page-heading > .button-row { gap: 10px; }
  .page-heading .button { padding-inline: 12px; }
  .list-search-row { grid-template-columns: minmax(0, 1fr); }
  .list-search-row .button { justify-self: start; }
}