/* Personas tab: spider diagrams per heading, quotes in a side panel. */
.pz{display:grid;gap:22px}
.pz-intro{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;justify-content:space-between;padding:18px 20px}
.pz-intro b{font:700 16px/1.3 var(--head)}
.pz-intro p{margin:4px 0 0;max-width:70ch;font-size:13.5px}
.pz-jump{display:flex;flex-wrap:wrap;gap:8px}
.pz-jump button{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line-2);background:#fff;border-radius:999px;padding:7px 13px;font:600 13px/1 var(--body);cursor:pointer;color:var(--ink)}
.pz-jump button::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--hue)}
.pz-jump button span{color:var(--muted);font-weight:500}
.pz-jump button:hover{background:var(--tint)}

.pz-sec{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px 24px 26px;scroll-margin-top:12px}
.pz-sec-h{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:20px}
.pz-sec-h .lbl{color:var(--hue)}
.pz-sec-h h2{font-size:20px;line-height:1.2;margin-top:4px}
.pz-sec-n{font:600 12.5px/1 var(--body);color:var(--muted);white-space:nowrap}

.pz-spider{position:relative;display:grid;grid-template-columns:184px minmax(0,1fr);column-gap:84px;align-items:center}
.pz-web{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.pz-web path{fill:none;stroke:var(--hue);stroke-opacity:.26;stroke-width:1.5;transition:stroke-opacity .15s,stroke-width .15s}
.pz-web path.on{stroke-opacity:.9;stroke-width:2.6}
.pz-web circle{fill:var(--hue);opacity:.55}
.pz-hub{position:relative;z-index:1;width:184px;height:184px;border-radius:50%;background:var(--hue);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;
  box-shadow:0 0 0 10px color-mix(in srgb,var(--hue) 13%,transparent),0 0 0 22px color-mix(in srgb,var(--hue) 6%,transparent)}
.pz-hub-ico svg{width:26px;height:26px;opacity:.9}
.pz-hub b{font:800 18px/1.15 var(--head);padding:0 18px}
.pz-hub small{font:700 11px/1 var(--label);letter-spacing:.1em;text-transform:uppercase;opacity:.75}

.pz-legs{list-style:none;margin:0;padding:0;display:grid;gap:8px;position:relative;z-index:1}
.pz-leg{position:relative;isolation:isolate;overflow:hidden;width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 14px;text-align:left;
  background:#fff;border:1px solid var(--line-2);border-radius:12px;padding:10px 14px;cursor:pointer;color:var(--ink);transition:border-color .15s,box-shadow .15s,transform .15s}
.pz-leg::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);background:color-mix(in srgb,var(--hue) 9%,transparent);z-index:-1;border-radius:inherit}
.pz-leg:hover,.pz-leg:focus-visible{border-color:var(--hue);box-shadow:0 6px 18px rgba(14,58,64,.10);transform:translateX(2px)}
.pz-leg-t{font-weight:600;font-size:14.5px;line-height:1.35}
.pz-n{font:800 16px/1 var(--head);color:var(--hue);white-space:nowrap;text-align:right}
.pz-n small{display:block;font:700 10px/1.2 var(--label);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:3px}
.pz-stack{grid-column:1/-1;display:flex;gap:2px;height:6px;border-radius:99px;overflow:hidden;margin-top:2px}
.pz-key{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:3px 12px;font-size:12px;color:var(--muted)}
.pz-key i,.pz-filter i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px}

