*, *::before, *::after { box-sizing: border-box; }

    :root {
      --sn-navy:       #032D42;
      --sn-green:      #62D84E;
      --sn-green-dark: #52c83e;
      --dark-teal:     #044355;
      --icon-bg:       #2A4F62;
      --glass-bg:      rgba(255,255,255,.07);
      --glass-border:  rgba(255,255,255,.12);
      --shadow-lg:     0 10px 25px rgba(0,0,0,.4);
      /* Brand fonts — match the presentation deck */
      --font-body:    -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
      --font-display: 'ServiceNow Display Bold','ServiceNow Display','ServiceNow Sans','Arial Bold',Arial,-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",sans-serif;
    }

    body { background: #f4f6f8; font-family: var(--font-body) !important; font-size: 15px !important; line-height: 1.6 !important; color: #1a1a1a; }
    .an-wrap { max-width: 1400px; margin: 0 auto; padding-bottom: 40px; }
    .an-header { margin-bottom: 18px; }
    .an-header-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
    .an-subtitle { font-size: 0.9rem; color: #667; }
    .an-toggle { display: inline-flex; background: #eef1f3; border-radius: 100px; padding: 3px; }
    .an-toggle-btn { border: none; background: none; font-family: var(--font-display); font-size: 0.78rem; font-weight: 700; padding: 6px 14px; border-radius: 100px; cursor: pointer; color: #667; transition: all .15s; }
    .an-toggle-btn.active { background: var(--sn-navy); color: #fff; }
    .an-pill { display: none; font-size: 0.68rem; font-weight: 700; color: #b8860b; background: #fff8e6; border: 1px solid #f0e0b0; border-radius: 100px; padding: 2px 9px; margin-left: 8px; vertical-align: middle; white-space: nowrap; }
    .an-pill.show { display: inline-block; }
    .an-kpi-label { display: flex; align-items: center; }
    .an-kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 20px; }
    .an-kpi { background: #fff; border-left: 4px solid var(--sn-green); border-radius: 10px; padding: 16px 18px; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
    .an-kpi-label { font-size: 0.82rem; color: #667; margin-bottom: 6px; }
    .an-kpi-value { font-family: var(--font-display); font-size: 1.9rem; font-weight: 700; color: var(--sn-navy); }
    .an-kpi-sub { font-size: 0.78rem; color: #8a8; margin-top: 4px; }
    .an-card { background: #fff; border-radius: 10px; padding: 18px 20px; box-shadow: 0 1px 3px rgba(0,0,0,.06); margin-bottom: 20px; }
    .an-card-title { font-family: var(--font-display); font-weight: 700; color: var(--sn-navy); font-size: 1rem; margin-bottom: 12px; }
    .an-chart-box { position: relative; height: 300px; }
    .an-row3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
    .an-req-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; font-size: 0.85rem; }
    .an-req-name { flex: 0 0 110px; color: #334; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .an-req-bar-track { flex: 1; height: 8px; background: #eef1f3; border-radius: 4px; overflow: hidden; }
    .an-req-bar-fill { height: 100%; background: var(--sn-green); border-radius: 4px; }
    .an-req-count { flex: 0 0 24px; text-align: right; color: #556; font-weight: 600; font-size: 0.82rem; }
    .an-footnote { text-align: center; font-size: 0.78rem; color: #99a; margin-top: 4px; }
    @media (max-width: 900px) { .an-kpi-grid, .an-row3 { grid-template-columns: 1fr; } }

    .an-wrap.an-dark { background: var(--sn-navy); margin: -24px -20px 0; padding: 32px 20px 48px; transition: background .15s; }
    .an-wrap.an-dark .page-title-light { color: #fff; }
    .an-wrap.an-dark .an-subtitle { color: rgba(255,255,255,.6); }
    .an-wrap.an-dark .an-kpi { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.15); border-left: 4px solid var(--sn-green); backdrop-filter: blur(4px); }
    .an-wrap.an-dark .an-kpi-label { color: rgba(255,255,255,.7); }
    .an-wrap.an-dark .an-kpi-value { color: #fff; }
    .an-wrap.an-dark .an-kpi-sub { color: rgba(98,216,78,.85); }
    .an-wrap.an-dark .an-footnote { color: rgba(255,255,255,.5); }
    .an-wrap.an-dark .an-toggle { background: rgba(255,255,255,.12); }
    .an-wrap.an-dark .an-toggle-btn { color: rgba(255,255,255,.7); }
    .an-wrap.an-dark .an-toggle-btn.active { background: var(--sn-green); color: var(--sn-navy); }
    .an-wrap.an-dark .an-req-name { color: rgba(255,255,255,.85); }
    .an-wrap.an-dark .an-req-count { color: rgba(255,255,255,.7); }
    .an-wrap.an-dark .an-req-bar-track { background: rgba(255,255,255,.12); }
    .an-wrap.an-dark .an-pill { background: rgba(255,248,230,.9); }
    .an-wrap.an-dark .an-card { background: var(--dark-teal); box-shadow: 0 1px 3px rgba(0,0,0,.3); }
    .an-wrap.an-dark .an-card-title { color: #fff; }
    /* Override Bootstrap font */
    *, *::before, *::after { font-family: inherit; }
    /* Brand display font for headings, buttons and emphasis */
    h1, h2, h3, h4, h5, h6, .fw-bold, .fw-bolder, strong, b,
    .btn, button, .nav-link, .olivia-wordmark { font-family: var(--font-display); }

    /* ── Header ── */
    .olivia-header {
      background: var(--sn-navy);
      padding: 20px 32px;
      display: flex;
      align-items: center;
      gap: 16px;
      border-bottom: 3px solid var(--sn-green);
    }
    .olivia-wordmark { font-size: 1.6rem; font-weight: 700; color: #fff; letter-spacing: 0.3px; }
    .olivia-wordmark.pulse { animation: pulse 1.5s ease-in-out infinite; }
    @keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.45} }
    .olivia-sub { font-size: 0.8rem; color: rgba(255,255,255,.6); margin-top: 2px; }

    .nav-hamburger { display: none; margin-left: auto; background: none; border: none; padding: 8px; cursor: pointer; }
    .nav-hamburger-icon, .nav-hamburger-icon::before, .nav-hamburger-icon::after {
      display: block; width: 24px; height: 2px; background: #fff; border-radius: 2px; transition: transform .15s, opacity .15s;
    }
    .nav-hamburger-icon::before, .nav-hamburger-icon::after { content: ""; position: relative; }
    .nav-hamburger-icon::before { top: 7px; }
    .nav-hamburger-icon::after { top: 5px; }
    .nav-hamburger.open .nav-hamburger-icon { background: transparent; }
    .nav-hamburger.open .nav-hamburger-icon::before { top: 0; transform: rotate(45deg); }
    .nav-hamburger.open .nav-hamburger-icon::after { top: -2px; transform: rotate(-45deg); }

    /* ── Nav tabs ── */
    .nav-tabs { border-bottom: 2px solid #dee2e6; background: #fff; padding: 0 24px; }
    .nav-tabs .nav-link { color: #666; border: none; border-bottom: 3px solid transparent; padding: 12px 20px; font-weight: 600; font-size: 0.9rem; margin-bottom: -2px; }
    .nav-tabs .nav-link.active { color: var(--sn-navy); border-bottom-color: var(--sn-green); background: none; }
    .nav-tabs .nav-link:hover:not(.active) { color: var(--sn-navy); border-bottom-color: #ccc; }
    .nav-tabs .nav-link:focus:not(:focus-visible) { outline: none; }

    @media (max-width: 600px) {
      .nav-hamburger { display: block; }
      .nav-tabs {
        display: none;
        flex-direction: column;
        padding: 8px 0;
        box-shadow: 0 4px 10px rgba(0,0,0,.12);
      }
      .nav-tabs.open { display: flex; }
      .nav-tabs .nav-item { width: 100%; }
      .nav-tabs .nav-link { display: block; padding: 12px 24px; border-bottom: none; border-left: 3px solid transparent; }
      .nav-tabs .nav-link.active { border-bottom-color: transparent; border-left-color: var(--sn-green); background: #f7f9fa; }
    }

    /* ── Cards ── */
    .olivia-card { background: #fff; border-radius: 10px; padding: 28px; box-shadow: 0 1px 4px rgba(0,0,0,.08); margin-bottom: 16px; }

    /* ── Buttons ── */
    .btn-olivia { background: var(--sn-navy); color: #fff; font-weight: 700; border: none; padding: 11px 32px; border-radius: 6px; font-size: 0.95rem; }
    .btn-olivia:hover { background: #054468; color: #fff; }
    .btn-olivia:disabled { opacity: .45; }
    .btn-olivia-outline { background: none; border: 2px solid var(--sn-navy); color: var(--sn-navy); font-weight: 700; padding: 9px 28px; border-radius: 6px; font-size: 0.95rem; }
    .btn-olivia-outline:hover { background: var(--sn-navy); color: #fff; }
    .btn-green { background: var(--sn-green); color: var(--sn-navy); font-weight: 700; border: none; padding: 11px 32px; border-radius: 6px; font-size: 0.95rem; }
    .btn-green:hover { background: var(--sn-green-dark); color: var(--sn-navy); }

    /* ── Form ── */
    .form-label { font-weight: 600; font-size: 0.85rem; color: #444; margin-bottom: 5px; }
    .form-control, .form-select { border-radius: 6px; border: 1px solid #d1d5db; font-size: 0.95rem; padding: 10px 12px; }
    .form-control:focus, .form-select:focus { border-color: var(--sn-navy); box-shadow: 0 0 0 2px rgba(3,45,66,.12); }
    .auto-badge { font-size: 0.7rem; background: var(--sn-green); color: var(--sn-navy); font-weight: 700; padding: 2px 8px; border-radius: 100px; margin-left: 6px; vertical-align: middle; }

    /* ── Pilot gate ── */
    #pilotGate {
      min-height: calc(100vh - 64px);
      background: var(--sn-navy);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 48px 16px;
    }
    .gate-inner { width: 100%; max-width: 420px; }
    .gate-logo { font-family: var(--font-display); font-size: 2.8rem; font-weight: 700; color: #fff; letter-spacing: 0.3px; text-align: center; margin-bottom: 6px; }
    .gate-tagline { text-align: center; color: rgba(255,255,255,.55); font-size: 0.9rem; margin-bottom: 36px; }
    .glass-card {
      background: var(--glass-bg);
      border: 1px solid var(--glass-border);
      border-radius: 1rem;
      padding: 28px 32px;
      box-shadow: var(--shadow-lg);
      backdrop-filter: blur(4px);
    }
    .glass-card .form-label { color: rgba(255,255,255,.75); }
    .glass-card .form-control,
    .glass-card .form-select {
      background: rgba(255,255,255,.08);
      border: 1px solid rgba(255,255,255,.18);
      color: #fff;
      border-radius: 8px;
    }
    .glass-card .form-control::placeholder { color: rgba(255,255,255,.35); }
    .glass-card .form-control:focus,
    .glass-card .form-select:focus {
      background: rgba(255,255,255,.12);
      border-color: var(--sn-green);
      box-shadow: 0 0 0 3px rgba(98,216,78,.18);
      color: #fff;
    }
    .btn-gate {
      width: 100%;
      background: var(--sn-green);
      color: var(--sn-navy);
      font-weight: 800;
      border: none;
      padding: 13px;
      border-radius: 8px;
      font-size: 1rem;
      transition: background .15s;
    }
    .btn-gate:hover { background: #52c83e; }
    .btn-gate:disabled { opacity: .45; }
    .gate-not-found { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 8px; padding: 20px 24px; text-align: center; margin-top: 12px; }
    .gate-not-found .nf-title { font-weight: 700; color: #fff; margin-bottom: 6px; font-size: 1rem; }
    .gate-not-found .nf-body { font-size: 0.88rem; color: rgba(255,255,255,.6); line-height: 1.6; }

    /* ── Submit tab container ── */
    .submit-wrap { background: var(--sn-navy); min-height: calc(100vh - 120px); margin: -24px -20px 0; padding: 32px 20px 48px; }
    .submit-inner { max-width: 60%; min-width: 720px; margin: 0 auto; }
    @media (max-width: 900px) { .submit-inner { max-width: 100%; min-width: 0; } }

    /* ── Drag-drop upload zone ── */
    .drop-zone { border: 2px dashed rgba(255,255,255,.3); border-radius: 12px; padding: 40px 24px; text-align: center; cursor: pointer; transition: all .2s; background: rgba(255,255,255,.04); }
    .drop-zone:hover, .drop-zone.drag-over { border-color: var(--sn-green); background: rgba(98,216,78,.06); }
    .drop-zone .dz-icon { font-size: 2.2rem; margin-bottom: 10px; opacity: .6; }
    .drop-zone .dz-label { font-weight: 700; color: #fff; font-size: 1rem; margin-bottom: 4px; }
    .drop-zone .dz-sub { font-size: 0.82rem; color: rgba(255,255,255,.5); }
    .drop-zone .dz-file { font-weight: 700; color: var(--sn-green); font-size: 0.92rem; margin-top: 8px; }
    .drop-zone input[type="file"] { display: none; }

    /* ── Reviewing state with streaming ── */
    .reviewing-timer { font-size: 2rem; font-weight: 800; color: var(--sn-green); letter-spacing: .04em; margin: 12px 0 4px; font-variant-numeric: tabular-nums; }
    .streaming-preview { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 8px; padding: 20px 24px; margin-top: 20px; text-align: left; font-size: 0.88rem; color: rgba(255,255,255,.82); line-height: 1.75; max-height: 380px; overflow-y: auto; white-space: pre-wrap; font-family: var(--font-body); }

    /* ── Results on dark ── */
    .results-wrap .feedback-card { border-color: rgba(255,255,255,.1); }
    .results-wrap .feedback-card { border-color: #d0dbe8; }
    .results-wrap .feedback-card .fc-label { background: var(--sn-navy); color: #fff; }
    .results-wrap .feedback-card .fc-body { background: #fff; color: #1a1a1a; }
    .results-wrap .closing-card { border-color: #d0dbe8; }
    .results-wrap .closing-card .cc-label { background: var(--sn-navy); color: #fff; }
    .results-wrap .closing-card .cc-body { background: #fff; color: var(--sn-navy); }
    .results-wrap .save-bar.saved { background: rgba(98,216,78,.1); border-color: rgba(98,216,78,.3); color: var(--sn-green); }
    .results-wrap .save-bar.failed { background: rgba(249,199,79,.1); border-color: rgba(249,199,79,.3); color: #fcd34d; }
    .results-wrap .rating-btn { border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.06); color: rgba(255,255,255,.8); }
    .results-wrap .rating-btn:hover, .results-wrap .rating-btn.selected { border-color: var(--sn-green); background: var(--sn-green); color: var(--sn-navy); }
    .results-wrap .form-label { color: rgba(255,255,255,.75); }
    .results-wrap .form-control { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.18); color: #fff; }
    .results-wrap .form-control::placeholder { color: rgba(255,255,255,.35); }
    .results-wrap .action-bar { border-top-color: rgba(255,255,255,.12); }
    .results-wrap .submission-footer { color: rgba(255,255,255,.4); }
    .results-wrap .submission-footer strong { color: rgba(255,255,255,.6); }
    .results-wrap .rating-section { border-top-color: rgba(255,255,255,.12); }
    .btn-try-corrected { background: rgba(98,216,78,.15); color: var(--sn-green); font-weight: 700; border: 2px solid rgba(98,216,78,.4); padding: 10px 24px; border-radius: 8px; font-size: 0.95rem; cursor: pointer; transition: all .15s; }
    .btn-try-corrected:hover { background: rgba(98,216,78,.25); border-color: var(--sn-green); }

    /* ── Dark reviewQ tab ── */
    .rq-dark {
      background: var(--sn-navy);
      min-height: calc(100vh - 120px);
      margin: -24px -20px 0;
      padding: 32px 20px 48px;
    }
    .rq-dark-inner { max-width: 56rem; margin: 0 auto; padding: 0 2rem; }
    .rq-dark .glass-card { margin-bottom: 16px; }
    .rq-dark .form-label { color: rgba(255,255,255,.75); }
    .rq-dark .form-control,
    .rq-dark .form-select {
      background: rgba(255,255,255,.08);
      border: 1px solid rgba(255,255,255,.18);
      color: #fff;
      border-radius: 8px;
    }
    .rq-dark .form-control::placeholder,
    .rq-dark .form-select option { color: rgba(255,255,255,.35); }
    .rq-dark .form-control:focus,
    .rq-dark .form-select:focus {
      background: rgba(255,255,255,.12);
      border-color: var(--sn-green);
      box-shadow: 0 0 0 3px rgba(98,216,78,.18);
      color: #fff;
    }
    .rq-dark .text-muted { color: rgba(255,255,255,.5) !important; }
    .rq-dark .text-navy { color: #fff !important; }
    .rq-dark h6 { color: #fff; }
    .rq-dark a { color: rgba(255,255,255,.6); }
    .rq-dark a:hover { color: var(--sn-green); }

    /* File cards on dark bg */
    .rq-dark .rq-file-card {
      background: var(--glass-bg);
      border: 1px solid var(--glass-border);
      border-radius: 10px;
    }
    .rq-dark .rq-file-card:hover { border-color: var(--sn-green); }
    .rq-dark .rq-file-card.selected { border-color: var(--sn-green); background: rgba(98,216,78,.08); }
    .rq-dark .rq-file-name { color: #fff; }
    .rq-dark .rq-file-meta { color: rgba(255,255,255,.5); }

    /* Review cards on dark bg */
    .rq-dark .rq-review-card {
      background: var(--glass-bg);
      border: 1px solid var(--glass-border);
      border-radius: 10px;
    }
    .rq-dark .rq-review-card .rq-doc-name { color: #fff; }
    .rq-dark .rq-submitter { color: rgba(255,255,255,.7); }

    /* OLIVIA panel on dark bg */
    .rq-dark #rqOliviaPanel {
      background: rgba(98,216,78,.07);
      border: 2px solid var(--sn-green) !important;
      border-radius: 10px;
    }
    .rq-dark #rqOliviaPanel div { color: rgba(255,255,255,.85) !important; }
    .rq-dark #rqOliviaPanel > div:first-child { color: #fff !important; }

    /* Step instruction on dark */
    .rq-dark .step-instruction { color: rgba(255,255,255,.75); }
    .rq-dark .detect-complete-bar {
      background: rgba(98,216,78,.12);
      border-color: rgba(98,216,78,.3);
      color: var(--sn-green);
    }
    .rq-dark .progress { background: rgba(255,255,255,.12); }
    .rq-dark .escalation-alert { background: rgba(249,199,79,.1); border-color: rgba(249,199,79,.3); color: #fcd34d; }
    .rq-dark .select-all-bar label { color: rgba(255,255,255,.75); }
    .rq-dark .rq-empty-box { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.12); }
    .rq-dark .rq-empty-box .fw-bold { color: #fff; }
    .rq-dark .rq-confirm-item { border-color: rgba(255,255,255,.08); color: rgba(255,255,255,.85); }
    .rq-dark .mode-option { border-color: rgba(255,255,255,.15); background: rgba(255,255,255,.04); }
    .rq-dark .mode-option.selected { border-color: var(--sn-green); background: rgba(98,216,78,.08); }
    .rq-dark .mode-option .mode-label { color: #fff; }
    .rq-dark .mode-option .mode-desc { color: rgba(255,255,255,.55); }

    /* Btn overrides on dark */
    .btn-rq-primary {
      background: var(--sn-green);
      color: var(--sn-navy);
      font-weight: 800;
      border: none;
      padding: 11px 28px;
      border-radius: 8px;
      font-size: 0.95rem;
      transition: background .15s;
    }
    .btn-rq-primary:hover { background: #52c83e; color: var(--sn-navy); }
    .btn-rq-primary:disabled { opacity: .4; }
    .btn-rq-ghost {
      background: rgba(255,255,255,.08);
      color: rgba(255,255,255,.8);
      font-weight: 600;
      border: 1px solid rgba(255,255,255,.18);
      padding: 10px 24px;
      border-radius: 8px;
      font-size: 0.95rem;
      transition: all .15s;
    }
    .btn-rq-ghost:hover { background: rgba(255,255,255,.14); color: #fff; }

    /* ── Greeter bar ── */
    .greeter-bar { background: var(--sn-green); color: var(--sn-navy); font-weight: 700; font-size: 0.88rem; padding: 8px 24px; display: flex; align-items: center; justify-content: space-between; }
    .greeter-bar .not-you { font-size: 0.78rem; font-weight: 400; text-decoration: underline; cursor: pointer; opacity: .8; }
    .demo-switcher { display: flex; align-items: center; gap: 6px; font-size: 0.75rem; font-weight: 600; }
    .demo-switcher select { font-size: 0.75rem; font-weight: 600; background: rgba(0,0,0,0.12); border: none; border-radius: 4px; padding: 2px 6px; color: var(--sn-navy); cursor: pointer; outline: none; }
    .demo-switcher select:hover { background: rgba(0,0,0,0.2); }

    /* ── Mode toggle ── */
    .mode-toggle { display: flex; gap: 12px; margin-bottom: 20px; }
    .mode-option { flex: 1; border: 2px solid rgba(255,255,255,.15); border-radius: 8px; padding: 14px 16px; cursor: pointer; transition: all .15s; position: relative; background: rgba(255,255,255,.04); }
    .mode-option input[type="radio"] { position: absolute; opacity: 0; }
    .mode-option.selected { border-color: var(--sn-green); background: rgba(98,216,78,.08); }
    .mode-option .mode-label { font-weight: 700; font-size: 0.9rem; color: #fff; }
    .mode-option .mode-desc { font-size: 0.78rem; color: rgba(255,255,255,.55); margin-top: 2px; }
    .mode-option .mode-rec { font-size: 0.72rem; background: var(--sn-green); color: var(--sn-navy); font-weight: 700; padding: 1px 7px; border-radius: 100px; display: inline-block; margin-top: 4px; }

    /* ── Progress bar ── */
    .progress-wrap { margin-top: 16px; }
    .progress { height: 8px; border-radius: 100px; background: #e5e7eb; overflow: hidden; }
    .progress-bar-fill { height: 100%; background: var(--sn-green); border-radius: 100px; width: 0%; transition: width 0.6s ease; }
    .progress-label { font-size: 0.82rem; color: #555; margin-top: 6px; min-height: 18px; }
    .progress-done { color: var(--sn-green-dark); font-weight: 700; }

    /* ── Escalation ── */
    .escalation-alert { background: #fff8e1; border: 1px solid #f9c74f; border-radius: 8px; padding: 14px 18px; font-size: 0.9rem; color: #7a5c00; display: none; }
    .escalation-alert.visible { display: block; }

    /* ── Reviewing state ── */
    .reviewing-state { text-align: center; padding: 48px 24px; display: none; }
    .reviewing-state.visible { display: block; }
    .reviewing-state .reviewing-label { font-size: 1.05rem; font-weight: 600; color: var(--sn-navy); margin-top: 16px; }
    .reviewing-state .reviewing-sub { font-size: 0.85rem; color: #888; margin-top: 6px; }

    /* ── Feedback cards ── */
    .feedback-card { border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; margin-bottom: 10px; }
    .feedback-card .fc-label { background: var(--sn-navy); color: #fff; font-size: 0.72rem; font-weight: 700; padding: 6px 14px; letter-spacing: .06em; text-transform: uppercase; }
    .feedback-card .fc-body { padding: 14px 16px; font-size: 0.92rem; line-height: 1.7; background: #fff; white-space: pre-wrap; }
    .feedback-card .fc-body.na { color: #aaa; font-style: italic; }
    .feedback-card .fc-bullets { margin: 0; padding-left: 1.2em; }
    .feedback-card .fc-bullets li { margin-bottom: 6px; }
    .feedback-card .fc-bullets li:last-child { margin-bottom: 0; }

    /* ── Closing note ── */
    .closing-card { border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; margin-bottom: 10px; }
    .closing-card .cc-label { background: var(--sn-navy); color: #fff; font-size: 0.72rem; font-weight: 700; padding: 6px 14px; letter-spacing: .06em; text-transform: uppercase; }
    .closing-card .cc-body { padding: 14px 16px; font-size: 0.95rem; line-height: 1.7; font-style: italic; color: var(--sn-navy); background: #fff; white-space: pre-wrap; }

    /* ── Rating ── */
    .rating-section { border-top: 1px solid #e5e7eb; padding-top: 20px; margin-top: 4px; }
    .rating-stars { display: flex; gap: 8px; flex-wrap: wrap; }
    .rating-btn { border: 2px solid #d1d5db; background: #fff; color: #555; font-size: 0.82rem; font-weight: 600; padding: 6px 14px; border-radius: 100px; cursor: pointer; transition: all .15s; }
    .rating-btn:hover, .rating-btn.selected { border-color: var(--sn-navy); background: var(--sn-navy); color: #fff; }

    /* ── Action bar ── */
    .action-bar { display: flex; gap: 12px; flex-wrap: wrap; padding-top: 20px; border-top: 1px solid #e5e7eb; }

    /* ── Save bars ── */
    .save-bar { padding: 12px 16px; border-radius: 6px; font-size: 0.85rem; margin-bottom: 8px; }
    .save-bar.saved  { background: #f0f9f0; border: 1px solid #86c986; color: #1e5c1e; }
    .save-bar.failed { background: #fff8e1; border: 1px solid #f9c74f; color: #7a5c00; }
    .submission-footer { font-size: 0.78rem; color: #999; padding-top: 8px; }
    .submission-footer strong { color: #555; }

    /* ── My Submissions ── */
    .submission-row { border: 1px solid #e5e7eb; border-radius: 8px; padding: 14px 18px; margin-bottom: 10px; cursor: pointer; background: #fff; transition: border-color .15s; }
    .submission-row:hover { border-color: var(--sn-navy); }
    .submission-row .sr-meta { font-size: 0.8rem; color: #888; }
    .submission-row .sr-title { font-weight: 700; color: var(--sn-navy); margin-bottom: 2px; }
    .submission-detail { display: none; background: #fafafa; border: 1px solid #e5e7eb; border-top: none; border-radius: 0 0 8px 8px; padding: 16px 18px; margin-top: -10px; margin-bottom: 10px; }
    .submission-detail.visible { display: block; }

    /* ── Des Queue workspace ── */
    .ms { font-family: 'Material Symbols Outlined'; font-size: 20px; vertical-align: middle; font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; user-select: none; line-height: 1; }

    /* ── Status / badge pills ── */
    .status-pill { font-size: 0.72rem; font-weight: 700; padding: 2px 9px; border-radius: 100px; white-space: nowrap; display: inline-block; }
    .status-approved { background: #e6f9e6; color: #1a6b1a; }
    .status-feedback { background: #fff3e0; color: #b45300; }
    .status-pending { background: #f0f2f4; color: #555; }
    .status-backforreview { background: #e6f0f7; color: var(--sn-navy); }
    .status-cancelled { background: #fde8e8; color: #b91c1c; }

    /* ── Message thread / compose ── */
    .msg-thread { display: flex; flex-direction: column; gap: 10px; margin-bottom: 12px; }
    .msg-item { border: 1px solid #e6e8eb; border-radius: 8px; padding: 10px 12px; background: #fff; max-width: 82%; }
    .msg-item.msg-status { background: #f7f9fa; border-style: dashed; max-width: 100%; }
    .msg-item.role-own { background: #eaf4ff; border-color: #cfe6fb; margin-left: auto; }
    .msg-item.msg-status.role-own { background: #eaf4ff; border-color: #cfe6fb; border-style: solid; margin-left: auto; max-width: 82%; }
    .msg-item.msg-latest { border-color: #7fb8e8; box-shadow: 0 0 0 1px #7fb8e8; }
    .msg-item-hdr { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
    .msg-item-hdr-left { display: flex; align-items: center; gap: 6px; min-width: 0; }
    .msg-author { font-size: 0.82rem; font-weight: 700; color: #222; }
    .msg-author.role-submitter { color: var(--sn-navy); }
    .msg-time { font-size: 0.72rem; color: #999; margin-left: auto; flex-shrink: 0; }
    .msg-body { font-size: 0.86rem; color: #333; line-height: 1.5; white-space: pre-wrap; }
    .msg-empty { font-size: 0.82rem; color: #999; padding: 8px 0; }
    .msg-shortcuts { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
    .msg-shortcut-chip { font-size: 0.76rem; border: 1px solid #dfe3e6; background: #f7f9fa; border-radius: 100px; padding: 3px 10px; cursor: pointer; color: #444; }
    .msg-shortcut-chip:hover { background: #eef1f3; }
    .msg-shortcut-chip.focused, .comment-clear-x.focused, .qd-btn-secondary.focused { box-shadow: 0 0 0 2px var(--sn-navy); }
    .search-clear-x { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); font-size: 1rem; line-height: 1; color: #999; cursor: pointer; user-select: none; }
    .search-clear-x:hover { color: #333; }
    .comment-clear-x { font-size: 0.76rem; border: 1px solid #dfe3e6; background: #f7f9fa; border-radius: 100px; padding: 3px 10px; cursor: pointer; color: #888; }
    .comment-clear-x:hover { background: #eef1f3; color: #333; }
    .queue-badge { font-size: 0.68rem; font-weight: 700; padding: 2px 7px; border-radius: 100px; text-transform: uppercase; letter-spacing: .04em; }
    .badge-olivia { background: #e6f0f7; color: var(--sn-navy); }
    .badge-direct { background: #fff8e1; color: #7a5c00; }
    .priority-high { background: #fde8e8; color: #a31515; }
    .priority-medium { background: #fff3e0; color: #b45300; }
    .priority-low { background: #f0f2f4; color: #555; }

    /* ── Queue workspace ── */
    .queue-workspace { display: flex; gap: 0; height: calc(100vh - 210px); min-height: 520px; background: #fff; border-radius: 10px; box-shadow: 0 2px 12px rgba(3,45,66,.1); overflow: hidden; max-width: 90%; min-width: 1080px; margin: 0 auto; }

    /* ── Left rail — white/simple ── */
    .queue-rail { width: 280px; flex-shrink: 0; border-right: 1px solid #e0e0e0; display: flex; flex-direction: column; background: #fff; }
    .queue-rail-header { padding: 12px 16px; border-bottom: 1px solid #e0e0e0; background: #fff; flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; }
    .queue-rail-header .rh-label { font-size: 0.68rem; font-weight: 700; color: #999; text-transform: uppercase; letter-spacing: .05em; }
    .queue-rail-header .rh-count { font-size: 0.72rem; font-weight: 700; background: var(--sn-navy); color: #fff; padding: 1px 8px; border-radius: 100px; }
    .queue-rail-cards { flex: 1; overflow-y: auto; padding: 8px; display: flex; flex-direction: column; gap: 4px; }
    .queue-group-header { font-size: 0.68rem; font-weight: 700; color: #999; text-transform: uppercase; letter-spacing: 0.6px; padding: 8px 8px 4px; margin-top: 4px; }
    .queue-group-header:first-child { margin-top: 0; }
    .queue-rail-cards::-webkit-scrollbar { width: 3px; }
    .queue-rail-cards::-webkit-scrollbar-thumb { background: #bbb; border-radius: 10px; }

    /* Queue card */
    .qrc { padding: 12px; border: 1px solid #e5e5e5; border-radius: 6px; cursor: pointer; transition: all .12s ease; background: #fff; }
    .qrc:hover { background: #f9f9f9; border-color: #d0d0d0; }
    .qrc.active { background: linear-gradient(135deg, #e8f5e9 0%, #f1f8f4 100%); border: 2px solid var(--sn-green); padding: 11px; }
    #queueRailCards .qrc.active { background: linear-gradient(135deg, #e3f2fd 0%, #f0f8fd 100%); border: 2px solid #2196f3; }
    .qrc-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
    .qrc-cat { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; background: #f0f0f0; color: #666; padding: 2px 8px; border-radius: 12px; }
    .qrc-cat.badge-olivia { background: #e6f0f7; color: var(--sn-navy); }
    .qrc-cat.badge-direct { background: #fff8e1; color: #7a5c00; }
    .qrc-time { font-size: 0.65rem; color: #999; }
    .qrc-title { font-weight: 600; font-size: 0.82rem; color: #032D42; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 6px; }
    .unread-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #2196f3; margin-right: 6px; vertical-align: middle; flex-shrink: 0; }
    .qrc-requester { font-size: 0.72rem; color: #999; display: flex; align-items: center; gap: 5px; margin-bottom: 6px; }
    .qrc-bottom { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }

    /* ── Right detail pane ── */
    .queue-detail-wrap { position: relative; flex: 1; overflow: hidden; display: flex; }
    .queue-detail { flex: 1; overflow: hidden; display: flex; flex-direction: column; background: #f6f8fa; color: #1a1a1a; }
    /* Overlay pseudo-element, not a box-shadow on the container itself, so the ring
       renders above the scrollable children (and their scrollbars) instead of being
       clipped/overdrawn by them. */
    .queue-detail.flash-outline::after {
      content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 50; opacity: 0;
      border-radius: 10px;
      box-shadow: inset 0 0 0 3px #2196f3;
      animation: queueDetailFlash 1.5s ease forwards;
    }
    @keyframes queueDetailFlash {
      0%   { opacity: 0; }
      15%  { opacity: 1; }
      82%  { opacity: 1; }
      100% { opacity: 0; }
    }
    .queue-detail-empty { flex: 1; display: flex; align-items: center; justify-content: center; color: #aaa; font-size: 0.9rem; background: #f6f8fa; }
    .qd-action-toast {
      position: absolute; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(0);
      background: var(--sn-navy); color: #fff; padding: 10px 20px; border-radius: 10px;
      font-size: 0.88rem; font-weight: 600; box-shadow: 0 6px 20px rgba(3,45,66,.25);
      z-index: 500; display: flex; align-items: center; gap: 8px; opacity: 1;
      transition: opacity .25s ease, transform .25s ease;
    }
    .qd-action-toast.hidden { opacity: 0; pointer-events: none; transform: translateX(-50%) translateY(8px); }
    .qd-action-toast .ms { font-size: 18px; color: var(--sn-green); }

    /* Sticky toolbar */
    .qd-toolbar { padding: 14px 24px; background: rgba(255,255,255,.93); backdrop-filter: blur(8px); border-bottom: 1px solid #e2e8f0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; flex-shrink: 0; }
    .qd-toolbar-left { min-width: 0; flex: 1 1 220px; }
    .qd-toolbar-title { font-weight: 700; font-size: 1rem; color: var(--sn-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    a.qd-toolbar-title-link { text-decoration: none; cursor: pointer; }
    a.qd-toolbar-title-link:hover { text-decoration: underline; }
    .qd-title-copy-icon { font-size: 16px; color: var(--sn-navy); opacity: .55; cursor: pointer; flex-shrink: 0; transition: opacity .12s; }
    .qd-title-copy-icon:hover { opacity: 1; }
    .qd-toolbar-sub { font-size: 0.75rem; color: #6b7280; margin-top: 1px; }
    .qd-toolbar-right { display: flex; align-items: center; gap: 8px; flex-shrink: 0; flex-wrap: wrap; }
    .qd-divider { width: 1px; height: 24px; background: #e2e8f0; margin: 0 4px; }

    /* Toolbar buttons */
    .qd-btn { font-family: inherit; font-size: 0.8rem; font-weight: 700; padding: 7px 14px; border-radius: 6px; cursor: pointer; border: none; display: inline-flex; align-items: center; gap: 5px; transition: all .15s; white-space: nowrap; }
    .qd-btn .ms { font-size: 16px; }
    .qd-btn-secondary { background: #f1f5f9; color: #475569; border: 1px solid #e2e8f0; }
    .qd-btn-secondary:hover { background: #e2e8f0; }
    .qd-btn-reject { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; }
    .qd-btn-reject:hover { background: #fee2e2; }
    .qd-btn-reviewed { background: var(--sn-navy); color: #fff; }
    .qd-btn-reviewed:hover { background: #054468; }
    .qd-btn-reviewed:disabled { opacity: .4; cursor: default; }
    .qd-btn-approve { background: var(--sn-green); color: var(--sn-navy); }
    .qd-btn-approve:hover { background: var(--sn-green-dark); }
    .qd-btn-approve:disabled { opacity: .4; cursor: default; }

    /* Sub-bar: progress + nav */
    .qd-sub-bar { padding: 8px 24px; background: #fff; border-bottom: 1px solid #e2e8f0; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; }
    .qd-progress-label { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #94a3b8; }
    .qd-progress-val { font-size: 0.82rem; font-weight: 600; color: var(--sn-navy); }
    .qd-nav-group { display: flex; align-items: center; gap: 4px; }
    .qd-nav-btn { font-family: inherit; font-size: 0.78rem; font-weight: 600; padding: 5px 12px; border-radius: 6px; cursor: pointer; border: 1px solid #e2e8f0; background: #fff; color: #475569; display: inline-flex; align-items: center; gap: 3px; transition: background .12s; }
    .qd-nav-btn:hover:not(:disabled) { background: #f1f5f9; }
    .qd-nav-btn:disabled { opacity: .4; cursor: default; }
    .qd-nav-pos { font-size: 0.78rem; color: #94a3b8; padding: 0 8px; }

    /* Meta strip (Prev/Next, History, Share, Cancel) — housekeeping actions, not content decisions */
    .qd-cancel-link { font-family: inherit; font-size: 0.78rem; font-weight: 600; color: #b91c1c; background: none; border: none; cursor: pointer; padding: 5px 6px; display: inline-flex; align-items: center; gap: 4px; opacity: .75; transition: opacity .12s; }
    .qd-cancel-link:hover { opacity: 1; text-decoration: underline; }
    .qd-cancel-link .ms { font-size: 15px; }

    /* Bottom decision bar — Open Document + the two content-review calls, sticky under the scrolling content */
    .qd-decision-bar { flex-shrink: 0; background: #fff; border-top: 1px solid #e2e8f0; padding: 14px 24px 18px; }
    .qd-decision-heading { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
    .qd-decision-heading-label { font-size: 0.72rem; font-weight: 800; letter-spacing: 0.06em; color: #64748b; text-transform: uppercase; }
    .qd-decision-info { font-size: 15px; color: #94a3b8; cursor: help; }
    .qd-decision-info:hover { color: var(--sn-navy); }
    .qd-decision-row { display: flex; gap: 10px; }
    .qd-decision-row + .qd-decision-row { margin-top: 10px; }
    .qd-big-btn { font-family: inherit; font-size: 0.9rem; font-weight: 700; padding: 12px 16px; border-radius: 8px; cursor: pointer; border: 2px solid transparent; display: inline-flex; align-items: center; justify-content: center; gap: 7px; transition: all .15s; text-decoration: none; flex: 1; }
    .qd-big-btn .ms { font-size: 18px; }
    .qd-big-btn-open { background: rgba(3,45,66,.06); color: var(--sn-navy); border-color: rgba(3,45,66,.15); }
    .qd-big-btn-open:hover { background: rgba(3,45,66,.12); color: var(--sn-navy); }
    .qd-big-btn-open.focused { background: var(--sn-navy); color: #fff; border-color: var(--sn-navy); box-shadow: 0 0 0 3px rgba(3,45,66,.18); }
    .qd-big-btn-reviewed { background: #fff8e1; color: #856404; border-color: rgba(255,193,7,.4); }
    .qd-big-btn-reviewed:hover { background: #fff3cd; }
    .qd-big-btn-reviewed.focused { background: #ffc107; border-color: #ffc107; color: #4a3800; box-shadow: 0 0 0 3px rgba(255,193,7,.25); }
    .qd-big-btn-approve { background: rgba(76,175,80,.15); color: #1b5e20; border-color: rgba(76,175,80,.4); }
    .qd-big-btn-approve:hover { background: rgba(76,175,80,.25); }
    .qd-big-btn-approve.focused { background: var(--sn-green); border-color: var(--sn-green); color: var(--sn-navy); box-shadow: 0 0 0 3px rgba(76,175,80,.25); }

    /* Scroll body */
    .qd-scroll-body { flex: 1; overflow-y: auto; padding: 20px 24px 32px; }
    .qd-scroll-body::-webkit-scrollbar { width: 4px; }
    .qd-scroll-body::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }

    /* Section headers */
    .qd-section { margin-bottom: 24px; }
    .qd-section-hdr { display: flex; align-items: center; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid #e2e8f0; margin-bottom: 14px; }
    .qd-section-hdr .ms { font-size: 18px; color: #94a3b8; }
    .qd-section-hdr.accent .ms { color: var(--sn-navy); }
    .qd-section-title { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: #6b7280; }

    /* Doc button block */
    .qd-doc-block { background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 16px 18px; margin-bottom: 20px; }
    .qd-doc-open-btn { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; padding: 11px; background: var(--sn-navy); color: #fff; font-family: inherit; font-size: 0.92rem; font-weight: 700; border: none; border-radius: 6px; cursor: pointer; margin-bottom: 10px; transition: background .15s; text-decoration: none; }
    .qd-doc-open-btn:hover { background: #054468; color: #fff; }
    .qd-doc-meta { display: flex; align-items: center; gap: 12px; justify-content: center; font-size: 0.78rem; color: #94a3b8; }
    .qd-doc-folder { display: flex; align-items: center; gap: 3px; }
    .qd-copy-link { color: var(--sn-navy); font-weight: 600; text-decoration: none; cursor: pointer; }
    .qd-copy-link:hover { text-decoration: underline; }

    /* Requester note block */
    .qd-note-block { background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 13px 16px; }
    .qd-note-body { font-size: 0.88rem; color: #374151; line-height: 1.6; }

    /* Priority */
    .priority-btn { border: 1.5px solid #d1d5db; background: #fff; color: #6b7280; font-family: inherit; font-size: 0.75rem; font-weight: 700; padding: 5px 14px; border-radius: 100px; cursor: pointer; transition: all .15s; }
    .priority-btn:hover { border-color: var(--sn-navy); color: var(--sn-navy); }
    .priority-btn.sel-high { border-color: #63DF4E; background: #63DF4E; color: var(--sn-navy); }
    .priority-btn.sel-medium { border-color: #63DF4E; background: #63DF4E; color: var(--sn-navy); }
    .priority-btn.sel-low { border-color: #63DF4E; background: #63DF4E; color: var(--sn-navy); }
    .priority-btn.selected { border-color: var(--sn-navy); background: #eef4fa; color: var(--sn-navy); }

    /* Review form textarea */
    .qd-textarea { width: 100%; padding: 12px 14px; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; font-family: inherit; font-size: 0.88rem; line-height: 1.6; color: #374151; resize: none; transition: border-color .15s; }
    .qd-textarea:focus { outline: none; border-color: var(--sn-navy); box-shadow: 0 0 0 3px rgba(3,45,66,.08); }

    /* Reviewed completed state */
    .qd-reviewed-state { background: #eaf4ff; border: 1px solid #cfe6fb; border-radius: 8px; padding: 16px; max-width: 82%; margin-left: auto; }
    .qd-olivia-rating label { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 0.85rem; color: #555; padding: 3px 0; }
    .qd-olivia-rating input { accent-color: var(--sn-navy); }

    @media (max-width: 900px) {
      .queue-workspace { flex-direction: column; height: auto; max-width: 100%; min-width: 0; }
      .queue-rail { width: 100%; height: 260px; border-right: none; border-bottom: 1px solid #dde6ef; }
      .qd-toolbar-right { flex-wrap: wrap; }
    }

    /* ── History drawer ── */
    .history-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.35); z-index: 400; opacity: 0; pointer-events: none; transition: opacity .2s; }
    .history-overlay.open { opacity: 1; pointer-events: all; }
    .history-drawer { position: fixed; top: 0; right: 0; height: 100vh; width: 440px; max-width: 95vw; background: #fff; box-shadow: -4px 0 24px rgba(0,0,0,.15); z-index: 401; display: flex; flex-direction: column; transform: translateX(100%); transition: transform .22s cubic-bezier(.4,0,.2,1); }
    .history-drawer.open { transform: translateX(0); }
    .history-drawer-hdr { padding: 18px 20px 14px; border-bottom: 1px solid #e2e8f0; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; background: #f8fafc; }
    .history-drawer-title { font-weight: 700; font-size: 0.95rem; color: var(--sn-navy); display: flex; align-items: center; gap: 7px; }
    .history-close { background: none; border: none; cursor: pointer; color: #6b7280; padding: 4px; border-radius: 4px; display: flex; align-items: center; }
    .history-close:hover { background: #f1f5f9; color: #111; }
    .history-body { flex: 1; overflow-y: auto; padding: 0; }
    .history-body::-webkit-scrollbar { width: 4px; }
    .history-body::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }
    .history-section { padding: 16px 20px 8px; }
    .history-section-hdr { display: flex; align-items: center; gap: 7px; padding-bottom: 8px; border-bottom: 1px solid #e2e8f0; margin-bottom: 12px; }
    .history-section-hdr .ms { font-size: 16px; color: #94a3b8; }
    .history-section-title { font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: #6b7280; }
    .history-empty { font-size: 0.82rem; color: #aaa; padding: 8px 0 16px; }
    /* Revision timeline */
    .rev-item { display: flex; gap: 12px; padding: 10px 0; border-bottom: 1px solid #f1f5f9; position: relative; }
    .rev-item:last-child { border-bottom: none; }
    .rev-dot-col { display: flex; flex-direction: column; align-items: center; padding-top: 3px; }
    .rev-dot { width: 10px; height: 10px; border-radius: 50%; background: #cbd5e1; flex-shrink: 0; }
    .rev-dot.current { background: var(--sn-navy); }
    .rev-dot.reviewed { background: #22c55e; }
    .rev-line { flex: 1; width: 1px; background: #e2e8f0; margin-top: 3px; }
    .rev-body { flex: 1; min-width: 0; }
    .rev-label { font-size: 0.72rem; font-weight: 700; color: var(--sn-navy); margin-bottom: 2px; }
    .rev-meta { font-size: 0.72rem; color: #94a3b8; margin-bottom: 4px; }
    .rev-headline { font-size: 0.82rem; color: #374151; font-style: italic; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .rev-verdict { display: inline-block; font-size: 0.68rem; font-weight: 700; padding: 1px 7px; border-radius: 100px; margin-top: 4px; }
    /* Requester history list */
    .rh-item { padding: 10px 0; border-bottom: 1px solid #f1f5f9; cursor: pointer; }
    .rh-item:last-child { border-bottom: none; }
    .rh-item:hover .rh-name { text-decoration: underline; }
    .rh-name { font-size: 0.85rem; font-weight: 600; color: #0f2335; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 2px; }
    .rh-meta { font-size: 0.72rem; color: #94a3b8; display: flex; align-items: center; gap: 8px; }

    /* ── Step instruction ── */
    .step-instruction { display: flex; align-items: center; gap: 10px; font-size: 0.92rem; color: #444; margin-bottom: 14px; font-weight: 500; }
    .step-num { background: var(--sn-navy); color: #fff; font-size: 0.72rem; font-weight: 800; width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .step-num.green { background: var(--sn-green); color: var(--sn-navy); }
    .step-num.lg { width: 28px; height: 28px; font-size: 0.85rem; }

    /* ── reviewQ step layout ── */
    .rq-page-title { font-family: var(--font-display); font-size: 1.5rem; font-weight: 700; color: #fff; margin-bottom: 18px; }
    .page-title-light { font-family: var(--font-display); font-size: 1.5rem; font-weight: 700; color: var(--sn-navy); margin-bottom: 18px; }
    .rq-step-hdr { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
    .rq-step-label { font-size: 0.78rem; font-weight: 800; letter-spacing: 1.6px; text-transform: uppercase; color: #fff; }
    .rq-back-top { display: inline-flex; align-items: center; gap: 4px; font-size: 0.85rem; margin-bottom: 12px; }

    /* ── Detect complete bar ── */
    .detect-complete-bar { background: #f0f9f0; border: 1px solid #86c986; border-radius: 7px; padding: 10px 14px; font-size: 0.85rem; color: #1e5c1e; font-weight: 600; margin-bottom: 20px; }

    /* ── Admin tab ── */
    .admin-wrap { max-width: 1400px; min-width: 760px; margin: 0 auto; }
    .admin-subnav { display: flex; gap: 4px; border-bottom: 2px solid #e5e7eb; margin-bottom: 20px; }
    .admin-subnav button { background: none; border: none; border-bottom: 3px solid transparent; margin-bottom: -2px; padding: 10px 18px; font-weight: 700; font-size: 0.9rem; color: #888; font-family: var(--font-display); cursor: pointer; }
    .admin-subnav button.active { color: var(--sn-navy); border-bottom-color: var(--sn-green); }
    .admin-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; padding: 22px 24px; box-shadow: 0 2px 12px rgba(3,45,66,.08); margin-bottom: 16px; }
    /* requests table */
    .req-search { width: 100%; padding: 10px 14px; border: 1px solid #d9d9d9; border-radius: 8px; font-size: 0.9rem; margin-bottom: 14px; font-family: var(--font-body); }
    .req-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
    .req-table th { text-align: left; padding: 8px 10px; border-bottom: 2px solid #e5e7eb; color: #555; font-size: 0.68rem; text-transform: uppercase; letter-spacing: .05em; position: sticky; top: 0; background: #fff; }
    .req-table td { padding: 9px 10px; border-bottom: 1px solid #f0f0f0; vertical-align: middle; }
    .req-table tr:hover td { background: #f7f9fb; }
    .req-del { background: #fee2e2; color: #b91c1c; border: none; border-radius: 6px; padding: 5px 12px; font-size: 0.78rem; font-weight: 700; cursor: pointer; }
    .req-del:hover { background: #b91c1c; color: #fff; }
    .req-badge { font-size: 0.65rem; font-weight: 700; padding: 2px 7px; border-radius: 4px; background: #eef2f6; color: var(--sn-navy); }
    /* instructions (legacy, unused now — kept in case rollback needed) */
    .instr-row { border: 1px solid #e5e7eb; border-radius: 10px; margin-bottom: 14px; overflow: hidden; }
    .instr-head { background: var(--sn-navy); color: #fff; padding: 10px 16px; font-weight: 700; font-size: 0.85rem; display: flex; justify-content: space-between; align-items: center; }
    .instr-body { padding: 14px 16px; background: #fff; }
    .instr-body textarea { width: 100%; min-height: 60px; border: 1px solid #d9d9d9; border-radius: 8px; padding: 10px 12px; font-family: var(--font-body); font-size: 0.85rem; line-height: 1.6; resize: vertical; overflow: hidden; box-sizing: border-box; }
    .instr-actions { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
    .instr-saved { color: var(--sn-green); font-size: 0.82rem; font-weight: 700; }
    /* prompt items — adopts the Prompt Preview (.pp-*) visual language:
       dark section header bar + clean white body, so both admin views read
       as one system. */
    .pi-toolbar { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; flex-wrap: wrap; }
    .pi-toolbar select { padding: 8px 12px; border: 1px solid #d9d9d9; border-radius: 8px; font-size: 0.88rem; font-weight: 600; color: var(--sn-navy); min-width: 220px; }
    .pi-newtype-btn { background: none; border: 1px dashed #b7c3cc; color: var(--sn-navy); border-radius: 8px; padding: 7px 14px; font-size: 0.82rem; font-weight: 700; cursor: pointer; }
    .pi-newtype-btn:hover { border-color: var(--sn-navy); background: #f7f9fb; }
    .pi-doctype-toggle { display: flex; align-items: center; gap: 6px; font-size: 0.8rem; color: #555; margin-left: auto; }
    .pi-section-title { display: flex; align-items: center; justify-content: space-between; margin: 20px 0 8px; }
    .pi-section-title:first-child { margin-top: 0; }
    .pi-section-title .t { font-size: 0.7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #888; }
    .pi-section-title .count { font-size: 0.7rem; color: #aaa; font-weight: 500; margin-left: 6px; text-transform: none; letter-spacing: normal; }
    .pi-add-row { display: flex; gap: 8px; margin-bottom: 14px; }
    .pi-add-btn { background: #eef2f6; color: var(--sn-navy); border: none; border-radius: 8px; padding: 8px 16px; font-size: 0.82rem; font-weight: 700; cursor: pointer; }
    .pi-add-btn:hover { background: var(--sn-navy); color: #fff; }
    /* card = pp-section clone */
    .pi-card { border: 1px solid #e5e7eb; border-radius: 10px; margin-bottom: 12px; overflow: hidden; }
    .pi-card.inactive { opacity: 0.55; }
    .pi-card-head { padding: 8px 14px; display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 0.72rem; letter-spacing: .04em; }
    .pi-card-head.Instruction { background: var(--sn-navy); color: #fff; }
    .pi-card-head.Document { background: #475569; color: #fff; }
    .pi-kind-badge { font-size: 0.6rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: 2px 8px; border-radius: 100px; flex-shrink: 0; background: rgba(255,255,255,.18); }
    .pi-card-head input.pi-label { flex: 1; border: none; background: none; font-weight: 700; font-size: 0.82rem; color: #fff; font-family: var(--font-body); padding: 4px 6px; border-radius: 5px; }
    .pi-card-head input.pi-label::placeholder { color: rgba(255,255,255,.6); }
    .pi-card-head input.pi-label:focus { background: rgba(255,255,255,.15); outline: 1px solid rgba(255,255,255,.5); }
    .pi-card-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
    .pi-active-toggle { display: flex; align-items: center; gap: 5px; font-size: 0.68rem; color: rgba(255,255,255,.85); cursor: pointer; }
    .pi-del-btn { background: rgba(255,255,255,.15); color: #fff; border: none; border-radius: 6px; padding: 4px 10px; font-size: 0.7rem; font-weight: 700; cursor: pointer; }
    .pi-del-btn:hover { background: #b91c1c; }
    .pi-card-body { padding: 14px 16px; background: #fff; }
    .pi-field-label { font-size: 0.62rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #999; margin: 10px 0 4px; }
    .pi-field-label:first-child { margin-top: 0; }
    .pi-card-body textarea { width: 100%; min-height: 44px; border: 1px solid #d9d9d9; border-radius: 8px; padding: 10px 12px; font-family: var(--font-body); font-size: 0.85rem; line-height: 1.65; resize: vertical; box-sizing: border-box; }
    .pi-card-body textarea.pi-notes { background: #fff; border-color: #d9d9d9; }
    .pi-file-row { display: flex; align-items: center; gap: 10px; margin-top: 6px; font-size: 0.8rem; }
    .pi-file-row .pi-file-current { color: #555; }
    .pi-card-footer { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; padding-top: 8px; border-top: 1px solid #f0f0f0; font-size: 0.68rem; color: #aaa; }
    .pi-saved { color: var(--sn-green); font-size: 0.78rem; font-weight: 700; }
    .pi-empty { text-align: center; color: #999; padding: 24px; font-size: 0.86rem; }
    /* system settings — same pp-section shell, always-cached badge */
    .pi-settings-card .pi-card-head { background: var(--sn-navy); color: #fff; }
    .pi-settings-card .pi-kind-badge { background: var(--sn-green); color: var(--sn-navy); }
    /* prompt preview */
    .pp-controls { display: flex; flex-wrap: wrap; gap: 18px; align-items: flex-end; }
    .pp-controls .form-label { font-size: 0.78rem; font-weight: 700; color: #555; margin-bottom: 4px; }
    .pp-group-label { font-size: 0.7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #888; margin: 20px 0 8px; }
    .pp-section { border: 1px solid #e5e7eb; border-radius: 10px; margin-bottom: 12px; overflow: hidden; }
    .pp-section-head { padding: 8px 14px; font-weight: 700; font-size: 0.72rem; letter-spacing: .04em; display: flex; justify-content: space-between; align-items: center; }
    .pp-section-body { padding: 14px 16px; font-family: var(--font-body); font-size: 0.85rem; line-height: 1.7; white-space: pre-wrap; color: #1a1a1a; background: #fff; }
    .pp-sys .pp-section-head { background: var(--sn-navy); color: #fff; }
    .pp-usr .pp-section-head { background: #475569; color: #fff; }
    .pp-doc .pp-section-body { color: #888; font-style: italic; }
    .pp-cached { font-size: 0.6rem; background: var(--sn-green); color: var(--sn-navy); padding: 1px 8px; border-radius: 100px; letter-spacing: .04em; }
    .pp-num { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--sn-green); color: #fff; font-weight: 800; font-size: 0.72rem; flex-shrink: 0; margin-right: 9px; }
    .pp-section-head > span:first-child { display: flex; align-items: center; }

    /* ── Utilities ── */
    .text-navy { color: var(--sn-navy); }
    .hidden { display: none !important; }

    /* ── reviewQ ── */
    .rq-file-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; padding: 14px 16px; margin-bottom: 8px; display: flex; align-items: flex-start; gap: 12px; cursor: pointer; transition: border-color .15s; }
    .rq-file-card:hover { border-color: var(--sn-navy); }
    .rq-file-card.selected { border-color: var(--sn-green); background: #f6fff3; }
    .rq-file-card input[type="checkbox"] { margin-top: 3px; flex-shrink: 0; width: 16px; height: 16px; accent-color: var(--sn-navy); cursor: pointer; }
    .rq-file-name { font-weight: 700; color: var(--sn-navy); font-size: 0.92rem; }
    .rq-file-meta { font-size: 0.78rem; color: #888; margin-top: 2px; }
    .rq-review-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; padding: 18px 20px; margin-bottom: 14px; }
    .rq-review-card .rq-badge { font-size: 0.72rem; font-weight: 700; background: var(--sn-green); color: var(--sn-navy); padding: 2px 9px; border-radius: 100px; margin-right: 8px; }
    .rq-review-card .rq-doc-name { font-weight: 700; font-size: 1rem; color: var(--sn-navy); margin-bottom: 10px; }
    .rq-submitter { display: flex; align-items: center; gap: 8px; font-size: 0.85rem; color: #555; margin-bottom: 12px; }
    .rq-avatar { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
    .rq-avatar-initials { width: 42px; height: 42px; border-radius: 50%; background: var(--sn-navy); color: #fff; font-size: 1.05rem; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .msg-avatar { width: 27px; height: 27px; border-radius: 50%; object-fit: cover; flex-shrink: 0; margin-right: 6px; vertical-align: middle; }
    .msg-avatar-initials { display: inline-flex; width: 27px; height: 27px; border-radius: 50%; background: var(--sn-navy); color: #fff; font-size: .68rem; font-weight: 700; align-items: center; justify-content: center; flex-shrink: 0; margin-right: 6px; vertical-align: middle; }
    .rq-status-pill { font-size: 0.72rem; font-weight: 700; background: #f0f2f4; color: #555; padding: 2px 9px; border-radius: 100px; margin-left: 8px; }
    .rq-date-quickpick { display: flex; gap: 8px; margin-bottom: 6px; }
    .rq-qp-btn { border: 2px solid #d1d5db; background: #fff; color: #555; font-size: 0.78rem; font-weight: 600; padding: 4px 12px; border-radius: 6px; cursor: pointer; transition: all .15s; white-space: nowrap; }
    .rq-qp-btn.active { border-color: var(--sn-green); background: var(--sn-green); color: var(--sn-navy); }
    .rq-confirm-item { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid #f0f2f4; font-size: 0.9rem; }
    .rq-confirm-item:last-child { border-bottom: none; }
    .rq-confirm-check { color: var(--sn-green-dark); font-weight: 700; font-size: 1.1rem; }
    .rq-empty-box { background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 8px; padding: 20px 24px; margin-bottom: 20px; }
    .select-all-bar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
    .select-all-bar label { font-size: 0.85rem; font-weight: 600; color: var(--sn-navy); cursor: pointer; display: flex; align-items: center; gap: 6px; }