/* ════════════════════════════════════════════════════════════════════
   share-panel — 顶栏分享按钮 + URL 弹出窗口。2026-06-22 新增（user）。
   位置：顶栏右区性能小窗左侧；点击 → 浮起小窗，readonly URL + Copy 按钮。
   URL 由 setupUrlSync (url-codec.js) 实时写进 location.hash，所以 location.href
   即"包含搭建场景的可分享链接"——本面板只展示+复制，不另存第二份。
   DESIGN.md：浮起窗复用 .bench-menu skin (§8.11)、按钮 ≥30px (§8.1 U1)、
   单色 (§3.5)、字体 Geist + Geist Mono URL (§4.1)、token 驱动 theme-aware。
   ════════════════════════════════════════════════════════════════════ */

#share-menu-wrap {
  position: relative;
  display: inline-flex;
  flex: none;
  margin-right: 8px;
}

.topbar-share-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 32px;
  height: 30px;
  padding: 0;
  background: transparent;
  border: 1px solid var(--line-1);
  border-radius: var(--radius-md, 5px);
  color: var(--ink-2-v1, var(--ink-2));
  cursor: pointer;
  transition: background-color 80ms ease, color 80ms ease, border-color 80ms ease;
}
.topbar-share-btn:hover {
  background: var(--overlay-1);
  color: var(--ink-1);
}
.topbar-share-btn[aria-expanded="true"] {
  background: var(--overlay-2);
  color: var(--ink-1);
}
.topbar-share-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--overlay-2);
}

.share-pop {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  width: 180px;
  padding: 6px;
  background: var(--surface-2);
  border: 1px solid var(--line-1);
  border-radius: 6px;
  box-shadow: 0 8px 24px var(--overlay-2), var(--float-edge);
  z-index: 1410;
  font-family: var(--font-ui);
  color: var(--ink-1);
  animation: menu-pop var(--dur-enter) var(--ease-out);
}
.share-pop[hidden] { display: none; }

.share-action{width:100%;padding:8px 9px;border:0;background:transparent;color:var(--ink-1);text-align:left;font:500 13px/1.2 var(--font-ui);cursor:pointer}.share-action+ .share-action{border-top:1px solid var(--line-1)}.share-action:hover{background:var(--overlay-1)}

.share-pop-row {
  display: flex;
  gap: 6px;
  align-items: stretch;
}

.share-url {
  flex: 1 1 auto;
  height: 28px;
  padding: 0 8px;
  background: var(--surface-1);
  border: 1px solid var(--line-1);
  border-radius: 4px;
  color: var(--ink-1);
  font-family: var(--font-mono);
  font-size: 11px;
  outline: none;
  min-width: 0;
}
.share-url:focus { border-color: var(--ink-1); }

.share-copy {
  appearance: none;
  flex: none;
  height: 28px;
  padding: 0 12px;
  background: var(--ink-1);
  color: var(--surface-1);
  border: 1px solid var(--ink-1);
  border-radius: 4px;
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: opacity 120ms ease, background-color 120ms ease, border-color 120ms ease;
}
.share-copy:hover { opacity: 0.85; }
.share-copy:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--overlay-2); }
.share-copy.is-ok {
  background: var(--sig-ok);
  border-color: var(--sig-ok);
  color: var(--surface-1);
}

.share-pop-hint {
  margin-top: 8px;
  font-size: 11px;
  color: var(--ink-3-v1, var(--ink-3));
  line-height: 1.45;
}