:root{
    --surface-page:#f7f9fc; --surface-card:#ffffff; --border-default:#e3e8f0; --border-subtle:#eef1f6;
    --ink:#0b1f3a; --ink-secondary:#55607a; --ink-muted:#8992a8;
    --brand:#0b1f3a; --brand-strong:#081527; --brand-tint:#eaf0f7; --on-brand:#ffffff; --brand-cyan:#00b4f0;
    --flare:#f28c28; --flare-tint:#fdeedd; --flare-ink:#b5650e;
    --success-tint:#e7f4ea; --success-ink:#1f6b3b; --warning-tint:#fbf0dc; --warning-ink:#8a5b12;
    --danger-tint:#fbe8e8; --danger-ink:#9c2e2e; --dependency-tint:#f1ebfa; --dependency-ink:#5b3a99;
    --focus-ring:#0b1f3a;
  }
  *{box-sizing:border-box;}
  body{margin:0;font-family:'Poppins',sans-serif;color:var(--ink);background:var(--surface-page);}
  a{color:var(--brand);}
  .data{font-family:'IBM Plex Mono',monospace;}
  button,input,select,textarea{font-family:inherit;font-size:14px;}
  input,select,textarea{
    width:100%;padding:10px 12px;border:1px solid var(--border-default);border-radius:8px;background:var(--surface-card);color:var(--ink);
  }
  /* Tick boxes and radios keep their natural size: the full-width rule above
     used to stretch them and push labels to the far side (2026-10-11). */
  input[type=checkbox],input[type=radio]{width:auto;padding:0;accent-color:var(--brand);}
  input:focus,select:focus,textarea:focus{outline:2px solid var(--focus-ring);outline-offset:1px;}
  .doc-choice{display:flex;align-items:flex-start;gap:12px;margin:0;padding:12px 14px;border:1px solid var(--border-default);border-radius:10px;background:var(--surface-card);cursor:pointer;color:var(--ink);transition:border-color .12s,background .12s;}
  .doc-choice:hover{border-color:var(--brand);}
  .doc-choice:has(input:checked){border-color:var(--brand);background:var(--brand-tint);}
  .doc-choice input{width:18px;height:18px;margin:2px 0 0;flex:0 0 auto;cursor:pointer;}
  .doc-choice-title{display:block;font-size:14px;font-weight:700;color:var(--ink);}
  .doc-choice-desc{display:block;font-size:12.5px;font-weight:500;color:var(--ink-secondary);margin-top:2px;line-height:1.4;}
  textarea{min-height:80px;resize:vertical;}
  label{display:block;font-size:12px;font-weight:700;color:var(--ink-secondary);margin-bottom:6px;}
  .field{margin-bottom:14px;}
  /* inline-flex + nowrap (2026-10-11): button text stays on one line and
     <label class="btn"> file pickers line up exactly with real buttons. */
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;line-height:1.2;border-radius:8px;padding:10px 16px;font-weight:700;font-size:14px;cursor:pointer;border:1px solid transparent;text-decoration:none;}
  label.btn{margin:0;}
  .btn-primary{background:var(--brand);color:var(--on-brand);border-color:var(--brand);}
  .btn-primary:hover{background:var(--brand-strong);}
  .btn-outline{background:var(--surface-card);color:var(--ink);border-color:var(--border-default);}
  .btn-outline:hover{border-color:var(--brand);}
  .btn-ghost{background:transparent;color:var(--ink-secondary);border-color:transparent;}
  .card{background:var(--surface-card);border:1px solid var(--border-default);border-radius:12px;padding:20px 22px;}
  .pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 12px;font-size:12px;font-weight:800;white-space:nowrap;}
  .eyebrow{font-size:11px;font-weight:800;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.05em;}
  .empty-state{padding:28px;text-align:center;color:var(--ink-muted);font-size:13px;}
  .page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:4px;flex-wrap:wrap;}
  /* A header's button group wraps onto a second row, right-aligned, instead of squashing the buttons. */
  .page-header > div:not(:first-child){flex-wrap:wrap;justify-content:flex-end;align-items:center;}
  .stack{display:flex;flex-direction:column;gap:16px;}
  .row{display:flex;gap:16px;align-items:flex-start;}
  .pid-table-row{display:flex;gap:8px;align-items:center;margin-bottom:8px;}
  .pid-table-row input{margin-bottom:0;}
  .ai-badge{background:var(--flare-tint);color:var(--flare-ink);}
  .ai-pending textarea{border-color:var(--flare-ink);background:var(--flare-tint);}
  .ai-banner{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 6px;padding:6px 10px;border-radius:8px;background:var(--flare-tint);color:var(--flare-ink);font-size:12px;font-weight:700;}
  .ai-banner .btn{padding:3px 10px;font-size:12px;}
  .error-banner{background:var(--danger-tint);color:var(--danger-ink);border-radius:8px;padding:10px 14px;font-size:13px;font-weight:600;}
  .app-shell{display:flex;min-height:100vh;}
  .sidebar{width:240px;flex-shrink:0;background:var(--surface-card);border-right:1px solid var(--border-default);display:flex;flex-direction:column;justify-content:space-between;position:sticky;top:0;height:100vh;}
  .main{flex-grow:1;padding:32px 40px 60px;max-width:1100px;min-width:0;}
  /* 2026-10-13: the sidebar's menu scrolls on its own (user box stays pinned at the bottom),
     and scroll bars are always drawn where content can be cut off. */
  .sidebar-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;}
  .sidebar-foot{flex-shrink:0;background:var(--surface-card);}
  .card,#gantt-scroll{scrollbar-color:var(--ink-muted) var(--surface-page);}
  .scroll-visible{scrollbar-width:auto;scrollbar-color:var(--ink-muted) var(--surface-page);}
  .scroll-visible::-webkit-scrollbar{width:12px;height:12px;}
  .scroll-visible::-webkit-scrollbar-track{background:var(--surface-page);border-radius:8px;}
  .scroll-visible::-webkit-scrollbar-thumb{background:var(--ink-muted);border-radius:8px;border:3px solid var(--surface-page);}
  .scroll-visible::-webkit-scrollbar-thumb:hover{background:var(--ink-secondary);}
  .scroll-visible::-webkit-scrollbar-corner{background:var(--surface-page);}
  .plan-scroll{overflow:auto;max-height:calc(100vh - 140px);padding-top:0;}
  .plan-scroll thead th{position:sticky;top:0;z-index:3;background:var(--surface-card);padding-top:12px;box-shadow:0 1px 0 var(--border-default);}
  .main-wide{max-width:none;}
  .nav-row{display:flex;align-items:center;gap:10px;padding:11px 10px;margin-bottom:2px;border-radius:8px;font-size:13px;font-weight:600;text-decoration:none;color:var(--ink-secondary);cursor:pointer;}
  .nav-row.active{background:var(--brand-tint);color:var(--brand);font-weight:700;}
  .nav-dot{width:6px;height:6px;border-radius:999px;flex-shrink:0;}
  .nav-group{margin-bottom:2px;}
  .nav-group-header{display:flex;align-items:center;gap:6px;padding:9px 10px;margin-top:8px;cursor:pointer;font-size:11px;font-weight:800;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.05em;border-radius:8px;user-select:none;}
  .nav-group-header:hover{background:var(--surface-page);}
  .nav-group-chevron{display:inline-block;transition:transform .15s ease;font-size:9px;transform:rotate(0deg);}
  .nav-group-chevron.collapsed{transform:rotate(-90deg);}
  .auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--surface-page);}
  .auth-card{width:100%;max-width:400px;background:var(--surface-card);border:1px solid var(--border-default);border-radius:14px;padding:36px 32px;}
  .btn-google{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;background:var(--surface-card);color:var(--ink);border:1px solid var(--border-strong, var(--border-default));font-weight:600;}
  .btn-google:hover{background:var(--surface-sunken, var(--surface-page));}
  .btn-google svg{flex-shrink:0;}
  .auth-divider{display:flex;align-items:center;gap:10px;margin:16px 0;color:var(--ink-muted);font-size:12px;}
  .auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:var(--border-subtle);}
  .auth-alt{margin-top:12px;font-size:12.5px;text-align:center;}
  .auth-sent{text-align:center;}
  .auth-sent h2{font-size:18px;font-weight:800;margin:6px 0 8px;}
  .auth-sent p{font-size:13.5px;color:var(--ink-secondary);margin:0 0 14px;}
  .wordmark{font-weight:800;font-size:20px;}
  .wordmark .capy{color:var(--brand);} .wordmark .bara{color:var(--brand-cyan);}
  table{width:100%;border-collapse:collapse;}
  th{text-align:left;font-size:11px;font-weight:700;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.04em;padding:0 8px 8px 8px;}
  td{font-size:13px;padding:10px 8px;border-top:1px solid var(--border-subtle);}
  .programme-row{cursor:pointer;}
  .programme-row:hover{background:var(--brand-tint);}
  .programme-row.hover-sync{background:var(--brand-tint);}
  .chip{padding:7px 13px;border-radius:999px;font-size:12px;font-weight:700;cursor:pointer;border:1px solid var(--border-default);background:var(--surface-card);color:var(--ink-secondary);}
  .chip.on{background:var(--brand);color:var(--on-brand);border-color:var(--brand);}
  .doc-tab{padding:9px 14px;font-size:12px;font-weight:700;cursor:pointer;border:1px solid var(--border-default);border-bottom:none;background:var(--surface-page);color:var(--ink-secondary);border-radius:8px 8px 0 0;white-space:nowrap;}
  .doc-tab.on{background:var(--surface-card);color:var(--ink);position:relative;z-index:1;}
  /* Spreadsheet-style table cells (Actions & checkpoint log): a compact
     wrapping textarea that grows to show its full content on focus, instead
     of a single-line input that clips or scrolls long text. */
  .cell-textarea{width:100%;min-height:2.6em;padding:6px 8px;font:inherit;font-size:13px;line-height:1.35;white-space:pre-wrap;overflow-wrap:break-word;resize:vertical;border:1px solid var(--border-default);border-radius:6px;background:var(--surface-card);color:var(--ink);}
  .cell-textarea:focus{outline:2px solid var(--focus-ring);outline-offset:1px;}
  .audit-list{padding:6px 18px 10px;}
  .audit-day{font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-muted);padding:14px 0 6px;border-bottom:1px solid var(--border-subtle);}
  .audit-row{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--border-subtle);}
  .audit-row:last-child{border-bottom:none;}
  .audit-time{font-size:12px;color:var(--ink-muted);width:42px;flex-shrink:0;padding-top:6px;}
  .audit-avatar{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;flex-shrink:0;}
  .audit-sentence{font-size:14px;line-height:1.45;}
  .audit-meta{font-size:12px;color:var(--ink-muted);margin-top:2px;}
  .audit-changes{margin:6px 0 0;padding:0;list-style:none;font-size:13px;display:flex;flex-direction:column;gap:3px;}
  .audit-k{font-weight:700;color:var(--ink-secondary);margin-right:4px;}
  .audit-old{color:var(--ink-muted);text-decoration:line-through;}
  .audit-new{color:var(--ink);font-weight:600;}
  @media (max-width:600px){.audit-time{display:none;}}
  @media (max-width:760px){.gauge-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
  .gs-trigger{display:flex;align-items:center;gap:8px;width:100%;margin-top:10px;padding:8px 10px;border:1px solid var(--border-default);border-radius:8px;background:var(--surface-page);color:var(--ink-secondary);font:600 12.5px/1.2 inherit;font-family:inherit;cursor:pointer;text-align:left;}
  .gs-trigger:hover{border-color:var(--brand);color:var(--ink);}
  .gs-trigger span{flex:1;white-space:nowrap;}
  .gs-trigger .gs-kbd{white-space:nowrap;}
  .gs-kbd{font-family:'IBM Plex Mono',monospace;font-size:10.5px;padding:1px 6px;border:1px solid var(--border-default);border-radius:5px;background:var(--surface-card);color:var(--ink-muted);}
  #global-search{display:none;position:fixed;inset:0;z-index:300;}
  #global-search .gs-backdrop{position:absolute;inset:0;background:rgba(11,31,58,.35);}
  #global-search .gs-panel{position:relative;max-width:640px;margin:10vh auto 0;width:calc(100% - 32px);background:var(--surface-card);border-radius:14px;box-shadow:0 18px 48px rgba(0,0,0,.28);overflow:hidden;color:var(--ink);}
  .gs-inputrow{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border-subtle);color:var(--ink-muted);}
  .gs-inputrow input{flex:1;border:none !important;outline:none;box-shadow:none !important;font-size:16px;padding:6px 0;background:transparent;color:var(--ink);}
  .gs-results{max-height:60vh;overflow-y:auto;padding:6px;}
  .gs-item{display:flex;gap:12px;align-items:flex-start;width:100%;text-align:left;border:none;background:none;padding:10px 10px;border-radius:8px;cursor:pointer;color:var(--ink);font-family:inherit;}
  .gs-item[aria-selected="true"]{background:var(--brand-tint);}
  .gs-tag{flex:0 0 118px;font-size:10.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-muted);padding-top:3px;}
  .gs-main{display:flex;flex-direction:column;gap:2px;min-width:0;}
  .gs-title{font-size:14px;font-weight:700;}
  .gs-snippet{font-size:12.5px;color:var(--ink-secondary);}
  .gs-proj{font-size:11.5px;color:var(--ink-muted);}
  .gs-item mark{background:var(--warning-tint);color:inherit;border-radius:3px;padding:0 1px;}
  .gs-empty{padding:18px 16px;font-size:13px;color:var(--ink-secondary);}
  .gs-flash{animation:gsflash 2.4s ease-out;}
  @keyframes gsflash{0%,40%{box-shadow:inset 0 0 0 3px var(--brand);background:var(--brand-tint);}100%{box-shadow:none;}}
  @media (max-width:600px){.gs-tag{flex-basis:80px;}.gs-trigger .gs-kbd{display:none;}}
  .stake-table th{position:sticky;top:0;z-index:2;background:var(--surface-card);padding-top:12px;box-shadow:0 1px 0 var(--border-default);}
  .stake-table td{padding:10px 8px;border-top:1px solid var(--border-subtle);font-size:13px;vertical-align:top;}
  .stake-table tr.is-ticked td{background:var(--brand-tint);}
  .sidebar-rail{width:56px;flex-shrink:0;background:var(--surface-card);border-right:1px solid var(--border-default);display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 0;position:sticky;top:0;height:100vh;box-sizing:border-box;}
  .rail-btn{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border-default);border-radius:10px;background:var(--surface-card);color:var(--ink-secondary);cursor:pointer;flex-shrink:0;}
  .rail-btn:hover{border-color:var(--brand);color:var(--ink);}
  .rail-dot{width:10px;height:10px;border-radius:999px;margin-top:6px;}
  .rail-view{writing-mode:vertical-rl;transform:rotate(180deg);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-muted);margin-top:6px;}
  input.date-invalid{border-color:var(--danger-ink) !important;box-shadow:0 0 0 2px var(--danger-tint);}
  .gt-overlay{position:fixed;inset:0;z-index:250;display:flex;align-items:flex-start;justify-content:center;padding:6vh 16px;overflow-y:auto;}
  .gt-backdrop{position:fixed;inset:0;background:rgba(11,31,58,.35);}
  .gt-panel{position:relative;width:100%;max-width:980px;background:var(--surface-card);border-radius:14px;box-shadow:0 18px 48px rgba(0,0,0,.28);padding:22px 24px;display:flex;flex-direction:column;gap:16px;color:var(--ink);}
  .gt-grid{display:grid;grid-template-columns:minmax(220px,1fr) minmax(0,2fr);gap:20px;}
  .gt-table th{position:sticky;top:0;background:var(--surface-card);z-index:1;}
  .gt-table td{padding:3px 4px;}
  .gt-table input{padding:6px 8px;font-size:13px;}
  @media (max-width:760px){.gt-grid{grid-template-columns:1fr;}}
  .update-log{min-height:3.4em;}
  .raci-grid{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:16px;}
  .dash-split{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:16px;margin-bottom:16px;}
  .dash-list-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--border-subtle);}
  .dash-list-row:first-child{border-top:0;}
  .dash-day{display:flex;gap:14px;padding:10px 0;border-top:1px solid var(--border-subtle);}
  .dash-day:first-child{border-top:0;}
  .dash-day-label{flex:0 0 52px;text-align:center;border-radius:10px;padding:6px 0;background:var(--surface-page);}
  .dash-day.is-today .dash-day-label{background:var(--brand);color:#fff;}
  @media (max-width:820px){
    .app-shell{flex-direction:column;}
    .sidebar{width:100%;height:auto;position:relative;flex-direction:row;flex-wrap:wrap;}
    .sidebar-scroll{overflow:visible;flex-basis:100%;}
    .sidebar-rail{width:100%;height:auto;flex-direction:row;padding:8px 12px;position:relative;}
    .rail-view{writing-mode:horizontal-tb;transform:none;margin:0;}
    .plan-scroll{max-height:none;}
    .main{padding:20px;}
    .row{flex-direction:column;}
    .raci-grid{grid-template-columns:1fr;}
    .dash-split{grid-template-columns:1fr;}
  }

  /* ---- Document screens: read view, sticky bar, contents (2026-10-15) ---- */
  input::placeholder, textarea::placeholder { color: var(--ink-muted); font-style: italic; opacity: .75; }
  .doc-bar { position: sticky; top: 0; z-index: 25; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    background: color-mix(in srgb, var(--surface-page) 92%, transparent); backdrop-filter: blur(6px);
    border-bottom: 1px solid var(--border-default); margin: 0 -4px 14px; padding: 10px 4px; }
  .doc-bar-title { font-weight: 800; font-size: 15px; margin-right: 4px; }
  .doc-chip { font-size: 12px; font-weight: 700; border-radius: 999px; padding: 3px 10px; background: var(--surface-card); border: 1px solid var(--border-default); color: var(--ink-secondary); white-space: nowrap; }
  .doc-chip.ok { background: var(--success-tint); color: var(--success-ink); border-color: transparent; }
  .doc-chip.warn { background: var(--warning-tint); color: var(--warning-ink); border-color: transparent; }
  .doc-chip.info { background: var(--brand-tint); color: var(--ink); border-color: transparent; }
  .doc-seg { display: inline-flex; border: 1px solid var(--border-default); border-radius: 9px; overflow: hidden; background: var(--surface-card); }
  .doc-seg button { border: 0; background: transparent; padding: 7px 12px; font: inherit; font-size: 13px; font-weight: 700; color: var(--ink-secondary); cursor: pointer; }
  .doc-seg button.on { background: var(--ink); color: #fff; }
  .doc-layout { display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: 20px; align-items: start; }
  .doc-side { position: sticky; top: 70px; max-height: calc(100vh - 90px); overflow-y: auto; display: flex; flex-direction: column; gap: 14px; }
  .doc-side .doc-toc { position: static; max-height: none; overflow: visible; }
  .doc-actions { display: flex; flex-direction: column; gap: 8px; padding: 12px; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 12px; }
  .doc-actions .doc-seg { display: flex; }
  .doc-actions .doc-seg button { flex: 1; }
  .doc-actions > .btn, .doc-actions-more .btn, .doc-actions details.export-menu > summary { width: 100%; justify-content: center; }
  .doc-actions details.export-menu { position: relative; width: 100%; display: block !important; }
  .doc-actions .export-menu-list { position: static !important; box-shadow: none !important; margin-top: 6px; min-width: 0 !important; }
  .doc-actions-more { display: flex; flex-direction: column; gap: 6px; padding-top: 8px; border-top: 1px solid var(--border-subtle); }
  .doc-actions-more .btn { padding: 8px 12px; font-size: 13px; }
  .doc-layout > .doc-main { min-width: 0; }
  .doc-toc { position: sticky; top: 70px; max-height: calc(100vh - 90px); overflow-y: auto; border-left: 2px solid var(--border-default); padding: 4px 0 4px 12px; font-size: 13px; }
  .doc-toc .eyebrow { margin-bottom: 6px; }
  .doc-toc a { display: flex; gap: 7px; align-items: baseline; color: var(--ink-secondary); text-decoration: none; padding: 4px 0; line-height: 1.3; }
  .doc-toc a:hover { color: var(--ink); }
  .doc-toc a .tick { width: 14px; flex-shrink: 0; font-size: 11px; color: var(--success-ink); }
  .doc-toc a .tick.empty { color: var(--ink-muted); }
  .doc-toc-progress { font-size: 12px; color: var(--ink-muted); margin-top: 8px; }
  @media (max-width: 1150px) { .doc-layout { grid-template-columns: minmax(0, 1fr); } .doc-toc { display: none; } .doc-side { position: static; order: -1; max-height: none; } .doc-actions { flex-direction: row; flex-wrap: wrap; align-items: center; } .doc-actions > .btn, .doc-actions details.export-menu, .doc-actions details.export-menu > summary { width: auto; } .doc-actions-more { flex-direction: row; flex-wrap: wrap; border-top: none; padding-top: 0; } .doc-actions-more .btn { width: auto; } }
  .doc-form > .card { position: relative; scroll-margin-top: 80px; }
  .doc-edit-btn { position: absolute; top: 14px; right: 16px; font-size: 12px !important; padding: 4px 12px !important; }
  .doc-read > .card:not(.doc-editing) input:not([type=checkbox]):not([type=radio]):not([type=file]),
  .doc-read > .card:not(.doc-editing) textarea,
  .doc-read > .card:not(.doc-editing) select {
    border-color: transparent !important; background: transparent !important; box-shadow: none !important;
    padding-left: 0 !important; padding-right: 0 !important; pointer-events: none; resize: none; color: var(--ink);
    -webkit-appearance: none; appearance: none; font-size: 14px; line-height: 1.55; min-height: 0; }
  .doc-read > .card:not(.doc-editing) textarea { overflow: hidden; }
  .doc-read > .card:not(.doc-editing) ::placeholder { color: transparent; }
  .doc-read > .card:not(.doc-editing) input[type=date]::-webkit-calendar-picker-indicator { display: none; }
  .doc-read > .card:not(.doc-editing) input[type=checkbox], .doc-read > .card:not(.doc-editing) input[type=radio] { pointer-events: none; }
  .doc-read > .card:not(.doc-editing) button:not(.doc-edit-btn):not([data-sop-flow]), .doc-read > .card:not(.doc-editing) label.btn,
  .doc-read > .card:not(.doc-editing) .pid-table-row,
  .doc-read > .card:not(.doc-editing) input[type=file], .doc-read > .card:not(.doc-editing) .doc-edit-only { display: none !important; }
  .doc-read > .card:not(.doc-editing) .field label { color: var(--ink-muted); font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; }
  .doc-read > .card:not(.doc-editing) .field.is-empty > input, .doc-read > .card:not(.doc-editing) .field.is-empty > textarea, .doc-read > .card:not(.doc-editing) .field.is-empty > select { display: none; }
  .doc-read > .card:not(.doc-editing) .field.is-empty::after { content: 'Not filled in yet'; display: block; color: var(--ink-muted); font-style: italic; font-size: 13px; padding: 4px 0; }
  .doc-read > button[type=submit] { display: none; }
  .doc-read > .card:not(.doc-editing) input.is-blank { color: transparent; }
  .doc-read-row, .doc-read-none { display: none; }
  .doc-read > .card:not(.doc-editing) .doc-read-row { display: flex; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--border-subtle); font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
  .doc-read > .card:not(.doc-editing) .doc-read-row > span { min-width: 0; }
  .doc-read > .card:not(.doc-editing) .doc-read-none { display: block; color: var(--ink-muted); font-style: italic; font-size: 13px; padding: 4px 0; }
  .doc-toc a.sub { padding-left: 21px; font-size: 12.5px; }
  .doc-read > .card.doc-editing { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-tint); }

  /* ---- Brand pass (2026-10-15): flame orange for warnings, project health strip.
     2026-10-21 look refresh: the side menu went back to white, as in the
     "Capybara risk register selection" design (Peter: "apply it"). ---- */
  :root { --warning-tint: #FDEEDD; --warning-ink: #9A4F06; }
  .sidebar .nav-row { font-size: 14px; font-weight: 500; padding: 10px 12px; }
  .sidebar .nav-row:hover { background: var(--surface-page); color: var(--ink); }
  .sidebar .nav-row.active { background: var(--brand-tint); color: var(--brand); font-weight: 700; }
  .sidebar .nav-row.active .nav-dot { background: var(--brand) !important; }
  .main { padding: 32px 40px 48px; }
  .card { border-radius: 12px; }
  .page-header .btn-primary, .page-header .btn-outline { min-height: 44px; }
  .chip { min-height: 34px; display: inline-flex; align-items: center; }
  .health-strip { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: -4px 0 16px; }
  .health-chip { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600; color: var(--ink-secondary); background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 999px; padding: 5px 12px; text-decoration: none; cursor: pointer; }
  .health-chip b { color: var(--ink); font-weight: 800; }
  .health-chip .dot { width: 9px; height: 9px; border-radius: 999px; flex-shrink: 0; }
  .health-chip.alert { background: var(--flare-tint); border-color: transparent; color: var(--flare-ink); }
  .health-chip.alert b { color: var(--flare-ink); }
  .health-chip.bad { background: var(--danger-tint); border-color: transparent; color: var(--danger-ink); }
  .health-chip.bad b { color: var(--danger-ink); }

  .act-import { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-tint); }
  .act-note { font-size: 11px; color: var(--ink-muted); margin-top: 3px; }
  /* ---- Project plan tidy-up (2026-10-21) ---- */
  .plan-toolbar-wrap { position: relative; display: flex; justify-content: flex-end; }
  .plan-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; padding: 6px; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 12px; }
  .plan-toolbar .btn { padding: 7px 10px; font-size: 12.5px; min-height: 34px; }
  .plan-layout { display: grid; grid-template-columns: minmax(0, 1fr) 210px; gap: 16px; align-items: start; }
  .plan-main { min-width: 0; }
  .plan-side { position: sticky; top: 16px; }
  .plan-actions .btn { width: 100%; justify-content: center; padding: 8px 10px; font-size: 13px; }
  .plan-actions label.btn { width: 100%; }
  .plan-actions-sep { height: 1px; background: var(--border-subtle); margin: 2px 0; }
  .plan-side .plan-template-pop { position: static; width: auto; box-shadow: none; display: flex; flex-direction: column; align-items: stretch; gap: 8px; margin-top: 10px; padding: 12px; background: var(--surface-card); border: 1px solid var(--brand); border-radius: 12px; }
  .plan-side .plan-template-pop .field { min-width: 0 !important; }
  .plan-side .plan-template-pop .btn { width: 100%; }
  @media (max-width: 1100px) { .plan-layout { grid-template-columns: minmax(0, 1fr); } .plan-side { position: static; order: -1; } .plan-actions { flex-direction: row; flex-wrap: wrap; } .plan-actions .btn, .plan-actions label.btn { width: auto; } .plan-actions-sep { display: none; } }
  .plan-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 4px; align-items: center; }
  .plan-head > div:first-child { display: contents; }
  .plan-head > div:first-child > h1 { grid-column: 1; grid-row: 1; }
  .plan-head > div:first-child > div { grid-column: 1 / -1; grid-row: 2; margin-top: 2px !important; }
  .plan-head > .plan-toolbar-wrap { grid-column: 2; grid-row: 1; }
  @media (max-width: 1400px) { .plan-head { grid-template-columns: minmax(0, 1fr); } .plan-head > .plan-toolbar-wrap { grid-column: 1; grid-row: 3; justify-content: flex-end; margin-top: 8px; } }
  .plan-toolbar .btn-outline { border-color: transparent; background: transparent; }
  .plan-toolbar .btn-outline:hover { background: var(--brand-tint); border-color: transparent; }
  .plan-toolbar .btn-outline[aria-expanded="true"] { background: var(--brand-tint); }
  .plan-toolbar-sep { width: 1px; align-self: stretch; background: var(--border-default); margin: 4px 2px; }
  .plan-template-pop { position: absolute; right: 0; top: calc(100% + 8px); z-index: 40; width: min(460px, calc(100vw - 32px)); display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; box-shadow: 0 12px 32px rgba(11,31,58,.16); }
  .plan-help { margin-top: 12px; font-size: 12.5px; color: var(--ink-secondary); }
  .plan-help summary { cursor: pointer; font-weight: 700; color: var(--ink-secondary); padding: 6px 0; list-style: none; }
  .plan-help summary::-webkit-details-marker { display: none; }
  .plan-help summary::before { content: '▸'; display: inline-block; margin-right: 6px; color: var(--ink-muted); transition: transform .15s; }
  .plan-help[open] summary::before { transform: rotate(90deg); }
  .plan-help-body { margin-top: 6px; padding: 12px 14px; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 10px; line-height: 1.5; max-width: 900px; }
  @media (max-width: 760px) { .plan-template-pop { position: static; width: 100%; margin-top: 8px; } .plan-toolbar-sep { display: none; } }

  /* ---- Programmes (2026-10-21) ---- */
  .prg-layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 16px; align-items: start; margin-top: 14px; }
  @media (max-width: 900px) { .prg-layout { grid-template-columns: 1fr; } }
  .prg-list { padding: 14px; display: flex; flex-direction: column; gap: 6px; position: sticky; top: 16px; }
  .prg-item { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; text-align: left; padding: 10px 12px; border-radius: 10px; border: 1px solid transparent; background: transparent; cursor: pointer; font-family: inherit; color: var(--ink); }
  .prg-item:hover { background: var(--surface-page); }
  .prg-item.on { background: var(--brand-tint); border-color: var(--brand); }
  .prg-item-name { font-weight: 700; font-size: 14px; }
  .prg-item-meta { font-size: 12px; color: var(--ink-secondary); font-weight: 500; }
  .prg-new { display: flex; flex-direction: column; gap: 6px; padding: 10px; background: var(--surface-page); border-radius: 10px; margin-bottom: 4px; }
  .prg-main { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
  .prg-detail-head { padding: 16px 18px; }
  .prg-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
  .prg-table { width: 100%; border-collapse: collapse; }
  .prg-table th { padding: 10px 12px; border-bottom: 1px solid var(--border-default); white-space: nowrap; position: sticky; top: 0; background: var(--surface-card); z-index: 1; }
  .prg-table td { padding: 9px 12px; border-top: none; border-bottom: 1px solid var(--border-subtle); vertical-align: middle; }
  .prg-table tr.prg-phase td { background: var(--surface-page); }
  .prg-table td.data { white-space: nowrap; }
  .prg-plan-wrap { overflow: auto; max-height: calc(100vh - 260px); }
  .prg-filters { display: flex; flex-wrap: wrap; gap: 10px; padding: 14px 18px 8px; align-items: flex-end; }
  .prg-filters label { display: flex; flex-direction: column; gap: 4px; margin: 0; }
  .prg-filters select, .prg-filters input { width: auto; padding: 7px 10px; font-size: 13px; }
  .prg-filters input { width: 100%; }
  .prg-code { display: inline-block; padding: 1px 7px; border-radius: 6px; border: 2px solid var(--border-default); font: 700 11.5px/1.5 'IBM Plex Mono', monospace; color: var(--ink); background: var(--surface-card); }
  .prg-add { padding: 0 18px 16px; }
  .prg-add-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px; max-height: 300px; overflow-y: auto; padding: 4px; }
  .prg-add-row { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border-default); border-radius: 8px; margin: 0; font-size: 13px; font-weight: 600; color: var(--ink); cursor: pointer; }
  .prg-add-row.off { opacity: .55; cursor: not-allowed; }
  .prg-add-row .prg-item-meta { margin-left: auto; }
  .prg-g { --prg-label: 300px; overflow: auto; max-height: calc(100vh - 230px); border-top: 1px solid var(--border-subtle); }
  .prg-g-row { display: flex; min-width: max-content; border-bottom: 1px solid var(--border-subtle); height: 30px; }
  .prg-g-head { height: 40px; position: sticky; top: 0; z-index: 3; background: var(--surface-card); }
  .prg-g-label { position: sticky; left: 0; z-index: 2; width: var(--prg-label); min-width: var(--prg-label); background: var(--surface-card); display: flex; align-items: center; gap: 6px; padding: 0 10px; font-size: 12.5px; border-right: 1px solid var(--border-default); overflow: hidden; white-space: nowrap; }
  .prg-g-label span:last-child, .prg-g-label b { overflow: hidden; text-overflow: ellipsis; }
  .prg-g-proj { background: var(--surface-page); height: 34px; }
  .prg-g-proj .prg-g-label { background: var(--surface-page); }
  .prg-g-toggle { border: none; background: transparent; cursor: pointer; font-size: 12px; color: var(--ink-secondary); padding: 2px 4px; }
  .prg-g-id { font-size: 11px; color: var(--ink-secondary); flex-shrink: 0; }
  .prg-g-track { position: relative; flex-shrink: 0; }
  .prg-g-month { position: absolute; top: 4px; font-size: 11px; font-weight: 700; color: var(--ink-secondary); padding-left: 4px; border-left: 1px solid var(--border-default); white-space: nowrap; }
  .prg-g-tick { position: absolute; top: 22px; font-size: 10px; color: var(--ink-muted); padding-left: 2px; border-left: 1px solid var(--border-subtle); height: 18px; }
  .prg-g-bar { position: absolute; top: 8px; height: 14px; border-radius: 4px; overflow: hidden; opacity: .9; }
  .prg-g-bar.late { outline: 2px solid var(--danger-ink); outline-offset: 1px; }
  .prg-g-fill { height: 100%; }
  .prg-g-phase { background: transparent !important; border: 2px solid; top: 9px; height: 12px; }
  .prg-g-pbar { top: 8px; height: 18px; border: 2px solid; }
  .prg-g-ms { position: absolute; top: 8px; width: 13px; height: 13px; background: var(--flare-ink); transform: rotate(45deg); }
  .prg-g-today { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--flare); opacity: .7; pointer-events: none; z-index: 1; }

  /* ---- Weekly catch-up report (2026-10-21) ---- */
  .cu-bar { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: center; margin: 14px 0; }
  .cu-week { display: inline-flex; align-items: center; gap: 8px; }
  .cu-week .btn { padding: 8px 12px; }
  .cu-week-label { font-size: 15px; min-width: 150px; text-align: center; }
  .cu-chips { display: flex; flex-wrap: wrap; gap: 8px; flex: 1; }
  .cu-list { display: flex; flex-direction: column; gap: 14px; }
  .cu-card { padding: 18px 20px; }
  .cu-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; align-items: flex-start; margin-bottom: 14px; }
  .cu-name { display: flex; gap: 10px; align-items: flex-start; min-width: 240px; flex: 1; }
  .cu-name h2 { margin: 0; font-size: 17px; font-weight: 800; line-height: 1.3; }
  .cu-name h2 a { color: var(--ink); text-decoration: none; }
  .cu-name h2 a:hover { text-decoration: underline; }
  .cu-dot { width: 10px; height: 10px; border-radius: 999px; margin-top: 7px; flex-shrink: 0; }
  .cu-sub, .cu-small { font-size: 12px; color: var(--ink-secondary); font-weight: 500; }
  .cu-facts { display: flex; flex-wrap: wrap; gap: 12px 28px; }
  .cu-fact { display: flex; flex-direction: column; gap: 5px; align-items: flex-start; }
  .cu-rep { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; }
  .cu-rag { width: auto; padding: 5px 10px; font-weight: 800; font-size: 13px; border-radius: 999px; }
  .cu-rag-green { background: var(--success-tint); color: var(--success-ink); border-color: transparent; }
  .cu-rag-amber { background: var(--warning-tint); color: var(--warning-ink); border-color: transparent; }
  .cu-rag-red { background: var(--danger-tint); color: var(--danger-ink); border-color: transparent; }
  .cu-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
  .cu-box { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
  .cu-box label, .cu-label { font-size: 12px; font-weight: 800; color: var(--ink-secondary); text-transform: uppercase; letter-spacing: .04em; margin: 0; }
  .cu-text { min-height: 96px; }
  .cu-blockers { background: var(--surface-page); border-radius: 8px; padding: 10px 12px; font-size: 13px; line-height: 1.45; min-height: 96px; white-space: normal; overflow-wrap: anywhere; }
  .cu-flash { animation: cuFlash 2.4s ease; }
  @keyframes cuFlash { 0%, 40% { background: var(--brand-tint); } 100% { background: transparent; } }
  @media (prefers-reduced-motion: reduce) { .cu-flash { animation: none; } }

  /* ---- Reports (2026-10-21) ---- */
  .rpt-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 16px; align-items: start; }
  @media (max-width: 980px) { .rpt-layout { grid-template-columns: 1fr; } .rpt-fields { order: -1; position: static !important; max-height: none !important; } }
  .rpt-fields { position: sticky; top: 16px; max-height: calc(100vh - 32px); overflow-y: auto; padding: 18px; }
  .rpt-field-list { display: flex; flex-direction: column; gap: 6px; }
  .rpt-field { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 8px 10px; border: 1px solid var(--border-default); border-radius: 8px; background: var(--surface-card); color: var(--ink); font: 600 13px/1.25 inherit; font-family: inherit; cursor: grab; }
  .rpt-field:hover { border-color: var(--brand); background: var(--brand-tint); }
  .rpt-field:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 1px; }
  .rpt-field .rpt-in { margin-left: auto; color: var(--success-ink); font-weight: 800; }
  .rpt-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 20px; padding: 0 5px; border-radius: 5px; background: var(--surface-page); color: var(--ink-secondary); font: 700 10px/1 'IBM Plex Mono', monospace; flex-shrink: 0; }
  .rpt-zones { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
  .rpt-zone { background: var(--surface-card); border: 1.5px dashed var(--border-default); border-radius: 12px; padding: 12px 14px; min-height: 86px; transition: border-color .12s, background .12s; }
  .rpt-zone.ready { border-color: var(--brand-cyan); }
  .rpt-zone.over { border-color: var(--brand); background: var(--brand-tint); border-style: solid; }
  .rpt-zone[data-rpt-zone="columns"] { grid-column: 1 / -1; min-height: 64px; }
  .rpt-zone[data-rpt-zone="filters"] .rpt-filter .rpt-x { margin-left: auto; }
  .rpt-zone-title { font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 8px; }
  .rpt-zone-body { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
  .rpt-zone[data-rpt-zone="filters"] .rpt-zone-body { flex-direction: column; align-items: stretch; }
  .rpt-zone-hint { font-size: 12.5px; color: var(--ink-muted); }
  .rpt-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 6px 4px 6px; border-radius: 999px; background: var(--brand-tint); color: var(--brand); font-size: 12.5px; font-weight: 700; }
  .rpt-chip[draggable="true"] { cursor: grab; }
  .rpt-chip .rpt-badge { background: #fff; min-width: 24px; height: 18px; }
  .rpt-chip-move { display: inline-flex; }
  .rpt-chip-move button, .rpt-x { border: none; background: transparent; color: var(--ink-secondary); cursor: pointer; font-size: 15px; line-height: 1; padding: 2px 4px; border-radius: 6px; font-family: inherit; }
  .rpt-chip-move button:disabled { opacity: .3; cursor: default; }
  .rpt-x:hover, .rpt-chip-move button:not(:disabled):hover { background: rgba(11,31,58,.08); color: var(--ink); }
  .rpt-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 8px; border-radius: 8px; background: var(--surface-page); font-size: 12.5px; }
  .rpt-filter input, .rpt-filter select { width: auto; }
  .rpt-enum { display: flex; flex-wrap: wrap; gap: 4px 10px; }
  .rpt-enum label { display: inline-flex; align-items: center; gap: 4px; margin: 0; font-size: 12.5px; font-weight: 600; color: var(--ink); }
  .rpt-seg { display: inline-flex; border: 1px solid var(--border-default); border-radius: 999px; padding: 3px; background: var(--surface-page); }
  .rpt-seg button { border: none; background: transparent; padding: 7px 14px; border-radius: 999px; font: 700 12.5px/1 inherit; font-family: inherit; color: var(--ink-secondary); cursor: pointer; min-height: 32px; }
  .rpt-seg button[aria-pressed="true"] { background: var(--brand); color: #fff; }
  .rpt-export { position: relative; }
  .rpt-export summary { list-style: none; }
  .rpt-export summary::-webkit-details-marker { display: none; }
  .rpt-export-menu { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 10px; box-shadow: 0 8px 24px rgba(11,31,58,.12); display: flex; flex-direction: column; padding: 4px; min-width: 120px; }
  .rpt-export-menu .btn { justify-content: flex-start; color: var(--ink); }
  .rpt-res-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; padding: 14px 20px; border-bottom: 1px solid var(--border-subtle); font-size: 13.5px; }
  .rpt-live { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink-secondary); }
  .rpt-live-dot { width: 8px; height: 8px; border-radius: 999px; background: #1F9D55; box-shadow: 0 0 0 0 rgba(31,157,85,.5); animation: rptPulse 2s infinite; }
  @keyframes rptPulse { 0% { box-shadow: 0 0 0 0 rgba(31,157,85,.45); } 70% { box-shadow: 0 0 0 7px rgba(31,157,85,0); } 100% { box-shadow: 0 0 0 0 rgba(31,157,85,0); } }
  @media (prefers-reduced-motion: reduce) { .rpt-live-dot { animation: none; } }
  .rpt-table-wrap { overflow: auto; max-height: calc(100vh - 220px); }
  .rpt-table { width: 100%; border-collapse: collapse; }
  .rpt-table th { position: sticky; top: 0; background: var(--surface-card); z-index: 1; padding: 12px 14px; border-bottom: 1px solid var(--border-default); white-space: nowrap; }
  .rpt-table td { padding: 11px 14px; border-top: none; border-bottom: 1px solid var(--border-subtle); vertical-align: top; }
  .rpt-table tfoot td { border-top: 2px solid var(--border-default); border-bottom: none; }
  .rpt-sort { border: none; background: none; padding: 0; font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; cursor: pointer; font-weight: 700; }
  .rpt-group-row td { background: var(--surface-page); }
  .rpt-sub { padding: 14px 14px 4px; font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-muted); }
  .rpt-more { padding: 10px 14px; font-size: 12px; color: var(--ink-secondary); }
  .rpt-chart-title { font-weight: 800; font-size: 15px; margin-bottom: 10px; }
  .rpt-svg { width: 100%; max-width: 860px; height: auto; display: block; }
  .rpt-pie { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; }
  .rpt-legend { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; min-width: 240px; flex: 1; }
  .rpt-legend li { display: grid; grid-template-columns: 14px 1fr auto 44px; gap: 10px; align-items: center; font-size: 13px; }
  .rpt-swatch { width: 14px; height: 14px; border-radius: 4px; }
  .rpt-leg-pct { color: var(--ink-secondary); text-align: right; font-size: 12px; }

  /* ---- RACI matrix view (2026-10-16) ---- */
  .raci-mx { border-collapse: separate; border-spacing: 0; width: max-content; min-width: 100%; font-size: 13px; table-layout: auto; }
  .raci-mx td { min-width: 92px; }
  .raci-mx th, .raci-mx td { padding: 9px 8px; border-bottom: 1px solid var(--border-subtle); text-align: center; vertical-align: middle; }
  .raci-mx thead th { background: #EAF0F7; text-transform: none; letter-spacing: 0; color: var(--ink); font-size: 12px; font-weight: 800; vertical-align: bottom; min-width: 92px; }
  .raci-mx .raci-act { position: sticky; left: 0; z-index: 1; background: var(--surface-card); text-align: left; min-width: 240px; max-width: 320px; font-weight: 600; border-right: 1px solid var(--border-default); }
  .raci-mx thead th.raci-act { z-index: 3; background: #EAF0F7; }
  .raci-mx tbody tr:nth-child(even) td { background: #F8FAFC; }
  .raci-mx tbody tr:hover td { background: var(--brand-tint); }
  .raci-mx tfoot td { white-space: nowrap; background: var(--surface-page); font-size: 11.5px; color: var(--ink-secondary); font-weight: 700; border-top: 2px solid var(--border-default); }
  .raci-name { font-weight: 800; line-height: 1.25; }
  .bill-btn { border: 1px solid var(--border-default); background: var(--surface-card); color: var(--ink-muted); border-radius: 7px; width: 30px; height: 26px; font-weight: 800; cursor: pointer; }
  .bill-btn.on { background: var(--flare-tint); color: var(--flare-ink); border-color: #f3c99a; }
  .raci-hide { border: none; background: none; cursor: pointer; color: var(--ink-muted); font-weight: 800; font-size: 13px; padding: 0 2px; line-height: 1; }
  .raci-hide:hover { color: var(--danger-ink); }
  .raci-role { font-weight: 500; color: var(--ink-muted); font-size: 11px; margin-top: 2px; line-height: 1.25; }
  .raci-chip { display: inline-block; min-width: 26px; padding: 3px 8px; border-radius: 6px; font-weight: 800; font-size: 12px; letter-spacing: .02em; }
  .raci-warn { font-size: 11.5px; font-weight: 700; color: var(--flare-ink); margin-top: 3px; }

  /* ---- UAT pack (2026-10-19) ---- */
  .uat-table { width: 100%; border-collapse: collapse; font-size: 13px; }
  .uat-table th { background: #EAF0F7; color: var(--ink); text-transform: none; letter-spacing: 0; font-size: 12px; font-weight: 800; padding: 10px 8px; white-space: nowrap; }
  .uat-table td { vertical-align: middle; }
  .uat-table tbody tr[data-uat-row]:hover td, .uat-table tbody tr[data-uat-drow]:hover td { background: var(--brand-tint); }

  /* ---- Guided tours (2026-10-19): Help menu and Driver.js popovers in Capybara's brand ---- */
  .tour-help { position: relative; flex-shrink: 0; }
  .tour-help-btn { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; font-size: 13px; font-weight: 700; }
  .tour-help-q { width: 20px; height: 20px; border-radius: 999px; background: var(--brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; }
  .tour-help-btn:focus-visible, .tour-help-item:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 2px; }
  .tour-help-menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 70; width: min(320px, calc(100vw - 32px)); background: var(--surface-card); border: 1px solid var(--border-default); border-top: 3px solid var(--brand-cyan); border-radius: 12px; box-shadow: 0 14px 36px rgba(11,31,58,.18); padding: 6px; }
  .tour-help-menu[hidden] { display: none; }
  .tour-help-menu { max-height: min(76vh, 640px); overflow-y: auto; }
  .tour-help-item.primary { background: var(--brand-tint); margin-bottom: 4px; }
  .tour-help-item.primary .tour-help-title { color: #0B1F3A; }
  .tour-help-tips { margin: 2px 0 6px; padding: 4px 12px 4px 28px; font-size: 12.5px; line-height: 1.45; color: var(--ink-secondary); }
  .tour-help-tips li { margin: 4px 0; }
  .tour-help-tips li::marker { color: var(--flare); }
  .tour-help-sep { height: 1px; background: var(--border-subtle); margin: 6px 4px; }
  .tour-help-head { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); padding: 8px 10px 4px; }
  .tour-help-item { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; text-align: left; border: 0; background: transparent; border-radius: 8px; padding: 9px 10px; cursor: pointer; color: var(--ink); }
  .tour-help-item:hover, .tour-help-item:focus { background: var(--brand-tint); }
  .tour-help-item[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
  .tour-help-title { font-size: 13.5px; font-weight: 700; }
  .tour-help-done { color: var(--success-ink); font-weight: 800; margin-left: 4px; }
  .tour-help-desc { font-size: 12px; color: var(--ink-secondary); line-height: 1.4; }
  .driver-popover.capy-tour { font-family: 'Poppins', sans-serif; background: #fff; color: #0B1F3A; border-radius: 14px; border-top: 4px solid var(--brand-cyan); box-shadow: 0 18px 48px rgba(11,31,58,.28); padding: 18px 18px 14px; min-width: min(260px, calc(100vw - 24px)); max-width: min(380px, calc(100vw - 24px)); }
  .capy-tour .driver-popover-title { font: inherit; font-size: 16px; font-weight: 800; color: #0B1F3A; padding-right: 22px; }
  .capy-tour .driver-popover-description { font: inherit; font-size: 13.5px; line-height: 1.55; color: var(--ink-secondary); }
  .capy-tour .driver-popover-description b { color: #0B1F3A; }
  .capy-tour .driver-popover-footer { margin-top: 14px; gap: 10px; flex-wrap: wrap; }
  .capy-tour .driver-popover-progress-text { font-size: 12px; font-weight: 800; color: var(--flare-ink); }
  .capy-tour .driver-popover-navigation-btns { gap: 8px; }
  .capy-tour .driver-popover-footer button { font: inherit; font-size: 13px; font-weight: 700; text-shadow: none; border-radius: 8px; padding: 7px 14px; border: 1px solid var(--border-default); background: #fff; color: #0B1F3A; margin: 0; zoom: 1; }
  .capy-tour .driver-popover-footer button:hover { background: var(--brand-tint); }
  .capy-tour .driver-popover-footer .driver-popover-next-btn { background: #0B1F3A; border-color: #0B1F3A; color: #fff; }
  .capy-tour .driver-popover-footer .driver-popover-next-btn:hover { background: var(--brand-strong); }
  .capy-tour .driver-popover-close-btn { color: var(--ink-muted); width: 32px; height: 32px; font-size: 20px; }
  .capy-tour .driver-popover-close-btn:hover { color: #0B1F3A; }
  .capy-tour button:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 2px; }
  .capy-tour .driver-popover-arrow-side-bottom.driver-popover-arrow { border-bottom-color: var(--brand-cyan); }
  .driver-active .driver-active-element { box-shadow: 0 0 0 3px var(--flare), 0 0 0 7px rgba(242,140,40,.25) !important; border-radius: 8px; }
  @media (max-width: 600px) {
    .driver-popover.capy-tour { padding: 16px 14px 12px; }
    .capy-tour .driver-popover-footer { justify-content: space-between; }
  }

  /* ---- Plan Builder (2026-10-20) ---- */
  .pb-grid { min-width: 920px; }
  .pb-grid th, .pb-grid td { padding: 6px 8px; vertical-align: middle; }
  .pb-grid input, .pb-grid select { padding: 6px 8px; font-size: 13px; }
  .pb-grid tr.pb-phase td, .pb-grid tr.pb-parent td { background: var(--brand-tint); }
  .pb-grid tr.pb-milestone .pb-icon { color: var(--flare-ink); }
  .pb-icon { width: 14px; display: inline-block; text-align: center; color: var(--ink-muted); flex-shrink: 0; }
  .pb-act { border: 1px solid transparent; background: transparent; border-radius: 6px; padding: 3px 6px; font-size: 13px; cursor: pointer; color: var(--ink-secondary); }
  .pb-act:hover:not(:disabled) { background: var(--surface-card); border-color: var(--border-default); color: var(--ink); }
  .pb-act:disabled { opacity: .3; cursor: default; }
  .pb-act:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 1px; }
  .pb-del:hover:not(:disabled) { color: var(--danger-ink); }
  .pb-grid { width: 100%; }
  .pb-grid select { min-width: 96px; }
  .pb-grid [data-pb-field="name"] { min-width: 140px; }
  .pb-sub { font-size: 11px; color: var(--ink-muted); margin-top: 3px; white-space: nowrap; line-height: 1.35; }
  .pb-menu-cell { position: relative; text-align: right; }
  .pb-menu-btn { border: 1px solid var(--border-default); background: var(--surface-card); border-radius: 8px; width: 30px; height: 30px; font-size: 16px; line-height: 1; cursor: pointer; color: var(--ink-secondary); }
  .pb-menu-btn:hover, .pb-menu-btn[aria-expanded="true"] { color: var(--ink); border-color: var(--ink-muted); }
  .pb-menu-btn:focus-visible, .pb-menu button:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 1px; }
  .pb-menu { position: absolute; right: 6px; top: calc(100% - 4px); z-index: 40; min-width: 200px; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 10px; box-shadow: 0 10px 28px rgba(11,31,58,.16); padding: 5px; text-align: left; }
  .pb-menu button { display: block; width: 100%; text-align: left; border: 0; background: transparent; padding: 7px 10px; border-radius: 6px; font-size: 13px; cursor: pointer; color: var(--ink); }
  .pb-menu button:hover:not(:disabled), .pb-menu button:focus { background: var(--brand-tint); }
  .pb-menu button:disabled { opacity: .35; cursor: default; }
  .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .pb-err { font-size: 11.5px; color: var(--danger-ink); margin-top: 3px; max-width: 220px; white-space: normal; }
  input.role-unassigned::placeholder { color: var(--flare-ink); font-style: normal; font-weight: 700; opacity: 1; }

  /* ---- Plan Builder release 2 (2026-10-20) ---- */
  .pb-bulk { position: sticky; top: 0; z-index: 30; display: flex; gap: 8px 14px; align-items: center; flex-wrap: wrap; margin: 12px 0 0; padding: 10px 14px; background: var(--surface-card); border: 1px solid var(--brand-cyan); border-radius: 12px; box-shadow: 0 6px 18px rgba(11,31,58,.10); font-size: 13px; }
  .pb-bulk input, .pb-bulk select { padding: 5px 8px; font-size: 13px; width: auto; }
  .pb-bulk .btn { padding: 5px 10px; font-size: 12.5px; }
  .pb-bulk-group { display: inline-flex; gap: 6px; align-items: center; }
  .pb-grid tr.pb-selected td { background: #e6f7fd; }
  .drag-handle { cursor: grab; color: var(--ink-muted); font-size: 14px; padding: 0 2px; user-select: none; }
  tr.dragging { opacity: .45; }
  tr.drop-before td { box-shadow: inset 0 3px 0 var(--brand-cyan); }
  tr.drop-after td { box-shadow: inset 0 -3px 0 var(--brand-cyan); }
  tr.drop-inside td { background: #e6f7fd !important; }
  .vis-btn { border: 1px solid var(--border-default); background: var(--surface-card); border-radius: 8px; padding: 3px 8px; cursor: pointer; font-size: 14px; line-height: 1.2; }
  .vis-btn[aria-pressed="true"] { border-color: var(--brand-cyan); background: #e6f7fd; }
  .vis-btn:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 1px; }
  .pb-cols { position: relative; }
  .pb-cols summary { list-style: none; }
  .pb-cols-list { position: absolute; right: 0; top: calc(100% + 4px); z-index: 40; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 10px; box-shadow: 0 8px 24px rgba(11,31,58,.14); padding: 8px 12px; min-width: 170px; }
  .pb-cols-list label { display: flex; gap: 8px; align-items: center; margin: 5px 0; font-size: 13px; cursor: pointer; }
  .pb-drawer { position: fixed; top: 0; right: 0; bottom: 0; width: min(400px, 100vw); z-index: 65; background: var(--surface-card); border-left: 1px solid var(--border-default); box-shadow: -14px 0 36px rgba(11,31,58,.16); padding: 18px 18px 24px; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; }
  .pb-drawer .field { margin: 0; }
  /* Gantt */
  .g-wrap { display: flex; min-width: 0; }
  .g-left { flex: 0 0 280px; border-right: 1px solid var(--border-default); }
  .g-left-head { height: 52px; display: flex; align-items: flex-end; padding: 0 12px 8px; font-size: 11px; font-weight: 700; color: var(--ink-muted); text-transform: uppercase; letter-spacing: .04em; border-bottom: 1px solid var(--border-default); box-sizing: border-box; }
  .g-left-row { display: flex; align-items: center; gap: 6px; border-bottom: 1px solid var(--border-subtle); padding-right: 8px; box-sizing: border-box; font-size: 13px; }
  .g-left-parent { background: var(--brand-tint); font-weight: 800; }
  .g-left-name { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
  .g-left-meta { font-size: 11px; color: var(--ink-muted); white-space: nowrap; }
  .g-right { flex: 1; min-width: 0; overflow-x: auto; position: relative; }
  .g-head { position: relative; height: 52px; border-bottom: 1px solid var(--border-default); box-sizing: border-box; }
  .g-week { position: absolute; top: 0; height: 26px; border-left: 1px solid var(--border-default); padding-left: 6px; font-size: 12px; font-weight: 700; line-height: 26px; white-space: nowrap; overflow: hidden; box-sizing: border-box; }
  .g-day { position: absolute; top: 26px; height: 26px; border-left: 1px solid var(--border-subtle); text-align: center; font-size: 11px; line-height: 26px; color: var(--ink-secondary); box-sizing: border-box; }
  .g-body { position: relative; background-image: linear-gradient(to right, var(--border-default) 1px, transparent 1px), linear-gradient(to right, var(--border-subtle) 1px, transparent 1px); }
  .g-svg, .g-temp { position: absolute; left: 0; top: 0; pointer-events: none; overflow: visible; }
  .g-svg { z-index: 3; } .g-temp { z-index: 6; }
  .g-arrow { fill: none; stroke: var(--ink-secondary); stroke-width: 1.4; }
  .g-arrow-hit { fill: none; stroke: transparent; stroke-width: 12; pointer-events: stroke; cursor: pointer; }
  .g-arrow-hit:hover, .g-arrow-hit:focus { stroke: rgba(0,180,240,.25); outline: none; }
  .g-arrow-label { font-size: 10px; font-weight: 700; fill: var(--ink-secondary); }
  .g-temp-line { stroke: var(--brand-cyan); stroke-width: 2; stroke-dasharray: 5 4; }
  .g-bar, .g-sum, .g-ms { position: absolute; z-index: 4; cursor: grab; touch-action: none; }
  .g-bar { height: 22px; border-radius: 6px; background: var(--brand); color: #fff; overflow: hidden; }
  .g-bar-label { position: absolute; left: 8px; top: 3px; right: 10px; font-size: 11px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
  .g-sum { height: 10px; background: var(--ink); border-radius: 2px; }
  .g-sum::before, .g-sum::after { content: ''; position: absolute; bottom: -5px; border: 5px solid transparent; border-top-color: var(--ink); }
  .g-sum::before { left: 0; border-left-color: var(--ink); } .g-sum::after { right: 0; border-right-color: var(--ink); }
  .g-ms { width: 18px; height: 18px; transform-origin: center; background: var(--flare); border-radius: 3px; rotate: 45deg; box-shadow: 0 0 0 2px #fff; }
  .g-cust { box-shadow: 0 0 0 2px var(--brand-cyan) !important; }
  .g-resize { position: absolute; right: 0; top: 0; bottom: 0; width: 8px; cursor: ew-resize; background: rgba(255,255,255,.25); }
  .g-link { position: absolute; z-index: 5; width: 10px; height: 10px; border-radius: 999px; background: var(--surface-card); border: 2px solid var(--brand-cyan); cursor: crosshair; opacity: 0; transition: opacity .1s; touch-action: none; }
  .g-wrap:hover .g-link, #gantt-scroll:hover .g-link, .g-link:focus { opacity: 1; }
  [data-gbar]:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 2px; }
  .g-moving { opacity: .85; box-shadow: 0 6px 16px rgba(11,31,58,.25); }
  .g-warn { outline: 2px dashed var(--danger-ink); outline-offset: 2px; }
  .g-dragging { cursor: grabbing; user-select: none; }
  .g-tip { position: absolute; z-index: 20; background: var(--ink); color: #fff; font-size: 11.5px; font-weight: 700; padding: 3px 8px; border-radius: 6px; pointer-events: none; white-space: nowrap; }
  .g-arrow-ed { position: absolute; z-index: 25; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 10px; box-shadow: 0 10px 28px rgba(11,31,58,.18); padding: 10px 12px; width: 260px; }
  .g-arrow-ed select, .g-arrow-ed input { padding: 5px 8px; font-size: 13px; }
  .g-livebar { cursor: grab; z-index: 4; touch-action: none; }
  .gantt-ms { cursor: grab; touch-action: none; }
  .gantt-readonly .g-link { display: none; }
  .gantt-readonly .g-livebar, .gantt-readonly .gantt-ms { cursor: default; }
  .gantt-readonly .g-resize { display: none; }

  /* ---- Support chat (v4.51) ---- */
  .support-root[hidden] { display: none; }
  .support-launch { padding: 4px; border-radius: 999px; flex-shrink: 0; }
  .support-launch-icon { width: 30px; height: 30px; border-radius: 999px; background: var(--brand-cyan); color: #fff; display: inline-flex; align-items: center; justify-content: center; }
  .support-launch:hover .support-launch-icon, .support-launch[aria-expanded="true"] .support-launch-icon { background: var(--brand); }
  .support-launch:focus-visible, .support-panel button:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 2px; }
  .support-panel { position: fixed; right: 20px; top: 72px; z-index: 75; width: min(380px, calc(100vw - 24px)); height: min(580px, calc(100vh - 92px)); display: flex; flex-direction: column; background: var(--surface-card); border: 1px solid var(--border-default); border-top: 3px solid var(--brand-cyan); border-radius: 14px; box-shadow: 0 18px 48px rgba(11,31,58,.22); overflow: hidden; }
  .support-panel[hidden] { display: none; }
  .support-head-bar { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px 8px; }
  .support-title { font-size: 15px; font-weight: 800; color: var(--ink); }
  .support-sub { font-size: 11px; color: var(--ink-muted); font-weight: 600; }
  .support-close { border: 0; background: transparent; font-size: 16px; color: var(--ink-secondary); cursor: pointer; padding: 4px 8px; border-radius: 6px; }
  .support-close:hover { background: var(--brand-tint); }
  .support-tabs { display: flex; gap: 4px; padding: 0 10px; border-bottom: 1px solid var(--border-default); }
  .support-tab { border: 0; background: transparent; padding: 8px 10px; font-size: 13px; font-weight: 700; color: var(--ink-secondary); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
  .support-tab.active { color: var(--ink); border-bottom-color: var(--brand-cyan); }
  .support-body { flex: 1; display: flex; flex-direction: column; min-height: 0; }
  .support-scroll { flex: 1; overflow-y: auto; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
  .support-msg { max-width: 92%; padding: 8px 12px; border-radius: 12px; font-size: 13.5px; line-height: 1.45; }
  .support-msg p { margin: 0 0 6px; } .support-msg p:last-child { margin-bottom: 0; }
  .support-msg ul { margin: 4px 0 6px; padding-left: 18px; }
  .support-msg-bot { align-self: flex-start; background: var(--surface-page); border: 1px solid var(--border-subtle); color: var(--ink); }
  .support-msg-user { align-self: flex-end; background: var(--brand); color: var(--on-brand); white-space: pre-wrap; }
  .support-msg-failed { background: var(--danger-tint); color: var(--danger-ink); border-color: transparent; }
  .support-typing { letter-spacing: 3px; font-weight: 800; color: var(--ink-muted); }
  .support-note { font-size: 12px; color: var(--ink-secondary); }
  .support-msg-arts { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; font-size: 12px; color: var(--ink-muted); }
  .support-article-link { border: 1px solid var(--border-default); background: var(--surface-card); color: var(--brand); border-radius: 999px; padding: 3px 10px; font-size: 12px; font-weight: 600; cursor: pointer; text-align: left; }
  .support-article-link:hover { border-color: var(--brand); }
  .support-msg-foot { display: flex; align-items: center; gap: 6px; margin-top: 8px; font-size: 12px; color: var(--ink-muted); }
  .support-rate { border: 1px solid var(--border-default); background: var(--surface-card); border-radius: 6px; padding: 1px 6px; cursor: pointer; font-size: 13px; }
  .support-ticket-link { border: 0; background: transparent; color: var(--brand); text-decoration: underline; font-weight: 700; font-size: 12.5px; cursor: pointer; padding: 0 2px; }
  .support-error { margin: 0 14px 8px; background: var(--danger-tint); color: var(--danger-ink); border-radius: 8px; padding: 8px 10px; font-size: 12.5px; font-weight: 600; }
  .support-scroll .support-error { margin: 0; }
  .support-compose { display: flex; gap: 8px; align-items: flex-end; padding: 10px 12px; border-top: 1px solid var(--border-default); }
  .support-compose textarea { min-height: 40px; max-height: 120px; resize: none; font-size: 13.5px; padding: 8px 10px; }
  .support-compose .btn { padding: 9px 14px; }
  .support-search { padding: 10px 14px 0; }
  .support-search input { font-size: 13.5px; padding: 8px 10px; }
  .support-article-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
  .support-article-list .support-article-link { width: 100%; border-radius: 8px; padding: 8px 10px; font-size: 13px; }
  .support-head { font-size: 11px; font-weight: 800; color: var(--ink-muted); text-transform: uppercase; letter-spacing: .05em; margin-top: 4px; }
  .support-back { align-self: flex-start; border: 0; background: transparent; color: var(--brand); font-weight: 700; cursor: pointer; padding: 0; font-size: 13px; }
  .support-article-title { font-size: 15px; margin: 0; }
  .support-article-body { font-size: 13.5px; line-height: 1.5; color: var(--ink); }
  .support-article-body p { margin: 0 0 8px; }
  .support-still { font-size: 12.5px; color: var(--ink-secondary); border-top: 1px solid var(--border-subtle); padding-top: 8px; }
  .support-empty { font-size: 13px; color: var(--ink-muted); padding: 10px 0; }
  .support-ticket .field { margin-bottom: 4px; }
  .support-ticket .btn { align-self: flex-start; }
  .support-check { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--ink-secondary); margin: 0; }
  .support-done h3 { margin: 6px 0 8px; font-size: 16px; }
  .support-done p { font-size: 13.5px; line-height: 1.5; margin: 0 0 14px; }
  .support-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  @media print { .support-root { display: none !important; } }
  @media (max-width: 600px) { .support-panel { right: 12px; top: 60px; height: calc(100vh - 72px); } }

  /* ---- Project Dashboard (v4.53) ---- */
  .dash-title-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
  .dash-evidence { display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 12.5px; color: var(--ink-secondary); }
  .dash-evidence-item { color: var(--ink-secondary); text-decoration: none; white-space: nowrap; }
  a.dash-evidence-item:hover { text-decoration: underline; color: var(--ink); }
  .dash-evidence-item.is-stale { color: var(--warning-ink); font-weight: 700; }
  .dash-phase { font-size: 14px; color: var(--ink-secondary); margin-top: 5px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
  .dash-inline-btn { padding: 3px 10px; font-size: 12.5px; border: 1px dashed var(--border-default); color: var(--brand); }
  .dash-inline-btn:hover { border-color: var(--brand); }
  .dash-muted { color: var(--ink-muted); }
  .dash-bad { color: var(--danger-ink); font-weight: 700; }
  .dash-dot { width: 9px; height: 9px; border-radius: 999px; flex: 0 0 auto; display: inline-block; background: var(--border-default); }
  .dash-dot-green { background: var(--success-ink); }
  .dash-dot-amber { background: #C77700; }
  .dash-dot-red { background: var(--danger-ink); }
  .dash-status { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: var(--ink-secondary); white-space: nowrap; }

  .dash-attn { margin: 16px 0 0; padding: 12px 14px; border-radius: 12px; background: var(--surface-card); border: 1px solid var(--border-default); border-left: 4px solid var(--flare); }
  .dash-attn.is-clear { display: flex; align-items: center; gap: 8px; padding: 9px 14px; border-left-color: var(--success-ink); font-size: 13px; color: var(--ink-muted); font-weight: 600; }
  .dash-attn-title { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-secondary); margin: 0 0 8px; }
  .dash-attn-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
  .dash-attn-item { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--border-default); background: var(--surface-page); color: var(--ink); font-size: 13px; text-decoration: none; }
  .dash-attn-item:hover { border-color: var(--brand); background: var(--brand-tint); }
  .dash-attn-item:focus-visible, .dash-tile a:focus-visible, .dash-cta:focus-visible, .dash-inline-btn:focus-visible, .dash-evidence-item:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 2px; }
  .dash-attn-arrow { color: var(--ink-muted); }

  .dash-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 16px 0 20px; }
  .dash-tile { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px; min-width: 0; }
  .dash-tile-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
  .dash-tile-title { margin: 0; }
  .dash-tile-big { font-size: 30px; font-weight: 800; line-height: 1.1; color: var(--ink); }
  .dash-tile-of { font-size: 18px; color: var(--ink-muted); font-weight: 700; }
  .dash-tile-sub { font-size: 13px; color: var(--ink-secondary); line-height: 1.4; min-width: 0; }
  .dash-ellipsis { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; max-width: 11em; }
  /* Every tile ends the same way: the first-step button on its own row, on
     the left, then the screen link on the right underneath (v4.53). */
  .dash-tile-foot { margin-top: auto; padding-top: 10px; display: flex; flex-direction: column; align-items: stretch; gap: 10px; }
  .dash-tile-cta { display: flex; justify-content: flex-start; }
  .dash-tile-link { font-size: 12.5px; font-weight: 700; color: var(--brand); text-decoration: none; align-self: flex-end; }
  .dash-tile-link:hover { text-decoration: underline; }
  .dash-cta { padding: 8px 14px; font-size: 13px; min-width: 9.5em; }
  .dash-risk-counts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 4px; }
  .dash-risk-count { border-radius: 10px; padding: 8px 10px; background: var(--surface-page); min-width: 0; }
  .dash-risk-count.is-red { background: var(--danger-tint); box-shadow: inset 3px 0 0 var(--danger-ink); }
  .dash-risk-count.is-amber { background: var(--warning-tint); box-shadow: inset 3px 0 0 #C77700; }
  .dash-risk-num { display: block; font-size: 26px; font-weight: 800; line-height: 1.1; color: var(--ink); }
  .dash-risk-lbl { display: block; font-size: 12px; font-weight: 700; color: var(--ink-secondary); }
  .dash-pa { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 6px; padding-top: 8px; border-top: 1px solid var(--border-subtle); font-size: 12.5px; color: var(--ink-secondary); text-decoration: none; }
  a.dash-pa:hover b { text-decoration: underline; }
  a.dash-pa:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 2px; border-radius: 4px; }
  .dash-top-risk { font-size: 12.5px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 4px; min-width: 0; }
  .dash-top-risk-name { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; min-width: 0; flex: 1 1 8em; }
  .dash-top-risk .pill { padding: 2px 8px; font-size: 11px; }
  .dash-progress { display: flex; align-items: center; gap: 12px; }
  .dash-ring { flex: 0 0 auto; }
  .dash-count { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; padding: 0 8px; border-radius: 999px; font-size: 12px; font-weight: 800; background: var(--brand-tint); color: var(--brand); }
  .dash-count.is-danger { background: var(--danger-tint); color: var(--danger-ink); }
  .dash-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; flex-wrap: wrap; }
  .dash-panel-title { font-size: 15px; font-weight: 800; margin: 0; }
  .dash-week-empty { font-size: 13.5px; color: var(--ink-secondary); padding: 14px 0 6px; }

  .dash-timeline { margin-bottom: 16px; padding: 16px 20px 14px; }
  .dash-tl-head { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; margin-bottom: 12px; }
  .dash-tl-range { text-transform: none; letter-spacing: 0; font-weight: 600; color: var(--ink-muted); margin-left: 8px; }
  .dash-tl-key { display: flex; gap: 14px; flex-wrap: wrap; font-size: 11.5px; color: var(--ink-muted); }
  .dash-tl-key span { display: inline-flex; align-items: center; gap: 6px; }
  .dash-tl-key-phase { width: 18px; height: 9px; border-radius: 3px; display: inline-block; background: linear-gradient(90deg, #BFE9F9 55%, var(--brand-tint) 55%); border-left: 3px solid var(--brand-cyan); }
  .dash-tl-key-ms { width: 8px; height: 8px; transform: rotate(45deg); background: var(--brand); display: inline-block; flex: 0 0 auto; }
  .dash-tl-key-ms.is-done { background: var(--success-ink); }
  .dash-tl-key-ms.is-overdue { background: var(--danger-ink); }
  .dash-tl-key-today { width: 2px; height: 12px; background: var(--flare); display: inline-block; }
  .dash-tl { position: relative; padding: 4px 0 0; }
  .dash-tl-grid { position: absolute; inset: 0 0 22px 0; pointer-events: none; }
  .dash-tl-gridline { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--border-subtle); }
  .dash-tl-lanes { position: relative; margin-bottom: 10px; }
  .dash-tl-phase { position: absolute; height: 22px; border-radius: 6px; background: var(--brand-tint); border-left: 3px solid var(--brand-cyan); overflow: hidden; box-shadow: inset 0 0 0 1px rgba(11,31,58,.06); }
  .dash-tl-phase.is-done { border-left-color: var(--success-ink); }
  .dash-tl-phase-fill { position: absolute; top: 0; bottom: 0; left: 0; background: #BFE9F9; }
  .dash-tl-phase.is-done .dash-tl-phase-fill { background: var(--success-tint); }
  .dash-tl-phase.is-over { overflow: visible; }
  .dash-tl-phase.is-over .dash-tl-phase-label { overflow: visible; text-overflow: clip; width: max-content; }
  .dash-tl-phase-label { position: relative; display: block; padding: 0 8px; line-height: 22px; font-size: 11.5px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .dash-tl-track { position: relative; height: 16px; margin: 4px 0 0; }
  .dash-tl-track::before { content: ''; position: absolute; left: 0; right: 0; top: 7px; height: 2px; background: var(--border-default); border-radius: 2px; }
  .dash-tl-ms { position: absolute; top: 2px; width: 10px; height: 10px; margin-left: -6px; transform: rotate(45deg); background: var(--brand); border: 2px solid var(--surface-card); box-sizing: content-box; cursor: default; }
  .dash-tl-ms.is-done { background: var(--success-ink); }
  .dash-tl-ms.is-overdue { background: var(--danger-ink); }
  .dash-tl-months { position: relative; height: 18px; margin-top: 4px; font-size: 11px; color: var(--ink-muted); }
  .dash-tl-months span { position: absolute; top: 0; padding-left: 4px; white-space: nowrap; }
  .dash-tl-today { position: absolute; top: 0; bottom: 22px; width: 2px; margin-left: -1px; background: var(--flare); z-index: 2; }
  .dash-tl-today span { position: absolute; bottom: -18px; left: 50%; transform: translateX(-50%); font-size: 10.5px; font-weight: 800; color: var(--flare-ink); white-space: nowrap; background: var(--surface-card); padding: 0 3px; }
  .dash-tl-next { display: flex; align-items: center; gap: 8px; margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--border-subtle); font-size: 12.5px; color: var(--ink-secondary); }
  @media (max-width: 760px) { .dash-tl-phase.is-over { overflow: hidden; } .dash-tl-phase.is-over .dash-tl-phase-label { width: auto; text-overflow: ellipsis; } .dash-tl-months span:nth-child(even) { display: none; } }
  .dash-split > .card { min-width: 0; }
  @media (max-width: 820px) { .dash-split { grid-template-columns: minmax(0, 1fr); } }
  @media (max-width: 1100px) { .dash-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (max-width: 560px) {
    .dash-tiles { grid-template-columns: 1fr; gap: 12px; }
    .dash-attn-item { width: 100%; }
    .dash-attn-list li { width: 100%; }
    .dash-attn-arrow { margin-left: auto; }
  }
  @media print { .dash-cta, .dash-inline-btn { display: none !important; } }

  /* ---- Guided highlight report (v4.54) ---- */
  .rg { margin: 16px 0 0; }
  .rg-sub { font-size: 13px; color: var(--ink-secondary); margin-top: 5px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
  .rg-save { font-size: 12.5px; font-weight: 700; color: var(--ink-muted); }
  .rg-save.is-ok { color: var(--success-ink); }
  .rg-save.is-bad { color: var(--danger-ink); }
  .rg-save.is-ok::before { content: '✓ '; }
  .rg-progress-wrap { margin: 14px 0 4px; }
  .rg-progress-label { font-size: 13px; color: var(--ink-secondary); margin-bottom: 6px; }
  .rg-progress { height: 8px; border-radius: 999px; background: var(--border-default); overflow: hidden; }
  .rg-progress span { display: block; height: 100%; background: var(--brand-cyan); border-radius: 999px; transition: width .3s; }
  .rg-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 20px; margin-top: 16px; align-items: start; }
  .rg-nav { position: sticky; top: 16px; }
  .rg-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
  .rg-step { width: 100%; display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; border: 1px solid transparent; background: transparent; cursor: pointer; text-align: left; color: var(--ink); font-family: inherit; }
  .rg-step:hover { background: var(--surface-card); border-color: var(--border-default); }
  .rg-step.on { background: var(--surface-card); border-color: var(--brand); box-shadow: 0 1px 3px rgba(11,31,58,.08); }
  .rg-step:focus-visible, .rg-rag-btn:focus-visible, .rg-subrag-btn:focus-visible, .rg-q:focus-visible, .rg-linkbtn:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 2px; }
  .rg-step-num { width: 26px; height: 26px; border-radius: 999px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; background: var(--brand-tint); color: var(--brand); }
  .rg-step.is-done .rg-step-num { background: var(--success-ink); color: #fff; }
  .rg-step.on .rg-step-num { box-shadow: 0 0 0 2px var(--brand); }
  .rg-step-text { display: flex; flex-direction: column; min-width: 0; }
  .rg-step-title { font-size: 13.5px; font-weight: 700; line-height: 1.25; }
  .rg-step-word { font-size: 11px; font-weight: 700; color: var(--ink-muted); }
  .rg-step.is-required .rg-step-word { color: var(--danger-ink); }
  .rg-step.is-done .rg-step-word { color: var(--success-ink); }
  .rg-panel { padding: 22px 24px; }
  .rg-panel[hidden] { display: none; }
  .rg-panel-step { font-size: 12px; font-weight: 700; color: var(--ink-muted); text-transform: uppercase; letter-spacing: .04em; }
  .rg-q { font-size: 20px; font-weight: 800; margin: 4px 0 4px; outline: none; }
  .rg-help { font-size: 13.5px; color: var(--ink-secondary); margin: 0 0 16px; }
  .rg-subhead { font-size: 13px; font-weight: 800; margin: 14px 0 8px; }
  .rg-field textarea { line-height: 1.5; }
  .rg-opt { font-weight: 600; color: var(--ink-muted); }
  .rg-wc { font-size: 11.5px; color: var(--ink-muted); margin-top: 4px; text-align: right; }
  .rg-wc.is-over { color: var(--warning-ink); font-weight: 700; }
  .rg-dates { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; }
  .rg-dates .field { margin-bottom: 0; }
  .rg-date-sug { font-size: 12.5px; padding: 8px 10px; color: var(--brand); border: 1px dashed var(--border-default); }
  .rg-rag { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  .rg-rag-btn { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 14px 10px; border-radius: 12px; border: 2px solid var(--border-default); background: var(--surface-card); cursor: pointer; font-family: inherit; color: var(--ink); }
  .rg-rag-icon { width: 30px; height: 30px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 15px; margin-bottom: 4px; }
  .rg-rag-btn.is-green .rg-rag-icon { background: var(--success-tint); color: var(--success-ink); }
  .rg-rag-btn.is-amber .rg-rag-icon { background: var(--warning-tint); color: var(--warning-ink); }
  .rg-rag-btn.is-red .rg-rag-icon { background: var(--danger-tint); color: var(--danger-ink); }
  .rg-rag-label { font-size: 16px; font-weight: 800; }
  .rg-rag-sub { font-size: 12px; color: var(--ink-secondary); }
  .rg-rag-btn.is-green.on { border-color: var(--success-ink); background: var(--success-tint); }
  .rg-rag-btn.is-amber.on { border-color: var(--warning-ink); background: var(--warning-tint); }
  .rg-rag-btn.is-red.on { border-color: var(--danger-ink); background: var(--danger-tint); }
  .rg-rag-btn.on .rg-rag-icon { background: var(--surface-card); }
  .rg-was { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-secondary); margin-top: 8px; }
  .rg-ragcheck { margin: 12px 0; }
  .rg-dbnote { font-size: 12.5px; background: var(--warning-tint); color: var(--warning-ink); border-radius: 8px; padding: 8px 12px; margin: 10px 0; }
  .rg-sug { border: 1px dashed var(--brand-cyan); background: #F2FBFE; border-radius: 10px; padding: 10px 12px; margin: -4px 0 14px; }
  .rg-sug.is-ai { border-color: var(--flare-ink); background: var(--flare-tint); }
  .rg-sug-head { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 800; color: var(--ink-secondary); margin-bottom: 6px; }
  .rg-sug-icon { color: var(--brand-cyan); }
  .rg-sug-text { font-size: 13px; line-height: 1.5; white-space: pre-line; color: var(--ink); max-height: 220px; overflow: auto; }
  .rg-sug-warn { font-size: 12px; color: var(--warning-ink); margin-top: 6px; }
  .rg-sug-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
  .rg-sug-actions .btn { padding: 6px 12px; font-size: 12.5px; }
  .rg-ai { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 4px 0 14px; }
  .rg-ai-btn { padding: 7px 12px; font-size: 13px; }
  .rg-ai-note { font-size: 12px; color: var(--ink-muted); }
  .rg-ai-empty { width: 100%; font-size: 12.5px; color: var(--ink-secondary); }
  .rg-aioff { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; color: var(--ink-secondary); margin-top: 10px; }
  .rg-prev { border: 1px solid var(--border-default); border-radius: 10px; margin-top: 8px; background: var(--surface-page); }
  .rg-prev summary { cursor: pointer; padding: 9px 12px; font-size: 13px; font-weight: 700; display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
  .rg-prev summary:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 2px; border-radius: 10px; }
  .rg-prev-when { font-weight: 600; color: var(--ink-muted); font-size: 12px; }
  .rg-prev-body { padding: 0 12px 12px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
  .rg-prev-item { width: 100%; }
  .rg-prev-text { font-size: 13px; white-space: pre-line; color: var(--ink-secondary); }
  .rg-prev.is-empty { padding: 9px 12px; font-size: 12.5px; color: var(--ink-muted); }
  .rg-subrags { display: flex; gap: 24px; flex-wrap: wrap; margin-bottom: 14px; }
  .rg-subrag-label { font-size: 12px; font-weight: 700; color: var(--ink-secondary); margin-bottom: 6px; }
  .rg-subrag-btns { display: inline-flex; gap: 4px; border: 1px solid var(--border-default); border-radius: 999px; padding: 3px; background: var(--surface-card); }
  .rg-subrag-btn { border: 0; border-radius: 999px; padding: 6px 14px; font-size: 12.5px; font-weight: 700; cursor: pointer; background: transparent; font-family: inherit; }
  .rg-subrag-btn.is-green { color: var(--success-ink); } .rg-subrag-btn.is-amber { color: var(--warning-ink); } .rg-subrag-btn.is-red { color: var(--danger-ink); }
  .rg-subrag-btn.on.is-green { background: var(--success-ink); color: #fff; } .rg-subrag-btn.on.is-amber { background: var(--warning-ink); color: #fff; } .rg-subrag-btn.on.is-red { background: var(--danger-ink); color: #fff; }
  .rg-nav-btns { display: flex; justify-content: space-between; gap: 10px; margin-top: 14px; }
  .rg-review { display: flex; flex-direction: column; gap: 4px; }
  .rg-rv-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; border-bottom: 2px solid var(--brand); padding-bottom: 10px; margin-bottom: 6px; }
  .rg-rv-period { font-size: 16px; font-weight: 800; }
  .rg-rv-reason { font-size: 13.5px; background: var(--surface-page); border-radius: 8px; padding: 8px 12px; }
  .rg-rv-sec { border-bottom: 1px solid var(--border-subtle); padding: 10px 0; }
  .rg-rv-sec h3 { font-size: 14px; font-weight: 800; margin: 0 0 4px; }
  .rg-rv-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
  .rg-rv-edit { padding: 3px 10px; font-size: 12px; }
  .rg-rv-text { font-size: 13.5px; white-space: pre-line; line-height: 1.5; }
  .rg-rv-sec ul { margin: 0; padding-left: 18px; font-size: 13px; }
  .rg-rv-chips { display: flex; align-items: center; gap: 8px; font-size: 13px; margin-bottom: 4px; flex-wrap: wrap; }
  .rg-submit-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 16px; padding-top: 14px; border-top: 2px solid var(--border-default); }
  .rg-submit { padding: 12px 26px; font-size: 15px; }
  .rg-submit:disabled { opacity: .45; cursor: not-allowed; }
  .rg-submit-hint { width: 100%; font-size: 13px; color: var(--danger-ink); }
  .rg-submit-hint ul { margin: 4px 0 0; padding-left: 18px; }
  .rg-submit-hint.is-ok { color: var(--success-ink); }
  .rg-linkbtn { border: 0; background: none; padding: 0; color: var(--brand); font-weight: 700; text-decoration: underline; cursor: pointer; font-family: inherit; font-size: inherit; }
  .rg-done { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 12px; background: var(--success-tint); color: var(--success-ink); font-size: 14px; margin: 12px 0 0; }
  .rg-done > div { flex: 1; }
  .rg-done-icon { width: 28px; height: 28px; border-radius: 999px; background: var(--success-ink); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; }
  .dash-report-status { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; text-decoration: none; color: var(--ink-secondary); padding: 2px 8px; border-radius: 999px; background: var(--surface-page); border: 1px solid var(--border-default); white-space: nowrap; }
  .dash-report-status.is-overdue { color: var(--danger-ink); background: var(--danger-tint); border-color: transparent; }
  .dash-report-status.is-due { color: var(--warning-ink); background: var(--warning-tint); border-color: transparent; }
  .dash-report-status.is-submitted { color: var(--success-ink); background: var(--success-tint); border-color: transparent; }
  .dash-report-status:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 2px; }
  @media (max-width: 900px) {
    .rg-layout { grid-template-columns: minmax(0, 1fr); }
    .rg-nav { position: static; overflow-x: auto; }
    .rg-steps { flex-direction: row; gap: 6px; padding-bottom: 4px; }
    .rg-step { flex-direction: column; gap: 4px; width: auto; min-width: 74px; padding: 6px; text-align: center; align-items: center; }
    .rg-step-title { font-size: 11.5px; white-space: nowrap; }
    .rg-step-word { display: none; }
    .rg-panel { padding: 16px; }
  }
  @media (max-width: 560px) { .rg-rag { grid-template-columns: 1fr; } .rg-rag-btn { flex-direction: row; justify-content: flex-start; gap: 10px; padding: 10px 12px; } .rg-rag-icon { margin: 0; } .rg-rag-sub { margin-left: auto; } }
  @media print { .rg-nav, .rg-nav-btns, .rg-sug, .rg-ai, .rg-prev { display: none !important; } }

  /* ---- Reports: plain questions (v4.55) ---- */
  .rpt-gallery { margin-top: 16px; }
  .rpt-q-title { font-size: 18px; font-weight: 800; margin: 0 0 2px; }
  .rpt-q-help { font-size: 13.5px; color: var(--ink-secondary); margin: 0 0 14px; }
  .rpt-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
  .rpt-card { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; text-align: left; padding: 16px; border-radius: 12px; border: 1px solid var(--border-default); background: var(--surface-card); cursor: pointer; font-family: inherit; color: var(--ink); min-height: 120px; }
  .rpt-card:hover { border-color: var(--brand); box-shadow: 0 4px 14px rgba(11,31,58,.08); }
  .rpt-card:focus-visible, .rpt-quick:focus-visible, .rpt-handle:focus-visible, .rpt-seg button:focus-visible, .rpt-adv summary:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 2px; }
  .rpt-card-icon { width: 32px; height: 32px; border-radius: 9px; background: var(--brand-tint); color: var(--brand); display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 15px; margin-bottom: 4px; }
  .rpt-card-name { font-size: 14.5px; font-weight: 800; }
  .rpt-card-desc { font-size: 12.5px; color: var(--ink-secondary); line-height: 1.4; }
  .rpt-card.is-blank { border-style: dashed; }
  .rpt-builder { margin-top: 14px; padding: 18px 20px; }
  .rpt-qs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
  .rpt-q label { font-size: 13px; font-weight: 800; color: var(--ink); margin-bottom: 6px; }
  .rpt-projs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
  .rpt-qrow { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border-subtle); }
  .rpt-q-inline { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
  .rpt-q-label { font-size: 13px; font-weight: 800; margin-right: 4px; }
  .rpt-quick { border: 1px solid var(--border-default); background: var(--surface-card); color: var(--ink); border-radius: 999px; padding: 6px 12px; font: 700 12.5px/1 inherit; font-family: inherit; cursor: pointer; }
  .rpt-quick:hover { border-color: var(--brand); }
  .rpt-quick[aria-pressed="true"] { background: var(--brand); border-color: var(--brand); color: #fff; }
  .rpt-quick[aria-pressed="true"]::before { content: '✓ '; }
  .rpt-seg button[aria-disabled="true"] { opacity: .4; cursor: not-allowed; }
  .rpt-sugg { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--brand-cyan); margin-left: 3px; }
  .rpt-preview-head { padding: 16px 20px 4px; }
  .rpt-title { font-size: 18px; font-weight: 800; margin: 2px 0 0; outline: none; }
  .rpt-warn { margin: 10px 20px 0; padding: 8px 12px; border-radius: 8px; background: var(--warning-tint); color: var(--warning-ink); font-size: 12.5px; }
  .rpt-bar { margin: 14px 0; display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
  .rpt-save-btns { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
  .rpt-share { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-size: 13px; font-weight: 700; color: var(--ink); padding: 8px 12px; border: 1px solid var(--border-default); border-radius: 8px; background: var(--surface-card); cursor: pointer; }
  .rpt-share:has(input:checked) { border-color: var(--brand); background: var(--brand-tint); }
  .rpt-adv { margin-top: 4px; }
  .rpt-adv > summary { cursor: pointer; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; font-size: 14px; font-weight: 800; padding: 12px 4px; list-style: none; }
  .rpt-adv > summary::before { content: '▸'; color: var(--ink-muted); }
  .rpt-adv[open] > summary::before { content: '▾'; }
  .rpt-adv > summary::-webkit-details-marker { display: none; }
  .rpt-adv-sub { font-size: 12.5px; font-weight: 600; color: var(--ink-muted); }
  .rpt-handle { border: none; background: transparent; cursor: grab; color: var(--ink-muted); font-size: 14px; padding: 0 2px; line-height: 1; }
  .rpt-chip-fixed { background: var(--surface-page); color: var(--ink-secondary); padding: 4px 10px; }
  .rpt-allfields { margin-top: 10px; }
  .rpt-allfields > summary { cursor: pointer; margin: 6px 0; }
  @media (max-width: 900px) { .rpt-qs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (max-width: 560px) { .rpt-qs { grid-template-columns: 1fr; } }

/* v4.58: project colour circle with the project's initials (complementary colour) */
.proj-badge { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; flex-shrink: 0; font-weight: 800; letter-spacing: .02em; line-height: 1; font-family: inherit; user-select: none; }

/* ---- v4.59 left menu redesign (32-sidebar.js) ---------------------------------
   Logo and collapse, Search, project card, "+ New", groups by stage with line
   icons and status marks, and a user chip at the foot. Collapsed: icon strip
   with flyouts. Colours and fonts are the app's own tokens. */
.sidebar { width: 252px; }
.sb-head { padding: 18px 12px 0 18px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sb-collapse { width: 34px; height: 34px; }
.sb-search { padding: 12px 14px 0; }
.sb-search .gs-trigger { margin: 0; }
.sb-project-wrap { padding: 12px 14px 12px; margin-top: 12px; border-top: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle); display: flex; flex-direction: column; gap: 8px; }
.sb-project { position: relative; border: 1px solid var(--border-default); border-radius: 10px; background: var(--surface-card); padding: 9px 10px; }
.sb-project:hover { border-color: var(--brand); }
.sb-project:focus-within { outline: 2px solid var(--brand-cyan); outline-offset: 1px; }
.sb-project-row { display: flex; align-items: flex-start; gap: 9px; }
.sb-project-text { flex: 1; min-width: 0; }
.sb-project-name { font-size: 13.5px; font-weight: 800; color: var(--ink); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.sb-project-meta { display: flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 11.5px; color: var(--ink-secondary); min-width: 0; white-space: nowrap; }
.sb-project-meta > span { flex-shrink: 0; }
.sb-project-meta > .sb-pm { flex-shrink: 1; }
.sb-top { flex-shrink: 0; position: relative; z-index: 5; }
.sb-pm { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.sb-rag { width: 8px; height: 8px; border-radius: 999px; flex-shrink: 0; background: var(--ink-muted); }
.sb-rag.red { background: #C0392B; } .sb-rag.amber { background: #E39B1B; } .sb-rag.green { background: #2E8B57; }
.sb-project-chev { flex-shrink: 0; color: var(--ink-muted); margin-top: 3px; }
/* The real <select> sits invisibly on top of the card: native list, keyboard and screen-reader support. */
.sb-project-select { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; margin: 0; font-size: 14px; }
.sb-viewonly { font-size: 11.5px; color: var(--ink-muted); }
.sb-new { position: relative; }
.sb-new-btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--border-default); border-radius: 8px; background: var(--surface-card); color: var(--ink); font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.sb-new-btn:hover { border-color: var(--brand); background: var(--brand-tint); }
.sb-pop { position: absolute; z-index: 60; min-width: 200px; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 10px; box-shadow: 0 10px 28px rgba(11,31,58,.16); padding: 6px; }
.sb-new-menu { left: 0; top: calc(100% + 4px); }
.sb-pop-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border: 0; border-radius: 7px; background: none; color: var(--ink); font: inherit; font-size: 13px; font-weight: 600; text-align: left; cursor: pointer; }
.sb-pop-item:hover, .sb-pop-item:focus-visible { background: var(--brand-tint); outline: none; }
.sb-pop-item .nav-icon { color: var(--ink-secondary); flex-shrink: 0; }
.sb-pop-check span { flex: 1; }
.sb-pop-check input { width: 16px; height: 16px; margin: 0; accent-color: var(--brand); }
.sb-pop-sep { height: 1px; background: var(--border-subtle); margin: 5px 4px; }
.sb-nav { padding: 6px 10px 14px; }
.sidebar .nav-group { margin-bottom: 2px; }
.sidebar .nav-group-header, .rail-flyout .nav-group-header { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 8px; margin-top: 8px; border: 0; background: none; font: inherit; font-size: 11px; font-weight: 800; color: var(--ink-muted); text-transform: uppercase; letter-spacing: .06em; border-radius: 8px; cursor: pointer; text-align: left; }
.sidebar .nav-group-header.is-static { cursor: default; }
.sidebar .nav-group-header:hover:not(.is-static) { background: var(--surface-page); color: var(--ink-secondary); }
.nav-group-label { flex: 1; }
.nav-group-chevron { flex-shrink: 0; transition: transform .15s ease; }
.nav-group-chevron.collapsed { transform: rotate(-90deg); }
.sidebar .nav-row, .rail-flyout .nav-row { position: relative; display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px 8px 12px; margin: 1px 0; border: 0; border-radius: 8px; background: none; font: inherit; font-size: 13.5px; font-weight: 500; color: var(--ink-secondary); text-align: left; cursor: pointer; }
.nav-row .nav-icon { flex-shrink: 0; color: var(--ink-muted); }
.nav-label { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sidebar .nav-row:hover, .rail-flyout .nav-row:hover { background: var(--surface-page); color: var(--ink); }
.sidebar .nav-row:hover .nav-icon, .rail-flyout .nav-row:hover .nav-icon { color: var(--ink-secondary); }
.sidebar .nav-row.active, .rail-flyout .nav-row.active { background: var(--brand-tint); color: var(--brand); font-weight: 800; }
.sidebar .nav-row.active .nav-icon, .rail-flyout .nav-row.active .nav-icon { color: var(--brand); }
.sidebar .nav-row.active::before, .rail-flyout .nav-row.active::before { content: ''; position: absolute; left: 0; top: 6px; bottom: 6px; width: 3px; border-radius: 3px; background: var(--brand-cyan); }
.sidebar .nav-row:focus-visible, .rail-flyout .nav-row:focus-visible, .nav-group-header:focus-visible, .sb-new-btn:focus-visible, .sb-user-chip:focus-visible, .rail-btn:focus-visible, .sb-collapse:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: 1px; }
.nav-count { background: var(--brand); color: #fff; border-radius: 999px; padding: 0 7px; font-size: 11px; font-weight: 700; line-height: 18px; }
.nav-status { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; }
.nav-status.ok { width: 16px; height: 16px; border-radius: 999px; background: #E0F1E7; color: #2E8B57; }
.nav-status.warn { width: 8px; height: 8px; border-radius: 999px; background: #E39B1B; box-shadow: 0 0 0 3px #FDF1DA; margin-right: 3px; }
.nav-status.warn.small { width: 7px; height: 7px; box-shadow: 0 0 0 2px #FDF1DA; }
.sidebar-foot { padding: 10px 12px 12px; border-top: 1px solid var(--border-subtle); }
.sb-user { position: relative; }
.sb-user-chip { display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 8px; border: 1px solid transparent; border-radius: 10px; background: none; font: inherit; color: var(--ink); text-align: left; cursor: pointer; }
.sb-user-chip:hover { background: var(--surface-page); border-color: var(--border-subtle); }
.sb-avatar { width: 32px; height: 32px; border-radius: 999px; background: var(--brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 12.5px; font-weight: 800; flex-shrink: 0; }
.sb-avatar.lg { width: 44px; height: 44px; font-size: 16px; }
.sb-user-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.sb-user-name { font-size: 13px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sb-user-org { font-size: 11.5px; color: var(--ink-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sb-user-menu { left: 0; right: 0; bottom: calc(100% + 6px); }
.sb-user.is-compact .sb-user-chip { padding: 4px; justify-content: center; }
.sb-user.is-compact .sb-user-menu { left: calc(100% + 10px); right: auto; bottom: 0; }
.sb-dialog-backdrop { position: fixed; inset: 0; z-index: 2000; background: rgba(11,31,58,.38); display: flex; align-items: center; justify-content: center; padding: 16px; }
.sb-dialog { width: min(420px, 100%); padding: 22px; }
.sb-dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; margin: 0; font-size: 13.5px; }
.sb-dl dt { color: var(--ink-muted); font-weight: 700; }
.sb-dl dd { margin: 0; color: var(--ink); overflow-wrap: anywhere; }
/* Collapsed strip */
.sidebar-rail { width: 60px; overflow: visible; z-index: 40; }
.rail-project { display: inline-flex; margin: 2px 0 4px; }
.rail-nav { display: flex; flex-direction: column; align-items: center; gap: 6px; padding-top: 6px; border-top: 1px solid var(--border-subtle); width: 100%; }
.rail-group { position: relative; }
.rail-group-btn { position: relative; border-color: transparent; color: var(--ink-secondary); }
.rail-group-btn.active { background: var(--brand-tint); color: var(--brand); border-color: transparent; box-shadow: inset 3px 0 0 var(--brand-cyan); }
.rail-warn { position: absolute; top: 7px; right: 7px; margin: 0; }
.rail-flyout { display: none; position: absolute; left: calc(100% + 8px); top: -6px; min-width: 230px; z-index: 70; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 12px; box-shadow: 0 12px 30px rgba(11,31,58,.18); padding: 8px; }
.rail-flyout::before { content: ''; position: absolute; left: -10px; top: 0; bottom: 0; width: 10px; } /* hover bridge */
.rail-group:hover .rail-flyout, .rail-group:focus-within .rail-flyout, .rail-group.open .rail-flyout { display: block; }
.rail-flyout-title { font-size: 11px; font-weight: 800; color: var(--ink-muted); text-transform: uppercase; letter-spacing: .06em; padding: 4px 8px 6px; }
.rail-foot { margin-top: auto; }
/* Tablets: a little narrower; phones keep the stacked layout from earlier releases. */
@media (max-width: 1100px) { .sidebar { width: 232px; } }
@media (max-width: 820px) {
  .sidebar { width: 100%; }
  .sb-top { flex-basis: 100%; }
  .sidebar-foot { flex-basis: 100%; }
  .sb-user-menu { left: 0; right: auto; }
  .sidebar-rail { flex-wrap: wrap; }
  .rail-nav { flex-direction: row; border-top: 0; padding-top: 0; width: auto; }
  .rail-flyout { left: 0; top: calc(100% + 6px); }
  .rail-foot { margin: 0 0 0 auto; }
}
@media (prefers-reduced-motion: reduce) { .nav-group-chevron { transition: none; } }

/* v4.60: the Support robot and the Help "?" are the same size and colour */
.tour-help-q, .support-launch-icon { width: 30px; height: 30px; border-radius: 999px; background: var(--brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 800; flex-shrink: 0; }
.support-launch-icon svg { width: 18px; height: 18px; }
.support-launch:hover .support-launch-icon, .support-launch[aria-expanded="true"] .support-launch-icon, .tour-help-btn:hover .tour-help-q, .tour-help-btn[aria-expanded="true"] .tour-help-q { background: var(--brand-cyan); }
.tour-help-btn { padding: 4px 10px 4px 4px; }
/* v4.60: project card shows just the coloured circle with the initials */
.sb-project-wrap { flex-direction: row; align-items: center; gap: 10px; }
.sb-project.is-compact { padding: 5px 6px; border-radius: 999px; display: inline-flex; flex-shrink: 0; }
.sb-project.is-compact .sb-project-row { align-items: center; gap: 4px; }
.sb-project.is-compact .sb-project-chev { margin-top: 0; }
.sb-project.is-compact .sb-rag-pip { position: absolute; left: 30px; top: 4px; width: 10px; height: 10px; border-radius: 999px; border: 2px solid var(--surface-card); }
.sb-rag-pip.red { background: #C0392B; } .sb-rag-pip.amber { background: #E39B1B; } .sb-rag-pip.green { background: #2E8B57; }

/* v4.61 reliability: loading, couldn't-load and saving states */
.load-state { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.load-spinner { width: 22px; height: 22px; border-radius: 999px; border: 3px solid var(--brand-tint); border-top-color: var(--brand); animation: capyspin .8s linear infinite; }
@keyframes capyspin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .load-spinner { animation: none; } }
.load-slow { font-size: 12.5px; color: var(--ink-muted); }
.load-failed { border-left: 4px solid #E39B1B; }
.save-status { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: var(--ink-muted); min-height: 20px; }
.save-status.saving::before { content: ''; width: 10px; height: 10px; border-radius: 999px; border: 2px solid var(--brand-tint); border-top-color: var(--brand); animation: capyspin .8s linear infinite; }
.save-status.saved { color: #2E8B57; }
.save-status.saved::before { content: '✓'; }
.save-status.error { color: var(--danger-ink); }
tr.is-pending, .is-pending { opacity: .6; }

/* v4.61: project settings, switch-on prompts */
.sb-settings-btn { padding: 6px 8px; margin-left: auto; }
.switch-on-prompt { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.btn-sm { padding: 4px 10px; font-size: 12.5px; }
.ps-focus { border-color: var(--brand-cyan) !important; box-shadow: 0 0 0 3px var(--brand-tint); }

.gs-scope { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: var(--ink-secondary); white-space: nowrap; cursor: pointer; }
.gs-scope input { width: 14px; height: 14px; margin: 0; }

/* v4.61 plan: dependency picker, sticky task name, columns menu */
.dep-field { display: flex; align-items: center; gap: 4px; }
.dep-field input { min-width: 0; }
.dep-pick-btn { flex-shrink: 0; width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border-default); border-radius: 6px; background: var(--surface-card); color: var(--ink-secondary); cursor: pointer; padding: 0; }
.dep-pick-btn:hover, .dep-pick-btn:focus-visible { border-color: var(--brand); color: var(--ink); outline: none; }
.dep-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 8px; border: 1px solid var(--border-subtle); border-radius: 8px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
#plan-table-scroll .plan-name-cell { position: sticky; left: 0; z-index: 2; background: var(--surface-card); box-shadow: 1px 0 0 var(--border-subtle); min-width: 240px; }
#plan-table-scroll thead .plan-name-cell { z-index: 4; }
#plan-table-scroll tr[style*="brand-tint"] .plan-name-cell { background: var(--brand-tint); }
.plan-table-tools { display: flex; justify-content: flex-end; margin: 0 0 8px; }
.plan-cols { position: relative; }
.plan-cols > summary { list-style: none; cursor: pointer; }
.plan-cols > summary::-webkit-details-marker { display: none; }
.plan-cols-pop { right: 0; top: calc(100% + 4px); min-width: 230px; }

/* v4.61 action log toolbar */
.act-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.act-ctl { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: var(--ink-secondary); margin: 0; }
.act-ctl select { width: auto; padding: 5px 8px; font-size: 12.5px; }
.act-count { margin-left: auto; font-size: 12.5px; color: var(--ink-muted); font-weight: 600; }

/* v4.61 status consistency */
.rag-word { font-weight: 800; }
.rag-word.rag-green { background: #E0F1E7; color: #1E6B43; }
.rag-word.rag-amber { background: #FDF1DA; color: #7A4F00; }
.rag-word.rag-red { background: #FAE4E1; color: #9C2E22; }
.dash-review-rag { font-size: 12.5px; font-weight: 700; color: var(--warning-ink); background: var(--warning-tint); border-radius: 999px; padding: 3px 10px; text-decoration: none; }
.dash-review-rag:hover { text-decoration: underline; }

/* v4.61 PDF preview */
.pdf-preview-dialog { width: min(980px, 100%); height: min(88vh, 1100px); display: flex; flex-direction: column; }
.pdf-preview-body { flex: 1; min-height: 0; border: 1px solid var(--border-default); border-radius: 8px; overflow: hidden; background: var(--surface-page); display: flex; align-items: center; justify-content: center; }
.pdf-preview-frame { width: 100%; height: 100%; border: 0; background: #fff; }

/* v4.61 UK date boxes and calendar */
.uk-date { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; }
.uk-date input[type="text"] { min-width: 0; width: 120px; }
.uk-date input[aria-invalid="true"] { border-color: var(--danger-ink); }
.uk-date-btn { flex-shrink: 0; width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border-default); border-radius: 6px; background: var(--surface-card); color: var(--ink-secondary); cursor: pointer; padding: 0; }
.uk-date-btn:hover, .uk-date-btn:focus-visible { border-color: var(--brand); color: var(--ink); outline: none; }
.uk-cal { position: absolute; z-index: 3000; width: 256px; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 12px; box-shadow: 0 12px 30px rgba(11,31,58,.18); padding: 10px; }
.uk-cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.uk-cal-head button, .uk-cal-foot button { border: 0; background: none; font: inherit; font-weight: 700; color: var(--ink); cursor: pointer; padding: 4px 8px; border-radius: 6px; }
.uk-cal-head button:hover, .uk-cal-foot button:hover { background: var(--surface-page); }
.uk-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.uk-cal-dow { font-size: 11px; font-weight: 800; color: var(--ink-muted); text-align: center; padding: 2px 0; }
.uk-cal-grid button { border: 0; background: none; font: inherit; font-size: 13px; padding: 6px 0; border-radius: 6px; cursor: pointer; color: var(--ink); }
.uk-cal-grid button:hover { background: var(--brand-tint); }
.uk-cal-grid button:focus-visible { outline: 2px solid var(--brand-cyan); }
.uk-cal-grid button.is-sel { background: var(--brand); color: #fff; }
.uk-cal-grid button.is-today { font-weight: 800; box-shadow: inset 0 0 0 1px var(--brand-cyan); }
.uk-cal-foot { display: flex; justify-content: space-between; margin-top: 6px; }
.pop-panel { position: absolute; z-index: 60; min-width: 200px; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 10px; box-shadow: 0 10px 28px rgba(11,31,58,.16); padding: 6px; }

/* v4.62: plan tools panel minimised by default; "Current project" label */
.plan-layout.tools-closed { grid-template-columns: minmax(0, 1fr) 40px; }
.plan-tools-toggle { display: flex; align-items: center; justify-content: space-between; gap: 6px; width: 100%; margin-bottom: 10px; padding: 8px 10px; border: 1px solid var(--border-default); border-radius: 10px; background: var(--surface-card); color: var(--ink-secondary); font: inherit; font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; cursor: pointer; }
.plan-tools-toggle:hover, .plan-tools-toggle:focus-visible { border-color: var(--brand); color: var(--brand); }
.tools-closed .plan-tools-toggle { flex-direction: column; justify-content: flex-start; padding: 10px 0; min-height: 150px; gap: 10px; }
.plan-tools-vlabel { writing-mode: vertical-rl; transform: rotate(180deg); }
.sb-project-wrap { flex-wrap: wrap; }
.sb-project-label { flex-basis: 100%; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: -2px; }
@media (max-width: 1100px) { .plan-layout.tools-closed { grid-template-columns: minmax(0, 1fr); } .tools-closed .plan-tools-toggle { flex-direction: row; min-height: 0; padding: 8px 10px; } .plan-tools-vlabel { writing-mode: horizontal-tb; transform: none; } }
.plan-actions[hidden] { display: none !important; }

/* v4.63: private projects */
.proj-badge.is-private { position: relative; overflow: visible; }
.proj-lock { position: absolute; right: -4px; bottom: -4px; display: inline-flex; align-items: center; justify-content: center; padding: 2px; border-radius: 999px; background: var(--ink, #0b1f3a); color: #fff; border: 1.5px solid var(--surface-card, #fff); box-sizing: border-box; }
.ps-private { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border-subtle); }

/* v4.64: training feedback */
.tf-form { margin-bottom: 18px; }
.tf-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tf-opt { font-weight: 500; color: var(--ink-muted); }
.tf-form textarea { width: 100%; font-family: 'IBM Plex Mono', monospace; font-size: 13px; }
.tf-count { font-size: 12.5px; color: var(--ink-secondary); margin-top: 4px; }
.tf-preview { border: 1px dashed var(--border-default); border-radius: 12px; padding: 14px 16px; background: var(--surface-page); margin: 6px 0 12px; }
.tf-preview-label { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 6px; }
.tf-preview-q { font-weight: 700; font-size: 15px; margin-bottom: 10px; }
.tf-preview-scale { display: flex; gap: 6px; }
.tf-preview-scale span { width: 36px; height: 36px; border-radius: 8px; background: var(--brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; }
.tf-preview-ends { display: flex; justify-content: space-between; width: 204px; font-size: 11.5px; color: var(--ink-muted); margin-top: 5px; }
.tf-anon { font-size: 13px; color: var(--ink-secondary); margin: 0 0 12px; }
.tf-h2 { font-size: 16px; margin: 6px 0 10px; }
.tf-request { margin-bottom: 12px; }
.tf-req-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.tf-req-title { font-weight: 800; font-size: 15px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tf-req-meta { font-size: 13px; color: var(--ink-secondary); margin-top: 3px; }
.tf-open { background: #e7f5ee; color: #1f7a4d; font-size: 11px; }
.tf-closed { background: var(--surface-page); color: var(--ink-muted); border: 1px solid var(--border-default); font-size: 11px; }
.tf-wait { margin-top: 12px; font-size: 13.5px; color: var(--ink-secondary); background: var(--surface-page); border-radius: 10px; padding: 10px 12px; }
.tf-results { display: grid; grid-template-columns: 150px 1fr; gap: 18px; margin-top: 14px; align-items: center; }
.tf-avg { display: flex; flex-direction: column; }
.tf-avg-num { font-size: 40px; font-weight: 800; line-height: 1; }
.tf-avg-of { font-size: 12.5px; color: var(--ink-muted); margin-top: 2px; }
.tf-avg-note { font-size: 12.5px; color: var(--ink-secondary); margin-top: 8px; }
.tf-bars { display: flex; flex-direction: column; gap: 6px; }
.tf-bar-row { display: grid; grid-template-columns: 128px 1fr 74px; gap: 10px; align-items: center; font-size: 12.5px; }
.tf-bar-label { color: var(--ink-secondary); white-space: nowrap; }
.tf-bar-track { height: 14px; background: var(--surface-page); border-radius: 7px; overflow: hidden; }
.tf-bar { display: block; height: 100%; border-radius: 7px; background: var(--brand); }
.tf-bar.s1 { background: #c2412d; } .tf-bar.s2 { background: #e0873a; } .tf-bar.s3 { background: #c9a227; } .tf-bar.s4 { background: #5a9e6f; } .tf-bar.s5 { background: #1f7a4d; }
.tf-bar-count { font-weight: 700; } .tf-bar-pct { font-weight: 500; color: var(--ink-muted); }
.tf-who { margin-top: 12px; font-size: 13px; }
.tf-who summary { cursor: pointer; color: var(--ink-secondary); font-weight: 600; }
.tf-who-list { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 8px; font-family: 'IBM Plex Mono', monospace; font-size: 12px; }
.tf-failed { color: var(--danger-ink); }
.tf-who-note { font-size: 12px; color: var(--ink-muted); margin-top: 6px; }
@media (max-width: 760px) { .tf-grid, .tf-results { grid-template-columns: 1fr; } .tf-bar-row { grid-template-columns: 96px 1fr 64px; } }

/* v4.64: training campaign: sessions */
.ts-tabs { display: flex; gap: 8px; margin: 0 0 16px; }
.ts-tab-n { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px; border-radius: 999px; background: var(--surface-page); color: var(--ink-secondary); font-size: 11px; line-height: 18px; text-align: center; }
.chip.on .ts-tab-n { background: rgba(255,255,255,.2); color: inherit; }
.tf-intro { font-size: 13.5px; color: var(--ink-secondary); margin: 0 0 12px; }
.ts-summary { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.ts-chip { background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 12px; padding: 10px 14px; display: flex; flex-direction: column; min-width: 92px; }
.ts-chip-n { font-size: 22px; font-weight: 800; line-height: 1.1; }
.ts-chip-l { font-size: 12px; color: var(--ink-secondary); }
.ts-next { flex: 1; min-width: 220px; }
.ts-next-v { font-weight: 700; font-size: 14px; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ts-form { margin-bottom: 16px; }
.ts-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 12px; }
.ts-wide { grid-column: span 2; }
.ts-seg { display: inline-flex; border: 1px solid var(--border-default); border-radius: 10px; overflow: hidden; }
.ts-seg-opt { position: relative; }
.ts-seg-opt input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.ts-seg-opt span { display: inline-block; padding: 9px 16px; font-size: 13.5px; font-weight: 600; color: var(--ink-secondary); }
.ts-seg-opt input:checked + span { background: var(--brand); color: #fff; }
.ts-seg-opt input:focus-visible + span { outline: 2px solid var(--brand-cyan); outline-offset: -2px; }
.ts-table-card { padding: 0; overflow: hidden; }
.ts-table-scroll { overflow-x: auto; }
.ts-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ts-table th { text-align: left; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); padding: 12px 8px; border-bottom: 1px solid var(--border-subtle); white-space: nowrap; }
.ts-table td { padding: 6px 8px; border-bottom: 1px solid var(--border-subtle); vertical-align: middle; }
.ts-table td input, .ts-table td select { width: 100%; min-width: 0; padding: 6px 8px; border: 1px solid transparent; border-radius: 8px; background: transparent; font-size: 13px; }
.ts-table td input:hover, .ts-table td select:hover, .ts-table td input:focus, .ts-table td select:focus { border-color: var(--border-default); background: var(--surface-card); }
.ts-table { table-layout: fixed; width: max-content; min-width: 100%; }
.ts-table td select { padding-right: 22px; }
.ts-table td input[type=date], .ts-table td input[type=time] { padding-left: 4px; padding-right: 2px; }
.ts-actions .btn-sm { padding: 4px 6px; }
.ts-num { text-align: right; }
.ts-del-onsite { color: #1d5fa8; font-weight: 700; } .ts-del-virtual { color: #6a3fb5; font-weight: 700; }
.ts-actions { white-space: nowrap; text-align: right; }
.ts-past td { color: var(--ink-muted); } .ts-past input, .ts-past select { color: var(--ink-secondary); }
.ts-done { display: inline-block; margin-left: 8px; font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #1f7a4d; background: #e7f5ee; border-radius: 999px; padding: 1px 7px; }
.ts-title-cell { display: flex; align-items: center; }
@media (max-width: 900px) { .ts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .ts-grid { grid-template-columns: 1fr; } .ts-wide { grid-column: auto; } }

/* v4.65: Draft PID from contract */
.cp-dialog { width: min(980px, 100%); max-height: calc(100vh - 32px); display: flex; flex-direction: column; padding: 22px 24px; }
.cp-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 8px; }
.cp-head h2 { margin: 0; font-size: 19px; }
.cp-lede { font-size: 14px; color: var(--ink-secondary); line-height: 1.55; margin: 0 0 14px; }
.cp-error { background: var(--danger-tint, #fdecea); color: var(--danger-ink, #b42318); border-radius: 10px; padding: 10px 12px; font-size: 13.5px; margin-bottom: 12px; }
.cp-attach { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; font-size: 14px; font-weight: 600; }
.cp-muted { font-size: 12.5px; color: var(--ink-muted); font-weight: 500; }
.cp-reading { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 40px 0; color: var(--ink-secondary); }
.cp-reading .spinner { width: 28px; height: 28px; border: 3px solid var(--border-default); border-top-color: var(--brand); border-radius: 50%; animation: cpspin .8s linear infinite; }
@keyframes cpspin { to { transform: rotate(360deg); } }
.cp-sub { font-size: 13.5px; color: var(--ink-secondary); margin-bottom: 10px; }
.cp-review { overflow-y: auto; flex: 1; min-height: 0; padding-right: 4px; }
.cp-group { margin-bottom: 16px; }
.cp-group h3 { font-size: 12px; letter-spacing: .07em; text-transform: uppercase; color: var(--ink-muted); margin: 0 0 6px; padding-bottom: 4px; border-bottom: 1px solid var(--border-subtle); }
.cp-row { display: grid; grid-template-columns: 190px 1fr auto; gap: 6px 14px; padding: 9px 0; border-bottom: 1px solid var(--border-subtle); align-items: start; }
.cp-label { font-weight: 700; font-size: 13.5px; }
.cp-value { font-size: 13.5px; min-width: 0; overflow-wrap: anywhere; }
.cp-src { margin-top: 4px; font-size: 12px; color: var(--ink-muted); }
.cp-quote { font-style: italic; }
.cp-page { font-weight: 700; white-space: nowrap; }
.cp-conf { display: inline-block; margin-left: 4px; font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; border-radius: 999px; padding: 1px 6px; vertical-align: 1px; }
.cp-conf-high { background: #e7f5ee; color: #1f7a4d; } .cp-conf-medium { background: #fff4e0; color: #8a5a00; } .cp-conf-low { background: var(--surface-page); color: var(--ink-muted); }
.cp-choice { display: flex; gap: 10px; font-size: 13px; white-space: nowrap; }
.cp-choice label { display: inline-flex; gap: 4px; align-items: center; cursor: pointer; }
.cp-skipped .cp-value { color: var(--ink-muted); }
.cp-notfound { grid-template-columns: 190px 1fr; }
.cp-notfound .cp-value { color: var(--ink-muted); font-style: italic; }
.cp-watch { grid-template-columns: 190px 1fr; background: #fff8eb; padding: 9px 10px; border-radius: 8px; border-bottom: 0; margin-bottom: 6px; }
.cp-watch .cp-value div { margin-bottom: 4px; }
.cp-edit { width: 100%; margin-bottom: 4px; font-size: 13.5px; }
.cp-foot { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding-top: 12px; border-top: 1px solid var(--border-subtle); margin-top: 6px; }
.cp-foot .cp-muted { margin-right: auto; }
@media (max-width: 760px) { .cp-row { grid-template-columns: 1fr; } .cp-notfound, .cp-watch { grid-template-columns: 1fr; } }

/* v4.66: Draft PID from contract review screen */
html.cp-open, html.cp-open body { overflow: hidden; }
.cp-review { overscroll-behavior: contain; }
.cp-tools { display: flex; gap: 8px; margin-bottom: 10px; }
.cp-group-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; border-bottom: 1px solid var(--border-subtle); margin-bottom: 4px; }
.cp-group-head h3 { border-bottom: 0; margin: 0; padding: 6px 0; }
.cp-group-btns { display: flex; gap: 4px; }
.cp-group-btns .btn { padding: 3px 8px; font-size: 12px; }
.cp-row { grid-template-columns: 190px 1fr 228px; }
.cp-choice { display: inline-flex; gap: 0; border: 1px solid var(--border-default); border-radius: 10px; overflow: hidden; height: fit-content; }
.cp-btn { border: 0; background: var(--surface-card); color: var(--ink-secondary); font: inherit; font-size: 13.5px; font-weight: 700; padding: 9px 14px; cursor: pointer; min-width: 74px; }
.cp-btn + .cp-btn { border-left: 1px solid var(--border-default); }
.cp-btn:hover { background: var(--surface-page); color: var(--ink); }
.cp-btn:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: -2px; }
.cp-btn-accept[aria-pressed="true"] { background: #1f7a4d; color: #fff; }
.cp-btn-edit[aria-pressed="true"] { background: var(--brand); color: #fff; }
.cp-btn-skip[aria-pressed="true"] { background: #5b6577; color: #fff; }
.cp-notfound .cp-choice { border: 0; }
.cp-src { margin-top: 6px; font-size: 13px; line-height: 1.5; color: var(--ink-secondary); border-left: 3px solid var(--border-default); padding-left: 8px; }
.cp-quote { font-style: normal; color: #3d4659; }
.cp-page { font-weight: 700; color: var(--ink); font-size: 12px; white-space: nowrap; }
.cp-working { margin-top: 5px; font-size: 13px; color: #1d5fa8; font-weight: 600; }
.cp-cands { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; font-size: 13.5px; }
.cp-cands label { display: inline-flex; gap: 5px; align-items: center; cursor: pointer; }
.cp-nf { color: var(--ink-muted); font-style: italic; margin-bottom: 4px; }
.cp-notfound { grid-template-columns: 190px 1fr 228px; }
.cp-notfound .cp-edit { max-width: 520px; }
.cp-more summary { cursor: pointer; color: #1d5fa8; font-weight: 700; display: inline; }
.cp-more[open] summary { display: block; margin-bottom: 4px; }
.cp-watch-place { margin-bottom: 8px; }
.cp-skipped .cp-v { color: var(--ink-muted); }
@media (max-width: 760px) { .cp-row, .cp-notfound { grid-template-columns: 1fr; } .cp-btn { padding: 10px 14px; } }

/* v4.68: Connected AI tools (Profile and settings) */
.mcp-box { border-top: 1px solid var(--border-subtle); margin-top: 14px; padding-top: 12px; }
.mcp-h { font-size: 14.5px; margin: 0 0 4px; }
.mcp-p { font-size: 13px; color: var(--ink-secondary); margin: 0 0 8px; line-height: 1.5; }
.mcp-url { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.mcp-url code { flex: 1; min-width: 0; overflow-wrap: anywhere; background: var(--brand-tint, #eef8fd); border-radius: 6px; padding: 7px 9px; font-size: 12.5px; }
.mcp-grants { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 6px; }
.mcp-grants li { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 13px; }
.mcp-since { color: var(--ink-muted); font-weight: 400; }

/* v4.70: HubSpot card (Admin) */
.hs-card .hs-row { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.hs-card .hs-row .pill, .hs-card .hs-row span { align-self: center; }
.hs-steps { margin: 0; padding-left: 20px; font-size: 13px; line-height: 1.6; color: var(--ink-secondary); }
.hs-note { font-size: 12.5px; color: var(--ink-muted); }
.hs-status { font-size: 13px; line-height: 1.6; }
.hs-recent { margin: 4px 0 0; padding-left: 18px; }
.hs-recent span { color: var(--ink-muted); }
.hs-msg { font-size: 13px; border-radius: 8px; padding: 9px 12px; }
.hs-msg.ok { background: var(--success-tint); color: var(--success-ink); }
.hs-msg.err { background: #fdeceb; color: #a1261d; }

/* v4.71: HubSpot report sending and project links */
.hs-sub { border-top: 1px solid var(--border-subtle); padding-top: 10px; display: grid; gap: 8px; }
.hs-check { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.5; cursor: pointer; }
.hs-check input { margin-top: 3px; }
.hs-recent .btn-sm { margin-left: 6px; }
.hs-check span { font-weight: 400; }
.hs-check b { font-weight: 700; }

  /* ---- v4.72 Getting started (38-welcome.js) ---- */
  .wl{display:flex;flex-direction:column;gap:28px;max-width:1180px;}
  .wl-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px;align-items:center;padding:32px;border-radius:18px;color:#fff;
    background:radial-gradient(120% 140% at 100% 0%,rgba(0,180,240,.35) 0%,rgba(0,180,240,0) 55%),linear-gradient(135deg,var(--brand) 0%,#12305a 100%);}
  .wl-trial{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.02em;padding:5px 10px;border-radius:999px;background:rgba(242,140,40,.18);color:#ffc58a;border:1px solid rgba(242,140,40,.45);margin-bottom:14px;}
  .wl-h1{font-size:32px;line-height:1.15;font-weight:800;margin:0 0 10px;letter-spacing:-.01em;}
  .wl-lead{font-size:15px;line-height:1.55;color:rgba(255,255,255,.82);margin:0 0 20px;max-width:46ch;}
  .wl-lead b{color:#fff;}
  .wl-hero-acts{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px;}
  .btn-flare{background:var(--flare);color:#1b1205;border-color:var(--flare);font-weight:700;}
  .btn-flare:hover{background:#e07c18;}
  .btn-outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.45);}
  .btn-outline-light:hover{background:rgba(255,255,255,.08);}
  .wl-progress{display:flex;align-items:center;gap:12px;font-size:12.5px;color:rgba(255,255,255,.75);}
  .wl-bar{flex:0 1 220px;height:6px;border-radius:999px;background:rgba(255,255,255,.18);overflow:hidden;}
  .wl-bar span{display:block;height:100%;background:var(--brand-cyan);border-radius:999px;transition:width .4s;}
  .wl-hero .wl-card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);}
  .wl-hero .wl-title{color:#fff;font-size:17px;}
  .wl-hero .wl-desc{color:rgba(255,255,255,.75);}
  .wl-hero .btn-ghost{color:#fff;}
  .wl-sec-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
  .wl-sec-head h2{font-size:18px;font-weight:800;margin:0;color:var(--ink);}
  .wl-sec-head span{font-size:13px;color:var(--ink-muted);}
  .wl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;}
  .wl-card{display:flex;flex-direction:column;border:1px solid var(--border-default);border-radius:14px;overflow:hidden;background:var(--surface-card);transition:box-shadow .15s,transform .15s;}
  .wl-card:hover{box-shadow:0 8px 24px rgba(11,31,58,.10);transform:translateY(-1px);}
  .wl-thumb{position:relative;aspect-ratio:16/9;border:0;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg,#0b1f3a 0%,#1c4a7e 60%,#00b4f0 140%);color:#fff;}
  .wl-thumb.is-soon{background:repeating-linear-gradient(135deg,var(--brand-tint) 0 12px,#f1f5fa 12px 24px);color:var(--ink-secondary);}
  .wl-play{width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.95);color:var(--brand);box-shadow:0 6px 18px rgba(0,0,0,.25);transition:transform .15s;}
  .wl-thumb.is-soon .wl-play{background:#fff;color:var(--ink-muted);box-shadow:none;border:1px solid var(--border-default);font-size:16px;}
  .wl-thumb:hover .wl-play{transform:scale(1.08);}
  .wl-card-big .wl-play{width:68px;height:68px;}
  .wl-dur{position:absolute;right:10px;bottom:10px;font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:6px;background:rgba(11,31,58,.75);color:#fff;}
  .wl-thumb.is-soon .wl-dur{background:#fff;color:var(--ink-secondary);border:1px solid var(--border-default);}
  .wl-seen{position:absolute;left:10px;top:10px;font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:6px;background:var(--success-tint);color:var(--success-ink);}
  .wl-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1;}
  .wl-title{font-size:15px;font-weight:800;margin:0;color:var(--ink);}
  .wl-desc{font-size:13px;line-height:1.5;color:var(--ink-secondary);margin:0;flex:1;}
  .wl-acts{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;}
  .wl-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;}
  .wl-check{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-secondary);cursor:pointer;}
  .wl-player{position:fixed;inset:0;z-index:1200;background:rgba(8,21,39,.78);display:flex;align-items:center;justify-content:center;padding:20px;}
  .wl-player-box{width:min(960px,100%);background:var(--surface-card);border-radius:16px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.4);}
  .wl-player-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px 10px 18px;}
  .wl-player-head h2{font-size:16px;font-weight:800;margin:0;color:var(--ink);}
  .wl-frame{aspect-ratio:16/9;background:#000;}
  .wl-frame video,.wl-frame iframe{width:100%;height:100%;border:0;display:block;}
  .wl-player-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 18px;font-size:13px;color:var(--ink-secondary);}
  @media (max-width:860px){.wl-hero{grid-template-columns:1fr;padding:22px;}.wl-h1{font-size:26px;}}
  @media (prefers-reduced-motion:reduce){.wl-card,.wl-play,.wl-bar span{transition:none;}.wl-card:hover{transform:none;}}

/* ---- v4.74: Top menu (39-topnav.js) ---- */
.app-shell.is-topnav { flex-direction: column; }
.app-shell.is-topnav > .main { width: 100%; margin: 0 auto; box-sizing: border-box; }
.topnav { position: sticky; top: 0; z-index: 50; background: var(--surface-card); border-bottom: 1px solid var(--border-default); }
.tn-bar { display: flex; align-items: center; gap: 20px; padding: 0 20px; min-height: 60px; flex-wrap: wrap; }
.tn-logo { height: 30px; width: auto; display: block; flex-shrink: 0; }
.tn-menu { display: flex; align-items: stretch; gap: 4px; align-self: stretch; flex-wrap: wrap; }
.tn-group { display: flex; }
.tn-group-btn { display: inline-flex; align-items: center; gap: 6px; padding: 0 10px; min-height: 60px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none; font: inherit; font-size: 14px; font-weight: 600; color: var(--ink-secondary); cursor: pointer; white-space: nowrap; }
.tn-group-btn:hover, .tn-group.open .tn-group-btn, .tn-group:focus-within .tn-group-btn { color: var(--ink); }
.tn-group-btn.active { color: var(--ink); font-weight: 800; border-bottom-color: var(--brand-cyan); background: none; box-shadow: none; }
.tn-group-btn:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: -4px; border-radius: 6px; }
.tn-group-btn .nav-status.warn { margin: 0; }
.tn-chev { color: var(--ink-muted); transition: transform .15s; }
.tn-group:hover .tn-chev, .tn-group.open .tn-chev { transform: rotate(180deg); }
.topnav .rail-flyout.tn-drop { left: 0; top: 100%; min-width: 230px; padding: 6px; }
.topnav .rail-flyout.tn-drop::before { left: 0; right: 0; top: -8px; bottom: auto; width: auto; height: 8px; }
.tn-right { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.tn-icon-btn { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 8px; background: none; color: var(--ink-secondary); cursor: pointer; }
.tn-icon-btn:hover { background: var(--surface-page); color: var(--ink); }
.tn-icon-btn:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: 1px; }
.tn-project { display: flex; align-items: center; gap: 6px; }
.tn-project .sb-new-btn { padding: 6px 10px; }
.tn-project .sb-settings-btn { margin-left: 0; }
.tn-project .sb-new-menu { left: auto; right: 0; }
.tn-project .sb-viewonly { font-size: 12px; color: var(--ink-muted); }
.topnav .sb-user.is-compact .sb-user-menu { left: auto; right: 0; top: calc(100% + 8px); bottom: auto; }
@media (max-width: 900px) {
  .tn-bar { gap: 8px; padding: 6px 12px; }
  .tn-group-btn { min-height: 44px; padding: 0 8px; font-size: 13px; }
  .tn-right { margin-left: 0; }
}

/* v4.75 My projects (40-pm-dashboard.js) */
.pmd-table { width: 100%; border-collapse: collapse; }
.pmd-table th, .pmd-table td { padding: 10px 12px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border-default); font-size: 13.5px; }
.pmd-table th { font-size: 12px; font-weight: 700; color: var(--ink-secondary); background: var(--surface-subtle, transparent); white-space: nowrap; }
.pmd-bad { color: var(--danger-ink); }
.pmd-table td:first-child { min-width: 200px; }
.pmd-table td:last-child { min-width: 210px; }

/* v4.75 Add from template (41-plan-add-template.js): fits the narrow Plan tools column */
#plan-addtpl-pop { width: 100%; box-sizing: border-box; }
#plan-addtpl-pop select, #plan-addtpl-pop input { width: 100%; max-width: 100%; box-sizing: border-box; }
#plan-addtpl-pop table { width: 100%; table-layout: fixed; }
#plan-addtpl-pop table td { padding: 4px 4px 4px 0; vertical-align: middle; }
#plan-addtpl-pop .btn { white-space: normal; }

/* v4.75 collapsible Add a new task (25-views.js) */
.task-form-body { display: contents; }
.task-form-body[hidden] { display: none; }
.task-form-toggle { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; font: inherit; color: inherit; border-radius: 6px; }
.task-form-toggle:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.task-form-chev { display: inline-block; width: 12px; color: var(--ink-secondary); }

/* v4.75 pin to Daily use (32-sidebar.js) */
.nav-row-wrap { position: relative; }
.nav-row-wrap > .nav-row { width: 100%; }
.nav-pin { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 6px; background: transparent; color: var(--ink-secondary); cursor: pointer; opacity: 0; padding: 0; }
.nav-row-wrap:hover .nav-pin, .nav-pin:focus-visible, .nav-row-wrap:focus-within .nav-pin { opacity: 1; }
.nav-row-wrap:hover .nav-status, .nav-row-wrap:focus-within .nav-status { visibility: hidden; }
.nav-pin:hover { background: var(--surface-page); color: var(--brand); }
.nav-pin.is-pinned { color: var(--brand); }
.nav-pin.is-pinned svg { fill: currentColor; }
.nav-pin:focus-visible { outline: 2px solid var(--brand); outline-offset: 1px; }
/* v4.75 Plan | Gantt chart tabs */
.plan-tabs { display: inline-flex; gap: 4px; padding: 3px; border: 1px solid var(--border-default); border-radius: 10px; background: var(--surface-card); margin-top: 10px; }
.plan-tab { border: 0; background: transparent; padding: 6px 14px; border-radius: 7px; font: inherit; font-size: 13px; font-weight: 700; color: var(--ink-secondary); cursor: pointer; }
.plan-tab[aria-selected="true"] { background: var(--brand); color: #fff; }
.plan-tab:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

/* ---- v4.76 Weekly catch-up: Overview and Run-through (42-catchup-board.js) ---- */
.cu-tabs { display: inline-flex; gap: 4px; padding: 3px; border: 1px solid var(--border-default); border-radius: 10px; background: var(--surface-card); }
.cu-tab { border: 0; background: transparent; padding: 7px 16px; border-radius: 7px; font: inherit; font-size: 13.5px; font-weight: 700; color: var(--ink-secondary); cursor: pointer; }
.cu-tab[aria-selected="true"] { background: var(--brand); color: var(--on-brand); }
.cu-tab:focus-visible, .cu-tile:focus-visible, .cu-stage:focus-visible, .cu-sort:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.cu-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 6px 0 12px; }
.cu-tile { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--border-default); background: var(--surface-card); cursor: pointer; font: inherit; color: var(--ink); }
.cu-tile:hover { border-color: var(--brand); }
.cu-tile.is-on { border-color: var(--brand); box-shadow: inset 0 0 0 2px var(--brand); }
.cu-tile-n { font-size: 30px; font-weight: 800; line-height: 1.05; font-variant-numeric: tabular-nums; }
.cu-tile-l { font-size: 12.5px; font-weight: 600; color: var(--ink-secondary); }
.cu-tile-green .cu-tile-n { color: var(--success-ink); }
.cu-tile-amber .cu-tile-n { color: var(--warning-ink); }
.cu-tile-red .cu-tile-n { color: var(--danger-ink); }
.cu-tile-alert { background: var(--warning-tint); border-color: transparent; }
.cu-stages { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 14px; }
.cu-stages-h { font-size: 12px; font-weight: 800; color: var(--ink-secondary); text-transform: uppercase; letter-spacing: .04em; margin-right: 4px; }
.cu-stage { border: 1px solid var(--border-default); background: var(--surface-card); border-radius: 999px; padding: 4px 11px; font: inherit; font-size: 12.5px; color: var(--ink); cursor: pointer; }
.cu-stage.is-empty { color: var(--ink-muted); }
.cu-stage.is-on { background: var(--brand); color: var(--on-brand); border-color: var(--brand); }
.cu-stage-sep { color: var(--ink-muted); font-size: 12px; }
.cu-table-card { padding: 14px 16px; margin-top: 14px; }
.cu-table-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.cu-table-head h2 { margin: 0; font-size: 16px; font-weight: 800; }
.cu-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.cu-table th { text-align: left; padding: 0; border-bottom: 1px solid var(--border-default); white-space: nowrap; }
.cu-sort { all: unset; cursor: pointer; display: block; padding: 8px 10px; font-size: 12px; font-weight: 800; color: var(--ink-secondary); }
.cu-table td { padding: 9px 10px; border-bottom: 1px solid var(--border-default); vertical-align: top; }
.cu-table tbody tr:hover { background: var(--surface-page); }
.cu-proj { font-weight: 700; color: var(--ink); }
.cu-clip { max-width: 300px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.cu-ragcell { white-space: nowrap; }
.cu-trend { display: inline-block; min-width: 14px; font-weight: 800; text-align: center; color: var(--ink-muted); }
.cu-trend-better { color: var(--success-ink); }
.cu-trend-worse { color: var(--danger-ink); }
.cu-count { display: inline-block; min-width: 18px; padding: 0 6px; border-radius: 999px; background: var(--flare-tint); color: var(--flare-ink); font-size: 11px; font-weight: 800; text-align: center; }
.cu-foot { margin-top: 10px; }
.cu-decisions { padding: 14px 16px; }
.cu-dec-type { font-size: 13px; font-weight: 800; margin: 12px 0 6px; }
.cu-items { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.cu-item { border: 1px solid var(--border-default); border-radius: 10px; padding: 8px 10px; background: var(--surface-card); }
.cu-item.is-resolved { background: var(--surface-page); }
.cu-item.is-resolved .cu-item-title { text-decoration: line-through; color: var(--ink-secondary); }
.cu-item-fallback { border-style: dashed; }
.cu-item-main { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.cu-item-title { font-weight: 700; font-size: 13.5px; }
.cu-item-meta { font-size: 12px; color: var(--ink-secondary); }
.cu-item-detail { font-size: 12.5px; margin-top: 4px; white-space: pre-wrap; }
.cu-item-outcome { font-size: 12.5px; margin-top: 4px; }
.cu-item-actions, .cu-outcome-form { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; }
.cu-outcome-form input { flex: 1; min-width: 200px; }
.cu-item-status { font-size: 11px; font-weight: 800; padding: 1px 8px; border-radius: 999px; background: var(--brand-tint); color: var(--brand); }
.cu-item-status-resolved { background: var(--success-tint); color: var(--success-ink); }
.cu-carried { font-size: 11px; font-weight: 700; color: var(--flare-ink); }
.cu-type { font-size: 11px; font-weight: 800; padding: 2px 8px; border-radius: 6px; background: var(--brand-tint); color: var(--brand); white-space: nowrap; }
.cu-type-help { background: var(--dependency-tint, #f1ebfa); color: #5b3d8f; }
.cu-type-escalation { background: var(--danger-tint); color: var(--danger-ink); }
.cu-type-fyi { background: var(--surface-page); color: var(--ink-secondary); }
.cu-done summary { cursor: pointer; font-size: 13px; font-weight: 700; margin-top: 10px; }
.cu-rt-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 4px 0 12px; }
.cu-pm { margin-bottom: 20px; }
.cu-pm-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; margin: 0 0 8px; }
.cu-pm-head h2 { margin: 0; font-size: 17px; font-weight: 800; }
.cu-submitted { font-size: 12px; font-weight: 800; padding: 2px 10px; border-radius: 999px; background: var(--warning-tint); color: var(--warning-ink); }
.cu-submitted.is-all { background: var(--success-tint); color: var(--success-ink); }
.cu-pm .cu-card { margin-bottom: 10px; }
.cu-name h3 { margin: 0; font-size: 16px; font-weight: 800; line-height: 1.3; }
.cu-name h3 a { color: var(--ink); text-decoration: none; }
.cu-name h3 a:hover { text-decoration: underline; }
.cu-folded { padding: 8px 14px; }
.cu-fold-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cu-fold-name { font-size: 14px; }
.cu-fold-status { flex: 1; min-width: 160px; font-size: 12.5px; color: var(--ink-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cu-pa-mark { font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; }
.cu-pa-mark.ok { background: var(--success-tint); color: var(--success-ink); }
.cu-pa-mark.no { background: var(--surface-page); color: var(--ink-secondary); }
.cu-card-btns { display: flex; gap: 6px; align-items: flex-start; }
.cu-none { padding: 8px 0; }
.cu-blockers { min-height: 0; }
.cu-lastweek { margin-top: 6px; }
.cu-lastweek-text { font-size: 12.5px; background: var(--surface-page); border-radius: 8px; padding: 8px 10px; white-space: normal; overflow-wrap: anywhere; color: var(--ink-secondary); }
.cu-card-items { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; }
/* Print overview: A4 landscape (a named page, so other printing is unaffected), menus and buttons hidden. */
@page cu-landscape { size: A4 landscape; margin: 12mm; }
@media print {
  body.cu-printing { background: #fff; page: cu-landscape; }
  body.cu-printing .sidebar, body.cu-printing .sidebar-rail, body.cu-printing .topnav, body.cu-printing .project-bar, body.cu-printing .tour-help, body.cu-printing .support-root,
  body.cu-printing .cu-no-print, body.cu-printing .cu-tabs, body.cu-printing .cu-week .btn, body.cu-printing #cu-mine, body.cu-printing label[for="cu-mine"], body.cu-printing .cu-item-actions, body.cu-printing .cu-outcome-form, body.cu-printing .toast { display: none !important; }
  body.cu-printing .main { margin: 0 !important; padding: 0 !important; max-width: none !important; }
  body.cu-printing .cu-tile, body.cu-printing .card { break-inside: avoid; box-shadow: none !important; }
  body.cu-printing .cu-clip { -webkit-line-clamp: unset; display: block; max-width: none; }
}

/* ---- v4.77: Current project switcher ------------------------------------------------ */
:root { --accent: var(--brand); --accent-strong: var(--brand-strong); --on-accent: var(--on-brand); --ps-ring-none: #b4bccb; --tip-bg: #0b1f3a; --tip-ink: #ffffff; }
.sb-project-label { font-size: 11.5px; font-weight: 600; letter-spacing: normal; text-transform: none; color: var(--ink-muted); margin-bottom: -2px; }
.sb-switch { position: relative; display: inline-flex; flex-shrink: 0; --pc: #8992a8; }
.sb-switch-btn.sb-project.is-compact { display: inline-flex; align-items: center; gap: 8px; padding: 5px 14px 5px 5px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--pc) 34%, var(--surface-card)); background: color-mix(in srgb, var(--pc) 9%, var(--surface-card)); color: var(--pc); font: inherit; cursor: pointer; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.sb-switch-btn.sb-project.is-compact:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--pc) 55%, var(--surface-card)); box-shadow: 0 4px 12px color-mix(in srgb, var(--pc) 18%, transparent); }
.sb-switch-btn:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: 2px; }
.sb-switch-btn[aria-expanded="true"] { border-color: color-mix(in srgb, var(--pc) 60%, var(--surface-card)); }
.sb-switch-btn .proj-badge { box-sizing: border-box; }
.sb-switch-chev { flex-shrink: 0; color: var(--pc); transition: transform .15s ease; }
.sb-switch-btn[aria-expanded="true"] .sb-switch-chev { transform: rotate(180deg); }
/* Rail (collapsed or minimised menu): just the circle, no pill */
.sb-switch.is-rail { margin: 4px 0 6px; }
.sb-switch.is-rail .sb-switch-btn.sb-project.is-compact { padding: 3px; gap: 0; }
/* Tooltip: dark, rounded, with an arrow */
.sb-tipwrap { position: relative; display: inline-flex; }
.sb-tip { position: absolute; left: 0; top: calc(100% + 10px); z-index: 80; display: flex; flex-direction: column; gap: 3px; width: max-content; max-width: 260px; padding: 8px 11px; border-radius: 10px; background: var(--tip-bg); color: var(--tip-ink); font-size: 12px; font-weight: 500; line-height: 1.35; box-shadow: 0 8px 22px rgba(11,31,58,.22); pointer-events: none; opacity: 0; visibility: hidden; transform: translateY(-2px); transition: opacity .15s ease, transform .15s ease, visibility .15s; }
.sb-tip::before { content: ''; position: absolute; left: 20px; top: -5px; width: 10px; height: 10px; background: var(--tip-bg); transform: rotate(45deg); border-radius: 2px; }
.sb-tip-title { font-weight: 800; font-size: 12.5px; overflow-wrap: anywhere; }
.sb-tip-meta { display: flex; align-items: center; gap: 6px; color: color-mix(in srgb, var(--tip-ink) 80%, transparent); }
.sb-tip-dot { width: 8px; height: 8px; border-radius: 999px; flex-shrink: 0; box-shadow: 0 0 0 1.5px rgba(255,255,255,.75); }
.sb-switch:hover > .sb-switch-tip, .sb-switch:has(> .sb-switch-btn:focus-visible) > .sb-switch-tip,
.sb-tipwrap:hover > .sb-tip, .sb-tipwrap:has(> button:focus-visible) > .sb-tip { opacity: 1; visibility: visible; transform: none; transition-delay: .25s; }
.sb-switch:has(> .sb-switch-pop:not([hidden])) > .sb-switch-tip { display: none; }
.sb-tip-sm { left: auto; right: 0; }
.sb-tip-sm::before { left: auto; right: 12px; }
.sb-switch.is-rail .sb-tip { left: calc(100% + 12px); top: 50%; transform: translate(-2px, -50%); }
.sb-switch.is-rail .sb-tip::before { left: -5px; top: calc(50% - 5px); }
.sb-switch.is-rail:hover > .sb-switch-tip, .sb-switch.is-rail:has(> .sb-switch-btn:focus-visible) > .sb-switch-tip { transform: translate(0, -50%); }
/* + New: the primary action */
.sb-project-wrap .sb-new-btn, .tn-project .sb-new-btn { padding: 8px 14px; border: 0; border-radius: 12px; background: var(--accent); color: var(--on-accent); font-weight: 800; box-shadow: 0 4px 12px color-mix(in srgb, var(--accent) 28%, transparent); transition: transform .15s ease, box-shadow .15s ease, background .15s ease; }
.sb-project-wrap .sb-new-btn:hover, .tn-project .sb-new-btn:hover { background: var(--accent-strong); border-color: transparent; transform: translateY(-1px); box-shadow: 0 6px 16px color-mix(in srgb, var(--accent) 34%, transparent); }
.sb-project-wrap .sb-new-btn .nav-icon, .tn-project .sb-new-btn .nav-icon { color: inherit; }
/* Project settings: a quiet icon until hovered */
.sb-settings-wrap { margin-left: auto; }
.tn-project .sb-settings-wrap { margin-left: 0; }
.sb-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 9px; background: transparent; color: var(--ink-muted); cursor: pointer; transition: background .15s ease, color .15s ease; }
.sb-icon-btn:hover { background: var(--surface-page); color: var(--ink-secondary); }
.sb-icon-btn:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: 1px; }
/* Dropdown: search, then Recent and All projects */
.sb-switch-pop { left: 0; top: calc(100% + 8px); width: min(320px, calc(100vw - 24px)); padding: 0; overflow: hidden; animation: ps-pop-in .15s ease-out; }
.sb-switch.is-rail .sb-switch-pop { left: calc(100% + 12px); top: -6px; }
.tn-project .sb-switch-pop, .tn-project .sb-switch-tip { left: auto; right: 0; }
.tn-project .sb-switch-tip::before { left: auto; right: 22px; }
@keyframes ps-pop-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.sb-switch-search { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--border-subtle); color: var(--ink-muted); }
.sb-switch-search input { border: 0; padding: 2px 0; background: transparent; font-size: 13.5px; color: var(--ink); outline: none; }
.sb-switch-search:focus-within { box-shadow: inset 0 -2px 0 var(--brand-cyan); }
.sb-switch-list { max-height: min(360px, 60vh); overflow-y: auto; padding: 4px 6px 6px; }
.sb-switch-group { padding: 8px 8px 4px; font-size: 11.5px; font-weight: 700; color: var(--ink-muted); }
.sb-switch-opt { display: flex; align-items: center; gap: 9px; padding: 6px 8px; border-radius: 8px; font-size: 13px; font-weight: 600; color: var(--ink); cursor: pointer; }
.sb-switch-opt.is-active { background: var(--brand-tint); }
.sb-switch-opt.is-current { font-weight: 800; }
.sb-switch-opt.is-current .sb-switch-name { color: var(--brand); }
.sb-switch-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sb-switch-tick { flex-shrink: 0; color: var(--brand); }
.sb-switch-rag { width: 9px; height: 9px; border-radius: 999px; flex-shrink: 0; }
.sb-switch-empty { padding: 6px 8px 10px; font-size: 12.5px; color: var(--ink-muted); }
@media (max-width: 820px) {
  .sb-switch.is-rail .sb-switch-pop { left: 0; top: calc(100% + 8px); }
  .sb-switch.is-rail .sb-tip { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .sb-switch-btn.sb-project.is-compact, .sb-project-wrap .sb-new-btn, .tn-project .sb-new-btn, .sb-switch-chev, .sb-tip { transition: none; }
  .sb-switch-btn.sb-project.is-compact:hover, .sb-project-wrap .sb-new-btn:hover, .tn-project .sb-new-btn:hover { transform: none; }
  .sb-switch-pop { animation: none; }
}
.sb-switch-btn.sb-project:focus:not(:focus-visible) { outline: none; }

/* ---- v4.78: Weekly catch-up "Escalate for discussion" ---------------------------- */
.cu-escalate { margin-top: 12px; padding: 10px 12px; border: 1px dashed var(--border-default); border-radius: 10px; display: flex; flex-direction: column; gap: 8px; }
.cu-escalate.is-on { border: 1px solid color-mix(in srgb, var(--danger-ink) 35%, var(--surface-card)); background: var(--danger-tint); }
.cu-escalate-check { display: flex; align-items: flex-start; gap: 9px; margin: 0; font-size: 13.5px; font-weight: 500; color: var(--ink); cursor: pointer; }
.cu-escalate-check input { width: 17px; height: 17px; margin: 2px 0 0; flex-shrink: 0; accent-color: var(--danger-ink); }
.cu-escalate-note input { font-size: 13px; padding: 8px 10px; background: var(--surface-card); }
.cu-esc-flag { display: inline-flex; align-items: center; margin-left: 6px; padding: 1px 7px; border-radius: 6px; font-size: 11px; font-weight: 800; background: var(--danger-tint); color: var(--danger-ink); white-space: nowrap; vertical-align: 1px; }
.cu-folded .cu-esc-flag { margin-left: 0; }
@media print { .cu-escalate { display: none; } }

  /* v4.79 Resource planner (43-…) */
  .rp-ctl { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
  .rp-nav { display: flex; gap: 6px; align-items: center; }
  .rp-nav .btn { padding: 4px 12px; font-size: 18px; line-height: 1.2; }
  .rp-nav b { min-width: 150px; text-align: center; }
  .rp-seg { display: inline-flex; border: 1px solid var(--border-default); border-radius: 9px; overflow: hidden; background: var(--surface-card); }
  .rp-seg button { border: none; background: none; padding: 7px 14px; font: inherit; font-weight: 600; color: var(--ink-secondary); cursor: pointer; }
  .rp-seg button.on { background: var(--brand); color: var(--on-brand); }
  .rp-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin: 16px 0; }
  .rp-tile { padding: 12px 14px; }
  .rp-tile-l { font-size: 12px; color: var(--ink-secondary); }
  .rp-tile-v { font-size: 21px; font-weight: 800; margin-top: 4px; }
  .rp-tile-s { font-size: 11.5px; color: var(--ink-muted); margin-top: 3px; }
  .rp-bar { height: 6px; background: var(--border-subtle); border-radius: 4px; overflow: hidden; margin-top: 4px; }
  .rp-bar i { display: block; height: 100%; background: var(--brand-cyan); }
  .rp-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--border-default); color: var(--ink-secondary); font-size: 13px; }
  .rp-tog { margin-left: auto; display: inline-flex; gap: 6px; align-items: center; cursor: pointer; }
  .rp-tog input { width: auto; }
  .rp-table { width: 100%; border-collapse: collapse; }
  .rp-table th { font-size: 11.5px; color: var(--ink-secondary); text-align: left; padding: 9px 10px; background: var(--surface-page); border-bottom: 1px solid var(--border-default); white-space: nowrap; }
  .rp-table td { padding: 7px 10px; border-bottom: 1px solid var(--border-subtle); vertical-align: middle; }
  .rp-table tfoot td { font-weight: 700; background: var(--surface-page); }
  .rp-c { text-align: center; } .rp-r { text-align: right; }
  .rp-who { display: flex; gap: 9px; align-items: center; border: none; background: none; padding: 0; cursor: pointer; text-align: left; font: inherit; color: inherit; }
  .rp-av { width: 28px; height: 28px; border-radius: 50%; background: var(--brand); color: var(--on-brand); display: grid; place-items: center; font-size: 11px; font-weight: 700; flex-shrink: 0; }
  .rp-av-un { background: var(--ink-muted); }
  .rp-nm { display: block; font-weight: 700; }
  .rp-rl { display: block; font-size: 11.5px; color: var(--ink-muted); }
  .rp-cell { border-radius: 8px; padding: 5px 6px; text-align: center; line-height: 1.15; min-width: 86px; }
  .rp-cell b { display: block; font-size: 13px; } .rp-cell small { font-size: 10.5px; }
  .rp-cell.lo, .rp-legend i.lo { background: var(--surface-page); color: var(--ink-secondary); border: 1px solid var(--border-subtle); }
  .rp-cell.ok, .rp-legend i.ok { background: var(--success-tint); color: var(--success-ink); }
  .rp-cell.wa, .rp-legend i.wa { background: var(--warning-tint); color: var(--warning-ink); }
  .rp-cell.ov, .rp-legend i.ov { background: var(--danger-tint); color: var(--danger-ink); }
  .rp-cell.off { background: repeating-linear-gradient(45deg, var(--surface-page), var(--surface-page) 5px, var(--border-subtle) 5px, var(--border-subtle) 10px); color: var(--ink-muted); }
  .rp-exp td { background: var(--surface-page); font-size: 12px; color: var(--ink-secondary); padding: 5px 10px; }
  .rp-pj { padding-left: 37px; display: flex; gap: 6px; align-items: center; }
  .rp-tag { font-size: 10.5px; padding: 1px 6px; border-radius: 5px; background: var(--flare-tint); color: var(--flare-ink); font-weight: 700; }
  .rp-tag.n { background: var(--border-subtle); color: var(--ink-secondary); }
  .rp-legend { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; padding: 10px 14px; font-size: 12px; color: var(--ink-secondary); }
  .rp-legend span { display: inline-flex; align-items: center; gap: 6px; }
  .rp-legend i { width: 14px; height: 10px; border-radius: 3px; display: inline-block; }
  .rp-legend-note { margin-left: auto; color: var(--ink-muted); }
  .rp-note { border-left: 4px solid var(--flare); font-size: 13px; margin-bottom: 12px; padding: 12px 16px; }

/* ---- perf (Doherty): skeleton placeholders, shown within the first paint ----
   Grey shapes in the place of the menu, the projects list and a screen's
   content while data loads, so the page responds at once. */
.skel { background: linear-gradient(90deg, var(--border-subtle, #eef1f6) 0%, #f6f8fb 40%, var(--border-subtle, #eef1f6) 80%); background-size: 200% 100%; animation: capyskel 1.2s ease-in-out infinite; border-radius: 8px; }
@keyframes capyskel { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }
@media (prefers-reduced-motion: reduce) { .skel { animation: none; } }
.skel-shell { display: flex; min-height: 100vh; background: var(--surface-page, #f7f9fc); }
.skel-side { width: 252px; flex: none; padding: 18px 14px; background: var(--surface-card, #fff); border-right: 1px solid var(--border-default, #e3e8f0); display: flex; flex-direction: column; gap: 12px; }
.skel-main { flex: 1; padding: 22px 26px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.skel-line { height: 12px; }
.skel-logo { height: 30px; width: 70%; margin-bottom: 10px; }
.skel-title { height: 24px; width: 260px; max-width: 60%; }
.skel-card { background: var(--surface-card, #fff); border: 1px solid var(--border-default, #e3e8f0); border-radius: 12px; padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.skel-row { display: flex; gap: 12px; align-items: center; }
.skel-row .skel-dot { width: 22px; height: 22px; border-radius: 999px; flex: none; }
.skel-row .skel-line { flex: 1; }
.skel-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.skel-tile { height: 74px; border-radius: 12px; }
.load-state.skel-view { align-items: stretch; gap: 14px; text-align: left; padding: 0; background: none; border: 0; }
@media (max-width: 760px) { .skel-side { display: none; } .skel-main { padding: 16px; } }

  /* v4.82 Actions & checkpoint redesign (44-checkpoint.js) */
  .ck-toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
  .ck-menu { position: relative; }
  .ck-menu > summary { list-style: none; cursor: pointer; }
  .ck-menu > summary::-webkit-details-marker { display: none; }
  .ck-menu-pop { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; min-width: 220px; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 10px; box-shadow: 0 10px 30px rgba(11,31,58,.14); padding: 6px; display: flex; flex-direction: column; }
  .ck-menu-pop button, .ck-menu-pop .ck-menu-file { text-align: left; background: none; border: none; padding: 8px 10px; border-radius: 7px; font: inherit; font-size: 13.5px; color: var(--ink); cursor: pointer; margin: 0; }
  .ck-menu-pop button:hover, .ck-menu-pop .ck-menu-file:hover { background: var(--brand-tint); }
  .ck-menu-pop hr { border: none; border-top: 1px solid var(--border-subtle); margin: 4px 0; }
  .ck-tabs { display: flex; gap: 6px; overflow-x: auto; margin: 16px 0 10px; padding-bottom: 2px; }
  .ck-tab { border: 1px solid var(--border-default); background: var(--surface-card); border-radius: 9px; padding: 7px 12px; font: inherit; font-size: 13px; font-weight: 700; color: var(--ink-secondary); cursor: pointer; white-space: nowrap; display: inline-flex; align-items: center; gap: 5px; }
  .ck-tab.on { background: var(--brand); color: var(--on-brand); border-color: var(--brand); }
  .ck-tab-new { font-size: 16px; padding: 5px 12px; }
  .ck-badge { font-size: 10.5px; font-weight: 800; padding: 1px 6px; border-radius: 5px; background: var(--flare-tint); color: var(--flare-ink); }
  .ck-tab.on .ck-badge { background: var(--flare); color: #fff; }
  .ck-badge-lg { font-size: 12px; padding: 3px 9px; }
  .ck-lock { font-size: 11px; }
  .ck-head { display: flex; gap: 16px; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; padding: 14px 18px; margin-bottom: 10px; }
  .ck-head-main { display: flex; gap: 18px; flex-wrap: wrap; align-items: flex-end; flex: 1; }
  .ck-head-f { display: flex; flex-direction: column; gap: 4px; margin: 0; font-size: 13.5px; }
  .ck-head-f input { padding: 6px 8px; font-size: 13px; }
  .ck-head-side { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
  .ck-saved { font-size: 12.5px; font-weight: 700; color: var(--success-ink); background: var(--success-tint); padding: 4px 10px; border-radius: 8px; }
  .ck-sent-l { font-size: 12px; color: var(--ink-secondary); }
  .ck-subtabs { display: flex; gap: 2px; border-bottom: 1px solid var(--border-default); margin-bottom: 14px; }
  .ck-subtab { border: none; background: none; padding: 9px 14px; font: inherit; font-size: 13.5px; font-weight: 700; color: var(--ink-secondary); cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -1px; }
  .ck-subtab.on { color: var(--ink); border-bottom-color: var(--brand-cyan); }
  .ck-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
  .ck-tile { padding: 12px 14px; }
  .ck-tile-n { font-size: 24px; font-weight: 800; }
  .ck-tile-l { font-size: 12px; color: var(--ink-secondary); }
  .ck-locked-note { font-size: 13px; color: var(--ink-secondary); margin-bottom: 10px; }
  .ck-log-card { padding: 0; overflow-x: auto; }
  .ck-log { width: 100%; border-collapse: collapse; table-layout: fixed; }
  .ck-log th { text-align: left; font-size: 11.5px; color: var(--ink-secondary); padding: 9px 12px; background: var(--surface-page); border-bottom: 1px solid var(--border-default); }
  .ck-log td { padding: 8px 12px; border-bottom: 1px solid var(--border-subtle); vertical-align: top; }
  .ck-log td input, .ck-log td select { padding: 5px 7px; font-size: 12.5px; width: 100%; }
  .ck-row td:first-child { border-left: 3px solid transparent; }
  .ck-row.ck-overdue td:first-child { border-left-color: var(--danger-ink); }
  .ck-row.ck-overdue .ck-due input, .ck-row.ck-overdue .ck-due span { color: var(--danger-ink); font-weight: 700; }
  .ck-row.ck-done { opacity: .6; }
  .ck-row.ck-done .ck-title { text-decoration: line-through; }
  .ck-row.is-open td { background: var(--surface-page); }
  .ck-expand { display: block; width: 100%; text-align: left; border: none; background: none; padding: 0; font: inherit; color: inherit; cursor: pointer; }
  .ck-title { font-weight: 700; font-size: 13.5px; }
  .ck-sub { display: block; font-size: 12px; color: var(--ink-muted); margin-top: 2px; }
  .ck-latest { color: var(--ink-secondary); }
  .ck-tag { font-size: 9.5px; font-weight: 800; letter-spacing: .04em; padding: 1px 5px; border-radius: 4px; margin-left: 6px; vertical-align: 1px; }
  .ck-tag-new { background: var(--flare-tint); color: var(--flare-ink); }
  .ck-tag-upd { background: var(--brand-tint); color: var(--brand); }
  .ck-tag-plan { background: var(--dependency-tint); color: var(--dependency-ink); }
  .ck-owner { display: flex; gap: 6px; align-items: center; }
  .ck-av { width: 24px; height: 24px; border-radius: 50%; background: var(--brand-tint); color: var(--brand); display: grid; place-items: center; font-size: 10px; font-weight: 800; flex-shrink: 0; }
  .ck-od { font-size: 10.5px; font-weight: 800; color: var(--danger-ink); }
  .ck-row select { width: auto; max-width: 100%; }
  .ck-exp td { background: var(--surface-page); }
  .ck-exp-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 18px; padding: 4px 0 8px; }
  .ck-exp-grid textarea { width: 100%; min-height: 70px; }
  .ck-hist { margin: 6px 0 0; padding-left: 18px; font-size: 12.5px; color: var(--ink-secondary); }
  .ck-upd-ro, .ck-minutes-ro { white-space: pre-wrap; font-size: 13.5px; }
  .ck-add td { background: #fbfcfe; }
  .ck-add input { border-style: dashed; }
  .ck-add-hint { font-size: 11.5px; color: var(--ink-muted); }
  .ck-email { display: grid; grid-template-columns: minmax(280px, 380px) 1fr; gap: 14px; align-items: start; }
  .ck-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; align-items: center; }
  .ck-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; background: var(--brand-tint); color: var(--brand); border-radius: 14px; padding: 3px 4px 3px 10px; }
  .ck-chip button { border: none; background: none; cursor: pointer; color: inherit; font-size: 14px; line-height: 1; padding: 0 4px; }
  .ck-email-btns { display: flex; flex-wrap: wrap; gap: 8px; }
  .ck-confirm { background: var(--warning-tint); color: var(--warning-ink); border-radius: 8px; padding: 8px 10px; font-size: 13px; font-weight: 600; }
  .ck-preview { border: 1px solid var(--border-default); border-radius: 8px; overflow: auto; background: #fff; color: #0b1f3a; }
  .ck-lists { border: 1px solid var(--border-subtle); border-radius: 8px; padding: 10px; display: flex; flex-direction: column; gap: 10px; }
  .ck-list { border-bottom: 1px solid var(--border-subtle); padding-bottom: 8px; }
  .ck-member-add { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
  .ck-member-add input, .ck-member-add select { flex: 1; min-width: 110px; padding: 5px 7px; font-size: 12.5px; }
  @media (max-width: 900px) { .ck-email, .ck-exp-grid { grid-template-columns: 1fr; } .ck-tiles { grid-template-columns: repeat(2, 1fr); } }

/* ---- v4.84 Side menu hierarchy (Peter, 2026-11-12): section headings read as dividers,
   pages as their children, and the screen you're on is unmistakable. ---- */
.sidebar .nav-group-header { gap: 6px; padding: 6px 8px; margin-top: 14px; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; color: var(--ink-muted); }
.sidebar .nav-group:first-child .nav-group-header { margin-top: 4px; }
.sidebar .nav-group-header .nav-group-label { flex: 0 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nav-group-rule { flex: 1 1 12px; min-width: 12px; height: 1px; background: var(--border-default); }
.sidebar .nav-group.has-active > .nav-group-header { color: var(--brand); }
.sidebar .nav-group.has-active > .nav-group-header .nav-group-rule { background: var(--brand); opacity: .25; }
.nav-group-here { flex-shrink: 0; width: 7px; height: 7px; border-radius: 999px; background: var(--brand); box-shadow: 0 0 0 2px var(--brand-tint); }
.sidebar .nav-group-items { margin: 2px 0 4px 12px; padding-left: 6px; border-left: 1px solid var(--border-default); }
.sidebar .nav-group-items .nav-row { border-radius: 999px; }
.sidebar .nav-row.active { background: var(--brand-tint); color: var(--brand); font-weight: 800; }
.sidebar .nav-row.active::before { left: -8.5px; top: 4px; bottom: 4px; width: 3px; border-radius: 3px; background: var(--brand); }
/* Breadcrumb above the page title */
.page-crumb { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0 0 6px; font-size: 12px; line-height: 16px; font-weight: 600; color: var(--ink-secondary); }
.page-crumb-section { border: 0; background: none; padding: 0; font: inherit; color: var(--ink-secondary); cursor: pointer; text-decoration: underline; text-decoration-color: var(--border-default); text-underline-offset: 3px; }
.page-crumb-section:hover { color: var(--brand); text-decoration-color: currentColor; }
.page-crumb-section:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: 2px; border-radius: 3px; }
.page-crumb-sep { color: var(--ink-muted); }
.page-crumb-page { color: var(--ink); font-weight: 700; }

/* ---- v4.85 Guided mode for clinicians (45-guided.js) ---- */
.gd-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.gd-learn-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 12px; border: 1px solid var(--border-default); border-radius: 8px; background: var(--surface-card); font: inherit; font-size: 13px; font-weight: 700; color: var(--ink); cursor: pointer; }
.gd-learn-btn:focus-visible, .gd-stage:focus-visible, .gd-tab:focus-visible, .gd-seg button:focus-visible, .gd-linkish:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: 2px; }
.gd-pill { display: inline-flex; align-items: center; font-size: 11px; font-weight: 700; line-height: 14px; padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.gd-ok { background: var(--success-tint); color: var(--success-ink); }
.gd-warn { background: var(--warning-tint); color: var(--warning-ink); }
.gd-bad { background: var(--danger-tint); color: var(--danger-ink); }
.gd-muted { background: var(--surface-page); color: var(--ink-secondary); border: 1px solid var(--border-default); }
.gd-stages { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-top: 18px; }
.gd-stage, .gd-tab { display: flex; flex-direction: column; align-items: stretch; gap: 10px; padding: 18px; text-align: left; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 12px; font: inherit; color: var(--ink); cursor: pointer; }
.gd-stage:hover, .gd-tab:hover { border-color: var(--brand); }
.gd-stage-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.gd-stage-title { font-size: 18px; line-height: 24px; font-weight: 800; }
.gd-tab-title { font-size: 14px; line-height: 20px; font-weight: 800; }
.gd-stage-what { font-size: 13px; line-height: 18px; color: var(--ink-secondary); }
.gd-stage-progress { font-size: 12.5px; color: var(--ink-secondary); }
.gd-ward { font-size: 13px; line-height: 18px; padding: 9px 12px; border-radius: 8px; background: var(--brand-tint); color: var(--ink); }
.gd-ward b { font-weight: 700; }
.gd-bar { display: block; height: 6px; border-radius: 999px; background: var(--border-subtle); overflow: hidden; }
.gd-bar > span { display: block; height: 6px; background: var(--brand); }
.gd-next { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; justify-content: space-between; margin-top: 20px; padding: 22px 24px; border-radius: 12px; background: var(--brand); color: var(--on-brand); }
.gd-next > div { flex: 1 1 360px; display: grid; gap: 4px; }
.gd-next-eyebrow { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #8fd8f7; }
.gd-next-title { font-size: 19px; line-height: 26px; font-weight: 800; }
.gd-next-body { font-size: 14px; color: #c9d3e3; }
.gd-next-btn { background: #fff; color: var(--brand); border: 0; min-height: 44px; padding: 0 20px; font-weight: 700; }
.gd-lessons { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.gd-lesson { display: grid; gap: 6px; align-content: start; }
.gd-start { display: grid; gap: 12px; margin-top: 18px; max-width: 760px; }
.gd-start-list { margin: 0; padding-left: 18px; display: grid; gap: 6px; font-size: 14px; }
.gd-tabs { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin: 18px 0 16px; }
.gd-tab.on { border: 2px solid var(--brand); padding: 17px; }
.gd-layout { display: flex; flex-wrap: wrap; gap: 20px; align-items: flex-start; }
.gd-main { flex: 999 1 560px; min-width: 0; }
.gd-coach { flex: 1 1 280px; max-width: 340px; display: grid; gap: 14px; }
.gd-coach-sep { border-top: 1px solid var(--border-default); padding-top: 14px; }
.gd-cee { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; }
.gd-cee > div { padding: 12px; border-radius: 8px; background: var(--surface-page); font-size: 13px; line-height: 18px; display: grid; gap: 4px; align-content: start; }
.gd-q { display: grid; gap: 12px; margin-bottom: 10px; padding: 16px 18px; }
.gd-q-top { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; justify-content: space-between; }
.gd-seg { display: inline-flex; gap: 6px; }
.gd-seg button { min-height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--border-default); background: var(--surface-card); color: var(--ink); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.gd-seg button.on { background: var(--brand); border-color: var(--brand); color: var(--on-brand); }
.gd-done { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; padding: 10px 14px; border-radius: 8px; background: var(--success-tint); color: var(--success-ink); font-size: 13px; line-height: 18px; }
.gd-suggest { display: grid; gap: 8px; padding: 12px 14px; border-radius: 8px; background: var(--brand-tint); }
.gd-suggest input { font: inherit; font-size: 14px; padding: 8px 10px; border: 1px solid var(--border-default); border-radius: 8px; background: var(--surface-card); color: var(--ink); }
.gd-suggest > input { font-weight: 700; }
.gd-suggest-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.gd-suggest-row label { display: grid; gap: 4px; font-size: 12px; font-weight: 700; color: var(--ink-secondary); }
.gd-smart { margin-top: 10px; padding: 14px; border: 1px solid var(--border-default); border-radius: 12px; background: var(--surface-card); display: grid; gap: 8px; }
.gd-smart-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.gd-smart-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--border-subtle); border-radius: 8px; }
.gd-letter { width: 26px; height: 26px; flex-shrink: 0; border-radius: 999px; background: var(--brand); color: var(--on-brand); font-size: 13px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; }
.gd-smart-text { flex: 1 1 260px; font-size: 13px; line-height: 18px; }
.gd-smart .gd-check { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; font-weight: 700; letter-spacing: normal; text-transform: none; color: var(--ink); cursor: pointer; }
.gd-check input { width: 18px; height: 18px; accent-color: var(--brand); }
.gd-smart-note { font-size: 12.5px; color: var(--ink-secondary); }
.gd-banner { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; justify-content: space-between; margin: 14px 0 16px; padding: 16px 18px; border: 1px solid var(--border-default); border-radius: 12px; background: var(--surface-card); }
.gd-banner-main { flex: 1 1 420px; display: grid; gap: 10px; }
.gd-banner-title { font-size: 15px; font-weight: 800; }
.gd-banner-side { display: flex; flex-wrap: wrap; gap: 8px; }
.gd-steps { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--ink-muted); }
.gd-steps > div { display: grid; gap: 2px; padding: 8px 12px; border-radius: 8px; background: var(--surface-page); color: var(--ink); font-size: 13px; }
.gd-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.gd-list { margin: 4px 0 0; padding-left: 18px; font-size: 13px; display: grid; gap: 2px; }
.gd-linkish { border: 0; background: none; padding: 0; font: inherit; font-weight: 700; color: var(--brand); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }

/* ---- v4.87 Section headings with character (Peter, 2026-11-12): a tinted icon chip,
   sentence case, a faint separator instead of the long rule; the section you're in
   has a cyan chip, dark bold label and a soft cyan pill. Overrides the v4.84 heading rules. ---- */
.sidebar .nav-group + .nav-group { border-top: 1px solid var(--border-subtle); margin-top: 8px; padding-top: 8px; }
.sidebar .nav-group-header, .sidebar .nav-group:first-child .nav-group-header { gap: 8px; margin-top: 0; padding: 6px 8px; font-size: 12.5px; font-weight: 600; letter-spacing: normal; text-transform: none; color: var(--ink-secondary); border-radius: 8px; }
.sidebar .nav-group-header:hover:not(.is-static) { background: var(--surface-page); color: var(--ink-secondary); }
.sidebar .nav-group-header .nav-group-label { flex: 1 1 auto; }
.nav-group-rule { display: none; }
.nav-group-chip { flex-shrink: 0; width: 20px; height: 20px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; background: var(--brand-tint); color: var(--brand); }
.nav-group-chip .nav-icon { color: inherit; }
.sidebar .nav-group-header .nav-group-chevron { color: var(--ink-muted); }
/* v4.87 follow-up: the soft cyan pill and dark bold label mark an open section; the cyan chip marks the section holding the current page. */
.sidebar .nav-group-header[aria-expanded="true"], .sidebar .nav-group-header[aria-expanded="true"]:hover { background: color-mix(in srgb, var(--brand-cyan) 12%, transparent); color: var(--ink); font-weight: 700; }
.sidebar .nav-group.has-active > .nav-group-header .nav-group-chip { background: var(--brand-cyan); color: #fff; }
.nav-group-here { background: var(--brand-cyan); box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand-cyan) 20%, transparent); }
.sidebar .nav-row.active::before { background: var(--brand-cyan); }

/* ---- v4.88 Weekly catch-up Overview header (Peter, 2026-11-12): one toolbar row,
   Portfolio health card, Needs attention ring cards, By stage stepper. ---- */
.cu-bar { background: var(--surface-card); border-radius: 12px; padding: 8px 12px; box-shadow: 0 1px 2px rgba(11,31,58,.06), 0 4px 12px rgba(11,31,58,.05); gap: 12px; margin: 14px 0 18px; }
.cu-export { margin-left: auto; }
.cu-sec-label { font-size: 12px; font-weight: 600; color: var(--ink-muted); margin: 0 0 6px 2px; }
.cu-health, .cu-attn-card, .cu-stepper-card { background: var(--surface-card); border-radius: 12px; box-shadow: 0 1px 2px rgba(11,31,58,.06), 0 4px 12px rgba(11,31,58,.05); }
.cu-health { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; padding: 16px 20px; margin-bottom: 16px; }
.cu-health.is-on { box-shadow: 0 0 0 1.5px var(--brand-cyan), 0 4px 12px rgba(11,31,58,.05); }
.cu-health button, .cu-attn-card, .cu-step-dot, .cu-notset { font-family: inherit; line-height: 1.3; color: inherit; cursor: pointer; }
.cu-health-total { display: flex; flex-direction: column; align-items: flex-start; border: 0; background: none; padding: 2px 6px; border-radius: 8px; }
.cu-health-total .cu-tile-n { font-size: 40px; font-weight: 800; line-height: 1; color: var(--ink); }
.cu-health-sub { font-size: 12.5px; color: var(--ink-muted); margin-top: 4px; }
.cu-health-mid { flex: 1 1 260px; min-width: 0; display: grid; gap: 10px; }
.cu-ragbar { display: flex; gap: 3px; height: 6px; border-radius: 999px; overflow: hidden; background: var(--border-subtle); }
.cu-ragbar span { display: block; height: 6px; opacity: .85; }
.cu-ragbar-green { background: #2E8B57; } .cu-ragbar-amber { background: #E39B1B; } .cu-ragbar-red { background: #C0392B; }
.cu-legend { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.cu-legend-item { display: inline-flex; align-items: center; gap: 6px; border: 0; background: none; padding: 3px 8px; margin-left: -8px; border-radius: 999px; font-size: 13px; color: var(--ink-secondary); }
.cu-legend-item .cu-tile-n { font-weight: 800; color: var(--ink); font-size: 13px; }
.cu-dot { width: 8px; height: 8px; border-radius: 999px; } .cu-dot-green { background: #2E8B57; } .cu-dot-amber { background: #E39B1B; } .cu-dot-red { background: #C0392B; }
.cu-changed-chip { display: inline-flex; align-items: center; gap: 8px; border: 0; background: var(--surface-page); border-radius: 999px; padding: 6px 12px; font-size: 12.5px; color: var(--ink-secondary); }
.cu-changed-chip .cu-tile-n { font-weight: 800; color: var(--ink); font-size: 13px; }
.cu-legend-item:hover, .cu-health-total:hover { background: var(--surface-page); }
.cu-legend-item.is-on, .cu-changed-chip.is-on { box-shadow: inset 0 0 0 1.5px var(--brand-cyan); }
.cu-attn { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; margin-bottom: 16px; }
.cu-attn-card { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 0; text-align: left; min-height: 86px; }
.cu-attn-card:hover { box-shadow: 0 1px 2px rgba(11,31,58,.08), 0 6px 16px rgba(11,31,58,.09); }
.cu-attn-card.is-on { box-shadow: 0 0 0 1.5px var(--brand-cyan), 0 4px 12px rgba(11,31,58,.05); }
.cu-ring { position: relative; flex-shrink: 0; width: 58px; height: 58px; display: inline-flex; align-items: center; justify-content: center; }
.cu-ring svg:first-child { position: absolute; inset: 0; }
.cu-ring circle { fill: none; stroke-width: 5; }
.cu-ring-track { stroke: var(--border-subtle); }
.cu-ring-fill { stroke-linecap: round; }
.cu-ring-red .cu-ring-fill { stroke: #C0392B; } .cu-ring-amber .cu-ring-fill { stroke: #E39B1B; } .cu-ring-cyan .cu-ring-fill { stroke: var(--brand-cyan); } .cu-ring-ok .cu-ring-fill { stroke: #2E8B57; }
.cu-ring-n { position: relative; font-size: 17px; font-weight: 800; color: var(--ink); }
.cu-ring-tick { position: relative; color: #2E8B57; }
.cu-attn-text { display: grid; gap: 2px; min-width: 0; }
.cu-attn-title { font-size: 13px; font-weight: 600; color: var(--ink); }
.cu-attn-hint { font-size: 12.5px; color: var(--ink-muted); }
.cu-link { font-size: 12.5px; font-weight: 700; color: #0087b8; }
.cu-stepper-card { padding: 18px 16px 14px; margin-bottom: 16px; overflow-x: auto; }
.cu-stepper { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(9, minmax(64px, 1fr)); min-width: 620px; position: relative; }
.cu-stepper::before { content: ''; position: absolute; left: calc(100% / 18); right: calc(100% / 18); top: 10px; height: 2px; background: var(--border-default); }
.cu-step { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.cu-step-dot { width: 20px; height: 20px; border-radius: 999px; padding: 0; display: inline-flex; align-items: center; justify-content: center; border: 1.5px solid var(--border-default); background: var(--surface-card); }
.cu-step-dot b { font-size: 11px; font-weight: 800; color: var(--ink-muted); }
.cu-step.has .cu-step-dot { background: var(--brand-cyan); border-color: var(--brand-cyan); box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-cyan) 18%, transparent); }
.cu-step.has .cu-step-dot b { color: #fff; }
.cu-step.is-on .cu-step-dot { box-shadow: 0 0 0 2px var(--surface-card), 0 0 0 4px var(--brand); }
.cu-step-name { font-size: 12px; line-height: 1.25; color: var(--ink-muted); }
.cu-step.has .cu-step-name { color: var(--ink); font-weight: 600; }
.cu-step.is-on .cu-step-name { font-weight: 800; }
.cu-notset { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; border: 0; background: none; padding: 4px 6px; border-radius: 8px; font-size: 12.5px; color: var(--ink-secondary); }
.cu-notset:hover { background: var(--surface-page); }
.cu-notset.is-on { box-shadow: inset 0 0 0 1.5px var(--brand-cyan); }
.cu-chip { display: inline-flex; min-width: 22px; justify-content: center; padding: 2px 7px; border-radius: 999px; background: var(--surface-page); color: var(--ink); font-size: 12px; font-weight: 800; }
.cu-health-total:focus-visible, .cu-legend-item:focus-visible, .cu-changed-chip:focus-visible, .cu-attn-card:focus-visible, .cu-step-dot:focus-visible, .cu-notset:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
@media print { .cu-health, .cu-attn-card, .cu-stepper-card, .cu-bar { box-shadow: none !important; border: 1px solid #e3e8f0; } }

/* ---- v4.90: Guided tube-map sidebar (47-tubemap.js). Guided mode only; Project ready keeps the sidebar above. ---- */
.tm-sidebar { width: 336px; }
.tm-sidebar .sb-head { padding-bottom: 6px; }
.tm-chrome-row { display: flex; align-items: center; gap: 8px; padding: 0 14px 8px; }
.tm-mode-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; color: var(--ink); background: color-mix(in srgb, var(--brand-cyan) 12%, transparent); padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.tm-mode-dot { width: 7px; height: 7px; border-radius: 999px; background: var(--brand-cyan); }
.tm-chrome-row .tm-search { flex: 1; min-width: 0; }
.tm-project { padding-bottom: 6px; }
.tm-project-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tm-project-name { font-size: 13px; font-weight: 700; color: var(--ink); margin-top: 6px; line-height: 1.3; }
.tm-project-meta { font-size: 11.5px; color: var(--ink-secondary); margin-top: 1px; }
.tm-overall { padding: 6px 14px 4px; }
.tm-overall-top { display: flex; justify-content: space-between; align-items: baseline; font-size: 11.5px; font-weight: 700; color: var(--ink-secondary); }
.tm-overall-top .data { font-size: 11px; color: var(--ink); }
.tm-overall-bar { height: 6px; border-radius: 999px; background: var(--border-subtle); overflow: hidden; margin-top: 5px; }
.tm-overall-bar span { display: block; height: 6px; border-radius: 999px; background: linear-gradient(90deg, var(--brand-cyan), var(--brand)); }
.tm-quick { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 6px 10px 4px; }
.sidebar .tm-quick .nav-row.tm-quick-btn { padding: 6px 8px; font-size: 12.5px; border-radius: 8px; }
.tm-map { position: relative; padding: 4px 12px 8px 12px; }
.tm-lines { position: absolute; left: 0; top: 0; pointer-events: none; z-index: 0; overflow: visible; }
.tm-fork-label { font-size: 10px; font-weight: 800; font-family: inherit; }
.tm-line { position: relative; z-index: 1; margin-top: 10px; }
.tm-line-head { display: flex; align-items: center; gap: 8px; padding: 2px 4px 4px 8px; font-size: 11.5px; font-weight: 800; color: var(--line); }
.tm-roundel { width: 14px; height: 14px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 3.5px var(--line); flex-shrink: 0; }
.tm-frac { margin-left: auto; font-size: 11px; font-weight: 500; color: var(--ink-muted); }
.tm-stations { list-style: none; margin: 0; padding: 0; }
.tm-st { position: relative; }
.tm-st-btn { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; border: 0; background: none; padding: 5px 30px 5px 0; border-radius: 10px; text-align: left; font: inherit; color: var(--ink); cursor: pointer; }
.tm-st-btn:hover { background: var(--surface-page); }
.tm-st-btn:focus-visible, .tm-rail-btn:focus-visible, .tm-review-btn:focus-visible { outline: 3px solid var(--brand-cyan); outline-offset: 1px; }
.tm-st.is-yes-rejoin .tm-st-btn { padding-left: 70px; }
.tm-st.is-if-needed .tm-st-btn { padding-left: 90px; }
.tm-orb { position: relative; flex-shrink: 0; display: inline-flex; border-radius: 999px; background: #fff; box-shadow: 0 0 0 3px #fff; }
.tm-orb svg { display: block; }
.tm-dot { position: absolute; left: 50%; top: 50%; width: 13px; height: 13px; margin: -6.5px 0 0 -6.5px; border-radius: 999px; }
.tm-orb.is-na .tm-dot { background: #e4e7ee; box-shadow: inset 0 0 0 1.5px #c5cad6; }
.tm-st-body { flex: 1 1 auto; min-width: 0; display: grid; gap: 1px; }
.tm-st-name { font-size: 12px; font-weight: 700; line-height: 1.25; }
.tm-st-sub { font-size: 10.5px; line-height: 1.3; color: var(--ink-secondary); }
.tm-st.is-muted .tm-st-name, .tm-st.is-muted .tm-st-sub { color: var(--ink-muted); }
.tm-st-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; flex-shrink: 0; }
.tm-count { font-size: 11px; color: var(--ink-secondary); }
.tm-src { font-size: 10px; font-weight: 700; line-height: 1; padding: 3px 6px; border-radius: 999px; white-space: nowrap; }
.tm-src-health { background: color-mix(in srgb, var(--brand-cyan) 14%, transparent); color: #006f94; }
.tm-src-review { background: var(--brand-tint); color: var(--brand); }
.tm-new { display: inline-block; vertical-align: 1px; font-size: 9.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: 1px 6px; border-radius: 999px; background: var(--flare-tint); color: var(--flare-ink); }
.tm-st.is-here { margin-top: 9px; }
.tm-st.is-here .tm-st-btn { padding-top: 10px; background: color-mix(in srgb, var(--line) 8%, #fff); box-shadow: inset 0 0 0 1.5px var(--line); }
.tm-st.is-here .tm-orb { box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--line); }
.tm-here { position: absolute; top: -8px; right: 8px; z-index: 2; background: var(--line); color: #fff; font-size: 9.5px; font-weight: 800; line-height: 1; padding: 3px 7px; border-radius: 999px; pointer-events: none; white-space: nowrap; }
.tm-review-btn { position: absolute; right: 3px; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: var(--ink-secondary); font-size: 15px; line-height: 1; cursor: pointer; opacity: 0; }
.tm-st:hover .tm-review-btn, .tm-review-btn:focus-visible, .tm-st:focus-within .tm-review-btn { opacity: 1; }
.tm-review-btn:hover { background: var(--surface-card); color: var(--ink); }
.tm-review-pop { position: absolute; left: 12px; right: 12px; z-index: 30; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 12px; box-shadow: 0 12px 30px rgba(11,31,58,.18); padding: 12px; display: grid; gap: 8px; }
.tm-review-title { font-size: 12.5px; font-weight: 800; }
.tm-review-rags { display: flex; gap: 6px; flex-wrap: wrap; }
.tm-rag-pick { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border-default); background: var(--surface-card); border-radius: 999px; padding: 4px 10px; font: inherit; font-size: 12px; font-weight: 700; color: var(--ink); cursor: pointer; }
.tm-rag-pick.is-on { border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); }
.tm-swatch { width: 10px; height: 10px; border-radius: 999px; }
.tm-review-label { font-size: 11.5px; margin: 0; }
.tm-review-pop input { font: inherit; font-size: 12.5px; padding: 6px 8px; border: 1px solid var(--border-default); border-radius: 8px; }
.tm-review-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.tm-dbnote { font-size: 12px; color: var(--warning-ink); background: var(--warning-tint); padding: 8px 10px; border-radius: 8px; }
.tm-others { margin: 4px 12px 0; border-top: 1px solid var(--border-subtle); padding-top: 6px; }
.tm-others summary { cursor: pointer; font-size: 12px; font-weight: 700; color: var(--ink-secondary); padding: 6px 4px; list-style: none; display: flex; justify-content: space-between; }
.tm-others summary::-webkit-details-marker { display: none; }
.tm-others summary .data { font-size: 11px; color: var(--ink-muted); }
.tm-legend { margin: 8px 12px 10px; padding: 10px 12px; border-radius: 10px; background: var(--surface-page); display: grid; gap: 4px; font-size: 11px; color: var(--ink-secondary); }
.tm-legend-title { font-size: 11.5px; font-weight: 800; color: var(--ink); }
.tm-legend-row { display: flex; align-items: center; gap: 8px; line-height: 1.3; }
.tm-legend-ring { width: 14px; height: 14px; border-radius: 999px; flex-shrink: 0; border: 2.5px solid var(--brand-cyan); border-right-color: #e3e8f0; border-bottom-color: #e3e8f0; }
.tm-legend-dot { width: 9px; height: 9px; margin: 0 2.5px; border-radius: 999px; flex-shrink: 0; background: #2E8B57; }
.tm-legend-swatches { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 2px; }
.tm-legend-swatches span { display: inline-flex; align-items: center; gap: 5px; }
.tm-legend-swatches i { width: 9px; height: 9px; border-radius: 999px; display: inline-block; }
.tm-legend-swatches i.is-na { background: #e4e7ee; box-shadow: inset 0 0 0 1.5px #c5cad6; }
.tm-rail-map { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 6px 0; }
.tm-rail-map::before { content: ''; position: absolute; top: 14px; bottom: 14px; left: 50%; width: 3px; margin-left: -1.5px; background: var(--border-default); border-radius: 3px; }
.tm-rail-st { position: relative; z-index: 1; }
.tm-rail-btn { border: 0; background: none; padding: 2px; border-radius: 999px; cursor: pointer; display: inline-flex; }
.tm-rail-st.is-here .tm-orb { box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--line); }
.tm-rail-tip { display: none; position: absolute; left: calc(100% + 10px); top: 50%; transform: translateY(-50%); z-index: 80; background: var(--ink); color: #fff; border-radius: 8px; padding: 6px 9px; white-space: nowrap; font-size: 11.5px; box-shadow: 0 8px 20px rgba(11,31,58,.2); }
.tm-rail-tip b { display: block; font-size: 12px; }
.tm-rail-st:hover .tm-rail-tip, .tm-rail-st:focus-within .tm-rail-tip { display: block; }
.tm-screen-count { font-size: 12.5px; color: var(--ink-secondary); background: var(--surface-card); border: 1px solid var(--border-default); padding: 4px 10px; border-radius: 999px; }
.tm-steplist { list-style: none; margin: 12px 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; color: var(--ink-secondary); }
.tm-steplist li { display: inline-flex; align-items: center; gap: 6px; }
.tm-steplist li.is-done { color: var(--success-ink); font-weight: 700; }
.tm-fieldset { border: 0; padding: 0; margin: 0; display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.tm-fieldset legend { font-size: 13px; font-weight: 700; margin-bottom: 6px; padding: 0; }
.tm-radio { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--ink); text-transform: none; letter-spacing: normal; margin: 0; }
.tm-hz-list { display: grid; gap: 10px; }
.tm-hz { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1.2fr) auto; gap: 8px; align-items: end; }
.tm-hz .field { margin: 0; }
@media (max-width: 900px) { .tm-hz { grid-template-columns: 1fr 1fr; } }
@media (max-width: 820px) {
  .tm-sidebar { width: 100%; }
  .tm-map { display: flex; overflow-x: auto; gap: 4px; padding: 4px 8px 10px; }
  .tm-lines, .tm-legend, .tm-review-btn, .tm-st-sub, .tm-src, .tm-review-pop { display: none !important; }
  .tm-line { flex-shrink: 0; margin-top: 0; }
  .tm-line-head { padding-left: 4px; }
  .tm-stations { display: flex; background: linear-gradient(var(--line), var(--line)) no-repeat 0 24px / 100% 4px; }
  .tm-st-btn, .tm-st.is-yes-rejoin .tm-st-btn, .tm-st.is-if-needed .tm-st-btn { flex-direction: column; width: 92px; padding: 6px 4px; gap: 4px; text-align: center; min-height: 0; }
  .tm-st-meta { align-items: center; }
  .tm-here { top: -4px; right: 2px; }
}
@media (prefers-reduced-motion: reduce) { .tm-st-btn, .tm-review-btn { transition: none; } }

/* ---- v4.92 Guided New project: the setup questionnaire as cards (48-setup-wizard.js) ---- */
.sw { max-width: 780px; margin: 8px auto 48px; --sw-ease: cubic-bezier(.2,.85,.25,1); }
.sw-top { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.sw-top-title { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.sw-top-name { font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sw-tally { display: flex; align-items: baseline; gap: 6px; padding: 7px 14px; border-radius: 999px; background: var(--brand-tint); color: var(--brand); font-size: 12.5px; transition: transform .25s var(--sw-ease), background .25s; }
.sw-tally b { font-family: 'IBM Plex Mono', monospace; font-size: 17px; min-width: 2ch; text-align: right; }
.sw-tally.sw-bump { animation: swBump .45s var(--sw-ease); }
@keyframes swBump { 0% { transform: scale(1); } 35% { transform: scale(1.08); background: #dff3fb; } 100% { transform: scale(1); } }
.sw-cancel { color: var(--ink-secondary); }

/* The rail: a tube line of stops, coloured by stage */
.sw-rail { margin: 0 4px 18px; }
.sw-rail ol { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; position: relative; }
.sw-rail ol::before { content: ''; position: absolute; left: 10px; right: 10px; top: 50%; height: 4px; margin-top: -2px; border-radius: 4px; background: var(--border-default); }
.sw-stop { flex: 1; display: flex; justify-content: center; position: relative; }
.sw-stop::before { content: ''; position: absolute; left: -50%; right: 50%; top: 50%; height: 4px; margin-top: -2px; background: var(--c); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--sw-ease); }
.sw-stop:first-child::before { display: none; }
.sw-stop.is-done::before, .sw-stop.is-here::before { transform: scaleX(1); }
.sw-stop-btn { position: relative; z-index: 1; width: 26px; height: 26px; padding: 0; border: 0; background: none; display: grid; place-items: center; cursor: pointer; border-radius: 50%; }
.sw-stop-btn:disabled { cursor: default; }
.sw-stop-dot { width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--border-default); transition: all .3s var(--sw-ease); }
.sw-stop.is-done .sw-stop-dot { background: var(--c); border-color: var(--c); }
.sw-stop.is-here .sw-stop-dot { width: 18px; height: 18px; background: #fff; border: 4px solid var(--c); box-shadow: 0 0 0 0 color-mix(in srgb, var(--c) 45%, transparent); animation: swHere 2s ease-out infinite; }
.sw-stop-btn:not(:disabled):hover .sw-stop-dot { transform: scale(1.25); }
.sw-stop-btn:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
@keyframes swHere { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--c) 45%, transparent); } 70% { box-shadow: 0 0 0 10px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }

/* The stage: the card, with a soft deck behind it */
.sw-stage { position: relative; }
.sw-deck span { position: absolute; left: 18px; right: 18px; height: 40px; bottom: -8px; border-radius: 18px; background: var(--surface-card); border: 1px solid var(--border-subtle); box-shadow: 0 6px 18px rgba(11,31,58,.05); z-index: 0; }
.sw-deck span + span { left: 36px; right: 36px; bottom: -16px; opacity: .7; }
.sw-card { position: relative; z-index: 1; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 18px; box-shadow: 0 18px 44px rgba(11,31,58,.09), 0 2px 6px rgba(11,31,58,.04); overflow: hidden; outline: none; }
.sw-section { border-top: 5px solid var(--c); }
.sw-card-body { padding: 30px 34px 10px; }
.sw-card.sw-entering { transition: transform .55s var(--sw-ease), opacity .4s ease; }
.sw-card.sw-leaving { position: absolute; top: 0; left: 0; right: 0; transition: transform .45s var(--sw-ease), opacity .3s ease; pointer-events: none; }
.sw-enter-fwd { transform: translateX(64px) rotate(.6deg) scale(.97); opacity: 0; }
.sw-enter-back { transform: translateX(-64px) rotate(-.6deg) scale(.97); opacity: 0; }
.sw-entering.is-in { transform: none; opacity: 1; }
.sw-leave-fwd.is-out { transform: translateX(-80px) scale(.96); opacity: 0; }
.sw-leave-back.is-out { transform: translateX(80px) scale(.96); opacity: 0; }

.sw-eyebrow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 12px; font-weight: 600; color: var(--ink-secondary); }
.sw-chip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: #fff; background: var(--c); }
.sw-sec-count { margin-left: auto; font-family: 'IBM Plex Mono', monospace; font-weight: 500; color: var(--ink-muted); }
.sw-h { font-size: 26px; font-weight: 800; line-height: 1.2; margin: 10px 0 6px; outline: none; }
.sw-lead { font-size: 15px; color: var(--ink-secondary); margin: 0 0 18px; max-width: 620px; }
.sw-disclaimer { font-size: 12px; color: var(--ink-muted); font-style: italic; margin: 18px 0 8px; }
.sw-small { font-size: 13px; color: var(--ink-secondary); margin: 6px 0 0; }
.sw-linkish { background: none; border: 0; padding: 0; color: var(--brand); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; font-size: inherit; }

/* Welcome */
.sw-hero { display: flex; gap: 6px; margin-bottom: 4px; }
.sw-hero span { height: 6px; flex: 1; border-radius: 6px; transform-origin: left; animation: swGrow .7s var(--sw-ease) both; }
.sw-hero span:nth-child(2) { animation-delay: .08s; } .sw-hero span:nth-child(3) { animation-delay: .16s; } .sw-hero span:nth-child(4) { animation-delay: .24s; } .sw-hero span:nth-child(5) { animation-delay: .32s; }
@keyframes swGrow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.sw-facts { display: flex; gap: 10px; flex-wrap: wrap; margin: 0 0 16px; }
.sw-facts span { padding: 8px 12px; border-radius: 10px; background: var(--surface-page); font-size: 13px; color: var(--ink-secondary); }
.sw-facts b { color: var(--ink); }
.sw-howto { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sw-howto li { padding: 12px 14px; border: 1px solid var(--border-subtle); border-radius: 12px; font-size: 13px; color: var(--ink-secondary); }
.sw-howto b { color: var(--ink); display: block; margin-bottom: 2px; }
.sw-resume { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 16px; padding: 14px 16px; border-radius: 12px; background: var(--brand-tint); }
.sw-resume div { flex: 1; min-width: 200px; display: flex; flex-direction: column; font-size: 13px; }

/* Basics */
.sw-fields { display: flex; flex-direction: column; gap: 14px; max-width: 520px; }
.sw-fields input#sw-name { font-size: 16px; padding: 12px 14px; }
.sw-optional { font-weight: 500; color: var(--ink-muted); font-size: 12px; }
.sw-field-help { font-size: 12.5px; color: var(--ink-secondary); margin-top: 6px; }
.sw-warn { color: var(--danger-ink); font-weight: 600; }

/* Questions */
.sw-qs { display: flex; flex-direction: column; gap: 6px; }
.sw-q { display: flex; gap: 14px; padding: 16px 14px; margin: 0 -14px; border-radius: 14px; transition: background .3s; scroll-margin: 120px; }
.sw-q.is-answered { background: transparent; }
.sw-q.sw-pulse { animation: swPulse 1s ease; }
@keyframes swPulse { 0%, 100% { background: transparent; } 30% { background: var(--warning-tint); } }
.sw-q + .sw-q { border-top: 1px solid var(--border-subtle); border-radius: 0; }
.sw-q-num { flex: none; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; font-family: 'IBM Plex Mono', monospace; font-size: 12px; font-weight: 500; color: var(--ink-secondary); background: var(--surface-page); transition: background .3s, color .3s; }
.sw-q.is-answered .sw-q-num { background: var(--c, var(--brand)); color: #fff; }
.sw-tick { font-size: 16px; font-weight: 800; animation: swPop .35s var(--sw-ease); }
.sw-q-main { flex: 1; min-width: 0; }
.sw-q-text { font-size: 16.5px; font-weight: 700; line-height: 1.35; }
.sw-q-why { font-size: 13px; color: var(--ink-secondary); margin-top: 4px; }
.sw-q-why b { color: var(--ink); font-weight: 600; }
.sw-help { margin-top: 6px; font-size: 13px; }
.sw-help summary { cursor: pointer; color: var(--brand); font-weight: 600; width: max-content; list-style: none; }
.sw-help summary::-webkit-details-marker { display: none; }
.sw-help summary::before { content: '+ '; }
.sw-help[open] summary::before { content: '− '; }
.sw-help div { margin-top: 6px; padding: 10px 12px; border-radius: 10px; background: var(--surface-page); color: var(--ink-secondary); animation: swFadeDown .25s ease; }
.sw-q-note { font-size: 12px; color: var(--ink-muted); margin-top: 6px; }

.sw-opts { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.sw-opts-choice { flex-direction: column; align-items: stretch; max-width: 460px; }
.sw-opt { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 18px; border-radius: 12px; border: 1.5px solid var(--border-default); background: #fff; color: var(--ink); font-weight: 600; cursor: pointer; text-align: left; transition: border-color .2s, background .2s, transform .15s var(--sw-ease), box-shadow .2s; }
.sw-opts-yesno .sw-opt { min-width: 92px; justify-content: center; }
.sw-opt:hover { border-color: var(--brand); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(11,31,58,.08); }
.sw-opt:active { transform: translateY(0) scale(.98); }
.sw-opt:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.sw-opt-mark { width: 16px; height: 16px; flex: none; border-radius: 50%; border: 2px solid var(--border-default); transition: all .2s var(--sw-ease); }
.sw-opts-multi .sw-opt-mark { border-radius: 5px; }
.sw-opts-yesno .sw-opt-mark { display: none; }
.sw-opt.is-on { border-color: var(--brand); background: var(--brand); color: #fff; box-shadow: 0 6px 16px rgba(11,31,58,.18); }
.sw-opt.is-on .sw-opt-mark { border-color: #fff; background: #fff; box-shadow: inset 0 0 0 3px var(--brand); }
.sw-opts-multi .sw-opt.is-on .sw-opt-mark { box-shadow: none; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' stroke='%230b1f3a' stroke-width='2.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }
.sw-opt.is-unsure.is-on { background: var(--warning-tint); color: var(--warning-ink); border-color: #e3b15c; box-shadow: none; }
.sw-opt.is-unsure.is-on .sw-opt-mark { border-color: #e3b15c; background: #e3b15c; box-shadow: none; }

.sw-effect:empty { display: none; }
.sw-effect-in { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; font-size: 13px; color: var(--ink-secondary); }
.sw-effect-in.sw-pop { animation: swFadeDown .35s var(--sw-ease); }
.sw-effect-badge { padding: 3px 10px; border-radius: 999px; background: var(--success-tint); color: var(--success-ink); font-weight: 800; font-size: 12px; }
.is-none .sw-effect-badge { background: var(--surface-page); color: var(--ink-secondary); }
.sw-confirm { padding: 2px 9px; border-radius: 999px; background: var(--warning-tint); color: var(--warning-ink); font-weight: 600; font-size: 12px; }
.sw-added { list-style: none; margin: 4px 0 0; padding: 0; width: 100%; display: flex; flex-direction: column; gap: 6px; animation: swFadeDown .3s ease; }
.sw-added li { display: flex; gap: 10px; align-items: baseline; padding: 8px 10px; border-radius: 10px; background: var(--surface-page); color: var(--ink); font-size: 13px; }
.sw-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; transform: translateY(-1px); }
.sw-added-meta { display: block; font-size: 11.5px; color: var(--ink-muted); margin-top: 2px; }
@keyframes swFadeDown { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes swPop { 0% { transform: scale(.4); opacity: 0; } 70% { transform: scale(1.15); } 100% { transform: scale(1); opacity: 1; } }

/* Footer */
.sw-foot { display: flex; align-items: center; gap: 12px; padding: 16px 34px 22px; border-top: 1px solid var(--border-subtle); background: linear-gradient(#fff, #fbfcfe); }
.sw-foot-hint { flex: 1; text-align: right; font-size: 12.5px; color: var(--ink-muted); }
.sw-next, .sw-create { display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; font-size: 14.5px; border-radius: 12px; transition: opacity .25s, transform .2s var(--sw-ease), box-shadow .25s; }
.sw-next.is-waiting { opacity: .5; }
.sw-next.is-ready { box-shadow: 0 8px 20px rgba(11,31,58,.22); }
.sw-next.is-ready .sw-arrow, .sw-create .sw-arrow { animation: swNudgeArrow 1.6s ease-in-out infinite; }
.sw-arrow { display: inline-block; }
@keyframes swNudgeArrow { 0%, 60%, 100% { transform: none; } 30% { transform: translateX(4px); } }
.sw-next.sw-shake { animation: swShake .4s ease; }
@keyframes swShake { 0%, 100% { transform: none; } 20% { transform: translateX(-6px); } 40% { transform: translateX(6px); } 60% { transform: translateX(-4px); } 80% { transform: translateX(3px); } }
.sw-create { padding: 13px 24px; font-size: 15.5px; background: linear-gradient(135deg, var(--brand), #13406f); box-shadow: 0 10px 26px rgba(11,31,58,.28); }

/* Your plan */
.sw-total { display: flex; align-items: center; gap: 14px; margin: 6px 0 16px; }
.sw-big { font-family: 'IBM Plex Mono', monospace; font-size: 56px; font-weight: 500; line-height: 1; color: var(--brand); min-width: 3ch; }
.sw-total-words { font-size: 18px; font-weight: 800; line-height: 1.2; }
.sw-total-words small { font-size: 12.5px; font-weight: 500; color: var(--ink-secondary); }
.sw-stages { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin-bottom: 12px; }
.sw-stage-tile { padding: 12px; border-radius: 12px; background: color-mix(in srgb, var(--c) 9%, #fff); border: 1px solid color-mix(in srgb, var(--c) 25%, #fff); display: flex; flex-direction: column; gap: 4px; animation: swRise .5s var(--sw-ease) both; animation-delay: var(--d); }
.sw-stage-name { font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--c); }
.sw-stage-n { font-family: 'IBM Plex Mono', monospace; font-size: 24px; color: var(--ink); }
.sw-stage-bar { height: 5px; border-radius: 5px; background: color-mix(in srgb, var(--c) 18%, #fff); overflow: hidden; }
.sw-stage-bar span { display: block; height: 100%; width: var(--w); background: var(--c); border-radius: 5px; transform-origin: left; animation: swGrow .8s var(--sw-ease) both; animation-delay: calc(var(--d) + .2s); }
@keyframes swRise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.sw-gates { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.sw-gate { padding: 5px 12px; border-radius: 999px; border: 1px dashed var(--border-default); font-size: 12.5px; color: var(--ink-secondary); }
.sw-gate b { color: var(--ink); }
.sw-review-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sw-panel { border: 1px solid var(--border-subtle); border-radius: 14px; padding: 14px 16px; margin-bottom: 12px; }
.sw-panel h3 { font-size: 13px; font-weight: 800; margin: 0 0 6px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-secondary); }
.sw-timeline { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; }
.sw-timeline li { position: relative; display: flex; align-items: center; gap: 10px; font-size: 13px; padding: 5px 0; }
.sw-timeline li span { flex: 1; }
.sw-timeline li i { width: 11px; height: 11px; flex: none; border-radius: 50%; background: #fff; border: 3px solid var(--brand); position: relative; z-index: 1; }
.sw-confirm-list { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.sw-confirm-list li { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; padding: 6px 10px; border-radius: 8px; background: var(--warning-tint); color: var(--warning-ink); }
.sw-mods { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sw-mod { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: 12px; border: 1.5px solid var(--border-default); cursor: pointer; transition: border-color .2s, background .2s; }
.sw-mod.is-on { border-color: var(--brand); background: var(--brand-tint); }
.sw-mod input { margin-top: 3px; }
.sw-mod b { display: block; font-size: 13px; }
.sw-mod small { display: block; font-size: 12px; font-weight: 500; color: var(--ink-secondary); margin-top: 2px; }
.sw-all { margin-top: 4px; }
.sw-all summary { cursor: pointer; font-weight: 700; color: var(--brand); padding: 6px 0; }
.sw-list-stage { margin: 10px 0 14px; padding-left: 12px; border-left: 4px solid var(--c); }
.sw-list-stage h4 { margin: 0 0 6px; font-size: 14px; color: var(--c); }
.sw-list-stage h4 span { font-family: 'IBM Plex Mono', monospace; color: var(--ink-muted); font-weight: 500; }
.sw-list-station-name { font-size: 12.5px; font-weight: 700; margin: 8px 0 4px; }
.sw-list-station ul { margin: 0; padding-left: 18px; font-size: 13px; display: flex; flex-direction: column; gap: 4px; }

/* Creating */
.sw-build { list-style: none; margin: 16px 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.sw-build li { display: flex; align-items: center; gap: 12px; font-size: 15px; color: var(--ink-muted); transition: color .3s; }
.sw-build li.is-now, .sw-build li.is-done { color: var(--ink); font-weight: 600; }
.sw-build-mark { width: 22px; height: 22px; border-radius: 50%; border: 3px solid var(--border-default); flex: none; position: relative; }
.sw-build li.is-now .sw-build-mark { border-color: var(--brand-cyan); border-top-color: transparent; animation: swSpin .8s linear infinite; }
.sw-build li.is-done .sw-build-mark { border-color: var(--success-ink); background: var(--success-ink); animation: swPop .35s var(--sw-ease); }
.sw-build li.is-done .sw-build-mark::after { content: ''; position: absolute; left: 5px; top: 1px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
@keyframes swSpin { to { transform: rotate(360deg); } }
.sw-retry { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0 20px; }

@media (max-width: 720px) {
  .sw { margin-top: 0; }
  .sw-card-body { padding: 22px 18px 6px; }
  .sw-foot { padding: 14px 18px 18px; position: sticky; bottom: 0; z-index: 2; }
  .sw-foot-hint { display: none; }
  .sw-h { font-size: 22px; }
  .sw-howto, .sw-review-grid, .sw-mods { grid-template-columns: 1fr; }
  .sw-stages { grid-template-columns: repeat(5, minmax(56px, 1fr)); overflow-x: auto; }
  .sw-tally span { display: none; }
  .sw-opts-yesno .sw-opt { flex: 1; min-width: 0; }
  .sw-q { margin: 0 -8px; padding: 14px 8px; }
  .sw-q-num { width: 32px; height: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .sw *, .sw *::before, .sw *::after { animation: none !important; transition: opacity .15s linear !important; }
  .sw-enter-fwd, .sw-enter-back, .sw-leave-fwd.is-out, .sw-leave-back.is-out { transform: none; }
}

/* ---- v4.93 hardening ------------------------------------------------------ */
/* Setup questionnaire: Continue pressed early names and outlines what's missing. */
.sw-q.sw-missing:not(.is-answered) { box-shadow: inset 3px 0 0 #C77700; border-radius: 6px; }
.sw-foot-hint.is-missing { color: var(--warning-ink); font-weight: 600; }
.sw-gate-note { color: var(--ink-muted); }
@media (max-width: 720px) {
  .sw-foot-hint.is-missing { display: block; flex-basis: 100%; order: -1; text-align: left; }
  .sw-foot { flex-wrap: wrap; }
}
/* render(): a failing after-render step shows this small notice, not a blank page. */
.capy-render-error { position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 9999; display: flex; align-items: center; gap: 8px; max-width: min(560px, calc(100vw - 24px)); padding: 10px 12px; background: #fff8e6; color: #5a3b00; border: 1px solid #f0c36d; border-radius: 10px; box-shadow: 0 6px 20px rgba(0,0,0,.12); font-size: 13px; }
.capy-render-error span { flex: 1; }
/* Mobile: never let long text (file names, codes) push the page sideways. */
.notice, .error-banner, .info-banner, .card code, .card pre { overflow-wrap: anywhere; }
/* Sign-in "or" divider: darker text for contrast (WCAG AA). */
.auth-divider { color: var(--ink-secondary); }
@media (max-width: 820px) {
  /* Guided tube map on phones/tablets: scrolls inside its own strip instead of widening the page. */
  .sidebar-scroll, .tm-sidebar, .tm-map { min-width: 0; max-width: 100%; }
}
@media (max-width: 820px) {
  /* Long words (migration file names, codes) wrap instead of pushing the page sideways. */
  .main { overflow-wrap: break-word; }
}
@media (max-width: 820px) {
  /* Wide tables sitting straight in a card (e.g. Admin) scroll inside the card. */
  .main .card > table { display: block; max-width: 100%; overflow-x: auto; }
}
/* Project plan header: the Plan / Gantt chart tabs get their own row under the
   subtitle (they shared its grid cell and sat on top of it on narrow screens). */
.plan-head > div:first-child > .plan-tabs { grid-column: 1 / -1; grid-row: 3; justify-self: start; margin-top: 8px !important; }
@media (max-width: 1400px) { .plan-head > .plan-toolbar-wrap { grid-row: 4; } }
@media (max-width: 600px) {
  /* Top menu on phones: tighter group buttons so it wraps to fewer rows before the content. */
  .tn-bar { gap: 4px 8px; }
  .tn-menu { gap: 0; }
  .tn-group-btn { min-height: 40px; padding: 0 6px; font-size: 12.5px; gap: 3px; }
}