/* Sequel Onboarding Manager — Bootstrap 5 theme adapted from the Corporate Setup Workbook */
:root {
  --wb-bg: #f5f6fa;
  --wb-border: #dfe2e8;
  --wb-border-soft: #e8eaf0;
  --wb-text: #1f2024;
  --wb-dim: #5a5e68;
  --wb-faint: #878d99;
  --wb-accent: #976601;
  --wb-accent-soft: rgba(253, 178, 24, .16);
  --wb-accent-strong: rgba(253, 178, 24, .30);
  --wb-orange: #fdb218;
  --wb-blue: #1b61f7;
  --wb-blue-soft: rgba(27, 97, 247, .10);
  --wb-success: #15803d;
  --wb-success-soft: rgba(21, 128, 61, .12);
  --wb-wip: #b45309;
  --wb-wip-soft: rgba(217, 119, 6, .14);
  --wb-neutral: #6b707a;
  --wb-neutral-soft: rgba(138, 143, 153, .14);
  --wb-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 12px 32px -16px rgba(16, 24, 40, .14);
  --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --bs-body-color: var(--wb-text);
  --bs-body-bg: var(--wb-bg);
  --bs-border-color: var(--wb-border);
  --bs-primary: var(--wb-blue);
  --bs-primary-rgb: 27, 97, 247;
  --bs-link-color: var(--wb-blue);
  --bs-link-color-rgb: 27, 97, 247;
  --bs-border-radius: 10px;
  --bs-border-radius-lg: 16px;
}
body {
  font-size: 15px;
  background:
    radial-gradient(1100px 460px at 12% -8%, rgba(253, 178, 24, .08), transparent 60%),
    radial-gradient(900px 500px at 100% 0%, rgba(27, 97, 247, .05), transparent 55%),
    var(--wb-bg);
  min-height: 100vh;
}
.mono { font-family: 'JetBrains Mono', 'SF Mono', ui-monospace, monospace; }
.eyebrow {
  font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 11.5px; letter-spacing: .11em;
  text-transform: uppercase; color: var(--wb-label, #4771a7); font-weight: 600;
}
:root { --wb-label: #4771a7; } /* section labels (eyebrows) */
.eyebrow.blue { color: var(--wb-blue); }

/* ---------- Top bar ---------- */
.app-topbar { background: rgba(245, 246, 250, .88); backdrop-filter: blur(10px) saturate(140%); border-bottom: 1px solid var(--wb-border-soft); }
.app-topbar .nav-link { font-weight: 500; color: var(--wb-dim); border-radius: 8px; }
.app-topbar .nav-link.active, .app-topbar .nav-link:hover { color: var(--wb-text); background: rgba(16, 24, 40, .05); }
.brand-mark { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: #4771a7; color: #fff; font-size: 15px; }
.brand-div { width: 1px; height: 20px; background: var(--wb-border); display: inline-block; }
.brand-sub { font-size: 13px; color: var(--wb-dim); font-weight: 500; }

/* ---------- Buttons ---------- */
/* Primary action buttons (New project, Copy for email, Add, Present…): Sequel blue, same as the section labels */
.btn-accent { --bs-btn-color: #fff; --bs-btn-bg: #4771a7; --bs-btn-border-color: #4771a7;
  --bs-btn-hover-bg: #3d6496; --bs-btn-hover-border-color: #3d6496; --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: #345885; --bs-btn-active-border-color: #345885; --bs-btn-active-color: #fff;
  --bs-btn-disabled-bg: #4771a7; --bs-btn-disabled-border-color: #4771a7; --bs-btn-disabled-color: #fff;
  --bs-btn-focus-shadow-rgb: 71, 113, 167; font-weight: 600; }
.nav-pills { --bs-nav-pills-link-active-bg: var(--wb-text); }
.nav-pills .nav-link { color: var(--wb-dim); font-weight: 500; }

/* ---------- Cards / hero ---------- */
.card { border-color: var(--wb-border); box-shadow: var(--wb-shadow); }
.hero { border-radius: 16px; }
.doc-title { font-size: 1.9rem; font-weight: 800; letter-spacing: -.02em; }
.corp-name { font-size: 2.1rem; font-weight: 800; letter-spacing: -.02em; }
.doc-title-sub { font-size: 1.15rem; font-weight: 600; color: var(--wb-dim); }
.project-notes { background: var(--wb-accent-soft); border: 1px solid var(--wb-accent-strong); border-radius: 10px; padding: 10px 14px; font-size: 14px; }
.meta-list > div { margin-bottom: 2px; }
.stat-label { font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--wb-faint); }
.stat-value { font-size: 1.9rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; }
.stat-value.ok { color: var(--wb-success); }
.stat-value.wip { color: var(--wb-wip); }
.stat-row .col { min-width: 110px; }

.nav-card { color: var(--wb-text); transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease; border-radius: 14px; }
.nav-card:hover { transform: translateY(-2px); border-color: var(--wb-accent-strong); color: var(--wb-text); }
.nav-card.source-card { background: linear-gradient(180deg, #fff, #fbfaf6); border-style: dashed; }
.card-num { font-size: 11px; color: var(--wb-faint); letter-spacing: .04em; }
.card-count { font-size: 12px; color: var(--wb-dim); }
.progress { height: 6px; background: #eceef3; border-radius: 99px; }
.progress-bar { background: var(--wb-orange); border-radius: 99px; transition: width .3s ease; }
.progress-bar.bg-success { background: var(--wb-success) !important; }

/* ---------- Tabs ---------- */
.tabs-bar {
  display: flex; gap: 6px; overflow-x: auto; padding: 6px; margin-bottom: 14px;
  background: #fff; border: 1px solid var(--wb-border); border-radius: 12px; box-shadow: var(--wb-shadow);
  position: sticky; top: 64px; z-index: 20; scrollbar-width: thin;
}
.tab-btn {
  flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px; white-space: nowrap;
  border: 1px solid transparent; background: none; color: var(--wb-dim); font-size: 13.5px; font-weight: 500;
  padding: 7px 12px; border-radius: 8px;
}
.tab-btn:hover { background: #f3f4f8; color: var(--wb-text); }
.tab-btn.active { background: var(--wb-accent-soft); border-color: var(--wb-accent-strong); color: var(--wb-text); font-weight: 600; }
.tab-num { font-size: 11px; color: var(--wb-faint); }
.tab-dot { width: 7px; height: 7px; border-radius: 50%; background: #d4d7de; }
.tab-dot.partial { background: var(--wb-orange); }
.tab-dot.complete { background: var(--wb-success); }

/* ---------- Sections ---------- */
section.scenario { display: none; border-radius: 16px; overflow: visible; }
section.scenario.active { display: block; }
.scenario-head { background: #fff; border-bottom: 1px solid var(--wb-border-soft); border-radius: 16px 16px 0 0 !important; padding: 16px 20px; }
.scenario-num { font-size: 13px; font-weight: 700; color: var(--wb-accent); background: var(--wb-accent-soft); border-radius: 6px; padding: 2px 7px; }
.scenario-progress .progress { width: 140px; }
.section-intro { color: var(--wb-dim); font-size: 14.5px; max-width: 900px; }

.wb-row {
  display: grid; grid-template-columns: 34px minmax(0, 1.15fr) 132px 118px 78px 72px minmax(0, 1fr);
  gap: 12px; align-items: start; padding: 10px 6px; border-bottom: 1px solid var(--wb-border-soft);
}
.wb-row:hover:not(.wb-head) { background: #fafbfd; }
.wb-head { font-family: 'JetBrains Mono', monospace; font-size: 10.5px; letter-spacing: .09em; text-transform: uppercase; color: var(--wb-faint); padding-bottom: 6px; border-bottom: 1px solid var(--wb-border); }
.group-head { display: flex; align-items: center; gap: 8px; margin: 18px 0 4px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--wb-blue); }
.group-dot { width: 6px; height: 6px; border-radius: 2px; background: var(--wb-blue); }
.row-idx { font-size: 12px; color: var(--wb-faint); padding-top: 7px; }
.row-main { display: flex; flex-direction: column; gap: 4px; padding-top: 5px; }
.row-action { font-weight: 600; font-size: 14.5px; }
.row-sub { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.row-hint { font-size: 12px; color: var(--wb-faint); font-style: italic; }
.path-chip {
  font-family: 'JetBrains Mono', monospace; font-size: 10.5px; color: var(--wb-blue); background: var(--wb-blue-soft);
  border: 1px solid rgba(27, 97, 247, .18); border-radius: 6px; padding: 2px 7px; font-style: italic; overflow-wrap: anywhere;
}
.path-chip.tmc { color: var(--wb-accent); background: var(--wb-accent-soft); border-color: var(--wb-accent-strong); }
.cell-setup, .cell-zd { display: flex; justify-content: center; }
.cell-zd { gap: 4px; padding-top: 3px; }
.zd-btn { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; border: 1px solid var(--wb-border); background: #fff; }
.zd-btn:hover { border-color: var(--wb-accent-strong); background: var(--wb-accent-soft); }
.zd-btn img { width: 16px; height: 16px; }

.pill-select { border-radius: 99px; font-weight: 600; font-size: 13px; min-width: 120px; color: var(--wb-dim); }
.pill-select.is-done { color: var(--wb-success); background-color: var(--wb-success-soft); border-color: rgba(21, 128, 61, .35); }
.pill-select.is-wip  { color: var(--wb-wip); background-color: var(--wb-wip-soft); border-color: rgba(217, 119, 6, .35); }
.pill-select.is-na   { color: var(--wb-neutral); background-color: var(--wb-neutral-soft); border-color: rgba(138, 143, 153, .35); }
.notes-input { resize: vertical; min-height: 34px; height: 34px; font-size: 13.5px; line-height: 1.4; }
.section-foot { display: flex; justify-content: space-between; margin-top: 18px; }

@media (max-width: 991.98px) {
  .wb-row { grid-template-columns: 30px minmax(0, 1fr) auto auto; grid-template-areas: "idx main main zd" ". setup discuss ref" ". notes notes notes"; }
  .wb-row .cell-ref { grid-area: ref; justify-content: flex-start; padding-top: 8px; }
  .wb-row .cell-ref::after { content: "Reference"; font-size: 12px; color: var(--wb-dim); margin-left: 6px; }
  .wb-row .cell-discuss { grid-area: discuss; justify-content: flex-start; padding-top: 8px; }
  .wb-row .row-idx { grid-area: idx; } .wb-row .row-main { grid-area: main; }
  .wb-row .cell-zd { grid-area: zd; } .wb-row .cell-setup { grid-area: setup; justify-content: flex-start; }
  .wb-row .cell-notes { grid-area: notes; }
  .tabs-bar { top: 58px; }
  .scenario-progress .progress { width: 90px; }
}

/* ---------- Save indicator ---------- */
.save-indicator {
  position: fixed; right: 18px; bottom: 18px; z-index: 1080; padding: 8px 14px; border-radius: 99px;
  background: #1f2024; color: #fff; font-size: 13px; font-weight: 500; box-shadow: var(--wb-shadow);
  opacity: 0; transform: translateY(8px); transition: opacity .2s, transform .2s; pointer-events: none;
}
.save-indicator.show { opacity: 1; transform: none; }
.save-indicator.error { background: #d1343c; opacity: 1; transform: none; }
.spin { display: inline-block; animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- Misc ---------- */
.activity .list-group-item { padding: 8px 16px; }
.auth-page main { min-height: 80vh; display: flex; align-items: center; }
.auth-card { width: 100%; max-width: 420px; border-radius: 16px; }
.app-footer { display: flex; gap: 12px; align-items: center; padding: 24px 12px 40px; color: var(--wb-faint); font-size: 13px; }

/* ---------- Print: every section, no chrome ---------- */
@media print {
  body { background: #fff; font-size: 12px; }
  .app-topbar, .app-footer, .tabs-bar { display: none !important; }
  section.scenario { display: block !important; break-inside: auto; box-shadow: none; }
  .card { box-shadow: none; }
  .wb-row { break-inside: avoid; grid-template-columns: 28px minmax(0, 1fr) 90px 100px 70px 0 minmax(0, 1fr); }
  .cell-zd { display: none; }
  .pill-select { appearance: none; background-image: none; }
  .notes-input { border: none; height: auto !important; }
}

/* ---------- Discuss flag ---------- */
:root { --wb-flag: #c2410c; --wb-flag-soft: rgba(234, 88, 12, .10); --wb-flag-border: rgba(234, 88, 12, .40); }
.stat-value.flag { color: var(--wb-flag); }
.cell-discuss { display: flex; justify-content: center; padding-top: 6px; }
.discuss-check { width: 20px; height: 20px; margin: 0; cursor: pointer; border-color: #b9bdc6; }
.discuss-check:checked { background-color: var(--wb-flag); border-color: var(--wb-flag); }
.discuss-check:focus { border-color: var(--wb-flag); box-shadow: 0 0 0 .2rem rgba(234, 88, 12, .2); }
.wb-row.is-flagged { background: linear-gradient(90deg, var(--wb-flag-soft), transparent 40%); box-shadow: inset 3px 0 0 var(--wb-flag); }
.tab-flag { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; color: var(--wb-flag); background: var(--wb-flag-soft); border-radius: 99px; padding: 1px 7px; }
.tabs-spacer { flex: 1 0 8px; }
.tab-discuss { color: var(--wb-flag); border-color: var(--wb-flag-border); }
.tab-discuss .badge { background: var(--wb-flag); color: #fff; }
.tab-discuss:hover { background: var(--wb-flag-soft); color: var(--wb-flag); }
.tab-discuss.active { background: var(--wb-flag); color: #fff; border-color: var(--wb-flag); }
.tab-discuss.active .badge { background: #fff; color: var(--wb-flag); }
.discuss-banner { display: flex; align-items: center; gap: 12px; padding: 12px 16px; margin-bottom: 14px; border-radius: 12px;
  background: var(--wb-flag-soft); border: 1px solid var(--wb-flag-border); font-size: 14px; }
.discuss-banner > .bi { color: var(--wb-flag); font-size: 18px; }
/* discussion view: every section visible, only flagged rows */
.discuss-mode section.scenario { display: block; }
.discuss-mode section.scenario.no-flags { display: none !important; }
.discuss-mode .wb-row:not(.wb-head):not(.keep) { display: none; }
.discuss-mode .group-head.no-flags, .discuss-mode .section-intro, .discuss-mode .section-foot { display: none; }
.wb-head > span { white-space: nowrap; }

/* ---------- UAT checklist ---------- */
.stat-value.fail { color: #d03b3b; }
.stat-of { font-size: 1rem; font-weight: 600; color: var(--wb-faint); margin-left: 2px; }
.badge-added { display: inline-block; font: 600 10px 'JetBrains Mono', monospace; letter-spacing: .06em; text-transform: uppercase; color: var(--wb-blue); background: var(--wb-blue-soft); border: 1px solid rgba(27,97,247,.25); border-radius: 5px; padding: 1px 5px; vertical-align: middle; }
.nav-card.is-out { opacity: .5; }
.fail-chip { margin-top: 6px; font-size: 12px; color: #b42318; }
.tab-btn.is-out { opacity: .45; text-decoration: line-through; }
.tab-dot.failed { background: #d03b3b; }
.tab-issues { color: #b42318; border-color: rgba(208,59,59,.4); }
.tab-issues .badge { background: #d03b3b; color: #fff; }
.tab-issues:hover { background: rgba(208,59,59,.08); color: #b42318; }
.tab-issues.active { background: #d03b3b; color: #fff; border-color: #d03b3b; }
.tab-issues.active .badge { background: #fff; color: #d03b3b; }
.issue-num { background: rgba(208,59,59,.1); color: #d03b3b; }
.progress-bar.bg-danger { background: #d03b3b !important; }

.uat-callout { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; padding: 10px 14px; border-radius: 10px; background: var(--wb-blue-soft); border: 1px solid rgba(27,97,247,.2); margin-bottom: 10px; }
.uat-callout > .bi { color: var(--wb-blue); font-size: 16px; margin-top: 1px; }
.uat-callout.warn { background: var(--wb-accent-soft); border-color: var(--wb-accent-strong); }
.uat-callout.warn > .bi { color: var(--wb-accent); }

.run-fields { display: grid; grid-template-columns: 150px 1fr 1fr 1fr 1.3fr 190px; gap: 10px; padding: 12px 14px; margin: 8px 0 14px; background: #f7f8fb; border: 1px solid var(--wb-border-soft); border-radius: 12px; }
.run-fields .form-label { font: 600 10.5px 'JetBrains Mono', monospace; letter-spacing: .08em; text-transform: uppercase; color: var(--wb-faint); margin-bottom: 3px; }
.cols-1 .run-fields { grid-template-columns: 150px 1fr 1fr 1fr 1.3fr; }

.uat-row { display: grid; gap: 12px; align-items: start; padding: 9px 6px; }
.cols-2 .uat-row { grid-template-columns: 34px minmax(0, 1.3fr) 140px 140px 62px minmax(0, 1fr); }
.cols-1 .uat-row { grid-template-columns: 34px minmax(0, 1.3fr) 150px 62px minmax(0, 1fr); }
.uat-head { font: 600 10.5px 'JetBrains Mono', monospace; letter-spacing: .09em; text-transform: uppercase; color: var(--wb-faint); border-bottom: 1px solid var(--wb-border); padding-bottom: 6px; }
.uat-head > span { white-space: nowrap; }
.uat-step { border-bottom: 1px solid var(--wb-border-soft); transition: background .3s; }
.uat-step:hover { background: #fafbfd; }
.uat-step.state-failed { background: linear-gradient(90deg, rgba(208,59,59,.07), transparent 45%); box-shadow: inset 3px 0 0 #d03b3b; }
.uat-step.state-passed .row-action { color: var(--wb-dim); }
.uat-step.flash { background: rgba(253,178,24,.25); }
.cell-res { display: flex; justify-content: center; }
.res-select { min-width: 0; width: 100%; }
.res-select.r-success, .res-select.r-ready, .res-select.r-yes { color: var(--wb-success); background-color: var(--wb-success-soft); border-color: rgba(21,128,61,.35); }
.res-select.r-failed, .res-select.r-notready, .res-select.r-no { color: #b42318; background-color: rgba(208,59,59,.10); border-color: rgba(208,59,59,.4); }
.res-select.r-na { color: var(--wb-neutral); background-color: var(--wb-neutral-soft); border-color: rgba(138,143,153,.35); }
.res-label { font: 600 10px 'JetBrains Mono', monospace; text-transform: uppercase; color: var(--wb-faint); margin-right: 6px; align-self: center; white-space: nowrap; }

.uat-issue { display: grid; grid-template-columns: 34px 90px 150px 1fr 170px; gap: 10px; align-items: center; padding: 0 6px 10px; }
.uat-issue::before { content: ""; }
.issue-tag { font-size: 12px; font-weight: 700; color: #b42318; white-space: nowrap; }

/* channel filter hides the column not being tested */
.ch-a .col-o, .ch-o .col-a { visibility: hidden; }
/* out of scope */
.out-note { display: none; font-size: 14px; color: var(--wb-dim); background: #f3f4f8; border-radius: 10px; padding: 10px 14px; margin-bottom: 12px; }
.out-of-scope .out-note { display: block; }
.out-of-scope .uat-step, .out-of-scope .run-fields, .out-of-scope .group-head, .out-of-scope .uat-callout { opacity: .4; pointer-events: none; }

/* issue log */
.issue-table td, .issue-table th { font-size: 14px; }
.iss-res { font-size: 12.5px; white-space: nowrap; } .iss-res.bad { color: #b42318; font-weight: 600; }
.sev { font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 99px; border: 1px solid; white-space: nowrap; }
.sev-critical { color: #fff; background: #d03b3b; border-color: #d03b3b; }
.sev-high { color: #b42318; background: rgba(208,59,59,.1); border-color: rgba(208,59,59,.4); }
.sev-medium { color: #8a5300; background: rgba(250,178,25,.16); border-color: rgba(250,178,25,.5); }
.sev-low { color: var(--wb-dim); background: #f3f4f8; border-color: var(--wb-border); }

@media (max-width: 991.98px) {
  .run-fields, .cols-1 .run-fields { grid-template-columns: 1fr 1fr; }
  .cols-2 .uat-row, .cols-1 .uat-row { grid-template-columns: 30px 1fr 1fr auto; grid-template-areas: "idx main main main" ". a o disc" ". notes notes notes"; }
  .cols-1 .uat-row { grid-template-areas: "idx main main main" ". a a disc" ". notes notes notes"; }
  .uat-row .cell-discuss { grid-area: disc; padding-top: 6px; }
  .uat-row .row-idx { grid-area: idx; } .uat-row .row-main { grid-area: main; }
  .uat-row .cell-res.col-a { grid-area: a; } .uat-row .cell-res.col-o { grid-area: o; }
  .uat-row .cell-notes { grid-area: notes; }
  .uat-issue { grid-template-columns: 1fr 1fr; } .uat-issue::before { display: none; }
  .ch-a .col-o, .ch-o .col-a { display: none; }
}
@media print {
  .uat section.scenario.out-of-scope { display: none !important; }
  .uat #issues { break-before: page; }
  .run-fields { grid-template-columns: repeat(5, 1fr); }
}

/* What's remaining view */
.tab-remaining { color: var(--wb-blue); border-color: rgba(27,97,247,.35); }
.tab-remaining .badge { background: var(--wb-blue); color: #fff; }
.tab-remaining:hover { background: var(--wb-blue-soft); color: var(--wb-blue); }
.tab-remaining.active { background: var(--wb-blue); color: #fff; border-color: var(--wb-blue); }
.tab-remaining.active .badge { background: #fff; color: var(--wb-blue); }
.view-remaining .discuss-banner { background: var(--wb-blue-soft); border-color: rgba(27,97,247,.3); }
.view-remaining .discuss-banner > .bi { color: var(--wb-blue); }
.discuss-mode .tab-btn:not(.tab-discuss):not(.tab-remaining) { opacity: .45; }

/* UAT: blocked, flags, filtered views */
.stat-value.blocked { color: #7c3aed; }
.res-select.r-blocked { color: #6d28d9; background-color: rgba(124,58,237,.10); border-color: rgba(124,58,237,.4); }
.uat-step.state-blocked { background: linear-gradient(90deg, rgba(124,58,237,.07), transparent 45%); box-shadow: inset 3px 0 0 #7c3aed; }
.uat-step.is-flagged:not(.state-failed):not(.state-blocked) { background: linear-gradient(90deg, var(--wb-flag-soft), transparent 40%); box-shadow: inset 3px 0 0 var(--wb-flag); }
.tab-dot.blocked { background: #7c3aed; }
.iss-res.blk { color: #6d28d9; font-weight: 600; }
.uat .cell-discuss { padding-top: 7px; }
body.uat.discuss-mode section.scenario { display: block; }
body.uat.discuss-mode section.scenario.no-flags, body.uat.discuss-mode section.scenario.out-of-scope, body.uat.discuss-mode #issues { display: none !important; }
body.uat.discuss-mode .uat-step:not(.keep) { display: none; }
body.uat.discuss-mode .run-fields, body.uat.discuss-mode .uat-callout, body.uat.discuss-mode .out-note { display: none; }

/* ---------- Scoping requirements ---------- */
.sq-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) minmax(0, 1.15fr); gap: 14px; align-items: start; padding: 12px 6px; }
.sq-head { font: 600 10.5px 'JetBrains Mono', monospace; letter-spacing: .09em; text-transform: uppercase; color: var(--wb-faint); border-bottom: 1px solid var(--wb-border); padding-bottom: 6px; }
.sq-q { border-bottom: 1px solid var(--wb-border-soft); }
.sq-q.is-answered { box-shadow: inset 3px 0 0 var(--wb-success); }
.sq-q .row-idx { padding-top: 3px; }
.sq-text { font-weight: 600; font-size: 14.5px; line-height: 1.4; }
.sq-help { font-size: 12.5px; color: var(--wb-faint); font-style: italic; margin-top: 3px; }
.sq-refs { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 6px; }
.sq-refs-label { font: 600 10px 'JetBrains Mono', monospace; text-transform: uppercase; letter-spacing: .06em; color: var(--wb-faint); margin-right: 2px; }
.sq-ref { font: 600 11px 'JetBrains Mono', monospace; color: var(--wb-blue); background: var(--wb-blue-soft); border: 1px solid rgba(27,97,247,.18); border-radius: 6px; padding: 1px 6px; text-decoration: none; }
.sq-ref:hover { background: rgba(27,97,247,.18); color: var(--wb-blue); }
.sq-input { min-height: 58px; font-size: 14px; line-height: 1.45; resize: vertical; }
body.scoping.discuss-mode section.scenario { display: block; }
body.scoping.discuss-mode section.scenario.no-flags { display: none !important; }
body.scoping.discuss-mode .sq-q:not(.keep) { display: none; }
@media (max-width: 991.98px) {
  .sq-row { grid-template-columns: 30px 1fr; }
  .sq-answer { grid-column: 2; }
}
@media print {
  .scoping section.scenario { display: block !important; }
  .sq-input { border: none; height: auto !important; padding: 0; }
}

/* ---------- Implementation dates ---------- */
.date-card { border: 1px solid var(--wb-border); border-radius: 12px; background: #fff; height: 100%; }
.date-card-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--wb-border-soft); border-radius: 12px 12px 0 0; }
.party-corporate .date-card-head { background: var(--wb-blue-soft); } .party-corporate .date-card-head .bi-building { color: var(--wb-blue); }
.party-tmc .date-card-head { background: var(--wb-accent-soft); } .party-tmc .date-card-head .bi-briefcase { color: var(--wb-accent); }
.date-list { padding: 6px 10px 10px; }
.date-row { display: grid; grid-template-columns: minmax(0, 220px) 160px minmax(0, 1fr) 32px; gap: 8px; align-items: center; padding: 6px 4px; border-bottom: 1px solid var(--wb-border-soft); }
.date-row:last-child { border-bottom: 0; }
.date-label { font-size: 14px; display: flex; flex-direction: column; line-height: 1.25; }
.date-hint { font-size: 11.5px; color: var(--wb-faint); font-style: italic; }
.date-remove { padding: 2px 6px; }
@media (max-width: 575.98px) { .date-row { grid-template-columns: 1fr 1fr; } .date-label { grid-column: 1 / -1; } }

/* Key dates panel on the project page */
.kd-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.kd-col-title { font: 600 11px 'JetBrains Mono', monospace; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 6px; }
.kd-corporate .kd-col-title { color: var(--wb-blue); } .kd-tmc .kd-col-title { color: var(--wb-accent); }
.kd-item { display: grid; grid-template-columns: 110px 1fr auto; gap: 10px; align-items: baseline; padding: 5px 8px; border-radius: 8px; font-size: 14px; }
.kd-item .kd-date { font: 600 12.5px 'JetBrains Mono', monospace; color: var(--wb-dim); }
.kd-item .kd-rel { font-size: 12px; color: var(--wb-faint); white-space: nowrap; }
.kd-item.is-past { opacity: .55; }
.kd-item.is-next { background: var(--wb-accent-soft); }
.kd-item.is-next .kd-rel { color: var(--wb-accent); font-weight: 700; }
.kd-note { display: block; font-size: 12px; color: var(--wb-faint); }
.kd-empty { font-size: 13px; color: var(--wb-faint); padding: 4px 8px; }
@media (max-width: 767.98px) { .kd-grid { grid-template-columns: 1fr; } }

/* ---------- Tasks ---------- */
.qa-grid { display: grid; grid-template-columns: minmax(0, 1fr) 220px 170px 160px auto; gap: 8px; }
.tasks-page .quick-add { border-color: rgba(71, 113, 167, .35); }
.task-group { border-radius: 14px; overflow: hidden; }
.task-group.is-inbox { border-color: var(--wb-flag-border); }
.task-group.is-inbox .task-group-head { background: var(--wb-flag-soft); }
.task-group-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 16px; background: #fafbfd; border-bottom: 1px solid var(--wb-border-soft); }
.task-row { display: grid; grid-template-columns: 22px minmax(0, 1fr) 190px 140px 136px 118px 104px; gap: 10px; align-items: start; padding: 10px 16px; border-bottom: 1px solid var(--wb-border-soft); transition: background .4s; }
.task-row:last-child { border-bottom: 0; }
.task-row .task-done { width: 18px; height: 18px; margin-top: 7px; cursor: pointer; }
.task-row .task-done:checked { background-color: var(--wb-success); border-color: var(--wb-success); }
.task-title { border-color: transparent; background: transparent; font-weight: 600; font-size: 14.5px; padding-left: 4px; }
.task-title:hover { border-color: var(--wb-border); }
.task-title:focus { background: #fff; }
.task-meta { font-size: 12px; color: var(--wb-faint); padding-left: 5px; margin-top: 1px; }
.task-details { margin-top: 6px; font-size: 13.5px; }
.task-row.is-closed .task-title { text-decoration: line-through; color: var(--wb-faint); }
.task-row.is-closed { background: #fafbfc; }
.task-row.is-overdue .task-due { color: #b42318; border-color: rgba(208,59,59,.45); background: rgba(208,59,59,.06); font-weight: 600; }
.task-row.flash { background: rgba(253,178,24,.22); }
.task-status.st-inprogress { color: var(--wb-wip); border-color: rgba(217,119,6,.4); background-color: var(--wb-wip-soft); }
.task-status.st-waiting { color: #6d28d9; border-color: rgba(124,58,237,.35); background-color: rgba(124,58,237,.08); }
.task-status.st-done { color: var(--wb-success); border-color: rgba(21,128,61,.35); background-color: var(--wb-success-soft); }
.task-status.st-dropped { color: var(--wb-neutral); background-color: var(--wb-neutral-soft); }
@media (max-width: 991.98px) {
  .qa-grid { grid-template-columns: 1fr 1fr; } .qa-grid > :first-child { grid-column: 1 / -1; }
  .task-row { grid-template-columns: 22px 1fr 1fr; } .task-row .task-main { grid-column: 2 / -1; }
  .task-row > select, .task-row > .task-due { grid-column: auto; }
  .task-row .task-project { grid-column: 2 / -1; }
}

/* ---------- Dependencies ---------- */
.dep-add-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) 24px minmax(0, 1fr) 160px 160px 110px; gap: 10px; align-items: end; }
.dep-arrow { text-align: center; color: var(--wb-faint); font-size: 18px; padding-bottom: 6px; }
.dep-group { border-radius: 14px; overflow: hidden; }
.dep-group-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 16px; background: #fafbfd; border-bottom: 1px solid var(--wb-border-soft); font-size: 15px; }
.dep-group.is-golive { border-color: var(--wb-flag-border); }
.dep-group.is-golive .dep-group-head { background: var(--wb-flag-soft); }
.dep-before { font: 600 11px 'JetBrains Mono', monospace; letter-spacing: .08em; text-transform: uppercase; color: var(--wb-faint); margin-right: 4px; }
.dep-row { display: grid; grid-template-columns: 22px minmax(0, 1fr) 160px 150px 130px; gap: 10px; align-items: start; padding: 10px 16px; border-bottom: 1px solid var(--wb-border-soft); transition: background .4s; }
.dep-row:last-child { border-bottom: 0; }
.dep-row .dep-done { width: 18px; height: 18px; margin-top: 7px; cursor: pointer; }
.dep-row .dep-done:checked { background-color: var(--wb-success); border-color: var(--wb-success); }
.dep-pred { border-color: transparent; background: transparent; font-weight: 600; font-size: 14.5px; padding-left: 4px; }
.dep-pred:hover { border-color: var(--wb-border); } .dep-pred:focus { background: #fff; }
.dep-meta { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--wb-faint); padding-left: 5px; margin-top: 2px; flex-wrap: wrap; }
.dep-then { white-space: nowrap; }
.dep-succ { width: auto; min-width: 140px; max-width: 280px; font-size: 12px; padding: 1px 6px; height: auto; border-color: transparent; background: var(--wb-blue-soft); color: var(--wb-blue); font-weight: 600; }
.dep-succ:hover, .dep-succ:focus { border-color: rgba(27,97,247,.35); background: #fff; }
.dep-notes { margin-top: 6px; font-size: 13.5px; }
.dep-row.is-closed .dep-pred { text-decoration: line-through; color: var(--wb-faint); }
.dep-row.is-closed { background: #fafbfc; }
.dep-row.is-blocked { box-shadow: inset 3px 0 0 #7c3aed; }
.dep-row.is-overdue .dep-due { color: #b42318; border-color: rgba(208,59,59,.45); background: rgba(208,59,59,.06); font-weight: 600; }
.dep-row.flash { background: rgba(253,178,24,.22); }
.dep-status.st-inprogress { color: var(--wb-wip); border-color: rgba(217,119,6,.4); background-color: var(--wb-wip-soft); }
.dep-status.st-blocked { color: #6d28d9; border-color: rgba(124,58,237,.35); background-color: rgba(124,58,237,.08); }
.dep-status.st-done { color: var(--wb-success); border-color: rgba(21,128,61,.35); background-color: var(--wb-success-soft); }
.dep-status.st-notneeded { color: var(--wb-neutral); background-color: var(--wb-neutral-soft); }
@media (max-width: 991.98px) {
  .dep-add-grid { grid-template-columns: 1fr 1fr; } .dep-add-grid > :nth-child(-n+3) { grid-column: 1 / -1; } .dep-arrow { display: none; }
  .dep-row { grid-template-columns: 22px 1fr 1fr; } .dep-row .dep-main { grid-column: 2 / -1; }
}

/* Project page menu: Presentation | project cycle 1-5 | utilities */
.project-menu { padding-top: 14px; border-top: 1px solid var(--wb-border-soft); }
.pm-step { display: inline-grid; place-items: center; width: 17px; height: 17px; border-radius: 50%; background: var(--wb-blue-soft); color: var(--wb-blue); font: 700 10.5px 'JetBrains Mono', monospace; margin-right: 6px; vertical-align: 1px; }
.pm-div { width: 1px; height: 22px; background: var(--wb-border); margin: 0 2px; }

/* Current project, pinned in the top bar on every project page */
.ctx-project { display: inline-flex; align-items: center; gap: 7px; max-width: 300px; margin: 0 12px 0 0; padding: 5px 12px; border-radius: 99px;
  background: #4771a7; color: #fff; text-decoration: none; font-size: 13.5px; font-weight: 700; box-shadow: 0 1px 2px rgba(16,24,40,.12); }
.ctx-project:hover { color: #fff; background: #3d6496; }
.ctx-project .ctx-label { font: 600 10px 'JetBrains Mono', monospace; letter-spacing: .08em; text-transform: uppercase; opacity: .8; }
.ctx-project .ctx-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 767.98px) { .ctx-project { max-width: 55vw; margin: 0 6px; } .ctx-project .ctx-label { display: none; } }
@media print { .ctx-project { display: none; } }
.app-topbar .nav-link { white-space: nowrap; }
/* The page is at most 1320px wide, so with the project chip showing, drop the subtitle and the New project label */
.app-topbar.has-ctx .brand-sub, .app-topbar.has-ctx .brand-div, .app-topbar.has-ctx .np-label { display: none; }
@media (max-width: 1399.98px) { .app-topbar.has-ctx .ctx-label { display: none; } }

/* ---------- Go-live checklist ---------- */
.golive .gl-hint { display: block; font-size: 12px; color: var(--wb-dim); margin-top: 2px; }
.golive .gl-live { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; padding: 2px 8px 2px 3px; border-radius: 999px; font-size: 12px; font-weight: 500; text-decoration: none; border: 1px solid; max-width: 100%; }
.golive .gl-live:hover { filter: brightness(.97); }
.golive .gl-live-tag { font: 600 9.5px 'JetBrains Mono', monospace; letter-spacing: .06em; text-transform: uppercase; padding: 1px 5px; border-radius: 999px; background: #fff; border: 1px solid currentColor; }
.golive .gl-live-text { white-space: normal; }
.golive .gl-live.tone-ok { color: #15803d; background: rgba(21,128,61,.08); border-color: rgba(21,128,61,.3); }
.golive .gl-live.tone-warn { color: #8a5a00; background: rgba(253,178,24,.14); border-color: rgba(200,140,0,.35); }
.golive .gl-live.tone-bad { color: #b42318; background: rgba(208,59,59,.08); border-color: rgba(208,59,59,.35); }
.golive .gl-live.tone-muted { color: #6b707a; background: #f5f6fa; border-color: #dfe2e8; }
.golive .uat-step.state-passed .gl-live { opacity: .75; }
.golive .owner-select { font-size: 13px; }
@media (max-width: 575.98px) {
  .discuss-banner { flex-wrap: wrap; }
  .discuss-banner > div { flex: 1 1 calc(100% - 40px); }
  .discuss-banner > .btn { margin-left: 0 !important; }
}

/* ---------- Help · Questions & Tool Tips ---------- */
.help-filter-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.help-search-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--wb-dim); pointer-events: none; }
#h-q { padding-left: 34px; }
.help-group { overflow: hidden; }
.help-group-head { display: flex; align-items: center; gap: 8px; padding: 10px 16px; background: #f7f8fb; border-bottom: 1px solid var(--wb-border-soft); }
.help-group-name { font-weight: 700; }
.help-group-n { font-size: 11px; color: var(--wb-dim); background: #fff; border: 1px solid var(--wb-border-soft); border-radius: 999px; padding: 0 7px; }
.help-entry { display: flex; gap: 16px; align-items: flex-start; padding: 14px 16px; border-bottom: 1px solid var(--wb-border-soft); transition: background .3s; }
.help-entry:last-child { border-bottom: 0; }
.help-entry:hover { background: #fafbfd; }
.help-entry.flash { background: rgba(253,178,24,.22); }
.help-entry-main { flex: 1 1 auto; min-width: 0; }
.help-q-line { display: flex; gap: 8px; align-items: baseline; }
.help-q { font-weight: 600; white-space: pre-line; }
.help-type { flex: 0 0 auto; font: 600 10px 'JetBrains Mono', monospace; letter-spacing: .05em; text-transform: uppercase; color: var(--wb-blue); background: var(--wb-blue-soft); border: 1px solid rgba(27,97,247,.2); border-radius: 5px; padding: 1px 6px; position: relative; top: -1px; }
.help-tip { display: flex; gap: 6px; margin-top: 6px; font-size: 14px; color: #3d4048; }
.help-tip > i { color: var(--wb-blue); margin-top: 2px; }
.help-tip.is-empty { color: var(--wb-dim); font-style: italic; font-size: 13px; }
.help-tip.is-empty > i { color: var(--wb-dim); }
.help-opts { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.help-opt { font-size: 12px; background: #f1f2f6; border: 1px solid var(--wb-border-soft); border-radius: 6px; padding: 1px 8px; }
.help-meta { font-size: 11.5px; color: var(--wb-dim); margin-top: 8px; }
.help-actions { flex: 0 0 auto; display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; max-width: 330px; }
.help-actions .btn { white-space: nowrap; }
.help-actions .btn.copied { color: var(--wb-success); border-color: rgba(21,128,61,.4) !important; }
.help-page mark { background: rgba(253,178,24,.4); padding: 0 1px; border-radius: 2px; }
.help-preview { border: 1px dashed var(--wb-border); border-radius: 10px; padding: 12px 14px; background: #fbfbfd; }
.help-pv-label { font-weight: 600; font-size: 14px; margin-bottom: 6px; }
.help-pv-opts { font-size: 12px; color: var(--wb-dim); margin-top: 4px; }
.help-pv-choice { display: inline-flex; align-items: center; gap: 6px; margin-right: 14px; font-size: 14px; }
.help-pv-tip { position: relative; color: var(--wb-blue); cursor: help; outline: none; }
.help-pv-bubble { display: none; position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%); width: max-content; max-width: 280px; background: #1f2024; color: #fff; font-weight: 400; font-size: 12.5px; line-height: 1.4; padding: 8px 10px; border-radius: 8px; z-index: 5; box-shadow: 0 6px 20px rgba(0,0,0,.18); }
.help-pv-tip:hover .help-pv-bubble, .help-pv-tip:focus .help-pv-bubble { display: block; }
@media (max-width: 991.98px) {
  .help-filter-grid { grid-template-columns: 1fr 1fr; }
  .help-filter-grid > :first-child { grid-column: 1 / -1; }
  .help-entry { flex-direction: column; gap: 10px; }
  .help-actions { justify-content: flex-start; max-width: none; }
}

/* ---------- Reference mark (workbook) ---------- */
.cell-ref { display: flex; justify-content: center; padding-top: 6px; }
.ref-check { width: 20px; height: 20px; margin: 0; cursor: pointer; border-color: #b9bdc6; }
.ref-check:checked { background-color: var(--wb-blue); border-color: var(--wb-blue); }
.ref-check:focus { border-color: var(--wb-blue); box-shadow: 0 0 0 .2rem rgba(27, 97, 247, .2); }

/* ---------- Reports ---------- */
.rep-icon.rep-reference { color: var(--wb-blue); font-size: .8em; }
.rep-icon.rep-discuss { color: var(--wb-flag); font-size: .8em; }
.rep-filters .btn-group .btn { white-space: nowrap; }
.rep-group { overflow: hidden; }
.rep-group-head { display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: #f7f8fb; border-bottom: 1px solid var(--wb-border-soft); }
.rep-group-title { font-weight: 700; font-size: 15.5px; }
.rep-group-title a { color: inherit; text-decoration: none; }
.rep-group-title a:hover { color: var(--wb-blue); }
.rep-num { font-size: 12px; font-weight: 700; color: var(--wb-accent); background: var(--wb-accent-soft); border-radius: 6px; padding: 2px 7px; }
.rep-count { font-size: 11px; color: var(--wb-dim); background: #fff; border: 1px solid var(--wb-border-soft); border-radius: 999px; padding: 0 8px; }
.rep-table td, .rep-table th { padding: 10px 14px; }
.rep-table thead th { font: 600 10.5px 'JetBrains Mono', monospace; letter-spacing: .08em; text-transform: uppercase; color: var(--wb-faint); }
.rep-action { color: var(--wb-ink, #1f2024); text-decoration: none; }
.rep-action:hover { color: var(--wb-blue); text-decoration: underline; }
.rep-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.rep-tag { font-size: 12px; margin-left: 6px; }
.rep-tag.flag { color: var(--wb-flag); } .rep-tag.ref { color: var(--wb-blue); }
.rep-status { display: inline-block; font-size: 12.5px; font-weight: 600; border-radius: 999px; padding: 2px 10px; border: 1px solid var(--wb-border); color: var(--wb-dim); }
.rep-status.is-done { color: var(--wb-success); background: var(--wb-success-soft); border-color: rgba(21,128,61,.35); }
.rep-status.is-wip { color: var(--wb-wip); background: var(--wb-wip-soft); border-color: rgba(217,119,6,.35); }
.rep-status.is-na { color: var(--wb-neutral); background: var(--wb-neutral-soft); border-color: rgba(138,143,153,.35); }
.rep-note { white-space: normal; }
@media (max-width: 1199.98px) {
}
@media (max-width: 575.98px) {
}
@media print { .reports-page .rep-group { break-inside: avoid; } }
/* Header: keep every menu item on one line on smaller laptops */
@media (min-width: 992px) and (max-width: 1199.98px) { .app-topbar .navbar-nav .nav-link > .bi { display: none; } .app-topbar .navbar-nav .nav-link { padding-left: .45rem; padding-right: .45rem; } }

/* ---------- Discuss with (workbook) ---------- */
.cell-discuss.dropdown { padding-top: 2px; }
.disc-btn { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; min-width: 84px; max-width: 118px; min-height: 31px; padding: 4px 10px;
  border: 1px solid #c9cdd6; border-radius: 10px; background: #fff; color: var(--wb-dim); font-size: 12.5px; font-weight: 600; line-height: 1.2; cursor: pointer; }
.disc-btn:hover { border-color: var(--wb-flag-border); color: var(--wb-flag); }
.disc-btn.is-on { background: var(--wb-flag); border-color: var(--wb-flag); color: #fff; }
.disc-btn.is-on:hover { filter: brightness(.95); color: #fff; }
.disc-btn .disc-name { display: block; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.disc-btn .disc-name b { font-weight: 700; opacity: .85; }
.disc-btn:focus-visible { outline: 0; box-shadow: 0 0 0 .2rem rgba(234, 88, 12, .25); }
.disc-menu { min-width: 190px; padding: 6px; border-radius: 12px; box-shadow: 0 10px 30px rgba(20, 24, 40, .14); }
.disc-menu-title { font: 600 10.5px 'JetBrains Mono', monospace; letter-spacing: .08em; text-transform: uppercase; color: var(--wb-faint); padding: 4px 8px 6px; }
.disc-opt { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 8px; font-size: 14px; cursor: pointer; margin: 0; }
.disc-opt:hover { background: var(--wb-flag-soft); }
.disc-opt .form-check-input { margin: 0; width: 17px; height: 17px; }
.disc-opt .form-check-input:checked { background-color: var(--wb-flag); border-color: var(--wb-flag); }
.disc-clear { display: block; width: 100%; text-align: left; margin-top: 4px; padding: 6px 8px; border: 0; border-top: 1px solid var(--wb-border-soft); background: none; font-size: 13px; color: var(--wb-dim); border-radius: 0 0 8px 8px; }
.disc-clear:hover { color: #b42318; background: rgba(208, 59, 59, .06); }
.dv-with { width: auto; min-width: 170px; }
.discuss-banner .dv-with:not(.d-none) + #discuss-copy { margin-left: 0 !important; }
@media print { .disc-btn { border: 0; padding: 0; background: none !important; color: var(--wb-flag) !important; min-width: 0; } .disc-btn:not(.is-on) { visibility: hidden; } }
.rep-with { display: inline-flex; align-items: center; gap: 4px; margin-left: 8px; font-size: 12px; font-weight: 600; color: var(--wb-flag); background: var(--wb-flag-soft); border-radius: 999px; padding: 1px 8px; vertical-align: middle; }
@media (max-width: 575.98px) {
  .wb-row { grid-template-areas: "idx main main zd" ". setup setup setup" ". discuss ref ref" ". notes notes notes"; }
}

/* ---------- Tasks: discuss with + notes link ---------- */
.task-row .cell-discuss.dropdown { padding-top: 0; justify-content: flex-start; }
.task-row .disc-btn { min-width: 0; width: 100%; }
.task-row.is-flagged { box-shadow: inset 3px 0 0 var(--wb-flag); }
.task-toggle-details { text-decoration: none; font-weight: 600; }
.task-toggle-details:hover { text-decoration: underline; }
.task-toggle-details.has-notes { color: var(--wb-flag); }

/* ---------- Reports: tabs, filters, dependencies ---------- */
.rep-tabs { display: flex; flex-wrap: wrap; gap: 4px; padding: 8px 10px 0; border-bottom: 1px solid var(--wb-border-soft); background: #fafbfd; border-radius: 14px 14px 0 0; }
.rep-tab { display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px; margin-bottom: -1px; border: 1px solid transparent; border-radius: 10px 10px 0 0; font-weight: 600; font-size: 14px; color: var(--wb-dim); cursor: pointer; }
.rep-tab:hover { color: #1f2024; background: #fff; }
.btn-check:checked + .rep-tab { background: #fff; color: #1f2024; border-color: var(--wb-border-soft); border-bottom-color: #fff; }
.btn-check:checked + .rep-tab-remaining .bi { color: var(--wb-blue); }
.btn-check:checked + .rep-tab-deps .bi { color: #6d28d9; }
.btn-check:checked + .rep-tab-discuss .bi { color: var(--wb-flag); }
.btn-check:checked + .rep-tab-reference .bi { color: var(--wb-blue); }
.rep-filter-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; align-items: end; }
.rep-filter-grid .rep-f-impl { min-width: 0; }
.rep-filter-grid.is-deps { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr) 290px minmax(0, 1.1fr); }
.rep-deps td.small { white-space: nowrap; }
@media (max-width: 1199.98px) { .rep-filter-grid.is-deps { grid-template-columns: 1fr 1fr; } }
@media (max-width: 575.98px) { .rep-filter-grid.is-deps { grid-template-columns: 1fr; } }
.rep-icon.rep-remaining { color: var(--wb-blue); font-size: .8em; }
.rep-icon.rep-deps { color: #6d28d9; font-size: .8em; }
.rep-progress { align-items: center; gap: 8px; }
.rep-progress .progress { width: 110px; height: 6px; }
.rep-succ { font-size: 13px; color: var(--wb-dim); margin-top: 2px; }
.rep-golive { display: inline-block; font-size: 11px; font-weight: 600; color: var(--wb-flag); background: var(--wb-flag-soft); border-radius: 999px; padding: 0 7px; margin-left: 4px; }
.rep-overdue, .rep-table td.rep-overdue { color: #b42318 !important; font-weight: 600; }
.rep-overdue div { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.rep-status.is-blocked { color: #6d28d9; background: rgba(124,58,237,.08); border-color: rgba(124,58,237,.35); }
.rep-deps tr.is-closed td { opacity: .6; }
@media (max-width: 575.98px) { .rep-tab { padding: 7px 10px; font-size: 13px; } }

/* ---------- Issues ---------- */
/* Two lines per issue: severity · issue · status · discuss, then project / assigned to / owner / target under the issue */
.task-row.issue-row { grid-template-columns: 100px minmax(0, 1fr) 124px 104px; grid-template-areas: "sev main status disc" ". fields fields fields"; row-gap: 8px; }
.issue-row .issue-sev { grid-area: sev; }
.issue-row .task-main { grid-area: main; }
.issue-row .task-status { grid-area: status; }
.issue-row .cell-discuss { grid-area: disc; }
.issue-fields { grid-area: fields; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.issue-field { display: flex; flex-direction: column; gap: 2px; margin: 0; min-width: 0; }
.issue-field > span { font: 600 10px 'JetBrains Mono', monospace; letter-spacing: .07em; text-transform: uppercase; color: var(--wb-faint); padding-left: 2px; }
.issue-sev { font-weight: 700; border-radius: 99px; }
.issue-sev.sev-critical { color: #fff; background-color: #b42318; border-color: #b42318; }
.issue-sev.sev-high { color: #c2410c; background-color: rgba(234,88,12,.10); border-color: rgba(234,88,12,.45); }
.issue-sev.sev-medium { color: #b45309; background-color: var(--wb-wip-soft); border-color: rgba(217,119,6,.35); }
.issue-sev.sev-low { color: var(--wb-neutral); background-color: var(--wb-neutral-soft); }
.issue-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.issue-ref-wrap { display: inline-flex; align-items: center; gap: 4px; }
.issue-ref { border: 1px solid transparent; border-radius: 6px; background: transparent; font-size: 12px; padding: 0 5px; width: 130px; color: #1f2024; }
.issue-ref:hover { border-color: var(--wb-border); }
.issue-ref:focus { outline: 0; border-color: var(--wb-blue); background: #fff; }
.issue-ref::placeholder { color: var(--wb-faint); }
.task-status.st-investigating { color: var(--wb-wip); border-color: rgba(217,119,6,.4); background-color: var(--wb-wip-soft); }
.task-status.st-resolved { color: var(--wb-success); border-color: rgba(21,128,61,.35); background-color: var(--wb-success-soft); }
.task-status.st-closed { color: var(--wb-neutral); background-color: var(--wb-neutral-soft); }
.issue-qa { grid-template-columns: minmax(0, 1fr) 210px 130px 170px auto; }
.issue-qa.is-project { grid-template-columns: minmax(0, 1fr) 140px 190px auto; }
@media (max-width: 991.98px) {
  .issue-qa, .issue-qa.is-project { grid-template-columns: 1fr 1fr; } .issue-qa > :first-child { grid-column: 1 / -1; }
  .task-row.issue-row { grid-template-columns: 100px minmax(0, 1fr) 124px; grid-template-areas: "sev main main" "fields fields fields" ". status disc"; }
  .issue-row .task-main { grid-column: main; grid-row: main; }
  .issue-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .task-row.issue-row { grid-template-columns: 1fr 1fr; grid-template-areas: "sev disc" "main main" "fields fields" "status status"; }
}
/* Header: with 8 menu items, drop the subtitle and the "New project" label on laptop widths */
@media (min-width: 992px) and (max-width: 1399.98px) { .app-topbar .brand-sub, .app-topbar .brand-div, .app-topbar .np-label { display: none; } }

/* ---------- Reports: tasks & issues ---------- */
.rep-icon.rep-tasks { color: var(--wb-success); font-size: .8em; }
.rep-icon.rep-issues { color: #b42318; font-size: .8em; }
.btn-check:checked + .rep-tab-tasks .bi { color: var(--wb-success); }
.btn-check:checked + .rep-tab-issues .bi { color: #b42318; }
.rep-list tr.is-closed td { opacity: .6; }
.rep-list .rep-note { margin-top: 3px; }
.rep-sev { display: inline-block; font-size: 12.5px; font-weight: 700; border-radius: 999px; padding: 2px 10px; border: 1px solid; }
.rep-sev.sev-critical { color: #fff; background: #b42318; border-color: #b42318; }
.rep-sev.sev-high { color: #c2410c; background: rgba(234,88,12,.10); border-color: rgba(234,88,12,.45); }
.rep-sev.sev-medium { color: #b45309; background: var(--wb-wip-soft); border-color: rgba(217,119,6,.35); }
.rep-sev.sev-low { color: var(--wb-neutral); background: var(--wb-neutral-soft); border-color: rgba(138,143,153,.35); }
.rep-filter-grid.is-list { grid-template-columns: minmax(0, 1.2fr) 150px 150px 170px 210px minmax(0, 1fr); }
.rep-filter-grid.is-list.is-issues { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1199.98px) { .rep-filter-grid.is-list, .rep-filter-grid.is-list.is-issues { grid-template-columns: 1fr 1fr; } }
@media (max-width: 575.98px) { .rep-filter-grid.is-list, .rep-filter-grid.is-list.is-issues { grid-template-columns: 1fr; } }