/* ═══════════════════════════════════════════════════════════════════════════
   DESIGN SYSTEM  ·  Modern SaaS · indigo
   Loaded last — refines the base into a cohesive, commercial-grade UI.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Typography ─────────────────────────────────────────────────────────────── */
h1, h2, h3, h4 { color: var(--text); letter-spacing: -.014em; line-height: 1.2; font-weight: 700; }
h1 { font-weight: 800; letter-spacing: -.022em; }
.num, .data-table td, .pb-field span, .metric-value { font-variant-numeric: tabular-nums; }

/* selection + focus */
::selection { background: var(--accent-subtle); color: var(--accent-press); }
:focus-visible { outline: none; box-shadow: var(--ring); border-radius: 8px; }
a { color: var(--accent-text); text-decoration: none; }

/* custom scrollbars */
* { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }
*::-webkit-scrollbar { width: 11px; height: 11px; }
*::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 999px; border: 3px solid var(--bg); }
*::-webkit-scrollbar-thumb:hover { background: var(--text-subtle); }
*::-webkit-scrollbar-track { background: transparent; }

/* ── Header ─────────────────────────────────────────────────────────────────── */
.app-header {
    background: var(--surface);
    color: var(--text);
    height: 60px;
    padding: 0 1.25rem;
    border-bottom: 1px solid var(--border);
    box-shadow: none;
    backdrop-filter: saturate(180%) blur(6px);
}
.header-brand { font-size: 1.02rem; font-weight: 600; letter-spacing: -.01em; color: var(--text); gap: .6rem; white-space: nowrap; }   /* matches the website wordmark: Inter 600 */
.app-header { gap: 1rem; }
.header-actions { flex-wrap: nowrap; overflow: visible; }
.header-brand svg { opacity: 1; color: currentColor; width: 24px; height: 24px; }
.header-actions { gap: .4rem; }
.header-div { width: 1px; height: 22px; background: var(--border); margin: 0 .35rem; display: inline-block; }
.header-file { color: var(--text-muted); background: var(--surface-2); border: 1px solid var(--border); opacity: 1; font-weight: 500; }
.baseline-badge { background: var(--accent-subtle); color: var(--accent-text); border: 1px solid var(--accent-border); padding: .25rem .6rem; border-radius: 999px; font-size: .74rem; font-weight: 600; }
.user-chip { color: var(--text); gap: .45rem; }
.user-chip .uc-name { font-weight: 600; }
.user-chip .uc-role { font-size: .62rem; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; padding: .12rem .4rem; border-radius: 5px; background: var(--surface-3); color: var(--text-muted); }
.user-chip .uc-role.admin { background: var(--accent-subtle); color: var(--accent-text); }

/* ── Buttons (uniform, accessible) ──────────────────────────────────────────── */
.btn {
    height: 36px; padding: 0 14px; gap: .45rem;
    border-radius: var(--r-sm); border: 1px solid transparent;
    font-size: .83rem; font-weight: 600; letter-spacing: -.005em;
    line-height: 1; white-space: nowrap;
    transition: background .15s, border-color .15s, color .15s, box-shadow .15s, transform .05s;
}
.btn:hover { opacity: 1; }
.btn:active { transform: translateY(.5px); }
.btn svg { width: 15px; height: 15px; flex: 0 0 auto; }
.btn-sm { height: 31px; padding: 0 11px; font-size: .8rem; border-radius: var(--r-sm); }
.btn-icon { width: 36px; height: 36px; padding: 0; justify-content: center; }
.btn-sm.btn-icon { width: 31px; height: 31px; }

.btn-primary { background: var(--accent); color: var(--accent-fg); border-color: var(--accent); box-shadow: var(--shadow-sm); }
.btn-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.btn-primary:active { background: var(--accent-press); }

.btn-ghost { background: var(--surface); color: var(--text-muted); border: 1px solid var(--border); box-shadow: var(--shadow-sm); }
.btn-ghost:hover { background: var(--surface-2); color: var(--text); border-color: var(--border-strong); }

.btn-soft { background: var(--surface-2); color: var(--text); border: 1px solid var(--border); height: 36px; }
.btn-soft.btn-sm { height: 31px; }
.btn-danger { background: var(--red); color: #fff; border-color: var(--red); }

/* header buttons: clean ghost on the light surface */
.app-header .btn-ghost { background: transparent; color: var(--text-muted); border-color: transparent; box-shadow: none; }
.app-header .btn-ghost:hover { background: var(--surface-2); color: var(--text); border-color: var(--border); }
.app-header .btn-icon { color: var(--text-muted); }

/* ── Project bar ────────────────────────────────────────────────────────────── */
.project-bar {
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm); margin: 1rem 1.25rem 0; padding: 1rem 1.25rem; gap: 1.5rem;
}
.pb-name { color: var(--text); font-weight: 700; font-size: 1.05rem; letter-spacing: -.02em; }
.pb-p6name {
    background: var(--surface-2); border: 1px solid var(--border); border-radius: 999px;
    color: var(--text-muted); font-size: .72rem; font-weight: 600; padding: .14rem .6rem;
}
.pb-p6name.hidden { display: none; }
.pb-score-chip { width: 40px; height: 40px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: .95rem; box-shadow: var(--shadow-sm); }
.pb-meta { gap: 1.75rem; }
.pb-field label { font-size: .62rem; text-transform: uppercase; letter-spacing: .06em; color: var(--text-subtle); font-weight: 600; }
.pb-field span { color: var(--text); font-weight: 600; font-size: .9rem; }

/* P6 project ID chip + right-side Signal Score block — Gantt-mode only.
   Default (every other tab): the classic bar — dates + round score chip. */
.pb-id {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    background: var(--accent-subtle); border: 1px solid var(--accent-border); border-radius: 7px;
    color: var(--accent-text); font-size: .74rem; font-weight: 700; padding: .2rem .55rem;
    letter-spacing: .01em; white-space: nowrap;
}
.pb-id, .pb-signal { display: none; }              /* hidden outside Gantt mode */
.pb-id.hidden { display: none !important; }        /* no P6 ID in the file */
.project-bar.gantt-mode .pb-id { display: inline-flex; }
.project-bar.gantt-mode .pb-meta,
.project-bar.gantt-mode .pb-score-chip { display: none; }
.project-bar.gantt-mode .pb-signal {
    display: flex; align-items: center; gap: .8rem; margin-left: auto;
    padding: .3rem .4rem .3rem .9rem; border-radius: var(--r-md); cursor: pointer;
    border: 1px solid transparent; transition: border-color .15s, background .15s;
}
.project-bar.gantt-mode .pb-signal:hover,
.project-bar.gantt-mode .pb-signal:focus-visible { background: var(--surface-2); border-color: var(--border); outline: none; }
.pb-signal-text { display: flex; flex-direction: column; align-items: flex-end; gap: .1rem; }
.pb-signal-label { font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted); font-weight: 700; }
.pb-signal-sub { font-size: .74rem; color: var(--accent-text); font-weight: 600; white-space: nowrap; }
.pb-signal-chip {
    width: 40px; height: 40px; border-radius: 11px; display: inline-flex; align-items: center;
    justify-content: center; color: #fff; font-weight: 800; font-size: .95rem; box-shadow: var(--shadow-sm);
}

/* ═══════════════════════════════════════════════════════════════════════════
   APP SHELL — left navigation rail + content
   ═══════════════════════════════════════════════════════════════════════════ */
.app-shell { display: flex; align-items: stretch; min-height: calc(100vh - 60px); }
.side-nav {
    width: 208px; flex: 0 0 auto;
    position: sticky; top: 60px; height: calc(100vh - 60px); overflow-y: auto;
    background: var(--surface); border-right: 1px solid var(--border);
    padding: .9rem .55rem 1rem; display: flex; flex-direction: column; gap: 2px;
    transition: width .15s ease, padding .15s ease;
}
.side-nav-group { font-size: .62rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--text-subtle); padding: .8rem .6rem .35rem; }
.side-nav-group:first-child { padding-top: .1rem; }

/* rail header: the « minimize icon at the top-right (like IDE side panels) */
.side-nav-head { display: flex; justify-content: flex-end; padding: 0 .1rem .2rem; }
.side-nav-min {
    display: flex; align-items: center; justify-content: center;
    width: 26px; height: 26px; border: none; border-radius: var(--r-sm);
    background: transparent; color: var(--text-subtle); cursor: pointer;
    transition: background .12s, color .12s;
}
.side-nav-min:hover { background: var(--surface-2); color: var(--text); }
.side-nav-min svg { transition: transform .15s ease; }
.side-nav.collapsed .side-nav-head { justify-content: center; }
.side-nav.collapsed .side-nav-min svg { transform: rotate(180deg); }

/* action buttons (moved from the top ribbon) share the tab look but stay quiet */
.side-nav .nav-action {
    display: flex; align-items: center; gap: .6rem; width: 100%;
    background: transparent; border: none; border-radius: var(--r-sm);
    padding: .52rem .65rem; margin: 0; font-size: .85rem; font-weight: 600;
    color: var(--text-muted); cursor: pointer; text-align: left; white-space: nowrap;
    transition: background .12s, color .12s;
}
.side-nav .nav-action svg { flex: 0 0 auto; opacity: .8; }
.side-nav .nav-action:hover { background: var(--surface-2); color: var(--text); }
.side-nav .nav-action.hidden { display: none; }
.side-nav .main-tab {
    display: flex; align-items: center; gap: .6rem; width: 100%;
    background: transparent; border: none; border-radius: var(--r-sm);
    padding: .52rem .65rem; margin: 0; font-size: .85rem; font-weight: 600;
    color: var(--text-muted); cursor: pointer; text-align: left; white-space: nowrap;
    transition: background .12s, color .12s;
}
.side-nav .main-tab svg { flex: 0 0 auto; opacity: .8; }
.side-nav .main-tab:hover { background: var(--surface-2); color: var(--text); }
.side-nav .main-tab.active { background: var(--accent-subtle); color: var(--accent-text); }
.side-nav .main-tab.active svg { opacity: 1; }
.app-main { flex: 1; min-width: 0; }
.app-main .project-bar { margin: 1rem 1.25rem 0; }

/* minimize toggle pinned to the bottom of the rail */
.side-nav-toggle {
    margin-top: auto;
    display: flex; align-items: center; gap: .6rem; width: 100%;
    background: transparent; border: none; border-top: 1px solid var(--border);
    border-radius: 0; padding: .65rem .65rem .2rem; font-size: .78rem; font-weight: 600;
    color: var(--text-subtle); cursor: pointer; text-align: left; white-space: nowrap;
    transition: color .12s;
}
.side-nav-toggle:hover { color: var(--text); }
.side-nav-toggle svg { flex: 0 0 auto; transition: transform .15s ease; }

/* user-minimized rail: icons only, click again to expand */
.side-nav.collapsed { width: 56px; padding: .9rem .35rem 1rem; }
.side-nav.collapsed .nav-label, .side-nav.collapsed .side-nav-group { display: none; }
.side-nav.collapsed .main-tab, .side-nav.collapsed .nav-action { justify-content: center; padding: .55rem 0; }
.side-nav.collapsed .side-nav-toggle { justify-content: center; padding-left: 0; padding-right: 0; }
.side-nav.collapsed .side-nav-toggle svg { transform: rotate(180deg); }

/* collapse to icon rail on narrow screens */
@media (max-width: 900px) {
    .side-nav { width: 56px; padding: .9rem .35rem 1rem; }
    .side-nav .nav-label, .side-nav-group { display: none; }
    .side-nav .main-tab, .side-nav .nav-action { justify-content: center; padding: .55rem 0; }
    .side-nav .side-nav-toggle, .side-nav .side-nav-head { display: none; }   /* rail is already minimal */
}
@media print { .side-nav { display: none !important; } .app-shell { display: block; } }

/* ── Main tabs (underline) ──────────────────────────────────────────────────── */
.main-tabs {
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg);
    margin: .9rem 1.25rem; padding: .35rem; gap: .15rem; box-shadow: var(--shadow-sm);
    display: inline-flex; width: auto;
}
.main-tabs { margin-left: 1.25rem; margin-right: 1.25rem; }
.main-tab {
    border: none; background: transparent; color: var(--text-muted);
    padding: .5rem .9rem; border-radius: var(--r-sm); font-weight: 600; font-size: .85rem;
    display: inline-flex; align-items: center; gap: .45rem; cursor: pointer; transition: all .15s;
}
.main-tab svg { width: 16px; height: 16px; opacity: .85; }
.main-tab { white-space: nowrap; }
.main-tab:hover { background: var(--surface-2); color: var(--text); }
.main-tab.active { background: var(--accent-subtle); color: var(--accent-text); }
.main-tab.active svg { opacity: 1; }

