/* The profile is a single live surface: it travels between the monitor and gallery. */
.preview-x{background:var(--x-bg);--x-bg:#fff;--x-fg:#0f1419;--x-muted:#536471;--x-line:#eff3f4;--x-hover:#0f141908;--x-accent:#00a782;color:var(--x-fg);overflow:hidden}
[data-theme=dark] .preview-x{--x-bg:#0a0a0a;--x-fg:#e7e9ea;--x-muted:#71767b;--x-line:#2f3336;--x-hover:#ffffff07;--x-accent:#00dba9}
.preview-x.x-expanded{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 28px,#000 calc(100% - 60px),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 28px,#000 calc(100% - 60px),transparent 100%)}
.x-preview-stage{position:absolute;left:0;top:0;transform-origin:0 0}
.x-timeline-scroll{width:100%;height:100%;overflow:auto;overscroll-behavior-y:contain;scroll-padding:70px 0 80px;scrollbar-width:thin;scrollbar-color:var(--x-line) transparent;background:var(--x-bg);color:var(--x-fg);font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:20px;border:1px solid var(--x-line);border-top:0;border-bottom:0;outline-offset:-3px}
.x-timeline-scroll *{box-sizing:border-box}
.preview-x img,.preview-x video{position:static;inset:auto;display:block;width:100%;height:auto;object-fit:cover}
.preview-x video{opacity:1}
.x-timeline-scroll a{transition:background .15s,color .15s}
.x-timeline-scroll a:focus-visible,.x-timeline-scroll button:focus-visible{outline:2px solid #1d9bf0;outline-offset:2px}
.x-timeline-scroll svg{display:block;width:20px;height:20px;flex:0 0 20px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.x-topbar{height:54px;display:flex;align-items:center;gap:15px;padding:0 14px 0 8px;position:sticky;top:0;z-index:3;background:color-mix(in srgb,var(--x-bg) 88%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.x-topbar-title{flex:1;min-width:0}
.x-name{display:inline;vertical-align:middle;font-size:20px;line-height:24px;font-weight:700;letter-spacing:-.5px}
.x-topbar-title>.x-name{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.x-verified{display:inline-flex;vertical-align:-2px;align-items:center;justify-content:center;margin-left:3px;width:17px;height:17px;color:#fff;background:#1d9bf0;clip-path:polygon(50% 0,63% 7%,78% 6%,86% 21%,99% 31%,96% 47%,100% 63%,87% 73%,80% 89%,63% 91%,50% 100%,37% 92%,20% 91%,13% 76%,0 66%,4% 49%,0 34%,13% 23%,20% 8%,38% 9%)}
.x-verified svg{width:13px;height:13px;flex-basis:13px;stroke-width:2.4}
.x-post-count{display:block;font-size:13px;line-height:17px;color:var(--x-muted)}
.x-icon-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:34px;height:34px;border-radius:50%;flex:0 0 34px;color:inherit}
.x-icon-button:hover{background:var(--x-hover)}
.x-cover-link{display:block;aspect-ratio:3/1;background:var(--x-line)}
.preview-x .x-banner{width:100%;height:100%;object-fit:cover}
.x-profile-info{padding:0 16px}
.x-profile-toolbar{position:relative;min-height:79px;display:flex;justify-content:flex-end;align-items:flex-start}
.x-profile-avatar{position:absolute;left:0;top:0;transform:translateY(-50%);width:24%;aspect-ratio:1;border-radius:50%;border:4px solid var(--x-bg);overflow:hidden;background:var(--x-bg)}
.preview-x .x-profile-avatar img{width:100%;height:100%;object-fit:cover}
.x-profile-actions{display:flex;gap:8px;align-items:center;padding:12px 0}
.x-round{border:1px solid color-mix(in srgb,var(--x-muted) 80%,transparent)}
.x-follow{padding:8px 18px;border-radius:99px;font-size:14px;font-weight:700;line-height:20px;color:var(--x-bg);background:var(--x-fg)}
.x-follow:hover{opacity:.85}
.x-profile-identity{margin-bottom:14px}
.x-handle{color:var(--x-muted);line-height:20px;margin-top:2px}
.x-bio{font-size:15px;line-height:20px;white-space:pre-wrap;margin-bottom:12px;overflow-wrap:anywhere}
.x-text-link{color:var(--x-accent)}
.x-text-link:hover{text-decoration:underline}
.x-profile-meta{display:flex;flex-wrap:wrap;gap:4px 12px;color:var(--x-muted);font-size:14px;line-height:18px}
.x-profile-meta>span{display:inline-flex;align-items:center;gap:5px;min-width:0;overflow-wrap:anywhere}
.x-profile-meta svg{width:18px;height:18px;flex-basis:18px}
.x-profile-meta .x-joined{flex-basis:100%}
.x-profile-counts{display:flex;gap:20px;padding:14px 0 23px;color:var(--x-muted);font-size:14px}
.x-profile-counts strong{color:var(--x-fg);font-weight:700}
.x-profile-counts a:hover{text-decoration:underline}
.x-tabs{display:flex;height:53px;border-bottom:1px solid var(--x-line)}
.x-profile-tab{position:relative;display:flex;align-items:center;justify-content:center;flex:1;min-width:0;font:inherit;font-weight:500;color:var(--x-muted)}
.x-profile-tab:hover{background:var(--x-hover)}
.x-profile-tab.active{color:var(--x-fg);font-weight:700}
.x-profile-tab.active:after{content:"";position:absolute;bottom:0;left:calc(50% - 29px);width:58px;height:4px;border-radius:4px;background:var(--x-accent)}
.x-post{display:flex;gap:10px;padding:13px 16px 5px;border-bottom:1px solid var(--x-line);transition:background .15s}
.x-post:hover{background:var(--x-hover)}
.x-post-avatar{width:40px;height:40px;flex:0 0 40px;border-radius:50%;overflow:hidden}
.preview-x .x-post-avatar img{width:40px;height:40px;object-fit:cover}
.x-post-body{min-width:0;flex:1}
.x-post-head{display:flex;align-items:center;gap:4px;min-width:0;height:21px;white-space:nowrap;font-size:14px;line-height:20px}
.x-post-author{min-width:0;flex-shrink:1;overflow:hidden;text-overflow:ellipsis}
.x-post-author .x-name{font-size:15px;line-height:20px;letter-spacing:-.3px}
.x-post-author:hover{text-decoration:underline}
.x-post-handle{color:var(--x-muted);overflow:hidden;text-overflow:ellipsis;flex:0 1 auto}
.x-post-date,.x-date-dot{color:var(--x-muted);flex-shrink:0}
.x-post-more{margin-left:auto;color:var(--x-muted);width:24px;height:24px;flex-basis:24px}
.x-post-text{font-size:15px;line-height:20px;white-space:pre-wrap;overflow-wrap:anywhere;padding:3px 0 12px}
.x-post-media{display:grid;grid-template-columns:1fr;gap:2px;border:1px solid var(--x-line);border-radius:16px;overflow:hidden;background:var(--x-bg)}
.x-media-link{display:block;min-width:0;overflow:hidden}
.preview-x .x-media-link img{width:100%;height:auto;max-height:700px;object-fit:contain}
.x-media-2,.x-media-3,.x-media-4{grid-template-columns:repeat(2,minmax(0,1fr));aspect-ratio:1.45}
.x-media-3 .x-media-link:first-child{grid-row:span 2}
.preview-x .x-media-2 img,.preview-x .x-media-3 img,.preview-x .x-media-4 img{height:100%;object-fit:cover}
.x-post-stats{display:flex;align-items:center;justify-content:space-between;gap:3px;padding-top:4px;color:var(--x-muted);font-size:12px;line-height:16px;font-variant-numeric:tabular-nums}
.x-post-stats .x-icon-button{white-space:nowrap;width:auto;flex:0 1 auto;min-width:26px;border-radius:18px;height:34px}
.x-post-stats svg{width:18px;height:18px;flex-basis:18px}
.x-stat:hover{color:#1d9bf0;background:#1d9bf013}.x-stat-reposts:hover{color:#00ba7c;background:#00ba7c13}.x-stat-likes:hover{color:#f91880;background:#f9188013}
.x-feed-end{text-align:center;padding:30px 15px 80px;color:var(--x-muted);font-size:13px;line-height:20px}
.x-feed-end>a{display:block;font-weight:700;font-size:15px;margin-bottom:8px}
.x-quote{display:block;margin-top:12px;border:1px solid var(--x-line);border-radius:16px;overflow:hidden}
.x-quote-head{display:flex;gap:5px;align-items:center;padding:12px 12px 0;min-width:0}
.x-quote-head .x-name{font-size:14px;line-height:20px;letter-spacing:-.3px}
.preview-x .x-quote-head img{width:20px;height:20px;border-radius:50%;flex:0 0 20px}
.x-quote-text{white-space:pre-wrap;font-size:15px;line-height:20px;padding:6px 12px 12px}
.preview-x .x-quote-image{max-height:440px;object-fit:cover;object-position:top}
dialog.x-project #gallery{width:600px;padding-top:clamp(36px,12.5vh,120px);padding-bottom:40px}
.x-project .hero-host{aspect-ratio:auto;height:calc(100dvh - clamp(36px,12.5vh,120px) - 36px);min-height:640px;max-height:980px}
.x-project .hero-host>.preview{border-radius:0;box-shadow:none}
.shared-media:has(.preview-x){border-radius:0;box-shadow:none}
#previews>.preview-x{pointer-events:none}
@media(max-width:1023px){dialog.x-project #gallery{max-width:600px;width:100%;padding:0 0 30px;margin:auto}.x-project .gallery-nav{padding:48px 48px 35px}.x-project .hero-host{height:78dvh;min-height:620px;max-height:850px}}
@media(max-width:599px){.x-project{padding:0 10px}.x-project .gallery-nav h2{font-size:23px}.x-topbar{gap:8px;padding-left:5px;padding-right:8px}.x-topbar-title>.x-name{font-size:17px;line-height:22px}.x-profile-toolbar{min-height:68px}.x-profile-info{padding:0 12px}.x-profile-meta{font-size:13px;gap:4px 9px}.x-profile-meta>span:nth-child(2){max-width:100%}.x-profile-counts{padding-bottom:15px}.x-post{padding:12px 10px 5px;gap:8px}.x-post-avatar,.preview-x .x-post-avatar img{width:34px;height:34px;flex-basis:34px}.x-post-handle{display:none}.x-post-author .x-name{font-size:14px}.x-post-date{font-size:12px}.x-post-stats{font-size:11px}.x-post-stats svg{width:16px;height:16px;flex-basis:16px}.x-stat{gap:3px}.x-name{font-size:19px}.x-post-stats .x-icon-button{min-width:21px}.x-preview-stage .x-verified{width:15px;height:15px}}
