/* Two complete site previews on desktop; one preview and a peek on phones. */
.site-monitor-strip{padding-right:23px}
.site-monitor-slide{flex-basis:calc((100% - 42px)/2)}
.site-monitor-strip:focus-visible{outline:2px solid #ef4260;outline-offset:-3px;border-radius:8px}
.site-showcase-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:2px 23px 0 2px}
.site-showcase-controls .site-showcase-progress{min-width:0;flex:1;padding:0}
.site-showcase-controls .site-showcase-progress i{flex:0 0 55px;background:linear-gradient(90deg,#ef4260 var(--site-progress),rgba(255,255,255,.17) var(--site-progress))}
.site-showcase-controls .site-showcase-progress p{white-space:nowrap}
.site-showcase-buttons{display:flex;gap:8px;flex:0 0 auto}
.site-showcase-buttons button{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(255,255,255,.3);border-radius:50%;background:rgba(255,255,255,.1);color:#fff;font-size:20px;line-height:1;cursor:pointer;transition:background .2s,border-color .2s}
.site-showcase-buttons button:hover:not(:disabled){background:#ef4260;border-color:#ef4260}
.site-showcase-buttons button:focus-visible{outline:3px solid #ef4260;outline-offset:3px}
.site-showcase-buttons button:disabled{opacity:.35;cursor:not-allowed}
@media(max-width:640px){.site-monitor-strip{padding-right:9%}.site-monitor-slide{flex-basis:91%}.site-showcase-controls{padding:0 16px 0 5px}.site-showcase-controls .site-showcase-progress p{display:none}.site-showcase-buttons button{width:40px;height:40px}}
@media(max-width:640px){.about{grid-template-columns:minmax(0,1fr)}.site-showcase{max-width:100%}}
@media(max-width:340px){.about-copy h2{font-size:36px;overflow-wrap:anywhere}}