/* ── Analytics sub-tabs (soft pills in a card) ──────────────────────────────── */
.atabs { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); gap: .2rem; padding: .35rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.atab {
    border: none; background: transparent; color: var(--text-muted); cursor: pointer;
    padding: .5rem .85rem; font-weight: 600; font-size: .85rem; border-radius: var(--r-sm);
    transition: background .15s, color .15s; white-space: nowrap;
}
.atab:hover { background: var(--surface-2); color: var(--text); }
.atab.active { background: var(--accent-subtle); color: var(--accent-text); }
.atabs-pdf { margin-left: auto; }

/* ── Cards & panels ─────────────────────────────────────────────────────────── */
.metric-card, .dcma-card, .overall-card, .health-card, .settings-card,
.cmp-card, .delay-card, .overview-chart-card, .overall-score-card {
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm); transition: box-shadow .18s, border-color .18s, transform .18s;
}
.metric-card:hover, .dcma-card:hover { box-shadow: var(--shadow-md); border-color: var(--border-strong); }
.metric-value { color: var(--text); font-weight: 800; letter-spacing: -.02em; }
.metric-label { color: var(--text-muted); }

/* ── Data tables ────────────────────────────────────────────────────────────── */
.data-table { border-color: var(--border); }
.data-table thead th { background: var(--surface-2); color: var(--text-subtle); font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; border-bottom: 1px solid var(--border); }
.data-table td { border-color: var(--border); color: var(--text); }
.data-table tbody tr:hover { background: var(--surface-2); }

/* generic page container width */
.page { max-width: 1320px; }

/* ── Empty states ───────────────────────────────────────────────────────────── */
.empty-state, .proj-empty { color: var(--text-muted); }

/* ═══════════════════════════════════════════════════════════════════════════
   PROJECTS — full landing page
   ═══════════════════════════════════════════════════════════════════════════ */
.proj-screen { background: var(--bg); }
.proj-head {
    background: var(--surface); border-bottom: 1px solid var(--border); padding: 0 1.5rem; height: 64px;
    position: sticky; top: 0; z-index: 5;
}
.proj-head h2 { font-size: 1.05rem; font-weight: 800; letter-spacing: -.02em; gap: .6rem; }
.proj-head h2 svg { color: var(--accent); }
.proj-body { max-width: 1180px; margin: 0 auto; width: 100%; padding: 1.75rem 1.5rem 3rem; }

/* hero / quick start row */
.proj-hero { display: grid; grid-template-columns: 1.2fr 1fr; gap: 1rem; margin-bottom: 1.75rem; }
.proj-hero-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-xl); padding: 1.5rem; box-shadow: var(--shadow-sm); }
.proj-hero-card.accent { background: linear-gradient(135deg, var(--accent), var(--accent-press)); color: #fff; border: none; }
.proj-hero-card.accent h3 { color: #fff; }
.proj-hero-card h3 { font-size: 1.1rem; margin-bottom: .35rem; }
.proj-hero-sub { font-size: .85rem; opacity: .85; margin-bottom: 1rem; }
.proj-hero-card.accent .proj-hero-sub { color: #e7e9ff; opacity: .95; }
.proj-quick-drop {
    border: 1.5px dashed var(--border-strong); border-radius: var(--r-lg); padding: 1.4rem; text-align: center;
    cursor: pointer; transition: border-color .15s, background .15s; color: var(--text-muted); background: var(--surface-2);
}
.proj-quick-drop:hover, .proj-quick-drop.drag-over { border-color: var(--accent); background: var(--accent-subtle); color: var(--accent-text); }
.proj-quick-drop strong { color: var(--text); display: block; margin-bottom: .2rem; }

.proj-section-title { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--text-subtle); font-weight: 700; margin: 0 0 .75rem; }

/* project cards as a grid */
.proj-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 1rem; }
.proj-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); margin: 0; transition: box-shadow .18s, border-color .18s, transform .18s; }
.proj-card:hover { box-shadow: var(--shadow-md); border-color: var(--border-strong); transform: translateY(-2px); }
.proj-card.current { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent), var(--shadow-sm); }
.proj-main { flex-direction: column; align-items: stretch; gap: .75rem; padding: 1.1rem 1.15rem; }
.proj-name { font-size: 1rem; }
.proj-curtag { background: var(--accent); }
.proj-meta { gap: .35rem .9rem; font-size: .74rem; color: var(--text-muted); }
.proj-meta span { display: inline-flex; align-items: center; }
.proj-stats { display: flex; flex-wrap: wrap; gap: .4rem .5rem; margin-top: .65rem; }
.proj-stat { display: inline-flex; align-items: baseline; gap: .3rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: 7px; padding: .25rem .55rem; }
.proj-stat b { font-size: .84rem; color: var(--text); font-variant-numeric: tabular-nums; }
.proj-stat span { font-size: .66rem; color: var(--text-subtle); text-transform: uppercase; letter-spacing: .04em; font-weight: 600; }
.proj-updated { font-size: .7rem; color: var(--text-subtle); margin-top: .55rem; }
.proj-actions { justify-content: flex-start; flex-wrap: wrap; }
.proj-owner { margin-left: auto; color: var(--text-subtle); }
.proj-scenarios { background: var(--surface-2); border-top: 1px solid var(--border); }
.scn-row { background: var(--surface); border-color: var(--border); }
.scn-name { color: var(--text); }
.proj-empty { background: var(--surface); border: 1px dashed var(--border-strong); border-radius: var(--r-lg); }

/* ── Projects: toolbar + grouped/list views ── */
/* notice shown after duplicate records were auto-grouped into one project */
.proj-merge-note {
    display: flex; align-items: flex-start; gap: .6rem;
    background: var(--accent-subtle); border: 1px solid var(--accent);
    border-radius: var(--r-md); padding: .6rem .8rem; margin-bottom: 1rem;
    font-size: .82rem; color: var(--text); line-height: 1.45;
}
.proj-merge-note svg { flex: 0 0 auto; margin-top: 2px; color: var(--accent-text); }
.proj-merge-note span { flex: 1; min-width: 0; }
.proj-merge-note #merge-note-x { flex: 0 0 auto; margin: -2px -4px 0 0; }

/* fixed column grid so every group's update table lines up, whatever the
   file-name length; long names ellipsize with a tooltip */
