/* unykorn.ai /portfolio — the system map. Loaded only on that page, after styles.css. */
.pmap-wrap{display:grid;gap:16px;margin:0 0 8px}
@media (min-width:900px){.pmap-wrap{grid-template-columns:minmax(0,1fr) 360px;align-items:start}}
.pmap{position:relative;background:var(--graphite);border:1px solid rgba(201,209,218,.16);border-radius:16px;overflow:hidden;min-height:420px;
  background-image:radial-gradient(700px 500px at 50% 50%,rgba(121,182,240,.10),transparent 65%)}
.pmap::after{content:"Loading the map…";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--steel-2);font-size:15px;pointer-events:none}
.pmap.ready::after,.pmap.pmap-failed::after{display:none}
.pmap.pmap-failed{min-height:0;padding:14px 18px;color:var(--steel-2)}
.pmap.pmap-failed::before{content:"The interactive map did not load; the tables below carry the same content."}
.pmap-svg{display:block;width:100%;height:auto;aspect-ratio:1.1;touch-action:none;cursor:grab;user-select:none}
.pmap-svg:active{cursor:grabbing}
.pe{stroke:#79b6f0;stroke-width:1.6;opacity:.28;transition:opacity .15s,stroke-width .15s}
.pe.lit{opacity:.95;stroke-width:3.2}
.pe.dim{opacity:.06}
.pn{cursor:pointer;outline:none}
.pn .halo{fill:#79b6f0;opacity:0;transition:opacity .15s}
.pn .dot{stroke:#0b0f14;stroke-width:2;transition:transform .15s}
.pn .chevron{pointer-events:none}
.pn .lbl{fill:#e7ecf1;font:500 21px var(--b);paint-order:stroke;stroke:#0b0f14;stroke-width:5px;stroke-linejoin:round;pointer-events:none}
.pn.hub .lbl{font:700 25px var(--h)}
.pn:hover .halo,.pn:focus-visible .halo,.pn.sel .halo{opacity:.22}
.pn.sel .halo{opacity:.35}
.pn.near .halo{opacity:.14}
.pn:focus-visible .dot{stroke:var(--orange-2);stroke-width:3}
.pn.dim{opacity:.18}
.pn.hub .halo{animation:pmap-pulse 3.2s ease-in-out infinite}
@keyframes pmap-pulse{0%,100%{opacity:.06}50%{opacity:.16}}
@media (prefers-reduced-motion:reduce){.pn.hub .halo{animation:none}}
/* Present mode: the map and panel fill the screen on a graphite ground, for a projector or a shared screen. */
.pmap-wrap.presenting{background:var(--graphite);padding:24px;gap:24px;grid-template-columns:minmax(0,1fr) 400px;align-items:stretch;overflow:auto}
.pmap-wrap.presenting:not(:fullscreen){position:fixed;inset:0;z-index:100;margin:0}
html.pmap-lock,html.pmap-lock body{overflow:hidden}
.pmap-wrap.presenting .pmap{min-height:0;height:calc(100vh - 48px);border-radius:20px}
.pmap-wrap.presenting .pmap-svg{height:100%;aspect-ratio:auto}
.pmap-wrap.presenting .pmap-panel{background:var(--graphite-2);border-color:rgba(201,209,218,.2);color:#fff;overflow:auto;max-height:calc(100vh - 48px)}
.pmap-wrap.presenting .pmap-panel h3,.pmap-wrap.presenting .pmap-link{color:#fff}
.pmap-wrap.presenting .pmap-blurb,.pmap-wrap.presenting .pmap-check b{color:var(--steel-3)}
.pmap-wrap.presenting .pmap-check,.pmap-wrap.presenting .pmap-near{color:var(--steel-2)}
.pmap-wrap.presenting .pmap-panel .k{color:var(--orange-2)}
.pmap-wrap.presenting .btn.line{background:transparent;color:#fff;border-color:rgba(201,209,218,.45)}
.pmap-wrap.presenting .tag.ok{background:rgba(21,122,70,.22);border-color:rgba(21,122,70,.5);color:#8fd8ae}
.pmap-wrap.presenting .tag.warn{background:rgba(168,106,9,.22);border-color:rgba(168,106,9,.5);color:#f2c46e}
.pmap-wrap.presenting .tag.na{background:rgba(107,119,133,.22);border-color:rgba(107,119,133,.5);color:#c9d1da}
@media (max-width:899px){.pmap-wrap.presenting{grid-template-columns:1fr}.pmap-wrap.presenting .pmap{height:60vh}.pmap-wrap.presenting .pmap-panel{max-height:none}}
.pmap-ctl{position:absolute;right:12px;bottom:12px;display:flex;gap:6px}
.pmap-ctl button{width:36px;height:36px;border-radius:8px;border:1px solid rgba(201,209,218,.3);background:rgba(20,27,36,.85);color:#fff;font:700 18px/1 var(--h);cursor:pointer}
.pmap-ctl button:hover{border-color:#fff}
.pmap-panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 22px;min-height:200px}
.pmap-panel h3{margin:0 0 6px}
.pmap-panel .tag{margin-bottom:12px}
.pmap-blurb{font-size:15.5px;color:var(--ink-2);margin:10px 0 10px}
.pmap-check{font-size:14px;color:var(--muted);margin:0 0 14px}
.pmap-check b{color:var(--ink-2)}
.pmap-near{font-size:14px;color:var(--muted);margin:14px 0 0;line-height:1.7}
.pmap-link{background:none;border:0;padding:0;font:inherit;color:var(--ink);text-decoration:underline;text-decoration-color:var(--orange-2);text-underline-offset:3px;cursor:pointer}
.pmap-link:hover{text-decoration-color:var(--orange)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.chip{border:1px solid var(--line);background:#fff;color:var(--ink-2);border-radius:999px;padding:7px 13px;font:600 13.5px var(--b);cursor:pointer}
.chip:hover{border-color:var(--steel)}
.chip.on{background:var(--graphite);color:#fff;border-color:var(--graphite)}
.pmap-legend{display:flex;flex-wrap:wrap;gap:10px 18px;font-size:14px;color:var(--ink-2);margin:12px 0 0}
.pmap-legend i{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:6px;vertical-align:-1px}