/* ---- V5: share links (vault-sharelinks.js). Quiet Glass tokens from quiet-glass.css. */
.sl-panel { width: min(560px, calc(100vw - 32px)); }
dialog.panel.sl-panel { background: var(--surface-solid); } /* it opens over the item's panel: no glass over glass */
.sl-sub { margin: -6px 0 4px; }
.sl-form { gap: 14px; }
.sl-fields { display: flex; flex-direction: column; gap: 2px; }
.field .sl-check, .sl-check { display: flex; align-items: center; justify-content: flex-start; text-align: left; width: 100%; margin: 0; color: var(--text); font-size: 15px; font-weight: 400; line-height: 1.35; gap: 12px; min-height: 48px; padding: 6px 10px; border-radius: var(--r-row, 16px); cursor: pointer; }
.sl-check:hover { background: var(--raised); }
.sl-check input { width: 20px; height: 20px; margin: 0; flex: none; accent-color: var(--accent); }
.sl-check span { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; flex: 1; }
.sl-check b { font-weight: 600; }
.sl-check small, .switch-row small { display: block; color: var(--muted); font-size: 13px; overflow-wrap: anywhere; }
.sl-never { margin: 4px 10px 0; font-size: 13px; }
.sl-seg { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; padding: 4px; border-radius: var(--btn-r, 14px); background: var(--raised); }
.sl-seg-btn { min-height: 44px; border: 0; border-radius: 11px; background: transparent; color: var(--text); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.sl-seg-btn.on { background: var(--primary); color: var(--on-primary); }
.sl-panel .switch-row { min-height: 48px; align-items: center; }
.sl-panel .switch-row span { display: flex; flex-direction: column; }
.sl-panel .switch-row.off { opacity: 0.55; cursor: default; }
.sl-limit input { max-width: 180px; }
.sl-result { display: flex; flex-direction: column; gap: 10px; }
.sl-result label { font-weight: 600; font-size: 14px; }
.sl-url-row { display: flex; gap: 8px; }
.sl-url-row input { flex: 1; min-width: 0; height: var(--field-h, 52px); padding: 0 14px; border-radius: var(--btn-r, 14px); border: 1px solid var(--input); background: var(--glass); color: var(--text); font-size: 14px; }
.sl-url-row .btn { height: var(--field-h, 52px); }
.sl-active { margin-top: 18px; }
.sl-list .sl-row { gap: 12px; align-items: center; }
.sl-list .sl-row small { display: block; color: var(--muted); font-size: 13px; overflow-wrap: anywhere; }
.sl-list .sl-row .btn { flex: none; min-height: 44px; }
#sl-off { display: block; }
@media (max-width: 600px) {
  .sl-seg { grid-template-columns: repeat(2, 1fr); }
  .sl-url-row { flex-direction: column; }
  .panel-foot .sl-open { order: -1; }
}