.proj-table-fixed { table-layout: fixed; width: 100%; }
.proj-table-fixed td, .proj-table-fixed th { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.proj-file { color: var(--text-muted); }
.proj-dim { color: var(--text-subtle); }
.proj-scn-chip {
    background: var(--accent-subtle); color: var(--accent-text); border: none;
    border-radius: 999px; padding: .12rem .55rem; font-size: .72rem; font-weight: 600;
    cursor: pointer; transition: filter .12s;
}
.proj-scn-chip:hover { filter: brightness(.96); }
.scn-upd-head {
    font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 700;
    color: var(--text-subtle); padding: .65rem .25rem .25rem;
}

/* picker: project header + one selectable row per monthly update.
   Rows and headers have fixed heights so every section reads the same. */
.ppi-group { padding: .25rem 0 .35rem; }
.ppi-gname {
    font-size: .8rem; font-weight: 700; color: var(--text);
    padding: 0 .35rem; height: 34px; display: flex; align-items: center; gap: .45rem;
}
.ppi-gtitle { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ppi-rel {
    margin-left: auto; flex: 0 0 auto;
    border-radius: 999px; font-size: .66rem; font-weight: 700; padding: .12rem .55rem;
    text-transform: uppercase; letter-spacing: .04em;
}
.ppi-rel.yes { background: color-mix(in srgb, var(--green, #15a34a) 14%, transparent); color: #166534; }
.ppi-rel.no { background: var(--surface-2); color: var(--text-subtle); border: 1px solid var(--border); }
.proj-picker .proj-picker-item { height: 52px; overflow: hidden; width: 100%; max-width: 100%; box-sizing: border-box; }
.proj-picker .ppi-name, .proj-picker .ppi-meta { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; max-width: 100%; }
.proj-picker .proj-picker-body { overflow-x: hidden; }

.proj-toolbar { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.proj-count { font-size: .78rem; color: var(--text-subtle); }
.proj-toolbar .kb-groupby { margin-left: auto; }
/* Global-Admin oversight: company scope dropdown + per-row company chip */
.proj-co-scope { padding: .4rem .55rem; border: 1px solid var(--border); border-radius: var(--r-sm); font-size: .82rem; font-family: inherit; background: var(--surface); color: var(--text); max-width: 220px; }
.proj-co-chip { font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; background: var(--accent-subtle); color: var(--accent-text); padding: .12rem .45rem; border-radius: 5px; white-space: nowrap; }
.pgroup { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); margin-bottom: 1rem; overflow: hidden; }
.pgroup.current { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent-subtle), var(--shadow-sm); }
.pgroup-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem 1rem; background: var(--surface-2); border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.pgroup-title { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; min-width: 0; }
.pgroup-stripe { width: 4px; height: 18px; border-radius: 2px; background: var(--accent); flex: 0 0 auto; }
.pgroup-name { font-weight: 700; color: var(--text); font-size: .95rem; }
.pgroup-meta { font-size: .74rem; color: var(--text-muted); }
.pgroup-actions { display: flex; gap: .35rem; flex-wrap: wrap; }
.proj-table { width: 100%; border-collapse: collapse; }
.proj-table th, .proj-table td { padding: .5rem .9rem; font-size: .8rem; text-align: left; border-bottom: 1px solid var(--border); white-space: nowrap; }
.proj-table thead th { background: var(--surface-2); color: var(--text-subtle); font-size: .64rem; text-transform: uppercase; letter-spacing: .05em; }
.proj-table tbody tr:last-child td { border-bottom: none; }
.proj-table tbody tr:hover { background: var(--surface-2); }
.proj-table .proj-ta { text-align: right; }
.proj-table .proj-dd { font-weight: 700; color: var(--text); }
.proj-cell-name { font-weight: 700; color: var(--text); }
.proj-row-current td { background: var(--accent-subtle); }
.proj-expand { padding: .6rem .9rem; background: var(--surface-2); }

/* project picker modal (baseline / comparison) */
.proj-picker-overlay { position: fixed; inset: 0; background: rgba(2,6,23,.5); backdrop-filter: blur(2px); z-index: 5000; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.proj-picker { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-xl); width: min(520px, 100%); max-height: 80vh; display: flex; flex-direction: column; overflow: hidden; }
.proj-picker-head { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.1rem; border-bottom: 1px solid var(--border); }
.proj-picker-head h3 { font-size: 1rem; }
.proj-picker-body { overflow-y: auto; padding: .6rem; display: flex; flex-direction: column; gap: .4rem; }
.proj-picker-item { text-align: left; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r); padding: .7rem .85rem; cursor: pointer; display: flex; flex-direction: column; gap: .15rem; transition: border-color .15s, background .15s; font-family: inherit; }
.proj-picker-item:hover { border-color: var(--accent); background: var(--accent-subtle); }
.ppi-name { font-weight: 700; color: var(--text); font-size: .9rem; }
.ppi-meta { font-size: .74rem; color: var(--text-muted); }
.proj-picker-foot { padding: .75rem 1.1rem; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; }

/* comparison prompt "or" divider + button */
.cmp-or { text-align: center; color: var(--text-subtle); font-size: .78rem; margin: .9rem 0 .6rem; position: relative; }

/* ═══════════════════════════════════════════════════════════════════════════
   WHAT-IF banner refinements
   ═══════════════════════════════════════════════════════════════════════════ */
.whatif-bar { margin: 1rem 0 .75rem; }
.wi-active { border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--accent); box-shadow: var(--shadow-sm); padding: .65rem 1rem; }
.wi-idle { border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-sm); padding: .65rem 1rem; }
.wi-tag { background: var(--accent); letter-spacing: .1em; }
.wi-name { background: var(--surface); color: var(--text); border-color: var(--border); height: 31px; }
.wi-stat label { color: var(--text-subtle); }
.wi-stat b { color: var(--text); }
/* controls inside both What-If states line up on one 31px baseline */
.wi-idle .btn, .wi-active .btn, .wi-importlbl { height: 31px; display: inline-flex; align-items: center; }

/* ── What-If: original/new date columns + Δ ── */
.gantt-datecell.gantt-orig { color: var(--text-subtle); font-style: italic; }
.gantt-delta { font-weight: 700; font-variant-numeric: tabular-nums; }
.gantt-delta.late { color: var(--red, #e11d48); }
.gantt-delta.early { color: var(--green, #15a34a); }
.gantt-delta.flat { color: var(--text-subtle); }

/* user-drawn dependency arrows: unmistakably staged logic */
.gantt-arrow.wi-added { stroke: #4f46e5; stroke-width: 2; }

/* ── What-If: link confirmation popover ── */
.wi-linkpop {
    position: fixed; z-index: 4000; width: 272px;
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md);
    box-shadow: var(--shadow-xl); padding: .7rem .8rem;
}
.wi-linkpop .wlp-title { font-size: .82rem; color: var(--text); margin-bottom: .55rem; }
.wi-linkpop .wlp-row { display: flex; align-items: center; gap: .5rem; margin-bottom: .45rem; font-size: .8rem; color: var(--text-muted); }
.wi-linkpop .wlp-row label { width: 38px; font-weight: 600; }
.wi-linkpop select, .wi-linkpop input {
    background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-sm);
    color: var(--text); font-size: .8rem; padding: .25rem .4rem;
}
.wi-linkpop .wlp-hint { font-size: .7rem; color: var(--text-subtle); }
.wi-linkpop .wlp-actions { display: flex; justify-content: flex-end; gap: .4rem; margin-top: .55rem; }

/* ── What-If: change log panel ── */
.wi-log-panel {
    position: absolute; top: 8px; right: 12px; width: 330px; max-height: min(430px, 70vh);
    display: flex; flex-direction: column; z-index: 60;
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg);
    box-shadow: var(--shadow-xl);
}
.wi-log-panel.hidden { display: none; }
.wi-log-head { display: flex; align-items: center; gap: .5rem; padding: .55rem .75rem; border-bottom: 1px solid var(--border); font-size: .85rem; color: var(--text); }
.wi-log-count { background: var(--accent-subtle); color: var(--accent-text); border-radius: 999px; font-size: .7rem; font-weight: 700; padding: .05rem .5rem; }
.wi-log-head .btn-icon { margin-left: auto; }
.wi-log-body { overflow-y: auto; padding: .3rem 0; }
.wi-log-row { display: flex; align-items: center; gap: .5rem; padding: .4rem .75rem; border-bottom: 1px solid var(--border); }
.wi-log-row:last-child { border-bottom: none; }
.wi-log-txt { flex: 1; min-width: 0; font-size: .78rem; color: var(--text-muted); line-height: 1.35; }
.wi-log-imp { flex: 0 0 auto; border-radius: 999px; font-size: .7rem; font-weight: 700; padding: .1rem .45rem; font-variant-numeric: tabular-nums; }
.wi-log-imp.late { background: color-mix(in srgb, var(--red, #e11d48) 12%, transparent); color: #b91c1c; }
.wi-log-imp.early { background: color-mix(in srgb, var(--green, #15a34a) 12%, transparent); color: #166534; }
.wi-log-imp.flat { background: var(--surface-2); color: var(--text-subtle); }
.wi-log-undo {
    flex: 0 0 auto; width: 22px; height: 22px; border: none; border-radius: var(--r-sm);
    background: transparent; color: var(--text-subtle); cursor: pointer; font-size: .8rem;
}
.wi-log-undo:hover { background: var(--surface-2); color: var(--red, #e11d48); }
.wi-log-empty { padding: .9rem .75rem; font-size: .78rem; color: var(--text-subtle); }
.wi-log-foot { padding: .45rem .75rem; border-top: 1px solid var(--border); font-size: .68rem; color: var(--text-subtle); }
#wi-log-btn.wi-log-on { background: var(--accent-subtle); color: var(--accent-text); }
#main-gantt { position: relative; }

/* ── Activity pane: What-If tab ── */
.wip-empty { padding: .6rem .2rem; font-size: .82rem; color: var(--text-muted); max-width: 560px; }
.wip-empty p { margin: 0 0 .6rem; line-height: 1.5; }
.wip-grid { display: grid; grid-template-columns: 260px 1fr; gap: 1.4rem; align-items: start; }
@media (max-width: 900px) { .wip-grid { grid-template-columns: 1fr; } }
.wip-fields { display: flex; flex-direction: column; gap: .55rem; }
.wip-fields label { display: flex; flex-direction: column; gap: .2rem; font-size: .72rem; font-weight: 600; color: var(--text-subtle); text-transform: uppercase; letter-spacing: .04em; }
.wip-fields input { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-sm); color: var(--text); font-size: .82rem; padding: .3rem .45rem; max-width: 170px; }
.wip-fields input:disabled { opacity: .55; cursor: not-allowed; }
.wip-durwrap { display: flex; align-items: center; gap: .4rem; }
.wip-durwrap input { width: 70px; max-width: 70px; }
.wip-unit { font-size: .72rem; color: var(--text-subtle); font-weight: 400; text-transform: none; letter-spacing: 0; }
.wip-hint { font-size: .72rem; color: var(--text-subtle); margin: .55rem 0 0; line-height: 1.45; max-width: 250px; }
.wip-reltable select, .wip-reltable input { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-sm); color: var(--text); font-size: .76rem; padding: .15rem .3rem; }
.wip-reltable input.wip-lag { width: 58px; }
.wip-relname { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wip-new { background: var(--accent-subtle); color: var(--accent-text); border-radius: 999px; font-size: .64rem; font-weight: 700; padding: .05rem .4rem; margin-left: .3rem; }
.wip-relx { border: none; background: transparent; color: var(--text-subtle); cursor: pointer; border-radius: var(--r-sm); width: 22px; height: 22px; }
.wip-relx:hover { background: var(--surface-2); color: var(--red, #e11d48); }
.wip-goto { cursor: pointer; }
.wip-goto:hover { color: var(--accent-text); text-decoration: underline; }
.wip-add { display: flex; align-items: center; gap: .4rem; margin-top: .6rem; }
.wip-add input, .wip-add select { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-sm); color: var(--text); font-size: .78rem; padding: .3rem .45rem; }
.wip-add #wip-add-code { width: 150px; }
.wip-add #wip-add-lag { width: 62px; }
.wip-succs { display: flex; flex-wrap: wrap; gap: .35rem; }
.wip-succ { background: var(--surface-2); border: 1px solid var(--border); border-radius: 999px; font-size: .72rem; color: var(--text-muted); padding: .15rem .55rem; }
.wip-succ i { font-style: normal; color: var(--text-subtle); }
.wi-chip { display: inline-flex; align-items: center; height: 24px; }

/* ═══════════════════════════════════════════════════════════════════════════
   KANBAN  ·  swimlanes + polish
   ═══════════════════════════════════════════════════════════════════════════ */
.kb-toolbar { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
/* ── Virtualized activities table (renders only the visible row window) ── */
.act-vscroll { height: calc(100vh - 300px); min-height: 320px; overflow-y: auto; overflow-x: auto; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); }
.act-vtable { width: 100%; border-collapse: collapse; }
.act-vtable thead th {
    position: sticky; top: 0; z-index: 2; cursor: pointer; user-select: none;
    background: var(--surface-2); border-bottom: 1px solid var(--border);
    padding: .5rem .7rem; text-align: left; font-size: .74rem; font-weight: 700;
    color: var(--text-muted); white-space: nowrap;
}
.act-vtable thead th:hover { color: var(--text); }
.act-vtable thead th.sorted { color: var(--accent-text); }
.act-vtable thead th.sorted::after { content: '▲'; font-size: .6rem; margin-left: .3rem; }
.act-vtable thead th.sorted[data-dir="desc"]::after { content: '▼'; }
.act-vrow { height: 34px; }
.act-vrow td { height: 34px; padding: 0 .7rem; border-bottom: 1px solid var(--border); font-size: .8rem; white-space: nowrap; overflow: hidden; }
.act-vrow .act-name-cell { max-width: 340px; text-overflow: ellipsis; }
.act-spacer td, .act-spacer { padding: 0 !important; border: none !important; }
.act-vrow.act-clickable { cursor: pointer; }
.act-vrow.act-clickable:hover { background: var(--surface-2); }

/* ── Licensing / demo mode ── */
/* hide the editing / file-loading entry points a demo account can't use */
body.demo-mode #btn-reset,
body.demo-mode #btn-baseline,
body.demo-mode #proj-quick,
body.demo-mode .proj-hero-card,
body.demo-mode .proj-demo-btn,
body.demo-mode #proj-demo-empty,
body.demo-mode #proj-save-current,
body.demo-mode #wi-save,
body.demo-mode #wi-import,
body.demo-mode #wi-start,
body.demo-mode .wi-importlbl,
body.demo-mode #kb-addfield,
body.demo-mode [data-uadd] { display: none !important; }

/* persistent demo banner (top bar, above the header) */
#demo-banner {
    display: flex; align-items: center; gap: .7rem;
    height: var(--banner-h, 40px); box-sizing: border-box;
    padding: .4rem 1rem; overflow: hidden;
    background: linear-gradient(90deg, var(--accent), var(--accent-hover, #4338ca));
    color: #fff; font-size: .82rem;
}
/* The banner sits above the fixed header, so pin it and push the header/rail/
   shell down by its height — otherwise the sticky rail (top:60px, 100vh-60px)
   overflows the viewport by the banner's height and forces a stray scrollbar. */
body.has-demo-banner { --banner-h: 40px; }
body.has-demo-banner #demo-banner { position: sticky; top: 0; z-index: 101; }
body.has-demo-banner .app-header { top: var(--banner-h); }
body.has-demo-banner .app-shell { min-height: calc(100vh - 60px - var(--banner-h)); }
body.has-demo-banner .side-nav { top: calc(60px + var(--banner-h)); height: calc(100vh - 60px - var(--banner-h)); }
@media (max-width: 700px) { body.has-demo-banner { --banner-h: 52px; } }
#demo-banner .db-badge { background: rgba(255,255,255,.12); border-radius: 4px; font-weight: 800; font-size: .66rem; letter-spacing: .06em; padding: .12rem .45rem; }
#demo-banner .db-text { flex: 1; min-width: 0; }
#demo-banner .db-cta { color: #fff; font-weight: 700; text-decoration: none; white-space: nowrap; border-bottom: 1px solid rgba(255,255,255,.6); }
#demo-banner .db-cta:hover { border-bottom-color: #fff; }
/* the CTA is a <button> now (files an access request) — keep the link look */
#demo-banner button.db-cta { background: none; border-top: 0; border-left: 0; border-right: 0; padding: 0; font: inherit; font-weight: 700; cursor: pointer; }
#demo-banner button.db-cta:disabled { opacity: .8; cursor: default; border-bottom-color: transparent; }
@media (max-width: 700px) { #demo-banner .db-text { font-size: .75rem; } }

.proj-demo-tag { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-subtle); background: var(--surface-2); border: 1px solid var(--border); border-radius: 999px; padding: .1rem .5rem; }

/* source-format chip on library cards/rows (shown for MS Project XML files) */
.proj-src-tag { font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--accent); background: var(--accent-subtle); border: 1px solid var(--accent-border); border-radius: 999px; padding: .08rem .45rem; margin-left: .3rem; vertical-align: middle; white-space: nowrap; }

/* locked module rail entries */
.side-nav .main-tab.module-locked { opacity: .6; }
.side-nav .main-tab .nav-lock { margin-left: auto; font-size: .7rem; }

/* upgrade + expired modals */
.lic-modal-overlay, .lic-expired-overlay { position: fixed; inset: 0; z-index: 6000; background: rgba(10,14,24,.6); display: flex; align-items: center; justify-content: center; padding: 1.5rem; }
.lic-modal, .lic-expired { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-xl); max-width: 460px; padding: 2rem 1.8rem; text-align: center; }
.lic-lock { font-size: 2.2rem; margin-bottom: .5rem; }
.lic-modal h3, .lic-expired h2 { color: var(--text); margin: 0 0 .6rem; }
.lic-modal p, .lic-expired p { color: var(--text-muted); line-height: 1.55; font-size: .9rem; margin: 0 0 1.2rem; }
.lic-actions { display: flex; gap: .6rem; justify-content: center; flex-wrap: wrap; }
.lic-actions .btn-primary { text-decoration: none; }

/* ── Onboarding: welcome card + guided tour ── */
.tour-welcome-overlay { position: fixed; inset: 0; z-index: 5000; background: rgba(10, 14, 24, .55); display: flex; align-items: center; justify-content: center; padding: 1.5rem; }
.tour-welcome { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-xl); max-width: 460px; padding: 2rem 1.8rem; text-align: center; }
.tour-welcome .tw-badge { width: 54px; height: 54px; border-radius: 14px; background: var(--accent-subtle); color: var(--accent-text); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 1rem; }
.tour-welcome h2 { font-size: 1.3rem; color: var(--text); margin: 0 0 .6rem; letter-spacing: -.01em; }
.tour-welcome p { color: var(--text-muted); line-height: 1.55; margin: 0 0 .8rem; font-size: .9rem; }
.tour-welcome .tw-sub { font-size: .82rem; color: var(--text-subtle); }
.tour-welcome .tw-actions { display: flex; flex-direction: column; gap: .5rem; margin-top: 1.2rem; }

.tour-overlay { position: fixed; inset: 0; z-index: 5000; pointer-events: auto; }
.tour-spot { position: fixed; border-radius: 8px; box-shadow: 0 0 0 4px var(--accent), 0 0 0 9999px rgba(10, 14, 24, .55); transition: all .2s ease; pointer-events: none; }
.tour-card { position: fixed; width: 300px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md); box-shadow: var(--shadow-xl); padding: 1rem 1.1rem; pointer-events: auto; transition: left .2s ease, top .2s ease; }
.tour-card .tour-step-count { font-size: .7rem; font-weight: 700; color: var(--accent-text); letter-spacing: .04em; }
.tour-card h4 { font-size: .98rem; color: var(--text); margin: .2rem 0 .4rem; }
.tour-card p { font-size: .84rem; color: var(--text-muted); line-height: 1.5; margin: 0 0 .9rem; }
.tour-nav { display: flex; align-items: center; justify-content: space-between; }
.tour-nav-right { display: flex; gap: .4rem; }

/* ── Projects: mode toggle, demo CTA, portfolio grid ── */
.proj-mode-toggle { display: inline-flex; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-sm); padding: 2px; margin-left: 1rem; }
.proj-mode-toggle button { border: none; background: transparent; color: var(--text-muted); font-weight: 600; font-size: .8rem; padding: .35rem .8rem; border-radius: 5px; cursor: pointer; font-family: inherit; }
.proj-mode-toggle button.active { background: var(--surface); color: var(--accent-text); box-shadow: var(--shadow-sm); }
.proj-head-actions { margin-left: auto; display: flex; gap: .5rem; }

.proj-demo-btn { margin-top: .7rem; }
.proj-demo-btn.is-loading, #proj-demo-empty.is-loading { opacity: .6; pointer-events: none; }
.proj-empty-hero { text-align: center; padding: 3rem 1.5rem; color: var(--text-muted); max-width: 560px; margin: 1rem auto; }
.proj-empty-hero svg { color: var(--text-subtle); margin-bottom: .8rem; }
.proj-empty-hero h3 { font-size: 1.2rem; color: var(--text); margin: 0 0 .4rem; }
.proj-empty-hero p { line-height: 1.55; margin: 0 0 1.2rem; }
.proj-empty-hero .btn-primary { display: inline-flex; align-items: center; gap: .4rem; }
.proj-empty-sub { font-size: .78rem; color: var(--text-subtle); margin-top: .9rem; }

.pf-head { display: flex; align-items: center; gap: 1rem; margin-bottom: .8rem; }
.pf-legend { display: flex; align-items: center; gap: .5rem; font-size: .78rem; color: var(--text-muted); }
.pf-legend .pf-dot { margin-left: .5rem; }
.pf-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex: 0 0 auto; vertical-align: middle; }
.pf-dot.rag-green { background: var(--green, #15a34a); }
.pf-dot.rag-amber { background: var(--amber, #d97706); }
.pf-dot.rag-red { background: var(--red, #e11d48); }
.pf-dot.rag-grey { background: var(--text-subtle); }
.pf-table { width: 100%; }
.pf-table th { font-size: .72rem; }
.pf-row { cursor: pointer; transition: background .1s; }
.pf-row:hover { background: var(--surface-2); }
.pf-row.pf-current { box-shadow: inset 3px 0 0 var(--accent); }
.pf-rag { width: 24px; text-align: center; }
.pf-name { font-weight: 600; color: var(--text); }
.pf-score { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 22px; padding: 0 .4rem; border-radius: 6px; font-weight: 800; font-size: .8rem; color: #fff; }
.pf-score.rag-green { background: var(--green, #15a34a); color: #0b1220; }
.pf-score.rag-amber { background: var(--amber, #d97706); color: #0b1220; }
.pf-score.rag-red { background: var(--red, #e11d48); }
.pf-score.rag-grey { background: #64748b; }
.pf-warn { color: var(--amber, #d97706); font-weight: 600; }
.pf-bad { color: var(--red, #e11d48); font-weight: 700; }
.pf-fresh { color: var(--text-muted); white-space: nowrap; }

.kb-groupby { display: inline-flex; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-sm); padding: 2px; }
.kb-groupby button { border: none; background: transparent; color: var(--text-muted); font-weight: 600; font-size: .8rem; padding: .35rem .7rem; border-radius: 5px; cursor: pointer; font-family: inherit; }
.kb-groupby button.active { background: var(--surface); color: var(--accent-text); box-shadow: var(--shadow-sm); }
.kb-col { background: var(--surface-2); border-color: var(--border); border-radius: var(--r-lg); }
.kb-colhead { color: var(--text); border-color: var(--border); }
.kb-colhead .kb-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: .15rem; }
.kb-dot.NotStarted { background: var(--text-subtle); }
.kb-dot.InProgress { background: var(--accent); }
.kb-dot.Complete { background: var(--green); }
.kb-count { background: var(--surface-3); color: var(--text-muted); }
.kb-card { background: var(--surface); border-color: var(--border); border-radius: var(--r); box-shadow: var(--shadow-sm); transition: box-shadow .15s, transform .05s, border-color .15s; }
.kb-card:hover { box-shadow: var(--shadow-md); border-color: var(--border-strong); }
.kb-card:active { transform: scale(.997); }
.kb-code { color: var(--text); }
.kb-card-name { color: var(--text-muted); }
.kb-input { background: var(--surface); color: var(--text); border-color: var(--border); }
.kb-input:focus-visible { border-color: var(--accent); }

/* swimlanes: WBS rows × status columns */
.kb-swimlanes { display: flex; flex-direction: column; gap: 1rem; }
.kb-lane { border: 1px solid var(--border); border-radius: var(--r-lg); overflow: hidden; background: var(--surface); box-shadow: var(--shadow-sm); }
.kb-lane-head { display: flex; align-items: center; gap: .5rem; padding: .6rem .9rem; background: var(--surface-2); border-bottom: 1px solid var(--border); font-weight: 700; font-size: .85rem; color: var(--text); }
.kb-lane-head .kb-lane-count { margin-left: auto; font-size: .72rem; color: var(--text-muted); font-weight: 600; background: var(--surface-3); padding: .1rem .5rem; border-radius: 999px; }
.kb-lane-stripe { width: 4px; height: 16px; border-radius: 2px; background: var(--accent); }
.kb-lane-body { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; padding: .75rem; }
.kb-lane-col { display: flex; flex-direction: column; gap: .5rem; min-height: 40px; border-radius: var(--r); padding: .35rem; transition: background .15s; }
.kb-lane-col.over { background: var(--accent-subtle); }
.kb-lane-coltitle { font-size: .64rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-subtle); font-weight: 700; padding: .15rem .25rem; display: flex; align-items: center; gap: .3rem; }
.kb-lane-empty { font-size: .72rem; color: var(--text-subtle); text-align: center; padding: .5rem; opacity: 1; }
.kb-lane-col .kb-card { padding: .5rem .55rem; }
.kb-lane-col .kb-card-name { font-size: .76rem; }
@media (max-width: 640px) { .kb-lane-body { grid-template-columns: 1fr; } }
@media (max-width: 860px) { .proj-hero { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════════════════════════════════════════
   CALENDAR polish
   ═══════════════════════════════════════════════════════════════════════════ */
.cal-subtabs, .kb-groupby { box-shadow: var(--shadow-sm); }
.cal-cell.today { background: var(--warn-bg); }
.cal-grid, .cal-dowrow { border-color: var(--border); }
.cal-cell { border-color: var(--border); }

/* ═══════════════════════════════════════════════════════════════════════════
   Auth & admin polish
   ═══════════════════════════════════════════════════════════════════════════ */
.auth-card { border-radius: var(--r-xl); box-shadow: var(--shadow-xl); border: 1px solid var(--border); }
.auth-form input { border-radius: var(--r-sm); }
.admin-head { border-color: var(--border); }

/* ═══════════════════════════════════════════════════════════════════════════
   GANTT — premium pass (both themes)
   ═══════════════════════════════════════════════════════════════════════════ */
.gantt-toolbar { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); }
.gantt-ts-btn, .gantt-btn, .gantt-icon-btn { font-family: inherit; }
.gantt-root { border-radius: var(--r-lg); }
.gantt-viewport { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); }
.gantt-header { background: var(--surface-2); border-bottom: 1px solid var(--border); }
.gantt-hcell { border-right: 1px solid var(--border); color: var(--text-subtle); }
.gantt-hcell-top { color: var(--text); background: var(--surface-3); font-weight: 700; letter-spacing: .01em; }
.gantt-corner { background: var(--surface-2); border-right: 1px solid var(--border); }
.gantt-colhead { color: var(--text-subtle); font-size: .66rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; }
.gantt-row:hover .gantt-rowlabel:not(.is-wbs) { background: var(--surface-2); }
.gantt-datecell, .gantt-act-name { color: var(--text-muted); }
.gantt-act-code { color: var(--text-subtle); }
.gantt-bar { border-radius: 4px; }
.gantt-gridline { background: var(--border); opacity: .55; }

/* ═══════════════════════════════════════════════════════════════════════════
   PROJECTS — single hero + drop dialog
   ═══════════════════════════════════════════════════════════════════════════ */
.proj-hero-single { display: grid; grid-template-columns: 1.05fr 1fr; gap: 1.5rem; align-items: center; margin-bottom: 1.75rem; }
.proj-hero-single .proj-hero-sub { margin-bottom: 0; }
.proj-hero-single .proj-quick-drop { display: flex; flex-direction: column; align-items: center; gap: .3rem; padding: 1.6rem 1.4rem; }
.proj-quick-drop svg { opacity: .75; margin-bottom: .2rem; }
@media (max-width: 720px) { .proj-hero-single { grid-template-columns: 1fr; } }

.proj-drop-dialog { width: min(460px, 100%); }
.proj-drop-meta { padding: .35rem 1.1rem .8rem; font-size: .8rem; color: var(--text-muted); }
.proj-drop-actions { display: flex; flex-direction: column; gap: .5rem; padding: 0 1rem 1rem; }
.proj-drop-choice { text-align: left; font-family: inherit; cursor: pointer; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r); padding: .8rem .95rem; display: flex; flex-direction: column; gap: .15rem; transition: border-color .15s, background .15s, transform .05s; }
.proj-drop-choice:hover { border-color: var(--accent); background: var(--accent-subtle); }
.proj-drop-choice:active { transform: translateY(.5px); }
.proj-drop-choice .pdc-title { font-weight: 700; color: var(--text); font-size: .9rem; }
.proj-drop-choice .pdc-sub { font-size: .76rem; color: var(--text-muted); }
.proj-drop-choice.primary { border-color: var(--accent); background: var(--accent-subtle); }
.proj-drop-choice.primary .pdc-title { color: var(--accent-text); }

/* ═══════════════════════════════════════════════════════════════════════════
   ACTIVITY CODES analysis
   ═══════════════════════════════════════════════════════════════════════════ */
.codes-bar { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.codes-groupsel { display: inline-flex; align-items: center; gap: .5rem; font-size: .82rem; font-weight: 600; color: var(--text-muted); }
.codes-groupsel select { padding: .4rem .6rem; border: 1px solid var(--border); border-radius: var(--r-sm); font-family: inherit; font-size: .85rem; background: var(--surface); color: var(--text); }
.codes-note { font-size: .76rem; color: var(--text-subtle); }
.codes-colbtn-wrap { position: relative; }
.codes-colmenu { position: absolute; top: calc(100% + 6px); left: 0; z-index: 60; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r); box-shadow: var(--shadow-lg); padding: .6rem .75rem; display: grid; grid-template-columns: 1fr 1fr; gap: .35rem .9rem; min-width: 300px; }
.codes-colmenu label { display: flex; align-items: center; gap: .4rem; font-size: .8rem; color: var(--text); cursor: pointer; white-space: nowrap; }
.codes-colmenu.hidden { display: none; }
.codes-tablewrap { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); overflow-x: auto; box-shadow: var(--shadow-sm); }
.codes-table { width: 100%; border-collapse: collapse; }
.codes-table th, .codes-table td { padding: .55rem .8rem; text-align: right; font-size: .82rem; border-bottom: 1px solid var(--border); }
.codes-table th:first-child, .codes-table td:first-child { text-align: left; }
.codes-table thead th { background: var(--surface-2); color: var(--text-subtle); font-size: .66rem; text-transform: uppercase; letter-spacing: .05em; }
.codes-group-row { cursor: pointer; }
.codes-group-row:hover { background: var(--surface-2); }
.codes-group-row.open { background: var(--accent-subtle); }
.codes-name-td { display: flex; align-items: center; gap: .5rem; font-weight: 600; color: var(--text); }
.codes-caret { color: var(--text-subtle); font-size: .75rem; width: 12px; }
.codes-gsub { font-size: .68rem; font-weight: 700; color: var(--accent-text); background: var(--accent-subtle); border: 1px solid var(--accent-border); padding: .05rem .4rem; border-radius: 5px; }
.codes-crit { color: var(--red); font-weight: 700; }
.codes-drill > td { padding: 0 !important; background: var(--surface-2); }
.codes-acts { width: 100%; border-collapse: collapse; }
.codes-acts th, .codes-acts td { padding: .4rem .8rem .4rem 2rem; font-size: .78rem; text-align: left; border-bottom: 1px solid var(--border); }
.codes-acts thead th { color: var(--text-subtle); font-size: .62rem; text-transform: uppercase; letter-spacing: .05em; }
.codes-acts tbody tr { cursor: pointer; }
.codes-acts tbody tr:hover { background: var(--accent-subtle); }
.codes-acts tr.is-crit .codes-act-id { color: var(--red); }
.codes-act-id { font-weight: 700; }

/* ═══════════════════════════════════════════════════════════════════════════
   KPI sub-labels · metric definitions · sortable headers
   ═══════════════════════════════════════════════════════════════════════════ */
.okpi-sub { font-size: .62rem; color: var(--text-subtle); margin-top: .1rem; line-height: 1.25; }
.okpi[title] { cursor: help; }

.delay-defs { margin: .9rem 0 1.4rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); }
.delay-defs summary { cursor: pointer; padding: .65rem 1rem; font-size: .82rem; font-weight: 600; color: var(--text-muted); user-select: none; }
.delay-defs summary:hover { color: var(--accent-text); }
.delay-defs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem 1.25rem; padding: .25rem 1rem 1rem; font-size: .78rem; color: var(--text-muted); line-height: 1.5; }
.delay-defs-grid b { color: var(--text); }
.delay-defs-grid i { color: var(--text-subtle); }
@media (max-width: 700px) { .delay-defs-grid { grid-template-columns: 1fr; } }

/* sortable table headers */
.data-table thead th, .codes-table thead th, .codes-acts thead th { cursor: pointer; user-select: none; }
.no-sort thead th, thead th.no-sort { cursor: default; }
.sort-ind { margin-left: .3rem; font-size: .6rem; color: var(--accent-text); }
th[data-sort-dir] { color: var(--accent-text) !important; }

/* ═══════════════════════════════════════════════════════════════════════════
   RESOURCES page
   ═══════════════════════════════════════════════════════════════════════════ */
.res-head { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.res-title { font-size: 1.15rem; }
.res-derived { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--amber); background: var(--amber-bg); border: 1px solid var(--amber); padding: .15rem .5rem; border-radius: 999px; cursor: help; }
/* aligned, equal-height KPI grid */
.res-kpis { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr)); gap: .75rem; margin-bottom: 1.25rem; align-items: stretch; }
.res-kpis .okpi { display: flex; flex-direction: column; justify-content: center; min-height: 96px; margin: 0; }
/* Resources tab only: all 7 KPI cards stay on ONE line — the strip scrolls
   sideways on narrow screens instead of wrapping to a second row. (The Trends
   change-strip reuses .res-kpis and keeps its auto-wrap.) */
#main-resources .res-kpis { grid-template-columns: repeat(7, minmax(112px, 1fr)); overflow-x: auto; padding-bottom: .25rem; }
#main-resources .res-kpis .okpi-val { font-size: clamp(1rem, 1.3vw, 1.6rem); white-space: nowrap; }

/* filter bar */
.res-filters { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; padding: .55rem .7rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); }
.res-filters select, .res-search { height: 31px; padding: 0 .6rem; border: 1px solid var(--border); border-radius: var(--r-sm); font-family: inherit; font-size: .82rem; background: var(--surface); color: var(--text); }
.res-search { min-width: 190px; }
.res-search:focus, .res-filters select:focus { outline: none; border-color: var(--accent); box-shadow: var(--ring); }
.res-filter-note { font-size: .76rem; color: var(--accent-text); font-weight: 600; margin-left: auto; }
.res-nomatch { text-align: center; color: var(--text-muted); padding: 1.5rem !important; }

/* S-curve */
.res-scurve-section { margin-bottom: 1.25rem; }
.res-scurve-wrap { height: 280px; position: relative; }

.res-charts { margin-bottom: 1.25rem; }
.res-empty { text-align: center; padding: 4rem 1.5rem; color: var(--text-muted); background: var(--surface); border: 1px dashed var(--border-strong); border-radius: var(--r-lg); max-width: 560px; margin: 3rem auto; }
.res-empty svg { color: var(--text-subtle); margin-bottom: .75rem; }
.res-empty h3 { margin-bottom: .4rem; }
.res-empty p { font-size: .85rem; line-height: 1.6; }
.res-table td, .res-table th { white-space: nowrap; }

/* ═══════════════════════════════════════════════════════════════════════════
   EARNED VALUE page
   ═══════════════════════════════════════════════════════════════════════════ */
.evm-setup { max-width: 640px; margin: 2.5rem auto; display: flex; flex-direction: column; gap: 1rem; }
.evm-setup h3 { font-size: 1.1rem; }
.evm-setup-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); padding: 1.25rem 1.4rem; }
.evm-setup-title { font-weight: 700; color: var(--text); margin-bottom: .4rem; }
.evm-setup-card p { font-size: .85rem; color: var(--text-muted); line-height: 1.6; margin-bottom: .9rem; }
.evm-setup-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.evm-badge { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--accent-text); background: var(--accent-subtle); border: 1px solid var(--accent-border); padding: .15rem .5rem; border-radius: 999px; cursor: help; }
/* two balanced rows of 8 cards (4-up on smaller screens → four equal rows) */
.evm-kpis { grid-template-columns: repeat(8, 1fr); }
.evm-kpis .okpi { min-height: 104px; padding: .6rem .5rem; }
.evm-kpis .okpi-val { font-size: 1.05rem; }
@media (max-width: 1180px) { .evm-kpis { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 640px)  { .evm-kpis { grid-template-columns: repeat(2, 1fr); } }
.evm-badge.warn { color: var(--amber); background: var(--amber-bg); border-color: var(--amber); }
.evm-neg { color: var(--red); font-weight: 600; }

/* ═══════════════════════════════════════════════════════════════════════════
   TRENDS page
   ═══════════════════════════════════════════════════════════════════════════ */
.tr-strip { background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); padding: .9rem 1rem; margin-bottom: 1.25rem; }
.tr-strip-title { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--text-subtle); font-weight: 700; margin-bottom: .6rem; }
.tr-strip .res-kpis { margin-bottom: 0; }
.tr-delta { font-size: .68rem; font-weight: 700; vertical-align: middle; }
.tr-delta.good { color: var(--green); }
.tr-delta.bad { color: var(--red); }
.tr-delta.flat { color: var(--text-subtle); }
.tr-steps { display: flex; flex-direction: column; gap: .75rem; }
.tr-step { border: 1px solid var(--border); border-radius: var(--r); background: var(--surface-2); overflow: hidden; }
.tr-step-head { display: flex; align-items: center; justify-content: space-between; padding: .55rem .85rem; background: var(--surface); border-bottom: 1px solid var(--border); }
.tr-step-dates { font-weight: 700; font-size: .85rem; color: var(--text); }
.tr-step-chip { font-size: .76rem; font-weight: 700; padding: .18rem .55rem; border-radius: 999px; }
.tr-step-chip.late { background: var(--red-bg); color: var(--red); }
.tr-step-chip.early { background: var(--green-bg); color: var(--green); }
.tr-step-chip.flat { background: var(--surface-3); color: var(--text-muted); }
.tr-step-body { margin: 0; padding: .6rem .85rem .7rem 2rem; font-size: .82rem; color: var(--text-muted); line-height: 1.6; }

/* ═══════════════════════════════════════════════════════════════════════════
   SCHEDULE RISK page
   ═══════════════════════════════════════════════════════════════════════════ */
.risk-params { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; padding: .65rem .9rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); margin-bottom: .5rem; }
.risk-params label { display: inline-flex; align-items: center; gap: .4rem; font-size: .82rem; font-weight: 600; color: var(--text-muted); }
.risk-params input[type=number] { width: 72px; height: 31px; padding: 0 .5rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface); color: var(--text); font-family: inherit; }
.risk-params select { height: 31px; padding: 0 .5rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface); color: var(--text); font-family: inherit; }
.risk-params .btn-primary { margin-left: auto; }
.risk-hint { font-size: .76rem; color: var(--text-subtle); margin-bottom: 1rem; }
.risk-progress { height: 8px; background: var(--surface-3); border-radius: 999px; overflow: hidden; margin-bottom: 1rem; }
.risk-progress-fill { height: 100%; width: 0%; background: var(--accent); border-radius: 999px; transition: width .15s; }
.risk-narrative { background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); padding: .9rem 1.1rem; margin-top: 1rem; font-size: .85rem; line-height: 1.65; color: var(--text-muted); }
.risk-narr-what { margin-bottom: .6rem; }
.risk-narr-what b, .risk-narr-title { color: var(--text); }
.risk-narr-title { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; margin-bottom: .3rem; }
.risk-narrative ul { margin: 0; padding-left: 1.2rem; }
.risk-narrative li { margin-bottom: .3rem; }
.risk-critbar { position: relative; background: var(--surface-3); border-radius: 5px; height: 18px; min-width: 140px; overflow: hidden; }
.risk-critbar i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--accent); opacity: .75; border-radius: 5px; }
.risk-critbar span { position: relative; font-size: .7rem; font-weight: 700; color: var(--text); padding-left: .45rem; line-height: 18px; }
.risk-path { margin: 0; padding-left: 1.4rem; font-size: .82rem; color: var(--text-muted); line-height: 1.7; }
.risk-path .codes-act-id { color: var(--accent-text); margin-right: .35rem; }

/* updates panel header inside project cards */
.upd-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; }

/* ── AI Schedule Builder: wizard + review dock ── */
.bld-modal { width: min(720px, 100%); }
.bld-body { padding: 1rem 1.2rem 1.2rem; display: flex; flex-direction: column; gap: .8rem; overflow-y: auto; max-height: 78vh; }
.bld-grid { display: flex; gap: .8rem; flex-wrap: wrap; }
.bld-grid .ae-field { flex: 1; min-width: 170px; }
.bld-body .ae-field label { display: block; font-size: .72rem; font-weight: 700; color: var(--text-muted); margin-bottom: .25rem; }
.bld-body input[type=text], .bld-body input[type=number], .bld-body input[type=date], .bld-body select, .bld-body textarea {
    width: 100%; padding: .45rem .6rem; border: 1px solid var(--border); border-radius: var(--r-sm);
    background: var(--surface); color: var(--text); font-family: inherit; font-size: .85rem;
}
.bld-body textarea { resize: vertical; }
.bld-hint { font-weight: 400; color: var(--text-subtle); font-size: .7rem; text-transform: none; letter-spacing: 0; }
.bld-chips { display: flex; gap: .35rem; flex-wrap: wrap; }
.bld-label-row { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin-bottom: .3rem; }
.bld-label-row label { margin: 0; }
.bld-chip { padding: .4rem .7rem; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--text-muted); font-family: inherit; font-size: .78rem; font-weight: 600; cursor: pointer; }
.bld-chip.active { background: var(--accent-subtle); border-color: var(--accent); color: var(--accent-text); }
.bld-doclist { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: .4rem; }
.bld-doc { display: inline-flex; align-items: center; gap: .35rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: 999px; padding: .2rem .6rem; font-size: .76rem; color: var(--text); }
.bld-doc i { font-style: normal; color: var(--text-subtle); }
.bld-doc button { border: none; background: none; color: var(--text-subtle); cursor: pointer; font-size: .8rem; padding: 0; }
.bld-docbtns { display: flex; gap: .5rem; }
.bld-foot { display: flex; align-items: center; gap: .8rem; justify-content: flex-end; margin-top: .4rem; }
.bld-foot .bld-quota { margin-right: auto; font-size: .75rem; color: var(--text-subtle); }
.bld-gen-note { font-size: .78rem; color: var(--text-muted); }
.bld-note { font-size: .78rem; color: var(--text-subtle); line-height: 1.5; margin: .2rem 0 0; }
.bld-paste { width: min(560px, 100%); }
#bld-dock {
    position: fixed; top: 56px; right: 0; bottom: 0; width: min(400px, 92vw); z-index: 240;
    display: flex; flex-direction: column; background: var(--surface); border-left: 1px solid var(--border);
    box-shadow: var(--shadow-xl);
}
.bld-dock-head { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .6rem .8rem; border-bottom: 1px solid var(--border); }
.bld-dock-head b { font-size: .88rem; color: var(--text); display: block; }
.bld-dock-head span { font-size: .72rem; color: var(--text-muted); }
.bld-assum { border-bottom: 1px solid var(--border); padding: .4rem .8rem; font-size: .78rem; color: var(--text-muted); }
.bld-assum summary { cursor: pointer; font-weight: 600; color: var(--text); }
.bld-assum b { display: block; margin-top: .4rem; color: var(--text); }
.bld-assum ul { margin: .2rem 0 .3rem; padding-left: 1.1rem; }
.bld-msgs { flex: 1; overflow-y: auto; padding: .7rem .8rem; display: flex; flex-direction: column; gap: .5rem; }
.bld-msgs .ai-msg ul { margin: .3rem 0 0; padding-left: 1.1rem; }
#bld-dock .ai-input { border-top: 1px solid var(--border); }
.bld-dock-foot { display: flex; gap: .5rem; padding: .55rem .8rem; border-top: 1px solid var(--border); }
.proj-hero-btns { display: flex; gap: .5rem; flex-wrap: wrap; }

/* ── Builder B3a: async in-library generation ── */
.bld-card { display: flex; align-items: center; justify-content: space-between; gap: .8rem; flex-wrap: wrap;
    padding: .7rem .9rem; margin-bottom: .7rem; border: 1px solid var(--accent-border); border-radius: var(--r-md);
    background: var(--accent-subtle); }
.bld-card.is-failed { border-color: var(--danger, #b3261e); background: color-mix(in srgb, var(--danger, #b3261e) 6%, var(--surface)); }
.bld-card-main { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; min-width: 0; }
.bld-card-tag { font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
    padding: .12rem .4rem; border-radius: 999px; background: var(--accent); color: #fff; }
.bld-card-name { font-weight: 600; font-size: .88rem; color: var(--text); }
.bld-card-state { font-size: .78rem; color: var(--text-muted); display: inline-flex; align-items: center; gap: .4rem; }
.bld-card-state.ok { color: var(--accent); font-weight: 600; }
.bld-card-state.err { color: var(--danger, #b3261e); }
.bld-card-actions { display: flex; gap: .4rem; }
.bld-spin { width: 12px; height: 12px; border: 2px solid var(--accent-border); border-top-color: var(--accent);
    border-radius: 50%; animation: bldspin .9s linear infinite; flex: none; }
@keyframes bldspin { to { transform: rotate(360deg); } }
.bld-tag-ai { font-size: .6rem; font-weight: 700; padding: .1rem .32rem; border-radius: 4px;
    background: var(--accent-subtle); color: var(--accent); border: 1px solid var(--accent-border); vertical-align: 1px; }
.bld-toast { position: fixed; right: 18px; bottom: 18px; z-index: 400; max-width: 360px;
    padding: .7rem .95rem; border-radius: var(--r-md); background: var(--text); color: var(--surface);
    font-size: .8rem; box-shadow: var(--shadow-xl); }
.bld-toast.err { background: var(--danger, #b3261e); color: #fff; }
.bld-review { width: min(680px, 100%); }
.bld-outline-table input[type=text], .bld-outline-table input[type=number], .bld-outline-table select {
    width: 100%; height: 30px; padding: 0 .5rem; border: 1px solid var(--border); border-radius: var(--r-sm);
    background: var(--surface); color: var(--text); font-family: inherit; font-size: .8rem; }
.bld-branch-sum { font-size: .68rem; color: var(--text-subtle); margin-top: .2rem; line-height: 1.35; }
.bld-static { font-size: .8rem; color: var(--text-muted); padding: .45rem 0; }
.bld-prov { font-size: .68rem; color: var(--text-subtle); padding: .35rem .8rem; border-bottom: 1px solid var(--border);
    text-transform: uppercase; letter-spacing: .04em; }
.bld-warns summary { color: var(--warn, #9a6a00); }
.bld-vers li { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.bld-docfacts { margin: 0; padding-left: 1.1rem; font-size: .78rem; color: var(--text-muted); line-height: 1.55;
    max-height: 180px; overflow-y: auto; }
.bld-docfacts b { color: var(--text); }
.bld-gov { font-size: .68rem; color: var(--text-subtle); margin-top: .4rem; }
.bld-res-toggle { display: flex; align-items: flex-start; gap: .55rem; font-size: .78rem; color: var(--text-muted);
    padding: .6rem .8rem; margin: .2rem 0 .1rem; cursor: pointer; border: 1px solid var(--border);
    border-radius: var(--r-md); background: var(--surface-2, var(--surface)); line-height: 1.45;
    text-transform: none; letter-spacing: 0; font-weight: 400; }
.bld-res-toggle input { margin-top: .15rem; flex: none; }
.bld-res-toggle b { color: var(--text); font-weight: 600; }
.bld-card-errdetail { display: block; font-size: .68rem; color: var(--text-subtle); margin-top: .15rem; }
.bldr-res-branch { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; padding: .3rem 0;
    border-bottom: 1px solid var(--border); font-size: .78rem; }
.bldr-res-branch b { min-width: 140px; color: var(--text); font-size: .76rem; }
.bldr-res-row { display: inline-flex; align-items: center; gap: .2rem; }
.bldr-res-row input[type=text] { width: 150px; height: 28px; padding: 0 .45rem; border: 1px solid var(--border);
    border-radius: var(--r-sm); background: var(--surface); color: var(--text); font-family: inherit; font-size: .76rem; }
.bldr-res-row input[type=number] { width: 54px; height: 28px; padding: 0 .3rem; border: 1px solid var(--border);
    border-radius: var(--r-sm); background: var(--surface); color: var(--text); font-family: inherit; font-size: .76rem; }
/* staged review: level-2 section rows nested under a phase */
.bldr-secs { display: flex; flex-direction: column; gap: .25rem; margin-top: .3rem; }
.bldr-sec-row { display: flex; align-items: center; gap: .3rem; padding-left: .9rem; }
.bldr-sec-tick { color: var(--text-subtle); font-size: .72rem; }
.bldr-sec-row input[type=text] { max-width: 320px; height: 28px; font-size: .76rem; }
.bldr-sec-add { align-self: flex-start; margin-left: .9rem; }
.bldr-addrow { display: flex; align-items: center; gap: .5rem; margin-top: .5rem; font-size: .78rem; }
.bldr-addrow label { font-size: .72rem; color: var(--text-subtle); text-transform: none; letter-spacing: 0; }
.bldr-addrow select { height: 30px; padding: 0 .5rem; border: 1px solid var(--border); border-radius: var(--r-sm);
    background: var(--surface); color: var(--text); font-family: inherit; font-size: .78rem; max-width: 320px; }
/* staged review: assumption / risk registers are now single textareas */
.bldr-reg { min-height: 96px; line-height: 1.5; }

/* ── v0.43 commercial-grade builder chrome (wizard · interview · review) ── */
.bld-modal.bld-wizard, .bld-modal.bld-review, .bld-modal.bld-qmodal { width: min(760px, 100%); }
.bld-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem;
    padding: 1.05rem 1.3rem .95rem; border-bottom: 1px solid var(--border); }
.bld-modal-head h3 { font-size: 1.08rem; font-weight: 700; letter-spacing: -.01em; margin: 0; }
.bld-modal-sub { font-size: .78rem; color: var(--text-subtle); line-height: 1.5; margin: .3rem 0 0; max-width: 62ch; }
.bld-modal-foot { display: flex; align-items: center; justify-content: space-between; gap: .8rem;
    padding: .9rem 1.3rem; border-top: 1px solid var(--border); background: var(--surface-2, var(--surface)); }
.bld-foot-left { display: flex; gap: .5rem; }
/* stepper */
.bld-stepper { display: flex; align-items: center; gap: .1rem; padding: .7rem 1.3rem; border-bottom: 1px solid var(--border);
    background: var(--surface-2, var(--bg)); flex-wrap: wrap; }
.bld-stepper-item { display: inline-flex; align-items: center; gap: .45rem; font-size: .76rem; font-weight: 600;
    color: var(--text-subtle); white-space: nowrap; }
.bld-stepper-item.active { color: var(--text); }
.bld-stepper-num { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px;
    border-radius: 50%; background: var(--border); color: var(--text-muted); font-size: .7rem; font-weight: 700; }
.bld-stepper-item.active .bld-stepper-num { background: var(--accent); color: #fff; }
.bld-stepper-item.done .bld-stepper-num { background: var(--accent-subtle); color: var(--accent); }
.bld-stepper-sep { flex: 0 1 34px; height: 1px; min-width: 14px; background: var(--border); margin: 0 .35rem; }
.bld-step-panel { display: flex; flex-direction: column; gap: .85rem; }
.bld-step-lead { font-size: .82rem; color: var(--text-muted); line-height: 1.55; margin: 0; }
.bld-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--r-md); }
.bld-table-wrap .bld-outline-table { margin: 0; }
/* interview (questions) */
.bld-qbody { gap: 0 !important; padding-top: .4rem; }
.bld-qlist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .2rem; }
.bld-q { padding: .85rem 0; border-bottom: 1px solid var(--border); }
.bld-q:last-child { border-bottom: none; }
.bld-q-text { font-size: .88rem; font-weight: 600; color: var(--text); line-height: 1.4; }
.bld-q-why { font-size: .74rem; color: var(--text-subtle); margin-top: .2rem; }
.bld-q-sugs { display: flex; flex-wrap: wrap; gap: .35rem; margin: .5rem 0 .1rem; }
.bld-q-sug { font-size: .74rem; padding: .28rem .6rem; border: 1px solid var(--accent-border); border-radius: 999px;
    background: var(--accent-subtle); color: var(--accent); cursor: pointer; }
.bld-q-sug:hover { background: var(--accent); color: #fff; }
.bld-q-ans { margin-top: .5rem; min-height: 52px; }
/* resource step */
.bldr-res-branch { display: block; padding: .6rem .75rem; border: 1px solid var(--border); border-radius: var(--r-md); }
.bldr-res-branch b { display: block; font-size: .82rem; color: var(--text); margin-bottom: .5rem; }
.bldr-res-rows { display: flex; flex-direction: column; gap: .35rem; margin-bottom: .4rem; }
.bldr-res-x { color: var(--text-subtle); font-size: .8rem; }
.bldr-res-head { display: flex; gap: .2rem; padding: 0 .75rem .1rem; font-size: .66rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .04em; color: var(--text-subtle); }
.bldr-res-head span:nth-child(1) { flex: 0 0 158px; }
.bldr-res-head span:nth-child(2) { flex: 0 0 74px; }
.bldr-res-head span:nth-child(3) { flex: 0 0 90px; }
.bldr-res-row input[data-rrate] { width: 66px; height: 28px; padding: 0 .3rem; border: 1px solid var(--border);
    border-radius: var(--r-sm); background: var(--surface); color: var(--text); font-family: inherit; font-size: .76rem; }
/* resource LIBRARY editor (detailed / custom modes) */
.bldr-lib-head, .bldr-lib-row { display: grid; grid-template-columns: minmax(130px, 1fr) 108px 84px 74px 30px; gap: .4rem; align-items: center; }
.bldr-lib-head { padding: 0 .1rem .25rem; font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-subtle); }
#bldr-lib { display: flex; flex-direction: column; gap: .35rem; }
.bldr-lib-row input, .bldr-lib-row select { height: 30px; padding: 0 .45rem; border: 1px solid var(--border); border-radius: var(--r-sm);
    background: var(--surface); color: var(--text); font-family: inherit; font-size: .78rem; min-width: 0; }
.bldr-lib-row input[type=number] { text-align: right; }
.bldr-lib-row .btn-icon { justify-self: center; }
/* wizard: adopt-from-sample checklist */
.bld-sample-adopt { margin-top: .5rem; padding: .55rem .7rem; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2, var(--bg)); }
.bld-adopt-lead { font-size: .74rem; font-weight: 700; color: var(--text-muted); margin-bottom: .35rem; }
.bld-adopt-row { display: flex; align-items: baseline; gap: .4rem; font-size: .78rem; padding: .18rem 0; cursor: pointer; }
.bld-adopt-row b { font-weight: 600; color: var(--text); }
/* dock: long assumption/risk/warning lists scroll instead of pushing the chat away */
#bld-dock .bld-assum > ul, #bld-dock .bld-assum > ul + b + ul { max-height: 160px; overflow-y: auto; }
#bld-dock .bld-assum[open] { max-height: 240px; overflow-y: auto; }
/* dock: header buttons + minimized launcher chip */
.bld-dock-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.bld-dock-title { min-width: 0; }
.bld-dock-headbtns { display: flex; gap: .15rem; flex: none; }
#bld-dock-min { font-size: 1.1rem; line-height: 1; }
.bld-dock-chip { position: fixed; right: 18px; bottom: 18px; z-index: 50; display: inline-flex; align-items: center; gap: .45rem;
    padding: .55rem .9rem; border: 1px solid var(--accent-border); border-radius: 999px; background: var(--accent);
    color: #fff; font-family: inherit; font-size: .8rem; font-weight: 600; cursor: pointer;
    box-shadow: 0 6px 20px rgba(0,0,0,.18); }
.bld-dock-chip:hover { filter: brightness(1.05); }
.bld-chip-dot { width: 8px; height: 8px; border-radius: 50%; background: #fff; opacity: .9; }
.bld-lock .bld-lock-lead { font-size: .92rem; font-weight: 600; color: var(--text); margin: 0 0 .5rem; }
.bld-lock-list { margin: 0 0 .8rem; padding-left: 1.1rem; font-size: .8rem; color: var(--text-muted); line-height: 1.55; }
.bld-lock-how { font-size: .82rem; color: var(--text); background: var(--accent-subtle); border: 1px solid var(--accent-border);
    border-radius: var(--r-md); padding: .6rem .8rem; }
.bld-locked { position: relative; }
.bld-locked::after { content: '🔒'; font-size: .7rem; margin-left: .3rem; }

/* ── Export schedule (.xer / MS Project .xml) chooser ── */
.exp-modal { width: min(480px, 100%); }
.exp-body { padding: 1rem 1.1rem 1.2rem; display: flex; flex-direction: column; gap: .6rem; }
.exp-card { display: block; text-align: left; padding: .75rem .9rem; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); cursor: pointer; font-family: inherit; }
.exp-card:hover { border-color: var(--accent); background: var(--accent-subtle); }
.exp-card b { display: block; font-size: .9rem; color: var(--text); margin-bottom: .15rem; }
.exp-card span { font-size: .76rem; color: var(--text-muted); }
.exp-note { font-size: .72rem; color: var(--text-subtle); margin: .3rem 0 0; }

/* ═══════════════════════════════════════════════════════════════════════════
   REPORT builder — options modal + full-screen preview + print document
   The document (.rep-doc) always renders as white paper with a fixed light
   palette, independent of the app theme; --rep-accent carries the brand colour.
   ═══════════════════════════════════════════════════════════════════════════ */
.rep-modal { width: min(600px, 100%); }
.rep-body { padding: 1rem 1.1rem; display: flex; flex-direction: column; gap: 1.1rem; overflow-y: auto; }
.rep-group-title { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--text-subtle); font-weight: 700; margin-bottom: .5rem; }
.rep-brand-row { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.rep-brand-row input[type=text] { flex: 1; min-width: 200px; height: 34px; padding: 0 .6rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface); color: var(--text); font-family: inherit; }
.rep-color { display: inline-flex; align-items: center; gap: .4rem; font-size: .8rem; color: var(--text-muted); }
.rep-color input { width: 34px; height: 34px; border: 1px solid var(--border); border-radius: var(--r-sm); padding: 2px; background: var(--surface); cursor: pointer; }
.rep-logo-preview { height: 30px; max-width: 110px; object-fit: contain; border-radius: 4px; }
.rep-seclist { display: flex; flex-direction: column; gap: .4rem; }
.rep-sec { display: flex; gap: .6rem; align-items: flex-start; padding: .5rem .65rem; border: 1px solid var(--border); border-radius: var(--r-md); cursor: pointer; background: var(--surface); }
.rep-sec:hover { border-color: var(--accent); }
.rep-sec.off { opacity: .55; cursor: default; }
.rep-sec.off:hover { border-color: var(--border); }
.rep-sec input { margin-top: .2rem; }
.rep-sec-txt b { display: block; font-size: .84rem; color: var(--text); }
.rep-sec-txt i { font-style: normal; font-size: .74rem; color: var(--text-subtle); }
.rep-note { font-size: .74rem; color: var(--text-subtle); }
.rep-modal .proj-picker-foot { display: flex; align-items: center; gap: .75rem; }
.rep-modal .proj-picker-foot .rep-note { margin-right: auto; }

/* full-screen preview (PDF-viewer style: dark backdrop, white sheet) */
#rep-preview { position: fixed; inset: 0; z-index: 300; display: flex; flex-direction: column; background: #43464d; }
.rep-pv-bar { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .55rem .9rem; background: var(--surface); border-bottom: 1px solid var(--border); }
.rep-pv-title b { font-size: .9rem; color: var(--text); }
.rep-pv-title span { margin-left: .55rem; color: var(--text-muted); font-size: .8rem; }
.rep-pv-actions { display: flex; gap: .5rem; }
.rep-pv-scroll { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 1.6rem .75rem 3.5rem; }
.rep-doc { width: min(210mm, 100%); margin: 0 auto; background: #fff; padding: 14mm 16mm 18mm; border-radius: 3px; box-shadow: 0 14px 44px rgba(0, 0, 0, .45); }

/* ── the document itself (shared by screen preview and print) ── */
.rep-doc { font-family: 'Inter', system-ui, sans-serif; font-size: .84rem; line-height: 1.55; color: #111827; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.rep-doc h1 { font-size: 2rem; letter-spacing: -.02em; color: #111827; line-height: 1.15; margin: 0 0 .35rem; }
.rep-doc h2 { font-size: 1.28rem; color: #111827; letter-spacing: -.01em; margin: .1rem 0 .15rem; }
.rep-doc h3 { font-size: .95rem; color: #111827; margin: 1.1rem 0 .45rem; }

/* cover */
.rep-cover { break-after: page; page-break-after: always; }
.rep-cover-band { height: 6px; background: var(--rep-accent, #4f46e5); border-radius: 2px; margin-bottom: 1.4rem; }
.rep-cover-brand { display: flex; align-items: center; gap: .7rem; font-weight: 700; font-size: 1rem; color: #374151; min-height: 28px; margin-bottom: 2.4rem; }
.rep-cover-brand img { height: 40px; object-fit: contain; }
.rep-cover-eyebrow { font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--rep-accent, #4f46e5); font-weight: 800; margin-bottom: .45rem; }
.rep-cover-sub { font-size: .88rem; color: #6b7280; margin-bottom: 1.7rem; }
.rep-cover-score { display: flex; align-items: center; gap: 1.3rem; padding: 1rem 1.2rem; border: 1px solid #e5e7eb; border-radius: 12px; background: #f9fafb; margin-bottom: 1.5rem; break-inside: avoid; }
.rep-cover-grade label { display: block; font-size: .64rem; text-transform: uppercase; letter-spacing: .07em; color: #6b7280; font-weight: 700; }
.rep-cover-grade b { font-size: 1.25rem; color: #111827; }
.rep-cover-grade p { font-size: .8rem; color: #4b5563; margin: .25rem 0 0; max-width: 52ch; }
.rep-cover-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem 1.2rem; margin-bottom: 1.7rem; }
.rep-cover-meta label { display: block; font-size: .62rem; text-transform: uppercase; letter-spacing: .06em; color: #6b7280; font-weight: 700; }
.rep-cover-meta b { font-size: .92rem; color: #111827; font-variant-numeric: tabular-nums; }
.rep-cover-toc { border-top: 1px solid #e5e7eb; padding-top: 1rem; }
.rep-cover-toc > label { font-size: .64rem; text-transform: uppercase; letter-spacing: .08em; color: #6b7280; font-weight: 800; }
.rep-cover-toc ol { margin: .5rem 0 0; padding-left: 1.25rem; }
.rep-cover-toc li { font-size: .82rem; padding: .18rem 0; color: #111827; }
.rep-cover-toc li span { color: #6b7280; }
.rep-cover-toc li span::before { content: ' — '; }
.rep-cover-foot { margin-top: 2rem; font-size: .74rem; color: #6b7280; font-weight: 600; }

/* section frame */
.rep-doc .rep-section { break-before: page; page-break-before: always; margin-top: 2.2rem; }
.rep-sec-head { border-bottom: 2px solid var(--rep-accent, #4f46e5); padding-bottom: .5rem; margin-bottom: .9rem; }
.rep-sec-eyebrow { font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: var(--rep-accent, #4f46e5); font-weight: 800; }
.rep-sec-q { font-size: .84rem; color: #6b7280; font-style: italic; }
.rep-answer { display: flex; gap: .8rem; align-items: flex-start; background: #f9fafb; border: 1px solid #e5e7eb; border-left: 4px solid var(--rep-accent, #4f46e5); border-radius: 0 8px 8px 0; padding: .6rem .85rem; margin-bottom: 1rem; break-inside: avoid; page-break-inside: avoid; }
.rep-answer > span { flex: 0 0 auto; font-size: .6rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: var(--rep-accent, #4f46e5); padding-top: .22rem; }
.rep-answer p { font-size: .88rem; line-height: 1.6; color: #1f2937; margin: 0; }

/* KPI tiles */
.rep-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; margin-bottom: .9rem; break-inside: avoid; page-break-inside: avoid; }
.rep-tiles-4 { grid-template-columns: repeat(4, 1fr); }
.rep-tile { border: 1px solid #e5e7eb; border-top: 3px solid var(--rep-accent, #4f46e5); border-radius: 8px; padding: .55rem .7rem; background: #fff; }
.rep-tile.good { border-top-color: #15803d; }
.rep-tile.warn { border-top-color: #b45309; }
.rep-tile.bad { border-top-color: #b91c1c; }
.rep-tile-val { font-size: 1.18rem; font-weight: 800; letter-spacing: -.01em; color: #111827; font-variant-numeric: tabular-nums; }
.rep-of { font-size: .72rem; color: #6b7280; font-weight: 700; }
.rep-tile-label { font-size: .66rem; text-transform: uppercase; letter-spacing: .05em; color: #6b7280; font-weight: 700; margin-top: .1rem; }
.rep-tile-sub { font-size: .7rem; color: #6b7280; margin-top: .1rem; }

/* verdict, findings, actions */
.rep-verdict { font-size: .86rem; line-height: 1.7; color: #1f2937; background: #f9fafb; border-left: 3px solid var(--rep-accent, #4f46e5); padding: .6rem .85rem; border-radius: 0 6px 6px 0; }
.rep-findings { list-style: none; margin: 0; padding: 0; }
.rep-findings li { display: flex; gap: .55rem; align-items: flex-start; padding: .28rem 0; font-size: .84rem; line-height: 1.55; color: #1f2937; }
.rep-findings.rep-plain { list-style: disc; padding-left: 1.2rem; }
.rep-findings.rep-plain li { display: list-item; }
.rep-chip { flex: 0 0 auto; font-size: .6rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; border-radius: 999px; padding: .14rem .5rem; margin-top: .15rem; }
.rep-chip.crit { background: #fee2e2; color: #b91c1c; }
.rep-chip.warn { background: #fef3c7; color: #92400e; }
.rep-chip.info { background: #f3f4f6; color: #374151; }
.rep-actions { margin: 0; padding-left: 1.3rem; }
.rep-actions li { font-size: .86rem; line-height: 1.6; padding: .22rem 0; color: #1f2937; }
.rep-actions b { color: #111827; }

/* charts */
.rep-chart { margin: .9rem 0 1.1rem; break-inside: avoid; page-break-inside: avoid; }
.rep-chart figcaption { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; font-size: .78rem; font-weight: 700; color: #374151; margin-bottom: .35rem; }
.rep-legend { display: inline-flex; gap: .8rem; font-weight: 600; color: #6b7280; font-size: .72rem; white-space: nowrap; }
.rep-lg { display: inline-flex; align-items: center; gap: .3rem; }
.rep-lg i { width: 14px; height: 3px; border-radius: 2px; display: inline-block; }
.rep-chart svg { width: 100%; height: auto; display: block; }

/* tables */
.rep-table { width: 100%; border-collapse: collapse; font-size: .78rem; margin-bottom: .4rem; }
.rep-table th, .rep-table td { border-bottom: 1px solid #e5e7eb; padding: .34rem .55rem; text-align: left; vertical-align: top; color: #1f2937; }
.rep-table thead th { background: #f3f4f6; font-size: .64rem; text-transform: uppercase; letter-spacing: .05em; color: #4b5563; border-bottom: 1.5px solid #d1d5db; }
.rep-table tbody tr:nth-child(even) td { background: #fafafa; }
.rep-table .rep-num, .rep-table th.rep-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rep-kv tr:nth-child(even) td { background: none; }
.rep-kv td:first-child { width: 40%; color: #4b5563; font-weight: 600; background: #f9fafb !important; }
.rep-pass td:last-child { color: #15803d; font-weight: 700; }
.rep-fail td:last-child { color: #b91c1c; font-weight: 700; }
.rep-late { color: #b91c1c; }
.rep-early { color: #15803d; }
.rep-flags span { display: inline-block; font-size: .62rem; font-weight: 700; background: #f3f4f6; color: #4b5563; border-radius: 4px; padding: .05rem .35rem; margin: 0 .2rem .15rem 0; }

/* in-table bars */
.rep-hbar { position: relative; background: #f3f4f6; border-radius: 4px; height: 14px; min-width: 90px; overflow: hidden; }
.rep-hbar i { position: absolute; top: 0; bottom: 0; left: 0; background: var(--rep-accent, #4f46e5); opacity: .8; border-radius: 4px; }
.rep-hbar span { position: relative; font-size: .64rem; font-weight: 700; color: #111827; padding-left: .4rem; line-height: 14px; }
.rep-vbar { position: relative; height: 12px; background: #f3f4f6; border-radius: 3px; min-width: 110px; overflow: hidden; }
.rep-vbar::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; background: #d1d5db; }
.rep-vbar i { position: absolute; top: 0; bottom: 0; }
.rep-vbar i.pos { left: 50%; background: #dc2626; border-radius: 0 3px 3px 0; }
.rep-vbar i.neg { right: 50%; background: #16a34a; border-radius: 3px 0 0 3px; }

/* DCMA 14-point visual grid */
.rep-dcma-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: .45rem; margin-bottom: 1rem; break-inside: avoid; page-break-inside: avoid; }
.rep-dcma { border: 1px solid #e5e7eb; border-top: 3px solid #d1d5db; border-radius: 7px; padding: .4rem .45rem .45rem; background: #fff; }
.rep-dcma b { font-size: .78rem; color: #111827; display: block; }
.rep-dcma span { display: block; font-size: .56rem; line-height: 1.25; color: #6b7280; min-height: 2.2em; margin: .1rem 0; }
.rep-dcma em { font-style: normal; font-size: .66rem; font-weight: 800; color: #9ca3af; }
.rep-dcma.pass { border-top-color: #15803d; }
.rep-dcma.pass em { color: #15803d; }
.rep-dcma.fail { border-top-color: #b91c1c; background: #fef2f2; }
.rep-dcma.fail em { color: #b91c1c; }

/* misc */
.rep-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.4rem; }
.rep-cols > div:only-child { grid-column: 1 / -1; }
.rep-path { font-size: .78rem; line-height: 1.8; color: #374151; word-break: break-word; }
.rep-note-block { font-size: .82rem; color: #6b7280; font-style: italic; }
.rep-stamp { margin-top: 2rem; padding-top: .6rem; border-top: 1px solid #e5e7eb; font-size: .72rem; color: #4b5563; font-weight: 600; }
.rep-stamp p { font-size: .6rem; color: #9ca3af; font-weight: 400; line-height: 1.5; margin-top: .3rem; }

/* print: hide the app, let the preview's document flow onto A4 pages.
   The report's portrait @page rule is injected by report.js only while the
   preview is open, so the Gantt export keeps its landscape @page. */
@media print {
    body.report-printing { background: #fff !important; }
    body.report-printing > *:not(#rep-preview) { display: none !important; }
    body.report-printing #rep-preview { position: static; display: block; background: none; }
    body.report-printing .rep-pv-bar { display: none !important; }
    body.report-printing .rep-pv-scroll { overflow: visible; padding: 0; }
    body.report-printing .rep-doc { width: auto; box-shadow: none; padding: 0; border-radius: 0; margin: 0; }
    body.report-printing .rep-doc .rep-section { margin-top: 0; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   SETTINGS — fixed-size professional dialog
   ═══════════════════════════════════════════════════════════════════════════ */
.settings-dialog { width: min(780px, 94vw) !important; height: min(560px, 88vh) !important; max-width: none !important; display: flex; flex-direction: column; border-radius: var(--r-lg); border: 1px solid var(--border); box-shadow: var(--shadow-xl); overflow: hidden; }
.settings-dlg-head { flex: 0 0 auto; border-bottom: 1px solid var(--border); }
.settings-dlg-body { flex: 1; display: flex; min-height: 0; }
.settings-tabs { flex: 0 0 176px; display: flex; flex-direction: column; gap: 2px; padding: .75rem .5rem; border-right: 1px solid var(--border); background: var(--surface-2); }
.settings-tab { text-align: left; border: none; background: transparent; color: var(--text-muted); font-weight: 600; font-size: .84rem; padding: .5rem .7rem; border-radius: var(--r-sm); cursor: pointer; font-family: inherit; }
.settings-tab:hover { background: var(--surface-3); color: var(--text); }
.settings-tab.active { background: var(--accent-subtle); color: var(--accent-text); }
.settings-pane { flex: 1; overflow-y: auto; padding: 1.1rem 1.3rem; }
.set-currency { display: flex; align-items: center; gap: .35rem; flex-wrap: wrap; }

/* inline baseline Change control inside the delay meta strip */
.delay-meta #delay-change-bl { margin: -2px .15rem; vertical-align: middle; }

/* Settings ▸ About */
.about-hero { display: flex; align-items: center; gap: .9rem; padding: .35rem 0 1rem; color: var(--accent-text); }
.about-name { font-size: 1.05rem; font-weight: 800; color: var(--text); letter-spacing: -.01em; }
.about-ver { font-size: .85rem; color: var(--text-muted); font-weight: 600; margin-top: .1rem; }
.about-chip {
    background: var(--accent-subtle); color: var(--accent-text); border-radius: 999px;
    font-size: .68rem; font-weight: 700; padding: .1rem .5rem; vertical-align: 1px;
}
.about-date { font-size: .78rem; color: var(--text-subtle); margin-top: .1rem; }
.about-log { display: flex; flex-direction: column; gap: .7rem; }
.about-rel { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-md); padding: .6rem .8rem; }
.about-relhead { display: flex; align-items: baseline; gap: .6rem; margin-bottom: .3rem; }
.about-relhead strong { color: var(--text); font-size: .85rem; }
.about-relhead span { color: var(--text-subtle); font-size: .74rem; }
.about-rel ul { margin: 0; padding-left: 1.1rem; }
.about-rel li { font-size: .8rem; color: var(--text-muted); line-height: 1.5; }
.cur-btn { min-width: 40px; }
#set-cur-custom { width: 64px; height: 31px; padding: 0 .5rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface); color: var(--text); font-family: inherit; text-align: center; }

/* mobile: settings tabs become a horizontal scrollable row (restores the
   components.css ≤768px behaviour that the rules above would otherwise win) */
@media (max-width: 768px) {
    .settings-tabs { flex: 0 0 auto; flex-direction: row; overflow-x: auto; border-right: none; border-bottom: 1px solid var(--border); }
    .settings-tab { white-space: nowrap; }
}

/* table density */
body.density-compact .data-table th, body.density-compact .data-table td { padding-top: .28rem; padding-bottom: .28rem; font-size: .78rem; }
body.density-compact .codes-table th, body.density-compact .codes-table td { padding-top: .3rem; padding-bottom: .3rem; }
body.density-compact .codes-acts th, body.density-compact .codes-acts td { padding-top: .22rem; padding-bottom: .22rem; }

/* ═══════════════════════════════════════════════════════════════════════════
   Whole-app sweep
   ═══════════════════════════════════════════════════════════════════════════ */
.auth-screen { background: var(--bg); }
.auth-card { background: var(--surface); }
.auth-brand svg { color: var(--text); width: 32px; height: 32px; }
.auth-tagline { font-size: .78rem; color: var(--text-muted); margin: -1rem 0 1.4rem; line-height: 1.45; }
.auth-form input { background: var(--surface); color: var(--text); border: 1px solid var(--border); }
.auth-form input:focus { border-color: var(--accent); }
.admin-screen { background: var(--bg); }
.admin-head { background: var(--surface); }
.main-panel, .apanel { animation: panel-in .18s ease; }
@keyframes panel-in { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }
.badge { border-radius: 999px; font-weight: 600; }
.dropzone { border-color: var(--border-strong); background: var(--surface-2); }
.dropzone:hover, .dropzone.drag-over { border-color: var(--accent); background: var(--accent-subtle); }

/* ── Dark-mode AA contrast overrides (lightness-only, hues preserved) ─────────
   White-on-colour pairs that pass in light mode fail against the brighter dark
   palette values; each override darkens the background (or restores the bright
   dark-palette text where the light default was darkened above). */
:root[data-theme="dark"] .btn-danger { background: #e11d48; border-color: #e11d48; }
:root[data-theme="dark"] .proj-hero-card.accent { background: linear-gradient(135deg, #4f46e5, #4338ca); }
:root[data-theme="dark"] #demo-banner { background: linear-gradient(90deg, #4f46e5, #4338ca); }
:root[data-theme="dark"] .wi-tag,
:root[data-theme="dark"] .proj-curtag { background: #4f46e5; }
:root[data-theme="dark"] .gantt-arrow.wi-added { stroke: #818cf8; }
:root[data-theme="dark"] .pf-score.rag-red { color: #0b1220; }
:root[data-theme="dark"] .wi-log-imp.late { color: var(--red, #fb7185); }
:root[data-theme="dark"] .wi-log-imp.early { color: var(--green, #22c55e); }
:root[data-theme="dark"] .ppi-rel.yes { color: var(--green, #22c55e); }