.portmap{border-bottom:1px solid var(--ink);position:relative}.portmap__scroll{scrollbar-width:none;-webkit-overflow-scrolling:touch;overflow:auto hidden}.portmap__scroll::-webkit-scrollbar{display:none}.portmap__chart{aspect-ratio:var(--aspect);width:max(100%, calc((100svh - 62px) * var(--aspect)));background:#2a6f86;position:relative}.portmap__chart img{width:100%;max-width:none;height:100%;position:absolute;inset:0}.portmap__title{z-index:5;top:clamp(16px,3vw,40px);left:var(--gutter);max-width:min(440px, calc(100% - 2 * var(--gutter)));background:var(--paper);border:1px solid var(--ink);padding:5px;position:absolute;box-shadow:14px 18px 0 -6px #14284a1f}.portmap__title>*{margin:0}.portmap__title h1{border:2.5px solid var(--ink);border-bottom:0;padding:18px 20px 0;font-size:clamp(28px,3.2vw,46px);line-height:1.02}.portmap__lede{border-inline:2.5px solid var(--ink);color:var(--ink-2);padding:10px 20px 0;font-size:15.5px}.portmap__hint{border:2.5px solid var(--ink);color:var(--ink-3);border-top:0;padding:10px 20px 16px;font-size:11.5px}.portmap__key{z-index:5;left:var(--gutter);max-width:calc(100% - 2 * var(--gutter));border:1px solid var(--ink);color:var(--ink-2);background:#f4eedfeb;flex-wrap:wrap;gap:4px 16px;margin:0;padding:8px 14px;font-size:13px;list-style:none;display:flex;position:absolute;bottom:34px}.portmap__key i{border:1px solid var(--ink);vertical-align:-1px;border-radius:50%;width:10px;height:10px;margin-right:7px;display:inline-block}.portmap__credit{z-index:5;right:var(--gutter);max-width:none;color:var(--ink-2);background:#f4eedfd9;margin:0;padding:2px 6px;font-size:10.5px;position:absolute;bottom:8px}.pm-pin{z-index:2;color:var(--ink);align-items:center;gap:7px;text-decoration:none;display:flex;position:absolute;transform:translate(-50%,-50%)}.pm-pin:hover,.pm-pin:focus-visible,.pm-pin.open{z-index:10}.pm-dot{background:var(--c);border:2px solid var(--ink);border-radius:50%;flex:none;width:15px;height:15px;transition:transform .2s;box-shadow:0 0 0 3px #f4eedfeb}.pm-label{font:italic 500 15px/1 var(--serif);white-space:nowrap;background:#f4eedff0;border-radius:3px;padding:4px 7px 5px;box-shadow:0 1px #14284a40}.pm-pin{transform:translate(-7.5px,-50%)}.pm-pin--label-l{flex-direction:row-reverse;transform:translate(calc(7.5px - 100%),-50%)}.pm-pin:hover .pm-dot,.pm-pin:focus-visible .pm-dot,.pm-pin.open .pm-dot{background:var(--signal);transform:scale(1.3)}.pm-pin:focus-visible{outline:none}.pm-pin:focus-visible .pm-label{outline:2px solid var(--signal)}.pm-card{pointer-events:none;background:var(--paper);border:1px solid var(--ink);width:300px;color:var(--ink);box-shadow:0 1px 0 var(--ink), 14px 18px 0 -6px #14284a24;opacity:0;visibility:hidden;padding:16px 18px 14px;transition:opacity .18s,transform .18s;display:block;position:absolute;top:50%;transform:translateY(-50%)scale(.97)}.pm-pin--r .pm-card{left:calc(100% + 14px)}.pm-pin--label-l.pm-pin--r .pm-card{left:auto;right:-314px}.pm-pin--l .pm-card{right:calc(100% + 14px)}.pm-pin--label-l.pm-pin--l .pm-card{left:-314px;right:auto}.pm-pin--up .pm-card{top:auto;bottom:-12px;transform:scale(.97)}.pm-pin:hover .pm-card,.pm-pin:focus-visible .pm-card,.pm-pin.open .pm-card{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(-50%)scale(1)}.pm-pin--up:hover .pm-card,.pm-pin--up:focus-visible .pm-card,.pm-pin--up.open .pm-card{transform:scale(1)}.pm-card__region{font:italic 14px var(--serif);color:var(--ink-2);display:block}.pm-card__name{font:400 30px/1.05 var(--serif);margin-top:2px;display:block}.pm-card__area{color:var(--ink-2);margin:2px 0 10px;font-size:14px;display:block}.pm-card__types{border-top:1px solid var(--ink);display:block}.pm-type{border-bottom:1px solid var(--hair);grid-template-columns:52px 1fr auto;align-items:center;gap:10px;padding:8px 0;display:grid}.pm-type .glyph{width:52px}.pm-type b{font:400 16px/1.2 var(--serif);display:block}.pm-type small{color:var(--ink-2);align-items:center;gap:6px;font-size:12.5px;display:flex}.pm-type small i{border-radius:50%;width:8px;height:8px;display:inline-block}.pm-type__n{font:italic 400 22px/1 var(--serif)}.pm-card__go{border-bottom:1.5px solid var(--signal);margin-top:12px;font-size:14px;font-weight:500;display:inline-block}@media (width<=700px){.portmap__title{max-width:none;margin:12px;position:relative;top:auto;left:auto}.portmap__chart{width:max(100%, calc((100svh - 62px - 150px) * var(--aspect)))}.pm-label{padding:3px 5px 4px;font-size:12.5px}.pm-dot{width:12px;height:12px}.pm-card{width:250px}.pm-pin--label-l.pm-pin--r .pm-card{right:-264px}.pm-pin--label-l.pm-pin--l .pm-card{left:-264px}.portmap__key{margin:10px 12px 34px;position:static}}
