:root{--bg:#101010;--ink:#f2f2ef;--muted:#777}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:"DM Sans",Arial,sans-serif}.works-header{position:fixed;z-index:30;left:0;right:0;top:0;padding:50px 6vw 0;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}.works-header a{pointer-events:auto;color:inherit;text-decoration:none}.works-brand{display:flex;flex-direction:column}.works-brand strong{font-size:1.05rem;letter-spacing:.16em}.works-brand span{margin-top:5px;color:var(--muted);font-size:.48rem;letter-spacing:.12em}.close-link{display:flex;align-items:center;gap:12px;font-size:.67rem}.close-link i{position:relative;width:18px;height:18px}.close-link i::before,.close-link i::after{content:"";position:absolute;left:8px;top:0;width:1px;height:19px;background:#fff}.close-link i::before{transform:rotate(45deg)}.close-link i::after{transform:rotate(-45deg)}.works-space{position:relative;width:100vw;height:100vh;overflow:hidden;cursor:none}.works-orbit{position:absolute;left:50%;top:52%;width:min(56vw,900px);aspect-ratio:1;border:1px solid rgba(255,255,255,.025);border-radius:50%;transform:translate(-50%,-50%)}.work{position:absolute;display:block;width:clamp(116px,10vw,182px);aspect-ratio:1;border-radius:50%;overflow:visible;text-decoration:none;transition:transform .45s cubic-bezier(.16,.75,.25,1),filter .3s ease,opacity .3s ease}.work img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%;filter:grayscale(1) brightness(.48);border:1px solid rgba(255,255,255,.11);transition:filter .3s ease,transform .4s cubic-bezier(.16,.75,.25,1),border-color .3s ease}.work span{position:absolute;left:50%;bottom:-20px;color:#555;font-size:.45rem;transform:translateX(-50%)}.work:hover img{filter:grayscale(1) brightness(.9);transform:scale(1.08);border-color:rgba(255,255,255,.35)}.work-0{left:50%;top:12%;transform:translateX(-50%)}.work-1{right:25%;top:35%;transform:none}.work-2{right:34%;bottom:13%;transform:none}.work-3{left:34%;bottom:13%;transform:none}.work-4{left:25%;top:35%;transform:none}.works-cursor{position:fixed;z-index:100;left:0;top:0;width:42px;height:42px;border:1px solid rgba(255,255,255,.48);border-radius:50%;display:grid;place-items:center;pointer-events:none;transform:translate(-50%,-50%);transition:width .18s ease,height .18s ease,background .18s ease,color .18s ease}.works-cursor span{font-size:.4rem;letter-spacing:.08em}.works-space.is-hovering .works-cursor{width:72px;height:72px;background:#f2f0ea;color:#111}
.work{--base-x:0px;--base-y:0px;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;margin:0!important;will-change:transform;transform:translate(calc(-50% + var(--base-x)),calc(-50% + var(--base-y)))!important}.work img{will-change:transform}.works-orbit{will-change:transform;animation:worksRingBreath 12s ease-in-out infinite}@keyframes worksRingBreath{0%,100%{opacity:.55;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.018)}}@media (prefers-reduced-motion:reduce){.works-orbit{animation:none}}

@media (max-width: 700px) {
  .works-header {
    padding: 22px 20px 0;
  }

  .works-space {
    cursor: auto;
  }

  .works-cursor {
    display: none;
  }

  .works-orbit {
    width: 92vw;
  }

  .work {
    width: 112px;
  }

  .work-0 {
    left: 50%;
    top: 16%;
  }

  .work-1 {
    right: 5%;
    top: 38%;
  }

  .work-2 {
    right: 18%;
    bottom: 16%;
  }

  .work-3 {
    left: 18%;
    bottom: 16%;
  }

  .work-4 {
    left: 5%;
    top: 38%;
  }
}