.strip{--gutter:1.5rem;--frame-h:clamp(24rem,66vh,42rem);--bar-h:2.75rem;--bezel:.625rem;--ease-out-expo:cubic-bezier(.16,1,.3,1)}@media (min-width:768px){.strip{--gutter:max(3rem,calc((100vw - 1400px)/2 + 3rem))}}.strip-head{padding-inline:var(--gutter);justify-content:space-between;align-items:center;margin-bottom:1.25rem;display:flex}.strip-count{letter-spacing:.15em;color:#9ca3af;font-variant-numeric:tabular-nums;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8125rem}.strip-arrow{color:#fff;width:3rem;height:3rem;transition:background-color .2s,color .2s,transform .3s var(--ease-out-expo),opacity .2s;background:#000;border-radius:999px;place-items:center;display:grid}.strip-arrow svg{width:1.375rem;height:1.375rem}.strip-arrow:hover:not(:disabled){color:#000;background:#fff;box-shadow:0 0 0 1px #000}.strip-arrow:active:not(:disabled){transform:scale(.94)}.strip-arrow:disabled{opacity:.25;cursor:not-allowed}.strip-track{overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);padding:.5rem var(--gutter)1.75rem;scrollbar-width:thin;scrollbar-color:#9ca3af #e5e7eb;gap:clamp(1rem,2vw,2rem);display:flex;overflow-x:auto}.strip-track:focus-visible{outline-offset:-3px;outline:2px solid #000}.strip-slide{scroll-snap-align:start;flex:none;width:min(60rem,86vw)}.strip-slide.is-phone{width:min(calc((var(--frame-h) - 2*var(--bezel))*.4615 + 2*var(--bezel)),72vw)}.device-browser,.device-phone{transition:transform .6s var(--ease-out-expo),box-shadow .6s var(--ease-out-expo);background:#0a0a0a;position:relative;overflow:hidden;box-shadow:0 0 0 1px #00000014,0 40px 80px -40px #0000008c}.device-browser{border-radius:1rem}.device-phone{padding:var(--bezel);border-radius:2.5rem}@media (hover:hover){.strip-slide:hover .device-browser,.strip-slide:hover .device-phone{transform:translateY(-6px);box-shadow:0 0 0 1px #00000014,0 56px 100px -40px #0009}}.browser-bar{height:var(--bar-h);background:#1a1a1a;border-bottom:1px solid #2c2c2f;align-items:center;gap:1rem;padding:0 1rem;display:flex}.browser-dots{gap:.4rem;display:flex}.browser-dots span{background:#3b3b3e;border-radius:999px;width:.7rem;height:.7rem}.browser-dots span:first-child{background:#fff}.browser-url{color:#9ca3af;text-align:center;text-overflow:ellipsis;white-space:nowrap;background:#0a0a0a;border-radius:999px;flex:1;max-width:28rem;margin-inline:auto;padding:.3rem .875rem;font-size:.8125rem;overflow:hidden}.phone-notch{z-index:2;background:#0a0a0a;border-radius:999px;width:5.5rem;height:1.375rem;margin-left:-2.75rem;position:absolute;top:1.125rem;left:50%}.device-screen{height:calc(var(--frame-h) - var(--bar-h));overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#9ca3af #242426;background:#f5f5f5;overflow-y:auto}.device-screen.is-video{background:#000;overflow:hidden}.device-phone .device-screen{height:calc(var(--frame-h) - 2*var(--bezel));scrollbar-width:none;border-radius:2rem}.device-phone .device-screen::-webkit-scrollbar{display:none}.device-screen:focus-visible{outline-offset:-3px;outline:3px solid #fff}.device-expand{z-index:3;color:#000;letter-spacing:.15em;text-transform:uppercase;min-height:2.75rem;transition:transform .3s var(--ease-out-expo),background-color .2s,color .2s;background:#fff;border-radius:999px;align-items:center;gap:.5rem;padding:0 1rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.6875rem;display:inline-flex;position:absolute;bottom:1rem;right:1rem;box-shadow:0 10px 24px -10px #0009}.device-expand svg{width:1rem;height:1rem}.device-expand:hover{color:#fff;background:#000;transform:scale(1.05)}.device-expand:active{transform:scale(.96)}.device-browser:has(.is-video) .device-expand{top:3.75rem;bottom:auto}.device-phone .device-expand{justify-content:center;width:2.75rem;padding:0;bottom:1.375rem;right:1.375rem}.device-phone .hide-xs{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}@media (max-width:480px){.hide-xs{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.device-expand{justify-content:center;width:2.75rem;padding:0}}.strip-caption{color:#000;align-items:center;gap:.5rem;margin-top:1rem;font-size:.9375rem;font-weight:300;display:flex}.strip-caption svg{color:#9ca3af;flex-shrink:0;width:1rem;height:1rem}html:has(dialog.viewer[open]){overflow:hidden}.viewer{color:#fff;background:#0a0a0a;border:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:0;overflow:hidden}.viewer::backdrop{background:#0a0a0ae6}.viewer[open]{grid-template-rows:auto 1fr auto;animation:.35s cubic-bezier(.16,1,.3,1) viewer-in;display:grid}@keyframes viewer-in{0%{opacity:0;transform:scale(.98)}}.viewer-bar{z-index:3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1a1a1adb;border-bottom:1px solid #2c2c2f;align-items:center;gap:1rem;padding:.625rem .75rem .625rem 1.25rem;display:flex;position:relative}.viewer-count{letter-spacing:.1em;color:#fff;white-space:nowrap;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8125rem}.viewer-title{text-overflow:ellipsis;white-space:nowrap;color:#9ca3af;flex:1;min-width:0;font-weight:300;overflow:hidden}.viewer-tools{align-items:center;gap:.25rem;display:flex}.viewer-btn{color:#fff;border-radius:.75rem;place-items:center;width:2.75rem;height:2.75rem;transition:background-color .15s,transform .12s ease-out;display:grid}.viewer-btn svg{width:1.25rem;height:1.25rem}.viewer-btn:hover{background:#2a2a2d}.viewer-btn:active{transform:scale(.94)}.viewer-btn.close{color:#000;background:#fff;border-radius:999px;margin-left:.25rem}.viewer-zoom{text-align:center;font-variant-numeric:tabular-nums;min-width:3.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8125rem}@media (max-width:640px){.viewer-title,.hide-sm{display:none}}.viewer-stage{touch-action:none;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.viewer-stage.is-image{cursor:grab}.viewer-stage.is-image:active{cursor:grabbing}.viewer-img{transform-origin:0 0;will-change:transform;opacity:0;max-width:none;height:auto;transition:opacity .3s;position:absolute;top:0;left:0;box-shadow:0 30px 80px -30px #000c}.viewer-img.is-loaded{opacity:1}.viewer-video{-o-object-fit:contain;object-fit:contain;background:#000;width:100%;height:100%;position:absolute;inset:0}.viewer-spinner{border:3px solid #3b3b3e;border-top-color:#fff;border-radius:999px;width:2.5rem;height:2.5rem;margin:-1.25rem 0 0 -1.25rem;animation:.8s linear infinite viewer-spin;position:absolute;top:50%;left:50%}@keyframes viewer-spin{to{transform:rotate(360deg)}}.viewer-nav{z-index:3;color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#1a1a1ad1;border-radius:999px;place-items:center;width:3.25rem;height:3.25rem;margin-top:-1.625rem;transition:background-color .15s,color .15s,transform .3s cubic-bezier(.16,1,.3,1);display:grid;position:absolute;top:50%;box-shadow:0 0 0 1px #3b3b3e}.viewer-nav svg{width:1.5rem;height:1.5rem}.viewer-nav:hover{color:#000;background:#fff}.viewer-nav.prev{left:1rem}.viewer-nav.next{right:1rem}.viewer-nav.prev:hover{transform:translate(-3px)}.viewer-nav.next:hover{transform:translate(3px)}.viewer-hint{color:#9ca3af;text-align:center;background:#1a1a1adb;border-top:1px solid #2c2c2f;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1rem;font-size:.75rem;display:flex}.viewer-hint svg{flex-shrink:0;width:.9rem;height:.9rem}