.link-viewer { position: absolute; inset: 0; z-index: 10; overflow: auto; padding: 24px; color: var(--window-text); background: var(--window); }
.link-viewer[hidden] { display: none; }
.link-viewer.link-viewer-maximized { padding: 0; }
.link-preview-shell { width: min(880px, 100%); margin: 0 auto; overflow: hidden; background: var(--surface); border: 2px solid; border-color: var(--light) var(--dark) var(--dark) var(--light); box-shadow: 2px 2px 5px rgba(0,0,0,.35); }
.link-preview-shell.link-preview-maximized { width: 100%; min-height: 100%; margin: 0; }
.link-preview-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 24px; padding: 2px 3px 2px 6px; color: var(--selection-text); background: var(--selection); }
.link-preview-window-controls { display: flex; gap: 2px; }
.link-preview-window-controls button { width: 22px; height: 20px; padding: 0; color: var(--button-text); background: var(--button-face); border: 2px solid; border-color: var(--light) var(--dark) var(--dark) var(--light); font: bold 13px/14px var(--font); }
.link-preview-window-controls button:hover:not(:disabled) { background: var(--mid-light); }
.link-preview-window-controls button:active:not(:disabled) { border-color: var(--dark) var(--light) var(--light) var(--dark); transform: translate(1px, 1px); }
.link-preview-window-controls button:disabled { color: var(--button-disabled); text-shadow: 1px 1px var(--button-disabled-shadow); }
.link-preview-card { overflow: hidden; background: var(--surface); }
.link-preview-maximized .link-preview-media { max-height: calc(100vh - 245px); }
.link-preview-body { padding: 14px; }
.link-preview-card h2 { margin: 0 0 8px; font-size: 18px; }
.link-preview-author { margin: -3px 0 9px; color: var(--surface-text); font-weight: bold; opacity: .72; }
.link-preview-details { margin: -3px 0 9px; color: var(--surface-text); font-size: 11px; opacity: .72; }
.link-preview-description { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.link-preview-media { display: block; width: 100%; max-height: 520px; object-fit: contain; background: #000; }
.link-preview-audio { display: block; box-sizing: border-box; width: calc(100% - 28px); margin: 14px 14px 0; }
.link-preview-meta { margin-top: 10px; color: var(--surface-text); font-size: 11px; opacity: .72; overflow-wrap: anywhere; }
.link-preview-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.link-preview-notice { padding: 14px; line-height: 1.45; }
.link-dialog-grid { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 8px; align-items: center; }
.link-dialog-grid label { font-weight: bold; }
.link-dialog-platform-label { display: flex; align-items: center; gap: 6px; }
.link-dialog-help-button { width: 22px; height: 22px; display: grid; place-items: center; padding: 0; color: var(--button-text); background: transparent; border: 0; cursor: pointer; }
.link-dialog-help-button::before { content: "i"; width: 15px; height: 15px; display: grid; place-items: center; border: 1.5px solid currentColor; border-radius: 50%; font: bold 11px/1 Arial, sans-serif; }
.link-dialog-help-button:hover::before, .link-dialog-help-button:focus-visible::before { color: var(--selection-text); background: var(--selection); border-color: var(--selection); }
.link-dialog-grid input, .link-dialog-grid select { width: 100%; min-width: 0; height: 25px; padding: 2px 4px; color: var(--window-text); background: var(--window); border: 2px solid; border-color: var(--mid-dark) var(--light) var(--light) var(--mid-dark); font: inherit; }
.link-dialog-supported { max-height: 190px; margin-top: 10px; padding: 8px; overflow: auto; color: var(--window-text); background: var(--window); border: 2px solid; border-color: var(--mid-dark) var(--light) var(--light) var(--mid-dark); }
.link-dialog-supported[hidden] { display: none; }
.link-dialog-supported p { margin: 3px 0 8px; color: var(--muted-text); }
.link-dialog-supported ul { margin: 0; padding: 0; list-style: none; }
.link-dialog-supported li { display: grid; grid-template-columns: 85px minmax(0, 1fr); gap: 5px; padding: 3px 0; }
.link-dialog-supported li + li { border-top: 1px solid var(--mid-light); }
.link-dialog-supported li span { overflow-wrap: anywhere; }
.link-dialog-details { margin-top: 10px; padding: 8px; border: 1px solid var(--mid-dark); }
.link-dialog-warning { margin-top: 10px !important; color: var(--warning-text); font-size: 11px; }

@media (max-width: 520px) {
  .link-viewer { padding: 10px; }
  .link-dialog-grid { grid-template-columns: 1fr; gap: 4px; }
  .link-dialog-supported li { grid-template-columns: 1fr; gap: 1px; }
}