/* ── Toast ── */
    #v9-toast-wrap {
      position: fixed;
      bottom: 24px;
      left: 24px;
      z-index: 9999;
      display: flex;
      flex-direction: column-reverse;
      gap: 8px;
      pointer-events: none
    }

    .v9-toast {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 11px 16px;
      border-radius: 10px;
      font-size: 12.5px;
      font-weight: 600;
      color: #fff;
      backdrop-filter: blur(16px);
      box-shadow: 0 8px 28px rgba(0, 0, 0, .4);
      border: 1px solid;
      pointer-events: all;
      animation: v9ti .22s ease;
      transition: opacity .28s, transform .28s
    }

    .v9-toast.ok {
      background: rgba(10, 38, 20, .92);
      border-color: rgba(34, 197, 94, .4);
      color: #86efac
    }

    .v9-toast.warn {
      background: rgba(50, 32, 6, .92);
      border-color: rgba(245, 158, 11, .4);
      color: #fde68a
    }

    .v9-toast.err {
      background: rgba(50, 8, 8, .92);
      border-color: rgba(239, 68, 68, .4);
      color: #fca5a5
    }

    .v9-toast.info {
      background: rgba(8, 22, 50, .92);
      border-color: rgba(59, 130, 246, .4);
      color: #bfdbfe
    }

    @keyframes v9ti {
      from {
        opacity: 0;
        transform: translateX(16px)
      }

      to {
        opacity: 1;
        transform: none
      }
    }

    /* ── Overlay progress ── */
    .v9-progress {
      height: 3px;
      border-radius: 999px;
      background: rgba(59, 130, 246, .1);
      margin: 14px 0 0;
      overflow: hidden
    }

    .v9-progress-bar {
      height: 100%;
      border-radius: 999px;
      background: linear-gradient(90deg, #3b82f6, #06b6d4);
      transition: width .35s;
      width: 0
    }

    /* ── Tab fade ── */
    .tp.active {
      animation: v9tab .18s ease
    }

    @keyframes v9tab {
      from {
        opacity: 0;
        transform: translateY(2px)
      }

      to {
        opacity: 1;
        transform: none
      }
    }

    /* ── Version badge ── */
    .v9-badge {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 4px 10px;
      border-radius: 999px;
      background: linear-gradient(90deg, rgba(59, 130, 246, .15), rgba(6, 182, 212, .1));
      border: 1px solid rgba(59, 130, 246, .28);
      font-size: 10px;
      font-weight: 800;
      color: #7dd3fc;
      letter-spacing: .5px
    }

    /* ── AI chat ── */
    .v9-quick-actions {
      display: flex;
      gap: 6px;
      flex-wrap: wrap;
      margin: 10px 0 6px
    }

    .v9-qa {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 6px 12px;
      border-radius: 999px;
      border: 1px solid rgba(139, 92, 246, .25);
      background: rgba(139, 92, 246, .07);
      color: #c4b5fd;
      font-size: 11px;
      font-weight: 700;
      cursor: pointer;
      transition: all .15s;
      font-family: inherit;
      white-space: nowrap
    }

    .v9-qa:hover {
      border-color: rgba(139, 92, 246, .5);
      background: rgba(139, 92, 246, .14);
      transform: translateY(-1px)
    }

    .v9-chat-ctx {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 12px;
      border-radius: 8px;
      background: rgba(5, 12, 28, .7);
      border: 1px solid rgba(59, 130, 246, .12);
      font-size: 11px;
      color: var(--mu);
      margin-bottom: 8px
    }

    .v9-ctx-pill {
      padding: 2px 8px;
      border-radius: 999px;
      background: rgba(59, 130, 246, .1);
      border: 1px solid rgba(59, 130, 246, .18);
      color: #93c5fd;
      font-size: 10px;
      font-weight: 800;
      font-family: 'JetBrains Mono', monospace
    }

    /* ── Export buttons ── */
    .ebtn.excel {
      border-color: rgba(34, 197, 94, .3);
      color: #4ade80
    }

    .ebtn.excel:hover {
      background: rgba(34, 197, 94, .08)
    }

    .ebtn.pdf {
      border-color: rgba(239, 68, 68, .3);
      color: #f87171
    }

    .ebtn.pdf:hover {
      background: rgba(239, 68, 68, .08)
    }

    /* ── Print ── */
    @media print {

      .hdr,
      .tabs,
      .gen-bar,
      .chat-row,
      .exp-bar,
      .hbtns,
      .ai-pill,
      .api-st,
      .demo-banner,
      .p6-toolbar {
        display: none !important
      }

      body {
        background: #fff !important;
        color: #111 !important
      }

      .tp:not(.active) {
        display: none !important
      }

      .panel,
      .kpi {
        border: 1px solid #ccc !important;
        background: #fff !important;
        color: #111 !important
      }

      .kpi .v,
      .kpi .k,
      .kpi .s {
        color: #111 !important
      }

      .p6-outer {
        overflow: visible !important;
        max-height: none !important
      }

      @page {
        size: A3 landscape;
        margin: 12mm
      }
    }

    /* ══════════════════════════════════════════════════
   P6-STYLE GANTT
   Exact Primavera P6 visual hierarchy:
   - WBS L0 (root)    : dark navy   bg + blue  accent
   - WBS L1 (phase)   : dark teal   bg + cyan  accent
   - WBS L2 (package) : dark indigo bg + violet accent
   - Activity (normal): no bg, subdued text
   - Activity (crit)  : very dark red bg, red text
══════════════════════════════════════════════════ */

    /* Container */
    .p6-outer {
      overflow: auto;
      border-radius: 6px;
      border: 1px solid rgba(59, 130, 246, .16);
      box-shadow: 0 6px 28px rgba(0, 0, 0, .45);
      background: rgba(2, 4, 14, .97)
    }

    /* Main 2-column grid */
    .p6-grid {
      display: grid;
      grid-template-columns: 520px 1fr;
      min-width: 860px
    }

    /* ── Sticky header ── */
    .p6-hdr-left {
      position: sticky;
      top: 0;
      z-index: 14;
      display: grid;
      grid-template-columns: 88px 1fr 56px 80px 80px;
      height: 36px;
      background: rgba(4, 9, 26, .99);
      border-bottom: 2px solid rgba(59, 130, 246, .22);
      border-right: 1px solid rgba(59, 130, 246, .12);
    }

    .p6-hdr-right {
      position: sticky;
      top: 0;
      z-index: 14;
      height: 36px;
      background: rgba(4, 9, 26, .99);
      border-bottom: 2px solid rgba(59, 130, 246, .22);
      display: flex;
      overflow: hidden;
    }

    .p6-hdr-cell {
      display: flex;
      align-items: center;
      padding: 0 8px;
      font-size: 9px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .9px;
      color: #273d56;
      border-right: 1px solid rgba(255, 255, 255, .035);
    }

    .p6-hdr-cell:last-child {
      border-right: none
    }

    .p6-month-lbl {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 9px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .6px;
      color: #273d56;
      border-right: 1px solid rgba(255, 255, 255, .03);
    }

    /* ── Row ── */
    .p6-row {
      display: contents
    }

    /* Left cell layout — 5 fixed columns */
    .p6-left {
      display: grid;
      grid-template-columns: 88px 1fr 56px 80px 80px;
      border-right: 1px solid rgba(59, 130, 246, .08);
      overflow: hidden;
      position: relative;
    }

    /* Hover highlight */
    .p6-row:hover .p6-left {
      filter: brightness(1.12)
    }

    .p6-row:hover .p6-right {
      background-color: rgba(255, 255, 255, .016) !important
    }

    /* Cell base */
    .p6-cell {
      display: flex;
      align-items: center;
      padding: 0 8px;
      overflow: hidden;
      border-right: 1px solid rgba(255, 255, 255, .018);
      font-family: 'DM Sans', system-ui, sans-serif;
    }

    .p6-cell:last-child {
      border-right: none
    }

    /* ID cell */
    .p6-c-id {
      font-family: 'JetBrains Mono', monospace;
      font-size: 9px;
      font-weight: 700;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    /* Name cell */
    .p6-c-name {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      line-height: 1.2;
    }

    /* Duration */
    .p6-c-dur {
      font-family: 'JetBrains Mono', monospace;
      font-size: 10.5px;
      font-weight: 700;
      justify-content: center;
      flex-shrink: 0;
    }

    /* Dates */
    .p6-c-date {
      font-family: 'JetBrains Mono', monospace;
      font-size: 9px;
      justify-content: center;
      flex-shrink: 0;
      white-space: nowrap;
    }

    /* ── WBS row styles ── */

    /* L0 — Project root: navy */
    .p6-wl0 {
      background: linear-gradient(90deg, rgba(11, 24, 58, .98), rgba(8, 18, 46, .96));
      border-bottom: 1px solid rgba(59, 130, 246, .18);
      border-left: 4px solid #3b82f6;
      min-height: 40px;
    }

    .p6-wl0 .p6-c-id {
      color: #3b82f6;
      font-size: 10px
    }

    .p6-wl0 .p6-c-name {
      font-size: 13px;
      font-weight: 800;
      color: #dbeafe;
      letter-spacing: -.1px
    }

    .p6-wl0 .p6-c-dur {
      color: #fbbf24;
      font-size: 12px
    }

    .p6-wl0 .p6-c-date {
      color: #1d3a5c
    }

    /* L1 — Major phase: dark teal */
    .p6-wl1 {
      background: linear-gradient(90deg, rgba(6, 26, 36, .96), rgba(5, 20, 30, .94));
      border-bottom: 1px solid rgba(6, 182, 212, .12);
      border-left: 4px solid #06b6d4;
      min-height: 36px;
    }

    .p6-wl1 .p6-c-id {
      color: #06b6d4;
      font-size: 9.5px
    }

    .p6-wl1 .p6-c-name {
      font-size: 12.5px;
      font-weight: 700;
      color: #cffafe
    }

    .p6-wl1 .p6-c-dur {
      color: #fbbf24;
      font-size: 11px
    }

    .p6-wl1 .p6-c-date {
      color: #1a4050
    }

    /* L2 — Sub-package: dark indigo */
    .p6-wl2 {
      background: linear-gradient(90deg, rgba(12, 10, 38, .94), rgba(10, 8, 32, .92));
      border-bottom: 1px solid rgba(99, 102, 241, .1);
      border-left: 4px solid #818cf8;
      min-height: 33px;
    }

    .p6-wl2 .p6-c-id {
      color: #818cf8;
      font-size: 9px
    }

    .p6-wl2 .p6-c-name {
      font-size: 12px;
      font-weight: 700;
      color: #e0e7ff
    }

    .p6-wl2 .p6-c-dur {
      color: #fbbf24;
      font-size: 10.5px
    }

    .p6-wl2 .p6-c-date {
      color: #2c2a50
    }

    /* ── Activity row styles ── */

    /* Normal activity — NO background */
    .p6-act {
      background: rgba(3, 6, 18, .65);
      border-bottom: 1px solid rgba(255, 255, 255, .02);
      border-left: 3px solid transparent;
      min-height: 28px;
    }

    .p6-act .p6-c-id {
      color: #334155;
      font-size: 9px
    }

    .p6-act .p6-c-name {
      font-size: 11.5px;
      font-weight: 400;
      color: #64748b
    }

    .p6-act .p6-c-dur {
      color: #475569;
      font-size: 10px
    }

    .p6-act .p6-c-date {
      color: #253040
    }

    /* Critical activity — very subtle red tint */
    .p6-act-crit {
      background: rgba(10, 2, 2, .72);
      border-bottom: 1px solid rgba(239, 68, 68, .06);
      border-left: 3px solid rgba(239, 68, 68, .6);
      min-height: 28px;
    }

    .p6-act-crit .p6-c-id {
      color: #dc2626;
      font-size: 9px
    }

    .p6-act-crit .p6-c-name {
      font-size: 11.5px;
      font-weight: 500;
      color: #fca5a5
    }

    .p6-act-crit .p6-c-dur {
      color: #ef4444;
      font-size: 10px
    }

    .p6-act-crit .p6-c-date {
      color: #3b1515
    }

    /* WBS meta text (act count + dur) */
    .p6-wbs-meta {
      font-size: 10px;
      font-weight: 500;
      opacity: .55;
      margin-left: 8px;
      white-space: nowrap;
      flex-shrink: 0
    }

    /* ── Right (chart) panel ── */
    .p6-right {
      position: relative;
      overflow: hidden
    }

    /* Grid lines */
    .p6-gl {
      position: absolute;
      top: 0;
      bottom: 0;
      border-left: 1px solid rgba(255, 255, 255, .02);
      pointer-events: none
    }

    .p6-gl.maj {
      border-color: rgba(59, 130, 246, .055)
    }

    /* Today line */
    .p6-today {
      position: absolute;
      top: 0;
      bottom: 0;
      width: 1px;
      background: rgba(248, 113, 113, .6);
      z-index: 6;
      pointer-events: none
    }

    .p6-today::before {
      content: '▼';
      position: absolute;
      top: -1px;
      left: -3px;
      font-size: 7px;
      color: rgba(248, 113, 113, .75)
    }

    /* ── WBS summary bar — P6 style: thin white + colored top ── */
    .p6-sum-bar {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      height: 9px;
      background: rgba(255, 255, 255, .72);
      border-radius: 1px;
      box-shadow: 0 1px 4px rgba(0, 0, 0, .5);
      cursor: default;
      overflow: hidden;
    }

    /* Colored top stripe */
    .p6-sum-bar::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 2px;
      background: var(--acc, #3b82f6);
    }

    /* ── Activity bar ── */
    .p6-act-bar {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      height: 14px;
      border-radius: 2px;
      display: flex;
      align-items: center;
      box-shadow: 0 1px 4px rgba(0, 0, 0, .35);
      cursor: default;
      transition: filter .12s;
    }

    .p6-act-bar:hover {
      filter: brightness(1.2)
    }

    .p6-act-bar.crit {
      box-shadow: 0 0 10px rgba(239, 68, 68, .35)
    }

    .p6-bar-lbl {
      font-size: 9px;
      font-weight: 700;
      font-family: 'DM Sans', sans-serif;
      color: rgba(255, 255, 255, .92);
      padding: 0 5px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      letter-spacing: .1px;
    }

    /* ── Milestone diamond ── */
    .p6-ms {
      position: absolute;
      top: 50%;
      transform: translateY(-50%) rotate(45deg);
      width: 11px;
      height: 11px;
      border-radius: 2px;
      box-shadow: 0 2px 8px rgba(0, 0, 0, .5);
      cursor: default;
    }

    .p6-ms:hover {
      transform: translateY(-50%) rotate(45deg) scale(1.3)
    }

    /* ── Toolbar ── */
    .p6-toolbar {
      display: flex;
      align-items: center;
      gap: 6px;
      flex-wrap: wrap;
      padding: 7px 12px;
      border-radius: 8px;
      background: rgba(4, 9, 24, .8);
      border: 1px solid rgba(148, 163, 184, .09);
      margin-bottom: 8px;
    }

    .p6-tb-lbl {
      font-size: 9px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .9px;
      color: #1e3148;
      margin-right: 2px
    }

    .p6-tb-btn {
      padding: 4px 10px;
      border-radius: 6px;
      border: 1px solid rgba(148, 163, 184, .11);
      background: rgba(5, 12, 30, .8);
      color: #334e6a;
      font-size: 11px;
      font-weight: 700;
      cursor: pointer;
      transition: all .12s;
      font-family: inherit;
    }

    .p6-tb-btn:hover {
      border-color: rgba(96, 165, 250, .28);
      color: #7db3e0
    }

    .p6-tb-btn.on {
      background: rgba(12, 28, 64, .9);
      border-color: rgba(59, 130, 246, .38);
      color: #93c5fd
    }

    .p6-tb-btn.on.crit {
      background: rgba(28, 5, 5, .9);
      border-color: rgba(239, 68, 68, .38);
      color: #f87171
    }

    .p6-tb-sep {
      width: 1px;
      height: 16px;
      background: rgba(148, 163, 184, .09);
      margin: 0 2px
    }

    .p6-exp-btn {
      padding: 4px 13px;
      border-radius: 6px;
      font-size: 11px;
      font-weight: 700;
      cursor: pointer;
      font-family: inherit;
      border: 1px solid;
      transition: all .12s;
    }

    .p6-exp-btn.grn {
      border-color: rgba(34, 197, 94, .28);
      color: #4ade80;
      background: rgba(34, 197, 94, .05)
    }

    .p6-exp-btn.grn:hover {
      background: rgba(34, 197, 94, .12)
    }

    .p6-exp-btn.red {
      border-color: rgba(239, 68, 68, .25);
      color: #f87171;
      background: rgba(239, 68, 68, .04)
    }

    .p6-exp-btn.red:hover {
      background: rgba(239, 68, 68, .11)
    }

    .p6-rowcount {
      font-size: 10px;
      color: #1e3148
    }

    /* ── Legend ── */
    .p6-legend {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-bottom: 8px
    }

    .p6-leg {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 4px 10px;
      border-radius: 999px;
      background: rgba(5, 12, 30, .7);
      border: 1px solid rgba(148, 163, 184, .08);
      font-size: 10px;
      color: #334e6a
    }

    .p6-leg i {
      display: inline-block;
      width: 12px;
      height: 12px;
      border-radius: 1px;
      flex-shrink: 0
    }