/* Resizable and hideable panels (desktop only). Pairs with js/panels.js. */
.pnl-edge,.pnl-tog{display:none}
@media (min-width:861px){
  .filters,.places,.explore .drawer{position:relative}
  .pnl-edge{display:block;position:absolute;z-index:6;touch-action:none}
  .pnl-edge.right{top:0;bottom:0;right:0;width:8px;cursor:col-resize}
  .pnl-edge.left{top:0;bottom:0;left:0;width:8px;cursor:col-resize}
  .pnl-edge.top{left:0;right:0;top:0;height:8px;cursor:row-resize}
  .pnl-edge::after{content:"";position:absolute;inset:3px 4px;border-radius:4px;background:var(--accent);opacity:0;transition:opacity .15s}
  .pnl-edge:hover::after,.pnl-edge:focus-visible::after,.pnl-drag .pnl-edge::after{opacity:.5}
  .pnl-drag,.pnl-drag *{cursor:col-resize!important;user-select:none!important}
  .pnl-tog{display:grid;place-items:center;position:absolute;z-index:7;width:26px;height:26px;border-radius:8px;border:1px solid var(--line);background:var(--surface);color:var(--muted);box-shadow:var(--shadow-sm);cursor:pointer;padding:0}
  .pnl-tog svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
  .pnl-tog:hover{color:var(--fg);border-color:var(--line-strong)}
  /* small tabs in the middle of each inner edge, clear of the panel headings */
  .filters>.pnl-tog{top:50%;right:0;width:16px;height:44px;border-radius:8px 0 0 8px;border-right:0;transform:translateY(-50%)}
  .places>.pnl-tog{top:50%;left:0;width:16px;height:44px;border-radius:0 8px 8px 0;border-left:0;transform:translateY(-50%)}
  .explore .drawer>.pnl-tog{top:0;left:50%;width:44px;height:16px;border-radius:0 0 8px 8px;border-top:0;transform:translateX(-50%)}
  .pnl-tog svg{width:13px;height:13px}
  .explore .drawer{height:var(--dH,clamp(230px,calc(100dvh - 610px),330px))}
  /* hidden: the panel shrinks to a slim rail that keeps only its show button */
  :root.hide-f{--fW:40px} :root.hide-p{--pW:40px}
  :root.hide-f .filters>*:not(.pnl-tog),:root.hide-p .places>*:not(.pnl-tog){display:none!important}
  :root.hide-f .filters>.pnl-tog,:root.hide-p .places>.pnl-tog{left:6px;right:auto;width:26px;border:1px solid var(--line);border-radius:8px}
  :root.hide-f .filters>.pnl-tog svg,:root.hide-p .places>.pnl-tog svg{transform:rotate(180deg)}
  :root.hide-d .explore .drawer{height:40px}
  :root.hide-d .explore .drawer>*:not(.pnl-tog){display:none!important}
  :root.hide-d .explore .drawer>.pnl-tog svg{transform:rotate(180deg)}
}
