.site-preview{position:relative;width:100%;border-radius:var(--radius-md);border:1px solid var(--color-border);overflow:hidden;transition:var(--theme-transition)}.site-preview__chrome{display:flex;align-items:center;gap:var(--space-2xs);padding:10px var(--space-xs);background:var(--color-border);border-bottom:1px solid var(--color-border);transition:var(--theme-transition)}.site-preview__dots{display:flex;align-items:center;gap:6px;flex:none}.site-preview__dot{width:12px;height:12px;border-radius:50%;display:block}.site-preview__dot--red{background:#FF5F57}.site-preview__dot--yellow{background:#FEBC2E}.site-preview__dot--green{background:#28C840}.site-preview__addressbar{flex:1 1;display:flex;align-items:center;justify-content:center;height:28px;border-radius:var(--radius-sm);background:var(--color-surface);border:1px solid var(--color-border);padding:0 var(--space-xs);transition:var(--theme-transition)}.site-preview__url{font-size:var(--text-small-size);color:var(--color-text-tertiary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.site-preview__chrome-spacer{flex:none;width:42px}.site-preview__viewport{width:100%;aspect-ratio:1/1;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.site-preview__image{width:100%;height:auto;display:block}.site-preview__fade{position:absolute;bottom:0;left:0;right:0;height:64px;pointer-events:none;background:linear-gradient(to bottom,transparent,var(--color-surface));transition:var(--theme-transition)}