/* B: soft whitespace. Presentation only; never hide permission/state controls. */
:root {
  --background: #f5f5f7;
  --surface: #fff;
  --text: #202124;
  --muted: #62656d;
  --border: #e5e7ec;
  --primary: #202124;
  --primary-hover: #38393d;
  --primary-soft: #eeeff2;
  --link: #285fa5;
  --success: #19764c;
  --success-soft: #eff8f2;
  --danger: #b82f39;
  --danger-soft: #fff0f1;
  --warning: #875912;
  --warning-soft: #fff7e8;
  --info: #2465b5;
  --info-soft: #edf4ff;
  --radius: 18px;
}

body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif; line-height: 1.65; }
a { color: var(--link); text-underline-offset: 3px; }
a:hover { text-decoration: underline; }
:where(a, button, summary, input, select, textarea):focus-visible { outline: 2px solid var(--info); outline-offset: 4px; }
:where(h1, h2, h3, p, dd, li) { overflow-wrap: anywhere; }
:where(.page-heading, .title-row, .action-row, .form-actions, .field-label-row) { flex-wrap: wrap; }
:where(.page-heading, .title-row, .action-row, .form-actions) > * { min-width: 0; }
img { max-width: 100%; }
[hidden] { display: none !important; }

.topbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px 28px; max-width: 1600px; margin: 0 auto; padding: 26px 40px 18px; background: transparent; border: 0; }
.brand-group { gap: 20px; flex-wrap: wrap; min-width: 0; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 650; }
.brand:hover { text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 31px; height: 31px; flex: 0 0 auto; border-radius: 10px; background: var(--text); color: #fff; font-size: 11px; letter-spacing: -.4px; }
.help-link { color: var(--muted); font-size: 13px; font-weight: 500; }
.help-link[aria-current] { color: var(--text); font-weight: 650; }
.topnav { flex-wrap: wrap; gap: 16px; font-size: 13px; }
.topnav a { color: var(--muted); }
.topnav a[aria-current] { color: var(--text); font-weight: 650; }
.account { max-width: 220px; overflow-wrap: anywhere; }
.admin-module-nav { grid-column: 1 / -1; justify-self: center; display: flex; align-items: center; gap: 5px; padding: 5px; border-radius: 999px; background: var(--surface); }
.admin-module-nav a { padding: 9px 25px; color: var(--muted); border-radius: 999px; text-decoration: none; line-height: 1.5; }
.admin-module-nav a:hover { background: var(--background); color: var(--text); }
.admin-module-nav a[aria-current] { background: var(--text); color: #fff; }
.page-shell { width: min(1280px, calc(100% - 80px)); margin: 26px auto 72px; }
.page-shell-wide { width: min(1520px, calc(100% - 80px)); }
.page-heading { margin-bottom: 28px; gap: 18px; }
.page-heading h1 { font-size: 32px; font-weight: 650; letter-spacing: -.7px; line-height: 1.35; }
.page-heading p { margin-top: 7px; }
.title-row { gap: 12px; }
.back-link { display: inline-block; margin-bottom: 6px; }
.preproduction-banner { margin-bottom: 24px; padding: 10px 16px; border: 1px dashed #cdd0d7; border-radius: 10px; color: var(--muted); font-size: 12px; line-height: 1.8; }

.button { min-height: 42px; max-width: 100%; padding: 9px 18px; border-radius: 999px; font-weight: 550; white-space: normal; text-align: center; line-height: 1.5; }
.button:hover { text-decoration: none; }
.button-secondary { background: #f4f4f6; border-color: transparent; }
.button-secondary:hover { background: #e9eaee; }
.button-danger { border-color: #edcdd0; background: #fff; }
.button-danger:hover { background: var(--danger-soft); }
.button-quiet { min-height: 32px; padding: 5px 10px; }
.button-compact { min-height: 34px; padding: 6px 13px; }
.button-feishu { border-radius: 12px; }
input, select, textarea { min-width: 0; border-color: #cdd0d7; border-radius: 10px; min-height: 44px; padding: 10px 12px; }
input:focus, select:focus, textarea:focus { border-color: var(--info); outline-color: #acc7ec; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--primary); }
textarea { line-height: 1.75; }
.form-stack { gap: 22px; }
.form-panel, .login-panel { padding: 30px; border: 0; }
.login-panel { margin-top: 48px; box-shadow: 0 10px 40px #24273006; }
.login-panel h1 { font-size: 27px; font-weight: 650; }
.form-pair, .form-grid, .inline-form, .review-form, .feedback-review-form { min-width: 0; }
.advanced-settings, .choice-card, .source-upload-optional { border-radius: 12px; }
.segmented-control { border-radius: 12px; }
.segmented-control span { border-radius: 9px; }
.segmented-control input:focus-visible + span { outline: 2px solid var(--info); outline-offset: 2px; }

.table-wrap { border: 1px solid var(--border); border-radius: 18px; max-width: 100%; scrollbar-gutter: stable; }
th { background: #fcfcfd; font-weight: 550; font-size: 12px; }
th, td { padding: 18px 20px; }
td { overflow-wrap: anywhere; }
.project-link { font-weight: 650; }
.table-actions { gap: 16px; }
.table-actions a, .table-actions .button-link { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; padding: 5px 0; }
.table-actions > a:first-child { padding: 7px 15px; border-radius: 999px; background: #f4f4f6; color: var(--text); }
.table-actions .danger-link { color: var(--danger); }
.admin-project-table { min-width: 1100px; }
.admin-project-table th:nth-child(1), .admin-project-table td:nth-child(1) { min-width: 180px; max-width: 300px; }
.admin-project-table th:nth-child(4), .admin-project-table td:nth-child(4) { min-width: 285px; }
.admin-project-table th:nth-child(6), .admin-project-table td:nth-child(6) { width: 174px; min-width: 174px; }
.admin-project-table td { padding-top: 24px; padding-bottom: 24px; }
.admin-project-table .table-actions { gap: 8px 18px; flex-wrap: wrap; }
.admin-project-number { padding: 2px 6px; border: 0; background: #f0f1f4; color: var(--muted); }
.project-cleanup-hint { white-space: normal; max-width: 320px; }
.project-row-attention { background: #fffdf8; }
.project-row-attention td:first-child { box-shadow: inset 3px 0 0 #c6953d; }
.latest-update-detail, .project-status-meta { line-height: 1.65; }
.failure-code-line { overflow-wrap: anywhere; }
.status { min-height: 27px; max-width: 100%; padding: 4px 9px; font-weight: 550; line-height: 1.5; text-align: center; white-space: normal; }
.status-processing, .status-provisioning, .status-deploying, .status-restarting, .status-waking, .status-sending { background: var(--info-soft); color: var(--info); }
.status-running, .status-success, .status-ready, .status-resolved, .status-sent { color: var(--success); }
.attempt-result { padding: 2px 7px; font-weight: 550; }

.notice { padding: 17px 20px; border-radius: 12px; line-height: 1.8; }
.notice-success { border-color: #d4e8dc; }
.notice-warning { border-color: #efdfbd; }
.notice-error { border-color: #eed0d4; color: var(--danger); }
.notice pre { overflow-wrap: anywhere; }
.next-action-card, .preflight-card, .release-progress-card { padding: 26px; background: var(--surface); border-color: var(--border); }
.next-action-card { align-items: start; }
.next-action-number { width: 44px; height: 44px; font-size: 18px; }
.next-action-success .next-action-number { background: var(--success); }
.next-action-active .next-action-number { background: var(--info); }
.next-action-warning .next-action-number { color: var(--warning); background: var(--warning-soft); }
.next-action-danger .next-action-number { background: var(--danger); }
.next-action-eyebrow { color: var(--muted); font-weight: 550; letter-spacing: 0; }
.next-action-content h2 { font-weight: 650; line-height: 1.5; }
.next-action-copy-status { flex-wrap: wrap; border-color: #d4e8dc; border-radius: 10px; }
.next-action-danger { border-color: #edd6d9; }
.next-action-warning { border-color: #efdfbd; }
.release-progress-card { --release-progress-color: var(--info); }
.release-progress-card.progress-completed { --release-progress-color: var(--success); }
.release-progress-card.progress-failed { --release-progress-color: var(--danger); }
.release-progress-card.progress-waiting_admin { --release-progress-color: var(--warning); }
.release-progress-track { height: 6px; margin: 20px 0; }
.release-progress-steps { gap: 12px; }
.release-progress-steps li { font-size: 12px; line-height: 1.5; }
.release-progress-steps li.is-complete > span { background: var(--success); border-color: var(--success); }
.release-overview-card { padding: 24px; border-left-width: 3px; background: var(--surface); }
.release-overview-failed { border-left-color: var(--danger); }
.release-overview-warning { border-left-color: #c6953d; }
.release-overview-success { border-left-color: var(--success); }
.release-overview-heading { flex-wrap: wrap; }
.release-overview-heading h2 { font-weight: 650; }
.detail-grid { border: 1px solid var(--border); border-radius: var(--radius); padding: 8px 20px; }
.detail-grid dl > div { padding: 14px 0; }
.section-block { margin-top: 32px; }
.access-address-row { padding: 24px; }
.access-addresses .primary-address { font-size: 15px; }
.secondary-project-details, .codex-rebind-panel { padding: 18px 22px; }
.codex-task-meta, .codex-task-link-field textarea, .release-history-muted .release-history-card { background: #f8f8fa; }
.codex-task-panel-inline { box-shadow: none; border-color: #d4e8dc; }
.failure-metrics { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
.failure-log { border-radius: 12px; background: #f7f7f9; }
.filter-bar { gap: 16px; }
.filter-bar label { max-width: 100%; }
.operations-tabs { flex-wrap: wrap; overflow: visible; gap: 8px; margin-bottom: 24px; }
.operations-tabs a { padding: 8px 17px; border-color: transparent; font-weight: 550; }
.operations-tabs a.active { color: #fff; background: var(--text); }
.operations-tabs a:hover:not(.active) { background: #e9eaee; border-color: transparent; color: var(--text); }
.operations-kpis article, .operations-chart-card, .attention-empty, .operations-report-form { background: var(--surface); }
.operations-chart-card { padding: 22px; }
.operations-kpis article, .attention-kpis article { padding: 23px; }
.operations-line-chart { color: var(--info); }
.operations-line-chart-danger { color: var(--danger); }
.operations-line-chart-warning { color: var(--warning); }
.attention-card, .manage-card, .feedback-item, .notice-composer, .notice-preview { padding: 26px; }
.attention-card-heading, .attention-list li, .notice-form-heading { overflow-wrap: anywhere; }
.operations-detail-panel { border-radius: var(--radius); }
.operations-filter-actions { flex-wrap: wrap; }
.operations-ranking li > *, .attention-list li > * { min-width: 0; }
.operations-healthy-state { border-color: #d4e8dc; }

/* Preserve all six help sections and every approved sentence. */
.page-heading .help-intro { display: block; padding: 0; border: 0; background: none; color: var(--text); font-size: 17px; font-weight: 400; line-height: 1.9; }
.page-heading .help-agent-definition { font-size: 14px; line-height: 1.85; }
.help-note { margin: 0 0 28px; padding: 18px 22px; border: 0; border-radius: 12px; color: var(--warning); background: var(--warning-soft); }
.help-note strong { font-weight: 550; }
.help-steps { display: block; padding: 0 30px; border-radius: 20px; background: var(--surface); }
.help-step { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 36px; align-items: start; padding: 36px 0; border-top: 1px solid var(--border); }
.help-step:first-child { border: 0; }
.help-step:first-child > div { grid-column: 1 / -1; }
.help-step h2 { margin-bottom: 17px; font-size: 19px; font-weight: 650; line-height: 1.6; }
.help-step ol { padding-left: 24px; font-size: 15px; line-height: 1.95; }
.help-step li { margin-bottom: 8px; }
.help-step p { margin-top: 18px; color: var(--muted); font-size: 14px; line-height: 1.9; }
.help-step img { display: block; width: 100%; height: auto; border-radius: 12px; }
.help-image-stack { gap: 16px; }
.help-image-preview { display: block; width: 100%; min-width: 0; padding: 0; border: 0; border-radius: 12px; background: transparent; cursor: zoom-in; }
.help-image-preview:focus-visible { outline: 3px solid var(--info); outline-offset: 4px; }
.help-image-dialog { width: min(1400px, calc(100vw - 32px)); max-width: none; max-height: calc(100dvh - 32px); padding: 0; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); color: var(--text); }
.help-image-dialog::backdrop { background: rgb(0 0 0 / 65%); }
.help-image-dialog[open] { display: flex; flex-direction: column; }
.help-image-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--border); }
.help-image-toolbar strong { flex: 1 1 150px; min-width: 0; overflow-wrap: anywhere; }
.help-image-toolbar .button { flex: 0 0 auto; }
.help-image-viewport { min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 12px; }
.help-image-viewport img { display: block; width: 100%; max-width: none; height: auto; margin: 0 auto; }
.help-image-viewport.is-original img { width: var(--help-original-width); margin: 0; }
body.help-image-open { overflow: hidden; }
@media print { .help-image-dialog { display: none !important; } }

@media (max-width: 1080px) {
  .topbar { padding: 24px 28px 16px; }
  .page-shell, .page-shell-wide { width: calc(100% - 48px); }
  .brand-group { gap: 12px; }
  .topnav { gap: 12px; }
  .help-step { gap: 26px; }
  .notice-compose-layout { grid-template-columns: 1fr; }
  .notice-preview { position: static; }
}
@media (max-width: 800px) {
  /* Keep all tool actions visible without horizontal panning on small screens. */
  .project-dashboard { overflow: visible; scrollbar-gutter: auto; }
  .project-dashboard table, .project-dashboard tbody { display: block; width: 100%; min-width: 0; }
  .project-dashboard thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .project-dashboard tbody tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; padding: 24px; border-bottom: 1px solid var(--border); }
  .project-dashboard tbody tr:last-child { border-bottom: 0; }
  .project-dashboard td, .project-dashboard .admin-project-table td:nth-child(n) { display: block; min-width: 0; max-width: none; width: auto; padding: 0; border: 0; white-space: normal; }
  .project-dashboard td::before { content: attr(data-label); display: block; margin-bottom: 6px; color: var(--muted); font-size: 12px; }
  .project-dashboard td:first-child, .project-dashboard td:last-child, .project-dashboard td.latest-update-cell, .project-dashboard .admin-project-table td:nth-child(5) { grid-column: 1 / -1; }
  .project-dashboard td:first-child { font-size: 16px; }
  .project-dashboard td:first-child::before, .project-dashboard td:last-child::before { display: none; }
  .project-dashboard .table-actions { flex-wrap: wrap; gap: 12px 24px; }
  .project-dashboard .table-actions > a:first-child { padding: 8px 18px; }
  .project-dashboard .project-row-attention { border-left: 3px solid #c6953d; }
  .project-dashboard .project-row-attention td:first-child { box-shadow: none; }
  .topbar { grid-template-columns: 1fr; gap: 16px; padding: 22px 22px 12px; }
  .topnav { overflow: visible; width: 100%; flex-wrap: wrap; }
  .account { display: inline; padding-left: 0; border: 0; }
  .admin-module-nav { width: auto; max-width: 100%; grid-column: 1; }
  .admin-module-nav a { padding: 9px 22px; border: 0; }
  .page-shell, .page-shell-wide { width: calc(100% - 36px); margin-top: 22px; }
  .page-heading h1 { font-size: 28px; }
  .help-step { grid-template-columns: 1fr; gap: 24px; }
  .help-steps { padding: 0 24px; }
  .help-step { padding: 30px 0; }
  .help-step img { width: 100%; }
  .form-panel, .login-panel { padding: 24px; }
  .form-pair, .form-grid, .project-create-layout, .feedback-review-form { grid-template-columns: 1fr; }
  .release-progress-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .attention-card, .manage-card, .feedback-item, .notice-composer, .notice-preview { padding: 22px; }
}
@media (max-width: 480px) {
  .topbar { padding: 20px 18px 12px; }
  .brand-group { column-gap: 20px; row-gap: 12px; }
  .brand { flex-basis: 100%; font-size: 16px; }
  .topnav { gap: 12px; }
  .admin-module-nav { width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .admin-module-nav a { padding: 9px 5px; text-align: center; }
  .page-shell, .page-shell-wide { width: calc(100% - 28px); }
  .page-heading { gap: 16px; }
  .page-heading > .button { align-self: flex-start; }
  .title-row { gap: 10px; }
  .action-row { gap: 10px; }
  .form-actions { flex-wrap: wrap; gap: 12px; }
  .form-actions > * { flex: 1 1 auto; }
  .help-steps { padding: 0 18px; }
  .help-step { padding: 26px 0; }
  .help-step h2 { font-size: 18px; }
  .help-note { padding: 16px 18px; }
  .next-action-card, .preflight-card, .release-progress-card, .release-overview-card { padding: 20px; }
  .next-action-card { grid-template-columns: 1fr; }
  .access-address-row, .detail-grid { padding: 18px; }
  .detail-list div { grid-template-columns: 1fr; gap: 4px; }
  .attention-list li { grid-template-columns: 1fr; }
  .attention-list small { grid-column: 1; grid-row: auto; white-space: normal; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}
@media print {
  .topbar { display: none !important; }
  .page-shell, .page-shell-wide { width: 100%; margin: 0; }
  body { background: #fff; }
}