/* side panel */
.pz-layer{position:fixed;inset:0;z-index:80}
.pz-scrim{position:absolute;inset:0;background:rgba(14,58,64,.36);opacity:0;transition:opacity .2s}
.pz-panel{position:absolute;top:0;right:0;bottom:0;width:min(580px,100vw);background:var(--bg);display:flex;flex-direction:column;box-shadow:-16px 0 44px rgba(14,58,64,.2);transform:translateX(100%);transition:transform .24s ease}
.pz-open .pz-scrim{opacity:1}
.pz-open .pz-panel{transform:none}
.pz-panel header{display:flex;gap:14px;align-items:flex-start;padding:max(18px,env(safe-area-inset-top,0px)) max(20px,env(safe-area-inset-right,0px)) 14px 20px;background:#fff;border-bottom:1px solid var(--line)}
.pz-panel header .lbl{color:var(--hue)}
.pz-panel h2{font-size:19px;line-height:1.25;margin:5px 0 4px}
.pz-panel header p{margin:0;font-size:13px}
.pz-x{margin-left:auto;flex:none;width:36px;height:36px;border:0;border-radius:50%;background:var(--bg);font-size:22px;line-height:1;cursor:pointer;color:var(--ink)}
.pz-x:hover{background:var(--tint)}
.pz-filter{display:flex;flex-wrap:wrap;gap:6px;padding:12px 20px;background:#fff;border-bottom:1px solid var(--line)}
.pz-filter button{display:inline-flex;align-items:center;gap:2px;border:1px solid var(--line-2);background:#fff;border-radius:999px;padding:6px 11px;font:600 12.5px/1.2 var(--body);cursor:pointer;color:var(--ink);text-align:left}
.pz-filter button b{margin-left:5px;color:var(--muted)}
.pz-filter button[aria-pressed="true"]{background:var(--hue);border-color:var(--hue);color:#fff}
.pz-filter button[aria-pressed="true"] b{color:rgba(255,255,255,.8)}
.pz-quotes{flex:1;overflow:auto;padding:16px max(20px,env(safe-area-inset-right,0px)) max(28px,env(safe-area-inset-bottom,0px)) 20px;display:grid;gap:10px;align-content:start;outline:none}
.pz-q{margin:0;background:#fff;border:1px solid var(--line);border-left:3px solid var(--hue);border-radius:12px;padding:12px 14px}
.pz-q blockquote{margin:0 0 8px;font-size:14.5px;line-height:1.55}
.pz-q figcaption{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:12.5px;color:var(--muted)}
.pz-q a{color:var(--ink-3);font-weight:600;text-decoration:none}
.pz-q a:hover{text-decoration:underline}
.pz-tag{font:700 11px/1.3 var(--label);letter-spacing:.03em;padding:2px 8px;border-radius:999px;color:#fff}

@media (max-width:900px){
  .pz-spider{grid-template-columns:1fr;row-gap:12px}
  .pz-web{display:none}
  .pz-hub{width:auto;height:auto;border-radius:14px;flex-direction:row;justify-content:flex-start;padding:12px 16px;gap:10px;box-shadow:none}
  .pz-hub b{padding:0;font-size:16px}
  .pz-hub small{margin-left:auto}
  .pz-legs{padding-left:18px;border-left:2px solid color-mix(in srgb,var(--hue) 30%,transparent);margin-left:14px}
  .pz-legs li{position:relative}
  .pz-legs li::before{content:"";position:absolute;left:-18px;top:50%;width:16px;height:2px;background:color-mix(in srgb,var(--hue) 30%,transparent)}
}
@media (max-width:600px){
  .pz-sec{padding:16px 14px 18px;border-radius:14px}
  .pz-sec-h{flex-direction:column;align-items:flex-start;gap:6px}
  .pz-legs{padding-left:12px;margin-left:8px}
  .pz-legs li::before{left:-12px;width:10px}
  .pz-leg{padding:10px 12px}
  .pz-leg-t{font-size:14px}
}
@media (prefers-reduced-motion:reduce){.pz-panel,.pz-scrim,.pz-leg{transition:none}}

/* symptom pain line, desire joins */
.pz-pain{display:block;margin-top:4px;font-weight:500;font-size:13px;line-height:1.4;color:var(--muted)}
.pz-joins{display:table;margin-top:6px;font:700 10.5px/1.2 var(--label);letter-spacing:.06em;text-transform:uppercase;color:var(--hue);background:color-mix(in srgb,var(--hue) 10%,transparent);padding:3px 7px;border-radius:999px}
.pz-ppain{margin:10px 0 0 !important;padding:10px 12px;background:color-mix(in srgb,var(--hue) 8%,#fff);border-radius:10px;font-size:13.5px;line-height:1.45;color:var(--ink)}
.pz-pjoins{margin-top:10px;padding:10px 12px;background:var(--bg);border-radius:10px;font-size:13px}
.pz-pjoins ul{margin:6px 0 0;padding-left:18px}
.pz-pjoins li{margin:2px 0}
.pz-pjoins li span{color:var(--muted)}

/* desire links: tags, light-up bar, panel lists */
.pz-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.pz-tags .pz-joins{margin-top:0}
.pz-dtag{display:inline-flex;align-items:center;gap:6px;font:700 10.5px/1.25 var(--label);letter-spacing:.05em;text-transform:uppercase;color:var(--dc);background:color-mix(in srgb,var(--dc) 11%,#fff);border:1px solid color-mix(in srgb,var(--dc) 28%,transparent);padding:3px 8px;border-radius:999px}
.pz-dtag::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--dc)}
button.pz-dtag{cursor:pointer;text-align:left}
button.pz-dtag:hover{background:color-mix(in srgb,var(--dc) 20%,#fff)}
.pz-dbar{position:sticky;top:0;z-index:6;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 14px;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:14px;box-shadow:0 6px 18px rgba(14,58,64,.06)}
.pz-dbar .lbl{margin-right:4px}
.pz-dbar [data-hl]{display:inline-flex;align-items:center;gap:7px;border:1px solid color-mix(in srgb,var(--dc,#0E3A40) 35%,transparent);background:#fff;color:var(--ink);border-radius:999px;padding:7px 12px;font:600 12.5px/1.2 var(--body);cursor:pointer}
.pz-dbar [data-hl]::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--dc,#0E3A40)}
.pz-dbar [data-hl] b{color:var(--muted);font-weight:600}
.pz-dbar [data-hl]:hover{background:color-mix(in srgb,var(--dc) 10%,#fff)}
.pz-dbar [data-hl][aria-pressed="true"]{background:var(--dc);border-color:var(--dc);color:#fff}
.pz-dbar [data-hl][aria-pressed="true"]::before{background:#fff}
.pz-dbar [data-hl][aria-pressed="true"] b{color:rgba(255,255,255,.85)}
.pz-dbar .pz-clear{background:transparent;border:0;color:var(--ink-3);text-decoration:underline}
.pz-dbar .pz-clear::before{display:none}
.pz-dstatus{flex-basis:100%;margin:2px 0 0;font-size:12.5px;color:var(--muted)}
.pz[data-hl] .pz-leg{opacity:.28;filter:saturate(.35);transition:opacity .2s,filter .2s,box-shadow .2s}
.pz[data-hl] .pz-leg.is-hl{opacity:1;filter:none;border-color:var(--dc);box-shadow:0 0 0 2px var(--dc),0 8px 20px rgba(14,58,64,.12)}
.pz[data-hl] .pz-web path{stroke-opacity:.07}
.pz[data-hl] .pz-web circle{opacity:.15}
.pz[data-hl] .pz-web path.hl{stroke:var(--hlc);stroke-opacity:.95;stroke-width:2.6}
.pz[data-hl] .pz-web circle.hl{fill:var(--hlc);opacity:1}
.pz-plink{margin:10px 0 0 !important;font-size:13px}
.pz-plink .pz-dtag{text-transform:none;letter-spacing:0;font:600 12.5px/1.3 var(--body);margin-top:4px}
.pz-plinks{background:#fff;border:1px solid color-mix(in srgb,var(--dc) 35%,transparent);border-left:3px solid var(--dc);border-radius:12px;padding:12px 14px;display:grid;gap:8px;font-size:13.5px}
.pz-plinks ul{margin:4px 0 0;padding-left:18px}
.pz-plinks li span{color:var(--muted)}
.pz-plinks .btn{justify-self:start;margin-top:4px}
.pz-dchips{display:contents}
.pz-dbar [data-hl]{flex:none;white-space:nowrap}
@media (max-width:600px){
  .pz-dbar{padding:8px 0 8px;gap:4px;border-radius:12px;min-width:0;max-width:100%}
  .pz-dbar>.lbl{display:none}
  .pz-dchips{display:flex;gap:6px;flex:1 1 100%;min-width:0;max-width:100%;overflow-x:auto;padding:2px 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .pz-dchips::-webkit-scrollbar{display:none}
  .pz-dbar [data-hl]{padding:6px 10px;font-size:12px}
  .pz-dstatus{padding:0 12px;font-size:11.5px}
}
.pz-dbar .pz-clear[hidden]{display:none}