/* Pannello risultati: separato dalla chat, aggiornato a ogni turno */
    /* Dopo una ricerca la chat resta compatta in alto (flex non cresce):
       sotto va tutto lo spazio ai risultati, anche su tablet/iPad.
       Solo ≥721px: su mobile la chat usa già --chat-mobile-h (fit al contenuto). */
    @media (min-width: 721px) {
      body.has-results .messages { flex: 0 1 auto; }
    }
    .results-panel {
      border-top: 1px solid var(--line); background: #fff;
      display: flex; flex-direction: column; min-height: 0; flex: 1;
    }
    .results-panel[hidden] { display: none; }
    .results-panel #resultsBody { min-height: 0; flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; }
     .results-panel .people {
       margin: 0; padding: .8rem 1rem 1rem; border-top: 0;
       overflow: visible; min-height: 0; flex: 1;
     }
     .results-panel .results-head {
      display: flex; align-items: center; justify-content: space-between; gap: .5rem;
      padding: .6rem 1.15rem .35rem;
    }
    .results-panel .results-head .results-toggle {
      border: 0; background: transparent; color: var(--muted); cursor: pointer;
      font-size: .9rem; padding: .2rem .4rem; border-radius: 6px;
    }
    .results-panel .results-head .results-toggle:hover { background: var(--bg); }
    .results-panel .results-head .results-toggle .chev {
      display: inline-block; transition: transform .15s ease;
    }
    .results-panel.collapsed .results-head .results-toggle .chev { transform: rotate(180deg); }
    .results-panel.collapsed .people { display: none; }
    .splitter {
      flex-shrink: 0; height: 4px; background: var(--line);
      cursor: row-resize; transition: background .12s ease;
    }
    .splitter:hover, .splitter:focus-visible { background: #c7d2e0; outline: none; }
    body.dragging { cursor: row-resize; user-select: none; }
    .people-label {
      font-size: .7rem; font-weight: 700; letter-spacing: .06em;
      text-transform: uppercase; color: var(--muted); margin: 0 0 .15rem;
    }
    .people-head {
      display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
      gap: 8px 12px; margin-bottom: .4rem;
    }
    .people-stats { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
    .people-count {
      font-size: .68rem; font-weight: 700; letter-spacing: .09em;
      text-transform: uppercase; color: var(--muted);
    }
    .people-num { font-size: .85rem; font-weight: 600; color: var(--navy); }
    .people-of { font-size: .72rem; color: var(--muted); }
    .people-legend { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
    .legend-label { font-size: .7rem; color: var(--muted); }
    .legend-chip {
      display: inline-flex; align-items: center; gap: 5px;
      font-size: .7rem; font-weight: 600; border-radius: 999px; padding: 4px 10px;
    }
    .legend-chip.teal  { color: #156d85; background: rgba(21,109,133,.1); }
    .legend-chip.amber { color: #b87700; background: rgba(238,155,0,.12); }
    .legend-chip.grey  { color: var(--muted); background: var(--bg); }
    .person {
      display: grid; grid-template-columns: 96px 1fr auto; gap: 14px;
      padding: 1rem 1.1rem; border-radius: 12px;
      background: #fff; border: 1px solid #e2e8f0;
      transition: border-color .15s ease, box-shadow .15s ease;
    }
    .person.match {
      box-shadow: 0 6px 18px rgba(37,50,71,.07);
    }
    .person.match:hover {
      border-color: #b8c4d6;
      box-shadow: 0 8px 22px rgba(37,50,71,.1);
    }
    .person-score {
      display: flex; flex-direction: column; gap: 8px;
      padding-right: 14px; border-right: 1px solid var(--line); color: var(--navy);
    }
    .score-line { display: flex; align-items: baseline; gap: 3px; }
    .score-num {
      font-size: 2.5rem; line-height: 1; font-weight: 700; letter-spacing: -.02em;
      color: currentColor;
    }
    .score-den { font-size: .78rem; font-weight: 600; color: var(--muted); }
    .score-bar {
      display: flex; gap: 2px; height: 8px;
    }
    .score-bar i {
      flex: 1; border-radius: 3px; background: var(--bg);
    }
    .score-bar i.on { background: currentColor; }
    .score-label { font-size: .68rem; line-height: 1.2; font-weight: 600; color: currentColor; }
    .person-score.score-danger-dark { color: #991b1b; }
    .person-score.score-danger { color: #dc2626; }
    .person-score.score-warning { color: #b87700; }
    .person-score.score-success { color: #15803d; }
    .person-score.score-success-dark { color: #166534; }
    .person-main { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
    .person-id {
      display: flex; align-items: center; gap: .7rem; min-width: 0;
    }
    .avatar {
      flex-shrink: 0; width: 40px; height: 40px; border-radius: 12px;
      display: inline-flex; align-items: center; justify-content: center;
      background: var(--navy); color: #fff; font-weight: 700; font-size: .85rem;
      letter-spacing: .02em;
    }
    .avatar.avatar-img { object-fit: cover; }
    .person-meta { min-width: 0; }
    .person-name {
      display: block; font-weight: 700; color: var(--navy); font-size: .95rem;
      line-height: 1.25; word-break: break-word;
    }
    .person-role {
      display: block; margin-top: .15rem; font-size: .82rem; font-weight: 600;
      color: #156d85; line-height: 1.4;
    }
    /* Specificità > .bubble.bot-rich a (altrimenti testo navy su sfondo teal) */
    .bubble.bot-rich a.person-link,
    a.person-link {
      flex-shrink: 0; display: inline-flex; align-items: center; gap: .35rem;
      font-size: .75rem; font-weight: 700; color: #fff; background: #156d85;
      border-radius: 999px; padding: .45rem .85rem; text-decoration: none; white-space: nowrap;
      border-bottom: none;
    }
    .bubble.bot-rich a.person-link:hover,
    a.person-link:hover {
      color: #fff; border-bottom: none; filter: brightness(1.1);
    }
    .person-link img { width: 14px; height: 14px; display: block; filter: brightness(0) invert(1); }
    .person-side { display: flex; flex-direction: column; align-items: center; gap: 8px; }
    .person-upd { font-size: .7rem; color: var(--muted); white-space: nowrap; }
    .badge-row { display: flex; flex-wrap: wrap; gap: 6px; }
    .badge-pill {
      display: inline-flex; align-items: center; gap: 6px;
      font-size: .7rem; font-weight: 600; color: #156d85;
      background: rgba(21,109,133,.1); border-radius: 999px; padding: 5px 11px;
    }
    .badge-pill svg { width: 13px; height: 13px; }
    a.badge-pill-link {
      text-decoration: none;
      transition: background .12s ease, transform .12s ease;
    }
    a.badge-pill-link:hover { background: rgba(21,109,133,.18); }
    .skill-row { display: flex; flex-wrap: wrap; gap: .35rem; }
    .skill {
      font-size: .7rem; font-weight: 500; color: #334155;
      background: #fff; border: 1px solid #e2e8f0; border-radius: 999px;
      padding: .28rem .65rem; max-width: 100%;
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    a.skill-link,
    a.skill-link:visited {
      color: #1e85a1; text-decoration: none;
      transition: background .12s ease, border-color .12s ease, color .12s ease;
    }
    a.skill-link:hover,
    a.skill-link:active,
    a.skill-link:focus {
      background: rgba(30,133,161,.1); border-color: rgba(30,133,161,.45);
      color: #156d85; text-decoration: none;
    }
    .lvl {
      display: inline-flex; align-items: center;
      font-size: .65rem; font-weight: 700; letter-spacing: .04em;
      text-transform: uppercase; border-radius: 999px;
      padding: .2rem .5rem; border: 1px solid transparent;
    }
    /* Tag allineati ai colori del TP: forte teal, media amber, debole grey */
    .lvl-forte { background: rgba(21,109,133,.1); color: #156d85; border-color: rgba(21,109,133,.25); }
    .lvl-medio { background: rgba(238,155,0,.12); color: #b87700; border-color: rgba(238,155,0,.25); }
    .lvl-debole { background: var(--bg); color: var(--muted); border-color: #e2e8f0; }
    .match-why { margin: 0; font-size: .85rem; color: #4b5563; line-height: 1.55; }
    .match-stats { display: flex; flex-wrap: wrap; gap: .4rem; }
    .stat-pill {
      display: inline-flex; align-items: center; gap: .4rem;
      font-size: .72rem; font-weight: 600; color: #156d85;
      background: #f0f9fb; border: 1px solid #cfe8ee; border-radius: 999px;
      padding: .26rem .65rem; white-space: nowrap;
    }
    .stat-pill .stat-ico { display: inline-flex; align-items: center; color: #156d85; }
    details.person-jd-evidence { grid-column: 1 / -1; border-top: 1px solid var(--line); margin-top: .35rem; }
    details.person-jd-evidence summary { cursor: pointer; color: #156d85; font-size: .78rem; font-weight: 600; padding: .55rem .2rem; }
    .jd-evidence-body { color: #4b5563; font-size: .78rem; padding: 0 .2rem .55rem; }
    .jd-evidence-body p { margin: .2rem 0; }
    .jd-evidence-row { display: flex; justify-content: space-between; gap: .75rem; border-top: 1px solid rgba(21,109,133,.1); padding: .25rem 0; }
    /* Altri Skill Wallet pubblici della stessa persona */
    .wallet-row { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; }
    .wallet-label { font-size: .7rem; color: var(--muted); font-weight: 600; }
    .bubble.bot-rich a.wallet-alt,
    .wallet-alt {
      font-size: .7rem; font-weight: 600; color: #156d85; background: #f0f9fb;
      border: 1px solid #cfe8ee; border-radius: 999px; padding: .24rem .6rem;
      text-decoration: none; border-bottom: none;
    }
    .bubble.bot-rich a.wallet-alt:hover,
    a.wallet-alt:hover { color: #0e5568; border-bottom: none; filter: brightness(.98); }
    .skill.match {
      background: rgba(37,50,71,.08); border-color: rgba(37,50,71,.18);
      font-weight: 600;
    }
    span.skill.match { color: var(--navy); }
    /* Accordion skill che hanno generato il punteggio */
    details.person-skills { grid-column: 1 / -1; border-top: 1px solid var(--line); margin-top: .55rem; }
    details.person-skills summary {
      display: flex; align-items: center; justify-content: space-between; gap: 8px;
      list-style: none; cursor: pointer; user-select: none;
      font-size: .78rem; font-weight: 600; color: #156d85; padding: .7rem .2rem 0;
    }
    details.person-skills summary::-webkit-details-marker { display: none; }
    details.person-skills summary .chev { transition: transform .15s ease; flex-shrink: 0; }
    details.person-skills[open] summary .chev { transform: rotate(180deg); }
    details.person-skills[open] summary { border-bottom: 1px solid var(--line); padding-bottom: .7rem; }
    .sk-more-btn {
      align-self: flex-start; margin-top: 2px;
      border: 1px solid rgba(21,109,133,.35); background: #f0f9fb; color: #156d85;
      border-radius: 999px; padding: .35rem .7rem; font-size: .78rem; font-weight: 600;
      cursor: pointer; font-family: inherit;
    }
    .sk-more-btn:hover { background: rgba(21,109,133,.12); }
    .skills-grid {
      display: flex; flex-direction: column; gap: 8px; padding: 16px clamp(12px,3vw,22px) 22px;
      margin-top: 0;
    }
    .sk-thead {
      display: flex; flex-wrap: nowrap; gap: 8px 14px; padding: 0 15px 10px;
      font-size: 10px; line-height: 15px; font-weight: 700; letter-spacing: .09em;
      text-transform: uppercase; color: #aeb8be;
    }
    .sk-thead .sk-col-skill { flex: 1 1 0; min-width: 0; }
    .sk-thead .sk-col-cell { flex: 0 0 160px; }
    .skill-detail {
      display: flex; flex-wrap: nowrap; gap: 10px 14px; align-items: center;
      background: #f7f8f9; border: 1px solid #e0e9ec; border-radius: 12px; padding: 14px 16px;
    }
    .skill-detail .sd-name { display: flex; flex-direction: column; gap: 3px; flex: 1 1 0; min-width: 0; overflow-wrap: anywhere; }
    .skill-detail .sd-name b, .skill-detail .sd-name a {
      font-size: 14px; line-height: 21px; font-weight: 600; color: #253247;
      text-decoration: none; border-bottom: 1px solid transparent;
    }
    .skill-detail .sd-name a {
      color: #1e85a1; text-decoration: none;
    }
    .skill-detail .sd-name a:hover {
      color: #156d85; text-decoration: none;
    }
    .skill-detail a.sd-link {
      color: #1e85a1; text-decoration: none;
    }
    .skill-detail a.sd-link:hover {
      color: #156d85; text-decoration: none;
    }
    .skill-detail .sd-ctx { font-size: 12px; line-height: 18px; color: #60676b; }
    .skill-detail .sd-cell { display: flex; justify-content: flex-start; }
    .skill-detail .sd-cell.sd-cert { flex: 0 0 160px; }
    .skill-detail .sd-cell.sd-ev { flex: 0 0 160px; }
    .skill-detail .sd-cell span,
    .skill-detail .sd-cell a {
      display: inline-flex; align-items: center; gap: 7px; font-size: 12px; line-height: 18px;
      font-weight: 600; white-space: nowrap; font-family: inherit;
    }
    .skill-detail .sd-count { gap: 6px; }
    .skill-detail .sd-cell svg { flex-shrink: 0; }
    .sk-note { font-size: 12px; color: #60676b; }
    .chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .25rem; }
    .chip {
      border: 1px solid #d1d5db; background: #fff; border-radius: 14px;
      padding: .55rem .8rem; font-size: .8rem; cursor: pointer; color: var(--navy); font-weight: 500;
    }
    .welcome .chip { transition: transform .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease; }
    .welcome .chip:hover { background: var(--navy); color: #fff; border-color: var(--navy); transform: translateY(-1px); box-shadow: 0 5px 14px rgba(37,50,71,.16); }
    .typing { display: flex; gap: .3rem; padding: .35rem 0; }
    .typing span {
      width: 7px; height: 7px; border-radius: 50%; background: #9ca3af;
      animation: bounce 1s infinite;
    }
    .typing span:nth-child(2) { animation-delay: .15s; }
    .typing span:nth-child(3) { animation-delay: .3s; }
    @keyframes bounce {
      0%, 80%, 100% { transform: translateY(0); opacity: .4; }
      40% { transform: translateY(-4px); opacity: 1; }
    }
    .composer-wrap {
      border-top: 1px solid var(--line); padding: .75rem 1rem .9rem; background: #fff;
      display: flex; flex-direction: column; gap: .45rem;
    }
    .pdf-bar {
      display: none; align-items: center; gap: .5rem; flex-wrap: wrap;
      font-size: .78rem; color: var(--navy); background: #f1f5f9;
      border-radius: 12px; padding: .4rem .65rem;
    }
    .pdf-bar.show { display: flex; }
    .pdf-bar strong { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 14rem; }
    .pdf-bar button {
      border: 0; background: transparent; color: var(--muted); cursor: pointer;
      font-size: .78rem; font-weight: 600; padding: .15rem .35rem;
    }
    .composer { position: relative; display: flex; gap: .55rem; align-items: center; }
    .composer textarea {
      flex: 1; border: 1px solid #b8c2ca; border-radius: 999px; padding: .8rem 3.5rem .8rem 1.1rem;
      font-size: .95rem; line-height: 1.35; outline: none; resize: none; overflow-y: auto;
      min-height: 48px; max-height: 9rem;
      scrollbar-width: none;
      -ms-overflow-style: none;
    }
    .composer textarea::-webkit-scrollbar { display: none; }
    .composer textarea:focus { border-color: var(--navy); box-shadow: 0 0 0 3px rgba(37,50,71,.12); }
    .composer .attach {
      flex-shrink: 0; width: 48px; height: 48px; justify-content: center; border: 1px solid #c7d2e0; background: #fff; color: var(--navy);
      border-radius: 999px; padding: 0; font-weight: 600; cursor: pointer; font-size: .8rem;
      display: inline-flex; align-items: center;
    }
    .composer .attach:hover,
    .composer .attach:focus-visible { width: auto; padding: 0 .9rem; background: #f8fafc; }
    .composer .attach svg { display: block; flex-shrink: 0; }
    .composer .attach .attach-label {
      display: inline-block; white-space: nowrap; overflow: hidden;
      max-width: 0; opacity: 0; margin-left: 0;
      transition: max-width .2s ease, opacity .2s ease, margin-left .2s ease;
    }
    .composer .attach:hover .attach-label,
    .composer .attach:focus-visible .attach-label { max-width: 220px; opacity: 1; margin-left: .4rem; }
    .composer button.send {
      position: absolute; right: .25rem; bottom: 0; width: 48px; height: 48px; border: 0; border-radius: 999px; background: transparent; color: #aeb8be;
      padding: 0; font-weight: 700; cursor: pointer; font-size: .9rem; min-height: 0; display: inline-flex; align-items: center; justify-content: center;
    }
    .composer button.send:hover { color: var(--navy); background: #f1f5f8; }
    .composer button.send.searching,
    .composer button.send.searching:hover { color: #fff; background: var(--navy); }
    .composer button.send svg { width: 25px; height: 25px; }
    .composer button.send.searching svg { width: 18px; height: 18px; }
    .composer button:disabled { opacity: .55; cursor: wait; }
    .status { color: var(--muted); font-size: .78rem; padding: 0 1rem .65rem; min-height: 1.1rem; }
    .status.is-loading::before {
      content: ""; display: inline-block; width: .7rem; height: .7rem;
      margin: 0 .4rem .05rem 0; border: 2px solid currentColor;
      border-right-color: transparent; border-radius: 50%; vertical-align: middle;
      animation: status-spin .7s linear infinite;
    }
    .conversation-loading {
      align-self: center; display: inline-flex; align-items: center; gap: .55rem;
      color: var(--muted); background: #fff; border: 1px solid var(--line);
      border-radius: 999px; padding: .65rem .9rem; font-size: .85rem;
    }
    .status-spinner {
      width: .9rem; height: .9rem; border: 2px solid currentColor;
      border-right-color: transparent; border-radius: 50%;
      animation: status-spin .7s linear infinite;
    }
    @keyframes status-spin { to { transform: rotate(360deg); } }
    @media (prefers-reduced-motion: reduce) {
      .status.is-loading::before, .status-spinner { animation: none; }
    }
    /* Avviso di sistema (es. sessione scaduta): non è una risposta del bot */
    .sys-note {
      align-self: center; max-width: min(92%, 520px); text-align: center;
      font-size: .82rem; line-height: 1.5; color: #8a4b00;
      background: #fff7ed; border: 1px solid #fed7aa; border-radius: .8rem;
      padding: .7rem .9rem;
    }
    .sys-note a { color: #8a4b00; font-weight: 700; }
    .welcome { text-align: left; color: var(--muted); padding: 1.5rem .5rem 1rem; display: flex; flex-direction: column; align-items: flex-start; }
    .welcome h2 { margin: 0 0 .4rem; color: var(--navy); font-size: 1.15rem; text-align: left; }
    .welcome p { font-size: .88rem; line-height: 1.45; text-align: left; margin: 0; }
    .welcome .chips { margin-top: 1.5rem; }
    .reset-short, .badge-short { display: none; }
    .restart-icon { width: 18px; height: 18px; flex: 0 0 18px; }
    #resetBtn { display: inline-flex; align-items: center; gap: .65rem; border: 0; background: transparent; color: #646c72; padding: .45rem .2rem; font-size: .9rem; font-weight: 400; }
    #resetBtn:hover { background: transparent; color: var(--navy); box-shadow: none; }

    @media (min-width: 721px) and (max-width: 1100px) {
      #resetBtn { font-size: .9rem; }
    }

    /* Piano di ricerca ispezionabile (DK-3171) */
    .plan-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; }
    .plan-label { font-size: 12px; font-weight: 600; color: #60676b; }
    .plan-chips { display: flex; flex-wrap: wrap; gap: 6px; }
    .plan-chip { display: inline-flex; align-items: center; border: 1px solid #dfe3e6; border-radius: 999px; background: #fff; overflow: hidden; }
    .plan-chip.hard { border-color: #156d85; background: #eef7fa; }
    .plan-chip-name { border: 0; background: transparent; padding: 4px 10px; font: inherit; font-size: 12px; cursor: pointer; color: inherit; }
    .plan-chip.hard .plan-chip-name { color: #156d85; font-weight: 600; }
    .plan-chip-x { border: 0; border-left: 1px solid #dfe3e6; background: transparent; padding: 4px 8px; cursor: pointer; color: #8a9298; font: inherit; }
    .plan-chip-x:hover { background: #f3f6f7; color: #b03a3a; }
    .plan-apply { border: 0; border-radius: 999px; background: #156d85; color: #fff; padding: 4px 12px; font: inherit; font-size: 12px; cursor: pointer; }
    .plan-apply:disabled { opacity: .4; cursor: default; }